@arcgis/coding-components
Version:
ArcGIS Coding Components
3 lines (2 loc) • 4.98 kB
JavaScript
/* COPYRIGHT Esri - https://js.arcgis.com/5.1/LICENSE.txt */
import{a as n}from"./MX2KP5HW.js";import{a as g}from"./FCL3JVE7.js";import"./JWPKZHE4.js";import{a as f}from"./KBTQTCIT.js";import"./PHPFOWGJ.js";import"./GS2ISVXJ.js";import{g as p,h as u}from"./6G5URSC7.js";import{F as a,G as m,K as h,h as d,j as l,n as c,s as o}from"./2FGVSLMQ.js";import"./Y3KOWWO5.js";import"./3TTFCHAA.js";var b=d`:host{background-color:var(--calcite-color-foreground-1);.notice-container{margin:var(--calcite-spacing-xxs);padding:var(--calcite-spacing-sm);background-color:var(--calcite-color-foreground-1)}calcite-flow{height:100%}calcite-block{p:first-of-type{margin-top:0}}calcite-list-item-group{background-color:var(--calcite-color-foreground-2)}calcite-flow{[slot=footer]{word-break:break-word}}.container{block-size:100%;display:grid;grid-template-rows:auto 1fr;overflow:hidden}.scrollable{min-block-size:0;overflow:auto}}`,r=class extends m{constructor(){super(...arguments),this.messages=f(),this._unselectItem=async()=>{this._selectedApiItem=void 0},this._filterValue="",this.languageId="arcade",this.hideDocumentationActions=!1,this.loading=!1,this.closed=!1,this.arcgisInternalClosePanel=c({bubbles:!1,composed:!1}),this.arcgisInternalItemSelected=c({bubbles:!1,composed:!1})}static{this.properties={_filterValue:16,_selectedApiItem:16,languageId:1,apiLibrary:0,hideDocumentationActions:5,loading:5,closed:5}}static{this.styles=b}willUpdate(e){if(e.has("apiLibrary")){if(!this._selectedApiItem)return;for(let i of this.apiLibrary??[])for(let t of i.items)if(t.name===this._selectedApiItem.name){this._selectedApiItem=t;return}this._selectedApiItem=void 0}}disconnectedCallback(){super.disconnectedCallback(),this._flowObserver?.disconnect()}flowFocusHandler(e){if(!e){this._flowObserver?.disconnect(),this._flowObserver=void 0;return}this._flowObserver||(this._flowObserver=new MutationObserver(()=>{u(e.querySelector("calcite-flow-item:last-child"),"calcite-input")}),this._flowObserver.observe(e,{attributes:!0,attributeFilter:["id"],childList:!0}))}_emitItemSelected(e,i){if(!i)return;let t=e;(!t.key||t.key==="Enter")&&(e.preventDefault(),this.arcgisInternalItemSelected.emit(i.completion.insertText??""))}_emitClose(){this.arcgisInternalClosePanel.emit()}_emitItemSelectedAndClose(e,i){let t=e;(!t.key||t.key==="Enter")&&(e.preventDefault(),this.arcgisInternalItemSelected.emit(i.completion.insertText??""))}_selectItem(e,i){e.stopPropagation(),this._selectedApiItem=i}_updateFilterValue(e){this._filterValue=e.currentTarget.value??""}_elementToMarkdown(e){e!==void 0&&(e.innerHTML=n(this._selectedApiItem.examples))}renderApiCategory(e){let i=g(e.items,"name",this._filterValue);return i.length?l`<calcite-list-item-group .heading=${e.title}>${i.map(t=>l`<calcite-list-item .label=${o(t.completion.detail)} =${s=>this._emitItemSelected(s,t)} =${s=>this._emitItemSelected(s,t)}><calcite-action slot=actions-end .text=${this.messages.expand??""} icon=chevron-right icon-flip-rtl scale=s =${s=>this._selectItem(s,t)}></calcite-action></calcite-list-item>`)}</calcite-list-item-group>`:null}renderApiItemFlowItem(){let e=this._selectedApiItem;return e?l`<calcite-flow-item heading-level=2 .heading=${this.messages.constantsandfunctions} .beforeBack=${this._unselectItem} closable =${this._emitClose} selected>${this.hideDocumentationActions?null:l`<calcite-button width=half slot=footer appearance=outline kind=brand scale=s .href=${e.link} target=Help icon-start=information>${this.messages.moreinformation}</calcite-button>`}<calcite-button .width=${this.hideDocumentationActions?"full":"half"} slot=footer appearance=outline kind=brand icon-start=code scale=s =${i=>this._emitItemSelectedAndClose(i,e)} ${a(p)}>${this.messages.insert}</calcite-button><calcite-block expanded .heading=${o(e.completion.detail)}><div .innerHTML=${n(e.completion.documentation)??""}></div>${e.examples?l`<div ${a(this._elementToMarkdown)}></div>`:null}</calcite-block></calcite-flow-item>`:null}render(){if(this.closed)return null;let e=(this.apiLibrary??[]).map(t=>this.renderApiCategory(t)),i=e.every(t=>!t);return l`<calcite-flow ${a(this.flowFocusHandler)}><calcite-flow-item heading-level=2 .heading=${this.messages.constantsandfunctions} closable =${this._emitClose} .selected=${!this._selectedApiItem}><div class="container"><calcite-input .value=${this._filterValue} icon=magnifying-glass clearable =${this._updateFilterValue} scale=m></calcite-input><div class="scrollable">${this.loading?l`<calcite-loader scale=s type=indeterminate .label=${this.messages.loading??"Loading"}></calcite-loader>`:l`<calcite-list .label=${this.messages.api??"API"}>${i?l`<div class="notice-container">${this.messages.noitems}</div>`:e}</calcite-list>`}</div></div></calcite-flow-item>${this.renderApiItemFlowItem()}</calcite-flow>`}};h("arcgis-language-api-panel",r);export{r as ArcgisLanguageApiPanel};