@arcgis/map-components/dist/cdn/2ZWF75SV.js

ArcGIS Map Components

/*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
See https://js.arcgis.com/4.33/esri/copyright.txt for details.
v4.33.13 */
import{P as o,U as n,j as s,k as t}from"./HX57SHRL.js";export default $arcgis.t(([d,{watch:v}])=>{var $=s`.arcgis-video-player__settings-flow{min-width:var(--calcite-size-160)}`,g=["Auto"],_=[{label:"0.25x",value:.25},{label:"0.5x",value:.5},{label:"1x",value:1},{label:"1.5x",value:1.5},{label:"2x",value:2}],r=new d([255,127,0]),a=class extends o{constructor(){super(...arguments),this._color=null,this._speed="1x",this._quality="Auto",this._disabled=!1}static{this.properties={_disabled:16,_active:16,viewModel:0,messages:0}}static{this.styles=$}loaded(){this.manager.onLifecycle(()=>[v(()=>this.viewModel.state,l=>{this._disabled=l==="not-ready"||l==="waiting"},{initial:!0})])}render(){let{viewModel:l,messages:e}=this,h=t`<calcite-flow-item .heading=${e.playbackSpeed} .selected=${this._active==="speed"} @calciteFlowItemBack=${()=>this._active=void 0}><calcite-list .label=${e.playbackSpeed} selection-mode=single-persist>${_.map(({label:i,value:c})=>t`<calcite-list-item .label=${i} @click=${()=>{this._speed=i,l.changePlaybackSpeed(c)}} .selected=${i===this._speed}></calcite-list-item>`)}</calcite-list></calcite-flow-item>`,p=t`<calcite-flow-item .heading=${e.quality} .selected=${this._active==="quality"} @calciteFlowItemBack=${()=>this._active=void 0}><calcite-list .label=${e.quality} selection-mode=single-persist>${g.map(i=>t`<calcite-list-item .label=${i} @click=${()=>this._quality=i} .selected=${i===this._quality}></calcite-list-item>`)}</calcite-list></calcite-flow-item>`,m=t`<calcite-flow-item .heading=${e.graphics} .selected=${this._active==="color"} @calciteFlowItemBack=${()=>this._active=void 0}><calcite-block .heading=${e.color} expanded><calcite-color-picker channels-disabled format=hex saved-disabled scale=s .value=${this._color?.toHex()??r.toHex()} @calciteColorPickerChange=${({currentTarget:i})=>{let c=i.value?.toString()??null;this._color=c?new d(c):null,this._color&&l.changeGraphicsColor(this._color)}}></calcite-color-picker></calcite-block></calcite-flow-item>`;return t`<div><calcite-popover auto-close .label=${e.settings} overlay-positioning=fixed placement=top-end pointer-disabled reference-element=settings-action scale=s @calcitePopoverClose=${()=>this._active=void 0}><calcite-flow class=arcgis-video-player__settings-flow><calcite-flow-item heading=Settings .selected=${!this._active}><calcite-list .label=${e.settings}><calcite-list-item .label=${e.speed} @click=${()=>this._active="speed"}><div slot=content-end><calcite-chip .label=${this._speed} scale=s>${this._speed}</calcite-chip></div><calcite-icon icon=chevron-right scale=s slot=content-end></calcite-icon></calcite-list-item><calcite-list-item .label=${e.quality} @click=${()=>this._active="quality"}><div slot=content-end><calcite-chip .label=${this._quality} scale=s>${this._quality}</calcite-chip></div><calcite-icon icon=chevron-right scale=s slot=content-end></calcite-icon></calcite-list-item><calcite-list-item .label=${e.graphics} @click=${()=>this._active="color"}><calcite-color-picker-swatch .color=${this._color?.toString()??r.toString()} scale=s slot=content-end></calcite-color-picker-swatch><calcite-icon icon=chevron-right scale=s slot=content-end></calcite-icon></calcite-list-item></calcite-list></calcite-flow-item>${this._active==="speed"?h:null}${this._active==="quality"?p:null}${this._active==="color"?m:null}</calcite-flow></calcite-popover><calcite-action alignment=center .disabled=${this._disabled} icon=sliders id=settings-action scale=s slot=trigger .text=${e.settings}></calcite-action></div>`}};n("arcgis-video-player-settings",a);return a},"Color","core/reactiveUtils")