import{a as f}from"./iframe-BaLO-W8Q.js";import"./preload-helper-PPVm8Dsz.js";function g(){return`<form action="#" class="form-grey inail-form" id="form-base" name="Form 1" aria-labelledby="form_01">
	<div class="inail-form-title" id="form_01">Titolo Form</div>
		<div class="row">
			<div class="col-md-12 inail-form-info-message">
        		I campi contrassegnati con l'asterisco (*) sono obbligatori.
      		</div>
		</div>
		<div class="row">
		

			<div class="col-xs-12 col-sm-6 col-md-4 col-lg-4">
				<label class="control-label inail-label" for="input-1-1">Input 1</label>
                <input type="text" class="form-control inail-input " id="input-1-1"  value="">
                <div class="inail-div-message"></div>
			</div>
     			<div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">
				<label class="control-label inail-label" for="input-1-2">Input 2</label>
				<input type="text" class="form-control inail-input " id="input-1-2"  value=""  aria-required="true" required>
        <div class="inail-div-message"></div>
			</div>

			<div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">
				<label class="control-label inail-label" for="input-1-3">Input 3</label>
                <input type="text" class="form-control inail-input " id="input-1-3"  value="">
                <div class="inail-div-message"></div>
			</div>

			<div class="col-lg-4 col-md-4 col-sm-6 col-xs-12 inail-select-wrapper">
				<label for="select-1-1" class="inail-label label-select noPaddingLeft">Select 1 </label>
				<select class="form-control inail-input" id="select-1-1">
					<option value="">- seleziona opzione -</option>
					<option value="">Opzione 1</option>
					<option value="">Opzione 2</option>
					<option value="">Opzione 3</option>
				</select>
        <div class="inail-div-message"></div>
			</div>
			<div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">
				<label class="control-label inail-label" for="input-1-4">Input 4</label>
				    <input type="text" class="form-control inail-input " id="input-1-4"  value="">
            <div class="inail-div-message"></div>

			</div>
			<div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">
				<label class="control-label inail-label" for="input-1-5">Input 5</label>
				    <input type="text" class="form-control inail-input " id="input-1-5"  value="">
            <div class="inail-div-message"></div>

			</div>
		</div>
		<div class="row">
			<div class="col-xs-12 col-sm-12 col-md-8 col-lg-8 p-0 ">
         <fieldset>
            <legend class="inail-date-range-title">Periodo</legend>
           <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 p-0" aria-labelledby="periodo-label" role="group">
             <div class="col-sm-6 col-md-6 col-lg-6">
               <div class="date datePicker form-group">
                 <div class="input-relative">
                   <label class="control-label inail-label" for="dateFrom">Dal</label>
                   <input id="dateFrom" class="form-control inail-input " title="GG/MM/AAAA" placeholder="gg / mm / aaaa" type="text" data-datepicker-aria>
                 </div>
                 <div class="inail-div-message" id="error-dateFrom">

                 </div>
               </div>
             </div>
             <div class="col-sm-6 col-md-6 col-lg-6">
               <div class="date datePicker form-group">
                 <div class="input-relative">
                   <label class="control-label inail-label" for="dateTo">Al</label>
                   <input id="dateTo" class="form-control inail-input " title="GG/MM/AAAA" placeholder="gg / mm / aaaa" type="text" data-datepicker-aria>
                 </div>
                 <div class="inail-div-message" id="error-dateTo">

                 </div>
               </div>
             </div>
           </div>
         </div>
          </fieldset>
       </div>
		</div>
		<div class="row">

		  <div class="col-12  d-flex justify-content-end  marginTop inail-button-wrapper">
            <div class="inail-button-container">
			<button type="button" class="inail-button inail-button-secondary" id="indietroButton">Indietro</button>
			<button type="button" class="inail-button inail-button-primary" id="confermaButton">Conferma</button>
			</div>
			</div>
		</div>
</form>`}function x(){return`<form action="#" class="form-grey inail-form" id="form-base-disabled" name="Form 1" aria-labelledby="form_02">
	<div class="inail-form-title" id="form_02">Titolo Form</div>
		<div class="row">
			<div class="col-md-12 inail-form-info-message">
        		I campi contrassegnati con l'asterisco (*) sono obbligatori.
      		</div>
		</div>
		
			 <div class="col-xs-12 col-sm-6 col-md-4 col-lg-4">
    <label class="control-label inail-label" for="form-input-1-disabled">Input 1</label>
    <input type="text" class="form-control disabled inail-input" id="form-input-1-disabled"  disabled="">
    <div class="inail-div-message"></div>
  				</div>
     		 <div class="col-xs-12 col-sm-6 col-md-4 col-lg-4">
    <label class="control-label inail-label" for="form-input-2-disabled">Input 2</label>
    <input type="text" class="form-control disabled inail-input" id="form-input-2-disabled"  disabled="">
    <div class="inail-div-message"></div>
  </div>
			 <div class="col-xs-12 col-sm-6 col-md-4 col-lg-4">
    <label class="control-label inail-label" for="form-input-3-disabled">Input 3</label>
    <input type="text" class="form-control disabled inail-input" id="form-input-3-disabled"  disabled="">
    <div class="inail-div-message"></div>
  </div>
		
		
			<div class="col-xs-12 col-sm-6 col-md-4 col-lg-4 inail-select-wrapper">
				<label for="select-1-1" class="inail-label label-select noPaddingLeft">Select 1 </label>
				<select class="form-control inail-input" id="select-1-1"  disabled="" >
					<option value="" aria-label="Select">- seleziona opzione -</option>
					<option value="" aria-label="Opzione 2">Opzione 1</option>
					<option value="" aria-label="Opzione 3">Opzione 2</option>
					<option value="" aria-label="Opzione 1">Opzione 3</option>
				</select>
        <div class="inail-div-message"></div>
			</div>
		 <div class="col-xs-12 col-sm-6 col-md-4 col-lg-4">
    <label class="control-label inail-label" for="form-input-4-disabled">Input 4</label>
    <input type="text" class="form-control disabled inail-input" id="form-input-4-disabled"  disabled="">
    <div class="inail-div-message"></div>
  </div>
			 <div class="col-xs-12 col-sm-6 col-md-4 col-lg-4">
    <label class="control-label inail-label" for="form-input-5-disabled">Input 5</label>
    <input type="text" class="form-control disabled inail-input" id="form-input-5-disabled"  disabled="">
    <div class="inail-div-message"></div>
  </div>
		</div>
		<div class="row">
			<div class="col-xs-12 col-sm-12 col-md-8 col-lg-8 p-0 ">
         <fieldset>
            <legend class="inail-date-range-title">Periodo</legend>
           <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 p-0" aria-labelledby="periodo-label" role="group">
             <div class="col-sm-6 col-md-6 col-lg-6">
               <div class="date datePicker form-group">
                 <div class="input-relative">
                   <label class="control-label inail-label" for="dateFrom">Dal</label>
                   <input id="dateFrom" class="form-control inail-input " title="GG/MM/AAAA" placeholder="gg / mm / aaaa" type="text" data-datepicker-aria disabled>
                 </div>
                 <div class="inail-div-message" id="error-dateFrom">

                 </div>
               </div>
             </div>
             <div class="col-sm-6 col-md-6 col-lg-6">
               <div class="date datePicker form-group">
                 <div class="input-relative">
                   <label class="control-label inail-label" for="dateTo">Al</label>
                   <input id="dateTo" class="form-control inail-input " title="GG/MM/AAAA" placeholder="gg / mm / aaaa" type="text" data-datepicker-aria disabled>
                 </div>
                 <div class="inail-div-message" id="error-dateTo">

                 </div>
               </div>
             </div>
           </div>
         </div>
          </fieldset>
       </div>
		</div>
		<div class="row">
		  <div class="col-12  d-flex justify-content-end  marginTop inail-button-wrapper">
            <div class="inail-button-container">
			<button type="button" class="inail-button inail-button-secondary" disabled>Indietro</button>
			<button type="button" class="inail-button inail-button-primary" disabled>Conferma</button>
			</div>
			</div>
		</div>
</form>`}function y(){return`<form action="#" class="form-grey inail-form" id="form-collassabile" name="Form 1" aria-labelledby="form_03">
				<div class="inail-form-title" id="form_03">Titolo Form</div>
				<div class="row">

					<div class="row">
						<div class="col-md-12 inail-form-info-message">
							I campi contrassegnati con l'asterisco (*) sono obbligatori.
						</div>
					</div>

					<div class="row">
						<div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">
							<label class="control-label inail-label" id="label-number" for="form-input-1">Nome</label>
							<input type="text" class="form-control inail-input " id="form-input-1" value="">
              <div class="inail-div-message"></div>
						</div>

						<div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">
						 <label class="control-label inail-label" for="form-input-2">Cognome</label>
						 <input type="text" class="form-control inail-input" id="form-input-2" value="">
             <div class="inail-div-message"></div>
						</div>

						<div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">
							<label class="control-label inail-label" id="label-number-info" for="form-input-info">Email</label>
							<span role="button" aria-labelledby="label-number-info"  tabindex="0" class="fa fa-question-circle fa-lg" data-toggle="popover" data-trigger="focus" data-content="Inserire un suggerimento o una descrizione relativa a questo campo.">
							</span>
							<input type="text" class="form-control inail-input " id="form-input-info" value="" aria-labelledby="label-number-info">
              <div class="inail-div-message">
              							<span id="error-message" class="inail-span-error" style="display: none;">
							<i class="fa-solid fa-circle-exclamation"></i> Messaggio d'errore
							</span>
              </div>

						</div>
					

				   
						<div class="col-lg-4 col-md-4 col-sm-6 col-xs-12 inail-select-wrapper">
							<label for="select-1-1" class="inail-label label-select noPaddingLeft">Nazione</label>
							<select class="form-control inail-input" id="select-1-1">
								<option value="">- seleziona opzione -</option>
								<option value="">Opzione 1</option>
								<option value="">Opzione 2</option>
								<option value="">Opzione 3</option>
							</select>
              <div class="inail-div-message"></div>
						</div>

						<div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">
							<label class="control-label inail-label" id="label-number" for="form-input-3">Luogo di Nascita</label>
							<input type="text" class="form-control inail-input " id="form-input-3" value="">
              <div class="inail-div-message"></div>
						</div>

						


            					<div class="date datePicker col-md-4 col-lg-4 col-sm-6 col-xs-12">
						<div class="input-relative">
							<label class="control-label inail-label" for="form-data-2">Data di nascita</label>
							<input id="form-data-2" class="form-control inail-input" title="GG/MM/AAAA" placeholder="gg / mm / aaaa" type="text" data-datepicker-aria>
						</div>
            <div class="inail-div-message"></div>
					</div>
			</div>
					</div>
						<div class ="row">
								<div class="col-xs-12">
									<div class="mb-2">
										<button type="button" data-target="#form-option-panel" data-toggle="collapse" aria-expanded="false" class="p-0 float-none mb-1 button-option inail-tertiary-button ml-0" id="showMore">
										 <span class="m-0 fa fa-minus fa-lg minus" aria-hidden="true"></span>
                          <span class="m-0 fa fa-plus fa-lg plus" aria-hidden="true"></span>
                          <strong class="inail-button-show-more" id="textShowMore">Altre opzioni</strong>
												</button>
									</div>
								</div>
							</div>
							<div class="row  collapse" id ="form-option-panel" role="region">

							<div class="row">
							<div class="col-lg-4 col-sm-6 col-xs-12 inail-select-wrapper">
								<label for="select-1-2" class="inail-label label-select noPaddingLeft">Nazione</label>
								<select class="form-control inail-input" id="select-1-2">
									<option value="">- seleziona opzione -</option>
									<option value="">Opzione 1</option>
									<option value="">Opzione 2</option>
									<option value="">Opzione 3</option>
								</select>
                <div class="inail-div-message"></div>
				      </div>
					    <div class="col-lg-4 col-sm-6 col-xs-12">
					      <label class="control-label inail-label" id="label-number" for="form-input-4">Numero di Telefono</label>
					      <input type="text" class="form-control inail-input " id="form-input-4" placeholder="Inserisci Numero" value="">
                <div class="inail-div-message"></div>
					    </div>

					<div class ="row">

            <div class="col-xs-12 col-sm-8 col-md-6 col-lg-6  custom-checkbox-container inail-checkbox">
							<input type="checkbox" id="check-1" class="custom-checkbox option-checkbox">
							<label for="check-1">
							<span class="custom-checkbox-background">
								<i class="fa inail-checkbox-icon"></i>
							</span>
							<span>Residente in Italia</span>
							</label>
              <div class="inail-div-message"></div>
					  </div>

          </div>
</div>
</div>

<div class="row">
		  <div class="col-12  d-flex justify-content-end  marginTop inail-button-wrapper">
            <div class="inail-button-container">
			<button type="button" class="inail-button inail-button-secondary" id="indietroButton">Indietro</button>
			<button type="button" class="inail-button inail-button-primary" id="confermaButton">Conferma</button>
			</div>
			</div>
		</div>
</form>`}function C(){return`
	<div class="row accordion-gray inail-accordion-container">
    <div class="row head-accordion-gray" data-toggle="collapse">
        <div class="accordion-title">
            <button type="button" data-toggle="collapse"
                data-target="#area-collaborazione-panel-modale" aria-expanded="false">
                <div class="inail-form-accordion-title" id="form_04">Titolo form accordion</div>
                <span class="fa fa-solid fa-chevron-down fa-lg"></span>
            </button>
        </div>
	</div>
        <div id="area-collaborazione-panel-modale" class="row collapse panel-body" role="region">
            <form action="#" class="row form-grey" aria-labelledby="form_04">
                <fieldset>
                <legend class="inail-legend-title mb-3">Sezione 1</legend>
                    
                        <div class="col-lg-4 col-sm-6 col-xs-12">
                            <label class="control-label inail-label" id="label-input" for="form-input-1">Input 1</label>
                            <input type="text" class="form-control inail-input " id="form-input-1"
                                 value="">
                                <div class="inail-div-message"></div>
                        </div>
                        <div class="col-lg-4 col-sm-6 col-xs-12">
                            <label class="inail-label" for="form-select-1">Select 1</label>
                            <select class="form-control inail-input form-select" id="form-select-1">
                                <option value="..." aria-label="seleziona opzione">Seleziona opzione</option>
                                <option value="Opzione 1" aria-label="Opzione 1">Opzione 1</option>
                                <option value="Opzione 2" aria-label="Opzione 2">Opzione 2</option>
                                <option value="Opzione 3" aria-label="Opzione 3">Opzione 3</option>
                            </select>
                            <div class="inail-div-message"></div>
                        </div>
                        <div class="col-lg-4 col-sm-6 col-xs-12">
                            <label class="control-label inail-label" id="label-input" for="form-input-2">Input 2</label>
                            <input type="text" class="form-control inail-input " id="form-input-2"
                                 value="">
                                <div class="inail-div-message"></div>
                        </div>
                        <div class="col-lg-4 col-sm-6 col-xs-12">
                            <label class="control-label inail-label" id="label-input" for="form-input-3">Input 3</label>
                            <input type="text" class="form-control inail-input " id="form-input-3"
                                 value="">
                                <div class="inail-div-message"></div>
                        </div>
                        <div class="col-lg-4 col-sm-6 col-xs-12">
                            <label class="control-label inail-label" id="label-input" for="form-input-4">Input 4</label>
                            <input type="text" class="form-control inail-input " id="form-input-4"
                                 value="">
                                <div class="inail-div-message"></div>
                        </div>
                        <div class="col-lg-4 col-sm-6 col-xs-12">
                            <label class="control-label inail-label" id="label-input" for="form-input-5">Input 5</label>
                            <input type="text" class="form-control inail-input " id="form-input-5"
                                 value="">
                                <div class="inail-div-message"></div>
                        </div>
                        <div class="col-lg-4 col-sm-6 col-xs-12">
                            <label class="control-label inail-label" id="label-input-info" for="form-input-info">Input 6</label>
                            <span role="button" aria-labelledby="label-input-info" tabindex="0"
                                class="fa fa-question-circle fa-lg" data-toggle="popover"
                                 data-trigger="focus" 
                                data-content="Inserire un suggerimento o una descrizione relativa a questo campo."></span>
                            <input type="text"
                                class="form-control inail-input" id="form-input-info" 
                                value="" aria-labelledby="label-input-info">
                                <div class="inail-div-message"></div>
                        </div>
                        <div class="col-lg-4 col-sm-6 col-xs-12">
                            <label class="control-label inail-label" id="label-input" for="form-input-7">Input 7</label>
                            <input type="text" class="form-control inail-input " id="form-input-7"
                                 value="">
                                <div class="inail-div-message"></div>
                        </div>
                        <div class="col-lg-4 col-sm-6 col-xs-12">
                            <label class="inail-label" for="form-select-2">Select 2</label>
                            <select class="form-control inail-input form-select" id="form-select-2">
                                <option value="..." aria-label="seleziona opzione">Seleziona opzione</option>
                                <option value="Opzione 1" aria-label="Opzione 1">Opzione 1</option>
                                <option value="Opzione 2" aria-label="Opzione 2">Opzione 2</option>
                                <option value="Opzione 3" aria-label="Opzione 3">Opzione 3</option>
                            </select>
                            <div class="inail-div-message"></div>

                        </div>
                    </fieldset>

                    <fieldset>
                    <legend class="inail-legend-title mb-3">Sezione 2</legend>
                
                <div class="row">
                    <div class="row">
                        <div class="col-lg-4 col-sm-6 col-xs-12">
                            <label class="inail-label" for="form-select-3">Select 3</label>
                            <select class="form-control inail-input form-select" id="form-select-3">
                                <option value="..." aria-label="seleziona opzione">Seleziona opzione</option>
                                <option value="Opzione 1" aria-label="Opzione 1">Opzione 1</option>
                                <option value="Opzione 2" aria-label="Opzione 2">Opzione 2</option>
                                <option value="Opzione 3" aria-label="Opzione 3">Opzione 3</option>
                            </select>
                            <div class="inail-div-message"></div>
                            </label>
                        </div>
                    </div>
                    <div class="row">
                        <div
                            class="col-lg-4 col-sm-6 col-xs-12 custom-checkbox-container inail-checkbox">
                            <input type="checkbox" id="check-1" class="custom-checkbox option-checkbox">
                            <label for="check-1">
                                <span class="custom-checkbox-background">
                                    <i class="fa inail-checkbox-icon"></i>
                                </span>
                                <span>Checkbox 1</span>
                            </label>
                            <div class="inail-div-message"></div>
                        </div>
                    </div>
                    </fieldset>
                <div class="row pull-right">
                    <div>
					    <button class="inail-button inail-button-secondary mr-4" type="button" id="indietroButton">Indietro</button>
                        <button class="inail-button inail-button-primary" type="button" id="confermaButton">Conferma</button>
                    </div>
                </div>
                
            </form>
        </div>
</div>
	`}function w(){return`<form class="row form-grey form-tabellare inail-form" action="#" id="form-tabellare" name="Nome form" method="post"
  onsubmit="this.reset(); return false;" aria-labelledby="form_05">
  <div class="inail-form-title mt-0 ml-0 mr-0" id="form_05">Titolo Form Tabellare</div>
  <div class="container-fluid">
    <!-- Row 1-->
    <div class="row">
      <div class="col-xs-12 col-sm-12 col-md-4 col-lg-4 inail-col-form-tabellare">&nbsp;</div>
      <div class="col-xs-12 col-sm-12 col-md-8 col-lg-8">
        <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 inail-col-form-tabellare text-center"><span class="py-3">Colonna
            1</span></div>
        <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 inail-col-form-tabellare text-center"><span class="py-3">Colonna
            2</span></div>
      </div>
    </div>
    <!-- Row 2 -->
    <div class="row">
      <div class="col-xs-12 col-sm-12 col-md-4 col-lg-4 inail-col-form-tabellare">
        <div id="info">
          Riga numero 1 <span class="fa fa-question-circle fa-lg" data-trigger="focus" data-toggle="popover"
             role="button"
            data-content="Inserire qua un suggerimento od una descrizione relativa a questo campo."
             tabindex="0" aria-labelledby="info"></span>
        </div>
      </div>
      <div class="col-xs-12 col-sm-12 col-md-8 col-lg-8 p-0">
        <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 inail-col-form-tabellare"> 
            <input  type="text" id="Row1Col1" aria-label="Riga 1 Colonna 1" class="inail-input form-control inputNumber">
          </div>
        <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 inail-col-form-tabellare">
            <input  type="text" id="Row1Col2" aria-label="Riga 1 Colonna 2" class="inail-input form-control inputNumber">
          </div>
      </div>
    </div>
    <!--Row 3-->
    <div class="row">
      <div class="col-xs-12 col-sm-12 col-md-4 col-lg-4 inail-col-form-tabellare">
        <div>
          Riga numero 2
        </div>
      </div>
      <div class="col-xs-12 col-sm-12 col-md-8 col-lg-8 p-0">
        <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 inail-col-form-tabellare">
            <input  type="text" id="Row2Col1" aria-label="Riga 2 Colonna 1" class="inail-input form-control inputNumber">
        </div>
        <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 inail-col-form-tabellare">
            <input  type="text" id="Row2Col2" aria-label="Riga 2 Colonna 2" class="inail-input form-control inputNumber">
        </div>
      </div>
    </div>
    <!--Row 4-->
    <div class="row">
      <div class="col-xs-12 col-sm-12 col-md-4 col-lg-4 inail-col-form-tabellare">
        <div id="info_2">
          Riga numero 3 <span class="fa fa-question-circle fa-lg" data-trigger="focus" data-toggle="popover"
             role="button"
            data-content="Inserire qua un suggerimento od una descrizione relativa a questo campo."
             tabindex="0"  aria-labelledby="info_2"></span>
        </div>
      </div>
      <div class="col-xs-12 col-sm-12 col-md-8 col-lg-8 p-0">
        <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 inail-col-form-tabellare">
            <input  type="text" id="Row3Col1" aria-label="Riga 3 Colonna 1" class="inail-input form-control inputNumber">
        </div>
        <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 inail-col-form-tabellare">
            <input  type="text" id="Row3Col2" aria-label="Riga 3 Colonna 2" class="inail-input form-control inputNumber">
        </div>
      </div>
    </div>
    <!--Row 5-->
    <div class="row">
      <div class="col-xs-12 col-sm-12 col-md-4 col-lg-4 inail-col-form-tabellare">
        <div>
          Riga numero 4
        </div>
      </div>
      <div class="col-xs-12 col-sm-12 col-md-8 col-lg-8 p-0">
        <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 inail-col-form-tabellare">
            <input  type="text" id="Row1Col4" aria-label="Riga 4 Colonna 1" class="inail-input form-control inputNumber">
        </div>
        <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 inail-col-form-tabellare">
            <input  type="text" id="Row4Col2" aria-label="Riga 4 Colonna 2" class="inail-input form-control inputNumber">
        </div>
      </div>
    </div>
    <!--Row 6-->
    <div class="row">
      <div class="col-xs-12 col-sm-12 col-md-4 col-lg-4 inail-col-form-tabellare">
        <div>
          Riga numero 5
        </div>
      </div>
      <div class="col-xs-12 col-sm-12 col-md-8 col-lg-8 p-0">
        <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 inail-col-form-tabellare">
            <input  type="text" id="Row5Col1" aria-label="Riga 5 Colonna 1" class="inail-input form-control inputNumber">
        </div>
        <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 inail-col-form-tabellare">
            <input  type="text" id="Row5Col2" aria-label="Riga 5 Colonna 2" class="inail-input form-control inputNumber">
        </div>
      </div>
    </div>
    <!--Row 7-->
    <div class="row">
      <div class="col-xs-12 col-sm-12 col-md-4 col-lg-4 inail-col-form-tabellare">
        <div>
          Riga numero 6
        </div>
      </div>
      <div class="col-xs-12 col-sm-12 col-md-8 col-lg-8 p-0">
        <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 inail-col-form-tabellare">
            <input  type="text" id="Row6Col1" aria-label="Riga 6 Colonna 1" class="inail-input form-control inputNumber">
        </div>
        <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 inail-col-form-tabellare">
            <input  type="text" id="Row6Col2" aria-label="Riga 6 Colonna 2" class="inail-input form-control inputNumber">
        </div>
      </div>
    </div>
    <!--Row 8-->
    <div class="row">
      <div class="col-xs-12 col-sm-12 col-md-4 col-lg-4 inail-col-form-tabellare">
        <div>
          Riga numero 7
        </div>
      </div>
      <div class="col-xs-12 col-sm-12 col-md-8 col-lg-8 p-0">
        <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 inail-col-form-tabellare">
            <input  type="text" id="Row7Col1" aria-label="Riga 7 Colonna 1" class="inail-input form-control inputNumber">
        </div>
        <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 inail-col-form-tabellare">
            <input  type="text" id="Row7Col2" aria-label="Riga 7 Colonna 2" class="inail-input form-control inputNumber">
        </div>
      </div>
    </div>
    <div class="row">
      <div class="col-lg-12 col-md-12">
        <div class="pull-right pt-4">
          <button type="submit" class="inail-button inail-button-secondary" id="annullaButton">
            Annulla 
          </button>
          <button type="submit" class="inail-button inail-button-primary ml-4" id="destroButton">Bottone
            destro</button>
        </div>
      </div>
    </div>
  </div>
</form>`}function h(){return`<form class="row form form-tabellare form-grey inail-form" action="#" id="form-2-tabellare" name="Nome form"
  method="post" onsubmit="this.reset(); return false;" aria-labelledby="form_06">
  <div class="inail-form-title mt-0 ml-0 mr-0" id="form_06">Titolo Form Tabellare</div>
  <div class="container-fluid">
    <!-- Row 1-->
    <div class="row">
      <div class="col-xs-12 col-sm-12 col-md-4 col-lg-4 ">&nbsp;</div>
      <div class="col-xs-12 col-sm-12 col-md-8 col-lg-8 px-0">
        <div class="col-xs-4 col-sm-4 col-md-4 col-lg-4 px-0    inail-b-right-grey">
          <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 text-center inail-b-bottom  py-2">
            Colonna 1
          </div>
          <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 inail-b-left inail-b-right text-center py-2">
            Colonna A</div>
          <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 text-center py-2  ">Colonna B</div>
        </div>
        <div class="col-xs-4 col-sm-4 col-md-4 col-lg-4 px-0  inail-b-right-grey">
          <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 inail-b-bottom  text-center py-2">
            Colonna 2
          </div>
          <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 text-center py-2  inail-b-right">
            Colonna A</div>
          <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 text-center py-2 ">Colonna B</div>
        </div>
        <div class="col-xs-4 col-sm-4 col-md-4 col-lg-4 px-0  ">
          <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 inail-b-bottom  text-center py-2">
            Colonna 3
          </div>
          <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 text-center py-2  inail-b-right">
            Colonna A</div>
          <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 text-center py-2">Colonna B</div>
        </div>
      </div>
    </div>
    <!-- Row 2 -->
    <div class="row inail-b-top">
      <div class="col-xs-4 col-sm-4 col-md-4 col-lg-4 inail-b-bottom inail-bg-white inail-col-form-tabellare">
        <div>Riga numero 1</div>
      </div>
      <div class="col-xs-12 col-sm-12 col-md-8 col-lg-8 px-0 ">
        <div class="col-xs-4 col-sm-4 col-md-4 col-lg-4 px-0 inail-b-bottom inail-bg-white inail-b-right-grey">
          <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 inail-b-left inail-b-right inail-col-form-tabellare ">
              <input  type="text" id="Row1Col1a-2" aria-label="Riga 1 Colonna 1 A" class="inail-input form-control inputNumber">
          </div>
          <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 inail-col-form-tabellare  ">
              <input type="text" id="Row1Col1b-2" aria-label="Riga 1 Colonna 1 B" class="inail-input form-control inputNumber">
          </div>
        </div>
        <div class="col-xs-4 col-sm-4 col-md-4 col-lg-4 px-0 inail-b-bottom inail-bg-white  inail-b-right-grey">
          <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 inail-b-right inail-col-form-tabellare">
            
              <input type="text" id="Row1Col2a-2" aria-label="Riga 1 Colonna 2 A" class="inail-input form-control inputNumber">
          </div>
          <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 inail-col-form-tabellare ">
            
              <input type="text" id="Row1Col2b-2" aria-label="Riga 1 Colonna 2 B" class="inail-input form-control inputNumber">
          </div>
        </div>
        <div class="col-xs-4 col-sm-4 col-md-4 col-lg-4 px-0 inail-b-bottom inail-bg-white ">
          <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6  inail-b-right inail-col-form-tabellare ">
            
              <input type="text" id="Row1Col3a-2" aria-label="Riga 1 Colonna 3 A" class="inail-input form-control inputNumber">
          </div>
          <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 inail-col-form-tabellare ">
            
              <input type="text" id="Row1Col3a-2" aria-label="Riga 1 Colonna 3 B" class="inail-input form-control inputNumber">
          </div>
        </div>
      </div>
    </div>
    <!--Row 3-->
    <div class="row ">
      <div class="col-xs-4 col-sm-4 col-md-4 col-lg-4 inail-b-bottom inail-bg-white inail-col-form-tabellare">
        <div>Riga numero 2</div>
      </div>
      <div class="col-xs-12 col-sm-12 col-md-8 col-lg-8 px-0 ">
        <div class="col-xs-4 col-sm-4 col-md-4 col-lg-4 px-0 inail-b-bottom inail-bg-white inail-b-right-grey">
          <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 inail-b-left inail-b-right inail-col-form-tabellare  ">
            
              <input type="text" id="Row2Col1a-2" aria-label="Riga 2 Colonna 1 A" class="inail-input form-control inputNumber">
          </div>
          <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6  inail-col-form-tabellare ">
            
              <input type="text" id="Row2Col1B-2" aria-label="Riga 2 Colonna 1 B" class="inail-input form-control inputNumber">
          </div>
        </div>
        <div class="col-xs-4 col-sm-4 col-md-4 col-lg-4 px-0 inail-b-bottom inail-bg-white  inail-b-right">
          <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 inail-b-right inail-col-form-tabellare  ">
              <input type="text" id="Row2Col2a-2" aria-label="Riga 2 Colonna 2 A" class="inail-input form-control inputNumber">
          </div>
          <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 inail-col-form-tabellare  ">
            
              <input type="text" id="Row2Col2b-2" aria-label="Riga 2 Colonna 2 B" class="inail-input form-control inputNumber">
          </div>
        </div>
        <div class="col-xs-4 col-sm-4 col-md-4 col-lg-4 px-0  ">
          <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6  inail-col-form-tabellare ">
            &nbsp;
          </div>
          <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 inail-col-form-tabellare ">
            &nbsp;
          </div>
        </div>
      </div>
    </div>
    <!--Row 4-->
    <div class="row">
      <div class="col-xs-4 col-sm-4 col-md-4 col-lg-4 inail-b-bottom inail-bg-white inail-col-form-tabellare">
        <div>Riga numero 3</div>
      </div>
      <div class="col-xs-12 col-sm-12 col-md-8 col-lg-8 px-0">
        <div class="col-xs-4 col-sm-4 col-md-4 col-lg-4 px-0 inail-b-bottom inail-bg-white inail-b-right-grey">
          <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6   inail-b-left  inail-b-right inail-col-form-tabellare  ">
              <input type="text" id="Row3Col1a-2" aria-label="Riga 3 Colonna 1 A" class="inail-input form-control inputNumber">
          </div>
          <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 inail-col-form-tabellare ">
              <input type="text" id="Row3Col1a-2" aria-label="Riga 3 Colonna 1 B" class="inail-input form-control inputNumber">
          </div>
        </div>
        <div class="col-xs-4 col-sm-4 col-md-4 col-lg-4 px-0 inail-b-bottom inail-bg-white inail-b-right">
          <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6  inail-b-right inail-col-form-tabellare ">
              <input type="text" id="Row3Col2a-2" aria-label="Riga 3 Colonna 2 A" class="inail-input form-control inputNumber"> 
          </div>
          <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 inail-col-form-tabellare  ">
              <input type="text" id="Row3Col2a-2" aria-label="Riga 3 Colonna 2 B" class="inail-input form-control inputNumber">
          </div>
        </div>

        <div class="col-xs-4 col-sm-4 col-md-4 col-lg-4 px-0  ">
          <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6  inail-background-col inail-col-form-tabellare ">
            &nbsp;
          </div>
          <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 inail-col-form-tabellare ">
            &nbsp;
          </div>
        </div>
      </div>
    </div>
    <div class="row">
      <div class="col-lg-12 col-md-12">
        <div class="pull-right pt-4">
		<button type="submit" class="inail-button inail-button-secondary" id="annullaButton">
            Annulla 
          </button>
          <button type="submit" class="inail-button inail-button-primary ml-4" id="destroButton">Bottone
            destro</button>
        </div>
      </div>
    </div>
  </div>
</form>`}function k(){return`<form class="row form form-tabellare form-grey inail-form" action="#" id="form-3-tabellare" name="Nome form" method="post"
  onsubmit="this.reset(); return false;" aria-labelledby="form_07">
  <div class="inail-form-title mt-0 ml-0 mr-0" id="form_07">Titolo Form Tabellare</div>
  <div class="container-fluid">
    <!-- Row 1-->
    <div class="row">
      <div class="col-xs-12 col-sm-12 col-md-4 col-lg-4 ">&nbsp;</div>
      <div class="col-xs-12 col-sm-12 col-md-8 col-lg-8 px-0">
         <div class="col-xs-4 col-sm-4 col-md-6 col-lg-6 px-0    inail-b-right-grey">
          <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 text-center inail-b-bottom  py-2">
            Colonna 1
          </div>
          <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 inail-b-left inail-b-right text-center py-2">
            Colonna A</div>
          <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 text-center py-2  ">Colonna B</div>
        </div>
         <div class="col-xs-4 col-sm-4 col-md-6 col-lg-6 px-0 ">
          <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 inail-b-bottom  text-center py-2">
            Colonna 2
          </div>
          <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 text-center py-2  inail-b-right">
            Colonna A</div>
          <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 text-center py-2 ">Colonna B</div>
        </div>
      </div>
    </div>
    <!-- Row 2 -->
    <div class="row inail-b-top">
      <div class="col-xs-4 col-sm-4 col-md-4 col-lg-4 inail-b-bottom inail-bg-white inail-col-form-tabellare">
        <div>Riga numero 1</div>
      </div>
      <div class="col-xs-12 col-sm-12 col-md-8 col-lg-8 px-0 ">
         <div class="col-xs-4 col-sm-4 col-md-6 col-lg-6 px-0 inail-b-bottom inail-bg-white inail-b-right-grey">
          <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 inail-b-left inail-b-right inail-col-form-tabellare ">
              <input type="text" value="5" class="inail-input form-control inputNumber" id="Row1Col1a-3" aria-label="Riga 1 Colonna 1 A Campo selezionato">
          </div>
          <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 inail-col-form-tabellare  ">
              <input type="text" value="5" class="inail-input form-control inputNumber" id="Row1Col1b-3" aria-label="Riga 1 Colonna 1 B Campo selezionato">
          </div>
        </div>
         <div class="col-xs-4 col-sm-4 col-md-6 col-lg-6 px-0 inail-b-bottom inail-bg-white">
          <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 inail-b-right inail-col-form-tabellare  ">
              <input type="text" value="7" class="inail-input form-control inputNumber" id="Row1Col2a-3" aria-label="Riga 1 Colonna 2 A Campo selezionato">
          </div>
          <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 inail-col-form-tabellare ">
              <input type="text" id="Row1Col2b-3" aria-label="Riga 1 Colonna 2 B" class="inail-input form-control inputNumber">
          </div>
        </div>
      </div>
    </div>
    <!--Row 3-->
    <div class="row ">
      <div class="col-xs-4 col-sm-4 col-md-4 col-lg-4 inail-b-bottom inail-bg-white inail-col-form-tabellare">
        <div>Riga numero 2</div>
      </div>
      <div class="col-xs-12 col-sm-12 col-md-8 col-lg-8 px-0 ">
         <div class="col-xs-4 col-sm-4 col-md-6 col-lg-6 px-0 inail-b-bottom inail-bg-white inail-b-right-grey">
          <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 inail-b-left inail-b-right inail-col-form-tabellare  ">
              <input type="text" id="Row2Col1a-3" aria-label="Riga 2 Colonna 1 A" class="inail-input form-control inputNumber">
          </div>
          <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6  inail-col-form-tabellare ">
              <input type="text" id="Row2Col1b-3" aria-label="Riga 2 Colonna 1 B" class="inail-input form-control inputNumber">
          </div>
        </div>
         <div class="col-xs-4 col-sm-4 col-md-6 col-lg-6 px-0 inail-b-bottom inail-bg-white">
          <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 inail-b-right inail-col-form-tabellare  ">
              <input type="text" id="Row2Col2a-3" aria-label="Riga 2 Colonna 2 A" class="inail-input form-control inputNumber">
          </div>
          <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 inail-col-form-tabellare">
              <input type="text" id="Row2Col2a-3" aria-label="Riga 2 Colonna 2 B" class="inail-input form-control inputNumber">
          </div>
        </div>
      </div>
    </div>
    <!--Row 4-->
    <div class="row">
      <div class="col-xs-4 col-sm-4 col-md-4 col-lg-4 inail-b-bottom inail-bg-white inail-col-form-tabellare">
        <div>Riga numero 3</div>
      </div>
      <div class="col-xs-12 col-sm-12 col-md-8 col-lg-8 px-0">
         <div class="col-xs-4 col-sm-4 col-md-6 col-lg-6 px-0 inail-b-bottom inail-bg-white inail-b-right-grey">
          <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6   inail-b-left  inail-b-right inail-col-form-tabellare  ">
              <input type="text" id="Row3Col1a-3" aria-label="Riga 3 Colonna 1 A" class="inail-input form-control inputNumber">
          </div>
          <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 inail-col-form-tabellare ">
              <input type="text" id="Row3Col1b-3" aria-label="Riga 3 Colonna 1 B" class="inail-input form-control inputNumber">
          </div>
        </div>
         <div class="col-xs-4 col-sm-4 col-md-6 col-lg-6 px-0 inail-b-bottom inail-bg-white">
          <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6  inail-b-right inail-col-form-tabellare ">
              <input type="text" id="Row3Col2a-3" aria-label="Riga 3 Colonna 2 A" class="inail-input form-control inputNumber">
          </div>
          <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 inail-col-form-tabellare">
              <input type="text" id="Row3Col2b-3" aria-label="Riga 3 Colonna 2 B" class="inail-input form-control inputNumber">
          </div>
        </div>
      </div>
    </div>
<!--Row 5-->
<div class="row">
  <div class="col-xs-4 col-sm-4 col-md-4 col-lg-4 inail-b-bottom inail-bg-white inail-col-form-tabellare">
    <div>Riga numero 4</div>
  </div>
  <div class="col-xs-12 col-sm-12 col-md-8 col-lg-8 px-0">
     <div class="col-xs-4 col-sm-4 col-md-6 col-lg-6 px-0 inail-b-bottom inail-bg-white inail-b-right-grey">
      <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6   inail-b-left  inail-b-right inail-col-form-tabellare  ">
          <input type="text" value="8" id="Row4Col1a-3" aria-label="Riga 4 Colonna 1 A Campo selezionato" class="inail-input form-control inputNumber">
      </div>
      <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 inail-col-form-tabellare ">
          <input type="text" value="2" id="Row4Col1b-3" aria-label="Riga 4 Colonna 1 B Campo selezionato" class="inail-input form-control inputNumber">
      </div>
    </div>
     <div class="col-xs-4 col-sm-4 col-md-6 col-lg-6 px-0 inail-b-bottom inail-bg-white">
      <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6  inail-b-right inail-col-form-tabellare ">
          <input type="text" id="Row4Col2a-3" aria-label="Riga 4 Colonna 2 A" class="inail-input form-control inputNumber">
      </div>
      <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 inail-col-form-tabellare">
          <input type="text" value="9" id="Row4Col2b-3" aria-label="Riga 4 Colonna 2 B Campo selezionato" class="inail-input form-control inputNumber">
      </div>
    </div>
  </div>
</div>
<!--Row 6-->
<div class="row">
  <div class="col-xs-4 col-sm-4 col-md-4 col-lg-4 inail-b-bottom inail-bg-white inail-col-form-tabellare">
    <div>Riga numero 5</div>
  </div>
  <div class="col-xs-12 col-sm-12 col-md-8 col-lg-8 px-0">
     <div class="col-xs-4 col-sm-4 col-md-6 col-lg-6 px-0 inail-b-bottom inail-bg-white inail-b-right-grey">
      <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6   inail-b-left  inail-b-right inail-col-form-tabellare  ">
          <input type="text" id="Row5Col1a-3" aria-label="Riga 5 Colonna 1 A" class="inail-input form-control inputNumber">
      </div>
      <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 inail-col-form-tabellare ">
          <input type="text" value="7" id="Row5Col1b-3" aria-label="Riga 5 Colonna 1 B Campo selezionato" class="inail-input form-control inputNumber">
      </div>
    </div>
     <div class="col-xs-4 col-sm-4 col-md-6 col-lg-6 px-0 inail-b-bottom inail-bg-white">
      <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6  inail-b-right inail-col-form-tabellare ">
          <input type="text" value="6" id="Row5Col2a-3" aria-label="Riga 5 Colonna 2 A Campo selezionato" class="inail-input form-control inputNumber">
      </div>
      <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 inail-col-form-tabellare">
          <input type="text" id="Row5Col2b-3" aria-label="Riga 5 Colonna 2 B" class="inail-input form-control inputNumber">
      </div>
    </div>
  </div>
</div>
<!--Row 7-->
<div class="row">
  <div class="col-xs-4 col-sm-4 col-md-4 col-lg-4 inail-b-bottom inail-bg-white inail-col-form-tabellare">
    <div>Riga numero 6</div>
  </div>
  <div class="col-xs-12 col-sm-12 col-md-8 col-lg-8 px-0">
     <div class="col-xs-4 col-sm-4 col-md-6 col-lg-6 px-0 inail-b-bottom inail-bg-white inail-b-right-grey">
      <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6   inail-b-left  inail-b-right inail-col-form-tabellare  ">
          <input type="text" id="Row6Col1a-3" aria-label="Riga 6 Colonna 1 A" class="inail-input form-control inputNumber">
      </div>
      <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 inail-col-form-tabellare ">
          <input type="text" id="Row6Col1b-3" aria-label="Riga 6 Colonna 1 B" class="inail-input form-control inputNumber">
      </div>
    </div>
     <div class="col-xs-4 col-sm-4 col-md-6 col-lg-6 px-0 inail-b-bottom inail-bg-white">
      <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6  inail-b-right inail-col-form-tabellare ">
          <input type="text" value="6" id="Row6Col2a-3" aria-label="Riga 6 Colonna 2 A Campo selezionato" class="inail-input form-control inputNumber">
      </div>
      <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 inail-col-form-tabellare">
          <input type="text" id="Row6Col2b-3" aria-label="Riga 6 Colonna 2 B" class="inail-input form-control inputNumber">
      </div>
    </div>
  </div>
</div>
  </div>
     <div class="row">
      <div class="col-lg-12 col-md-12 pt-4 d-flex align-items-center justify-content-between">
        <div class="inail-text-campi-inseriti">
          <div>Campi inseriti:<strong class="ncampi"> 9 su 24</strong></div>
        </div>
        <div>
		 <button type="submit" class="inail-button inail-button-secondary" id="annullaButton">
            Annulla 
          </button>
          <button type="submit" class="inail-button inail-button-primary ml-4" id="destroButton">Bottone
            destro</button>
        </div>
      </div>
    </div>
</form>`}function R(){return`
	<div class="inail-form-complesso-container">
		<form aria-labelledby="form_08">
    <div class="inail-form-general-title" id="form_08">Dati utente</div>
      <fieldset class="inail-form-complesso-1 form-grey inail-form inail-fieldset-container">
      <legend class="inail-legend-title inail-first-title" id="titolo-form-dati"> Dati anagrafici </legend> 
				<div class="inail-form-complesso-message">
          I campi contrassegnati con l'asterisco (*) sono obbligatori.
        </div>

			<div>

				<div class="row">

					<div class="col-md-4 col-lg-4 col-sm-6 col-xs-12">
    					<label class="control-label inail-label" id="label-input" for="form-input-1">Nome</label>
    					<input type="text" class="form-control inail-input " id="form-input-1"  value="">
              <div class="inail-div-message"></div>
  					</div>

					<div class="col-md-4 col-lg-4 col-sm-6 col-xs-12">
    					<label class="control-label inail-label" id="label-input" for="form-input-2">Cognome</label>
    					<input type="text" class="form-control inail-input " id="form-input-2"  value="">
              <div class="inail-div-message"></div>
  					</div>

					<div class="col-md-4 col-lg-4 col-sm-6 col-xs-12">
						<label class="control-label inail-label" id="label-input-info" for='form-input-3'>Email</label>
						<span role="button" aria-labelledby="label-input-info" tabindex="0" class="fa fa-question-circle fa-lg" data-toggle="popover" data-trigger="focus" data-content="Inserire un suggerimento o una descrizione relativa a questo campo."></span>
						<input id="form-input-3" type="text" aria-labelledby="label-input-info hint-input-info" class="form-control inail-input"  value="">
            <div class="inail-div-message"></div>
					</div>

					<div class="col-md-4 col-sm-6 col-xs-12 mb-md-3 mb-lg-0 mb-xl-0">
						<label class="inail-label" for="form-select-1">Sesso</label>
						<select class="form-control inail-input form-select" id="form-select-1">
							<option value="..." aria-label="seleziona opzione">Seleziona opzione</option>
							<option value="Maschio" aria-label="Maschio">Maschio</option>
							<option value="Femmina" aria-label="Femmina">Femmina</option>
						</select>
            <div class="inail-div-message"></div>
					</div>

					<div class="date datePicker col-md-4 col-lg-4 col-sm-6 col-xs-12">
						<div class="input-relative">
							<label class="control-label inail-label" for="form-data-2">Data di nascita</label>
							<input id="form-data-2" class="form-control inail-input" title="GG/MM/AAAA" placeholder="gg / mm / aaaa" type="text" data-datepicker-aria>
						</div>
            <div class="inail-div-message"></div>
					</div>

					<div class="col-md-4 col-lg-4 col-sm-6 col-xs-12">
						<label class="control-label inail-label" for="numero-label">Numero di telefono</label>
						<input type="text" class="form-control inail-input " id="numero-label"  value=""aria-labelledby="numero-label hint-prefisso">
            <div class="inail-div-message">
            <span class="inail-span-ht" id="hint-prefisso">Inserire il prefisso</span>
            </div>
					</div>

					<div class="combobox combobox-wrapper col-md-4 col-lg-4 col-sm-6 col-xs-12">
						<label class="control-label inail-label" for="combobox-input">Città</label>
						<div class="inail-combobox-input-container">
							<input type="text" id="combobox-input" data-input-type='combobox' class="inail-input form-control inail-combobox" placeholder="Digita per filtrare..." aria-labelledby="label-1 combo_info">
							<div class="options inail-combobox-panel" id="combobox-options">
								<div class="option" tabindex="0" value="">- seleziona opzione -</div>
								<div class="option" tabindex="0" value="Opzione 1">Opzione 1</div>
								<div class="option" tabindex="0" value="Opzione 2">Opzione 2</div>
								<div class="option" tabindex="0" value="Opzione 3">Opzione 3</div>
								<div class="option" tabindex="0" value="Opzione 4">Opzione 4</div>
								<div class="option" tabindex="0" value="Opzione 5">Opzione 5</div>
								<div class="option" tabindex="0" value="Opzione 6">Opzione 6</div>
							</div>
						</div>
            <div class="inail-div-message">
            <span class="inail-span-ht" id="combo_info">Selezionare la città</span>
            </div>
						
					</div>

					<div class="col-md-4 col-sm-6 col-xs-12 mb-md-5 mb-lg-0 mb-xl-0">
    					<label class="control-label inail-label" id="label-input" for="form-input-4">Indirizzo</label>
    					<input type="text" class="form-control inail-input" id="form-input-4"  value="">
              <div class="inail-div-message"></div>
  					</div>

					<div class="col-md-4 col-lg-4 col-sm-6 col-xs-12">
						<label class="control-label inail-label" id="label-number" for="form-input-5">CAP</label>
						<input type="number"  class="form-control inail-input " id="form-input-5"  value="">
            <div class="inail-div-message">
            						<span id="error-message" class="inail-span-error" style="display: none;">
							<i class="fa-solid fa-circle-exclamation"></i> Messaggio d'errore
						</span>
            </div>

					</div>

				</div>

				<div class="row">

					<div class="col-sm-12 col-md-8">
						<div>
							<p class="pull-right inail-textarea-counter" id="charCounter">0/600</p>
							<label class="control-label inail-label pull-left" for="form-text-area-1">Biografia</label>
						</div>
						<textarea class="form-control inail-input" id="form-text-area-1" placeholder="Inserisci qui il tuo testo" rows="6" maxlength="600" title="Textarea" type="text" oninput="updateCounter()"></textarea>
            <div class="inail-div-message"></div>
					</div>

				</div>

			</div>

			<hr>

			<div>

				<fieldset>
        <legend class="inail-legend-title">Stato civile</legend>

				<div class="row">

					<div class="inail-custom-radio-group col-12">

						<label class="inail-radio-button" for="radio_1">
						<input type="radio" name="radio-group" class="inail-radio-input" checked  id='radio_1'>
						<div class="inail-radio-background">
							<div class="inail-radio-inner-circle"></div>
						</div>
						Celibe/Nubile
						</label>

						<label class="inail-radio-button"  for="radio_2">
						<input type="radio" name="radio-group" class="inail-radio-input" id='radio_2'>
						<div class="inail-radio-background">
							<div class="inail-radio-inner-circle"></div>
						</div>
						Sposato/a
						</label>

						<label class="inail-radio-button"  for="radio_3">
						<input type="radio" name="radio-group" class="inail-radio-input" id='radio_3'>
						<div class="inail-radio-background">
							<div class="inail-radio-inner-circle"></div>
						</div>
						Divorzato/a
						</label>

						<label class="inail-radio-button" for="radio_4">
						<input type="radio" name="radio-group" class="inail-radio-input" id='radio_4'>
						<div class="inail-radio-background">
							<div class="inail-radio-inner-circle"></div>
						</div>
						Vedovo/a
						</label>

					</div>

				</div>
        </fieldset>
			</div>

			<hr>
			
			<div>

				<fieldset>
        <legend class="inail-legend-title">Familiari a carico</legend>

				<button class="inail-tertiary-button pl-0" type="button"><span class="fa fa-plus inail-left-icon" aria-hidden="true"></span>Inserisci un familiare a carico</button>
        </fieldset>
			</div>

		</fieldset>

		<fieldset class="inail-form-complesso-1 form-grey inail-form inail-fieldset-container">
    <legend class="inail-legend-title inail-first-title" id="titolo-form-docs"> Documenti </legend> 

    
    <div class="row inail-div-first-child">
      <fieldset>
        

				<div class="inail-container-filter-documents col-lg-6 col-md-12 col-sm-12 col-xs-12 mb-4">

					<fieldset>
            <legend class="inail-checkbox-legend">Tipo di documento</legend>

					  <div class="inail-filter-documents-checkbox">
						  <div class="custom-checkbox-container inail-checkbox col-12">
							  <input type="checkbox" id="check-1" class="custom-checkbox option-checkbox">
							    <label for="check-1">
							      <span class="custom-checkbox-background">
								      <i class="fa inail-checkbox-icon"></i>
							      </span>
							      <span>Carta d'identità</span>
							    </label>
						  </div>

						  <div class="custom-checkbox-container inail-checkbox col-12">
							  <input type="checkbox" id="check-2" class="custom-checkbox option-checkbox">
							  <label for="check-2">
							    <span class="custom-checkbox-background">
								    <i class="fa inail-checkbox-icon"></i>
							    </span>
							    <span>Patente</span>
							  </label>
						  </div>

						  <div class="custom-checkbox-container inail-checkbox col-12">
							  <input type="checkbox" id="check-3" class="custom-checkbox option-checkbox">
							  <label for="check-3">
							    <span class="custom-checkbox-background">
								    <i class="fa inail-checkbox-icon"></i>
							    </span>
							    <span>Tessera sanitaria</span>
							  </label>
						  </div>
					  </div>
          </fieldset>
				</div>

				<div class="col-lg-6 col-md-12 col-sm-12 col-xs-12">
					<label class="inail-label" for="patenti-guida-select">Patenti di guida:</label>
					<select class="form-control inail-input form-select" id="patenti-guida-select">
						<option value="..." aria-label="seleziona opzione">Seleziona opzione</option>
						<option value="A" aria-label="A">A</option>
						<option value="B" aria-label="B">B</option>
					</select>
          <div class="inail-div-message"></div>
				</div>

        </fieldset>
			</div>

			
      <div id="table_01" class="inail-legend-title" id='risultati'>Risultati</div>

			<div>

				<div class="tabella table-responsive inail-table">
					<table id="tabella-base" class="table display tabella-base" aria-labelledby='table_01'>
		
						<thead>
							<tr>
							<th>
								<span class="thLabel">Nome documento</span>
							</th>
							<th>
								<span class="thLabel">Documenti allegati</span>
							</th>
							<th>
								<span class="thLabel">Stato</span>
							</th>
							</tr>
						</thead>
						<tbody>
							<tr>
							<td>Carta d'identità</td>
							<td><i class="fa-regular fa-file-lines"></i> <a data-original-title="Nome file" class="inail-text-link-1-semibold m-0" tabindex="0" href="javascript:void(0)" title="Scarica documento">Nome-file-01-jpg</a></td>
							<td>
								<span class="tag-info inail-tag-default" aria-label="tag info">
        <span class="sr-only">tag info</span>
        <span class="fa-solid fa-circle-info inail-tag-icon" aria-hidden="true"></span>
        <span class="inail-tag-text">Lorem Ipsum</span>
      </span>
							</td>
							</tr>
							<tr>
							<td>Patente</td>
							<td><i class="fa-regular fa-file-lines"></i> <a data-original-title="Nome file" class="inail-text-link-1-semibold m-0" tabindex="0" href="javascript:void(0)" title="Scarica documento">Nome-file-01-jpg</a></td>
							<td>
								<span class="inail-tag-default tag-danger" aria-label="tag errore">
        <span class="sr-only">tag errore</span>
        <span class="fa-solid fa-triangle-exclamation inail-tag-icon"></span>
        <span class="inail-tag-text">Lorem Ipsum</span>
      </span>
    </div>
							</td>
							</tr>
							<tr>
							<td>Patente</td>
							<td><i class="fa-regular fa-file-lines"></i> <a data-original-title="Nome file" class="inail-text-link-1-semibold m-0" tabindex="0" href="javascript:void(0)" title="Scarica documento">Nome-file-01-jpg</a></td>
							<td>
								<span class="inail-tag-default tag-success">
        <span class="sr-only">tag successo</span>
        <span class="fa-solid fa-circle-check inail-tag-icon" aria-hidden="true"></span>
        <span class="inail-tag-text">Lorem Ipsum</span>
      </span>
    </div>
							</td>
							</tr>
							<tr>
							<td>Patente</td>
							<td><i class="fa-regular fa-file-lines"></i> <a data-original-title="Nome file" class="inail-text-link-1-semibold m-0" tabindex="0" href="javascript:void(0)" title="Scarica documento">Nome-file-01-jpg</a></td>
							<td>
								<span class="inail-tag-default tag-warning" aria-label="tag avviso">
        <span class="sr-only">tag avviso</span>
        <span class="fa-solid fa-circle-exclamation inail-tag-icon" aria-hidden="true"></span>
        <span class="inail-tag-text">Lorem Ipsum</span>
      </span
							</td>
							</tr>
						</tbody>
					</table>
				</div>
			</div>

    </fieldset>

		<fieldset class="inail-form-complesso-1 form-grey inail-form inail-fieldset-container">
    <legend class="inail-legend-title inail-first-title" id="titolo-form-esp"> Esperienza di lavoro </legend> 

			<div class="inail-form-complesso-message">
        I campi contrassegnati con l'asterisco (*) sono obbligatori.
      </div>

      <div style="margin-bottom:54px">
        <button class="inail-tertiary-button" type="button"><span class="fa fa-plus inail-left-icon" aria-hidden="true"></span>Aggiungi nuova occupazione</button>
      </div>
      
      <div class="row">


					<div class=" col-md-3 col-sm-12 col-xs-12">
          <div class="inail-spacer"></div>
    					<label class="control-label inail-label" id="label-input" for="form-input-datore-lavoro">Datore di lavoro</label>
    					<input type="text" class="form-control inail-input " id="form-input-datore-lavoro"  value="">
              <div class="inail-div-message"></div>
  					</div>

            <fieldset class="col-sm-12 col-md-6 col-xs-12 noPadding">
            <legend class="inail-date-range-title">Periodo</legend>
					  <div class="col-sm-6 col-md-6 col-xs-12 inail-date-picker">
							<div class="input-relative">
								<label class="control-label inail-label" for="form-data-inizio">Data inizio</label>
								<input id="form-data-inizio" class="form-control inail-input" title="GG/MM/AAAA" placeholder="gg / mm / aaaa" type="text" data-datepicker-aria>
							</div>
              <div class="inail-div-message"></div>
					  </div>
					
					  <div class="col-sm-6 col-md-6 col-xs-12 inail-mat-date-picker">
							<div class="input-relative">
								<label class="control-label inail-label" for="form-data-3">Data fine</label>
								<input id="form-data-3" class="form-control inail-input" title="GG/MM/AAAA" placeholder="gg / mm / aaaa" type="text" data-datepicker-aria>
							</div>
              <div class="inail-div-message"></div>
					  </div>
          </fieldset>
					<div class="col-sm-4 col-md-3">
						<button class="inail-tertiary-button-danger inail-button-danger" type="button"><span class="fa fa-trash-alt inail-left-icon" aria-hidden="true"></span>Rimuovi</button>
					</div>
          
				</div><hr class="mt-0">


    </fieldset>
		</form>

	</div>
	`}function z(){return`
   <div id="feedback-container"></div>
         <form action="#" class="form-grey inail-form" id="form-with-validation-submit" name="Form With Validation" autocomplete="off" autoComplete="off" aria-labelledby="form_10">
     <div class="inail-form-title" id="form_10">Titolo Form</div>
      <div class="row">
        <div class="col-md-12 inail-form-info-message">
          I campi contrassegnati con l'asterisco (*) sono obbligatori.
        </div>
      </div>
     <div class="row">
       <!-- NAME -->
       <div class="col-xs-12 col-sm-6 col-md-4 col-lg-4" >
         <label class="control-label inail-label" for="nome">Nome*</label>
         <input type="text" id="nome" class="form-control inail-input " aria-required="true" aria-describedby="error-nome">
         <div class="inail-div-message" id="error-nome">
           
         </div>
       </div>
       <!-- SURNAME -->
       <div class="col-xs-12 col-sm-6 col-md-4 col-lg-4" >
         <label class="control-label inail-label" for="surname">Cognome*</label>
         <input type="text" id="surname" class="form-control inail-input " aria-required="true" aria-describedby="error-surname">
         <div class="inail-div-message"  id="error-surname">
          
         </div>
       </div>
       <!-- EMAIL -->
       <div class="col-xs-12 col-sm-6 col-md-4 col-lg-4">
         <label class="control-label inail-label" for="email">Email*</label>
         <input type="text" id="email" class="form-control inail-input " aria-required="true" aria-describedby="error-email">
         <div class="inail-div-message" id="error-email">
     
         </div>
       </div>
       <!-- GENDER -->
       <div class="col-xs-12 col-sm-6 col-md-4 col-lg-4" >
         <label class="inail-label" for="gender">Sesso*</label>
         <select class="form-control inail-input form-select  " id="gender" aria-required="true" aria-describedby="error-gender">
           <option value="">Seleziona opzione</option>
           <option value="maschio">Maschio</option>
           <option value="femmina">Femmina</option>
         </select>
         <div class="inail-div-message" id="error-gender">
           
         </div>
       </div>
       <!-- BIRTHDAY -->
       <div class=" col-xs-12 col-sm-6 col-md-4 col-lg-4">
         <div class="form-group  date datePicker " day">
           <div class="input-relative">
             <label class="control-label inail-label" for="birthday">Data di nascita*</label>
             <input id="birthday" class="form-control inail-input  " title="GG/MM/AAAA" placeholder="gg / mm / aaaa" type="text" aria-describedby="error-birthday" data-datepicker-aria>
           </div>
           <div class="inail-div-message" id="error-birthday">
             
           </div>
         </div>
       </div>
       <!-- PHONE -->
       <div class="col-xs-12 col-sm-6 col-md-4 col-lg-4">
         <label class="control-label inail-label" for="phone">Numero di telefono*</label>
         <input type="number" id="phone" class="form-control inail-input " aria-required="true" aria-describedby="error-phone">
         <div class="inail-div-message" id="error-phone">
       
         </div>
       </div>
       <!-- City -->
       <div class="col-xs-12 col-sm-6 col-md-4 col-lg-4">
         <div class="combobox combobox-wrapper ">
           <div id="ariaOptionStatus" class="sr-only" aria-live="polite"></div>
           <label class="control-label inail-label" id="label-1">Citta* </label>
           <div class="inail-combobox-input-container">
             <input id="city" type="text" data-input-type="combobox" aria-describedby="error-city" class="inail-input form-control inail-combobox" placeholder="Selezionare un'opzione" aria-labelledby="label-1">
             <div class="options inail-combobox-panel" id="cityList"></div>
             <div class="inail-div-message"  id="error-city">
                <span id="comboHint" class="inail-span-ht inail-span-ht-combobox">Selezionare la città</span>
             </div>
           </div>
         </div>
       </div>
       <!-- ADDRESS -->
       <div class="col-xs-12 col-sm-6 col-md-4 col-lg-4">
         <label class="control-label inail-label" for="address">Indirizzo*</label>
         <input type="text" id="address" class="form-control inail-input " aria-required="true" aria-describedby="error-address">
         <div class="inail-div-message" id="error-address">
          
         </div>
       </div>
       <!-- CAP -->
       <div class="col-xs-12 col-sm-6 col-md-4 col-lg-4" >
         <label class="control-label inail-label" for="cap">CAP*</label>
         <input type="number" id="cap" class="form-control inail-input " aria-required="true" aria-describedby="error-cap">
         <div class="inail-div-message"  id="error-cap">
          
         </div>
       </div>
       <!-- Number range -->
       <fieldset class="col-xs-12 col-sm-12 col-md-8 col-lg-8 p-0">
       <legend class="sr-only">Intervallo numerico</legend>
         <div class="col-xs-12 col-sm-6 col-md-6 col-lg-6 ">
           <label class="control-label inail-label" id="label-from">Da*</label>
           <input aria-labelledby="label-from info-hint-number-range-1" type="number" class="form-control inail-input  hint-number" id="numberFrom" value="" aria-describedby="error-numberFrom" >
           <div class="inail-div-message" id="error-numberFrom">
     
           </div>
         </div>
         <div class="col-xs-12 col-sm-6 col-md-6 col-lg-6 ">
           <label class="control-label inail-label" id="label-TO">A*</label>
           <input aria-labelledby="label-TO info-hint-number-range-2" type="number" class="form-control inail-input  hint-number" id="numberTo" value="" aria-describedby="error-numberTo" >
           <div class="inail-div-message" id="error-numberTo">
     
           </div>
         </div>
         <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12" id="error-range" >

         </div>
       </fieldset>
       <!-- Patenti -->
       <div class="col-xs-12 col-sm-6 col-md-4 col-lg-4 ">
         <div class="dropdown">
           <label class="inail-label" id="label-multi-select-error">Patenti*</label>
           <input id="patenti" aria-labelledby="label-multi-select-error error-multi-select hint-multi-select" type="select" data-input-type="multiselect" class="form-control inail-input inail-input-multiselect   col-12" placeholder="Seleziona opzioni..." readonly="" aria-describedby="error-patenti">
           <ul class="inail-multiselect-dropdown-menu dropdown-menu" id="licenseTypes"></ul>
         </div>
         <div class="inail-div-message" id="error-patenti">
           
         </div>
       </div>
       <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 p-0">
         <!-- Employer -->
         <div class="col-xs-12 col-sm-6 col-md-4 col-lg-4">
          
           <div class="inail-spacer"></div>
           <label class="control-label inail-label" for="employer">Ultima occupazione*</label>
           <input type="text" id="employer" class="form-control inail-input " aria-required="true"  aria-describedby="error-employer">
           <div class="inail-div-message"  id="error-employer">
             
           </div> 
           
         </div>
         <!-- Date range -->
         <div class="col-xs-12 col-sm-12 col-md-8 col-lg-8 p-0 ">
         <fieldset>
            <legend class="inail-date-range-title">Periodo</legend>
           <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 p-0" aria-labelledby="periodo-label" role="group">
             <div class="col-sm-6 col-md-6 col-lg-6">
               <div class="date datePicker form-group">
                 <div class="input-relative">
                   <label class="control-label inail-label" for="dateFrom">Dal*</label>
                   <input id="dateFrom" class="form-control inail-input " title="GG/MM/AAAA" placeholder="gg / mm / aaaa" type="text" aria-describedby="error-dateFrom" data-datepicker-aria>
                 </div>
                 <div class="inail-div-message" id="error-dateFrom">
                   
                 </div>
               </div>
             </div>
             <div class="col-sm-6 col-md-6 col-lg-6">
               <div class="date datePicker form-group">
                 <div class="input-relative">
                   <label class="control-label inail-label" for="dateTo">Al*</label>
                   <input id="dateTo" class="form-control inail-input " title="GG/MM/AAAA" placeholder="gg / mm / aaaa" type="text" aria-describedby="error-dateTo" data-datepicker-aria>
                 </div>
                 <div class="inail-div-message" id="error-dateTo">
                   
                 </div>
               </div>
             </div>
           </div>
         </div>
          </fieldset>
       </div>
       <!-- Biografia -->
       <div class="col-xs-12 col-sm-12 col-md-8 col-lg-8 ">
         <div>
           <p class="pull-right inail-textarea-counter" ><span id="count-biografia">0</span>/600</p>
           <label class="control-label inail-label pull-left" id="label-textarea-error">Biografia</label>
         </div>
         <textarea type="text" class="form-control inail-input  " id="biografia" placeholder="Inserisci qui il tuo testo" rows="6" maxlength="600" title="Textarea"  aria-labelledby="label-textarea-error error-textarea hint-textarea" aria-describedby="error-biografia"></textarea>
         <div class="inail-div-message"  id="error-biografia">
           
         </div>
       </div>
       <!-- DOCUMENTI (radio group) -->
       <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 mt-4">
         <fieldset aria-describedby="error-civilStatus">
           <legend class="radio-legend inail-label">Stato civile*</legend>
           <div class="inail-custom-radio-group  " id="civilStatus">
             <div class="row " id="statoContainer"></div>
             <div class="inail-div-message" id="error-civilStatus">
              
             </div>
           </div>
         </fieldset>
       </div>
       <!-- DOCUMENTI (checkbox group) -->
       <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 my-5">
         <fieldset>
           <legend class="inail-checkbox-legend" id="documents-legend">Documenti allegati*</legend>
           <div class="custom-checkbox-container inail-checkbox">
             <div class="row " style="width:100%" id="documentsContainer">
             </div>
             <div class="inail-div-message" id="error-documents">
             </div>
           </div>
         </fieldset>
       </div>
     </div>

       <div class="row">

        <div class="col-12  d-flex justify-content-end  marginTop inail-button-wrapper">
          <div class="inail-button-container">
           
            <button type="submit" class="inail-button inail-button-primary"  id="confermaButton">Conferma</button>
          </div>
        </div>
      </div>
   </form>
    `}function B(){return`
  
         <form action="#" class="form-grey inail-form" id="form-with-validation" name="Form With Validation" autocomplete="off" autoComplete="off" aria-labelledby="form_09">
     <div class="inail-form-title" id="form_09">Titolo Form</div>
      <div class="row">
        <div class="col-md-12 inail-form-info-message">
          I campi contrassegnati con l'asterisco (*) sono obbligatori.
        </div>
      </div>
     <div class="row">
       <!-- NAME -->
       <div class="col-xs-12 col-sm-6 col-md-4 col-lg-4" >
         <label class="control-label inail-label" for="fwv-nome">Nome*</label>
         <input type="text" id="fwv-nome" class="form-control inail-input " aria-required="true" aria-describedby="error-fwv-nome">
         <div class="inail-div-message" id="error-fwv-nome">
           
         </div>
       </div>
       <!-- SURNAME -->
       <div class="col-xs-12 col-sm-6 col-md-4 col-lg-4" >
         <label class="control-label inail-label" for="fwv-surname">Cognome*</label>
         <input type="text" id="fwv-surname" class="form-control inail-input " aria-required="true" aria-describedby="error-fwv-surname">
         <div class="inail-div-message"  id="error-fwv-surname">
          
         </div>
       </div>
       <!-- EMAIL -->
       <div class="col-xs-12 col-sm-6 col-md-4 col-lg-4">
         <label class="control-label inail-label" for="fwv-email">Email*</label>
         <input type="text" id="fwv-email" class="form-control inail-input " aria-required="true" aria-describedby="error-fwv-email">
         <div class="inail-div-message" id="error-fwv-email">
     
         </div>
       </div>
       <!-- GENDER -->
       <div class="col-xs-12 col-sm-6 col-md-4 col-lg-4" >
         <label class="inail-label" for="fwv-gender">Sesso*</label>
         <select class="form-control inail-input form-select  " id="fwv-gender" aria-required="true" aria-describedby="error-fwv-gender">
           <option value="">Seleziona opzione</option>
           <option value="maschio">Maschio</option>
           <option value="femmina">Femmina</option>
         </select>
         <div class="inail-div-message" id="error-fwv-gender">
           
         </div>
       </div>
       <!-- BIRTHDAY -->
       <div class=" col-xs-12 col-sm-6 col-md-4 col-lg-4">
         <div class="form-group  date datePicker day">
           <div class="input-relative">
             <label class="control-label inail-label" for="fwv-birthday">Data di nascita*</label>
             <input id="fwv-birthday" class="form-control inail-input  " title="GG/MM/AAAA" placeholder="gg / mm / aaaa" type="text" aria-describedby="error-fwv-birthday" data-datepicker-aria>
           </div>
           <div class="inail-div-message" id="error-fwv-birthday">
             
           </div>
         </div>
       </div>
       <!-- PHONE -->
       <div class="col-xs-12 col-sm-6 col-md-4 col-lg-4">
         <label class="control-label inail-label" for="fwv-phone">Numero di telefono*</label>
         <input type="number" id="fwv-phone" class="form-control inail-input " aria-required="true" aria-describedby="error-fwv-phone">
         <div class="inail-div-message" id="error-fwv-phone">
       
         </div>
       </div>
       <!-- City -->
       <div class="col-xs-12 col-sm-6 col-md-4 col-lg-4">
         <div class="combobox combobox-wrapper ">
           <div id="ariaOptionStatus" class="sr-only" aria-live="polite"></div>
           <label class="control-label inail-label" id="fwv-city-label">Citta* </label>
           <div class="inail-combobox-input-container">
             <input id="fwv-city" type="text" data-input-type="combobox" aria-describedby="error-fwv-city" class="inail-input form-control inail-combobox" placeholder="Selezionare un'opzione" aria-labelledby="fwv-city-label">
             <div class="options inail-combobox-panel" id="cityListFWV"></div>
             <div class="inail-div-message"  id="error-fwv-city">
                <span id="comboHint" class="inail-span-ht inail-span-ht-combobox">Selezionare la città</span>
             </div>
           </div>
         </div>
       </div>
       <!-- ADDRESS -->
       <div class="col-xs-12 col-sm-6 col-md-4 col-lg-4">
         <label class="control-label inail-label" for="fwv-address">Indirizzo*</label>
         <input type="text" id="fwv-address" class="form-control inail-input " aria-required="true" aria-describedby="error-fwv-address">
         <div class="inail-div-message" id="error-fwv-address">
          
         </div>
       </div>
       <!-- CAP -->
       <div class="col-xs-12 col-sm-6 col-md-4 col-lg-4" >
         <label class="control-label inail-label" for="fwv-cap">CAP*</label>
         <input type="number" id="fwv-cap" class="form-control inail-input " aria-required="true" aria-describedby="error-fwv-cap">
         <div class="inail-div-message"  id="error-fwv-cap">
          
         </div>
       </div>
       <!-- Number range -->
       <fieldset class="col-xs-12 col-sm-12 col-md-8 col-lg-8 p-0" aria-describedby="error-fwv-range">
       <legend class="sr-only">Intervallo numerico</legend>
         <div class="col-xs-12 col-sm-6 col-md-6 col-lg-6 ">
           <label class="control-label inail-label" id="fwv-numberFrom-label">Da*</label>
           <input aria-labelledby="fwv-numberFrom-label info-hint-number-range-1" type="number" class="form-control inail-input  hint-number" id="fwv-numberFrom" value="" aria-describedby="error-fwv-numberFrom" >
           <div class="inail-div-message" id="error-fwv-numberFrom">
     
           </div>
         </div>
         <div class="col-xs-12 col-sm-6 col-md-6 col-lg-6 ">
           <label class="control-label inail-label" id="fwv-numberTo-label">A*</label>
           <input aria-labelledby="fwv-numberTo-label" type="number" class="form-control inail-input  hint-number" id="fwv-numberTo" value="" aria-describedby="error-fwv-numberTo" >
           <div class="inail-div-message" id="error-fwv-numberTo">
     
           </div>
         </div>
         <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12" id="error-fwv-range" >

         </div>
       </fieldset>
       <!-- Patenti -->
       <div class="col-xs-12 col-sm-6 col-md-4 col-lg-4 ">
         <div class="dropdown">
           <label class="inail-label" id="fwv-patenti-label">Patenti*</label>
           <input id="fwv-patenti" aria-labelledby="fwv-patenti-label" type="select" data-input-type="multiselect" class="form-control inail-input inail-input-multiselect   col-12" placeholder="Seleziona opzioni..." readonly="" aria-describedby="error-fwv-patenti">
           <ul class="inail-multiselect-dropdown-menu dropdown-menu" id="licenseTypesFWV"></ul>
         </div>
         <div class="inail-div-message" id="error-fwv-patenti">
           
         </div>
       </div>
       <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 p-0">
         <!-- Employer -->
         <div class="col-xs-12 col-sm-6 col-md-4 col-lg-4">
          
           <div class="inail-spacer"></div>
           <label class="control-label inail-label" for="fwv-employer">Ultima occupazione*</label>
           <input type="text" id="fwv-employer" class="form-control inail-input " aria-required="true" aria-describedby="error-fwv-employer">
           <div class="inail-div-message"  id="error-fwv-employer">
             
           </div> 
           
         </div>
         <!-- Date range -->
         <div class="col-xs-12 col-sm-12 col-md-8 col-lg-8 p-0 ">
         <fieldset>
            <legend class="inail-date-range-title">Periodo</legend>
           <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 p-0"  role="group">
             <div class="col-sm-6 col-md-6 col-lg-6">
               <div class="date datePicker form-group">
                 <div class="input-relative">
                   <label class="control-label inail-label" for="fwv-dateFrom">Dal*</label>
                   <input id="fwv-dateFrom" class="form-control inail-input " title="GG/MM/AAAA" placeholder="gg / mm / aaaa" type="text" aria-describedby="error-fwv-dateFrom" data-datepicker-aria>
                 </div>
                 <div class="inail-div-message" id="error-fwv-dateFrom">
                   
                 </div>
               </div>
             </div>
             <div class="col-sm-6 col-md-6 col-lg-6">
               <div class="date datePicker form-group">
                 <div class="input-relative">
                   <label class="control-label inail-label" for="fwv-dateTo">Al*</label>
                   <input id="fwv-dateTo" class="form-control inail-input " title="GG/MM/AAAA" placeholder="gg / mm / aaaa" type="text" aria-describedby="error-fwv-dateTo" data-datepicker-aria>
                 </div>
                 <div class="inail-div-message" id="error-fwv-dateTo">
                   
                 </div>
               </div>
             </div>
           </div>
         </div>
          </fieldset>
       </div>
       <!-- Biografia -->
       <div class="col-xs-12 col-sm-12 col-md-8 col-lg-8 ">
         <div>
           <p class="pull-right inail-textarea-counter" ><span id="count-fwv-biografia">0</span>/600</p>
           <label class="control-label inail-label pull-left" id="fwv-biografia-label">Biografia</label>
         </div>
         <textarea type="text" class="form-control inail-input  " id="fwv-biografia" placeholder="Inserisci qui il tuo testo" rows="6" maxlength="600" title="Textarea"  aria-labelledby="fwv-biografia-label" aria-describedby="error-fwv-biografia"></textarea>
         <div class="inail-div-message"  id="error-fwv-biografia">
           
         </div>
       </div>
       <!-- DOCUMENTI (radio group) -->
       <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 mt-4">
         <fieldset aria-describedby="error-fwv-civilStatus">
           <legend class="radio-legend inail-label">Stato civile*</legend>
           <div class="inail-custom-radio-group  " id="fwv-civilStatus">
             <div class="row " id="statoContainerFWV"></div>
             <div class="inail-div-message" id="error-fwv-civilStatus">
              
             </div>
           </div>
         </fieldset>
       </div>
       <!-- DOCUMENTI (checkbox group) -->
       <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 my-5">
         <fieldset>
           <legend class="inail-checkbox-legend" id="documents-legend">Documenti allegati*</legend>
           <div class="custom-checkbox-container inail-checkbox">
             <div class="row " style="width:100%" id="documentsContainerFWV">
             </div>
             <div class="inail-div-message" id="error-fwv-documents">
             </div>
           </div>
         </fieldset>
       </div>
     </div>

       <div class="row">

        <div class="col-12  d-flex justify-content-end  marginTop inail-button-wrapper">
          <div class="inail-button-container">
           
            <button type="submit" class="inail-button inail-button-primary"  id="fwv-confermaButton">Conferma</button>
          </div>
        </div>
      </div>
   </form>
    `}const A="N.D.",T={title:"Patterns/Form",tags:["autodocs"],parameters:{docs:{description:{component:"I box presenti nella dashboard possono essere utilizzati come widget per l'accesso rapido a: news, applicazioni, avvisi.<br /><br />Nel caso di news ed avvisi è possibile accedere ad un approfondimento attraverso al link “Tutti i dettagli”, posto in basso a destra del box.<br /><br />Nell'esempio viene mostrato un box di ricerca a titolo esemplificativo, infatti è possibile integrare un widget di un'applicazione per una <br /> rapida ricerca interna. Es: Ricerca Pratica, Ricerca Codice Sede.<br /><br />Il Carousel Box Dashboard permette di integrare più Box Dashboard. Sono obbligatori in questo caso i controlli di navigazione: Frecce:<br /> per andare avanti e indietro nel carousel Indicatori Circolari: per esplicitare la presenza di altri elementi oltre a quelli visibili sulla pagina "},mdxPage:A,showAccessibility:!0}},decorators:[(i,o)=>f(i,o,10,["https://cdn.inailcloud.it/assets/inail/u.1.0/static-webkit/js/custom-webkit.js","https://cdn.inailcloud.it/assets/inail/u.1.0/static/js/main.js","https://cdn.inailcloud.it/assets/inail/u.1.0/static-webkit/js/custom-input-number.js","https://cdn.inailcloud.it/assets/inail/u.1.0/static-webkit/js/custom-input-textarea.js","https://cdn.inailcloud.it/assets/inail/u.1.0/static-webkit/js/jquery-multiselect.js","https://cdn.inailcloud.it/assets/inail/u.1.0/static-webkit/js/custom-feedback.js","https://cdn.inailcloud.it/assets/inail/u.1.0/static-webkit/js/custom-form-submit.js","https://cdn.inailcloud.it/assets/inail/u.1.0/static-webkit/js/custom-form-validation.js","https://cdn.inailcloud.it/assets/inail/u.1.0/static-webkit/js/custom-input-combobox.js"],!0)]},n={name:"Form base",argTypes:{onClickIndietro:{action:"onClickIndietro",description:"Evento al click del button Indietro.",table:{disable:!0}},onClickConferma:{action:"onClickConferma",description:"Evento al click del button Conferma.",table:{disable:!0}}},render:i=>{const o=g(),l=document.createElement("div");l.innerHTML=o;const e=l.querySelector("#indietroButton"),t=l.querySelector("#confermaButton");e&&t&&(e.addEventListener("click",i.onClickIndietro),t.addEventListener("click",i.onClickConferma));const a=document.createElement("main");return a.id="contenutoPrincipale",a.appendChild(l),a||""}},s={name:"Form disabilitato",decorators:[i=>`<main id="contenutoPrincipale">${i()}</main>`],render:()=>x()},c={name:"Form con opzioni collassabili",argTypes:{onClickIndietro:{action:"onClickIndietro",description:"Evento al click del button Indietro.",table:{disable:!0}},onClickConferma:{action:"onClickConferma",description:"Evento al click del button Conferma.",table:{disable:!0}}},render:i=>{const o=y(),l=document.createElement("div");l.innerHTML=o;const e=l.querySelector("#indietroButton"),t=l.querySelector("#confermaButton");e&&t&&(e.addEventListener("click",i.onClickIndietro),t.addEventListener("click",i.onClickConferma));const a=document.createElement("main");return a.id="contenutoPrincipale",a.appendChild(l),a||""}},r={name:"Form Accordion",argTypes:{onClickIndietro:{action:"onClickIndietro",description:"Evento al click del button Indietro.",table:{disable:!0}},onClickConferma:{action:"onClickConferma",description:"Evento al click del button Conferma.",table:{disable:!0}}},render:i=>{const o=C(),l=document.createElement("div");l.innerHTML=o;const e=l.querySelector("#indietroButton"),t=l.querySelector("#confermaButton");e&&t&&(e.addEventListener("click",i.onClickIndietro),t.addEventListener("click",i.onClickConferma));const a=document.createElement("main");return a.id="contenutoPrincipale",a.appendChild(l),a||""}},d={name:"Form tabellare 1",argTypes:{onClickAnnulla:{action:"onClickAnnulla",description:"Evento al click del button Annulla.",table:{disable:!0}},onClickBottoneDestro:{action:"onClickBottoneDestro",description:"Evento al click del button Destro.",table:{disable:!0}}},render:i=>{const o=w(),l=document.createElement("div");l.innerHTML=o;const e=l.querySelector("#annullaButton"),t=l.querySelector("#destroButton");e&&t&&(e.addEventListener("click",i.onClickAnnulla),t.addEventListener("click",i.onClickBottoneDestro));const a=document.createElement("main");return a.id="contenutoPrincipale",a.appendChild(l),a||""}},m={name:"Form tabellare 2",argTypes:{onClickAnnulla:{action:"onClickAnnulla",description:"Evento al click del button Annulla.",table:{disable:!0}},onClickBottoneDestro:{action:"onClickBottoneDestro",description:"Evento al click del button Destro.",table:{disable:!0}}},render:i=>{const o=h(),l=document.createElement("div");l.innerHTML=o;const e=l.querySelector("#annullaButton"),t=l.querySelector("#destroButton");e&&t&&(e.addEventListener("click",i.onClickAnnulla),t.addEventListener("click",i.onClickBottoneDestro));const a=document.createElement("main");return a.id="contenutoPrincipale",a.appendChild(l),a||""}},v={name:"Form tabellare 3",argTypes:{onClickAnnulla:{action:"onClickAnnulla",description:"Evento al click del button Annulla.",table:{disable:!0}},onClickBottoneDestro:{action:"onClickBottoneDestro",description:"Evento al click del button Destro.",table:{disable:!0}}},render:i=>{const o=k(),l=document.createElement("div");l.innerHTML=o;const e=l.querySelector("#annullaButton"),t=l.querySelector("#destroButton");e&&t&&(e.addEventListener("click",i.onClickAnnulla),t.addEventListener("click",i.onClickBottoneDestro));const a=document.createElement("main");return a.id="contenutoPrincipale",a.appendChild(l),a||""}},b={name:"Form con sezioni",decorators:[i=>`<main id="contenutoPrincipale">${i()}</main>`],render:()=>R()},p={name:"Form con validazione in compilazione",decorators:[i=>`<main id="contenutoPrincipale">${i()}</main>`],render:()=>B()},u={name:"Form con validazione al submit",decorators:[i=>`<main id="contenutoPrincipale">${i()}</main>`],render:()=>z()};n.parameters={...n.parameters,docs:{...n.parameters?.docs,source:{originalSource:`{
  name: "Form base",
  argTypes: {
    onClickIndietro: {
      action: "onClickIndietro",
      description: "Evento al click del button Indietro.",
      table: {
        disable: true
      }
    },
    onClickConferma: {
      action: "onClickConferma",
      description: "Evento al click del button Conferma.",
      table: {
        disable: true
      }
    }
  },
  render: args => {
    //---------Forzare eventi----------------//
    const formHTML = createFormBase();
    const tempDiv = document.createElement("div");
    tempDiv.innerHTML = formHTML;

    // Cerca il bottone dentro il div temporaneo
    const indietroButton = tempDiv.querySelector("#indietroButton");
    const confermaButton = tempDiv.querySelector("#confermaButton");

    // Se il bottone esiste, aggiungi l'evento click
    if (indietroButton && confermaButton) {
      indietroButton.addEventListener("click", args.onClickIndietro);
      confermaButton.addEventListener("click", args.onClickConferma);
    }

    // Crea il main e appende il bottone all'interno
    const mainElement = document.createElement("main");
    mainElement.id = "contenutoPrincipale";
    mainElement.appendChild(tempDiv);

    // Ritorna il main element con il bottone all'interno
    return mainElement || "";
  }
}`,...n.parameters?.docs?.source}}};s.parameters={...s.parameters,docs:{...s.parameters?.docs,source:{originalSource:`{
  name: "Form disabilitato",
  decorators: [Story => {
    const storyHtml = Story();
    return \`<main id="contenutoPrincipale">\${storyHtml}</main>\`;
  }],
  render: () => {
    return createDisabledForm();
  }
}`,...s.parameters?.docs?.source}}};c.parameters={...c.parameters,docs:{...c.parameters?.docs,source:{originalSource:`{
  name: "Form con opzioni collassabili",
  argTypes: {
    onClickIndietro: {
      action: "onClickIndietro",
      description: "Evento al click del button Indietro.",
      table: {
        disable: true
      }
    },
    onClickConferma: {
      action: "onClickConferma",
      description: "Evento al click del button Conferma.",
      table: {
        disable: true
      }
    }
  },
  render: args => {
    //---------Forzare eventi----------------//
    const formHTML = createCollapsibleForm();
    const tempDiv = document.createElement("div");
    tempDiv.innerHTML = formHTML;

    // Cerca il bottone dentro il div temporaneo
    const indietroButton = tempDiv.querySelector("#indietroButton");
    const confermaButton = tempDiv.querySelector("#confermaButton");

    // Se il bottone esiste, aggiungi l'evento click
    if (indietroButton && confermaButton) {
      indietroButton.addEventListener("click", args.onClickIndietro);
      confermaButton.addEventListener("click", args.onClickConferma);
    }

    // Crea il main e appende il bottone all'interno
    const mainElement = document.createElement("main");
    mainElement.id = "contenutoPrincipale";
    mainElement.appendChild(tempDiv);

    // Ritorna il main element con il bottone all'interno
    return mainElement || "";
  }
}`,...c.parameters?.docs?.source}}};r.parameters={...r.parameters,docs:{...r.parameters?.docs,source:{originalSource:`{
  name: "Form Accordion",
  argTypes: {
    onClickIndietro: {
      action: "onClickIndietro",
      description: "Evento al click del button Indietro.",
      table: {
        disable: true
      }
    },
    onClickConferma: {
      action: "onClickConferma",
      description: "Evento al click del button Conferma.",
      table: {
        disable: true
      }
    }
  },
  render: args => {
    //---------Forzare eventi----------------//
    const formHTML = createaccordionForm();
    const tempDiv = document.createElement("div");
    tempDiv.innerHTML = formHTML;

    // Cerca il bottone dentro il div temporaneo
    const indietroButton = tempDiv.querySelector("#indietroButton");
    const confermaButton = tempDiv.querySelector("#confermaButton");

    // Se il bottone esiste, aggiungi l'evento click
    if (indietroButton && confermaButton) {
      indietroButton.addEventListener("click", args.onClickIndietro);
      confermaButton.addEventListener("click", args.onClickConferma);
    }

    // Crea il main e appende il bottone all'interno
    const mainElement = document.createElement("main");
    mainElement.id = "contenutoPrincipale";
    mainElement.appendChild(tempDiv);

    // Ritorna il main element con il bottone all'interno
    return mainElement || "";
  }
}`,...r.parameters?.docs?.source}}};d.parameters={...d.parameters,docs:{...d.parameters?.docs,source:{originalSource:`{
  name: "Form tabellare 1",
  argTypes: {
    onClickAnnulla: {
      action: "onClickAnnulla",
      description: "Evento al click del button Annulla.",
      table: {
        disable: true
      }
    },
    onClickBottoneDestro: {
      action: "onClickBottoneDestro",
      description: "Evento al click del button Destro.",
      table: {
        disable: true
      }
    }
  },
  render: args => {
    //---------Forzare eventi----------------//
    const formHTML = createFormTabelare1();
    const tempDiv = document.createElement("div");
    tempDiv.innerHTML = formHTML;

    // Cerca il bottone dentro il div temporaneo
    const annullaButton = tempDiv.querySelector("#annullaButton");
    const destroButton = tempDiv.querySelector("#destroButton");

    // Se il bottone esiste, aggiungi l'evento click
    if (annullaButton && destroButton) {
      annullaButton.addEventListener("click", args.onClickAnnulla);
      destroButton.addEventListener("click", args.onClickBottoneDestro);
    }

    // Crea il main e appende il bottone all'interno
    const mainElement = document.createElement("main");
    mainElement.id = "contenutoPrincipale";
    mainElement.appendChild(tempDiv);

    // Ritorna il main element con il bottone all'interno
    return mainElement || "";
  }
}`,...d.parameters?.docs?.source}}};m.parameters={...m.parameters,docs:{...m.parameters?.docs,source:{originalSource:`{
  name: "Form tabellare 2",
  argTypes: {
    onClickAnnulla: {
      action: "onClickAnnulla",
      description: "Evento al click del button Annulla.",
      table: {
        disable: true
      }
    },
    onClickBottoneDestro: {
      action: "onClickBottoneDestro",
      description: "Evento al click del button Destro.",
      table: {
        disable: true
      }
    }
  },
  render: args => {
    //---------Forzare eventi----------------//
    const formHTML = createFormTabelare2();
    const tempDiv = document.createElement("div");
    tempDiv.innerHTML = formHTML;

    // Cerca il bottone dentro il div temporaneo
    const annullaButton = tempDiv.querySelector("#annullaButton");
    const destroButton = tempDiv.querySelector("#destroButton");

    // Se il bottone esiste, aggiungi l'evento click
    if (annullaButton && destroButton) {
      annullaButton.addEventListener("click", args.onClickAnnulla);
      destroButton.addEventListener("click", args.onClickBottoneDestro);
    }

    // Crea il main e appende il bottone all'interno
    const mainElement = document.createElement("main");
    mainElement.id = "contenutoPrincipale";
    mainElement.appendChild(tempDiv);

    // Ritorna il main element con il bottone all'interno
    return mainElement || "";
  }
}`,...m.parameters?.docs?.source}}};v.parameters={...v.parameters,docs:{...v.parameters?.docs,source:{originalSource:`{
  name: "Form tabellare 3",
  argTypes: {
    onClickAnnulla: {
      action: "onClickAnnulla",
      description: "Evento al click del button Annulla.",
      table: {
        disable: true
      }
    },
    onClickBottoneDestro: {
      action: "onClickBottoneDestro",
      description: "Evento al click del button Destro.",
      table: {
        disable: true
      }
    }
  },
  render: args => {
    //---------Forzare eventi----------------//
    const formHTML = createFormTabelare3();
    const tempDiv = document.createElement("div");
    tempDiv.innerHTML = formHTML;

    // Cerca il bottone dentro il div temporaneo
    const annullaButton = tempDiv.querySelector("#annullaButton");
    const destroButton = tempDiv.querySelector("#destroButton");

    // Se il bottone esiste, aggiungi l'evento click
    if (annullaButton && destroButton) {
      annullaButton.addEventListener("click", args.onClickAnnulla);
      destroButton.addEventListener("click", args.onClickBottoneDestro);
    }

    // Crea il main e appende il bottone all'interno
    const mainElement = document.createElement("main");
    mainElement.id = "contenutoPrincipale";
    mainElement.appendChild(tempDiv);

    // Ritorna il main element con il bottone all'interno
    return mainElement || "";
  }
}`,...v.parameters?.docs?.source}}};b.parameters={...b.parameters,docs:{...b.parameters?.docs,source:{originalSource:`{
  name: "Form con sezioni",
  decorators: [Story => {
    const storyHtml = Story();
    return \`<main id="contenutoPrincipale">\${storyHtml}</main>\`;
  }],
  render: () => {
    return complexForm();
  }
}`,...b.parameters?.docs?.source}}};p.parameters={...p.parameters,docs:{...p.parameters?.docs,source:{originalSource:`{
  name: "Form con validazione in compilazione",
  decorators: [Story => {
    const storyHtml = Story();
    return \`<main id="contenutoPrincipale">\${storyHtml}</main>\`;
  }],
  render: () => formWithValidation()
}`,...p.parameters?.docs?.source}}};u.parameters={...u.parameters,docs:{...u.parameters?.docs,source:{originalSource:`{
  name: 'Form con validazione al submit',
  decorators: [Story => {
    const storyHtml = Story();
    return \`<main id="contenutoPrincipale">\${storyHtml}</main>\`;
  }],
  render: () => formWithValidationSubmit()
}`,...u.parameters?.docs?.source}}};const S=["BaseForm","DisabledForm","CollapsibleForm","AccordionForm","TableForm1","TableForm2","TableForm3","ComplexForm","ValidationForm","ValidationSubmitForm"];export{r as AccordionForm,n as BaseForm,c as CollapsibleForm,b as ComplexForm,s as DisabledForm,d as TableForm1,m as TableForm2,v as TableForm3,p as ValidationForm,u as ValidationSubmitForm,S as __namedExportsOrder,T as default};
