@esri/calcite-components 2.13.0 → 2.14.0-next.1

package/dist/calcite/p-87fff13e.entry.js

@@ -1,7 +0,0 @@
-/*!
- * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
- * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.13.0
- */
-import{r as t,c as s,h as i,g as e,F as n}from"./p-0a2f91d4.js";import{C as o,n as a,a as l,b as c,o as r,c as h,d,D as u,e as p,f,g as m,p as b,j as g,k as w,R as x,H as y,O as C,t as v,l as k,m as A,S,q as I,r as z,s as D,u as $,i as F,v as j,w as O}from"./p-d739d936.js";import{u as L,g as N,f as P,d as K,i as T}from"./p-806dc8f8.js";import{u as U,I as E}from"./p-a805c9c4.js";import{i as M}from"./p-103c1961.js";import{c as H,s as _,a as B}from"./p-65e04a6e.js";import{c as R,d as V}from"./p-2abe8907.js";import{r as q,c as W,a as J}from"./p-9e9191b2.js";import{u as X,s as G,c as Y,d as Q}from"./p-f0661425.js";import{t as Z}from"./p-669832e1.js";import"./p-39b20f1d.js";import"./p-cedaddf4.js";import"./p-df6c8bd7.js";import"./p-966e4808.js";import"./p-0276629a.js";const tt=':host([disabled]){cursor:default;-webkit-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}:host([disabled]) *,:host([disabled]) ::slotted(*){pointer-events:none}:host{display:inline-block;font-size:var(--calcite-font-size--2);line-height:1rem;font-weight:var(--calcite-font-weight-normal)}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}.interaction-container{display:contents}:host([scale=s]){--calcite-color-picker-spacing:8px}:host([scale=s]) .container{inline-size:160px}:host([scale=s]) .saved-colors{gap:0.25rem;grid-template-columns:repeat(auto-fill, 20px)}:host([scale=m]){--calcite-color-picker-spacing:12px}:host([scale=m]) .container{inline-size:272px}:host([scale=l]){--calcite-color-picker-spacing:16px;font-size:var(--calcite-font-size--1);line-height:1rem}:host([scale=l]) .container{inline-size:464px}:host([scale=l]) .section:first-of-type{padding-block-start:var(--calcite-color-picker-spacing)}:host([scale=l]) .saved-colors{grid-template-columns:repeat(auto-fill, 32px)}:host([scale=l]) .control-section{flex-wrap:nowrap;align-items:baseline;flex-wrap:wrap}:host([scale=l]) .color-hex-options{display:flex;flex-shrink:1;flex-direction:column;justify-content:space-around}:host([scale=l]) .color-mode-container{flex-shrink:3}.container{background-color:var(--calcite-color-foreground-1);display:inline-block;border:1px solid var(--calcite-color-border-1)}.control-and-scope{position:relative;display:flex;cursor:pointer;touch-action:none}.color-field,.control-and-scope{-webkit-user-select:none;user-select:none}.scope{pointer-events:none;position:absolute;z-index:var(--calcite-z-index);block-size:1px;inline-size:1px;border-radius:9999px;background-color:transparent;font-size:var(--calcite-font-size--1);outline-color:transparent}.scope:focus{outline:2px solid var(--calcite-ui-focus-color, var(--calcite-color-brand));outline-offset:calc(\n            2px *\n            calc(\n              1 -\n              2 * clamp(\n                0,\n                var(--calcite-offset-invert-focus),\n                1\n              )\n            )\n          );outline-offset:6px}.hex-and-channels-group{inline-size:100%}.hex-and-channels-group,.control-section{display:flex;flex-direction:row;flex-wrap:wrap}.section{padding-block:0 var(--calcite-color-picker-spacing);padding-inline:var(--calcite-color-picker-spacing)}.section:first-of-type{padding-block-start:var(--calcite-color-picker-spacing)}.sliders{display:flex;flex-direction:column;justify-content:space-between;margin-inline-start:var(--calcite-color-picker-spacing);gap:var(--calcite-spacing-xxs)}.preview-and-sliders{display:flex;align-items:center;padding:var(--calcite-color-picker-spacing)}.color-hex-options,.section--split{flex-grow:1}.header{display:flex;align-items:center;justify-content:space-between;color:var(--calcite-color-text-1)}.color-mode-container{padding-block-start:var(--calcite-color-picker-spacing)}.channels{display:flex;row-gap:0.125rem}.channel[data-channel-index="3"]{inline-size:159px}:host([scale=s]) .channels{flex-wrap:wrap}:host([scale=s]) .channel{flex-basis:30%;flex-grow:1}:host([scale=s]) .channel[data-channel-index="3"]{inline-size:unset;margin-inline-start:unset}:host([scale=l]) .channel[data-channel-index="3"]{inline-size:131px}.saved-colors{display:grid;gap:0.5rem;padding-block-start:var(--calcite-color-picker-spacing);grid-template-columns:repeat(auto-fill, 24px)}.saved-colors-buttons{display:flex}.saved-color{outline-offset:0;outline-color:transparent;cursor:pointer}.saved-color:focus{outline:2px solid var(--calcite-color-brand);outline-offset:2px}.saved-color:hover{transition:outline-color var(--calcite-internal-animation-timing-fast) ease-in-out;outline:2px solid var(--calcite-color-border-2);outline-offset:2px}:host([hidden]){display:none}[hidden]{display:none}';const st=tt;const it=16;const et=class{constructor(e){t(this,e);this.calciteColorPickerChange=s(this,"calciteColorPickerChange",6);this.calciteColorPickerInput=s(this,"calciteColorPickerInput",6);this.internalColorUpdateContext=null;this.isActiveChannelInputEmpty=false;this.mode=o.HEX;this.shiftKeyChannelAdjustment=0;this.upOrDownArrowKeyTracker=null;this.handleTabActivate=t=>{this.channelMode=t.currentTarget.getAttribute("data-color-mode");this.updateChannelsFromColor(this.color)};this.handleColorFieldScopeKeyDown=t=>{const{key:s}=t;const i={ArrowUp:{x:0,y:-10},ArrowRight:{x:10,y:0},ArrowDown:{x:0,y:10},ArrowLeft:{x:-10,y:0}};if(i[s]){t.preventDefault();this.scopeOrientation=s==="ArrowDown"||s==="ArrowUp"?"vertical":"horizontal";this.captureColorFieldColor(this.colorFieldScopeLeft+i[s].x||0,this.colorFieldScopeTop+i[s].y||0,false)}};this.handleHueScopeKeyDown=t=>{const s=t.shiftKey?10:1;const{key:i}=t;const e={ArrowUp:1,ArrowRight:1,ArrowDown:-1,ArrowLeft:-1};if(e[i]){t.preventDefault();const n=e[i]*s;const o=this.baseColorFieldColor.hue();const a=this.baseColorFieldColor.hue(o+n);this.internalColorSet(a,false)}};this.handleHexInputChange=t=>{t.stopPropagation();const{isClearable:s,color:i}=this;const e=t.target;const n=e.value;if(s&&!n){this.internalColorSet(null);return}const o=i&&a(l(i,f(this.mode)));if(n!==o){this.internalColorSet(c(n))}};this.handleSavedColorSelect=t=>{const s=t.currentTarget;this.internalColorSet(c(s.color))};this.handleChannelInput=t=>{const s=t.currentTarget;const i=Number(s.getAttribute("data-channel-index"));const e=i===3;const n=e?C.max:this.channelMode==="rgb"?x[Object.keys(x)[i]]:y[Object.keys(y)[i]];let o;if(!s.value){o="";this.isActiveChannelInputEmpty=true;this.upOrDownArrowKeyTracker=null}else{const t=Number(s.value);const i=t+this.shiftKeyChannelAdjustment;const e=W(i,0,n);o=e.toString()}s.value=o;if(o!==""&&this.shiftKeyChannelAdjustment!==0){this.handleChannelChange(t)}else if(o!==""){this.handleChannelChange(t)}};this.handleChannelBlur=t=>{const s=t.currentTarget;const i=Number(s.getAttribute("data-channel-index"));const e=[...this.channels];const n=!s.value&&!this.isClearable;if(n){s.value=e[i]?.toString()}};this.handleChannelFocus=t=>{const s=t.currentTarget;s.selectText()};this.handleChannelChange=t=>{const s=t.currentTarget;const i=Number(s.getAttribute("data-channel-index"));const e=[...this.channels];const n=this.isClearable&&!s.value;if(n){this.channels=[null,null,null,null];this.internalColorSet(null);return}const o=i===3;if(this.isActiveChannelInputEmpty&&this.upOrDownArrowKeyTracker){s.value=this.upOrDownArrowKeyTracker==="up"?(e[i]+1<=this.getChannelInputLimit(i)?e[i]+1:this.getChannelInputLimit(i)).toString():(e[i]-1>=0?e[i]-1:0).toString();this.isActiveChannelInputEmpty=false;this.upOrDownArrowKeyTracker=null}const a=s.value?Number(s.value):e[i];e[i]=o?r(a):a;this.updateColorFromChannels(e)};this.handleSavedColorKeyDown=t=>{if(M(t.key)){t.preventDefault();this.handleSavedColorSelect(t)}};this.handleColorFieldPointerDown=t=>{this.handleCanvasControlPointerDown(t,this.colorFieldRenderingContext,this.captureColorFieldColor,this.colorFieldScopeNode)};this.handleHueSliderPointerDown=t=>{this.handleCanvasControlPointerDown(t,this.hueSliderRenderingContext,this.captureHueSliderColor,this.hueScopeNode)};this.handleOpacitySliderPointerDown=t=>{this.handleCanvasControlPointerDown(t,this.opacitySliderRenderingContext,this.captureOpacitySliderValue,this.opacityScopeNode)};this.globalPointerUpHandler=t=>{if(!L(t)){return}const s=this.activeCanvasInfo;this.activeCanvasInfo=null;this.drawColorControls();if(s){this.calciteColorPickerChange.emit()}};this.globalPointerMoveHandler=t=>{const{activeCanvasInfo:s,el:i}=this;if(!i.isConnected||!s){return}const{context:e,bounds:n}=s;let o;let a;const{clientX:l,clientY:c}=t;if(e.canvas.matches(":hover")){o=l-n.x;a=c-n.y}else{if(l<n.x+n.width&&l>n.x){o=l-n.x}else if(l<n.x){o=0}else{o=n.width}if(c<n.y+n.height&&c>n.y){a=c-n.y}else if(c<n.y){a=0}else{a=n.height}}if(e===this.colorFieldRenderingContext){this.captureColorFieldColor(o,a,false)}else if(e===this.hueSliderRenderingContext){this.captureHueSliderColor(o)}else if(e===this.opacitySliderRenderingContext){this.captureOpacitySliderValue(o)}};this.storeColorFieldScope=t=>{this.colorFieldScopeNode=t};this.storeHueScope=t=>{this.hueScopeNode=t};this.renderChannelsTabTitle=t=>{const{channelMode:s,messages:e}=this;const n=t===s;const o=t==="rgb"?e.rgb:e.hsv;return i("calcite-tab-title",{class:h.colorMode,"data-color-mode":t,key:t,onCalciteTabsActivate:this.handleTabActivate,selected:n},o)};this.renderChannelsTab=t=>{const{isClearable:s,channelMode:e,channels:n,messages:o,alphaChannel:a}=this;const l=t===e;const c=t==="rgb";const r=c?[o.red,o.green,o.blue]:[o.hue,o.saturation,o.value];const u=N(this.el);const p=a?n:n.slice(0,3);return i("calcite-tab",{class:h.control,key:t,selected:l},i("div",{class:h.channels,dir:"ltr"},p.map(((t,i)=>{const e=i===3;if(e){t=s&&!t?t:d(t)}return this.renderChannel(t,i,r[i],u,e?"%":"")}))))};this.renderChannel=(t,s,e,n,o)=>i("calcite-input-number",{class:h.channel,"data-channel-index":s,dir:n,key:s,label:e,lang:this.effectiveLocale,numberButtonType:"none",numberingSystem:this.numberingSystem,onCalciteInputNumberChange:this.handleChannelChange,onCalciteInputNumberInput:this.handleChannelInput,onCalciteInternalInputNumberBlur:this.handleChannelBlur,onCalciteInternalInputNumberFocus:this.handleChannelFocus,onKeyDown:this.handleKeyDown,scale:this.scale==="l"?"m":"s",style:{marginLeft:s>0&&!(this.scale==="s"&&this.alphaChannel&&s===3)?"-1px":""},suffixText:o,value:t?.toString()});this.deleteColor=()=>{const t=l(this.color,this.alphaChannel);const s=this.savedColors.indexOf(t)>-1;if(!s){return}const i=this.savedColors.filter((s=>s!==t));this.savedColors=i;const e=`${I}${this.storageId}`;if(this.storageId){localStorage.setItem(e,JSON.stringify(i))}};this.saveColor=()=>{const t=l(this.color,this.alphaChannel);const s=this.savedColors.indexOf(t)>-1;if(s){return}const i=[...this.savedColors,t];this.savedColors=i;const e=`${I}${this.storageId}`;if(this.storageId){localStorage.setItem(e,JSON.stringify(i))}};this.drawColorControls=Z(((t="all")=>{if((t==="all"||t==="color-field")&&this.colorFieldRenderingContext){this.drawColorField()}if((t==="all"||t==="hue-slider")&&this.hueSliderRenderingContext){this.drawHueSlider()}if(this.alphaChannel&&(t==="all"||t==="opacity-slider")&&this.opacitySliderRenderingContext){this.drawOpacitySlider()}}),it);this.captureColorFieldColor=(t,s,i=true)=>{const{dimensions:{colorField:{height:e,width:n}}}=this;const o=Math.round(y.s/n*t);const a=Math.round(y.v/e*(e-s));this.internalColorSet(this.baseColorFieldColor.hsv().saturationv(o).value(a),i)};this.initColorField=t=>{this.colorFieldRenderingContext=t.getContext("2d");this.updateCanvasSize("color-field");this.drawColorControls()};this.initHueSlider=t=>{this.hueSliderRenderingContext=t.getContext("2d");this.updateCanvasSize("hue-slider");this.drawHueSlider()};this.initOpacitySlider=t=>{if(!t){return}this.opacitySliderRenderingContext=t.getContext("2d");this.updateCanvasSize("opacity-slider");this.drawOpacitySlider()};this.storeOpacityScope=t=>{this.opacityScopeNode=t};this.handleOpacityScopeKeyDown=t=>{const s=t.shiftKey?10:1;const{key:i}=t;const e={ArrowUp:.01,ArrowRight:.01,ArrowDown:-.01,ArrowLeft:-.01};if(e[i]){t.preventDefault();const n=e[i]*s;const o=this.baseColorFieldColor.alpha();const a=this.baseColorFieldColor.alpha(o+n);this.internalColorSet(a,false)}};this.allowEmpty=false;this.alphaChannel=false;this.channelsDisabled=false;this.clearable=false;this.color=u;this.disabled=false;this.format="auto";this.hideChannels=false;this.hexDisabled=false;this.hideHex=false;this.hideSaved=false;this.savedDisabled=false;this.scale="m";this.storageId=undefined;this.messageOverrides=undefined;this.numberingSystem=undefined;this.value=a(l(u,this.alphaChannel));this.channelMode="rgb";this.channels=this.toChannels(u);this.defaultMessages=undefined;this.dimensions=p.m;this.effectiveLocale="";this.messages=undefined;this.savedColors=[];this.colorFieldScopeTop=undefined;this.colorFieldScopeLeft=undefined;this.hueScopeLeft=undefined;this.opacityScopeLeft=undefined;this.scopeOrientation=undefined}handleAllowEmptyOrClearableChange(){this.isClearable=this.clearable||this.allowEmpty}handleAlphaChannelChange(t){const{format:s}=this;if(t&&s!=="auto"&&!f(s)){console.warn(`ignoring alphaChannel as the current format (${s}) does not support alpha`);this.alphaChannel=false}}handleAlphaChannelDimensionsChange(){this.effectiveSliderWidth=m(this.dimensions,this.alphaChannel);this.drawColorControls()}handleColorChange(t,s){this.drawColorControls();this.updateChannelsFromColor(t);this.previousColor=s}handleFormatOrAlphaChannelChange(){this.setMode(this.format);this.internalColorSet(this.color,false,"internal")}handleScaleChange(t="m"){this.updateDimensions(t);this.updateCanvasSize("all");this.drawColorControls()}onMessagesChange(){}handleValueChange(t,s){const{isClearable:i,format:e}=this;const n=!i||t;let o=false;if(n){const i=b(t);if(!i||e!=="auto"&&i!==e){this.showIncompatibleColorWarning(t,e);this.value=s;return}o=this.mode!==i;this.setMode(i,this.internalColorUpdateContext===null)}const a=this.activeCanvasInfo;if(this.internalColorUpdateContext==="initial"){return}if(this.internalColorUpdateContext==="user-interaction"){this.calciteColorPickerInput.emit();if(!a){this.calciteColorPickerChange.emit()}return}const l=i&&!t?null:c(t!=null&&typeof t==="object"&&f(this.mode)?g(t):t);const r=!w(l,this.color);if(o||r){this.internalColorSet(l,this.alphaChannel&&!(this.mode.endsWith("a")||this.mode.endsWith("a-css")),"internal")}}get baseColorFieldColor(){return this.color||this.previousColor||u}effectiveLocaleChange(){X(this,this.effectiveLocale)}handleChannelKeyUpOrDown(t){this.shiftKeyChannelAdjustment=0;const{key:s}=t;if(s!=="ArrowUp"&&s!=="ArrowDown"||!t.composedPath().some((t=>t.classList?.contains(h.channel)))){return}const{shiftKey:i}=t;t.preventDefault();if(!this.color){this.internalColorSet(this.previousColor);t.stopPropagation();return}const e=9;this.shiftKeyChannelAdjustment=s==="ArrowUp"&&i?e:s==="ArrowDown"&&i?-e:0;if(s==="ArrowUp"){this.upOrDownArrowKeyTracker="up"}if(s==="ArrowDown"){this.upOrDownArrowKeyTracker="down"}}getChannelInputLimit(t){return this.channelMode==="rgb"?x[Object.keys(x)[t]]:y[Object.keys(y)[t]]}focusScope(t){requestAnimationFrame((()=>{t.focus()}))}handleCanvasControlPointerDown(t,s,i,e){if(!L(t)){return}window.addEventListener("pointermove",this.globalPointerMoveHandler);window.addEventListener("pointerup",this.globalPointerUpHandler,{once:true});this.activeCanvasInfo={context:s,bounds:s.canvas.getBoundingClientRect()};i.call(this,t.offsetX,t.offsetY);this.focusScope(e)}async setFocus(){await H(this);P(this.el)}async componentWillLoad(){_(this);this.handleAllowEmptyOrClearableChange();this.handleAlphaChannelDimensionsChange();const{isClearable:t,color:s,format:i,value:e}=this;const n=t&&!e;const o=b(e);const a=n||i==="auto"&&o||i===o;const l=n?null:a?c(e):s;if(!a){this.showIncompatibleColorWarning(e,i)}this.setMode(i,false);this.internalColorSet(l,false,"initial");this.updateDimensions(this.scale);const r=`${I}${this.storageId}`;if(this.storageId&&localStorage.getItem(r)){this.savedColors=JSON.parse(localStorage.getItem(r))}await G(this)}connectedCallback(){R(this);Y(this)}componentDidLoad(){B(this)}disconnectedCallback(){window.removeEventListener("pointermove",this.globalPointerMoveHandler);window.removeEventListener("pointerup",this.globalPointerUpHandler);V(this);Q(this)}componentDidRender(){U(this)}render(){const{channelsDisabled:t,color:s,colorFieldScopeLeft:e,colorFieldScopeTop:n,dimensions:{thumb:{radius:o}},hexDisabled:a,hideChannels:c,hideHex:r,hideSaved:p,hueScopeLeft:f,messages:m,alphaChannel:b,opacityScopeLeft:g,savedColors:w,savedDisabled:x,scale:v,scopeOrientation:k}=this;const A=this.effectiveSliderWidth;const S=s?l(s,b):null;const I=o;const z=f??A*u.hue()/y.h;const D=o;const $=g??A*d(u.alpha())/C.max;const F=s===null;const j=k==="vertical";const O=a||r;const L=t||c;const N=x||p;const[P,K]=this.getAdjustedScopePosition(e,n);const[T,U]=this.getAdjustedScopePosition(z,I);const[M,H]=this.getAdjustedScopePosition($,D);return i(E,{key:"c4837ef7cbe25b5fc3f0c72fe82d0090c6e0cdb5",disabled:this.disabled},i("div",{key:"28230570482ee9d33df9518e3cca534e3fac44ac",class:h.container},i("div",{key:"83172bc55f13955f5b69b59300e68642d59999af",class:h.controlAndScope},i("canvas",{key:"c20db7054ab5ebdb1e13ba295ac463609c44de47",class:h.colorField,onPointerDown:this.handleColorFieldPointerDown,ref:this.initColorField}),i("div",{key:"1e44beb121ed5a2247a6d69bf42c49a7f1ce5829","aria-label":j?m.value:m.saturation,"aria-valuemax":j?y.v:y.s,"aria-valuemin":"0","aria-valuenow":(j?s?.saturationv():s?.value())||"0",class:{[h.scope]:true,[h.colorFieldScope]:true},onKeyDown:this.handleColorFieldScopeKeyDown,ref:this.storeColorFieldScope,role:"slider",style:{top:`${K||0}px`,left:`${P||0}px`},tabindex:"0"})),i("div",{key:"5b873f4e7266cc654086f59c8483d3b4a65c8e8f",class:h.previewAndSliders},i("calcite-color-picker-swatch",{key:"db7c903a933ed061cc2edcd766fde70a8b670f00",class:h.preview,color:S,scale:this.alphaChannel?"l":this.scale}),i("div",{key:"33ea2354cbcfaa6677e82713bd8f02d1b83a9c26",class:h.sliders},i("div",{key:"28493b4bd177b8c97583cabeb5716a7cb7202e76",class:h.controlAndScope},i("canvas",{key:"d0a9ce7fb098b7434cd62f68b6b6092efcef3dc4",class:{[h.slider]:true,[h.hueSlider]:true},onPointerDown:this.handleHueSliderPointerDown,ref:this.initHueSlider}),i("div",{key:"2356120385aabf09384f0077dffb7881c55c5ea9","aria-label":m.hue,"aria-valuemax":y.h,"aria-valuemin":"0","aria-valuenow":s?.round().hue()||u.round().hue(),class:{[h.scope]:true,[h.hueScope]:true},onKeyDown:this.handleHueScopeKeyDown,ref:this.storeHueScope,role:"slider",style:{top:`${U}px`,left:`${T}px`},tabindex:"0"})),b?i("div",{class:h.controlAndScope},i("canvas",{class:{[h.slider]:true,[h.opacitySlider]:true},onPointerDown:this.handleOpacitySliderPointerDown,ref:this.initOpacitySlider}),i("div",{"aria-label":m.opacity,"aria-valuemax":C.max,"aria-valuemin":C.min,"aria-valuenow":(s||u).round().alpha(),class:{[h.scope]:true,[h.opacityScope]:true},onKeyDown:this.handleOpacityScopeKeyDown,ref:this.storeOpacityScope,role:"slider",style:{top:`${H}px`,left:`${M}px`},tabindex:"0"})):null)),O&&L?null:i("div",{class:{[h.controlSection]:true,[h.section]:true}},i("div",{class:h.hexAndChannelsGroup},O?null:i("div",{class:h.hexOptions},i("calcite-color-picker-hex-input",{allowEmpty:this.isClearable,alphaChannel:b,class:h.control,messages:m,numberingSystem:this.numberingSystem,onCalciteColorPickerHexInputChange:this.handleHexInputChange,scale:v,value:S})),L?null:i("calcite-tabs",{class:{[h.colorModeContainer]:true,[h.splitSection]:true},scale:v==="l"?"m":"s"},i("calcite-tab-nav",{slot:"title-group"},this.renderChannelsTabTitle("rgb"),this.renderChannelsTabTitle("hsv")),this.renderChannelsTab("rgb"),this.renderChannelsTab("hsv")))),N?null:i("div",{class:{[h.savedColorsSection]:true,[h.section]:true}},i("div",{class:h.header},i("label",null,m.saved),i("div",{class:h.savedColorsButtons},i("calcite-button",{appearance:"transparent",class:h.deleteColor,disabled:F,iconStart:"minus",kind:"neutral",label:m.deleteColor,onClick:this.deleteColor,scale:v,type:"button"}),i("calcite-button",{appearance:"transparent",class:h.saveColor,disabled:F,iconStart:"plus",kind:"neutral",label:m.saveColor,onClick:this.saveColor,scale:v,type:"button"}))),w.length>0?i("div",{class:h.savedColors},[...w.map((t=>i("calcite-color-picker-swatch",{class:h.savedColor,color:t,key:t,onClick:this.handleSavedColorSelect,onKeyDown:this.handleSavedColorKeyDown,scale:v,tabIndex:0})))]):null)))}handleKeyDown(t){if(t.key==="Enter"){t.preventDefault()}}showIncompatibleColorWarning(t,s){console.warn(`ignoring color value (${t}) as it is not compatible with the current format (${s})`)}setMode(t,s=true){const i=t==="auto"?this.mode:t;this.mode=this.ensureCompatibleMode(i,s)}ensureCompatibleMode(t,s){const{alphaChannel:i}=this;const e=f(t);if(i&&!e){const i=z(t);if(s){console.warn(`setting format to (${i}) as the provided one (${t}) does not support alpha`)}return i}if(!i&&e){const i=v(t);if(s){console.warn(`setting format to (${i}) as the provided one (${t}) does not support alpha`)}return i}return t}captureHueSliderColor(t){const s=A/this.effectiveSliderWidth*t;this.internalColorSet(this.baseColorFieldColor.hue(s),false)}captureOpacitySliderValue(t){const s=r(C.max/this.effectiveSliderWidth*t);this.internalColorSet(this.baseColorFieldColor.alpha(s),false)}internalColorSet(t,s=true,i="user-interaction"){if(s&&w(t,this.color)){return}this.internalColorUpdateContext=i;this.color=t;this.value=this.toValue(t);this.internalColorUpdateContext=null}toValue(t,s=this.mode){if(!t){return null}const i="hex";if(s.includes(i)){const i=s===o.HEXA;return a(l(t.round(),i),i)}if(s.includes("-css")){const i=t[s.replace("-css","").replace("a","")]().round().string();const e=(s.endsWith("a")||s.endsWith("a-css"))&&t.alpha()===1;if(e){const s=i.slice(0,3);const e=i.slice(4,-1);return`${s}a(${e}, ${t.alpha()})`}return i}const e=t[v(s)]().round().object();if(s.endsWith("a")){return k(e)}return e}getSliderCapSpacing(){const{dimensions:{slider:{height:t},thumb:{radius:s}}}=this;return s*2-t}updateDimensions(t="m"){this.dimensions=p[t]}drawColorField(){const t=this.colorFieldRenderingContext;const{dimensions:{colorField:{height:s,width:i}}}=this;t.fillStyle=this.baseColorFieldColor.hsv().saturationv(100).value(100).alpha(1).string();t.fillRect(0,0,i,s);const e=t.createLinearGradient(0,0,i,0);e.addColorStop(0,"rgba(255,255,255,1)");e.addColorStop(1,"rgba(255,255,255,0)");t.fillStyle=e;t.fillRect(0,0,i,s);const n=t.createLinearGradient(0,0,0,s);n.addColorStop(0,"rgba(0,0,0,0)");n.addColorStop(1,"rgba(0,0,0,1)");t.fillStyle=n;t.fillRect(0,0,i,s);this.drawActiveColorFieldColor()}setCanvasContextSize(t,{height:s,width:i}){if(!t){return}const e=window.devicePixelRatio||1;t.width=i*e;t.height=s*e;t.style.height=`${s}px`;t.style.width=`${i}px`;const n=t.getContext("2d");n.scale(e,e)}updateCanvasSize(t="all"){const{dimensions:s}=this;if(t==="all"||t==="color-field"){this.setCanvasContextSize(this.colorFieldRenderingContext?.canvas,s.colorField)}const i={width:this.effectiveSliderWidth,height:s.slider.height+(s.thumb.radius-s.slider.height/2)*2};if(t==="all"||t==="hue-slider"){this.setCanvasContextSize(this.hueSliderRenderingContext?.canvas,i)}if(t==="all"||t==="opacity-slider"){this.setCanvasContextSize(this.opacitySliderRenderingContext?.canvas,i)}}drawActiveColorFieldColor(){const{color:t}=this;if(!t){return}const s=t.hsv();const{dimensions:{colorField:{height:i,width:e},thumb:{radius:n}}}=this;const o=s.saturationv()/(y.s/e);const a=i-s.value()/(y.v/i);requestAnimationFrame((()=>{this.colorFieldScopeLeft=o;this.colorFieldScopeTop=a}));this.drawThumb(this.colorFieldRenderingContext,n,o,a,s,false)}drawThumb(t,s,i,e,n,o){const a=0;const l=2*Math.PI;const c=1;t.beginPath();t.arc(i,e,s,a,l);t.fillStyle="#fff";t.fill();t.strokeStyle="rgba(0,0,0,0.3)";t.lineWidth=c;t.stroke();if(o&&n.alpha()<1){const n=t.createPattern(this.getCheckeredBackgroundPattern(),"repeat");t.beginPath();t.arc(i,e,s-3,a,l);t.fillStyle=n;t.fill()}t.globalCompositeOperation="source-atop";t.beginPath();t.arc(i,e,s-3,a,l);const r=o?n.alpha():1;t.fillStyle=n.rgb().alpha(r).string();t.fill();t.globalCompositeOperation="source-over"}drawActiveHueSliderColor(){const{color:t}=this;if(!t){return}const s=t.hsv().saturationv(100).value(100);const{dimensions:{thumb:{radius:i}}}=this;const e=this.effectiveSliderWidth;const n=s.hue()/(A/e);const o=i;const a=this.getSliderBoundX(n,e,i);requestAnimationFrame((()=>{this.hueScopeLeft=a}));this.drawThumb(this.hueSliderRenderingContext,i,a,o,s,false)}drawHueSlider(){const t=this.hueSliderRenderingContext;const{dimensions:{slider:{height:s},thumb:{radius:i}}}=this;const e=0;const n=i-s/2;const o=this.effectiveSliderWidth;const a=t.createLinearGradient(0,0,o,0);const l=["red","yellow","lime","cyan","blue","magenta","#ff0004"];const r=1/(l.length-1);let h=0;l.forEach((t=>{a.addColorStop(h,c(t).string());h+=r}));t.clearRect(0,0,o,s+this.getSliderCapSpacing()*2);this.drawSliderPath(t,s,o,e,n);t.fillStyle=a;t.fill();t.strokeStyle="rgba(0,0,0,0.3)";t.lineWidth=1;t.stroke();this.drawActiveHueSliderColor()}drawOpacitySlider(){const t=this.opacitySliderRenderingContext;const{baseColorFieldColor:s,dimensions:{slider:{height:i},thumb:{radius:e}}}=this;const n=0;const o=e-i/2;const a=this.effectiveSliderWidth;t.clearRect(0,0,a,i+this.getSliderCapSpacing()*2);const l=t.createLinearGradient(0,o,a,0);const c=s.rgb().alpha(0);const r=s.rgb().alpha(.5);const h=s.rgb().alpha(1);l.addColorStop(0,c.string());l.addColorStop(.5,r.string());l.addColorStop(1,h.string());this.drawSliderPath(t,i,a,n,o);const d=t.createPattern(this.getCheckeredBackgroundPattern(),"repeat");t.fillStyle=d;t.fill();t.fillStyle=l;t.fill();t.strokeStyle="rgba(0,0,0,0.3)";t.lineWidth=1;t.stroke();this.drawActiveOpacitySliderColor()}drawSliderPath(t,s,i,e,n){const o=s/2+1;t.beginPath();t.moveTo(e+o,n);t.lineTo(e+i-o,n);t.quadraticCurveTo(e+i,n,e+i,n+o);t.lineTo(e+i,n+s-o);t.quadraticCurveTo(e+i,n+s,e+i-o,n+s);t.lineTo(e+o,n+s);t.quadraticCurveTo(e,n+s,e,n+s-o);t.lineTo(e,n+o);t.quadraticCurveTo(e,n,e+o,n);t.closePath()}getCheckeredBackgroundPattern(){if(this.checkerPattern){return this.checkerPattern}const t=document.createElement("canvas");t.width=10;t.height=10;const s=t.getContext("2d");s.fillStyle="#ccc";s.fillRect(0,0,10,10);s.fillStyle="#fff";s.fillRect(0,0,5,5);s.fillRect(5,5,5,5);this.checkerPattern=t;return t}drawActiveOpacitySliderColor(){const{color:t}=this;if(!t){return}const s=t;const{dimensions:{thumb:{radius:i}}}=this;const e=this.effectiveSliderWidth;const n=d(s.alpha())/(C.max/e);const o=i;const a=this.getSliderBoundX(n,e,i);requestAnimationFrame((()=>{this.opacityScopeLeft=a}));this.drawThumb(this.opacitySliderRenderingContext,i,a,o,s,true)}getSliderBoundX(t,s,i){const e=J(t,s,i);return e===0?t:e===-1?q(t,0,s,i,i*2):q(t,0,s,s-i*2,s-i)}updateColorFromChannels(t){this.internalColorSet(c(t,this.channelMode))}updateChannelsFromColor(t){this.channels=t?this.toChannels(t):[null,null,null,null]}toChannels(t){const{channelMode:s}=this;const i=t[s]().array().map(((t,s)=>{const i=s===3;return i?t:Math.floor(t)}));if(i.length===3){i.push(1)}return i}getAdjustedScopePosition(t,s){return[t-S/2,s-S/2]}static get assetsDirs(){return["assets"]}get el(){return e(this)}static get watchers(){return{allowEmpty:["handleAllowEmptyOrClearableChange"],clearable:["handleAllowEmptyOrClearableChange"],alphaChannel:["handleAlphaChannelChange","handleAlphaChannelDimensionsChange","handleFormatOrAlphaChannelChange"],dimensions:["handleAlphaChannelDimensionsChange"],color:["handleColorChange"],format:["handleFormatOrAlphaChannelChange"],scale:["handleScaleChange"],messageOverrides:["onMessagesChange"],value:["handleValueChange"],effectiveLocale:["effectiveLocaleChange"]}}};et.style=st;const nt={container:"container",hexInput:"hex-input",opacityInput:"opacity-input"};const ot=":host{display:block}.container{display:flex;inline-size:100%;flex-wrap:nowrap;align-items:center}.hex-input{flex-grow:1;text-transform:uppercase}.opacity-input{inline-size:68px;margin-inline-start:-1px}:host([scale=s]) .container{flex-wrap:wrap;row-gap:0.125rem}:host([scale=s]) .opacity-input{inline-size:unset;margin-inline-start:unset}:host([scale=l]) .opacity-input{inline-size:88px}:host([hidden]){display:none}[hidden]{display:none}";const at=ot;const lt=c();const ct=class{constructor(i){t(this,i);this.calciteColorPickerHexInputChange=s(this,"calciteColorPickerHexInputChange",6);this.onHexInputBlur=()=>{const t=this.hexInputNode;const s=t.value;const i=`#${s}`;const{allowEmpty:e,internalColor:n}=this;const o=e&&!s;const a=D(i);if($(i,this.alphaChannel)){this.onHexInputChange()}if(o||F(i)&&a){return}t.value=e&&!n?"":this.formatHexForInternalInput(j(n.object()))};this.onOpacityInputBlur=()=>{const t=this.opacityInputNode;const s=t.value;const{allowEmpty:i,internalColor:e}=this;const n=i&&!s;if(n){return}t.value=i&&!e?"":this.formatOpacityForInternalInput(e)};this.onOpacityInputInput=()=>{this.onOpacityInputChange()};this.onHexInputChange=()=>{const t=this.hexInputNode.value;let s=t;if(s){const t=a(s,false);const i=F(t)&&this.alphaChannel;if(i&&this.internalColor){const i=a(this.internalColor.hexa(),true).slice(-2);s=`${t+i}`}}this.internalSetValue(s,this.value)};this.onOpacityInputChange=()=>{const t=this.opacityInputNode;let s;if(!t.value){s=t.value}else{const i=r(Number(t.value));s=this.internalColor?.alpha(i).hexa()}this.internalSetValue(s,this.value)};this.onInputFocus=t=>{t.type==="calciteInternalInputTextFocus"?this.hexInputNode.selectText():this.opacityInputNode.selectText()};this.onHexInputInput=()=>{const t=`#${this.hexInputNode.value}`;const s=this.value;if(F(t,this.alphaChannel)&&D(t,this.alphaChannel)){this.internalSetValue(t,s)}};this.onInputKeyDown=t=>{const{altKey:s,ctrlKey:i,metaKey:e,shiftKey:n}=t;const{alphaChannel:o,hexInputNode:a,internalColor:c,value:r}=this;const{key:h}=t;const d=t.composedPath();if(h==="Tab"&&$(r,this.alphaChannel)||h==="Enter"){if(d.includes(a)){this.onHexInputChange()}else{this.onOpacityInputChange()}if(h==="Enter"){t.preventDefault()}return}const u=h==="ArrowDown"||h==="ArrowUp";const p=this.value;if(u){if(!r){this.internalSetValue(this.previousNonNullValue,p);t.preventDefault();return}const s=h==="ArrowUp"?1:-1;const i=n?10:1;this.internalSetValue(l(this.nudgeRGBChannels(c,i*s,d.includes(a)?"rgb":"a"),o),p);t.preventDefault();return}const f=s||i||e;const m=h.length===1;const b=O.test(h);if(m&&!f&&!b){t.preventDefault()}};this.onHexInputPaste=t=>{const s=t.clipboardData.getData("text");if(F(s,this.alphaChannel)&&D(s,this.alphaChannel)){t.preventDefault();this.hexInputNode.value=s.slice(1);this.internalSetValue(s,this.value)}};this.previousNonNullValue=this.value;this.storeHexInputRef=t=>{this.hexInputNode=t};this.storeOpacityInputRef=t=>{this.opacityInputNode=t};this.allowEmpty=false;this.alphaChannel=false;this.hexLabel="Hex";this.messages=undefined;this.numberingSystem=undefined;this.scale="m";this.value=a(l(lt,this.alphaChannel),this.alphaChannel,true);this.internalColor=lt}connectedCallback(){const{allowEmpty:t,alphaChannel:s,value:i}=this;if(i){const t=a(i,s);if(F(t,s)){this.internalSetValue(t,t,false)}return}if(t){this.internalSetValue(null,null,false)}}componentWillLoad(){_(this)}componentDidLoad(){B(this)}handleValueChange(t,s){this.internalSetValue(t,s,false)}render(){const{alphaChannel:t,hexLabel:s,internalColor:e,messages:n,scale:o,value:a}=this;const l=this.formatHexForInternalInput(a);const c=this.formatOpacityForInternalInput(e);const r=o==="l"?"m":"s";return i("div",{key:"70f804fdbc3c29fdf49616f56c39593fdc3717da",class:nt.container},i("calcite-input-text",{key:"777d1f8ffa673a0d74f049d4a6bdacbf3510006a",class:nt.hexInput,label:n?.hex||s,maxLength:this.alphaChannel?8:6,onCalciteInputTextChange:this.onHexInputChange,onCalciteInputTextInput:this.onHexInputInput,onCalciteInternalInputTextBlur:this.onHexInputBlur,onCalciteInternalInputTextFocus:this.onInputFocus,onKeyDown:this.onInputKeyDown,onPaste:this.onHexInputPaste,prefixText:"#",ref:this.storeHexInputRef,scale:r,value:l}),t?i("calcite-input-number",{class:nt.opacityInput,key:"opacity-input",label:n?.opacity,max:C.max,maxLength:3,min:C.min,numberButtonType:"none",numberingSystem:this.numberingSystem,onCalciteInputNumberInput:this.onOpacityInputInput,onCalciteInternalInputNumberBlur:this.onOpacityInputBlur,onCalciteInternalInputNumberFocus:this.onInputFocus,onKeyDown:this.onInputKeyDown,ref:this.storeOpacityInputRef,scale:r,suffixText:"%",value:c}):null)}async setFocus(){await H(this);return K(this.hexInputNode)}internalSetValue(t,s,i=true){if(t){const{alphaChannel:s}=this;const e=a(t,s,s);if(F(e,s)){const{internalColor:t}=this;const n=c(e);const o=a(l(n,s),s);const r=!t||o!==a(l(t,s),s);this.internalColor=n;this.previousNonNullValue=o;this.value=o;if(r&&i){this.calciteColorPickerHexInputChange.emit()}return}}else if(this.allowEmpty){this.internalColor=null;this.value=null;if(i){this.calciteColorPickerHexInputChange.emit()}return}this.value=s}formatHexForInternalInput(t){return t?t.replace("#","").slice(0,6):""}formatOpacityForInternalInput(t){return t?`${d(t.alpha())}`:""}nudgeRGBChannels(t,s,i){let e;const n=t.array();const o=n.slice(0,3);if(i==="rgb"){const t=o.map((t=>t+s));e=[...t,this.alphaChannel?n[3]:undefined]}else{const i=r(d(t.alpha())+s);e=[...o,i]}return c(e)}get el(){return e(this)}static get watchers(){return{value:["handleValueChange"]}}};ct.style=at;const rt={swatch:"swatch",noColorSwatch:"swatch--no-color",checker:"checker"};const ht={borderLight:"rgba(0, 0, 0, 0.3)",borderDark:"rgba(255, 255, 255, 0.15)"};const dt=4;const ut={squareSize:dt,size:dt*2};const pt=":host{position:relative;display:inline-flex}:host([scale=s]){block-size:1.25rem;inline-size:1.25rem}:host([scale=m]){block-size:1.5rem;inline-size:1.5rem}:host([scale=l]){block-size:2rem;inline-size:2rem}.swatch{overflow:hidden;block-size:inherit;inline-size:inherit}.swatch rect{transition-property:all;transition-duration:150ms;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1)}.swatch--no-color rect{fill:var(--calcite-color-foreground-1)}.swatch--no-color line{stroke:var(--calcite-color-status-danger)}.checker{fill:#cacaca}:host([hidden]){display:none}[hidden]{display:none}";const ft=pt;const mt=class{constructor(s){t(this,s);this.active=false;this.color=undefined;this.scale="m"}handleColorChange(t){this.internalColor=t?c(t):null}componentWillLoad(){this.handleColorChange(this.color)}render(){const t=!this.internalColor;const s={[rt.swatch]:true,[rt.noColorSwatch]:t};return i("svg",{key:"d808ca40b9f81aad24291cabcfaf95d74d89f7cd",class:s,xmlns:"http://www.w3.org/2000/svg"},this.renderSwatch())}renderSwatch(){const{active:t,el:s,internalColor:e}=this;const o=t?"100%":"0";const a=T(s);const c=a==="light"?ht.borderLight:ht.borderDark;const r=!e;const h={height:"100%",rx:o,stroke:c,strokeWidth:"2",width:"100%"};if(r){return i(n,null,i("clipPath",{id:"shape"},i("rect",{height:"100%",rx:o,width:"100%"})),this.renderSwatchRect({clipPath:`inset(0 round ${o})`,...h}),i("line",{"clip-path":"url(#shape)","stroke-width":"3",x1:"100%",x2:"0",y1:"0",y2:"100%"}))}const d=e.alpha();const u=l(e);const p=l(e,d<1);return i(n,null,i("title",null,p),i("defs",null,i("pattern",{height:ut.size,id:"checker",patternUnits:"userSpaceOnUse",width:ut.size,x:"0",y:"0"},i("rect",{class:rt.checker,height:ut.squareSize,width:ut.squareSize,x:"0",y:"0"}),i("rect",{class:rt.checker,height:ut.squareSize,width:ut.squareSize,x:ut.squareSize,y:ut.squareSize}))),this.renderSwatchRect({fill:"url(#checker)",rx:h.rx,height:h.height,width:h.width}),this.renderSwatchRect({clipPath:d<1?"polygon(100% 0, 0 0, 0 100%)":`inset(0 round ${o})`,fill:u,...h}),d<1?this.renderSwatchRect({clipPath:"polygon(100% 0, 100% 100%, 0 100%)",fill:p,key:"opacity-fill",...h}):null)}renderSwatchRect({clipPath:t,fill:s,height:e,key:n,rx:o,stroke:a,strokeWidth:l,width:c}){return i("rect",{"clip-path":t,fill:s,height:e,key:n,rx:o,stroke:a,"stroke-width":l,width:c})}get el(){return e(this)}static get watchers(){return{color:["handleColorChange"]}}};mt.style=ft;export{et as calcite_color_picker,ct as calcite_color_picker_hex_input,mt as calcite_color_picker_swatch};
-//# sourceMappingURL=p-87fff13e.entry.js.map

