@arcgis/core/widgets/ValuePicker.js

ArcGIS Maps SDK for JavaScript: A complete 2D and 3D mapping and data visualization API

/*
All material copyright ESRI, All Rights Reserved, unless otherwise specified.
See https://js.arcgis.com/4.32/esri/copyright.txt for details.
*/
import{_ as e}from"../chunks/tslib.es6.js";import{on as t}from"../core/reactiveUtils.js";import{property as o}from"../core/accessorSupport/decorators/property.js";import"../core/has.js";import"../core/Logger.js";import"../core/RandomLCG.js";import{subclass as i}from"../core/accessorSupport/decorators/subclass.js";import s from"./Widget.js";import{loadCalciteComponents as l}from"./support/componentsUtils.js";import{globalCss as a}from"./support/globalCss.js";import"./support/widgetUtils.js";import{messageBundle as r}from"./support/decorators/messageBundle.js";import{vmEvent as n}from"./support/decorators/vmEvent.js";import{tsx as p}from"./support/jsxFactory.js";import c from"./ValuePicker/ValuePickerCollection.js";import u from"./ValuePicker/ValuePickerCombobox.js";import m from"./ValuePicker/ValuePickerLabel.js";import d from"./ValuePicker/ValuePickerSlider.js";import h from"./ValuePicker/ValuePickerViewModel.js";import v from"./ValuePicker/ValuePickerVisibleElements.js";const y="esri-value-picker",b={actionBar:`${y}__action-bar`,caption:`${y}__caption`,captionBorder:`${y}__caption-border`,captionText:`${y}__caption-text`,separator:`${y}__separator`},g={base:null,key:"type",typeMap:{collection:c,combobox:u,label:m,slider:d}};let w=class extends s{constructor(e,t){super(e,t),this.caption=null,this.messages=null,this.messagesCommon=null,this.viewModel=new h,this.visibleElements=new v}initialize(){this.addHandles([t((()=>this.viewModel),"animate",(({first:e})=>{this.component?.animate(e)})),t((()=>this.viewModel),"next",(()=>{this.component?.next()})),t((()=>this.viewModel),"previous",(()=>{this.component?.previous()}))])}loadDependencies(){return l({action:()=>import("@esri/calcite-components/dist/components/calcite-action"),"action-bar":()=>import("@esri/calcite-components/dist/components/calcite-action-bar")})}get canNext(){return this.component?.canNext??!0}get canPlay(){return this.component?.canPlay??!0}get canPrevious(){return this.component?.canPrevious??!0}set component(e){e&&(e.viewModel??=this.viewModel),this._set("component",e)}get disabled(){return this.viewModel.disabled}set disabled(e){this.viewModel.disabled=e}get icon(){return"list-rectangle"}set icon(e){this._overrideIfSome("icon",e)}get label(){return this.messages?.widgetLabel??""}set label(e){this._overrideIfSome("label",e)}get layout(){return this.viewModel.layout}set layout(e){this.viewModel.layout=e}get loop(){return this.viewModel.loop}set loop(e){this.viewModel.loop=e}get playRate(){return this.viewModel.playRate}set playRate(e){this.viewModel.playRate=e}get values(){return this.viewModel.values}set values(e){this.viewModel.values=e}next(){this.viewModel.next()}pause(){this.viewModel.pause()}play(){this.viewModel.play()}previous(){this.viewModel.previous()}render(){const{disabled:e,state:t}=this.viewModel,o="playing"===t,i="horizontal"===this.layout,{control:s,pagination:l}=this.messagesCommon,{pause:r,play:n}=s,{previous:c,up:u,next:m,down:d}=l,h=o?r:n,v=this.visibleElements.playButton&&p("calcite-action",{active:o,alignment:"center",bind:this,disabled:e||!this.canPlay,icon:o?"pause":"play",key:"play",onclick:o?this.pause:this.play,text:h,title:h}),g=i?c:u,w=this.visibleElements.previousButton&&p("calcite-action",{alignment:"center",bind:this,disabled:e||o||!this.canPrevious,icon:i?"chevron-left":"chevron-up",key:"previous",onclick:this.previous,text:g,title:g}),x=i?m:d,k=this.visibleElements.nextButton&&p("calcite-action",{alignment:"center",bind:this,disabled:e||o||!this.canNext,icon:i?"chevron-right":"chevron-down",key:"next",onclick:this.next,text:x,title:x}),M=this.caption&&p("div",{class:b.caption},p("div",{class:b.captionBorder},p("div",{class:b.captionText},this.caption))),P="combobox"===this.component?.type||"label"===this.component?.type||"slider"===this.component?.type,f=(v||w||k)&&(M||P)&&p("div",{class:b.separator}),j=this.component?.render();return p("div",{"aria-label":this.label,class:this.classes(y,a.widget,`${y}__layout--${this.layout}`,`${y}__type--${this.component?.type}`)},p("calcite-action-bar",{class:b.actionBar,expandDisabled:!0,layout:this.layout},[v,w,k,f,M,j]))}};e([o()],w.prototype,"canNext",null),e([o()],w.prototype,"canPlay",null),e([o()],w.prototype,"canPrevious",null),e([o()],w.prototype,"caption",void 0),e([o({types:g,value:null})],w.prototype,"component",null),e([o()],w.prototype,"disabled",null),e([o()],w.prototype,"icon",null),e([o()],w.prototype,"label",null),e([o()],w.prototype,"layout",null),e([o()],w.prototype,"loop",null),e([o(),r("esri/widgets/ValuePicker/t9n/ValuePicker")],w.prototype,"messages",void 0),e([o(),r("esri/t9n/common")],w.prototype,"messagesCommon",void 0),e([o()],w.prototype,"playRate",null),e([o()],w.prototype,"values",null),e([o(),n(["animate","next","pause","play","previous"])],w.prototype,"viewModel",void 0),e([o({type:v,nonNullable:!0})],w.prototype,"visibleElements",void 0),w=e([i("esri.widgets.ValuePicker")],w);const x=w;export{x as default};