/* COPYRIGHT Esri - https://js.arcgis.com/5.1/LICENSE.txt */
import{a as _}from"./BM4VSEDV.js";import{b as m}from"./HVT2WBVC.js";import"./UBPOT5V3.js";import"./ISFTCFSJ.js";import{E as h,F as g,G as u,I as r,h as d,i as s}from"./FFF5HUPM.js";import"./EXBEKVP5.js";var o=class{constructor(){this.pages=[],this.headerText="",this.pages=[]}setPages(e){this.pages=e,this.setDefaultHeaderText()}setDefaultHeaderText(){this.headerText=this.pages.length?this.pages[0].title:""}},f=d`:host{--instant-apps-app-guide-width: 300px;--instant-apps-app-guide-height: 400px;--instant-apps-app-guide-list-item-bubble-size: 22px;width:var(--instant-apps-app-guide-width);height:var(--instant-apps-app-guide-height);display:block}:host calcite-panel{max-width:var(--instant-apps-app-guide-width);max-height:var(--instant-apps-app-guide-height);display:flex}:host calcite-carousel{flex:1;height:fit-content;background-color:var(--calcite-color-foreground-1);overflow:auto}:host [slot=header-content]{display:flex;gap:var(--calcite-spacing-sm);padding-inline-start:.25rem;font-weight:var(--calcite-font-weight-bold)}:host calcite-carousel-item{flex-grow:1;display:flex;flex-direction:column}:host .instant-apps-app-guide__content-wrapper{padding-block-start:.5rem;padding-inline:.5rem;flex-shrink:1;flex-grow:0}:host calcite-icon{--calcite-icon-color: var(--calcite-color-brand)}:host .instant-apps-app-guide__content-list{counter-set:item-counter;margin-inline:0;padding-inline-start:var(--calcite-spacing-xxxl);padding-inline-end:var(--calcite-spacing-lg);position:relative}:host .instant-apps-app-guide__content-list .instant-apps-app-guide__content-list--item{counter-increment:item-counter;margin-block-start:var(--calcite-spacing-lg);display:flex;align-items:flex-start}:host .instant-apps-app-guide__content-list .instant-apps-app-guide__content-list--item:before{content:counter(item-counter);background-color:var(--calcite-color-text-2);color:var(--calcite-color-text-inverse);line-height:var(--calcite-font-line-height-fixed-xl);width:var(--instant-apps-app-guide-list-item-bubble-size);left:0;border-radius:var(--calcite-corner-radius-pill);display:flex;justify-content:center;font-size:var(--calcite-font-size-sm);position:absolute;max-height:var(--instant-apps-app-guide-list-item-bubble-size)}:host .instant-apps-app-guide__content-list .instant-apps-app-guide__content-list--item::marker{color:var(--calcite-color-transparent)}`,l={contentList:"instant-apps-app-guide__content-list",contentListItem:"instant-apps-app-guide__content-list--item",contentWrapper:"instant-apps-app-guide__content-wrapper"},c=class extends u{constructor(){super(...arguments),this._messages=_({name:"instant-apps-app-guide"}),this._viewModel=new o,this._carouselRef=h(),this.header=!0}static{this.properties={headerText:16,header:5,data:0}}static{this.styles=f}load(){this._setContent(this.data)}willUpdate(e){e.has("data")&&this._setContent(this.data),e.has("headerText")&&(this._viewModel.headerText=this.headerText)}_setContent(e){this._viewModel.setPages(e),this.headerText=this._viewModel.headerText}_updateHeaderText(){let{_viewModel:e,_carouselRef:{value:t},_messages:a}=this;if(!(e&&t))return;let i=Array.from(t.children).indexOf(t.selectedItem),n=e?.pages,p=n?.[i]??n[0];this.headerText=p?.title||a.headerText}_getArrowType(){return this._viewModel.pages.length>2?"inline":"none"}render(){let e=this._renderAppGuidePages(this._viewModel.pages),t=this._renderAppGuideHeader();return s`<calcite-panel scale=s>${t}<calcite-carousel label="App Guide" @calciteCarouselChange=${()=>this._updateHeaderText()} .arrowType=${this._getArrowType()} ${g(this._carouselRef)}>${e}</calcite-carousel></calcite-panel>`}_renderAppGuideHeader(){let{_messages:e,header:t,headerText:a}=this,i=!!t&&e.headerText,n=a||e.headerText;return i?s`<span slot=header-content>${n} <calcite-icon icon=lightbulb scale=s></calcite-icon></span>`:null}_renderAppGuidePages(e){return e.map((t,a)=>{let{content:i,type:n,title:p}=t;return s`<calcite-carousel-item .label=${p}><div class=${r(l.contentWrapper)}>${this._renderContentItems(i,n)}</div></calcite-carousel-item>`})}_renderContentItems(e,t){return t==="list"?s`<ol class=${r(l.contentList)}>${e.map((a,i)=>s`<li class=${r(l.contentListItem)}>${a}</li>`)}</ol>`:e.map((a,i)=>s`<p>${a}</p>`)}};m("instant-apps-app-guide",c);export{c as InstantAppsAppGuide};