package/dist/calcite/p-87fff13e.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["colorPickerCss","CalciteColorPickerStyle0","throttleFor60FpsInMs","ColorPicker","this","internalColorUpdateContext","isActiveChannelInputEmpty","mode","CSSColorMode","HEX","shiftKeyChannelAdjustment","upOrDownArrowKeyTracker","handleTabActivate","event","channelMode","currentTarget","getAttribute","updateChannelsFromColor","color","handleColorFieldScopeKeyDown","key","arrowKeyToXYOffset","ArrowUp","x","y","ArrowRight","ArrowDown","ArrowLeft","preventDefault","scopeOrientation","captureColorFieldColor","colorFieldScopeLeft","colorFieldScopeTop","handleHueScopeKeyDown","modifier","shiftKey","arrowKeyToXOffset","delta","hue","baseColorFieldColor","internalColorSet","handleHexInputChange","stopPropagation","isClearable","input","target","hex","value","normalizedHex","normalizeHex","hexify","alphaCompatible","Color","handleSavedColorSelect","swatch","handleChannelInput","channelIndex","Number","isAlphaChannel","limit","OPACITY_LIMITS","max","RGB_LIMITS","Object","keys","HSV_LIMITS","inputValue","adjustedValue","clamped","clamp","toString","handleChannelChange","handleChannelBlur","channels","restoreValueDueToEmptyInput","handleChannelFocus","selectText","shouldClearChannels","getChannelInputLimit","opacityToAlpha","updateColorFromChannels","handleSavedColorKeyDown","isActivationKey","handleColorFieldPointerDown","handleCanvasControlPointerDown","colorFieldRenderingContext","colorFieldScopeNode","handleHueSliderPointerDown","hueSliderRenderingContext","captureHueSliderColor","hueScopeNode","handleOpacitySliderPointerDown","opacitySliderRenderingContext","captureOpacitySliderValue","opacityScopeNode","globalPointerUpHandler","isPrimaryPointerButton","previouslyDragging","activeCanvasInfo","drawColorControls","calciteColorPickerChange","emit","globalPointerMoveHandler","el","isConnected","context","bounds","samplingX","samplingY","clientX","clientY","canvas","matches","width","height","storeColorFieldScope","node","storeHueScope","renderChannelsTabTitle","activeChannelMode","messages","selected","label","rgb","hsv","h","class","CSS","colorMode","onCalciteTabsActivate","renderChannelsTab","alphaChannel","isRgb","channelAriaLabels","red","green","blue","saturation","direction","getElementDir","channelsToRender","slice","control","dir","map","channelValue","index","alphaToOpacity","renderChannel","ariaLabel","suffix","channel","lang","effectiveLocale","numberButtonType","numberingSystem","onCalciteInputNumberChange","onCalciteInputNumberInput","onCalciteInternalInputNumberBlur","onCalciteInternalInputNumberFocus","onKeyDown","handleKeyDown","scale","style","marginLeft","suffixText","deleteColor","colorToDelete","inStorage","savedColors","indexOf","filter","storageKey","DEFAULT_STORAGE_KEY_PREFIX","storageId","localStorage","setItem","JSON","stringify","saveColor","colorToSave","alreadySaved","throttle","type","drawColorField","drawHueSlider","drawOpacitySlider","skipEqual","dimensions","colorField","Math","round","s","v","saturationv","initColorField","getContext","updateCanvasSize","initHueSlider","initOpacitySlider","storeOpacityScope","handleOpacityScopeKeyDown","alpha","DEFAULT_COLOR","toChannels","DIMENSIONS","m","handleAllowEmptyOrClearableChange","clearable","allowEmpty","handleAlphaChannelChange","format","console","warn","handleAlphaChannelDimensionsChange","effectiveSliderWidth","getSliderWidth","handleColorChange","oldColor","previousColor","handleFormatOrAlphaChannelChange","setMode","handleScaleChange","updateDimensions","onMessagesChange","handleValueChange","oldValue","checkMode","modeChanged","nextMode","parseMode","showIncompatibleColorWarning","dragging","calciteColorPickerInput","normalizeColor","colorChanged","colorEqual","endsWith","effectiveLocaleChange","updateMessages","handleChannelKeyUpOrDown","composedPath","some","classList","contains","complementaryBump","focusScope","focusEl","requestAnimationFrame","focus","renderingContext","captureValue","scopeNode","window","addEventListener","once","getBoundingClientRect","call","offsetX","offsetY","setFocus","componentFocusable","focusFirstTabbable","componentWillLoad","setUpLoadableComponent","willSetNoColor","parsedMode","valueIsCompatible","initialColor","getItem","parse","setUpMessages","connectedCallback","connectLocalized","connectMessages","componentDidLoad","setComponentLoaded","disconnectedCallback","removeEventListener","disconnectLocalized","disconnectMessages","componentDidRender","updateHostInteraction","render","channelsDisabled","thumb","radius","thumbRadius","hexDisabled","hideChannels","hideHex","hideSaved","hueScopeLeft","opacityScopeLeft","savedDisabled","sliderWidth","selectedColorInHex","hueTop","hueLeft","opacityTop","opacityLeft","noColor","vertical","noHex","noChannels","noSaved","adjustedColorFieldScopeLeft","adjustedColorFieldScopeTop","getAdjustedScopePosition","adjustedHueScopeLeft","adjustedHueScopeTop","adjustedOpacityScopeLeft","adjustedOpacityScopeTop","InteractiveContainer","disabled","container","controlAndScope","onPointerDown","ref","scope","colorFieldScope","role","top","left","tabindex","previewAndSliders","preview","sliders","slider","hueSlider","hueScope","opacitySlider","opacity","min","opacityScope","controlSection","section","hexAndChannelsGroup","hexOptions","onCalciteColorPickerHexInputChange","colorModeContainer","splitSection","slot","savedColorsSection","header","saved","savedColorsButtons","appearance","iconStart","kind","onClick","length","savedColor","tabIndex","ensureCompatibleMode","isAlphaCompatible","alphaMode","toAlphaMode","nonAlphaMode","toNonAlphaMode","HUE_LIMIT_CONSTRAINED","toValue","hexMode","includes","hasAlpha","HEXA","replace","string","needToInjectAlpha","model","values","colorObject","object","normalizeAlpha","getSliderCapSpacing","fillStyle","fillRect","whiteGradient","createLinearGradient","addColorStop","blackGradient","drawActiveColorFieldColor","setCanvasContextSize","devicePixelRatio","adjustedSliderDimensions","hsvColor","drawThumb","applyAlpha","startAngle","endAngle","PI","outlineWidth","beginPath","arc","fill","strokeStyle","lineWidth","stroke","pattern","createPattern","getCheckeredBackgroundPattern","globalCompositeOperation","drawActiveHueSliderColor","sliderBoundX","getSliderBoundX","gradient","hueSliderColorStopKeywords","offset","currentOffset","forEach","keyword","clearRect","drawSliderPath","startColor","midColor","endColor","drawActiveOpacitySliderColor","moveTo","lineTo","quadraticCurveTo","closePath","checkerPattern","document","createElement","patternContext","closeToEdge","closeToRangeEdge","remap","array","isAlpha","floor","push","SCOPE_SIZE","hexInput","opacityInput","colorPickerHexInputCss","CalciteColorPickerHexInputStyle0","ColorPickerHexInput","onHexInputBlur","hexInputNode","internalColor","willClearValue","isLonghand","isLonghandHex","isShorthandHex","onHexInputChange","isValidHex","formatHexForInternalInput","rgbToHex","onOpacityInputBlur","opacityInputNode","formatOpacityForInternalInput","onOpacityInputInput","onOpacityInputChange","nodeValue","normalized","preserveExistingAlpha","alphaHex","hexa","internalSetValue","onInputFocus","onHexInputInput","hexInputValue","onInputKeyDown","altKey","ctrlKey","metaKey","isNudgeKey","previousNonNullValue","bump","nudgeRGBChannels","withModifiers","singleChar","validHexChar","hexChar","test","onHexInputPaste","clipboardData","getData","storeHexInputRef","storeOpacityInputRef","hexLabel","opacityInputValue","inputScale","maxLength","onCalciteInputTextChange","onCalciteInputTextInput","onCalciteInternalInputTextBlur","onCalciteInternalInputTextFocus","onPaste","prefixText","focusElement","currentColor","nextColor","normalizedLonghand","changed","calciteColorPickerHexInputChange","amount","nudgedChannels","rgbChannels","nudgedRGBChannels","undefined","nudgedAlpha","noColorSwatch","checker","COLORS","borderLight","borderDark","checkerSquareSize","CHECKER_DIMENSIONS","squareSize","size","colorPickerSwatchCss","CalciteColorPickerSwatchStyle0","ColorPickerSwatch","isEmpty","classes","xmlns","renderSwatch","active","borderRadius","theme","getModeName","borderColor","commonSwatchProps","rx","strokeWidth","Fragment","id","renderSwatchRect","clipPath","x1","x2","y1","y2","patternUnits"],"sources":["src/components/color-picker/color-picker.scss?tag=calcite-color-picker&encapsulation=shadow","src/components/color-picker/color-picker.tsx","src/components/color-picker-hex-input/resources.ts","src/components/color-picker-hex-input/color-picker-hex-input.scss?tag=calcite-color-picker-hex-input&encapsulation=shadow","src/components/color-picker-hex-input/color-picker-hex-input.tsx","src/components/color-picker-swatch/resources.ts","src/components/color-picker-swatch/color-picker-swatch.scss?tag=calcite-color-picker-swatch&encapsulation=shadow","src/components/color-picker-swatch/color-picker-swatch.tsx"],"sourcesContent":[":host {\n  @apply text-n2h inline-block font-normal;\n}\n\n@include disabled();\n\n:host([scale=\"s\"]) {\n  --calcite-color-picker-spacing: 8px;\n\n  .container {\n    inline-size: 160px;\n  }\n\n  .saved-colors {\n    @apply gap-1;\n    grid-template-columns: repeat(auto-fill, 20px);\n  }\n}\n\n:host([scale=\"m\"]) {\n  --calcite-color-picker-spacing: 12px;\n\n  .container {\n    inline-size: 272px;\n  }\n}\n\n:host([scale=\"l\"]) {\n  --calcite-color-picker-spacing: 16px;\n\n  @apply text-n1h;\n\n  .container {\n    inline-size: 464px;\n  }\n\n  .section {\n    &:first-of-type {\n      padding-block-start: var(--calcite-color-picker-spacing);\n    }\n  }\n\n  .saved-colors {\n    grid-template-columns: repeat(auto-fill, 32px);\n  }\n\n  .control-section {\n    @apply flex-nowrap items-baseline;\n  }\n\n  .control-section {\n    @apply flex-wrap;\n  }\n\n  .color-hex-options {\n    @apply flex\n      flex-shrink\n      flex-col\n      justify-around;\n  }\n\n  .color-mode-container {\n    flex-shrink: 3;\n  }\n}\n\n.container {\n  @apply bg-foreground-1;\n  display: inline-block;\n  border: 1px solid var(--calcite-color-border-1);\n}\n\n.control-and-scope {\n  @apply flex relative cursor-pointer touch-none;\n}\n\n.color-field,\n.control-and-scope {\n  user-select: none;\n}\n\n.scope {\n  @apply text-n1\n    focus-base\n    absolute\n    z-default\n    rounded-full\n    bg-transparent\n    w-px\n    h-px\n    pointer-events-none;\n  &:focus {\n    @apply focus-outset;\n    outline-offset: 6px;\n  }\n}\n\n.hex-and-channels-group {\n  @apply w-full;\n}\n\n.hex-and-channels-group,\n.control-section {\n  @apply flex flex-row flex-wrap;\n}\n\n.section {\n  padding-block: 0 var(--calcite-color-picker-spacing);\n  padding-inline: var(--calcite-color-picker-spacing);\n\n  &:first-of-type {\n    padding-block-start: var(--calcite-color-picker-spacing);\n  }\n}\n\n.sliders {\n  @apply flex flex-col justify-between;\n  margin-inline-start: var(--calcite-color-picker-spacing);\n  gap: var(--calcite-spacing-xxs);\n}\n\n.preview-and-sliders {\n  @apply flex items-center;\n  padding: var(--calcite-color-picker-spacing);\n}\n\n.color-hex-options,\n.section--split {\n  flex-grow: 1;\n}\n\n.header {\n  @apply text-color-1\n    flex\n    items-center\n    justify-between;\n}\n\n.color-mode-container {\n  padding-block-start: var(--calcite-color-picker-spacing);\n}\n\n.channels {\n  @apply flex gap-y-0.5;\n}\n\n.channel {\n  &[data-channel-index=\"3\"] {\n    inline-size: 159px;\n  }\n}\n\n:host([scale=\"s\"]) {\n  .channels {\n    @apply flex-wrap;\n  }\n\n  .channel {\n    flex-basis: 30%;\n    flex-grow: 1;\n\n    &[data-channel-index=\"3\"] {\n      inline-size: unset;\n      margin-inline-start: unset;\n    }\n  }\n}\n\n:host([scale=\"l\"]) {\n  .channel {\n    &[data-channel-index=\"3\"] {\n      inline-size: 131px;\n    }\n  }\n}\n\n.saved-colors {\n  @apply grid gap-2;\n  padding-block-start: var(--calcite-color-picker-spacing);\n  grid-template-columns: repeat(auto-fill, 24px);\n}\n\n.saved-colors-buttons {\n  display: flex;\n}\n\n.saved-color {\n  @include focus-style-base();\n\n  cursor: pointer;\n\n  &:focus {\n    @include focus-style-outset();\n  }\n\n  &:hover {\n    transition: outline-color var(--calcite-internal-animation-timing-fast) ease-in-out;\n    outline: 2px solid var(--calcite-color-border-2);\n    outline-offset: 2px;\n  }\n}\n\n@include base-component();\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Listen,\n  Method,\n  Prop,\n  State,\n  VNode,\n  Watch,\n} from \"@stencil/core\";\nimport Color from \"color\";\nimport { throttle } from \"lodash-es\";\nimport {\n  Direction,\n  focusFirstTabbable,\n  getElementDir,\n  isPrimaryPointerButton,\n} from \"../../utils/dom\";\nimport { Scale } from \"../interfaces\";\nimport {\n  InteractiveComponent,\n  InteractiveContainer,\n  updateHostInteraction,\n} from \"../../utils/interactive\";\nimport { isActivationKey } from \"../../utils/key\";\nimport {\n  componentFocusable,\n  LoadableComponent,\n  setComponentLoaded,\n  setUpLoadableComponent,\n} from \"../../utils/loadable\";\nimport {\n  connectLocalized,\n  disconnectLocalized,\n  LocalizedComponent,\n  NumberingSystem,\n} from \"../../utils/locale\";\nimport { clamp, closeToRangeEdge, remap } from \"../../utils/math\";\nimport {\n  connectMessages,\n  disconnectMessages,\n  setUpMessages,\n  T9nComponent,\n  updateMessages,\n} from \"../../utils/t9n\";\nimport {\n  alphaCompatible,\n  alphaToOpacity,\n  colorEqual,\n  CSSColorMode,\n  Format,\n  getSliderWidth,\n  hexify,\n  normalizeAlpha,\n  normalizeColor,\n  normalizeHex,\n  opacityToAlpha,\n  parseMode,\n  SupportedMode,\n  toAlphaMode,\n  toNonAlphaMode,\n} from \"./utils\";\nimport {\n  CSS,\n  DEFAULT_COLOR,\n  DEFAULT_STORAGE_KEY_PREFIX,\n  DIMENSIONS,\n  HSV_LIMITS,\n  HUE_LIMIT_CONSTRAINED,\n  OPACITY_LIMITS,\n  RGB_LIMITS,\n  SCOPE_SIZE,\n} from \"./resources\";\nimport { Channels, ColorMode, ColorValue, HSLA, HSVA, InternalColor, RGBA } from \"./interfaces\";\nimport { ColorPickerMessages } from \"./assets/color-picker/t9n\";\n\nconst throttleFor60FpsInMs = 16;\n\n@Component({\n  tag: \"calcite-color-picker\",\n  styleUrl: \"color-picker.scss\",\n  shadow: true,\n  assetsDirs: [\"assets\"],\n})\nexport class ColorPicker\n  implements InteractiveComponent, LoadableComponent, LocalizedComponent, T9nComponent\n{\n  //--------------------------------------------------------------------------\n  //\n  //  Public properties\n  //\n  //--------------------------------------------------------------------------\n\n  /**\n   * When `true`, an empty color (`null`) will be allowed as a `value`.\n   *\n   * When `false`, a color value is enforced, and clearing the input or blurring will restore the last valid `value`.\n   *\n   * @deprecated Use `clearable` instead\n   */\n  @Prop({ reflect: true }) allowEmpty = false;\n\n  @Watch(\"allowEmpty\")\n  @Watch(\"clearable\")\n  handleAllowEmptyOrClearableChange(): void {\n    this.isClearable = this.clearable || this.allowEmpty;\n  }\n\n  /**\n   * When `true`, the component will allow updates to the color's alpha value.\n   */\n  @Prop() alphaChannel = false;\n\n  @Watch(\"alphaChannel\")\n  handleAlphaChannelChange(alphaChannel: boolean): void {\n    const { format } = this;\n\n    if (alphaChannel && format !== \"auto\" && !alphaCompatible(format)) {\n      console.warn(\n        `ignoring alphaChannel as the current format (${format}) does not support alpha`,\n      );\n      this.alphaChannel = false;\n    }\n  }\n\n  @Watch(\"alphaChannel\")\n  @Watch(\"dimensions\")\n  handleAlphaChannelDimensionsChange(): void {\n    this.effectiveSliderWidth = getSliderWidth(this.dimensions, this.alphaChannel);\n    this.drawColorControls();\n  }\n\n  /** When `true`, hides the RGB/HSV channel inputs. */\n  @Prop() channelsDisabled = false;\n\n  /**\n   * When `true`, an empty color (`null`) will be allowed as a `value`.\n   *\n   * When `false`, a color value is enforced, and clearing the input or blurring will restore the last valid `value`.\n   */\n  @Prop({ reflect: true }) clearable = false;\n\n  /**\n   * Internal prop for advanced use-cases.\n   *\n   * @internal\n   */\n  @Prop({ mutable: true }) color: InternalColor | null = DEFAULT_COLOR;\n\n  @Watch(\"color\")\n  handleColorChange(color: Color | null, oldColor: Color | null): void {\n    this.drawColorControls();\n    this.updateChannelsFromColor(color);\n    this.previousColor = oldColor;\n  }\n\n  /**\n   * When `true`, interaction is prevented and the component is displayed with lower opacity.\n   */\n  @Prop({ reflect: true }) disabled = false;\n\n  /**\n   * The format of `value`.\n   *\n   * When `\"auto\"`, the format will be inferred from `value` when set.\n   *\n   * @default \"auto\"\n   */\n  @Prop({ reflect: true }) format: Format = \"auto\";\n\n  @Watch(\"alphaChannel\")\n  @Watch(\"format\")\n  handleFormatOrAlphaChannelChange(): void {\n    this.setMode(this.format);\n    this.internalColorSet(this.color, false, \"internal\");\n  }\n\n  /**\n   * When `true`, hides the RGB/HSV channel inputs.\n   *\n   * @deprecated use `channelsDisabled` instead\n   */\n  @Prop({ reflect: true }) hideChannels = false;\n\n  /** When `true`, hides the hex input. */\n  @Prop() hexDisabled = false;\n\n  /**\n   * When `true`, hides the hex input.\n   *\n   * @deprecated use `hexDisabled` instead\n   */\n  @Prop({ reflect: true }) hideHex = false;\n\n  /**\n   * When `true`, hides the saved colors section.\n   *\n   * @deprecated use `savedDisabled` instead\n   */\n  @Prop({ reflect: true }) hideSaved = false;\n\n  /** When `true`, hides the saved colors section. */\n  @Prop({ reflect: true }) savedDisabled = false;\n\n  /** Specifies the size of the component. */\n  @Prop({ reflect: true }) scale: Scale = \"m\";\n\n  @Watch(\"scale\")\n  handleScaleChange(scale: Scale = \"m\"): void {\n    this.updateDimensions(scale);\n    this.updateCanvasSize(\"all\");\n    this.drawColorControls();\n  }\n\n  /** Specifies the storage ID for colors. */\n  @Prop({ reflect: true }) storageId: string;\n\n  /**\n   * Use this property to override individual strings used by the component.\n   */\n  // eslint-disable-next-line @stencil-community/strict-mutable -- updated by t9n module\n  @Prop({ mutable: true }) messageOverrides: Partial<ColorPickerMessages>;\n\n  @Watch(\"messageOverrides\")\n  onMessagesChange(): void {\n    /* wired up by t9n util */\n  }\n\n  /** Specifies the Unicode numeral system used by the component for localization. */\n  @Prop({ reflect: true }) numberingSystem: NumberingSystem;\n\n  /**\n   * The component's value, where the value can be a CSS color string, or a RGB, HSL or HSV object.\n   *\n   * The type will be preserved as the color is updated.\n   *\n   * @default \"#007ac2\"\n   * @see [CSS Color](https://developer.mozilla.org/en-US/docs/Web/CSS/color)\n   * @see [ColorValue](https://github.com/Esri/calcite-design-system/blob/dev/src/components/color-picker/interfaces.ts#L10)\n   */\n  @Prop({ mutable: true }) value: ColorValue | null = normalizeHex(\n    hexify(DEFAULT_COLOR, this.alphaChannel),\n  );\n\n  @Watch(\"value\")\n  handleValueChange(value: ColorValue | null, oldValue: ColorValue | null): void {\n    const { isClearable, format } = this;\n    const checkMode = !isClearable || value;\n    let modeChanged = false;\n\n    if (checkMode) {\n      const nextMode = parseMode(value);\n\n      if (!nextMode || (format !== \"auto\" && nextMode !== format)) {\n        this.showIncompatibleColorWarning(value, format);\n        this.value = oldValue;\n        return;\n      }\n\n      modeChanged = this.mode !== nextMode;\n      this.setMode(nextMode, this.internalColorUpdateContext === null);\n    }\n\n    const dragging = this.activeCanvasInfo;\n\n    if (this.internalColorUpdateContext === \"initial\") {\n      return;\n    }\n\n    if (this.internalColorUpdateContext === \"user-interaction\") {\n      this.calciteColorPickerInput.emit();\n\n      if (!dragging) {\n        this.calciteColorPickerChange.emit();\n      }\n      return;\n    }\n\n    const color =\n      isClearable && !value\n        ? null\n        : Color(\n            value != null && typeof value === \"object\" && alphaCompatible(this.mode)\n              ? normalizeColor(value as RGBA | HSVA | HSLA)\n              : value,\n          );\n    const colorChanged = !colorEqual(color, this.color);\n\n    if (modeChanged || colorChanged) {\n      this.internalColorSet(\n        color,\n        this.alphaChannel && !(this.mode.endsWith(\"a\") || this.mode.endsWith(\"a-css\")),\n        \"internal\",\n      );\n    }\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Internal State/Props\n  //\n  //--------------------------------------------------------------------------\n\n  @Element() el: HTMLCalciteColorPickerElement;\n\n  private activeCanvasInfo: {\n    context: CanvasRenderingContext2D;\n    bounds: DOMRect;\n  };\n\n  private get baseColorFieldColor(): Color {\n    return this.color || this.previousColor || DEFAULT_COLOR;\n  }\n\n  private checkerPattern: HTMLCanvasElement;\n\n  private colorFieldRenderingContext: CanvasRenderingContext2D;\n\n  private colorFieldScopeNode: HTMLDivElement;\n\n  private effectiveSliderWidth: number;\n\n  private hueSliderRenderingContext: CanvasRenderingContext2D;\n\n  private hueScopeNode: HTMLDivElement;\n\n  private internalColorUpdateContext: \"internal\" | \"initial\" | \"user-interaction\" | null = null;\n\n  private isActiveChannelInputEmpty: boolean = false;\n\n  private isClearable: boolean;\n\n  private mode: SupportedMode = CSSColorMode.HEX;\n\n  private opacityScopeNode: HTMLDivElement;\n\n  private opacitySliderRenderingContext: CanvasRenderingContext2D;\n\n  private previousColor: InternalColor | null;\n\n  private shiftKeyChannelAdjustment = 0;\n\n  private upOrDownArrowKeyTracker: \"down\" | \"up\" | null = null;\n\n  @State() channelMode: ColorMode = \"rgb\";\n\n  @State() channels: Channels = this.toChannels(DEFAULT_COLOR);\n\n  @State() defaultMessages: ColorPickerMessages;\n\n  @State() dimensions = DIMENSIONS.m;\n\n  @State() effectiveLocale = \"\";\n\n  @Watch(\"effectiveLocale\")\n  effectiveLocaleChange(): void {\n    updateMessages(this, this.effectiveLocale);\n  }\n\n  /**\n   * Made into a prop for testing purposes only\n   *\n   * @internal\n   */\n  // eslint-disable-next-line @stencil-community/strict-mutable -- updated by t9n module\n  @Prop({ mutable: true }) messages: ColorPickerMessages;\n\n  @State() savedColors: string[] = [];\n\n  @State() colorFieldScopeTop: number;\n\n  @State() colorFieldScopeLeft: number;\n\n  @State() hueScopeLeft: number;\n\n  @State() opacityScopeLeft: number;\n\n  @State() scopeOrientation: \"vertical\" | \"horizontal\";\n\n  //--------------------------------------------------------------------------\n  //\n  //  Events\n  //\n  //--------------------------------------------------------------------------\n\n  /**\n   * Fires when the color value has changed.\n   */\n  @Event({ cancelable: false }) calciteColorPickerChange: EventEmitter<void>;\n\n  /**\n   * Fires as the color value changes.\n   *\n   * Similar to the `calciteColorPickerChange` event with the exception of dragging. When dragging the color field or hue slider thumb, this event fires as the thumb is moved.\n   */\n  @Event({ cancelable: false }) calciteColorPickerInput: EventEmitter<void>;\n\n  private handleTabActivate = (event: Event): void => {\n    this.channelMode = (event.currentTarget as HTMLElement).getAttribute(\n      \"data-color-mode\",\n    ) as ColorMode;\n\n    this.updateChannelsFromColor(this.color);\n  };\n\n  private handleColorFieldScopeKeyDown = (event: KeyboardEvent): void => {\n    const { key } = event;\n    const arrowKeyToXYOffset = {\n      ArrowUp: { x: 0, y: -10 },\n      ArrowRight: { x: 10, y: 0 },\n      ArrowDown: { x: 0, y: 10 },\n      ArrowLeft: { x: -10, y: 0 },\n    };\n\n    if (arrowKeyToXYOffset[key]) {\n      event.preventDefault();\n      this.scopeOrientation = key === \"ArrowDown\" || key === \"ArrowUp\" ? \"vertical\" : \"horizontal\";\n      this.captureColorFieldColor(\n        this.colorFieldScopeLeft + arrowKeyToXYOffset[key].x || 0,\n        this.colorFieldScopeTop + arrowKeyToXYOffset[key].y || 0,\n        false,\n      );\n    }\n  };\n\n  private handleHueScopeKeyDown = (event: KeyboardEvent): void => {\n    const modifier = event.shiftKey ? 10 : 1;\n    const { key } = event;\n    const arrowKeyToXOffset = {\n      ArrowUp: 1,\n      ArrowRight: 1,\n      ArrowDown: -1,\n      ArrowLeft: -1,\n    };\n\n    if (arrowKeyToXOffset[key]) {\n      event.preventDefault();\n      const delta = arrowKeyToXOffset[key] * modifier;\n      const hue = this.baseColorFieldColor.hue();\n      const color = this.baseColorFieldColor.hue(hue + delta);\n      this.internalColorSet(color, false);\n    }\n  };\n\n  private handleHexInputChange = (event: Event): void => {\n    event.stopPropagation();\n    const { isClearable, color } = this;\n    const input = event.target as HTMLCalciteColorPickerHexInputElement;\n    const hex = input.value;\n\n    if (isClearable && !hex) {\n      this.internalColorSet(null);\n      return;\n    }\n\n    const normalizedHex = color && normalizeHex(hexify(color, alphaCompatible(this.mode)));\n\n    if (hex !== normalizedHex) {\n      this.internalColorSet(Color(hex));\n    }\n  };\n\n  private handleSavedColorSelect = (event: Event): void => {\n    const swatch = event.currentTarget as HTMLCalciteColorPickerSwatchElement;\n    this.internalColorSet(Color(swatch.color));\n  };\n\n  private handleChannelInput = (event: CustomEvent): void => {\n    const input = event.currentTarget as HTMLCalciteInputNumberElement;\n    const channelIndex = Number(input.getAttribute(\"data-channel-index\"));\n    const isAlphaChannel = channelIndex === 3;\n\n    const limit = isAlphaChannel\n      ? OPACITY_LIMITS.max\n      : this.channelMode === \"rgb\"\n        ? RGB_LIMITS[Object.keys(RGB_LIMITS)[channelIndex]]\n        : HSV_LIMITS[Object.keys(HSV_LIMITS)[channelIndex]];\n\n    let inputValue: string;\n\n    if (!input.value) {\n      inputValue = \"\";\n      this.isActiveChannelInputEmpty = true;\n      // reset this to allow typing in new value, when channel input is cleared after ArrowUp or ArrowDown have been pressed\n      this.upOrDownArrowKeyTracker = null;\n    } else {\n      const value = Number(input.value);\n      const adjustedValue = value + this.shiftKeyChannelAdjustment;\n      const clamped = clamp(adjustedValue, 0, limit);\n\n      inputValue = clamped.toString();\n    }\n\n    input.value = inputValue;\n\n    if (inputValue !== \"\" && this.shiftKeyChannelAdjustment !== 0) {\n      // we treat nudging as a change event since the input won't emit when modifying the value directly\n      this.handleChannelChange(event);\n    } else if (inputValue !== \"\") {\n      this.handleChannelChange(event);\n    }\n  };\n\n  private handleChannelBlur = (event: CustomEvent): void => {\n    const input = event.currentTarget as HTMLCalciteInputNumberElement;\n    const channelIndex = Number(input.getAttribute(\"data-channel-index\"));\n    const channels = [...this.channels] as this[\"channels\"];\n    const restoreValueDueToEmptyInput = !input.value && !this.isClearable;\n\n    if (restoreValueDueToEmptyInput) {\n      input.value = channels[channelIndex]?.toString();\n    }\n  };\n\n  handleChannelFocus = (event: Event): void => {\n    const input = event.currentTarget as HTMLCalciteInputNumberElement;\n    input.selectText();\n  };\n\n  // using @Listen as a workaround for VDOM listener not firing\n  @Listen(\"keydown\", { capture: true })\n  @Listen(\"keyup\", { capture: true })\n  protected handleChannelKeyUpOrDown(event: KeyboardEvent): void {\n    this.shiftKeyChannelAdjustment = 0;\n    const { key } = event;\n\n    if (\n      (key !== \"ArrowUp\" && key !== \"ArrowDown\") ||\n      !event.composedPath().some((node: HTMLElement) => node.classList?.contains(CSS.channel))\n    ) {\n      return;\n    }\n\n    const { shiftKey } = event;\n    event.preventDefault();\n\n    if (!this.color) {\n      this.internalColorSet(this.previousColor);\n      event.stopPropagation();\n      return;\n    }\n\n    // this gets applied to the input's up/down arrow increment/decrement\n    const complementaryBump = 9;\n\n    this.shiftKeyChannelAdjustment =\n      key === \"ArrowUp\" && shiftKey\n        ? complementaryBump\n        : key === \"ArrowDown\" && shiftKey\n          ? -complementaryBump\n          : 0;\n\n    if (key === \"ArrowUp\") {\n      this.upOrDownArrowKeyTracker = \"up\";\n    }\n    if (key === \"ArrowDown\") {\n      this.upOrDownArrowKeyTracker = \"down\";\n    }\n  }\n\n  private getChannelInputLimit(channelIndex: number): number {\n    return this.channelMode === \"rgb\"\n      ? RGB_LIMITS[Object.keys(RGB_LIMITS)[channelIndex]]\n      : HSV_LIMITS[Object.keys(HSV_LIMITS)[channelIndex]];\n  }\n\n  private handleChannelChange = (event: CustomEvent): void => {\n    const input = event.currentTarget as HTMLCalciteInputNumberElement;\n    const channelIndex = Number(input.getAttribute(\"data-channel-index\"));\n    const channels = [...this.channels] as this[\"channels\"];\n\n    const shouldClearChannels = this.isClearable && !input.value;\n\n    if (shouldClearChannels) {\n      this.channels = [null, null, null, null];\n      this.internalColorSet(null);\n      return;\n    }\n\n    const isAlphaChannel = channelIndex === 3;\n\n    if (this.isActiveChannelInputEmpty && this.upOrDownArrowKeyTracker) {\n      input.value =\n        this.upOrDownArrowKeyTracker === \"up\"\n          ? (channels[channelIndex] + 1 <= this.getChannelInputLimit(channelIndex)\n              ? channels[channelIndex] + 1\n              : this.getChannelInputLimit(channelIndex)\n            ).toString()\n          : (channels[channelIndex] - 1 >= 0 ? channels[channelIndex] - 1 : 0).toString();\n      this.isActiveChannelInputEmpty = false;\n      this.upOrDownArrowKeyTracker = null;\n    }\n    const value = input.value ? Number(input.value) : channels[channelIndex];\n\n    channels[channelIndex] = isAlphaChannel ? opacityToAlpha(value) : value;\n    this.updateColorFromChannels(channels);\n  };\n\n  private handleSavedColorKeyDown = (event: KeyboardEvent): void => {\n    if (isActivationKey(event.key)) {\n      event.preventDefault();\n      this.handleSavedColorSelect(event);\n    }\n  };\n\n  private handleColorFieldPointerDown = (event: PointerEvent): void => {\n    this.handleCanvasControlPointerDown(\n      event,\n      this.colorFieldRenderingContext,\n      this.captureColorFieldColor,\n      this.colorFieldScopeNode,\n    );\n  };\n\n  private focusScope(focusEl: HTMLElement): void {\n    requestAnimationFrame(() => {\n      focusEl.focus();\n    });\n  }\n\n  private handleHueSliderPointerDown = (event: PointerEvent): void => {\n    this.handleCanvasControlPointerDown(\n      event,\n      this.hueSliderRenderingContext,\n      this.captureHueSliderColor,\n      this.hueScopeNode,\n    );\n  };\n\n  private handleOpacitySliderPointerDown = (event: PointerEvent): void => {\n    this.handleCanvasControlPointerDown(\n      event,\n      this.opacitySliderRenderingContext,\n      this.captureOpacitySliderValue,\n      this.opacityScopeNode,\n    );\n  };\n\n  private handleCanvasControlPointerDown(\n    event: PointerEvent,\n    renderingContext: CanvasRenderingContext2D,\n    captureValue: (offsetX: number, offsetY?: number) => void,\n    scopeNode: HTMLElement,\n  ): void {\n    if (!isPrimaryPointerButton(event)) {\n      return;\n    }\n\n    window.addEventListener(\"pointermove\", this.globalPointerMoveHandler);\n    window.addEventListener(\"pointerup\", this.globalPointerUpHandler, { once: true });\n\n    this.activeCanvasInfo = {\n      context: renderingContext,\n      bounds: renderingContext.canvas.getBoundingClientRect(),\n    };\n\n    captureValue.call(this, event.offsetX, event.offsetY);\n    this.focusScope(scopeNode);\n  }\n\n  private globalPointerUpHandler = (event: PointerEvent): void => {\n    if (!isPrimaryPointerButton(event)) {\n      return;\n    }\n\n    const previouslyDragging = this.activeCanvasInfo;\n    this.activeCanvasInfo = null;\n    this.drawColorControls();\n\n    if (previouslyDragging) {\n      this.calciteColorPickerChange.emit();\n    }\n  };\n\n  private globalPointerMoveHandler = (event: PointerEvent): void => {\n    const { activeCanvasInfo, el } = this;\n\n    if (!el.isConnected || !activeCanvasInfo) {\n      return;\n    }\n\n    const { context, bounds } = activeCanvasInfo;\n\n    let samplingX: number;\n    let samplingY: number;\n\n    const { clientX, clientY } = event;\n\n    if (context.canvas.matches(\":hover\")) {\n      samplingX = clientX - bounds.x;\n      samplingY = clientY - bounds.y;\n    } else {\n      // snap x and y to the closest edge\n\n      if (clientX < bounds.x + bounds.width && clientX > bounds.x) {\n        samplingX = clientX - bounds.x;\n      } else if (clientX < bounds.x) {\n        samplingX = 0;\n      } else {\n        samplingX = bounds.width;\n      }\n\n      if (clientY < bounds.y + bounds.height && clientY > bounds.y) {\n        samplingY = clientY - bounds.y;\n      } else if (clientY < bounds.y) {\n        samplingY = 0;\n      } else {\n        samplingY = bounds.height;\n      }\n    }\n\n    if (context === this.colorFieldRenderingContext) {\n      this.captureColorFieldColor(samplingX, samplingY, false);\n    } else if (context === this.hueSliderRenderingContext) {\n      this.captureHueSliderColor(samplingX);\n    } else if (context === this.opacitySliderRenderingContext) {\n      this.captureOpacitySliderValue(samplingX);\n    }\n  };\n\n  //--------------------------------------------------------------------------\n  //\n  //  Public Methods\n  //\n  //--------------------------------------------------------------------------\n\n  /** Sets focus on the component's first focusable element. */\n  @Method()\n  async setFocus(): Promise<void> {\n    await componentFocusable(this);\n\n    focusFirstTabbable(this.el);\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Lifecycle\n  //\n  //--------------------------------------------------------------------------\n\n  async componentWillLoad(): Promise<void> {\n    setUpLoadableComponent(this);\n\n    this.handleAllowEmptyOrClearableChange();\n    this.handleAlphaChannelDimensionsChange();\n\n    const { isClearable, color, format, value } = this;\n    const willSetNoColor = isClearable && !value;\n    const parsedMode = parseMode(value);\n    const valueIsCompatible =\n      willSetNoColor || (format === \"auto\" && parsedMode) || format === parsedMode;\n    const initialColor = willSetNoColor ? null : valueIsCompatible ? Color(value) : color;\n\n    if (!valueIsCompatible) {\n      this.showIncompatibleColorWarning(value, format);\n    }\n    this.setMode(format, false);\n    this.internalColorSet(initialColor, false, \"initial\");\n\n    this.updateDimensions(this.scale);\n\n    const storageKey = `${DEFAULT_STORAGE_KEY_PREFIX}${this.storageId}`;\n\n    if (this.storageId && localStorage.getItem(storageKey)) {\n      this.savedColors = JSON.parse(localStorage.getItem(storageKey));\n    }\n\n    await setUpMessages(this);\n  }\n\n  connectedCallback(): void {\n    connectLocalized(this);\n    connectMessages(this);\n  }\n\n  componentDidLoad(): void {\n    setComponentLoaded(this);\n  }\n\n  disconnectedCallback(): void {\n    window.removeEventListener(\"pointermove\", this.globalPointerMoveHandler);\n    window.removeEventListener(\"pointerup\", this.globalPointerUpHandler);\n    disconnectLocalized(this);\n    disconnectMessages(this);\n  }\n\n  componentDidRender(): void {\n    updateHostInteraction(this);\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Render Methods\n  //\n  //--------------------------------------------------------------------------\n\n  render(): VNode {\n    const {\n      channelsDisabled,\n      color,\n      colorFieldScopeLeft,\n      colorFieldScopeTop,\n      dimensions: {\n        thumb: { radius: thumbRadius },\n      },\n      hexDisabled,\n      hideChannels,\n      hideHex,\n      hideSaved,\n      hueScopeLeft,\n      messages,\n      alphaChannel,\n      opacityScopeLeft,\n      savedColors,\n      savedDisabled,\n      scale,\n      scopeOrientation,\n    } = this;\n\n    const sliderWidth = this.effectiveSliderWidth;\n    const selectedColorInHex = color ? hexify(color, alphaChannel) : null;\n    const hueTop = thumbRadius;\n    const hueLeft = hueScopeLeft ?? (sliderWidth * DEFAULT_COLOR.hue()) / HSV_LIMITS.h;\n    const opacityTop = thumbRadius;\n    const opacityLeft =\n      opacityScopeLeft ??\n      (sliderWidth * alphaToOpacity(DEFAULT_COLOR.alpha())) / OPACITY_LIMITS.max;\n    const noColor = color === null;\n    const vertical = scopeOrientation === \"vertical\";\n    const noHex = hexDisabled || hideHex;\n    const noChannels = channelsDisabled || hideChannels;\n    const noSaved = savedDisabled || hideSaved;\n    const [adjustedColorFieldScopeLeft, adjustedColorFieldScopeTop] = this.getAdjustedScopePosition(\n      colorFieldScopeLeft,\n      colorFieldScopeTop,\n    );\n    const [adjustedHueScopeLeft, adjustedHueScopeTop] = this.getAdjustedScopePosition(\n      hueLeft,\n      hueTop,\n    );\n    const [adjustedOpacityScopeLeft, adjustedOpacityScopeTop] = this.getAdjustedScopePosition(\n      opacityLeft,\n      opacityTop,\n    );\n\n    return (\n      <InteractiveContainer disabled={this.disabled}>\n        <div class={CSS.container}>\n          <div class={CSS.controlAndScope}>\n            <canvas\n              class={CSS.colorField}\n              onPointerDown={this.handleColorFieldPointerDown}\n              ref={this.initColorField}\n            />\n            <div\n              aria-label={vertical ? messages.value : messages.saturation}\n              aria-valuemax={vertical ? HSV_LIMITS.v : HSV_LIMITS.s}\n              aria-valuemin=\"0\"\n              aria-valuenow={(vertical ? color?.saturationv() : color?.value()) || \"0\"}\n              class={{ [CSS.scope]: true, [CSS.colorFieldScope]: true }}\n              onKeyDown={this.handleColorFieldScopeKeyDown}\n              ref={this.storeColorFieldScope}\n              role=\"slider\"\n              style={{\n                top: `${adjustedColorFieldScopeTop || 0}px`,\n                left: `${adjustedColorFieldScopeLeft || 0}px`,\n              }}\n              tabindex=\"0\"\n            />\n          </div>\n          <div class={CSS.previewAndSliders}>\n            <calcite-color-picker-swatch\n              class={CSS.preview}\n              color={selectedColorInHex}\n              scale={this.alphaChannel ? \"l\" : this.scale}\n            />\n            <div class={CSS.sliders}>\n              <div class={CSS.controlAndScope}>\n                <canvas\n                  class={{ [CSS.slider]: true, [CSS.hueSlider]: true }}\n                  onPointerDown={this.handleHueSliderPointerDown}\n                  ref={this.initHueSlider}\n                />\n                <div\n                  aria-label={messages.hue}\n                  aria-valuemax={HSV_LIMITS.h}\n                  aria-valuemin=\"0\"\n                  aria-valuenow={color?.round().hue() || DEFAULT_COLOR.round().hue()}\n                  class={{ [CSS.scope]: true, [CSS.hueScope]: true }}\n                  onKeyDown={this.handleHueScopeKeyDown}\n                  ref={this.storeHueScope}\n                  role=\"slider\"\n                  style={{\n                    top: `${adjustedHueScopeTop}px`,\n                    left: `${adjustedHueScopeLeft}px`,\n                  }}\n                  tabindex=\"0\"\n                />\n              </div>\n              {alphaChannel ? (\n                <div class={CSS.controlAndScope}>\n                  <canvas\n                    class={{ [CSS.slider]: true, [CSS.opacitySlider]: true }}\n                    onPointerDown={this.handleOpacitySliderPointerDown}\n                    ref={this.initOpacitySlider}\n                  />\n                  <div\n                    aria-label={messages.opacity}\n                    aria-valuemax={OPACITY_LIMITS.max}\n                    aria-valuemin={OPACITY_LIMITS.min}\n                    aria-valuenow={(color || DEFAULT_COLOR).round().alpha()}\n                    class={{ [CSS.scope]: true, [CSS.opacityScope]: true }}\n                    onKeyDown={this.handleOpacityScopeKeyDown}\n                    ref={this.storeOpacityScope}\n                    role=\"slider\"\n                    style={{\n                      top: `${adjustedOpacityScopeTop}px`,\n                      left: `${adjustedOpacityScopeLeft}px`,\n                    }}\n                    tabindex=\"0\"\n                  />\n                </div>\n              ) : null}\n            </div>\n          </div>\n          {noHex && noChannels ? null : (\n            <div\n              class={{\n                [CSS.controlSection]: true,\n                [CSS.section]: true,\n              }}\n            >\n              <div class={CSS.hexAndChannelsGroup}>\n                {noHex ? null : (\n                  <div class={CSS.hexOptions}>\n                    <calcite-color-picker-hex-input\n                      allowEmpty={this.isClearable}\n                      alphaChannel={alphaChannel}\n                      class={CSS.control}\n                      messages={messages}\n                      numberingSystem={this.numberingSystem}\n                      onCalciteColorPickerHexInputChange={this.handleHexInputChange}\n                      scale={scale}\n                      value={selectedColorInHex}\n                    />\n                  </div>\n                )}\n                {noChannels ? null : (\n                  <calcite-tabs\n                    class={{\n                      [CSS.colorModeContainer]: true,\n                      [CSS.splitSection]: true,\n                    }}\n                    scale={scale === \"l\" ? \"m\" : \"s\"}\n                  >\n                    <calcite-tab-nav slot=\"title-group\">\n                      {this.renderChannelsTabTitle(\"rgb\")}\n                      {this.renderChannelsTabTitle(\"hsv\")}\n                    </calcite-tab-nav>\n                    {this.renderChannelsTab(\"rgb\")}\n                    {this.renderChannelsTab(\"hsv\")}\n                  </calcite-tabs>\n                )}\n              </div>\n            </div>\n          )}\n          {noSaved ? null : (\n            <div class={{ [CSS.savedColorsSection]: true, [CSS.section]: true }}>\n              <div class={CSS.header}>\n                <label>{messages.saved}</label>\n                <div class={CSS.savedColorsButtons}>\n                  <calcite-button\n                    appearance=\"transparent\"\n                    class={CSS.deleteColor}\n                    disabled={noColor}\n                    iconStart=\"minus\"\n                    kind=\"neutral\"\n                    label={messages.deleteColor}\n                    onClick={this.deleteColor}\n                    scale={scale}\n                    type=\"button\"\n                  />\n                  <calcite-button\n                    appearance=\"transparent\"\n                    class={CSS.saveColor}\n                    disabled={noColor}\n                    iconStart=\"plus\"\n                    kind=\"neutral\"\n                    label={messages.saveColor}\n                    onClick={this.saveColor}\n                    scale={scale}\n                    type=\"button\"\n                  />\n                </div>\n              </div>\n              {savedColors.length > 0 ? (\n                <div class={CSS.savedColors}>\n                  {[\n                    ...savedColors.map((color) => (\n                      <calcite-color-picker-swatch\n                        class={CSS.savedColor}\n                        color={color}\n                        key={color}\n                        onClick={this.handleSavedColorSelect}\n                        onKeyDown={this.handleSavedColorKeyDown}\n                        scale={scale}\n                        tabIndex={0}\n                      />\n                    )),\n                  ]}\n                </div>\n              ) : null}\n            </div>\n          )}\n        </div>\n      </InteractiveContainer>\n    );\n  }\n\n  private storeColorFieldScope = (node: HTMLDivElement): void => {\n    this.colorFieldScopeNode = node;\n  };\n\n  private storeHueScope = (node: HTMLDivElement): void => {\n    this.hueScopeNode = node;\n  };\n\n  private renderChannelsTabTitle = (channelMode: this[\"channelMode\"]): VNode => {\n    const { channelMode: activeChannelMode, messages } = this;\n    const selected = channelMode === activeChannelMode;\n    const label = channelMode === \"rgb\" ? messages.rgb : messages.hsv;\n\n    return (\n      <calcite-tab-title\n        class={CSS.colorMode}\n        data-color-mode={channelMode}\n        key={channelMode}\n        onCalciteTabsActivate={this.handleTabActivate}\n        selected={selected}\n      >\n        {label}\n      </calcite-tab-title>\n    );\n  };\n\n  private renderChannelsTab = (channelMode: this[\"channelMode\"]): VNode => {\n    const { isClearable, channelMode: activeChannelMode, channels, messages, alphaChannel } = this;\n    const selected = channelMode === activeChannelMode;\n    const isRgb = channelMode === \"rgb\";\n    const channelAriaLabels = isRgb\n      ? [messages.red, messages.green, messages.blue]\n      : [messages.hue, messages.saturation, messages.value];\n    const direction = getElementDir(this.el);\n    const channelsToRender = alphaChannel ? channels : channels.slice(0, 3);\n\n    return (\n      <calcite-tab class={CSS.control} key={channelMode} selected={selected}>\n        {/* channel order should not be mirrored */}\n        <div class={CSS.channels} dir=\"ltr\">\n          {channelsToRender.map((channelValue, index) => {\n            const isAlphaChannel = index === 3;\n\n            if (isAlphaChannel) {\n              channelValue =\n                isClearable && !channelValue ? channelValue : alphaToOpacity(channelValue);\n            }\n\n            /* the channel container is ltr, so we apply the host's direction */\n            return this.renderChannel(\n              channelValue,\n              index,\n              channelAriaLabels[index],\n              direction,\n              isAlphaChannel ? \"%\" : \"\",\n            );\n          })}\n        </div>\n      </calcite-tab>\n    );\n  };\n\n  private renderChannel = (\n    value: number | null,\n    index: number,\n    ariaLabel: string,\n    direction: Direction,\n    suffix?: string,\n  ): VNode => {\n    return (\n      <calcite-input-number\n        class={CSS.channel}\n        data-channel-index={index}\n        dir={direction}\n        key={index}\n        label={ariaLabel}\n        lang={this.effectiveLocale}\n        numberButtonType=\"none\"\n        numberingSystem={this.numberingSystem}\n        onCalciteInputNumberChange={this.handleChannelChange}\n        onCalciteInputNumberInput={this.handleChannelInput}\n        onCalciteInternalInputNumberBlur={this.handleChannelBlur}\n        onCalciteInternalInputNumberFocus={this.handleChannelFocus}\n        onKeyDown={this.handleKeyDown}\n        scale={this.scale === \"l\" ? \"m\" : \"s\"}\n        // workaround to ensure input borders overlap as desired\n        // this is because the build transforms margin-left to its\n        // logical-prop, which is undesired as channels are always ltr\n        style={{\n          marginLeft:\n            index > 0 && !(this.scale === \"s\" && this.alphaChannel && index === 3) ? \"-1px\" : \"\",\n        }}\n        suffixText={suffix}\n        value={value?.toString()}\n      />\n    );\n  };\n\n  // --------------------------------------------------------------------------\n  //\n  //  Private Methods\n  //\n  //--------------------------------------------------------------------------\n\n  handleKeyDown(event: KeyboardEvent): void {\n    if (event.key === \"Enter\") {\n      event.preventDefault();\n    }\n  }\n\n  private showIncompatibleColorWarning(value: ColorValue, format: Format): void {\n    console.warn(\n      `ignoring color value (${value}) as it is not compatible with the current format (${format})`,\n    );\n  }\n\n  private setMode(format: ColorPicker[\"format\"], warn = true): void {\n    const mode = format === \"auto\" ? this.mode : format;\n    this.mode = this.ensureCompatibleMode(mode, warn);\n  }\n\n  private ensureCompatibleMode(mode: SupportedMode, warn): SupportedMode {\n    const { alphaChannel } = this;\n    const isAlphaCompatible = alphaCompatible(mode);\n\n    if (alphaChannel && !isAlphaCompatible) {\n      const alphaMode = toAlphaMode(mode);\n\n      if (warn) {\n        console.warn(\n          `setting format to (${alphaMode}) as the provided one (${mode}) does not support alpha`,\n        );\n      }\n\n      return alphaMode;\n    }\n\n    if (!alphaChannel && isAlphaCompatible) {\n      const nonAlphaMode = toNonAlphaMode(mode);\n\n      if (warn) {\n        console.warn(\n          `setting format to (${nonAlphaMode}) as the provided one (${mode}) does not support alpha`,\n        );\n      }\n\n      return nonAlphaMode;\n    }\n\n    return mode;\n  }\n\n  private captureHueSliderColor(x: number): void {\n    const hue = (HUE_LIMIT_CONSTRAINED / this.effectiveSliderWidth) * x;\n\n    this.internalColorSet(this.baseColorFieldColor.hue(hue), false);\n  }\n\n  private captureOpacitySliderValue(x: number): void {\n    const alpha = opacityToAlpha((OPACITY_LIMITS.max / this.effectiveSliderWidth) * x);\n\n    this.internalColorSet(this.baseColorFieldColor.alpha(alpha), false);\n  }\n\n  private internalColorSet(\n    color: Color | null,\n    skipEqual = true,\n    context: ColorPicker[\"internalColorUpdateContext\"] = \"user-interaction\",\n  ): void {\n    if (skipEqual && colorEqual(color, this.color)) {\n      return;\n    }\n\n    this.internalColorUpdateContext = context;\n    this.color = color;\n    this.value = this.toValue(color);\n    this.internalColorUpdateContext = null;\n  }\n\n  private toValue(color: Color | null, format: SupportedMode = this.mode): ColorValue | null {\n    if (!color) {\n      return null;\n    }\n\n    const hexMode = \"hex\";\n\n    if (format.includes(hexMode)) {\n      const hasAlpha = format === CSSColorMode.HEXA;\n      return normalizeHex(hexify(color.round(), hasAlpha), hasAlpha);\n    }\n\n    if (format.includes(\"-css\")) {\n      const value = color[format.replace(\"-css\", \"\").replace(\"a\", \"\")]().round().string();\n\n      // Color omits alpha values when alpha is 1\n      const needToInjectAlpha =\n        (format.endsWith(\"a\") || format.endsWith(\"a-css\")) && color.alpha() === 1;\n      if (needToInjectAlpha) {\n        const model = value.slice(0, 3);\n        const values = value.slice(4, -1);\n        return `${model}a(${values}, ${color.alpha()})`;\n      }\n\n      return value;\n    }\n\n    const colorObject =\n      /* Color() does not support hsva, hsla nor rgba, so we use the non-alpha mode */\n      color[toNonAlphaMode(format)]().round().object();\n\n    if (format.endsWith(\"a\")) {\n      return normalizeAlpha(colorObject);\n    }\n\n    return colorObject;\n  }\n\n  private getSliderCapSpacing(): number {\n    const {\n      dimensions: {\n        slider: { height },\n        thumb: { radius },\n      },\n    } = this;\n\n    return radius * 2 - height;\n  }\n\n  private updateDimensions(scale: Scale = \"m\"): void {\n    this.dimensions = DIMENSIONS[scale];\n  }\n\n  private deleteColor = (): void => {\n    const colorToDelete = hexify(this.color, this.alphaChannel);\n    const inStorage = this.savedColors.indexOf(colorToDelete) > -1;\n\n    if (!inStorage) {\n      return;\n    }\n\n    const savedColors = this.savedColors.filter((color) => color !== colorToDelete);\n\n    this.savedColors = savedColors;\n\n    const storageKey = `${DEFAULT_STORAGE_KEY_PREFIX}${this.storageId}`;\n\n    if (this.storageId) {\n      localStorage.setItem(storageKey, JSON.stringify(savedColors));\n    }\n  };\n\n  private saveColor = (): void => {\n    const colorToSave = hexify(this.color, this.alphaChannel);\n    const alreadySaved = this.savedColors.indexOf(colorToSave) > -1;\n\n    if (alreadySaved) {\n      return;\n    }\n\n    const savedColors = [...this.savedColors, colorToSave];\n\n    this.savedColors = savedColors;\n\n    const storageKey = `${DEFAULT_STORAGE_KEY_PREFIX}${this.storageId}`;\n\n    if (this.storageId) {\n      localStorage.setItem(storageKey, JSON.stringify(savedColors));\n    }\n  };\n\n  private drawColorControls = throttle(\n    (type: \"all\" | \"color-field\" | \"hue-slider\" | \"opacity-slider\" = \"all\"): void => {\n      if ((type === \"all\" || type === \"color-field\") && this.colorFieldRenderingContext) {\n        this.drawColorField();\n      }\n\n      if ((type === \"all\" || type === \"hue-slider\") && this.hueSliderRenderingContext) {\n        this.drawHueSlider();\n      }\n\n      if (\n        this.alphaChannel &&\n        (type === \"all\" || type === \"opacity-slider\") &&\n        this.opacitySliderRenderingContext\n      ) {\n        this.drawOpacitySlider();\n      }\n    },\n    throttleFor60FpsInMs,\n  );\n\n  private drawColorField(): void {\n    const context = this.colorFieldRenderingContext;\n    const {\n      dimensions: {\n        colorField: { height, width },\n      },\n    } = this;\n\n    context.fillStyle = this.baseColorFieldColor\n      .hsv()\n      .saturationv(100)\n      .value(100)\n      .alpha(1)\n      .string();\n    context.fillRect(0, 0, width, height);\n\n    const whiteGradient = context.createLinearGradient(0, 0, width, 0);\n    whiteGradient.addColorStop(0, \"rgba(255,255,255,1)\");\n    whiteGradient.addColorStop(1, \"rgba(255,255,255,0)\");\n    context.fillStyle = whiteGradient;\n    context.fillRect(0, 0, width, height);\n\n    const blackGradient = context.createLinearGradient(0, 0, 0, height);\n    blackGradient.addColorStop(0, \"rgba(0,0,0,0)\");\n    blackGradient.addColorStop(1, \"rgba(0,0,0,1)\");\n    context.fillStyle = blackGradient;\n    context.fillRect(0, 0, width, height);\n\n    this.drawActiveColorFieldColor();\n  }\n\n  private setCanvasContextSize(\n    canvas: HTMLCanvasElement,\n    { height, width }: { height: number; width: number },\n  ): void {\n    if (!canvas) {\n      return;\n    }\n\n    const devicePixelRatio = window.devicePixelRatio || 1;\n\n    canvas.width = width * devicePixelRatio;\n    canvas.height = height * devicePixelRatio;\n    canvas.style.height = `${height}px`;\n    canvas.style.width = `${width}px`;\n\n    const context = canvas.getContext(\"2d\");\n    context.scale(devicePixelRatio, devicePixelRatio);\n  }\n\n  private captureColorFieldColor = (x: number, y: number, skipEqual = true): void => {\n    const {\n      dimensions: {\n        colorField: { height, width },\n      },\n    } = this;\n    const saturation = Math.round((HSV_LIMITS.s / width) * x);\n    const value = Math.round((HSV_LIMITS.v / height) * (height - y));\n\n    this.internalColorSet(\n      this.baseColorFieldColor.hsv().saturationv(saturation).value(value),\n      skipEqual,\n    );\n  };\n\n  private initColorField = (canvas: HTMLCanvasElement): void => {\n    this.colorFieldRenderingContext = canvas.getContext(\"2d\");\n    this.updateCanvasSize(\"color-field\");\n    this.drawColorControls();\n  };\n\n  private initHueSlider = (canvas: HTMLCanvasElement): void => {\n    this.hueSliderRenderingContext = canvas.getContext(\"2d\");\n    this.updateCanvasSize(\"hue-slider\");\n    this.drawHueSlider();\n  };\n\n  private initOpacitySlider = (canvas: HTMLCanvasElement): void => {\n    if (!canvas) {\n      return;\n    }\n\n    this.opacitySliderRenderingContext = canvas.getContext(\"2d\");\n    this.updateCanvasSize(\"opacity-slider\");\n    this.drawOpacitySlider();\n  };\n\n  private updateCanvasSize(\n    context: \"all\" | \"color-field\" | \"hue-slider\" | \"opacity-slider\" = \"all\",\n  ): void {\n    const { dimensions } = this;\n\n    if (context === \"all\" || context === \"color-field\") {\n      this.setCanvasContextSize(this.colorFieldRenderingContext?.canvas, dimensions.colorField);\n    }\n\n    const adjustedSliderDimensions = {\n      width: this.effectiveSliderWidth,\n      height:\n        dimensions.slider.height + (dimensions.thumb.radius - dimensions.slider.height / 2) * 2,\n    };\n\n    if (context === \"all\" || context === \"hue-slider\") {\n      this.setCanvasContextSize(this.hueSliderRenderingContext?.canvas, adjustedSliderDimensions);\n    }\n\n    if (context === \"all\" || context === \"opacity-slider\") {\n      this.setCanvasContextSize(\n        this.opacitySliderRenderingContext?.canvas,\n        adjustedSliderDimensions,\n      );\n    }\n  }\n\n  private drawActiveColorFieldColor(): void {\n    const { color } = this;\n\n    if (!color) {\n      return;\n    }\n\n    const hsvColor = color.hsv();\n\n    const {\n      dimensions: {\n        colorField: { height, width },\n        thumb: { radius },\n      },\n    } = this;\n\n    const x = hsvColor.saturationv() / (HSV_LIMITS.s / width);\n    const y = height - hsvColor.value() / (HSV_LIMITS.v / height);\n\n    requestAnimationFrame(() => {\n      this.colorFieldScopeLeft = x;\n      this.colorFieldScopeTop = y;\n    });\n\n    this.drawThumb(this.colorFieldRenderingContext, radius, x, y, hsvColor, false);\n  }\n\n  private drawThumb(\n    context: CanvasRenderingContext2D,\n    radius: number,\n    x: number,\n    y: number,\n    color: Color,\n    applyAlpha: boolean,\n  ): void {\n    const startAngle = 0;\n    const endAngle = 2 * Math.PI;\n    const outlineWidth = 1;\n\n    context.beginPath();\n    context.arc(x, y, radius, startAngle, endAngle);\n    context.fillStyle = \"#fff\";\n    context.fill();\n\n    context.strokeStyle = \"rgba(0,0,0,0.3)\";\n    context.lineWidth = outlineWidth;\n    context.stroke();\n\n    if (applyAlpha && color.alpha() < 1) {\n      const pattern = context.createPattern(this.getCheckeredBackgroundPattern(), \"repeat\");\n      context.beginPath();\n      context.arc(x, y, radius - 3, startAngle, endAngle);\n      context.fillStyle = pattern;\n      context.fill();\n    }\n\n    context.globalCompositeOperation = \"source-atop\";\n\n    context.beginPath();\n    context.arc(x, y, radius - 3, startAngle, endAngle);\n    const alpha = applyAlpha ? color.alpha() : 1;\n    context.fillStyle = color.rgb().alpha(alpha).string();\n    context.fill();\n\n    context.globalCompositeOperation = \"source-over\";\n  }\n\n  private drawActiveHueSliderColor(): void {\n    const { color } = this;\n\n    if (!color) {\n      return;\n    }\n\n    const hsvColor = color.hsv().saturationv(100).value(100);\n\n    const {\n      dimensions: {\n        thumb: { radius },\n      },\n    } = this;\n\n    const width = this.effectiveSliderWidth;\n    const x = hsvColor.hue() / (HUE_LIMIT_CONSTRAINED / width);\n    const y = radius;\n    const sliderBoundX = this.getSliderBoundX(x, width, radius);\n\n    requestAnimationFrame(() => {\n      this.hueScopeLeft = sliderBoundX;\n    });\n\n    this.drawThumb(this.hueSliderRenderingContext, radius, sliderBoundX, y, hsvColor, false);\n  }\n\n  private drawHueSlider(): void {\n    const context = this.hueSliderRenderingContext;\n    const {\n      dimensions: {\n        slider: { height },\n        thumb: { radius: thumbRadius },\n      },\n    } = this;\n\n    const x = 0;\n    const y = thumbRadius - height / 2;\n    const width = this.effectiveSliderWidth;\n\n    const gradient = context.createLinearGradient(0, 0, width, 0);\n\n    const hueSliderColorStopKeywords = [\n      \"red\",\n      \"yellow\",\n      \"lime\",\n      \"cyan\",\n      \"blue\",\n      \"magenta\",\n      \"#ff0004\" /* 1 unit less than #ff0 to avoid duplicate values within range */,\n    ];\n\n    const offset = 1 / (hueSliderColorStopKeywords.length - 1);\n    let currentOffset = 0;\n\n    hueSliderColorStopKeywords.forEach((keyword) => {\n      gradient.addColorStop(currentOffset, Color(keyword).string());\n      currentOffset += offset;\n    });\n\n    context.clearRect(0, 0, width, height + this.getSliderCapSpacing() * 2);\n\n    this.drawSliderPath(context, height, width, x, y);\n\n    context.fillStyle = gradient;\n    context.fill();\n\n    context.strokeStyle = \"rgba(0,0,0,0.3)\";\n    context.lineWidth = 1;\n    context.stroke();\n\n    this.drawActiveHueSliderColor();\n  }\n\n  private drawOpacitySlider(): void {\n    const context = this.opacitySliderRenderingContext;\n    const {\n      baseColorFieldColor: previousColor,\n      dimensions: {\n        slider: { height },\n        thumb: { radius: thumbRadius },\n      },\n    } = this;\n\n    const x = 0;\n    const y = thumbRadius - height / 2;\n    const width = this.effectiveSliderWidth;\n\n    context.clearRect(0, 0, width, height + this.getSliderCapSpacing() * 2);\n\n    const gradient = context.createLinearGradient(0, y, width, 0);\n    const startColor = previousColor.rgb().alpha(0);\n    const midColor = previousColor.rgb().alpha(0.5);\n    const endColor = previousColor.rgb().alpha(1);\n\n    gradient.addColorStop(0, startColor.string());\n    gradient.addColorStop(0.5, midColor.string());\n    gradient.addColorStop(1, endColor.string());\n\n    this.drawSliderPath(context, height, width, x, y);\n\n    const pattern = context.createPattern(this.getCheckeredBackgroundPattern(), \"repeat\");\n    context.fillStyle = pattern;\n    context.fill();\n\n    context.fillStyle = gradient;\n    context.fill();\n\n    context.strokeStyle = \"rgba(0,0,0,0.3)\";\n    context.lineWidth = 1;\n    context.stroke();\n\n    this.drawActiveOpacitySliderColor();\n  }\n\n  private drawSliderPath(\n    context: CanvasRenderingContext2D,\n    height: number,\n    width: number,\n    x: number,\n    y: number,\n  ): void {\n    const radius = height / 2 + 1;\n    context.beginPath();\n    context.moveTo(x + radius, y);\n    context.lineTo(x + width - radius, y);\n    context.quadraticCurveTo(x + width, y, x + width, y + radius);\n    context.lineTo(x + width, y + height - radius);\n    context.quadraticCurveTo(x + width, y + height, x + width - radius, y + height);\n    context.lineTo(x + radius, y + height);\n    context.quadraticCurveTo(x, y + height, x, y + height - radius);\n    context.lineTo(x, y + radius);\n    context.quadraticCurveTo(x, y, x + radius, y);\n    context.closePath();\n  }\n\n  private getCheckeredBackgroundPattern(): HTMLCanvasElement {\n    if (this.checkerPattern) {\n      return this.checkerPattern;\n    }\n\n    const pattern = document.createElement(\"canvas\");\n    pattern.width = 10;\n    pattern.height = 10;\n    const patternContext = pattern.getContext(\"2d\");\n\n    patternContext.fillStyle = \"#ccc\";\n    patternContext.fillRect(0, 0, 10, 10);\n    patternContext.fillStyle = \"#fff\";\n    patternContext.fillRect(0, 0, 5, 5);\n    patternContext.fillRect(5, 5, 5, 5);\n\n    this.checkerPattern = pattern;\n\n    return pattern;\n  }\n\n  private drawActiveOpacitySliderColor(): void {\n    const { color } = this;\n\n    if (!color) {\n      return;\n    }\n\n    const hsvColor = color;\n\n    const {\n      dimensions: {\n        thumb: { radius },\n      },\n    } = this;\n\n    const width = this.effectiveSliderWidth;\n    const x = alphaToOpacity(hsvColor.alpha()) / (OPACITY_LIMITS.max / width);\n    const y = radius;\n    const sliderBoundX = this.getSliderBoundX(x, width, radius);\n\n    requestAnimationFrame(() => {\n      this.opacityScopeLeft = sliderBoundX;\n    });\n\n    this.drawThumb(this.opacitySliderRenderingContext, radius, sliderBoundX, y, hsvColor, true);\n  }\n\n  private getSliderBoundX(x: number, width: number, radius: number): number {\n    const closeToEdge = closeToRangeEdge(x, width, radius);\n\n    return closeToEdge === 0\n      ? x\n      : closeToEdge === -1\n        ? remap(x, 0, width, radius, radius * 2)\n        : remap(x, 0, width, width - radius * 2, width - radius);\n  }\n\n  private storeOpacityScope = (node: HTMLDivElement): void => {\n    this.opacityScopeNode = node;\n  };\n\n  private handleOpacityScopeKeyDown = (event: KeyboardEvent): void => {\n    const modifier = event.shiftKey ? 10 : 1;\n    const { key } = event;\n    const arrowKeyToXOffset = {\n      ArrowUp: 0.01,\n      ArrowRight: 0.01,\n      ArrowDown: -0.01,\n      ArrowLeft: -0.01,\n    };\n\n    if (arrowKeyToXOffset[key]) {\n      event.preventDefault();\n      const delta = arrowKeyToXOffset[key] * modifier;\n      const alpha = this.baseColorFieldColor.alpha();\n      const color = this.baseColorFieldColor.alpha(alpha + delta);\n      this.internalColorSet(color, false);\n    }\n  };\n\n  private updateColorFromChannels(channels: this[\"channels\"]): void {\n    this.internalColorSet(Color(channels, this.channelMode));\n  }\n\n  private updateChannelsFromColor(color: Color | null): void {\n    this.channels = color ? this.toChannels(color) : [null, null, null, null];\n  }\n\n  private toChannels(color: Color): Channels {\n    const { channelMode } = this;\n\n    const channels = color[channelMode]()\n      .array()\n      .map((value, index) => {\n        const isAlpha = index === 3;\n        return isAlpha ? value : Math.floor(value);\n      });\n\n    if (channels.length === 3) {\n      channels.push(1); // Color omits alpha when 1\n    }\n\n    return channels as Channels;\n  }\n\n  private getAdjustedScopePosition(left: number, top: number): [number, number] {\n    return [left - SCOPE_SIZE / 2, top - SCOPE_SIZE / 2];\n  }\n}\n","export const CSS = {\n  container: \"container\",\n  hexInput: \"hex-input\",\n  opacityInput: \"opacity-input\",\n};\n",":host {\n  @apply block;\n}\n\n.container {\n  @apply flex w-full items-center flex-nowrap;\n}\n\n.hex-input {\n  @apply grow uppercase;\n}\n\n.opacity-input {\n  inline-size: 68px;\n  margin-inline-start: -1px;\n}\n\n:host([scale=\"s\"]) {\n  .container {\n    @apply flex-wrap gap-y-0.5;\n  }\n\n  .opacity-input {\n    inline-size: unset;\n    margin-inline-start: unset;\n  }\n}\n\n:host([scale=\"l\"]) {\n  .opacity-input {\n    inline-size: 88px;\n  }\n}\n\n@include base-component();\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Method,\n  Prop,\n  State,\n  VNode,\n  Watch,\n} from \"@stencil/core\";\nimport Color from \"color\";\nimport { Scale } from \"../interfaces\";\nimport { Channels, RGB } from \"../color-picker/interfaces\";\nimport {\n  alphaToOpacity,\n  hexChar,\n  hexify,\n  isLonghandHex,\n  isShorthandHex,\n  isValidHex,\n  normalizeHex,\n  opacityToAlpha,\n  rgbToHex,\n} from \"../color-picker/utils\";\nimport { focusElement } from \"../../utils/dom\";\nimport {\n  componentFocusable,\n  LoadableComponent,\n  setComponentLoaded,\n  setUpLoadableComponent,\n} from \"../../utils/loadable\";\nimport { NumberingSystem } from \"../../utils/locale\";\nimport { OPACITY_LIMITS } from \"../color-picker/resources\";\nimport { ColorPickerMessages } from \"../color-picker/assets/color-picker/t9n\";\nimport { CSS } from \"./resources\";\n\nconst DEFAULT_COLOR = Color();\n\n@Component({\n  tag: \"calcite-color-picker-hex-input\",\n  styleUrl: \"color-picker-hex-input.scss\",\n  shadow: true,\n})\nexport class ColorPickerHexInput implements LoadableComponent {\n  //--------------------------------------------------------------------------\n  //\n  //  Lifecycle\n  //\n  //--------------------------------------------------------------------------\n\n  connectedCallback(): void {\n    const { allowEmpty, alphaChannel, value } = this;\n\n    if (value) {\n      const normalized = normalizeHex(value, alphaChannel);\n\n      if (isValidHex(normalized, alphaChannel)) {\n        this.internalSetValue(normalized, normalized, false);\n      }\n\n      return;\n    }\n\n    if (allowEmpty) {\n      this.internalSetValue(null, null, false);\n    }\n  }\n\n  componentWillLoad(): void {\n    setUpLoadableComponent(this);\n  }\n\n  componentDidLoad(): void {\n    setComponentLoaded(this);\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Public Properties\n  //\n  //--------------------------------------------------------------------------\n\n  /**\n   * When `true`, an empty color (`null`) will be allowed as a `value`.\n   *\n   * When `false`, a color value is enforced, and clearing the input or blurring will restore the last valid `value`.\n   */\n  @Prop() allowEmpty = false;\n\n  /**\n   * When `true`, the component will allow updates to the color's alpha value.\n   */\n  @Prop() alphaChannel = false;\n\n  /**\n   * Specifies accessible label for the input field.\n   *\n   * @deprecated use `messages` instead\n   */\n  @Prop() hexLabel = \"Hex\";\n\n  /**\n   * Messages are passed by parent component for accessible labels.\n   *\n   * @internal\n   */\n  @Prop() messages: ColorPickerMessages;\n\n  /** Specifies the Unicode numeral system used by the component for localization. */\n  @Prop() numberingSystem?: NumberingSystem;\n\n  /** Specifies the size of the component. */\n  @Prop({ reflect: true }) scale: Scale = \"m\";\n\n  /**\n   * The hex value.\n   */\n  @Prop({ mutable: true, reflect: true }) value: string = normalizeHex(\n    hexify(DEFAULT_COLOR, this.alphaChannel),\n    this.alphaChannel,\n    true,\n  );\n\n  @Watch(\"value\")\n  handleValueChange(value: string, oldValue: string): void {\n    this.internalSetValue(value, oldValue, false);\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Events\n  //\n  //--------------------------------------------------------------------------\n\n  /**\n   * Emitted when the hex value changes.\n   */\n  @Event({ cancelable: false }) calciteColorPickerHexInputChange: EventEmitter<void>;\n\n  private onHexInputBlur = (): void => {\n    const node = this.hexInputNode;\n    const inputValue = node.value;\n    const hex = `#${inputValue}`;\n    const { allowEmpty, internalColor } = this;\n    const willClearValue = allowEmpty && !inputValue;\n    const isLonghand = isLonghandHex(hex);\n\n    if (isShorthandHex(hex, this.alphaChannel)) {\n      // ensure modified pasted hex values are committed since we prevent default to remove the # char.\n      this.onHexInputChange();\n    }\n\n    if (willClearValue || (isValidHex(hex) && isLonghand)) {\n      return;\n    }\n\n    // manipulating DOM directly since rerender doesn't update input value\n    node.value =\n      allowEmpty && !internalColor\n        ? \"\"\n        : this.formatHexForInternalInput(\n            rgbToHex(\n              // always display hex input in RRGGBB format\n              internalColor.object() as any as RGB,\n            ),\n          );\n  };\n\n  private onOpacityInputBlur = (): void => {\n    const node = this.opacityInputNode;\n    const inputValue = node.value;\n    const { allowEmpty, internalColor } = this;\n    const willClearValue = allowEmpty && !inputValue;\n\n    if (willClearValue) {\n      return;\n    }\n\n    // manipulating DOM directly since rerender doesn't update input value\n    node.value =\n      allowEmpty && !internalColor ? \"\" : this.formatOpacityForInternalInput(internalColor);\n  };\n\n  private onOpacityInputInput = (): void => {\n    this.onOpacityInputChange();\n  };\n\n  private onHexInputChange = (): void => {\n    const nodeValue = this.hexInputNode.value;\n    let value = nodeValue;\n\n    if (value) {\n      const normalized = normalizeHex(value, false);\n      const preserveExistingAlpha = isValidHex(normalized) && this.alphaChannel;\n      if (preserveExistingAlpha && this.internalColor) {\n        const alphaHex = normalizeHex(this.internalColor.hexa(), true).slice(-2);\n        value = `${normalized + alphaHex}`;\n      }\n    }\n\n    this.internalSetValue(value, this.value);\n  };\n\n  private onOpacityInputChange = (): void => {\n    const node = this.opacityInputNode;\n    let value: number | string;\n\n    if (!node.value) {\n      value = node.value;\n    } else {\n      const alpha = opacityToAlpha(Number(node.value));\n      value = this.internalColor?.alpha(alpha).hexa();\n    }\n\n    this.internalSetValue(value, this.value);\n  };\n\n  private onInputFocus = (event: Event): void => {\n    event.type === \"calciteInternalInputTextFocus\"\n      ? this.hexInputNode.selectText()\n      : this.opacityInputNode.selectText();\n  };\n\n  private onHexInputInput = (): void => {\n    const hexInputValue = `#${this.hexInputNode.value}`;\n    const oldValue = this.value;\n\n    if (\n      isValidHex(hexInputValue, this.alphaChannel) &&\n      isLonghandHex(hexInputValue, this.alphaChannel)\n    ) {\n      this.internalSetValue(hexInputValue, oldValue);\n    }\n  };\n\n  protected onInputKeyDown = (event: KeyboardEvent): void => {\n    const { altKey, ctrlKey, metaKey, shiftKey } = event;\n    const { alphaChannel, hexInputNode, internalColor, value } = this;\n    const { key } = event;\n    const composedPath = event.composedPath();\n\n    if ((key === \"Tab\" && isShorthandHex(value, this.alphaChannel)) || key === \"Enter\") {\n      if (composedPath.includes(hexInputNode)) {\n        this.onHexInputChange();\n      } else {\n        this.onOpacityInputChange();\n      }\n\n      if (key === \"Enter\") {\n        event.preventDefault();\n      }\n\n      return;\n    }\n\n    const isNudgeKey = key === \"ArrowDown\" || key === \"ArrowUp\";\n    const oldValue = this.value;\n\n    if (isNudgeKey) {\n      if (!value) {\n        this.internalSetValue(this.previousNonNullValue, oldValue);\n        event.preventDefault();\n        return;\n      }\n\n      const direction = key === \"ArrowUp\" ? 1 : -1;\n      const bump = shiftKey ? 10 : 1;\n\n      this.internalSetValue(\n        hexify(\n          this.nudgeRGBChannels(\n            internalColor,\n            bump * direction,\n            composedPath.includes(hexInputNode) ? \"rgb\" : \"a\",\n          ),\n          alphaChannel,\n        ),\n        oldValue,\n      );\n\n      event.preventDefault();\n      return;\n    }\n\n    const withModifiers = altKey || ctrlKey || metaKey;\n    const singleChar = key.length === 1;\n    const validHexChar = hexChar.test(key);\n\n    if (singleChar && !withModifiers && !validHexChar) {\n      event.preventDefault();\n    }\n  };\n\n  private onHexInputPaste = (event: ClipboardEvent): void => {\n    const hex = event.clipboardData.getData(\"text\");\n\n    if (isValidHex(hex, this.alphaChannel) && isLonghandHex(hex, this.alphaChannel)) {\n      event.preventDefault();\n      this.hexInputNode.value = hex.slice(1);\n      this.internalSetValue(hex, this.value);\n    }\n  };\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private State/Props\n  //\n  //--------------------------------------------------------------------------\n\n  @Element() el: HTMLCalciteColorPickerHexInputElement;\n\n  private hexInputNode: HTMLCalciteInputTextElement;\n\n  /**\n   * The last valid/selected color. Used as a fallback if an invalid hex code is entered.\n   */\n  @State() internalColor: Color | null = DEFAULT_COLOR;\n\n  private opacityInputNode: HTMLCalciteInputNumberElement;\n\n  private previousNonNullValue: string = this.value;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Lifecycle\n  //\n  //--------------------------------------------------------------------------\n\n  render(): VNode {\n    const { alphaChannel, hexLabel, internalColor, messages, scale, value } = this;\n    const hexInputValue = this.formatHexForInternalInput(value);\n    const opacityInputValue = this.formatOpacityForInternalInput(internalColor);\n    const inputScale = scale === \"l\" ? \"m\" : \"s\";\n\n    return (\n      <div class={CSS.container}>\n        <calcite-input-text\n          class={CSS.hexInput}\n          label={messages?.hex || hexLabel}\n          maxLength={this.alphaChannel ? 8 : 6}\n          onCalciteInputTextChange={this.onHexInputChange}\n          onCalciteInputTextInput={this.onHexInputInput}\n          onCalciteInternalInputTextBlur={this.onHexInputBlur}\n          onCalciteInternalInputTextFocus={this.onInputFocus}\n          onKeyDown={this.onInputKeyDown}\n          onPaste={this.onHexInputPaste}\n          prefixText=\"#\"\n          ref={this.storeHexInputRef}\n          scale={inputScale}\n          value={hexInputValue}\n        />\n        {alphaChannel ? (\n          <calcite-input-number\n            class={CSS.opacityInput}\n            key=\"opacity-input\"\n            label={messages?.opacity}\n            max={OPACITY_LIMITS.max}\n            maxLength={3}\n            min={OPACITY_LIMITS.min}\n            numberButtonType=\"none\"\n            numberingSystem={this.numberingSystem}\n            onCalciteInputNumberInput={this.onOpacityInputInput}\n            onCalciteInternalInputNumberBlur={this.onOpacityInputBlur}\n            onCalciteInternalInputNumberFocus={this.onInputFocus}\n            onKeyDown={this.onInputKeyDown}\n            ref={this.storeOpacityInputRef}\n            scale={inputScale}\n            suffixText=\"%\"\n            value={opacityInputValue}\n          />\n        ) : null}\n      </div>\n    );\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Public Methods\n  //\n  //--------------------------------------------------------------------------\n\n  /** Sets focus on the component. */\n  @Method()\n  async setFocus(): Promise<void> {\n    await componentFocusable(this);\n\n    return focusElement(this.hexInputNode);\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private Methods\n  //\n  //--------------------------------------------------------------------------\n\n  private internalSetValue(value: string | null, oldValue: string | null, emit = true): void {\n    if (value) {\n      const { alphaChannel } = this;\n      const normalized = normalizeHex(value, alphaChannel, alphaChannel);\n\n      if (isValidHex(normalized, alphaChannel)) {\n        const { internalColor: currentColor } = this;\n        const nextColor = Color(normalized);\n        const normalizedLonghand = normalizeHex(hexify(nextColor, alphaChannel), alphaChannel);\n\n        const changed =\n          !currentColor ||\n          normalizedLonghand !== normalizeHex(hexify(currentColor, alphaChannel), alphaChannel);\n\n        this.internalColor = nextColor;\n        this.previousNonNullValue = normalizedLonghand;\n        this.value = normalizedLonghand;\n\n        if (changed && emit) {\n          this.calciteColorPickerHexInputChange.emit();\n        }\n\n        return;\n      }\n    } else if (this.allowEmpty) {\n      this.internalColor = null;\n      this.value = null;\n\n      if (emit) {\n        this.calciteColorPickerHexInputChange.emit();\n      }\n\n      return;\n    }\n\n    this.value = oldValue;\n  }\n\n  private storeHexInputRef = (node: HTMLCalciteInputTextElement): void => {\n    this.hexInputNode = node;\n  };\n\n  private storeOpacityInputRef = (node: HTMLCalciteInputNumberElement): void => {\n    this.opacityInputNode = node;\n  };\n\n  private formatHexForInternalInput(hex: string): string {\n    return hex ? hex.replace(\"#\", \"\").slice(0, 6) : \"\";\n  }\n\n  private formatOpacityForInternalInput(color: Color): string {\n    return color ? `${alphaToOpacity(color.alpha())}` : \"\";\n  }\n\n  private nudgeRGBChannels(color: Color, amount: number, context: \"rgb\" | \"a\"): Color {\n    let nudgedChannels: Channels;\n    const channels = color.array();\n    const rgbChannels = channels.slice(0, 3);\n\n    if (context === \"rgb\") {\n      const nudgedRGBChannels = rgbChannels.map((channel) => channel + amount);\n      nudgedChannels = [\n        ...nudgedRGBChannels,\n        this.alphaChannel ? channels[3] : undefined,\n      ] as Channels;\n    } else {\n      const nudgedAlpha = opacityToAlpha(alphaToOpacity(color.alpha()) + amount);\n      nudgedChannels = [...rgbChannels, nudgedAlpha] as Channels;\n    }\n\n    return Color(nudgedChannels);\n  }\n}\n","export const CSS = {\n  swatch: \"swatch\",\n  noColorSwatch: \"swatch--no-color\",\n  checker: \"checker\",\n};\n\nexport const COLORS = {\n  borderLight: \"rgba(0, 0, 0, 0.3)\",\n  borderDark: \"rgba(255, 255, 255, 0.15)\",\n};\n\nconst checkerSquareSize = 4;\n\nexport const CHECKER_DIMENSIONS = {\n  squareSize: checkerSquareSize,\n  size: checkerSquareSize * 2,\n};\n","$size-s: 20px;\n$size-m: 24px;\n$size-l: 28px;\n\n:host {\n  @apply relative inline-flex;\n}\n\n:host([scale=\"s\"]) {\n  @apply h-5 w-5;\n}\n\n:host([scale=\"m\"]) {\n  @apply h-6 w-6;\n}\n\n:host([scale=\"l\"]) {\n  @apply h-8 w-8;\n}\n\n.swatch {\n  @apply overflow-hidden;\n  block-size: inherit;\n  inline-size: inherit;\n\n  rect {\n    @apply transition-all duration-150 ease-in-out;\n  }\n}\n\n.swatch--no-color {\n  rect {\n    fill: var(--calcite-color-foreground-1);\n  }\n\n  line {\n    stroke: var(--calcite-color-status-danger);\n  }\n}\n\n.checker {\n  fill: #cacaca;\n}\n\n@include base-component();\n","import { Component, Element, Fragment, h, Prop, VNode, Watch } from \"@stencil/core\";\nimport Color from \"color\";\nimport { getModeName } from \"../../utils/dom\";\nimport { Scale } from \"../interfaces\";\nimport { hexify } from \"../color-picker/utils\";\nimport { CHECKER_DIMENSIONS, COLORS, CSS } from \"./resources\";\n\n@Component({\n  tag: \"calcite-color-picker-swatch\",\n  styleUrl: \"color-picker-swatch.scss\",\n  shadow: true,\n})\nexport class ColorPickerSwatch {\n  //--------------------------------------------------------------------------\n  //\n  //  Properties\n  //\n  //--------------------------------------------------------------------------\n\n  /**\n   * When `true`, the component is active.\n   */\n  @Prop({\n    reflect: true,\n  })\n  active = false;\n\n  /**\n   * The color value.\n   *\n   * @see https://developer.mozilla.org/en-US/docs/Web/CSS/color_value\n   */\n  @Prop()\n  color: string | null;\n\n  @Watch(\"color\")\n  handleColorChange(color: string | null): void {\n    this.internalColor = color ? Color(color) : null;\n  }\n\n  /**\n   * Specifies the size of the component.\n   */\n  @Prop({\n    reflect: true,\n  })\n  scale: Scale = \"m\";\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private State/Props\n  //\n  //--------------------------------------------------------------------------\n\n  @Element() el: HTMLCalciteColorPickerSwatchElement;\n\n  private internalColor: Color;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Lifecycle\n  //\n  //--------------------------------------------------------------------------\n\n  componentWillLoad(): void {\n    this.handleColorChange(this.color);\n  }\n\n  render(): VNode {\n    const isEmpty = !this.internalColor;\n    const classes = {\n      [CSS.swatch]: true,\n      [CSS.noColorSwatch]: isEmpty,\n    };\n\n    return (\n      <svg class={classes} xmlns=\"http://www.w3.org/2000/svg\">\n        {this.renderSwatch()}\n      </svg>\n    );\n  }\n\n  renderSwatch(): VNode {\n    const { active, el, internalColor } = this;\n    const borderRadius = active ? \"100%\" : \"0\";\n    const theme = getModeName(el);\n    const borderColor = theme === \"light\" ? COLORS.borderLight : COLORS.borderDark;\n    const isEmpty = !internalColor;\n    const commonSwatchProps = {\n      height: \"100%\",\n      rx: borderRadius,\n      stroke: borderColor,\n      strokeWidth: \"2\",\n      width: \"100%\",\n    };\n\n    if (isEmpty) {\n      return (\n        <Fragment>\n          <clipPath id=\"shape\">\n            <rect height=\"100%\" rx={borderRadius} width=\"100%\" />\n          </clipPath>\n          {this.renderSwatchRect({\n            clipPath: `inset(0 round ${borderRadius})`,\n            ...commonSwatchProps,\n          })}\n          <line clip-path=\"url(#shape)\" stroke-width=\"3\" x1=\"100%\" x2=\"0\" y1=\"0\" y2=\"100%\" />\n        </Fragment>\n      );\n    }\n\n    const alpha = internalColor.alpha();\n    const hex = hexify(internalColor);\n    const hexa = hexify(internalColor, alpha < 1);\n\n    return (\n      <Fragment>\n        <title>{hexa}</title>\n        <defs>\n          <pattern\n            height={CHECKER_DIMENSIONS.size}\n            id=\"checker\"\n            patternUnits=\"userSpaceOnUse\"\n            width={CHECKER_DIMENSIONS.size}\n            x=\"0\"\n            y=\"0\"\n          >\n            <rect\n              class={CSS.checker}\n              height={CHECKER_DIMENSIONS.squareSize}\n              width={CHECKER_DIMENSIONS.squareSize}\n              x=\"0\"\n              y=\"0\"\n            />\n            <rect\n              class={CSS.checker}\n              height={CHECKER_DIMENSIONS.squareSize}\n              width={CHECKER_DIMENSIONS.squareSize}\n              x={CHECKER_DIMENSIONS.squareSize}\n              y={CHECKER_DIMENSIONS.squareSize}\n            />\n          </pattern>\n        </defs>\n        {this.renderSwatchRect({\n          fill: \"url(#checker)\",\n          rx: commonSwatchProps.rx,\n          height: commonSwatchProps.height,\n          width: commonSwatchProps.width,\n        })}\n        {this.renderSwatchRect({\n          clipPath: alpha < 1 ? \"polygon(100% 0, 0 0, 0 100%)\" : `inset(0 round ${borderRadius})`,\n          fill: hex,\n          ...commonSwatchProps,\n        })}\n        {alpha < 1\n          ? this.renderSwatchRect({\n              clipPath: \"polygon(100% 0, 100% 100%, 0 100%)\",\n              fill: hexa,\n              key: \"opacity-fill\",\n              ...commonSwatchProps,\n            })\n          : null}\n      </Fragment>\n    );\n  }\n\n  renderSwatchRect({\n    clipPath,\n    fill,\n    height,\n    key,\n    rx,\n    stroke,\n    strokeWidth,\n    width,\n  }: {\n    clipPath?: string;\n    fill?: string;\n    height: string;\n    key?: string;\n    rx: string;\n\n    // note: stroke-width and clip-path are needed to hide overflowing portion of stroke\n    // see https://stackoverflow.com/a/7273346/194216\n    stroke?: string;\n    strokeWidth?: string;\n\n    width: string;\n  }): VNode {\n    return (\n      <rect\n        clip-path={clipPath}\n        fill={fill}\n        height={height}\n        key={key}\n        rx={rx}\n        stroke={stroke}\n        stroke-width={strokeWidth}\n        width={width}\n      />\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/calcite/p-8c8f58e5.entry.js

@@ -1,7 +0,0 @@
-/*!
- * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
- * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.13.0
- */
-import{r as i,c as e,h as t,H as a,g as n}from"./p-0a2f91d4.js";import{x as s,g as o,f as c}from"./p-806dc8f8.js";import{d as l,a as r,c as h,u as d}from"./p-b5c9b47d.js";import{s as m,a as p,c as b}from"./p-65e04a6e.js";import{c as x}from"./p-966e4808.js";import{o as v}from"./p-a43e0249.js";import{C as f}from"./p-cedaddf4.js";import"./p-39b20f1d.js";import"./p-3d516d20.js";import"./p-df6c8bd7.js";const g={scrim:"scrim",container:"container",containerOpen:"container--open",content:"content",containerEmbedded:"container--embedded"};const u=":host{position:absolute;inset:0px;z-index:var(--calcite-z-index-overlay);display:flex;visibility:hidden !important;--calcite-sheet-scrim-background-internal:rgba(0, 0, 0, 0.85);--calcite-scrim-shadow-block-start-internal:0 4px 8px -1px rgba(0, 0, 0, 0.08), 0 2px 4px -1px rgba(0, 0, 0, 0.04);--calcite-scrim-shadow-block-end-internal:0 -4px 8px -1px rgba(0, 0, 0, 0.08), 0 -2px 4px -1px rgba(0, 0, 0, 0.04);--calcite-scrim-shadow-inline-start-internal:4px 0 8px -1px rgba(0, 0, 0, 0.08), 2px 0 4px -1px rgba(0, 0, 0, 0.04);--calcite-scrim-shadow-inline-end-internal:-4px 0 8px -1px rgba(0, 0, 0, 0.08), -2px 0 4px -1px rgba(0, 0, 0, 0.04)}.calcite--rtl{--calcite-scrim-shadow-inline-start-internal:-4px 0 8px -1px rgba(0, 0, 0, 0.08), -2px 0 4px -1px rgba(0, 0, 0, 0.04);--calcite-scrim-shadow-inline-end-internal:4px 0 8px -1px rgba(0, 0, 0, 0.08), 2px 0 4px -1px rgba(0, 0, 0, 0.04)}.container{visibility:hidden;position:fixed;z-index:var(--calcite-z-index-overlay);display:flex;overflow-y:hidden;color:var(--calcite-color-text-2);opacity:0;transition:visibility 0ms linear var(--calcite-internal-animation-timing-medium), opacity var(--calcite-internal-animation-timing-medium) cubic-bezier(0.215, 0.44, 0.42, 0.88)}:host([position=inline-start]) .container{justify-content:flex-start;inset-block:0;inset-inline:0 auto;--calcite-sheet-hidden-position-internal:translate3d(-1rem, 0, 0)}:host([position=inline-end]) .container{justify-content:flex-end;inset-block:0;inset-inline:auto 0;--calcite-sheet-hidden-position-internal:translate3d(1rem, 0, 0)}:host([position=block-start]) .container{align-items:flex-start;inset-block:0 auto;inset-inline:0;--calcite-sheet-hidden-position-internal:translate3d(0, -1rem, 0)}:host([position=block-end]) .container{align-items:flex-end;inset-block:auto 0;inset-inline:0;--calcite-sheet-hidden-position-internal:translate3d(0, 1rem, 0)}:host([display-mode=float]) .content{--tw-shadow:0 2px 12px -4px rgba(0, 0, 0, 0.2), 0 2px 4px -2px rgba(0, 0, 0, 0.16);--tw-shadow-colored:0 2px 12px -4px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}:host([display-mode=overlay][position=inline-start]) .container{box-shadow:var(--calcite-scrim-shadow-inline-start-internal)}:host([display-mode=overlay][position=inline-end]) .container{box-shadow:var(--calcite-scrim-shadow-inline-end-internal)}:host([display-mode=overlay][position=block-start]) .container{box-shadow:var(--calcite-scrim-shadow-block-start-internal)}:host([display-mode=overlay][position=block-end]) .container{box-shadow:var(--calcite-scrim-shadow-block-end-internal)}:host([position^=inline]) .container,:host([position^=inline]) .content{inline-size:var(--calcite-sheet-width-internal);max-inline-size:var(--calcite-sheet-max-width-internal);min-inline-size:var(--calcite-sheet-min-width-internal)}:host([position^=block]) .container,:host([position^=block]) .content{block-size:var(--calcite-sheet-height-internal);max-block-size:var(--calcite-sheet-max-height-internal);min-block-size:var(--calcite-sheet-min-height-internal)}:host([display-mode=float][position^=inline]) .container{block-size:calc(100% - 1.5rem);max-block-size:calc(100% - 1.5rem);min-block-size:calc(100% - 1.5rem)}:host([display-mode=float][position^=block]) .container{inline-size:calc(100% - 1.5rem);max-inline-size:calc(100% - 1.5rem);min-inline-size:calc(100% - 1.5rem)}:host([position^=inline][width-scale=s]){--calcite-sheet-width-internal:var(--calcite-sheet-width, 15vw);--calcite-sheet-max-width-internal:var(--calcite-sheet-max-width, 360px);--calcite-sheet-min-width-internal:var(--calcite-sheet-min-width, 260px)}:host([position^=inline][width-scale=m]){--calcite-sheet-width-internal:var(--calcite-sheet-width, 25vw);--calcite-sheet-max-width-internal:var(--calcite-sheet-max-width, 420px);--calcite-sheet-min-width-internal:var(--calcite-sheet-min-width, 300px)}:host([position^=inline][width-scale=l]){--calcite-sheet-width-internal:var(--calcite-sheet-width, 45vw);--calcite-sheet-max-width-internal:var(--calcite-sheet-max-width, 680px);--calcite-sheet-min-width-internal:var(--calcite-sheet-min-width, 340px)}:host([position^=block][height-scale=s]){--calcite-sheet-min-height-internal:var(--calcite-sheet-min-height, 160px);--calcite-sheet-height-internal:var(--calcite-sheet-height, 30vh);--calcite-sheet-max-height-internal:var(--calcite-sheet-max-height, 30vh)}:host([position^=block][height-scale=m]){--calcite-sheet-min-height-internal:var(--calcite-sheet-min-height, 200px);--calcite-sheet-height-internal:var(--calcite-sheet-height, 45vh);--calcite-sheet-max-height-internal:var(--calcite-sheet-max-height, 50vh)}:host([position^=block][height-scale=l]){--calcite-sheet-min-height-internal:var(--calcite-sheet-min-height, 240px);--calcite-sheet-height-internal:var(--calcite-sheet-height, 60vh);--calcite-sheet-max-height-internal:var(--calcite-sheet-max-height, 70vh)}.scrim{--calcite-scrim-background:var(--calcite-sheet-scrim-background, var(--calcite-sheet-scrim-background-internal));position:fixed;inset:0px;display:flex;overflow-y:hidden}:host([opened]){visibility:visible !important}.content{position:relative;z-index:var(--calcite-z-index-modal);box-sizing:border-box;display:block;max-block-size:100%;max-inline-size:100%;overflow-y:hidden;padding:0px;background-color:var(--calcite-color-foreground-1);max-block-size:100%;visibility:hidden;transition:transform var(--calcite-internal-animation-timing-medium) cubic-bezier(0.215, 0.44, 0.42, 0.88), visibility 0ms linear var(--calcite-internal-animation-timing-medium), opacity var(--calcite-internal-animation-timing-medium) cubic-bezier(0.215, 0.44, 0.42, 0.88);transform:var(--calcite-sheet-hidden-position-internal)}.container--open .content{transform:translate3d(0, 0, 0)}:host([display-mode=float]) .content,:host([display-mode=float]) .container{border-radius:0.25rem}:host([display-mode=float]) .container{padding:0.75rem}.container--open{visibility:visible;opacity:1;transition-delay:0ms}.container--open .content{pointer-events:auto;visibility:visible;opacity:1;transition:transform var(--calcite-internal-animation-timing-medium) cubic-bezier(0.215, 0.44, 0.42, 0.88), visibility 0ms linear, opacity var(--calcite-internal-animation-timing-medium) cubic-bezier(0.215, 0.44, 0.42, 0.88), max-inline-size var(--calcite-internal-animation-timing-medium) cubic-bezier(0.215, 0.44, 0.42, 0.88), max-block-size var(--calcite-internal-animation-timing-medium) cubic-bezier(0.215, 0.44, 0.42, 0.88);transition-delay:0ms}:host([position=inline-start]) .content,:host([position=inline-end]) .content{block-size:100%}:host([position=block-start]) .content,:host([position=block-end]) .content{inline-size:100%}:host([position]) .container--embedded{pointer-events:auto;position:absolute;inline-size:100%;max-inline-size:100%;min-inline-size:100%;block-size:100%;max-block-size:100%;min-block-size:100%}:host([position]) .container--embedded calcite-scrim{position:absolute}:host([hidden]){display:none}[hidden]{display:none}";const w=u;const y=class{constructor(t){i(this,t);this.calciteSheetBeforeClose=e(this,"calciteSheetBeforeClose",6);this.calciteSheetClose=e(this,"calciteSheetClose",6);this.calciteSheetBeforeOpen=e(this,"calciteSheetBeforeOpen",6);this.calciteSheetOpen=e(this,"calciteSheetOpen",6);this.openTransitionProp="opacity";this.ignoreOpenChange=false;this.mutationObserver=x("mutation",(()=>this.handleMutationObserver()));this.setContentId=i=>{this.contentId=s(i)};this.setTransitionEl=i=>{this.transitionEl=i};this.openEnd=()=>{this.setFocus();this.el.removeEventListener("calciteSheetOpen",this.openEnd)};this.handleOutsideClose=()=>{if(this.outsideCloseDisabled){return}this.open=false};this.closeSheet=async()=>{if(this.beforeClose){try{await this.beforeClose(this.el)}catch(i){requestAnimationFrame((()=>{this.ignoreOpenChange=true;this.open=true;this.ignoreOpenChange=false}));return}}this.opened=false;this.removeOverflowHiddenClass()};this.beforeClose=undefined;this.displayMode="overlay";this.embedded=false;this.escapeDisabled=false;this.heightScale="m";this.focusTrapDisabled=false;this.label=undefined;this.open=false;this.opened=false;this.outsideCloseDisabled=false;this.position="inline-start";this.widthScale="m"}handleFocusTrapDisabled(i){if(!this.open){return}i?l(this):r(this)}toggleSheet(i){if(this.ignoreOpenChange){return}if(i){this.openSheet()}else{this.closeSheet()}}handleOpenedChange(){v(this)}async componentWillLoad(){m(this);if(this.open){requestAnimationFrame((()=>this.openSheet()))}}componentDidLoad(){p(this)}connectedCallback(){this.mutationObserver?.observe(this.el,{childList:true,subtree:true});h(this)}disconnectedCallback(){this.removeOverflowHiddenClass();this.mutationObserver?.disconnect();l(this);this.embedded=false}render(){const i=o(this.el);return t(a,{key:"145f45b21fa18a08af4ef4e920d536a7e6431175","aria-describedby":this.contentId,"aria-label":this.label,"aria-modal":"true",role:"dialog"},t("div",{key:"796deb8baa890ad7e8f42d2e0a3be22269e450a2",class:{[g.container]:true,[g.containerOpen]:this.opened,[g.containerEmbedded]:this.embedded,[f.rtl]:i==="rtl"},ref:this.setTransitionEl},t("calcite-scrim",{key:"c4d45b89ee32da639d1feb88289d2b0957474414",class:g.scrim,onClick:this.handleOutsideClose}),t("div",{key:"ad764ed7812ca7172b5f4aacf4229ae28e06d315",class:{[g.content]:true},ref:this.setContentId},t("slot",{key:"dab54df7b8cae4bc8434935e1b55204896ed45df"}))))}handleEscape(i){if(this.open&&!this.escapeDisabled&&i.key==="Escape"&&!i.defaultPrevented){this.open=false;i.preventDefault()}}async setFocus(){await b(this);c(this.el)}async updateFocusTrapElements(){d(this)}onBeforeOpen(){this.calciteSheetBeforeOpen.emit()}onOpen(){this.calciteSheetOpen.emit();r(this)}onBeforeClose(){this.calciteSheetBeforeClose.emit()}onClose(){this.calciteSheetClose.emit();l(this)}openSheet(){this.el.addEventListener("calciteSheetOpen",this.openEnd);this.opened=true;if(!this.embedded){this.initialOverflowCSS=document.documentElement.style.overflow;document.documentElement.style.setProperty("overflow","hidden")}}removeOverflowHiddenClass(){document.documentElement.style.setProperty("overflow",this.initialOverflowCSS)}handleMutationObserver(){this.updateFocusTrapElements()}get el(){return n(this)}static get watchers(){return{focusTrapDisabled:["handleFocusTrapDisabled"],open:["toggleSheet"],opened:["handleOpenedChange"]}}};y.style=w;export{y as calcite_sheet};
-//# sourceMappingURL=p-8c8f58e5.entry.js.map

package/dist/calcite/p-8f4d1b77.entry.js

@@ -1,7 +0,0 @@
-/*!
- * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
- * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.13.0
- */
-import{r as e,c as t,h as n,g as o}from"./p-0a2f91d4.js";import{u as i,I as c}from"./p-a805c9c4.js";import{b as a,t as s}from"./p-806dc8f8.js";import{c as l,a as r,s as d}from"./p-65e04a6e.js";import"./p-39b20f1d.js";import"./p-cedaddf4.js";import"./p-df6c8bd7.js";const h={container:"container",contentContainer:"content-container",contentContainerHasContent:"content-container--has-content",contentContainerHasOnlyContentTopAndBottom:"content-container--has-only-content-top-and-bottom",textContentContainer:"text-content-container",description:"description",heading:"heading",icon:"icon",interactive:"interactive",largeVisualDeprecated:"large-visual-deprecated",row:"row",selected:"selected",selectionIcon:"selection-icon",textContent:"text-content"};const p={selectedMultiple:"check-square-f",selectedSingle:"circle-f",unselectedMultiple:"square",unselectedSingle:"circle"};const m={contentBottom:"content-bottom",contentEnd:"content-end",contentStart:"content-start",contentTop:"content-top"};const f=':host([disabled]){cursor:default;-webkit-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}:host([disabled]) *,:host([disabled]) ::slotted(*){pointer-events:none}:host{--calcite-tile-background-color:var(--calcite-color-foreground-1);--calcite-tile-border-color:var(--calcite-color-border-2);--calcite-tile-description-text-color:var(--calcite-color-text-3);--calcite-tile-heading-text-color:var(--calcite-color-text-2);--calcite-icon-color:var(--calcite-color-text-3);box-sizing:border-box;display:inline-block}.container{background-color:var(--calcite-tile-background-color);block-size:var(--calcite-container-size-content-fluid);box-sizing:border-box;inline-size:var(--calcite-container-size-content-fluid);outline:var(--calcite-border-width-sm, 1px) solid var(--calcite-tile-border-color);-webkit-user-select:none;user-select:none}.container.interactive{cursor:pointer}.container.interactive:hover,.container.interactive:focus,.container.interactive.selected{outline-color:var(--calcite-color-brand);position:relative}.container.interactive:hover .selection-icon,.container.interactive:focus .selection-icon,.container.interactive.selected .selection-icon{--calcite-icon-color:var(--calcite-color-brand)}.container.interactive.selected{z-index:var(--calcite-z-index)}.container.interactive:focus{box-shadow:inset 0 0 0 1px var(--calcite-color-brand);z-index:var(--calcite-z-index-sticky)}.content-container,.row{align-items:flex-start;display:flex}.content-container{flex-direction:column}.text-content-container{inline-size:100%;outline-color:transparent;padding:0}.text-content{display:flex;flex-direction:column}.heading{color:var(--calcite-tile-heading-text-color);font-weight:var(--calcite-font-weight-medium);line-height:1.20313rem;overflow-wrap:break-word}.large-visual-deprecated{align-items:center;justify-content:center;min-block-size:12rem;text-align:center}.large-visual-deprecated calcite-icon{align-self:center;block-size:64px;inline-size:64px}.large-visual-deprecated .text-content-container{justify-content:center}.description{color:var(--calcite-tile-description-text-color);font-weight:var(--calcite-font-weight-regular);overflow-wrap:break-word}:host([alignment=center]) .icon{align-self:center}:host([alignment=center]) .text-content-container{justify-content:center}:host([alignment=center]) .text-content{text-align:center}:host([alignment=center]) slot[name=content-start]::slotted(*),:host([alignment=center]) slot[name=content-end]::slotted(*),:host([alignment=center]) slot[name=content-top]::slotted(*),:host([alignment=center]) slot[name=content-bottom]::slotted(*){align-self:center}:host([scale=s]){max-inline-size:400px;min-inline-size:100px}:host([scale=s]) .container{padding:var(--calcite-spacing-sm)}:host([scale=s]) .content-container--has-content,:host([scale=s]) .row{gap:var(--calcite-spacing-sm)}:host([scale=s]) .heading{font-size:var(--calcite-font-size--2);line-height:1.03125rem}:host([scale=s]) .description{font-size:var(--calcite-font-size--3);line-height:0.85938rem}:host([scale=s]) .content-container--has-only-content-top-and-bottom slot[name=content-top]::slotted(*){margin-block-end:var(--calcite-spacing-sm)}:host([scale=m]){max-inline-size:460px;min-inline-size:140px}:host([scale=m]) .container{padding:var(--calcite-spacing-md)}:host([scale=m]) .content-container--has-content,:host([scale=m]) .row{gap:var(--calcite-spacing-md)}:host([scale=m]) .heading{font-size:var(--calcite-font-size--1);line-height:1.20313rem}:host([scale=m]) .description{font-size:var(--calcite-font-size--2);line-height:1.03125rem}:host([scale=m]) .content-container--has-only-content-top-and-bottom slot[name=content-top]::slotted(*){margin-block-end:var(--calcite-spacing-md)}:host([scale=l]){max-inline-size:520px;min-inline-size:160px}:host([scale=l]) .container{padding:var(--calcite-spacing-xl)}:host([scale=l]) .content-container--has-content,:host([scale=l]) .row{gap:var(--calcite-spacing-xl)}:host([scale=l]) .heading{font-size:var(--calcite-font-size-0);line-height:1.375rem}:host([scale=l]) .description{font-size:var(--calcite-font-size--1);line-height:1.20313rem}:host([scale=l]) .content-container--has-only-content-top-and-bottom slot[name=content-top]::slotted(*){margin-block-end:var(--calcite-spacing-xl)}:host([selection-appearance=border][layout=horizontal]) .container.selected:focus::before,:host([selection-appearance=border][layout=vertical]) .container.selected:focus::before{block-size:100%;box-shadow:inset 0 0 0 1px var(--calcite-color-brand);content:"";display:block;inline-size:100%;inset-block-start:0;inset-inline-start:0;position:absolute}:host([selection-appearance=border][layout=horizontal]) .container.selected{box-shadow:inset 0 -4px 0 0 var(--calcite-color-brand)}:host([selection-appearance=border][layout=vertical]) .container.selected{box-shadow:inset 4px 0 0 0 var(--calcite-color-brand)}:host([href]:focus:not([disabled])),:host([href]:hover:not([disabled])){--calcite-tile-border-color:var(--calcite-color-text-link);--calcite-tile-heading-text-color:var(--calcite-color-text-link);--calcite-icon-color:var(--calcite-color-text-link)}:host([href]:focus:not([disabled])) .container,:host([href]:hover:not([disabled])) .container{position:relative;z-index:var(--calcite-z-index)}:host([href]:active:not([disabled])) .container{box-shadow:0 0 0 3px var(--calcite-tile-border-color)}:host([embed]) .container{box-shadow:none;padding:0}:host([selection-mode=none]) .container{outline-color:var(--calcite-tile-border-color)}:host([selection-mode=none]) .container:focus{outline-color:var(--calcite-color-brand);position:relative}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}.interaction-container{display:contents}:host(:hover:not([disabled])),:host([active]:not([disabled])){--calcite-tile-description-text-color:var(--calcite-color-text-2);--calcite-tile-heading-text-color:var(--calcite-color-text-1)}:host([hidden]){display:none}[hidden]{display:none}::slotted(*){max-inline-size:100%}';const b=f;const v=class{constructor(n){e(this,n);this.calciteInternalTileKeyEvent=t(this,"calciteInternalTileKeyEvent",6);this.calciteTileSelect=t(this,"calciteTileSelect",7);this.clickHandler=()=>{if(this.interactive){this.setFocus();this.handleSelectEvent()}};this.handleSelectEvent=()=>{if(this.disabled||!this.interactive||this.selectionMode==="single-persist"&&this.selected===true){return}this.calciteTileSelect.emit()};this.handleSlotChange=e=>{const t=e.target.dataset.name;this[`has${t}`]=a(e)};this.setContainerEl=e=>{this.containerEl=e};this.active=false;this.alignment="start";this.description=undefined;this.disabled=false;this.embed=false;this.heading=undefined;this.href=undefined;this.icon=undefined;this.iconFlipRtl=false;this.interactive=false;this.label=undefined;this.layout="horizontal";this.scale="m";this.selected=false;this.selectionAppearance="icon";this.selectionMode="none";this.hasContentBottom=false;this.hasContentEnd=false;this.hasContentStart=false;this.hasContentTop=false}async setFocus(){await l(this);if(!this.disabled&&this.interactive){this.containerEl?.focus()}}componentDidLoad(){r(this)}componentDidRender(){i(this)}async componentWillLoad(){d(this)}keyDownHandler(e){if(e.target===this.el){switch(e.key){case" ":case"Enter":this.handleSelectEvent();e.preventDefault();break;case"ArrowDown":case"ArrowLeft":case"ArrowRight":case"ArrowUp":case"Home":case"End":this.calciteInternalTileKeyEvent.emit(e);e.preventDefault();break}}}renderSelectionIcon(){const{selected:e,selectionAppearance:t,selectionMode:o}=this;if(t==="icon"&&o!=="none"){return n("calcite-icon",{class:h.selectionIcon,icon:e?o==="multiple"?p.selectedMultiple:p.selectedSingle:o==="multiple"?p.unselectedMultiple:p.unselectedSingle,scale:"s"})}return}renderTile(){const{description:e,disabled:t,hasContentBottom:o,hasContentEnd:i,hasContentStart:c,hasContentTop:a,heading:l,icon:r,iconFlipRtl:d,interactive:p,selectionMode:f}=this;const b=l&&r&&!e;const v=Boolean(this.href)||!p;const g=f==="multiple"&&p?"checkbox":f!=="none"&&p?"radio":p?"button":undefined;const u=!!(e||i||c||l||r);const x=!u&&a&&o;return n("div",{"aria-checked":f!=="none"&&p?s(this.selected):undefined,"aria-disabled":v?s(t):undefined,"aria-label":g&&this.label,class:{[h.container]:true,[h.interactive]:p,[h.largeVisualDeprecated]:b,[h.row]:true,[h.selected]:this.selected},onClick:this.clickHandler,ref:this.setContainerEl,role:g,tabIndex:v?undefined:0},this.renderSelectionIcon(),n("div",{class:{[h.contentContainer]:true,[h.contentContainerHasContent]:u,[h.contentContainerHasOnlyContentTopAndBottom]:x}},n("slot",{"data-name":"ContentTop",name:m.contentTop,onSlotchange:this.handleSlotChange}),r&&n("calcite-icon",{class:h.icon,flipRtl:d,icon:r,scale:"l"}),n("div",{class:{[h.textContentContainer]:true,[h.row]:true}},n("slot",{"data-name":"ContentStart",name:m.contentStart,onSlotchange:this.handleSlotChange}),n("div",{class:h.textContent},l&&n("div",{class:h.heading},l),e&&n("div",{class:h.description},e)),n("slot",{"data-name":"ContentEnd",name:m.contentEnd,onSlotchange:this.handleSlotChange})),n("slot",{"data-name":"ContentBottom",name:m.contentBottom,onSlotchange:this.handleSlotChange})))}render(){const{disabled:e}=this;return n(c,{key:"1d62f354d4a18837e56dd446efc63dde66f977bf",disabled:e},this.href?n("calcite-link",{disabled:e,href:this.href},this.renderTile()):this.renderTile())}get el(){return o(this)}};v.style=b;export{v as calcite_tile};
-//# sourceMappingURL=p-8f4d1b77.entry.js.map

package/dist/calcite/p-938d5bf8.entry.js

@@ -1,7 +0,0 @@
-/*!
- * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
- * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.13.0
- */
-export{I as calcite_input_time_picker,T as calcite_time_picker}from"./p-5e711787.js";import"./p-0a2f91d4.js";import"./p-39204c81.js";import"./p-806dc8f8.js";import"./p-39b20f1d.js";import"./p-cedaddf4.js";import"./p-a805c9c4.js";import"./p-103c1961.js";import"./p-7f9ce223.js";import"./p-fe34acf8.js";import"./p-65e04a6e.js";import"./p-df6c8bd7.js";import"./p-2abe8907.js";import"./p-966e4808.js";import"./p-b5c9b47d.js";import"./p-3d516d20.js";import"./p-9e9191b2.js";import"./p-f0661425.js";import"./p-130617eb.js";import"./p-6add61e9.js";
-//# sourceMappingURL=p-938d5bf8.entry.js.map

package/dist/calcite/p-948af2ee.entry.js

@@ -1,7 +0,0 @@
-/*!
- * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
- * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.13.0
- */
-import{r as t,c as s,h as e,H as i,g as a}from"./p-0a2f91d4.js";import{u as o,I as n}from"./p-a805c9c4.js";import{s as r,a as c,c as l}from"./p-65e04a6e.js";import{c as h,d}from"./p-2abe8907.js";import{c as f}from"./p-966e4808.js";import{u as p,c as u,s as m,d as b}from"./p-f0661425.js";import{g,m as w,d as v,a as x,s as y,h as k,b as L,c as j,k as I,e as C,i as D,f as z,j as H,l as S,n as A,r as F,o as R,p as B,q as E,t as U,L as V,I as _,C as M,S as O}from"./p-45cba9c2.js";import{d as q,c as G}from"./p-d378fa16.js";import{d as K,t as T,e as W}from"./p-806dc8f8.js";import{l as $}from"./p-6f791d8e.js";import{c as P,d as J}from"./p-c36f2721.js";import{g as N}from"./p-39b20f1d.js";import"./p-df6c8bd7.js";import"./p-103c1961.js";import"./p-e2152231.js";import"./p-0276629a.js";import"./p-cedaddf4.js";import"./p-3d516d20.js";const Q={container:"container",handle:"handle"};const X={grip:"grip"};function Y(t,s,e){const{items:i,messages:a}=e;const o=i.length;const n=g(e,t)+1;const r=s==="idle"?a.dragHandleIdle:s==="active"?a.dragHandleActive:s==="change"?a.dragHandleChange:a.dragHandleCommit;return tt(r,t.label,n,o)}function Z(t){const s=t.composedPath().find((t=>t.dataset?.jsHandle!==undefined));const e=t.composedPath().find((t=>t.tagName?.toLowerCase()==="calcite-value-list-item"));return{handle:s,item:e}}function tt(t,s,e,i){const a=t.replace("{position}",e.toString());const o=a.replace("{itemLabel}",s);return o.replace("{total}",i.toString())}const st=":host([disabled]){cursor:default;-webkit-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}:host([disabled]) *,:host([disabled]) ::slotted(*){pointer-events:none}:host{position:relative;box-sizing:border-box;display:flex;flex-shrink:0;flex-grow:0;flex-direction:column;align-items:stretch;background-color:transparent;font-size:var(--calcite-font-size--1);color:var(--calcite-color-text-2)}:host *{box-sizing:border-box}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}.interaction-container{display:contents}calcite-value-list-item:last-of-type{--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}:host([filter-enabled]) header{margin-block-end:0.25rem;display:flex;align-items:center;justify-content:flex-end;background-color:var(--calcite-color-foreground-1);--tw-shadow:0 1px 0 var(--calcite-color-border-3);--tw-shadow-colored:0 1px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}:host([filter-enabled]) header.sticky-pos{position:sticky;inset-block-start:0px;z-index:var(--calcite-z-index-sticky)}calcite-filter{margin-block-end:1px}.assistive-text{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}:host([hidden]){display:none}[hidden]{display:none}";const et=st;$.deprecated("component",{name:"value-list",removalVersion:3,suggested:"list"});const it=class{constructor(e){t(this,e);this.calciteListChange=s(this,"calciteListChange",6);this.calciteListOrderChange=s(this,"calciteListOrderChange",6);this.calciteListFilter=s(this,"calciteListFilter",6);this.lastSelectedItem=null;this.mutationObserver=f("mutation",w.bind(this));this.handleSelector=`.${Q.handle}`;this.dragSelector="calcite-value-list-item";this.setFilterEl=t=>{this.filterEl=t};this.setFilteredItems=t=>{this.filteredItems=t};this.deselectRemovedItems=v.bind(this);this.deselectSiblingItems=x.bind(this);this.selectSiblings=y.bind(this);this.handleFilter=k.bind(this);this.handleFilterEvent=L.bind(this);this.getItemData=j.bind(this);this.keyDownHandler=t=>{if(t.defaultPrevented){return}const{handle:s,item:e}=Z(t);if(s&&!e.handleActivated&&t.key===" "){this.updateScreenReaderText(Y(e,"commit",this))}if(!s||!e.handleActivated){I.call(this,t);return}t.preventDefault();const{items:i}=this;if(t.key===" "){this.updateScreenReaderText(Y(e,"active",this))}if(t.key!=="ArrowUp"&&t.key!=="ArrowDown"||i.length<=1){return}const{el:a}=this;const o=C(this,e,t.key==="ArrowUp"?"up":"down");if(o===i.length-1){a.appendChild(e)}else{const t=a.children[o];const s=t===e.nextElementSibling?t.nextElementSibling:t;a.insertBefore(e,s)}this.items=this.getItems();this.calciteListOrderChange.emit(this.items.map((({value:t})=>t)));requestAnimationFrame((()=>K(s)));e.handleActivated=true;this.updateHandleAriaLabel(s,Y(e,"change",this))};this.storeAssistiveEl=t=>{this.assistiveTextEl=t};this.handleFocusIn=t=>{const{handle:s,item:e}=Z(t);if(!e?.handleActivated&&e&&s){this.updateHandleAriaLabel(s,Y(e,"idle",this))}};this.disabled=false;this.canPull=undefined;this.canPut=undefined;this.dragEnabled=false;this.filteredItems=[];this.filteredData=[];this.filterEnabled=false;this.filterPlaceholder=undefined;this.filterText=undefined;this.group=undefined;this.loading=false;this.multiple=false;this.selectionFollowsFocus=false;this.messageOverrides=undefined;this.messages=undefined;this.dataForFilter=[];this.defaultMessages=undefined;this.effectiveLocale="";this.selectedValues=new Map}onMessagesChange(){}effectiveLocaleChange(){p(this,this.effectiveLocale)}connectedCallback(){h(this);u(this);D.call(this);z.call(this);this.setUpSorting()}async componentWillLoad(){r(this);await m(this)}componentDidLoad(){c(this);H.call(this)}componentDidRender(){o(this)}disconnectedCallback(){q(this);d(this);b(this);S.call(this)}calciteListFocusOutHandler(t){A.call(this,t)}calciteListItemRemoveHandler(t){F.call(this,t)}calciteListItemChangeHandler(t){R.call(this,t)}calciteInternalListItemPropsChangeHandler(t){t.stopPropagation();this.setUpFilter()}calciteInternalListItemValueChangeHandler(t){B.call(this,t);t.stopPropagation()}onGlobalDragStart(){S.call(this)}onGlobalDragEnd(){z.call(this)}onDragEnd(){}onDragStart(){}onDragSort(){this.items=Array.from(this.el.querySelectorAll("calcite-value-list-item"));const t=this.items.map((t=>t.value));this.calciteListOrderChange.emit(t)}getItems(){return Array.from(this.el.querySelectorAll("calcite-value-list-item"))}setUpItems(){E.call(this,"calcite-value-list-item");this.setUpSorting()}setUpFilter(){if(this.filterEnabled){this.dataForFilter=this.getItemData()}}setUpSorting(){const{dragEnabled:t}=this;if(!t){return}G(this)}handleBlur(){if(this.dragEnabled){this.updateScreenReaderText("")}}async getSelectedItems(){return this.selectedValues}async setFocus(t){await l(this);return U.call(this,t)}getIconType(){let t=null;if(this.dragEnabled){t=X.grip}return t}updateScreenReaderText(t){this.assistiveTextEl.textContent=t}updateHandleAriaLabel(t,s){t.ariaLabel=s}handleValueListItemBlur(t){const{item:s,handle:e}=t.detail;if(!s?.handleActivated&&s){this.updateHandleAriaLabel(e,Y(s,"idle",this))}t.stopPropagation()}render(){return e(i,{key:"b9e38d57ffd1d2b686264d87f809e712c33c5cc5","aria-busy":T(this.loading),onBlur:this.handleBlur,onFocusin:this.handleFocusIn,onKeyDown:this.keyDownHandler,role:"menu"},e(V,{key:"18d18babe0959692bebdb17ec427b53fc4697b08",props:this}))}static get assetsDirs(){return["assets"]}get el(){return a(this)}static get watchers(){return{messageOverrides:["onMessagesChange"],effectiveLocale:["effectiveLocaleChange"]}}};it.style=et;const at={drag:"drag"};const ot={actionsEnd:"actions-end",actionsStart:"actions-start"};const nt=":host([disabled]){cursor:default;-webkit-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}:host([disabled]) *,:host([disabled]) ::slotted(*){pointer-events:none}:host{margin-block-end:1px;box-sizing:border-box;display:flex;background-color:var(--calcite-color-foreground-1);font-size:var(--calcite-font-size--1);color:var(--calcite-color-text-2);--tw-shadow:0 1px 0 var(--calcite-color-border-3);--tw-shadow-colored:0 1px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);transition:background-color var(--calcite-animation-timing), box-shadow var(--calcite-animation-timing)}:host *{box-sizing:border-box}calcite-pick-list-item{position:relative;margin:0px;flex-grow:1;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}:host([active]),:host([selected]){--tw-shadow:0 0 0 1px var(--calcite-color-brand);--tw-shadow-colored:0 0 0 1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}.handle{display:flex;cursor:move;align-items:center;justify-content:center;border-style:none;background-color:transparent;padding-block:0px;padding-inline:0.25rem;color:var(--calcite-color-border-input);outline-color:transparent}.handle:hover{background-color:var(--calcite-color-foreground-2);color:var(--calcite-color-text-1)}.handle:focus{outline:2px solid var(--calcite-ui-focus-color, var(--calcite-color-brand));outline-offset:calc(\n            -2px *\n            calc(\n              1 -\n              2 * clamp(\n                0,\n                var(--calcite-offset-invert-focus),\n                1\n              )\n            )\n          )}.handle--activated{background-color:var(--calcite-color-foreground-3);color:var(--calcite-color-text-1)}.handle calcite-icon{color:inherit}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}.interaction-container{display:contents}:host([hidden]){display:none}[hidden]{display:none}";const rt=nt;$.deprecated("component",{name:"value-list-item",removalVersion:3,suggested:"list-item"});const ct=class{constructor(e){t(this,e);this.calciteListItemChange=s(this,"calciteListItemChange",6);this.calciteListItemRemove=s(this,"calciteListItemRemove",7);this.calciteValueListItemDragHandleBlur=s(this,"calciteValueListItemDragHandleBlur",6);this.pickListItem=null;this.guid=`calcite-value-list-item-${N()}`;this.getPickListRef=t=>this.pickListItem=t;this.handleKeyDown=t=>{if(t.key===" "){this.handleActivated=!this.handleActivated}};this.handleBlur=()=>{this.handleActivated=false;this.calciteValueListItemDragHandleBlur.emit({item:this.el,handle:this.handleEl})};this.handleSelectChange=t=>{this.selected=t.detail.selected};this.description=undefined;this.disabled=false;this.deselectDisabled=false;this.nonInteractive=false;this.handleActivated=false;this.icon=null;this.iconFlipRtl=false;this.label=undefined;this.metadata=undefined;this.removable=false;this.selected=false;this.value=undefined}connectedCallback(){P(this)}disconnectedCallback(){J(this)}componentWillLoad(){r(this)}componentDidLoad(){c(this)}componentDidRender(){o(this)}async toggleSelected(t){this.pickListItem.toggleSelected(t)}async setFocus(){await l(this);return this.pickListItem?.setFocus()}calciteListItemChangeHandler(t){t.detail.item=this.el}renderActionsEnd(){const{el:t}=this;const s=W(t,ot.actionsEnd);return s?e("slot",{name:ot.actionsEnd,slot:O.actionsEnd}):null}renderActionsStart(){const{el:t}=this;const s=W(t,ot.actionsStart);return s?e("slot",{name:ot.actionsStart,slot:O.actionsStart}):null}renderHandle(){const{icon:t,iconFlipRtl:s}=this;if(t===_.grip){return e("span",{class:{[M.handle]:true,[M.handleActivated]:this.handleActivated},"data-js-handle":true,onBlur:this.handleBlur,onKeyDown:this.handleKeyDown,ref:t=>this.handleEl=t,role:"button",tabindex:"0"},e("calcite-icon",{flipRtl:s,icon:at.drag,scale:"s"}))}}render(){return e(i,{key:"2fc2a1a70b75c2a812f14391915c06c852db8906",id:this.el.id||this.guid},e(n,{key:"7bcc26a8f85923865a318dbdf31954a62035b853",disabled:this.disabled},this.renderHandle(),e("calcite-pick-list-item",{key:"abdbbafe6d426da62e39584e85111811beae719b",description:this.description,deselectDisabled:this.deselectDisabled,disabled:this.disabled,label:this.label,metadata:this.metadata,nonInteractive:this.nonInteractive,onCalciteListItemChange:this.handleSelectChange,ref:this.getPickListRef,removable:this.removable,selected:this.selected,value:this.value},this.renderActionsStart(),this.renderActionsEnd())))}get el(){return a(this)}};ct.style=rt;export{it as calcite_value_list,ct as calcite_value_list_item};
-//# sourceMappingURL=p-948af2ee.entry.js.map

package/dist/calcite/p-94f426ae.js

@@ -1,7 +0,0 @@
-/*!
- * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
- * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.13.0
- */
-import{a as r,S as t,i as e,b as n,c as o,r as u,f as a}from"./p-0276629a.js";function c(r,t){var e=-1,n=r==null?0:r.length,o=Array(n);while(++e<n){o[e]=t(r[e],e,r)}return o}var f=Array.isArray;const i=f;var b=1/0;var v=t?t.prototype:undefined,l=v?v.toString:undefined;function s(t){if(typeof t=="string"){return t}if(i(t)){return c(t,s)+""}if(r(t)){return l?l.call(t):""}var e=t+"";return e=="0"&&1/t==-b?"-0":e}function j(r){return r}var y="[object AsyncFunction]",p="[object Function]",d="[object GeneratorFunction]",m="[object Proxy]";function A(r){if(!e(r)){return false}var t=n(r);return t==p||t==d||t==y||t==m}var x=9007199254740991;var g=/^(?:0|[1-9]\d*)$/;function h(r,t){var e=typeof r;t=t==null?x:t;return!!t&&(e=="number"||e!="symbol"&&g.test(r))&&(r>-1&&r%1==0&&r<t)}var O=9007199254740991;function w(r){return typeof r=="number"&&r>-1&&r%1==0&&r<=O}function F(r){return r!=null&&w(r.length)&&!A(r)}var E=Object.prototype;function S(r){var t=r&&r.constructor,e=typeof t=="function"&&t.prototype||E;return r===e}function U(r,t){var e=-1,n=Array(r);while(++e<r){n[e]=t(e)}return n}var I="[object Arguments]";function R(r){return o(r)&&n(r)==I}var $=Object.prototype;var k=$.hasOwnProperty;var B=$.propertyIsEnumerable;var D=R(function(){return arguments}())?R:function(r){return o(r)&&k.call(r,"callee")&&!B.call(r,"callee")};const M=D;function N(){return false}var C=typeof exports=="object"&&exports&&!exports.nodeType&&exports;var G=C&&typeof module=="object"&&module&&!module.nodeType&&module;var L=G&&G.exports===C;var P=L?u.Buffer:undefined;var T=P?P.isBuffer:undefined;var V=T||N;const W=V;var q="[object Arguments]",z="[object Array]",H="[object Boolean]",J="[object Date]",K="[object Error]",Q="[object Function]",X="[object Map]",Y="[object Number]",Z="[object Object]",_="[object RegExp]",rr="[object Set]",tr="[object String]",er="[object WeakMap]";var nr="[object ArrayBuffer]",or="[object DataView]",ur="[object Float32Array]",ar="[object Float64Array]",cr="[object Int8Array]",fr="[object Int16Array]",ir="[object Int32Array]",br="[object Uint8Array]",vr="[object Uint8ClampedArray]",lr="[object Uint16Array]",sr="[object Uint32Array]";var jr={};jr[ur]=jr[ar]=jr[cr]=jr[fr]=jr[ir]=jr[br]=jr[vr]=jr[lr]=jr[sr]=true;jr[q]=jr[z]=jr[nr]=jr[H]=jr[or]=jr[J]=jr[K]=jr[Q]=jr[X]=jr[Y]=jr[Z]=jr[_]=jr[rr]=jr[tr]=jr[er]=false;function yr(r){return o(r)&&w(r.length)&&!!jr[n(r)]}function pr(r){return function(t){return r(t)}}var dr=typeof exports=="object"&&exports&&!exports.nodeType&&exports;var mr=dr&&typeof module=="object"&&module&&!module.nodeType&&module;var Ar=mr&&mr.exports===dr;var xr=Ar&&a.process;var gr=function(){try{var r=mr&&mr.require&&mr.require("util").types;if(r){return r}return xr&&xr.binding&&xr.binding("util")}catch(r){}}();const hr=gr;var Or=hr&&hr.isTypedArray;var wr=Or?pr(Or):yr;const Fr=wr;var Er=Object.prototype;var Sr=Er.hasOwnProperty;function Ur(r,t){var e=i(r),n=!e&&M(r),o=!e&&!n&&W(r),u=!e&&!n&&!o&&Fr(r),a=e||n||o||u,c=a?U(r.length,String):[],f=c.length;for(var b in r){if((t||Sr.call(r,b))&&!(a&&(b=="length"||o&&(b=="offset"||b=="parent")||u&&(b=="buffer"||b=="byteLength"||b=="byteOffset")||h(b,f)))){c.push(b)}}return c}function Ir(r){var t=[];if(r!=null){for(var e in Object(r)){t.push(e)}}return t}var Rr=Object.prototype;var $r=Rr.hasOwnProperty;function kr(r){if(!e(r)){return Ir(r)}var t=S(r),n=[];for(var o in r){if(!(o=="constructor"&&(t||!$r.call(r,o)))){n.push(o)}}return n}function Br(r){return F(r)?Ur(r,true):kr(r)}function Dr(r){return r==null?"":s(r)}function Mr(r){return function(t,e,n){var o=-1,u=Object(t),a=n(t),c=a.length;while(c--){var f=a[r?c:++o];if(e(u[f],f,u)===false){break}}return t}}var Nr=Mr();const Cr=Nr;function Gr(r){return typeof r=="function"?r:j}var Lr=/[\\^$.*+?()[\]{}|]/g,Pr=RegExp(Lr.source);function Tr(r){r=Dr(r);return r&&Pr.test(r)?r.replace(Lr,"\\$&"):r}function Vr(r,t){return r==null?r:Cr(r,Gr(t),Br)}const Wr=(r,t,e)=>{const n=Tr(t);const o=new RegExp(n,"i");if(r.length===0){console.warn(`No data was passed to the filter function.\n    The data argument should be an array of objects`)}const u=(r,t,e)=>{if(r?.constant||r?.filterDisabled){return true}let n=false;Vr(r,((r,o)=>{if(typeof r==="function"||r==null){return}if(e&&!e.includes(o)){return}if(Array.isArray(r)||typeof r==="object"&&r!==null){if(u(r,t)){n=true}}else if(t.test(r)){n=true}}));return n};return r.filter((r=>u(r,o,e)))};export{Tr as e,Wr as f};
-//# sourceMappingURL=p-94f426ae.js.map