/* COPYRIGHT Esri - https://js.arcgis.com/5.0/LICENSE.txt */
import{__decorate as e}from"tslib";import t from"../../Color.js";import{watch as o,syncAndInitial as r}from"../../core/reactiveUtils.js";import{property as s,subclass as i}from"../../core/accessorSupport/decorators.js";import n from"../Widget.js";import{loadCalciteComponents as a}from"./componentsUtils.js";import{messageBundle as p,tsx as l}from"./widget.js";const c="esri-color-picker",d={base:c,backgroundPattern:`${c}__bg-pattern`,toggleButton:`${c}__toggle-button`,popover:`${c}__popover`};let u=class extends n{constructor(e,o){super(e,o),this.value=new t,this.alphaEnabled=!0,this._containerElement=null,this._button=null,this._open=!1,this._onColorInput=e=>{const o=e.currentTarget.value,r="string"==typeof o?new t(o):new t;this.value=r,this.onChange?.(r)}}initialize(){this.addHandles(o(()=>({container:this._containerElement,value:this.value}),({container:e,value:t})=>{e?.style.setProperty("--esri-color-picker-value",t.toCss(!0))},r))}loadDependencies(){return a({button:()=>import("@esri/calcite-components/dist/components/calcite-button"),"color-picker":()=>import("@esri/calcite-components/dist/components/calcite-color-picker"),popover:()=>import("@esri/calcite-components/dist/components/calcite-popover")})}render(){const e=this._messages,t=this._open?e.close:e.open;return l("div",{afterCreate:e=>this._containerElement=e,class:this.classes(d.base,this.class)},l("div",{class:d.backgroundPattern,key:"background-pattern"}),l("calcite-button",{afterCreate:e=>this._button=e,appearance:"transparent",class:d.toggleButton,key:"popover-trigger",kind:"neutral",label:t,scale:"s",tabIndex:0,title:t}),l("calcite-popover",{autoClose:!0,class:d.popover,key:"popover",label:e.label,overlayPositioning:"fixed",referenceElement:this._button,topLayerDisabled:this.topLayerDisabled,onCalcitePopoverClose:()=>this._open=!1,onCalcitePopoverOpen:()=>this._open=!0},l("calcite-color-picker",{alphaChannel:this.alphaEnabled,channelsDisabled:!0,key:"color-picker",onclick:e=>{e.stopPropagation()},savedDisabled:!0,value:this.value.toCss(!0),onCalciteColorPickerInput:this._onColorInput})))}};e([s()],u.prototype,"class",void 0),e([s()],u.prototype,"value",void 0),e([s()],u.prototype,"alphaEnabled",void 0),e([s()],u.prototype,"onChange",void 0),e([s()],u.prototype,"_containerElement",void 0),e([s()],u.prototype,"_button",void 0),e([s()],u.prototype,"_open",void 0),e([s(),p("esri/widgets/support/t9n/ColorPicker")],u.prototype,"_messages",void 0),u=e([i("esri.widgets.support.ColorPicker")],u);export{u as ColorPicker};
