import{b as h}from"./Utilities-Jli9PXBn.js";function I({disabilitato:r,inErrore:e,info:E}){const a=["form-control",r?"disabled":""].filter(Boolean).join(" ");return`

	  <div class="row">
		<div class="form-group col-sm-4 noPaddingLeft">
		  <label class="control-label inail-label" id="label-from" for="form-input-1">DA</label>
		  <input type="text" aria-labelledby="${e?"range-error":""} ${e?"error-from":""}"
			class="${a} inail-input ${e?"inail-input-error":""}" 
			id="form-input-1" 
			placeholder="Placeholder" 
			value="" 
			${r?"disabled":""} 
			oninput="validateNumberRange()"
		  >
		  <span id="error-from" class="inail-span-error" style="display: ${e?"inline":"none"};">
			<i class="fa-solid fa-circle-exclamation"></i> Errore: Inserire solo valori numerici
		  </span>
		</div>
	
		<div class="form-group col-sm-4 noPaddingLeft">
		  <label class="control-label inail-label" id="label-TO" for="form-input-2">A</label>
		  <input type="text" aria-labelledby="${e?"range-error":""} ${e?"error-from":""}"
			class="${a} inail-input ${e?"inail-input-error":""}" 
			id="form-input-2" 
			placeholder="Placeholder" 
			value="" 
			${r?"disabled":""} 
			oninput="validateNumberRange()"
		  >
		  <span id="error-to" class="inail-span-error" style="display: ${e?"inline":"none"};">
			<i class="fa-solid fa-circle-exclamation"></i> Errore: Inserire solo valori numerici
		  </span>
		</div>
	
		<div class="col-sm-12 noPaddingLeft">
		  <span id="range-error" class="inail-span-error" style="display: ${e?"inline":"none"};">
			<i class="fa-solid fa-circle-exclamation"></i> Errore: Intervallo non corretto
		  </span>
		</div>
	  </div>
	
	  <script>
		function validateNumberRange() {
		  const fromInput = document.getElementById("form-input-1");
		  const toInput = document.getElementById("form-input-2");
		  const fromError = document.getElementById("error-from");
		  const toError = document.getElementById("error-to");
		  const rangeError = document.getElementById("range-error");
	
		  const fromValue = fromInput.value.trim();
		  const toValue = toInput.value.trim();
	
		  let hasError = false;
	
		  // Validate "DA" input: only show error if value is non-empty and invalid
		  if (fromValue !== "" && isNaN(Number(fromValue))) {
			fromError.style.display = "inline";
			fromInput.classList.add("inail-input-error");
			hasError = true;
		  } else {
			fromError.style.display = "none";
			fromInput.classList.remove("inail-input-error");
		  }
	
		  // Validate "A" input: only show error if value is non-empty and invalid
		  if (toValue !== "" && isNaN(Number(toValue))) {
			toError.style.display = "inline";
			toInput.classList.add("inail-input-error");
			hasError = true;
		  } else {
			toError.style.display = "none";
			toInput.classList.remove("inail-input-error");
		  }
	
		  // Validate the range only if both inputs are non-empty and valid
		  if (fromValue !== "" && toValue !== "" && !hasError && Number(fromValue) > Number(toValue)) {
			rangeError.style.display = "inline";
		  } else {
			rangeError.style.display = "none";
		  }
		}
	  <\/script>
	`}function N(){return` <div class="row">
		<div class="form-group col-sm-4 noPaddingLeft">
		  <label class="control-label inail-label" id="label-from" for="form-input-1">DA</label>
		  <input type="text" class="form-control disabled inail-input" id="form-input-1" placeholder="Placeholder" disabled>
		</div>
	
		<div class="form-group col-sm-4 noPaddingLeft">
		  <label class="control-label inail-label" id="label-TO" for="form-input-2">A</label>
		  <input type="text" class="form-control disabled inail-input" id="form-input-2" placeholder="Placeholder" disabled>
	  </div>`}function R(){return I({disabilitato:!1,inErrore:!0,info:!1})}function V({disabilitato:r,inErrore:e,info:E}){const a=["form-control",r?"disabled":""].filter(Boolean).join(" ");return` <div class="row">
		<div class="col-xs-12 col-sm-6 col-md-4 col-lg-4">
			<div class="form-group">
			<label class="control-label inail-label" id="label-from">DA</label>
				<span role="button" aria-label="Etichetta del campo" tabindex="0" 
			class="fa fa-question-circle fa-lg" 
			data-toggle="popover" 
			data-original-title="Etichetta del campo" 
			data-trigger="focus" 
			data-content="Inserire un suggerimento o una descrizione relativa a questo campo.">
			</span>
			<input 
			aria-labelledby="label-from info-hint-number-range-1"
			type="text"
				class="${a} inail-input ${e?"inail-input-error":""}" 
				id="form-input-1" 
				placeholder="Placeholder" 
				value="" 
				${r?"disabled":""} 
				oninput="validateNumberRange()"
			>
			<span id="error-from" class="inail-span-error" style="display: ${e?"inline":"none"};">
				<i class="fa-solid fa-circle-exclamation"></i> Errore: Inserire solo valori numerici
			</span>
			<span class="inail-span-ht" id="info-hint-number-range-1">*Testo di aiuto</span>
		</div>
		</div>
		<div class="col-xs-12 col-sm-6 col-md-4 col-lg-4">
		<div class="form-group">
			<label class="control-label inail-label" id="label-TO" >A</label>
				<span role="button" aria-label="Etichetta del campo" tabindex="0" 
			class="fa fa-question-circle fa-lg" 
			data-toggle="popover" 
			data-original-title="Etichetta del campo" 
			data-trigger="focus" 
			data-content="Inserire un suggerimento o una descrizione relativa a questo campo.">
			</span>
			<input 
			aria-labelledby="label-TO info-hint-number-range-2"
			type="text"
				class="${a} inail-input ${e?"inail-input-error":""}" 
				id="form-input-2" 
				placeholder="Placeholder" 
				value="" 
				${r?"disabled":""} 
				oninput="validateNumberRange()"
			>
			<span id="error-to" class="inail-span-error" style="display: ${e?"inline":"none"};">
				<i class="fa-solid fa-circle-exclamation"></i> Errore: Inserire solo valori numerici
			</span>

			<span class="inail-span-ht" id="info-hint-number-range-2">*Testo di aiuto</span>
		</div>
		</div>
	
		<div class="col-sm-12 noPaddingLeft">
		  <span id="range-error" class="inail-span-error" style="display: ${e?"inline":"none"};">
			<i class="fa-solid fa-circle-exclamation"></i> Errore: Intervallo non corretto
		  </span>
		</div>
	  </div>
	
	  <script>
		function validateNumberRange() {
		  const fromInput = document.getElementById("form-input-1");
		  const toInput = document.getElementById("form-input-2");
		  const fromError = document.getElementById("error-from");
		  const toError = document.getElementById("error-to");
		  const rangeError = document.getElementById("range-error");
	
		  const fromValue = fromInput.value.trim();
		  const toValue = toInput.value.trim();
	
		  let hasError = false;
	
		  // Validate "DA" input: only show error if value is non-empty and invalid
		  if (fromValue !== "" && isNaN(Number(fromValue))) {
			fromError.style.display = "inline";
			fromInput.classList.add("inail-input-error");
			hasError = true;
		  } else {
			fromError.style.display = "none";
			fromInput.classList.remove("inail-input-error");
		  }
	
		  // Validate "A" input: only show error if value is non-empty and invalid
		  if (toValue !== "" && isNaN(Number(toValue))) {
			toError.style.display = "inline";
			toInput.classList.add("inail-input-error");
			hasError = true;
		  } else {
			toError.style.display = "none";
			toInput.classList.remove("inail-input-error");
		  }
	
		  // Validate the range only if both inputs are non-empty and valid
		  if (fromValue !== "" && toValue !== "" && !hasError && Number(fromValue) > Number(toValue)) {
			rangeError.style.display = "inline";
		  } else {
			rangeError.style.display = "none";
		  }
		}
	  <\/script>
	  `}const x={title:"Componenti/Form Items/Input number range",decorators:[(r,e)=>h(r,e,4,["static-webkit/js/custom-webkit.js","assets/js/custom-input-number-range.js"],!0),r=>`<main id="contenutoPrincipale">${r()}</main>`]},n={name:"Range di input numerico",argTypes:{disabilitato:{control:"boolean"},inErrore:{control:"boolean"},info:{control:"boolean"}},args:{disabilitato:!1,inErrore:!1,info:!1},render:r=>I(r)},o={name:"Range di input numerico disabilitato",render:()=>N()},i={name:"Range di input numerico con errore",render:()=>R()},l={argTypes:{disabilitato:{control:"boolean"},inErrore:{control:"boolean"},info:{control:"boolean"}},args:{disabilitato:!1,inErrore:!1,info:!0},name:"Range di input numerico di info",render:r=>V(r)};var t,s,d;n.parameters={...n.parameters,docs:{...(t=n.parameters)==null?void 0:t.docs,source:{originalSource:`{
  name: "Range di input numerico",
  argTypes: {
    disabilitato: {
      control: "boolean"
    },
    inErrore: {
      control: "boolean"
    },
    info: {
      control: "boolean"
    }
  },
  args: {
    disabilitato: false,
    inErrore: false,
    info: false
  },
  render: args => CreateInputNumberRange(args)
}`,...(d=(s=n.parameters)==null?void 0:s.docs)==null?void 0:d.source}}};var u,c,m;o.parameters={...o.parameters,docs:{...(u=o.parameters)==null?void 0:u.docs,source:{originalSource:`{
  name: "Range di input numerico disabilitato",
  render: () => createInputNumberRangeDisabled()
}`,...(m=(c=o.parameters)==null?void 0:c.docs)==null?void 0:m.source}}};var p,f,b;i.parameters={...i.parameters,docs:{...(p=i.parameters)==null?void 0:p.docs,source:{originalSource:`{
  name: "Range di input numerico con errore",
  render: () => createInputNumberRangeError()
}`,...(b=(f=i.parameters)==null?void 0:f.docs)==null?void 0:b.source}}};var g,y,v;l.parameters={...l.parameters,docs:{...(g=l.parameters)==null?void 0:g.docs,source:{originalSource:`{
  argTypes: {
    disabilitato: {
      control: "boolean"
    },
    inErrore: {
      control: "boolean"
    },
    info: {
      control: "boolean"
    }
  },
  args: {
    disabilitato: false,
    inErrore: false,
    info: true
  },
  name: "Range di input numerico di info",
  render: args => createInputNumberRangeInfo(args)
}`,...(v=(y=l.parameters)==null?void 0:y.docs)==null?void 0:v.source}}};const L=["CampiInputNumberRange","CampiInputNumberRangeDisabled","CampiInputNumberRangeError","CampiInputNumberRangeInfo"];export{n as CampiInputNumberRange,o as CampiInputNumberRangeDisabled,i as CampiInputNumberRangeError,l as CampiInputNumberRangeInfo,L as __namedExportsOrder,x as default};
