const r=[{date:{day:"29",month:"Maggio"},title:"Titolo box",description:"Lorem ipsum dolor sit amet, consectetur adipisicing elit",linkText:"Tutti i dettagli",search:{placeholder:"Testo da cercare..."}},{date:{day:"30",month:"Giugno"},title:"Secondo box",description:"At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium",linkText:"Vedi dettagli",search:{placeholder:"Cerca qualcosa..."}}];function b(){let e=` 
<div id="boxCarousel" class="carouselBox carousel slide" data-ride="carousel">
	<ol class="carousel-indicators">`;return r.forEach((a,i)=>{e+=`
		<li data-target="#boxCarousel" data-slide-to="${i}" ${i===0?'class="active"':""}></li>`}),e+=`
	</ol>
	<div class="carousel-inner">`,r.forEach((a,i)=>{e+=`
		<div class="item ${i===0?"active":""}">
			<div class="col-xs-12 col-md-6">
				<div class="boxDate">
					<div class="date">
						<div class="day">
							<strong>${a.date.day}</strong>
						</div>
						<div class="month"> ${a.date.month}</div>
					</div>
					<div class="descrizione-box">
						<h3 class="titolo-box">${a.title}</h3>
						<div class="meta">${a.description}</div>
						<a href="#" class="btn btn-link linkDettagli">${a.linkText} 
							<span class="fa right fa-angle-double-right"></span>
						</a>
					</div>
				</div>
			</div>
			<div class="col-xs-12 col-md-6">
				<div class="boxDashboard">
					<h3 class="titolo-box">Titolo box ricerca</h3>
					<div class="descrizione-box"> ${a.description}</div>
					<br>
						<form class="row">
							<div class="col-xs-12 col-lg-6 noPaddingLeft">
								<input name="cerca" title="Cerca" class="form-control" placeholder="${a.search.placeholder}">
								</div>
								<div class="col-xs-12 col-lg-6 noPaddingLeft">
									<button class="btn btn-primary" type="button">Cerca</button>
								</div>
							</form>
						</div>
					</div>
				</div>`}),e+=`
			</div>`,e+=`
			<div class="left carousel-control">
				<a title="Scorri al precedente"  href="#boxCarousel" data-slide="prev">
					<span class="fa fa-angle-left" title="Scorri al precedente"></span>
				</a>
			</div>
			<div class="right carousel-control">
				<a title="Scorri al successivo"  href="#boxCarousel" data-slide="next">
					<span class="fa fa-angle-right" title="Scorri al successivo"></span>
				</a>
			</div>
   `,e}function u(){return`<!-- BOX-1 DATA -->
<div class="col-xs-12 col-md-6 noPaddingLeft">
	<div class="boxDate">
		<div class="date">
			<div class="day">
				<strong>29</strong>
			</div>
			<div class="month">Maggio</div>
		</div>
		<div class="descrizione-box">
			<h3 class="titolo-box">Titolo box</h3>
			<div class="meta">Lorem ipsum dolor sit amet, consectetur adipisicing elit</div>
			<a href="#" class="btn btn-link linkDettagli">Tutti i dettagli 
				<span class="fa right fa-angle-double-right"></span>
			</a>
		</div>
	</div>
</div>
<!-- BOX-2 RICERCA -->
<div class="col-xs-12 col-md-6 noPadding">
	<div class="boxDashboard">
		<h3 class="titolo-box">Titolo box ricerca</h3>
		<div class="descrizione-box">Lorem ipsum dolor sit amet</div>
		<br>
			<form class="row">
				<div class="col-xs-12 col-lg-6 noPaddingLeft">
					<label for="input-box-base-1" style="display: none">Cerca</label>
					<input name="cerca" title="Cerca" id="input-box-base-1" class="form-control" placeholder="Testo da cercare...">
					</div>
					<div class="col-xs-12 col-lg-6 noPaddingLeft">
						<button class="btn btn-primary"  type="button">Cerca</button>
					</div>
				</form>
			</div>
		</div>`}const v=`I box presenti nella dashboard possono essere utilizzati come widget per l'accesso rapido a: news, applicazioni, avvisi.

Nel caso di news ed avvisi è possibile accedere ad un approfondimento attraverso al link “Tutti i dettagli”, posto in basso a destra del box.

Nell'esempio viene mostrato un box di ricerca a titolo esemplificativo, infatti è possibile integrare un widget di un'applicazione per una rapida ricerca interna. Es: Ricerca Pratica, Ricerca Codice Sede.

Il Carousel Box Dashboard permette di integrare più Box Dashboard. Sono obbligatori in questo caso i controlli di navigazione: Frecce: per andare avanti e indietro nel carousel Indicatori Circolari: per esplicitare la presenza di altri elementi oltre a quelli visibili sulla pagina `,x={title:"Components/Box e Tab/Box Dashboard",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 "},showAccessibility:!0,mdxPage:v}}},o={render:()=>u()},s={render:()=>b()};var t,l,c;o.parameters={...o.parameters,docs:{...(t=o.parameters)==null?void 0:t.docs,source:{originalSource:`{
  render: () => {
    return CreateDashboardBox();
  }
}`,...(c=(l=o.parameters)==null?void 0:l.docs)==null?void 0:c.source}}};var d,n,p;s.parameters={...s.parameters,docs:{...(d=s.parameters)==null?void 0:d.docs,source:{originalSource:`{
  render: () => {
    return createCarouselDashboardBox();
  }
}`,...(p=(n=s.parameters)==null?void 0:n.docs)==null?void 0:p.source}}};const g=["DashboardBox","CarouselBoxDashboard"];export{s as CarouselBoxDashboard,o as DashboardBox,g as __namedExportsOrder,x as default};
