@esri/solutions-components 0.8.23 → 0.8.24
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/cjs/arcgis-login.cjs.entry.js +1 -1
- package/dist/cjs/basemap-gallery_7.cjs.entry.js +1 -1
- package/dist/cjs/buffer-tools_3.cjs.entry.js +1 -1
- package/dist/cjs/{calcite-avatar.cjs.entry.js → calcite-avatar_2.cjs.entry.js} +62 -0
- package/dist/cjs/calcite-block_5.cjs.entry.js +12 -3
- package/dist/cjs/calcite-dropdown-group_2.cjs.entry.js +419 -0
- package/dist/cjs/{calcite-dropdown_4.cjs.entry.js → calcite-dropdown_2.cjs.entry.js} +12 -435
- package/dist/cjs/calcite-flow_6.cjs.entry.js +23 -27
- package/dist/cjs/card-manager_3.cjs.entry.js +1 -1
- package/dist/cjs/crowdsource-manager.cjs.entry.js +1 -1
- package/dist/cjs/crowdsource-reporter.cjs.entry.js +56 -36
- package/dist/cjs/feature-list.cjs.entry.js +4 -3
- package/dist/cjs/{helpers-9347ad83.js → helpers-618a3f7d.js} +2 -1
- package/dist/cjs/instant-apps-create.cjs.entry.js +266 -0
- package/dist/cjs/instant-apps-export.cjs.entry.js +31 -16
- package/dist/cjs/instant-apps-header.cjs.entry.js +3 -2
- package/dist/cjs/instant-apps-interactive-legend-classic.cjs.entry.js +11 -4
- package/dist/cjs/instant-apps-interactive-legend-count_2.cjs.entry.js +1 -1
- package/dist/cjs/instant-apps-interactive-legend-group-legend-element-caption.cjs.entry.js +1 -1
- package/dist/cjs/instant-apps-interactive-legend-group-legend-element_5.cjs.entry.js +2 -2
- package/dist/cjs/instant-apps-interactive-legend.cjs.entry.js +1 -1
- package/dist/cjs/instant-apps-landing-page.cjs.entry.js +45 -9
- package/dist/cjs/instant-apps-language-switcher.cjs.entry.js +1 -1
- package/dist/cjs/instant-apps-language-translator.cjs.entry.js +1 -1
- package/dist/cjs/instant-apps-sign-in.cjs.entry.js +168 -0
- package/dist/cjs/{languageSwitcher-395021d6.js → languageSwitcher-b9a1485c.js} +3 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/public-notification.cjs.entry.js +3 -3
- package/dist/cjs/resources-fa37e40f.js +26 -0
- package/dist/cjs/solutions-components.cjs.js +1 -1
- package/dist/collection/collection-manifest.json +3 -1
- package/dist/collection/components/arcgis-login/arcgis-login.js +1 -1
- package/dist/collection/components/basemap-gallery/basemap-gallery.js +1 -1
- package/dist/collection/components/buffer-tools/buffer-tools.js +1 -1
- package/dist/collection/components/card-manager/card-manager.js +1 -1
- package/dist/collection/components/create-feature/create-feature.js +1 -1
- package/dist/collection/components/create-related-feature/create-related-feature.js +1 -1
- package/dist/collection/components/crowdsource-manager/crowdsource-manager.js +1 -1
- package/dist/collection/components/crowdsource-reporter/crowdsource-reporter.js +56 -45
- package/dist/collection/components/feature-details/feature-details.js +56 -13
- package/dist/collection/components/feature-list/feature-list.js +22 -3
- package/dist/collection/components/layer-list/layer-list.js +6 -13
- package/dist/collection/components/public-notification/public-notification.js +3 -3
- package/dist/collection/demos/crowdsource-reporter.html +22 -15
- package/dist/collection/utils/interfaces.ts +1 -0
- package/dist/components/arcgis-login.js +1 -1
- package/dist/components/basemap-gallery2.js +1 -1
- package/dist/components/buffer-tools2.js +1 -1
- package/dist/components/calcite-navigation-user.js +1 -99
- package/dist/components/card-manager2.js +1 -1
- package/dist/components/create-feature2.js +1 -1
- package/dist/components/create-related-feature2.js +1 -1
- package/dist/components/crowdsource-manager.js +1 -1
- package/dist/components/crowdsource-reporter.js +57 -37
- package/dist/components/feature-details2.js +16 -12
- package/dist/components/feature-list2.js +5 -3
- package/dist/components/helpers.js +3 -2
- package/dist/components/instant-apps-ckeditor-wrapper2.js +1 -1
- package/dist/components/instant-apps-create.js +317 -0
- package/dist/components/instant-apps-export.js +32 -16
- package/dist/components/instant-apps-filter-list2.js +6 -1
- package/dist/components/instant-apps-header2.js +3 -2
- package/dist/components/instant-apps-interactive-legend-classic2.js +12 -5
- package/dist/components/instant-apps-interactive-legend-legend-element-caption2.js +2 -2
- package/dist/components/instant-apps-landing-page.js +91 -16
- package/dist/components/instant-apps-language-translator2.js +3 -1
- package/dist/components/instant-apps-sign-in.js +11 -0
- package/dist/components/instant-apps-sign-in2.js +243 -0
- package/dist/components/instant-apps-social-share2.js +8 -2
- package/dist/components/layer-list2.js +6 -13
- package/dist/{esm/calcite-navigation-user.entry.js → components/navigation-user.js} +46 -9
- package/dist/components/public-notification.js +3 -3
- package/dist/esm/arcgis-login.entry.js +1 -1
- package/dist/esm/basemap-gallery_7.entry.js +1 -1
- package/dist/esm/buffer-tools_3.entry.js +1 -1
- package/dist/esm/{calcite-avatar.entry.js → calcite-avatar_2.entry.js} +64 -3
- package/dist/esm/calcite-block_5.entry.js +12 -3
- package/dist/esm/calcite-color-picker-hex-input_2.entry.js +1 -1
- package/dist/esm/calcite-color-picker.entry.js +1 -1
- package/dist/esm/calcite-dropdown-group_2.entry.js +414 -0
- package/dist/esm/{calcite-dropdown_4.entry.js → calcite-dropdown_2.entry.js} +2 -423
- package/dist/esm/calcite-flow_6.entry.js +23 -27
- package/dist/esm/card-manager_3.entry.js +1 -1
- package/dist/esm/crowdsource-manager.entry.js +1 -1
- package/dist/esm/crowdsource-reporter.entry.js +56 -36
- package/dist/esm/feature-list.entry.js +4 -3
- package/dist/esm/{helpers-a5a81b9d.js → helpers-61b05164.js} +3 -2
- package/dist/esm/instant-apps-create.entry.js +262 -0
- package/dist/esm/instant-apps-export.entry.js +31 -16
- package/dist/esm/instant-apps-header.entry.js +3 -2
- package/dist/esm/instant-apps-interactive-legend-classic.entry.js +11 -4
- package/dist/esm/instant-apps-interactive-legend-count_2.entry.js +1 -1
- package/dist/esm/instant-apps-interactive-legend-group-legend-element-caption.entry.js +1 -1
- package/dist/esm/instant-apps-interactive-legend-group-legend-element_5.entry.js +2 -2
- package/dist/esm/instant-apps-interactive-legend.entry.js +1 -1
- package/dist/esm/instant-apps-landing-page.entry.js +46 -10
- package/dist/esm/instant-apps-language-switcher.entry.js +1 -1
- package/dist/esm/instant-apps-language-translator.entry.js +1 -1
- package/dist/esm/instant-apps-sign-in.entry.js +164 -0
- package/dist/esm/{languageSwitcher-a4a615e4.js → languageSwitcher-d60f03b2.js} +3 -1
- package/dist/esm/loader.js +1 -1
- package/dist/esm/public-notification.entry.js +3 -3
- package/dist/esm/resources-16800cce.js +24 -0
- package/dist/esm/solutions-components.js +1 -1
- package/dist/esm/{utils-6419e941.js → utils-251cb6de.js} +1 -1
- package/dist/node_modules/@esri/instant-apps-components/dist/collection/components/instant-apps-create/instant-apps-create.css +150 -0
- package/dist/node_modules/@esri/instant-apps-components/dist/collection/components/instant-apps-header/instant-apps-header.css +16 -9
- package/dist/node_modules/@esri/instant-apps-components/dist/collection/components/instant-apps-landing-page/instant-apps-landing-page.css +19 -0
- package/dist/node_modules/@esri/instant-apps-components/dist/collection/components/instant-apps-sign-in/instant-apps-sign-in.css +98 -0
- package/dist/solutions-components/demos/crowdsource-reporter.html +22 -15
- package/dist/solutions-components/p-1251dcc6.entry.js +6 -0
- package/dist/solutions-components/{p-88495699.entry.js → p-16730f05.entry.js} +1 -1
- package/dist/solutions-components/p-1ae3b886.entry.js +17 -0
- package/dist/solutions-components/{p-63460d51.entry.js → p-1ff9eb95.entry.js} +1 -1
- package/dist/solutions-components/{p-8f6e0ae5.entry.js → p-26eb1225.entry.js} +1 -1
- package/dist/solutions-components/{p-3a2e0188.entry.js → p-2c044250.entry.js} +2 -2
- package/dist/solutions-components/p-314dc933.entry.js +6 -0
- package/dist/solutions-components/p-50741707.entry.js +6 -0
- package/dist/solutions-components/p-614ebce7.js +6 -0
- package/dist/solutions-components/{p-df73649e.entry.js → p-77cd573b.entry.js} +1 -1
- package/dist/solutions-components/{p-c95dcdf7.entry.js → p-7883b885.entry.js} +3 -3
- package/dist/solutions-components/p-79e2e203.entry.js +6 -0
- package/dist/solutions-components/{p-968a6fd8.entry.js → p-7b17e929.entry.js} +1 -1
- package/dist/solutions-components/p-80b3eb6b.entry.js +6 -0
- package/dist/solutions-components/p-84913712.js +6 -0
- package/dist/solutions-components/p-8c500fd7.entry.js +6 -0
- package/dist/solutions-components/{p-fe9d6d06.js → p-9f56c02c.js} +1 -1
- package/dist/solutions-components/{p-667c022f.entry.js → p-af4be4ce.entry.js} +1 -1
- package/dist/solutions-components/p-bb2e669d.entry.js +6 -0
- package/dist/solutions-components/p-c41997d5.js +11 -0
- package/dist/solutions-components/p-c512fcfb.entry.js +6 -0
- package/dist/solutions-components/{p-21d6360a.entry.js → p-c7f0e7a8.entry.js} +1 -1
- package/dist/solutions-components/{p-64da5bb8.entry.js → p-cbf0dada.entry.js} +3 -3
- package/dist/solutions-components/{p-9c7d4343.entry.js → p-cd91c3e7.entry.js} +1 -1
- package/dist/solutions-components/p-ceba37d3.entry.js +11 -0
- package/dist/solutions-components/{p-09b769b7.entry.js → p-d8a15e32.entry.js} +1 -1
- package/dist/solutions-components/p-d8da6406.entry.js +6 -0
- package/dist/solutions-components/p-da6b3c8a.entry.js +6 -0
- package/dist/solutions-components/{p-60f1055e.entry.js → p-e2400b0d.entry.js} +1 -1
- package/dist/solutions-components/p-e78be59a.entry.js +6 -0
- package/dist/solutions-components/p-f35cc7ae.entry.js +6 -0
- package/dist/solutions-components/solutions-components.esm.js +1 -1
- package/dist/solutions-components/utils/interfaces.ts +1 -0
- package/dist/types/components/crowdsource-reporter/crowdsource-reporter.d.ts +18 -7
- package/dist/types/components/feature-details/feature-details.d.ts +13 -1
- package/dist/types/components/feature-list/feature-list.d.ts +4 -0
- package/dist/types/components/layer-list/layer-list.d.ts +1 -1
- package/dist/types/components.d.ts +25 -2
- package/dist/types/preact.d.ts +7 -2
- package/dist/types/utils/interfaces.d.ts +1 -0
- package/package.json +2 -2
- package/dist/cjs/calcite-navigation-user.cjs.entry.js +0 -73
- package/dist/solutions-components/p-08a1e120.js +0 -6
- package/dist/solutions-components/p-3283660c.entry.js +0 -6
- package/dist/solutions-components/p-33647277.entry.js +0 -6
- package/dist/solutions-components/p-3af0764f.entry.js +0 -6
- package/dist/solutions-components/p-41d288c0.entry.js +0 -6
- package/dist/solutions-components/p-599dcc29.js +0 -6
- package/dist/solutions-components/p-64b4b579.entry.js +0 -11
- package/dist/solutions-components/p-ab96dd27.entry.js +0 -6
- package/dist/solutions-components/p-bb0c7be3.entry.js +0 -17
- package/dist/solutions-components/p-bb8e3add.entry.js +0 -11
- package/dist/solutions-components/p-c36bb8ca.entry.js +0 -6
- package/dist/solutions-components/p-cbe166fc.entry.js +0 -6
- package/dist/solutions-components/p-eab95aa4.entry.js +0 -6
- package/dist/solutions-components/p-f6a1673c.entry.js +0 -6
@@ -3,4 +3,4 @@
|
|
3
3
|
* Licensed under the Apache License, Version 2.0
|
4
4
|
* http://www.apache.org/licenses/LICENSE-2.0
|
5
5
|
*/
|
6
|
-
import{r as t,c as s,h as i,g as e}from"./p-6d753a3d.js";import{C as a,a as o,D as n,b as l,H as r,O as h,c,S as d,d as p,R as u}from"./p-1dbc5234.js";import{i as f,a as b}from"./p-67b26725.js";import{c as m,d as v,u as g,I as w}from"./p-9db9645e.js";import{i as x}from"./p-f50a294b.js";import{c as C,s as y,a as k}from"./p-a25bbcc1.js";import{c as A,d as S}from"./p-b5bfe190.js";import{r as D,c as $,a as j}from"./p-ebf59857.js";import{u as z,s as F,c as O,d as L}from"./p-2e625f11.js";import{C as M,n as I,h as N,o as P,a as K,b as U,p as E,c as H,d as R,t as T,e as X,f as V}from"./p-fe9d6d06.js";import{t as q}from"./p-29edb87c.js";import"./p-b85be429.js";import"./p-db50226e.js";import"./p-820d8935.js";import"./p-bfd3d428.js";import"./p-c8d3207e.js";const B=class{constructor(e){t(this,e),this.calciteColorPickerChange=s(this,"calciteColorPickerChange",6),this.calciteColorPickerInput=s(this,"calciteColorPickerInput",6),this.internalColorUpdateContext=null,this.mode=M.HEX,this.shiftKeyChannelAdjustment=0,this.handleTabActivate=t=>{this.channelMode=t.currentTarget.getAttribute("data-color-mode"),this.updateChannelsFromColor(this.color)},this.handleColorFieldScopeKeyDown=t=>{const{key:s}=t,i={ArrowUp:{x:0,y:-10},ArrowRight:{x:10,y:0},ArrowDown:{x:0,y:10},ArrowLeft:{x:-10,y:0}};i[s]&&(t.preventDefault(),this.scopeOrientation="ArrowDown"===s||"ArrowUp"===s?"vertical":"horizontal",this.captureColorFieldColor(this.colorFieldScopeLeft+i[s].x||0,this.colorFieldScopeTop+i[s].y||0,!1))},this.handleHueScopeKeyDown=t=>{const s=t.shiftKey?10:1,{key:i}=t,e={ArrowUp:1,ArrowRight:1,ArrowDown:-1,ArrowLeft:-1};if(e[i]){t.preventDefault();const a=e[i]*s,o=this.baseColorFieldColor.hue(),n=this.baseColorFieldColor.hue(o+a);this.internalColorSet(n,!1)}},this.handleHexInputChange=t=>{t.stopPropagation();const{isClearable:s,color:i}=this,e=t.target.value;!s||e?e!==(i&&I(N(i,U(this.mode))))&&this.internalColorSet(a(e)):this.internalColorSet(null)},this.handleSavedColorSelect=t=>{this.internalColorSet(a(t.currentTarget.color))},this.handleChannelInput=t=>{const s=t.currentTarget,i=Number(s.getAttribute("data-channel-index")),e=3===i?h.max:"rgb"===this.channelMode?u[Object.keys(u)[i]]:r[Object.keys(r)[i]];let a;if(this.isClearable&&!s.value)a="";else{const t=Number(s.value);a=$(t+this.shiftKeyChannelAdjustment,0,e).toString()}s.value=a,""!==a&&0!==this.shiftKeyChannelAdjustment&&this.handleChannelChange(t)},this.handleChannelChange=t=>{const s=t.currentTarget,i=Number(s.getAttribute("data-channel-index")),e=[...this.channels];if(this.isClearable&&!s.value)return this.channels=[null,null,null,null],void this.internalColorSet(null);const a=3===i,o=Number(s.value);e[i]=a?P(o):o,this.updateColorFromChannels(e)},this.handleSavedColorKeyDown=t=>{x(t.key)&&(t.preventDefault(),this.handleSavedColorSelect(t))},this.handleColorFieldPointerDown=t=>{if(!f(t))return;const{offsetX:s,offsetY:i}=t;window.addEventListener("pointermove",this.globalPointerMoveHandler),window.addEventListener("pointerup",this.globalPointerUpHandler,{once:!0}),this.activeCanvasInfo={context:this.colorFieldRenderingContext,bounds:this.colorFieldRenderingContext.canvas.getBoundingClientRect()},this.captureColorFieldColor(s,i),this.colorFieldScopeNode.focus()},this.handleHueSliderPointerDown=t=>{if(!f(t))return;const{offsetX:s}=t;window.addEventListener("pointermove",this.globalPointerMoveHandler),window.addEventListener("pointerup",this.globalPointerUpHandler,{once:!0}),this.activeCanvasInfo={context:this.hueSliderRenderingContext,bounds:this.hueSliderRenderingContext.canvas.getBoundingClientRect()},this.captureHueSliderColor(s),this.hueScopeNode.focus()},this.handleOpacitySliderPointerDown=t=>{if(!f(t))return;const{offsetX:s}=t;window.addEventListener("pointermove",this.globalPointerMoveHandler),window.addEventListener("pointerup",this.globalPointerUpHandler,{once:!0}),this.activeCanvasInfo={context:this.opacitySliderRenderingContext,bounds:this.opacitySliderRenderingContext.canvas.getBoundingClientRect()},this.captureOpacitySliderValue(s),this.opacityScopeNode.focus()},this.globalPointerUpHandler=t=>{if(!f(t))return;const s=this.activeCanvasInfo;this.activeCanvasInfo=null,this.drawColorControls(),s&&this.calciteColorPickerChange.emit()},this.globalPointerMoveHandler=t=>{const{activeCanvasInfo:s,el:i}=this;if(!i.isConnected||!s)return;const{context:e,bounds:a}=s;let o,n;const{clientX:l,clientY:r}=t;e.canvas.matches(":hover")?(o=l-a.x,n=r-a.y):(o=l<a.x+a.width&&l>a.x?l-a.x:l<a.x?0:a.width,n=r<a.y+a.height&&r>a.y?r-a.y:r<a.y?0:a.height),e===this.colorFieldRenderingContext?this.captureColorFieldColor(o,n,!1):e===this.hueSliderRenderingContext?this.captureHueSliderColor(o):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;return i("calcite-tab-title",{class:o.colorMode,"data-color-mode":t,key:t,onCalciteTabsActivate:this.handleTabActivate,selected:t===s},"rgb"===t?e.rgb:e.hsv)},this.renderChannelsTab=t=>{const{isClearable:s,channelMode:e,channels:a,messages:n,alphaChannel:l}=this,r=t===e,h="rgb"===t?[n.red,n.green,n.blue]:[n.hue,n.saturation,n.value],c=b(this.el),d=l?a:a.slice(0,3);return i("calcite-tab",{class:o.control,key:t,selected:r},i("div",{class:o.channels,dir:"ltr"},d.map(((t,i)=>{const e=3===i;return e&&(t=s&&!t?t:K(t)),this.renderChannel(t,i,h[i],c,e?"%":"")}))))},this.renderChannel=(t,s,e,a,n)=>i("calcite-input-number",{class:o.channel,"data-channel-index":s,dir:a,key:s,label:e,lang:this.effectiveLocale,numberButtonType:"none",numberingSystem:this.numberingSystem,onCalciteInputNumberChange:this.handleChannelChange,onCalciteInputNumberInput:this.handleChannelInput,onKeyDown:this.handleKeyDown,scale:"l"===this.scale?"m":"s",style:{marginLeft:s>0&&("s"!==this.scale||!this.alphaChannel||3!==s)?"-1px":""},suffixText:n,value:null==t?void 0:t.toString()}),this.deleteColor=()=>{const t=N(this.color,this.alphaChannel);if(!(this.savedColors.indexOf(t)>-1))return;const s=this.savedColors.filter((s=>s!==t));this.savedColors=s,this.storageId&&localStorage.setItem(`${p}${this.storageId}`,JSON.stringify(s))},this.saveColor=()=>{const t=N(this.color,this.alphaChannel);if(this.savedColors.indexOf(t)>-1)return;const s=[...this.savedColors,t];this.savedColors=s,this.storageId&&localStorage.setItem(`${p}${this.storageId}`,JSON.stringify(s))},this.drawColorControls=q(((t="all")=>{"all"!==t&&"color-field"!==t||!this.colorFieldRenderingContext||this.drawColorField(),"all"!==t&&"hue-slider"!==t||!this.hueSliderRenderingContext||this.drawHueSlider(),this.alphaChannel&&("all"===t||"opacity-slider"===t)&&this.opacitySliderRenderingContext&&this.drawOpacitySlider()}),16),this.captureColorFieldColor=(t,s,i=!0)=>{const{dimensions:{colorField:{height:e,width:a}}}=this,o=Math.round(r.s/a*t),n=Math.round(r.v/e*(e-s));this.internalColorSet(this.baseColorFieldColor.hsv().saturationv(o).value(n),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=>{t&&(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,{key:i}=t,e={ArrowUp:.01,ArrowRight:.01,ArrowDown:-.01,ArrowLeft:-.01};if(e[i]){t.preventDefault();const a=e[i]*s,o=this.baseColorFieldColor.alpha(),n=this.baseColorFieldColor.alpha(o+a);this.internalColorSet(n,!1)}},this.allowEmpty=!1,this.alphaChannel=!1,this.channelsDisabled=!1,this.clearable=!1,this.color=n,this.disabled=!1,this.format="auto",this.hideChannels=!1,this.hexDisabled=!1,this.hideHex=!1,this.hideSaved=!1,this.savedDisabled=!1,this.scale="m",this.storageId=void 0,this.messageOverrides=void 0,this.numberingSystem=void 0,this.value=I(N(n,this.alphaChannel)),this.defaultMessages=void 0,this.channelMode="rgb",this.channels=this.toChannels(n),this.dimensions=l.m,this.effectiveLocale="",this.messages=void 0,this.savedColors=[],this.colorFieldScopeTop=void 0,this.colorFieldScopeLeft=void 0,this.hueScopeLeft=void 0,this.opacityScopeLeft=void 0,this.scopeOrientation=void 0}handleAllowEmptyOrClearableChange(){this.isClearable=this.clearable||this.allowEmpty}handleAlphaChannelChange(t){const{format:s}=this;t&&"auto"!==s&&!U(s)&&(console.warn(`ignoring alphaChannel as the current format (${s}) does not support alpha`),this.alphaChannel=!1)}handleColorChange(t,s){this.drawColorControls(),this.updateChannelsFromColor(t),this.previousColor=s}handleFormatOrAlphaChannelChange(){this.setMode(this.format),this.internalColorSet(this.color,!1,"internal")}handleScaleChange(t="m"){this.updateDimensions(t),this.updateCanvasSize("all"),this.drawColorControls()}onMessagesChange(){}handleValueChange(t,s){const{isClearable:i,format:e}=this;let o=!1;if(!i||t){const i=E(t);if(!i||"auto"!==e&&i!==e)return this.showIncompatibleColorWarning(t,e),void(this.value=s);o=this.mode!==i,this.setMode(i,null===this.internalColorUpdateContext)}const n=this.activeCanvasInfo;if("initial"===this.internalColorUpdateContext)return;if("user-interaction"===this.internalColorUpdateContext)return this.calciteColorPickerInput.emit(),void(n||this.calciteColorPickerChange.emit());const l=i&&!t?null:a(null!=t&&"object"==typeof t&&U(this.mode)?H(t):t),r=!R(l,this.color);(o||r)&&this.internalColorSet(l,this.alphaChannel&&!(this.mode.endsWith("a")||this.mode.endsWith("a-css")),"internal")}get baseColorFieldColor(){return this.color||this.previousColor||n}effectiveLocaleChange(){z(this,this.effectiveLocale)}handleChannelKeyUpOrDown(t){this.shiftKeyChannelAdjustment=0;const{key:s}=t;if("ArrowUp"!==s&&"ArrowDown"!==s||!t.composedPath().some((t=>{var s;return null===(s=t.classList)||void 0===s?void 0:s.contains(o.channel)})))return;const{shiftKey:i}=t;if(t.preventDefault(),!this.color)return this.internalColorSet(this.previousColor),void t.stopPropagation();this.shiftKeyChannelAdjustment="ArrowUp"===s&&i?9:"ArrowDown"===s&&i?-9:0}async setFocus(){await C(this),this.el.focus()}async componentWillLoad(){y(this),this.handleAllowEmptyOrClearableChange();const{isClearable:t,color:s,format:i,value:e}=this,o=t&&!e,n=E(e),l=o||"auto"===i&&n||i===n,r=o?null:l?a(e):s;l||this.showIncompatibleColorWarning(e,i),this.setMode(i,!1),this.internalColorSet(r,!1,"initial"),this.updateDimensions(this.scale);const h=`${p}${this.storageId}`;this.storageId&&localStorage.getItem(h)&&(this.savedColors=JSON.parse(localStorage.getItem(h))),await F(this)}connectedCallback(){m(this),A(this),O(this)}componentDidLoad(){k(this)}disconnectedCallback(){window.removeEventListener("pointermove",this.globalPointerMoveHandler),window.removeEventListener("pointerup",this.globalPointerUpHandler),v(this),S(this),L(this)}componentDidRender(){g(this)}render(){const{channelsDisabled:t,color:s,colorFieldScopeLeft:e,colorFieldScopeTop:a,dimensions:{slider:{width:l},thumb:{radius:c}},hexDisabled:d,hideChannels:p,hideHex:u,hideSaved:f,hueScopeLeft:b,messages:m,alphaChannel:v,opacityScopeLeft:g,savedColors:x,savedDisabled:C,scale:y,scopeOrientation:k}=this,A=s?N(s,v):null,S=c,D=null!=b?b:l*n.hue()/r.h,$=c,j=null!=g?g:l*K(n.alpha())/h.max,z=null===s,F="vertical"===k,O=d||u,L=t||p,M=C||f,[I,P]=this.getAdjustedScopePosition(e,a),[U,E]=this.getAdjustedScopePosition(D,S),[H,R]=this.getAdjustedScopePosition(j,$);return i(w,{key:"5f347cb136350e7661b7b479ee86a16bb85414c3",disabled:this.disabled},i("div",{key:"0294cbc1d16db228c22a2ae1bd061d9a683c1378",class:o.container},i("div",{key:"f7531da7e77293d52f5f8220443258e40f07f2d3",class:o.controlAndScope},i("canvas",{key:"6738d5bc8ec0f77c01eaac72b6b89edeea39abd3",class:o.colorField,onPointerDown:this.handleColorFieldPointerDown,ref:this.initColorField}),i("div",{key:"932e10e761c6e8732e3412b049c895df18c4358f","aria-label":F?m.value:m.saturation,"aria-valuemax":F?r.v:r.s,"aria-valuemin":"0","aria-valuenow":(F?null==s?void 0:s.saturationv():null==s?void 0:s.value())||"0",class:{[o.scope]:!0,[o.colorFieldScope]:!0},onKeyDown:this.handleColorFieldScopeKeyDown,role:"slider",style:{top:`${P||0}px`,left:`${I||0}px`},tabindex:"0",ref:this.storeColorFieldScope})),i("div",{key:"1d1e670478df18f1a8ad35d9ca217b378e103468",class:o.previewAndSliders},i("calcite-color-picker-swatch",{key:"e65dd58f2aebb184db914c3a2c4e9782eb4b1e7c",class:o.preview,color:A,scale:"l"}),i("div",{key:"98fb46881b6c40899b8fdfa4afeb521356d1e250",class:o.sliders},i("div",{key:"7367b44dcc87a8cfbd5cd913ebee690eeabfcb92",class:o.controlAndScope},i("canvas",{key:"4fe31f39350ac02fe527452da248b07b573dadac",class:{[o.slider]:!0,[o.hueSlider]:!0},onPointerDown:this.handleHueSliderPointerDown,ref:this.initHueSlider}),i("div",{key:"47048d9a779471169b1c4ec14d70a1a258914b1a","aria-label":m.hue,"aria-valuemax":r.h,"aria-valuemin":"0","aria-valuenow":(null==s?void 0:s.round().hue())||n.round().hue(),class:{[o.scope]:!0,[o.hueScope]:!0},onKeyDown:this.handleHueScopeKeyDown,role:"slider",style:{top:`${E}px`,left:`${U}px`},tabindex:"0",ref:this.storeHueScope})),v?i("div",{class:o.controlAndScope},i("canvas",{class:{[o.slider]:!0,[o.opacitySlider]:!0},onPointerDown:this.handleOpacitySliderPointerDown,ref:this.initOpacitySlider}),i("div",{"aria-label":m.opacity,"aria-valuemax":h.max,"aria-valuemin":h.min,"aria-valuenow":(s||n).round().alpha(),class:{[o.scope]:!0,[o.opacityScope]:!0},onKeyDown:this.handleOpacityScopeKeyDown,role:"slider",style:{top:`${R}px`,left:`${H}px`},tabindex:"0",ref:this.storeOpacityScope})):null)),O&&L?null:i("div",{class:{[o.controlSection]:!0,[o.section]:!0}},i("div",{class:o.hexAndChannelsGroup},O?null:i("div",{class:o.hexOptions},i("calcite-color-picker-hex-input",{allowEmpty:this.isClearable,alphaChannel:v,class:o.control,messages:m,numberingSystem:this.numberingSystem,onCalciteColorPickerHexInputChange:this.handleHexInputChange,scale:y,value:A})),L?null:i("calcite-tabs",{class:{[o.colorModeContainer]:!0,[o.splitSection]:!0},scale:"l"===y?"m":"s"},i("calcite-tab-nav",{slot:"title-group"},this.renderChannelsTabTitle("rgb"),this.renderChannelsTabTitle("hsv")),this.renderChannelsTab("rgb"),this.renderChannelsTab("hsv")))),M?null:i("div",{class:{[o.savedColorsSection]:!0,[o.section]:!0}},i("div",{class:o.header},i("label",null,m.saved),i("div",{class:o.savedColorsButtons},i("calcite-button",{appearance:"transparent",class:o.deleteColor,disabled:z,iconStart:"minus",kind:"neutral",label:m.deleteColor,onClick:this.deleteColor,scale:y,type:"button"}),i("calcite-button",{appearance:"transparent",class:o.saveColor,disabled:z,iconStart:"plus",kind:"neutral",label:m.saveColor,onClick:this.saveColor,scale:y,type:"button"}))),x.length>0?i("div",{class:o.savedColors},[...x.map((t=>i("calcite-color-picker-swatch",{class:o.savedColor,color:t,key:t,onClick:this.handleSavedColorSelect,onKeyDown:this.handleSavedColorKeyDown,scale:y,tabIndex:0})))]):null)))}handleKeyDown(t){"Enter"===t.key&&t.preventDefault()}showIncompatibleColorWarning(t,s){console.warn(`ignoring color value (${t}) as it is not compatible with the current format (${s})`)}setMode(t,s=!0){this.mode=this.ensureCompatibleMode("auto"===t?this.mode:t,s)}ensureCompatibleMode(t,s){const{alphaChannel:i}=this,e=U(t);if(i&&!e){const i=V(t);return s&&console.warn(`setting format to (${i}) as the provided one (${t}) does not support alpha`),i}if(!i&&e){const i=T(t);return s&&console.warn(`setting format to (${i}) as the provided one (${t}) does not support alpha`),i}return t}captureHueSliderColor(t){const{dimensions:{slider:{width:s}}}=this;this.internalColorSet(this.baseColorFieldColor.hue(c/s*t),!1)}captureOpacitySliderValue(t){const{dimensions:{slider:{width:s}}}=this,i=P(h.max/s*t);this.internalColorSet(this.baseColorFieldColor.alpha(i),!1)}internalColorSet(t,s=!0,i="user-interaction"){s&&R(t,this.color)||(this.internalColorUpdateContext=i,this.color=t,this.value=this.toValue(t),this.internalColorUpdateContext=null)}toValue(t,s=this.mode){if(!t)return null;if(s.includes("hex")){const i=s===M.HEXA;return I(N(t.round(),i),i)}if(s.includes("-css")){const i=t[s.replace("-css","").replace("a","")]().round().string();return(s.endsWith("a")||s.endsWith("a-css"))&&1===t.alpha()?`${i.slice(0,3)}a(${i.slice(4,-1)}, ${t.alpha()})`:i}const i=t[T(s)]().round().object();return s.endsWith("a")?X(i):i}getSliderCapSpacing(){const{dimensions:{slider:{height:t},thumb:{radius:s}}}=this;return 2*s-t}updateDimensions(t="m"){this.dimensions=l[t]}drawColorField(){const t=this.colorFieldRenderingContext,{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 a=t.createLinearGradient(0,0,0,s);a.addColorStop(0,"rgba(0,0,0,0)"),a.addColorStop(1,"rgba(0,0,0,1)"),t.fillStyle=a,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`,t.getContext("2d").scale(e,e)}updateCanvasSize(t="all"){var s,i,e;const{dimensions:a}=this;"all"!==t&&"color-field"!==t||this.setCanvasContextSize(null===(s=this.colorFieldRenderingContext)||void 0===s?void 0:s.canvas,a.colorField);const o={width:a.slider.width,height:a.slider.height+2*(a.thumb.radius-a.slider.height/2)};"all"!==t&&"hue-slider"!==t||this.setCanvasContextSize(null===(i=this.hueSliderRenderingContext)||void 0===i?void 0:i.canvas,o),"all"!==t&&"opacity-slider"!==t||this.setCanvasContextSize(null===(e=this.opacitySliderRenderingContext)||void 0===e?void 0:e.canvas,o)}drawActiveColorFieldColor(){const{color:t}=this;if(!t)return;const s=t.hsv(),{dimensions:{colorField:{height:i,width:e},thumb:{radius:a}}}=this,o=s.saturationv()/(r.s/e),n=i-s.value()/(r.v/i);requestAnimationFrame((()=>{this.colorFieldScopeLeft=o,this.colorFieldScopeTop=n})),this.drawThumb(this.colorFieldRenderingContext,a,o,n,s,!1)}drawThumb(t,s,i,e,a,o){const n=2*Math.PI;if(t.beginPath(),t.arc(i,e,s,0,n),t.fillStyle="#fff",t.fill(),t.strokeStyle="rgba(0,0,0,0.3)",t.lineWidth=1,t.stroke(),o&&a.alpha()<1){const a=t.createPattern(this.getCheckeredBackgroundPattern(),"repeat");t.beginPath(),t.arc(i,e,s-3,0,n),t.fillStyle=a,t.fill()}t.globalCompositeOperation="source-atop",t.beginPath(),t.arc(i,e,s-3,0,n);const l=o?a.alpha():1;t.fillStyle=a.rgb().alpha(l).string(),t.fill(),t.globalCompositeOperation="source-over"}drawActiveHueSliderColor(){const{color:t}=this;if(!t)return;const s=t.hsv().saturationv(100).value(100),{dimensions:{slider:{width:i},thumb:{radius:e}}}=this,a=s.hue()/(c/i),o=e,n=this.getSliderBoundX(a,i,e);requestAnimationFrame((()=>{this.hueScopeLeft=n})),this.drawThumb(this.hueSliderRenderingContext,e,n,o,s,!1)}drawHueSlider(){const t=this.hueSliderRenderingContext,{dimensions:{slider:{height:s,width:i},thumb:{radius:e}}}=this,o=e-s/2,n=t.createLinearGradient(0,0,i,0),l=["red","yellow","lime","cyan","blue","magenta","#ff0004"],r=1/(l.length-1);let h=0;l.forEach((t=>{n.addColorStop(h,a(t).string()),h+=r})),t.clearRect(0,0,i,s+2*this.getSliderCapSpacing()),this.drawSliderPath(t,s,i,0,o),t.fillStyle=n,t.fill(),t.strokeStyle="rgba(0,0,0,0.3)",t.lineWidth=1,t.stroke(),this.drawActiveHueSliderColor()}drawOpacitySlider(){const t=this.opacitySliderRenderingContext,{baseColorFieldColor:s,dimensions:{slider:{height:i,width:e},thumb:{radius:a}}}=this,o=a-i/2;t.clearRect(0,0,e,i+2*this.getSliderCapSpacing());const n=t.createLinearGradient(0,o,e,0),l=s.rgb().alpha(0),r=s.rgb().alpha(.5),h=s.rgb().alpha(1);n.addColorStop(0,l.string()),n.addColorStop(.5,r.string()),n.addColorStop(1,h.string()),this.drawSliderPath(t,i,e,0,o);const c=t.createPattern(this.getCheckeredBackgroundPattern(),"repeat");t.fillStyle=c,t.fill(),t.fillStyle=n,t.fill(),t.strokeStyle="rgba(0,0,0,0.3)",t.lineWidth=1,t.stroke(),this.drawActiveOpacitySliderColor()}drawSliderPath(t,s,i,e,a){const o=s/2+1;t.beginPath(),t.moveTo(e+o,a),t.lineTo(e+i-o,a),t.quadraticCurveTo(e+i,a,e+i,a+o),t.lineTo(e+i,a+s-o),t.quadraticCurveTo(e+i,a+s,e+i-o,a+s),t.lineTo(e+o,a+s),t.quadraticCurveTo(e,a+s,e,a+s-o),t.lineTo(e,a+o),t.quadraticCurveTo(e,a,e+o,a),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");return 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,t}drawActiveOpacitySliderColor(){const{color:t}=this;if(!t)return;const s=t,{dimensions:{slider:{width:i},thumb:{radius:e}}}=this,a=K(s.alpha())/(h.max/i),o=e,n=this.getSliderBoundX(a,i,e);requestAnimationFrame((()=>{this.opacityScopeLeft=n})),this.drawThumb(this.opacitySliderRenderingContext,e,n,o,s,!0)}getSliderBoundX(t,s,i){const e=j(t,s,i);return 0===e?t:-1===e?D(t,0,s,i,2*i):D(t,0,s,s-2*i,s-i)}updateColorFromChannels(t){this.internalColorSet(a(t,this.channelMode))}updateChannelsFromColor(t){this.channels=t?this.toChannels(t):[null,null,null,null]}toChannels(t){const{channelMode:s}=this,i=t[s]().array().map(((t,s)=>3===s?t:Math.floor(t)));return 3===i.length&&i.push(1),i}getAdjustedScopePosition(t,s){return[t-d/2,s-d/2]}static get delegatesFocus(){return!0}static get assetsDirs(){return["assets"]}get el(){return e(this)}static get watchers(){return{allowEmpty:["handleAllowEmptyOrClearableChange"],clearable:["handleAllowEmptyOrClearableChange"],alphaChannel:["handleAlphaChannelChange","handleFormatOrAlphaChannelChange"],color:["handleColorChange"],format:["handleFormatOrAlphaChannelChange"],scale:["handleScaleChange"],messageOverrides:["onMessagesChange"],value:["handleValueChange"],effectiveLocale:["effectiveLocaleChange"]}}};B.style=':host([disabled]){cursor:default;-webkit-user-select:none;-moz-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}.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:11px}.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)}.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}';export{B as calcite_color_picker}
|
6
|
+
import{r as t,c as s,h as i,g as e}from"./p-6d753a3d.js";import{C as a,a as o,D as n,b as l,H as r,O as h,c,S as d,d as p,R as u}from"./p-1dbc5234.js";import{i as f,a as b}from"./p-67b26725.js";import{c as m,d as v,u as g,I as w}from"./p-9db9645e.js";import{i as x}from"./p-f50a294b.js";import{c as C,s as y,a as k}from"./p-a25bbcc1.js";import{c as A,d as S}from"./p-b5bfe190.js";import{r as D,c as $,a as j}from"./p-ebf59857.js";import{u as z,s as F,c as O,d as L}from"./p-2e625f11.js";import{C as M,n as I,h as N,o as P,a as K,b as U,p as E,c as H,d as R,t as T,e as X,f as V}from"./p-9f56c02c.js";import{t as q}from"./p-29edb87c.js";import"./p-b85be429.js";import"./p-db50226e.js";import"./p-820d8935.js";import"./p-bfd3d428.js";import"./p-c8d3207e.js";const B=class{constructor(e){t(this,e),this.calciteColorPickerChange=s(this,"calciteColorPickerChange",6),this.calciteColorPickerInput=s(this,"calciteColorPickerInput",6),this.internalColorUpdateContext=null,this.mode=M.HEX,this.shiftKeyChannelAdjustment=0,this.handleTabActivate=t=>{this.channelMode=t.currentTarget.getAttribute("data-color-mode"),this.updateChannelsFromColor(this.color)},this.handleColorFieldScopeKeyDown=t=>{const{key:s}=t,i={ArrowUp:{x:0,y:-10},ArrowRight:{x:10,y:0},ArrowDown:{x:0,y:10},ArrowLeft:{x:-10,y:0}};i[s]&&(t.preventDefault(),this.scopeOrientation="ArrowDown"===s||"ArrowUp"===s?"vertical":"horizontal",this.captureColorFieldColor(this.colorFieldScopeLeft+i[s].x||0,this.colorFieldScopeTop+i[s].y||0,!1))},this.handleHueScopeKeyDown=t=>{const s=t.shiftKey?10:1,{key:i}=t,e={ArrowUp:1,ArrowRight:1,ArrowDown:-1,ArrowLeft:-1};if(e[i]){t.preventDefault();const a=e[i]*s,o=this.baseColorFieldColor.hue(),n=this.baseColorFieldColor.hue(o+a);this.internalColorSet(n,!1)}},this.handleHexInputChange=t=>{t.stopPropagation();const{isClearable:s,color:i}=this,e=t.target.value;!s||e?e!==(i&&I(N(i,U(this.mode))))&&this.internalColorSet(a(e)):this.internalColorSet(null)},this.handleSavedColorSelect=t=>{this.internalColorSet(a(t.currentTarget.color))},this.handleChannelInput=t=>{const s=t.currentTarget,i=Number(s.getAttribute("data-channel-index")),e=3===i?h.max:"rgb"===this.channelMode?u[Object.keys(u)[i]]:r[Object.keys(r)[i]];let a;if(this.isClearable&&!s.value)a="";else{const t=Number(s.value);a=$(t+this.shiftKeyChannelAdjustment,0,e).toString()}s.value=a,""!==a&&0!==this.shiftKeyChannelAdjustment&&this.handleChannelChange(t)},this.handleChannelChange=t=>{const s=t.currentTarget,i=Number(s.getAttribute("data-channel-index")),e=[...this.channels];if(this.isClearable&&!s.value)return this.channels=[null,null,null,null],void this.internalColorSet(null);const a=3===i,o=Number(s.value);e[i]=a?P(o):o,this.updateColorFromChannels(e)},this.handleSavedColorKeyDown=t=>{x(t.key)&&(t.preventDefault(),this.handleSavedColorSelect(t))},this.handleColorFieldPointerDown=t=>{if(!f(t))return;const{offsetX:s,offsetY:i}=t;window.addEventListener("pointermove",this.globalPointerMoveHandler),window.addEventListener("pointerup",this.globalPointerUpHandler,{once:!0}),this.activeCanvasInfo={context:this.colorFieldRenderingContext,bounds:this.colorFieldRenderingContext.canvas.getBoundingClientRect()},this.captureColorFieldColor(s,i),this.colorFieldScopeNode.focus()},this.handleHueSliderPointerDown=t=>{if(!f(t))return;const{offsetX:s}=t;window.addEventListener("pointermove",this.globalPointerMoveHandler),window.addEventListener("pointerup",this.globalPointerUpHandler,{once:!0}),this.activeCanvasInfo={context:this.hueSliderRenderingContext,bounds:this.hueSliderRenderingContext.canvas.getBoundingClientRect()},this.captureHueSliderColor(s),this.hueScopeNode.focus()},this.handleOpacitySliderPointerDown=t=>{if(!f(t))return;const{offsetX:s}=t;window.addEventListener("pointermove",this.globalPointerMoveHandler),window.addEventListener("pointerup",this.globalPointerUpHandler,{once:!0}),this.activeCanvasInfo={context:this.opacitySliderRenderingContext,bounds:this.opacitySliderRenderingContext.canvas.getBoundingClientRect()},this.captureOpacitySliderValue(s),this.opacityScopeNode.focus()},this.globalPointerUpHandler=t=>{if(!f(t))return;const s=this.activeCanvasInfo;this.activeCanvasInfo=null,this.drawColorControls(),s&&this.calciteColorPickerChange.emit()},this.globalPointerMoveHandler=t=>{const{activeCanvasInfo:s,el:i}=this;if(!i.isConnected||!s)return;const{context:e,bounds:a}=s;let o,n;const{clientX:l,clientY:r}=t;e.canvas.matches(":hover")?(o=l-a.x,n=r-a.y):(o=l<a.x+a.width&&l>a.x?l-a.x:l<a.x?0:a.width,n=r<a.y+a.height&&r>a.y?r-a.y:r<a.y?0:a.height),e===this.colorFieldRenderingContext?this.captureColorFieldColor(o,n,!1):e===this.hueSliderRenderingContext?this.captureHueSliderColor(o):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;return i("calcite-tab-title",{class:o.colorMode,"data-color-mode":t,key:t,onCalciteTabsActivate:this.handleTabActivate,selected:t===s},"rgb"===t?e.rgb:e.hsv)},this.renderChannelsTab=t=>{const{isClearable:s,channelMode:e,channels:a,messages:n,alphaChannel:l}=this,r=t===e,h="rgb"===t?[n.red,n.green,n.blue]:[n.hue,n.saturation,n.value],c=b(this.el),d=l?a:a.slice(0,3);return i("calcite-tab",{class:o.control,key:t,selected:r},i("div",{class:o.channels,dir:"ltr"},d.map(((t,i)=>{const e=3===i;return e&&(t=s&&!t?t:K(t)),this.renderChannel(t,i,h[i],c,e?"%":"")}))))},this.renderChannel=(t,s,e,a,n)=>i("calcite-input-number",{class:o.channel,"data-channel-index":s,dir:a,key:s,label:e,lang:this.effectiveLocale,numberButtonType:"none",numberingSystem:this.numberingSystem,onCalciteInputNumberChange:this.handleChannelChange,onCalciteInputNumberInput:this.handleChannelInput,onKeyDown:this.handleKeyDown,scale:"l"===this.scale?"m":"s",style:{marginLeft:s>0&&("s"!==this.scale||!this.alphaChannel||3!==s)?"-1px":""},suffixText:n,value:null==t?void 0:t.toString()}),this.deleteColor=()=>{const t=N(this.color,this.alphaChannel);if(!(this.savedColors.indexOf(t)>-1))return;const s=this.savedColors.filter((s=>s!==t));this.savedColors=s,this.storageId&&localStorage.setItem(`${p}${this.storageId}`,JSON.stringify(s))},this.saveColor=()=>{const t=N(this.color,this.alphaChannel);if(this.savedColors.indexOf(t)>-1)return;const s=[...this.savedColors,t];this.savedColors=s,this.storageId&&localStorage.setItem(`${p}${this.storageId}`,JSON.stringify(s))},this.drawColorControls=q(((t="all")=>{"all"!==t&&"color-field"!==t||!this.colorFieldRenderingContext||this.drawColorField(),"all"!==t&&"hue-slider"!==t||!this.hueSliderRenderingContext||this.drawHueSlider(),this.alphaChannel&&("all"===t||"opacity-slider"===t)&&this.opacitySliderRenderingContext&&this.drawOpacitySlider()}),16),this.captureColorFieldColor=(t,s,i=!0)=>{const{dimensions:{colorField:{height:e,width:a}}}=this,o=Math.round(r.s/a*t),n=Math.round(r.v/e*(e-s));this.internalColorSet(this.baseColorFieldColor.hsv().saturationv(o).value(n),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=>{t&&(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,{key:i}=t,e={ArrowUp:.01,ArrowRight:.01,ArrowDown:-.01,ArrowLeft:-.01};if(e[i]){t.preventDefault();const a=e[i]*s,o=this.baseColorFieldColor.alpha(),n=this.baseColorFieldColor.alpha(o+a);this.internalColorSet(n,!1)}},this.allowEmpty=!1,this.alphaChannel=!1,this.channelsDisabled=!1,this.clearable=!1,this.color=n,this.disabled=!1,this.format="auto",this.hideChannels=!1,this.hexDisabled=!1,this.hideHex=!1,this.hideSaved=!1,this.savedDisabled=!1,this.scale="m",this.storageId=void 0,this.messageOverrides=void 0,this.numberingSystem=void 0,this.value=I(N(n,this.alphaChannel)),this.defaultMessages=void 0,this.channelMode="rgb",this.channels=this.toChannels(n),this.dimensions=l.m,this.effectiveLocale="",this.messages=void 0,this.savedColors=[],this.colorFieldScopeTop=void 0,this.colorFieldScopeLeft=void 0,this.hueScopeLeft=void 0,this.opacityScopeLeft=void 0,this.scopeOrientation=void 0}handleAllowEmptyOrClearableChange(){this.isClearable=this.clearable||this.allowEmpty}handleAlphaChannelChange(t){const{format:s}=this;t&&"auto"!==s&&!U(s)&&(console.warn(`ignoring alphaChannel as the current format (${s}) does not support alpha`),this.alphaChannel=!1)}handleColorChange(t,s){this.drawColorControls(),this.updateChannelsFromColor(t),this.previousColor=s}handleFormatOrAlphaChannelChange(){this.setMode(this.format),this.internalColorSet(this.color,!1,"internal")}handleScaleChange(t="m"){this.updateDimensions(t),this.updateCanvasSize("all"),this.drawColorControls()}onMessagesChange(){}handleValueChange(t,s){const{isClearable:i,format:e}=this;let o=!1;if(!i||t){const i=E(t);if(!i||"auto"!==e&&i!==e)return this.showIncompatibleColorWarning(t,e),void(this.value=s);o=this.mode!==i,this.setMode(i,null===this.internalColorUpdateContext)}const n=this.activeCanvasInfo;if("initial"===this.internalColorUpdateContext)return;if("user-interaction"===this.internalColorUpdateContext)return this.calciteColorPickerInput.emit(),void(n||this.calciteColorPickerChange.emit());const l=i&&!t?null:a(null!=t&&"object"==typeof t&&U(this.mode)?H(t):t),r=!R(l,this.color);(o||r)&&this.internalColorSet(l,this.alphaChannel&&!(this.mode.endsWith("a")||this.mode.endsWith("a-css")),"internal")}get baseColorFieldColor(){return this.color||this.previousColor||n}effectiveLocaleChange(){z(this,this.effectiveLocale)}handleChannelKeyUpOrDown(t){this.shiftKeyChannelAdjustment=0;const{key:s}=t;if("ArrowUp"!==s&&"ArrowDown"!==s||!t.composedPath().some((t=>{var s;return null===(s=t.classList)||void 0===s?void 0:s.contains(o.channel)})))return;const{shiftKey:i}=t;if(t.preventDefault(),!this.color)return this.internalColorSet(this.previousColor),void t.stopPropagation();this.shiftKeyChannelAdjustment="ArrowUp"===s&&i?9:"ArrowDown"===s&&i?-9:0}async setFocus(){await C(this),this.el.focus()}async componentWillLoad(){y(this),this.handleAllowEmptyOrClearableChange();const{isClearable:t,color:s,format:i,value:e}=this,o=t&&!e,n=E(e),l=o||"auto"===i&&n||i===n,r=o?null:l?a(e):s;l||this.showIncompatibleColorWarning(e,i),this.setMode(i,!1),this.internalColorSet(r,!1,"initial"),this.updateDimensions(this.scale);const h=`${p}${this.storageId}`;this.storageId&&localStorage.getItem(h)&&(this.savedColors=JSON.parse(localStorage.getItem(h))),await F(this)}connectedCallback(){m(this),A(this),O(this)}componentDidLoad(){k(this)}disconnectedCallback(){window.removeEventListener("pointermove",this.globalPointerMoveHandler),window.removeEventListener("pointerup",this.globalPointerUpHandler),v(this),S(this),L(this)}componentDidRender(){g(this)}render(){const{channelsDisabled:t,color:s,colorFieldScopeLeft:e,colorFieldScopeTop:a,dimensions:{slider:{width:l},thumb:{radius:c}},hexDisabled:d,hideChannels:p,hideHex:u,hideSaved:f,hueScopeLeft:b,messages:m,alphaChannel:v,opacityScopeLeft:g,savedColors:x,savedDisabled:C,scale:y,scopeOrientation:k}=this,A=s?N(s,v):null,S=c,D=null!=b?b:l*n.hue()/r.h,$=c,j=null!=g?g:l*K(n.alpha())/h.max,z=null===s,F="vertical"===k,O=d||u,L=t||p,M=C||f,[I,P]=this.getAdjustedScopePosition(e,a),[U,E]=this.getAdjustedScopePosition(D,S),[H,R]=this.getAdjustedScopePosition(j,$);return i(w,{key:"5f347cb136350e7661b7b479ee86a16bb85414c3",disabled:this.disabled},i("div",{key:"0294cbc1d16db228c22a2ae1bd061d9a683c1378",class:o.container},i("div",{key:"f7531da7e77293d52f5f8220443258e40f07f2d3",class:o.controlAndScope},i("canvas",{key:"6738d5bc8ec0f77c01eaac72b6b89edeea39abd3",class:o.colorField,onPointerDown:this.handleColorFieldPointerDown,ref:this.initColorField}),i("div",{key:"932e10e761c6e8732e3412b049c895df18c4358f","aria-label":F?m.value:m.saturation,"aria-valuemax":F?r.v:r.s,"aria-valuemin":"0","aria-valuenow":(F?null==s?void 0:s.saturationv():null==s?void 0:s.value())||"0",class:{[o.scope]:!0,[o.colorFieldScope]:!0},onKeyDown:this.handleColorFieldScopeKeyDown,role:"slider",style:{top:`${P||0}px`,left:`${I||0}px`},tabindex:"0",ref:this.storeColorFieldScope})),i("div",{key:"1d1e670478df18f1a8ad35d9ca217b378e103468",class:o.previewAndSliders},i("calcite-color-picker-swatch",{key:"e65dd58f2aebb184db914c3a2c4e9782eb4b1e7c",class:o.preview,color:A,scale:"l"}),i("div",{key:"98fb46881b6c40899b8fdfa4afeb521356d1e250",class:o.sliders},i("div",{key:"7367b44dcc87a8cfbd5cd913ebee690eeabfcb92",class:o.controlAndScope},i("canvas",{key:"4fe31f39350ac02fe527452da248b07b573dadac",class:{[o.slider]:!0,[o.hueSlider]:!0},onPointerDown:this.handleHueSliderPointerDown,ref:this.initHueSlider}),i("div",{key:"47048d9a779471169b1c4ec14d70a1a258914b1a","aria-label":m.hue,"aria-valuemax":r.h,"aria-valuemin":"0","aria-valuenow":(null==s?void 0:s.round().hue())||n.round().hue(),class:{[o.scope]:!0,[o.hueScope]:!0},onKeyDown:this.handleHueScopeKeyDown,role:"slider",style:{top:`${E}px`,left:`${U}px`},tabindex:"0",ref:this.storeHueScope})),v?i("div",{class:o.controlAndScope},i("canvas",{class:{[o.slider]:!0,[o.opacitySlider]:!0},onPointerDown:this.handleOpacitySliderPointerDown,ref:this.initOpacitySlider}),i("div",{"aria-label":m.opacity,"aria-valuemax":h.max,"aria-valuemin":h.min,"aria-valuenow":(s||n).round().alpha(),class:{[o.scope]:!0,[o.opacityScope]:!0},onKeyDown:this.handleOpacityScopeKeyDown,role:"slider",style:{top:`${R}px`,left:`${H}px`},tabindex:"0",ref:this.storeOpacityScope})):null)),O&&L?null:i("div",{class:{[o.controlSection]:!0,[o.section]:!0}},i("div",{class:o.hexAndChannelsGroup},O?null:i("div",{class:o.hexOptions},i("calcite-color-picker-hex-input",{allowEmpty:this.isClearable,alphaChannel:v,class:o.control,messages:m,numberingSystem:this.numberingSystem,onCalciteColorPickerHexInputChange:this.handleHexInputChange,scale:y,value:A})),L?null:i("calcite-tabs",{class:{[o.colorModeContainer]:!0,[o.splitSection]:!0},scale:"l"===y?"m":"s"},i("calcite-tab-nav",{slot:"title-group"},this.renderChannelsTabTitle("rgb"),this.renderChannelsTabTitle("hsv")),this.renderChannelsTab("rgb"),this.renderChannelsTab("hsv")))),M?null:i("div",{class:{[o.savedColorsSection]:!0,[o.section]:!0}},i("div",{class:o.header},i("label",null,m.saved),i("div",{class:o.savedColorsButtons},i("calcite-button",{appearance:"transparent",class:o.deleteColor,disabled:z,iconStart:"minus",kind:"neutral",label:m.deleteColor,onClick:this.deleteColor,scale:y,type:"button"}),i("calcite-button",{appearance:"transparent",class:o.saveColor,disabled:z,iconStart:"plus",kind:"neutral",label:m.saveColor,onClick:this.saveColor,scale:y,type:"button"}))),x.length>0?i("div",{class:o.savedColors},[...x.map((t=>i("calcite-color-picker-swatch",{class:o.savedColor,color:t,key:t,onClick:this.handleSavedColorSelect,onKeyDown:this.handleSavedColorKeyDown,scale:y,tabIndex:0})))]):null)))}handleKeyDown(t){"Enter"===t.key&&t.preventDefault()}showIncompatibleColorWarning(t,s){console.warn(`ignoring color value (${t}) as it is not compatible with the current format (${s})`)}setMode(t,s=!0){this.mode=this.ensureCompatibleMode("auto"===t?this.mode:t,s)}ensureCompatibleMode(t,s){const{alphaChannel:i}=this,e=U(t);if(i&&!e){const i=V(t);return s&&console.warn(`setting format to (${i}) as the provided one (${t}) does not support alpha`),i}if(!i&&e){const i=T(t);return s&&console.warn(`setting format to (${i}) as the provided one (${t}) does not support alpha`),i}return t}captureHueSliderColor(t){const{dimensions:{slider:{width:s}}}=this;this.internalColorSet(this.baseColorFieldColor.hue(c/s*t),!1)}captureOpacitySliderValue(t){const{dimensions:{slider:{width:s}}}=this,i=P(h.max/s*t);this.internalColorSet(this.baseColorFieldColor.alpha(i),!1)}internalColorSet(t,s=!0,i="user-interaction"){s&&R(t,this.color)||(this.internalColorUpdateContext=i,this.color=t,this.value=this.toValue(t),this.internalColorUpdateContext=null)}toValue(t,s=this.mode){if(!t)return null;if(s.includes("hex")){const i=s===M.HEXA;return I(N(t.round(),i),i)}if(s.includes("-css")){const i=t[s.replace("-css","").replace("a","")]().round().string();return(s.endsWith("a")||s.endsWith("a-css"))&&1===t.alpha()?`${i.slice(0,3)}a(${i.slice(4,-1)}, ${t.alpha()})`:i}const i=t[T(s)]().round().object();return s.endsWith("a")?X(i):i}getSliderCapSpacing(){const{dimensions:{slider:{height:t},thumb:{radius:s}}}=this;return 2*s-t}updateDimensions(t="m"){this.dimensions=l[t]}drawColorField(){const t=this.colorFieldRenderingContext,{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 a=t.createLinearGradient(0,0,0,s);a.addColorStop(0,"rgba(0,0,0,0)"),a.addColorStop(1,"rgba(0,0,0,1)"),t.fillStyle=a,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`,t.getContext("2d").scale(e,e)}updateCanvasSize(t="all"){var s,i,e;const{dimensions:a}=this;"all"!==t&&"color-field"!==t||this.setCanvasContextSize(null===(s=this.colorFieldRenderingContext)||void 0===s?void 0:s.canvas,a.colorField);const o={width:a.slider.width,height:a.slider.height+2*(a.thumb.radius-a.slider.height/2)};"all"!==t&&"hue-slider"!==t||this.setCanvasContextSize(null===(i=this.hueSliderRenderingContext)||void 0===i?void 0:i.canvas,o),"all"!==t&&"opacity-slider"!==t||this.setCanvasContextSize(null===(e=this.opacitySliderRenderingContext)||void 0===e?void 0:e.canvas,o)}drawActiveColorFieldColor(){const{color:t}=this;if(!t)return;const s=t.hsv(),{dimensions:{colorField:{height:i,width:e},thumb:{radius:a}}}=this,o=s.saturationv()/(r.s/e),n=i-s.value()/(r.v/i);requestAnimationFrame((()=>{this.colorFieldScopeLeft=o,this.colorFieldScopeTop=n})),this.drawThumb(this.colorFieldRenderingContext,a,o,n,s,!1)}drawThumb(t,s,i,e,a,o){const n=2*Math.PI;if(t.beginPath(),t.arc(i,e,s,0,n),t.fillStyle="#fff",t.fill(),t.strokeStyle="rgba(0,0,0,0.3)",t.lineWidth=1,t.stroke(),o&&a.alpha()<1){const a=t.createPattern(this.getCheckeredBackgroundPattern(),"repeat");t.beginPath(),t.arc(i,e,s-3,0,n),t.fillStyle=a,t.fill()}t.globalCompositeOperation="source-atop",t.beginPath(),t.arc(i,e,s-3,0,n);const l=o?a.alpha():1;t.fillStyle=a.rgb().alpha(l).string(),t.fill(),t.globalCompositeOperation="source-over"}drawActiveHueSliderColor(){const{color:t}=this;if(!t)return;const s=t.hsv().saturationv(100).value(100),{dimensions:{slider:{width:i},thumb:{radius:e}}}=this,a=s.hue()/(c/i),o=e,n=this.getSliderBoundX(a,i,e);requestAnimationFrame((()=>{this.hueScopeLeft=n})),this.drawThumb(this.hueSliderRenderingContext,e,n,o,s,!1)}drawHueSlider(){const t=this.hueSliderRenderingContext,{dimensions:{slider:{height:s,width:i},thumb:{radius:e}}}=this,o=e-s/2,n=t.createLinearGradient(0,0,i,0),l=["red","yellow","lime","cyan","blue","magenta","#ff0004"],r=1/(l.length-1);let h=0;l.forEach((t=>{n.addColorStop(h,a(t).string()),h+=r})),t.clearRect(0,0,i,s+2*this.getSliderCapSpacing()),this.drawSliderPath(t,s,i,0,o),t.fillStyle=n,t.fill(),t.strokeStyle="rgba(0,0,0,0.3)",t.lineWidth=1,t.stroke(),this.drawActiveHueSliderColor()}drawOpacitySlider(){const t=this.opacitySliderRenderingContext,{baseColorFieldColor:s,dimensions:{slider:{height:i,width:e},thumb:{radius:a}}}=this,o=a-i/2;t.clearRect(0,0,e,i+2*this.getSliderCapSpacing());const n=t.createLinearGradient(0,o,e,0),l=s.rgb().alpha(0),r=s.rgb().alpha(.5),h=s.rgb().alpha(1);n.addColorStop(0,l.string()),n.addColorStop(.5,r.string()),n.addColorStop(1,h.string()),this.drawSliderPath(t,i,e,0,o);const c=t.createPattern(this.getCheckeredBackgroundPattern(),"repeat");t.fillStyle=c,t.fill(),t.fillStyle=n,t.fill(),t.strokeStyle="rgba(0,0,0,0.3)",t.lineWidth=1,t.stroke(),this.drawActiveOpacitySliderColor()}drawSliderPath(t,s,i,e,a){const o=s/2+1;t.beginPath(),t.moveTo(e+o,a),t.lineTo(e+i-o,a),t.quadraticCurveTo(e+i,a,e+i,a+o),t.lineTo(e+i,a+s-o),t.quadraticCurveTo(e+i,a+s,e+i-o,a+s),t.lineTo(e+o,a+s),t.quadraticCurveTo(e,a+s,e,a+s-o),t.lineTo(e,a+o),t.quadraticCurveTo(e,a,e+o,a),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");return 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,t}drawActiveOpacitySliderColor(){const{color:t}=this;if(!t)return;const s=t,{dimensions:{slider:{width:i},thumb:{radius:e}}}=this,a=K(s.alpha())/(h.max/i),o=e,n=this.getSliderBoundX(a,i,e);requestAnimationFrame((()=>{this.opacityScopeLeft=n})),this.drawThumb(this.opacitySliderRenderingContext,e,n,o,s,!0)}getSliderBoundX(t,s,i){const e=j(t,s,i);return 0===e?t:-1===e?D(t,0,s,i,2*i):D(t,0,s,s-2*i,s-i)}updateColorFromChannels(t){this.internalColorSet(a(t,this.channelMode))}updateChannelsFromColor(t){this.channels=t?this.toChannels(t):[null,null,null,null]}toChannels(t){const{channelMode:s}=this,i=t[s]().array().map(((t,s)=>3===s?t:Math.floor(t)));return 3===i.length&&i.push(1),i}getAdjustedScopePosition(t,s){return[t-d/2,s-d/2]}static get delegatesFocus(){return!0}static get assetsDirs(){return["assets"]}get el(){return e(this)}static get watchers(){return{allowEmpty:["handleAllowEmptyOrClearableChange"],clearable:["handleAllowEmptyOrClearableChange"],alphaChannel:["handleAlphaChannelChange","handleFormatOrAlphaChannelChange"],color:["handleColorChange"],format:["handleFormatOrAlphaChannelChange"],scale:["handleScaleChange"],messageOverrides:["onMessagesChange"],value:["handleValueChange"],effectiveLocale:["effectiveLocaleChange"]}}};B.style=':host([disabled]){cursor:default;-webkit-user-select:none;-moz-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}.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:11px}.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)}.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}';export{B as calcite_color_picker}
|
@@ -3,15 +3,15 @@
|
|
3
3
|
* Licensed under the Apache License, Version 2.0
|
4
4
|
* http://www.apache.org/licenses/LICENSE-2.0
|
5
5
|
*/
|
6
|
-
import{r as t,h as i,g as s,c as e,H as a,F as o}from"./p-6d753a3d.js";import{c as n}from"./p-bfd3d428.js";import{c,s as h,a as l}from"./p-a25bbcc1.js";import{a as r}from"./p-67b26725.js";import{c as d,u as
|
6
|
+
import{r as t,h as i,g as s,c as e,H as a,F as o}from"./p-6d753a3d.js";import{c as n}from"./p-bfd3d428.js";import{c,s as h,a as l}from"./p-a25bbcc1.js";import{a as r}from"./p-67b26725.js";import{c as d,u as f,d as b,I as p}from"./p-9db9645e.js";import{c as u,d as m}from"./p-b5bfe190.js";import{c as v,s as y,d as g,u as w}from"./p-2e625f11.js";import{S as k}from"./p-d2b66bd2.js";import{l as x,f as L,g as C}from"./p-896c9644.js";import{a as _,g as S,b as j,d as E}from"./p-583e5dd0.js";import"./p-b85be429.js";import"./p-db50226e.js";import"./p-820d8935.js";import"./p-f50a294b.js";import"./p-82e085d0.js";import"./p-c1cf3ebc.js";
|
7
7
|
/*!
|
8
8
|
* All material copyright ESRI, All Rights Reserved, unless otherwise specified.
|
9
9
|
* See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
|
10
10
|
* v2.8.2
|
11
|
-
*/const
|
11
|
+
*/const I="frame",F="frame--advancing",W="frame--retreating",z=class{constructor(i){t(this,i),this.itemMutationObserver=n("mutation",(()=>this.updateFlowProps())),this.getFlowDirection=(t,i)=>t&&i>1||t>1?i<t?"retreating":"advancing":null,this.updateFlowProps=()=>{const{customItemSelectors:t,el:i,items:s}=this,e=Array.from(i.querySelectorAll("calcite-flow-item"+(t?`,${t}`:""))).filter((t=>t.closest("calcite-flow")===i)),a=s.length,o=e.length,n=e[o-1],c=e[o-2];if(o&&n&&e.forEach((t=>{t.showBackButton=t===n&&o>1,t.hidden=t!==n})),c&&(c.menuOpen=!1),this.items=e,a!==o){const t=this.getFlowDirection(a,o);this.itemCount=o,this.flowDirection=t}},this.customItemSelectors=void 0,this.flowDirection=null,this.itemCount=0,this.items=[]}async back(){const{items:t}=this,i=t[t.length-1];if(!i)return;const s=i.beforeBack?i.beforeBack:()=>Promise.resolve();try{await s.call(i)}catch(t){return}return i.remove(),i}async setFocus(){await c(this);const{items:t}=this,i=t[t.length-1];return null==i?void 0:i.setFocus()}connectedCallback(){var t;null===(t=this.itemMutationObserver)||void 0===t||t.observe(this.el,{childList:!0,subtree:!0}),this.updateFlowProps()}async componentWillLoad(){h(this)}componentDidLoad(){l(this)}disconnectedCallback(){var t;null===(t=this.itemMutationObserver)||void 0===t||t.disconnect()}async handleItemBackClick(t){if(!t.defaultPrevented)return await this.back(),this.setFocus()}render(){const{flowDirection:t}=this;return i("div",{key:"9d405841d7a1ee2d7a5da28c02ef8d5bf08dd9f5",class:{[I]:!0,[F]:"advancing"===t,[W]:"retreating"===t}},i("slot",{key:"a02231a5002f8b19542e03529aad12771787b26f"}))}get el(){return s(this)}};z.style=":host{box-sizing:border-box;background-color:var(--calcite-color-foreground-1);color:var(--calcite-color-text-2);font-size:var(--calcite-font-size--1)}:host *{box-sizing:border-box}:host{position:relative;display:flex;inline-size:100%;flex:1 1 auto;align-items:stretch;overflow:hidden;background-color:transparent}:host .frame{position:relative;margin:0px;display:flex;inline-size:100%;flex:1 1 auto;flex-direction:column;align-items:stretch;padding:0px}:host ::slotted(calcite-flow-item),:host ::slotted(calcite-panel){block-size:100%}:host ::slotted(.calcite-match-height:last-child){display:flex;flex:1 1 auto;overflow:hidden}:host .frame--advancing{animation:calcite-frame-advance var(--calcite-animation-timing)}:host .frame--retreating{animation:calcite-frame-retreat var(--calcite-animation-timing)}@keyframes calcite-frame-advance{0%{--tw-bg-opacity:0.5;transform:translate3d(50px, 0, 0)}100%{--tw-bg-opacity:1;transform:translate3d(0, 0, 0)}}@keyframes calcite-frame-retreat{0%{--tw-bg-opacity:0.5;transform:translate3d(-50px, 0, 0)}100%{--tw-bg-opacity:1;transform:translate3d(0, 0, 0)}}:host([hidden]){display:none}[hidden]{display:none}";
|
12
12
|
/*!
|
13
13
|
* All material copyright ESRI, All Rights Reserved, unless otherwise specified.
|
14
14
|
* See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
|
15
15
|
* v2.8.2
|
16
16
|
*/
|
17
|
-
const F=class{constructor(i){t(this,i),this.calciteFlowItemBack=e(this,"calciteFlowItemBack",7),this.calciteFlowItemScroll=e(this,"calciteFlowItemScroll",6),this.calciteFlowItemClose=e(this,"calciteFlowItemClose",6),this.calciteFlowItemToggle=e(this,"calciteFlowItemToggle",6),this.handlePanelScroll=t=>{t.stopPropagation(),this.calciteFlowItemScroll.emit()},this.handlePanelClose=t=>{t.stopPropagation(),this.calciteFlowItemClose.emit()},this.handlePanelToggle=t=>{t.stopPropagation(),this.collapsed=t.target.collapsed,this.calciteFlowItemToggle.emit()},this.backButtonClick=()=>{this.calciteFlowItemBack.emit()},this.setBackRef=t=>{this.backButtonEl=t},this.setContainerRef=t=>{this.containerEl=t},this.closable=!1,this.closed=!1,this.collapsed=!1,this.collapseDirection="down",this.collapsible=!1,this.beforeBack=void 0,this.description=void 0,this.disabled=!1,this.heading=void 0,this.headingLevel=void 0,this.loading=!1,this.menuOpen=!1,this.messageOverrides=void 0,this.messages=void 0,this.overlayPositioning="absolute",this.showBackButton=!1,this.defaultMessages=void 0,this.effectiveLocale=""}onMessagesChange(){}connectedCallback(){d(this),u(this),v(this)}async componentWillLoad(){await y(this),h(this)}componentDidRender(){b(this)}disconnectedCallback(){f(this),m(this),g(this)}componentDidLoad(){l(this)}effectiveLocaleChange(){w(this,this.effectiveLocale)}async setFocus(){await c(this);const{backButtonEl:t,containerEl:i}=this;return t?t.setFocus():i?i.setFocus():void 0}async scrollContentTo(t){var i;await(null===(i=this.containerEl)||void 0===i?void 0:i.scrollContentTo(t))}renderBackButton(){const{el:t}=this,s="rtl"===r(t),{showBackButton:e,backButtonClick:a,messages:o}=this,n=o.back;return e?i("calcite-action",{"aria-label":n,class:"back-button",icon:s?"chevron-right":"chevron-left",key:"flow-back-button",onClick:a,scale:"s",slot:"header-actions-start",text:n,title:n,ref:this.setBackRef}):null}render(){const{collapsed:t,collapseDirection:s,collapsible:e,closable:o,closed:n,description:c,disabled:h,heading:l,headingLevel:r,loading:d,menuOpen:b,messages:f,overlayPositioning:u}=this;return i(a,{key:"ab926d381ff2493f3fd49a5c8724260211d69ca9"},i(p,{key:"6799b56c2116de5e08739ddc2ec1557bd291f3f8",disabled:h},i("calcite-panel",{key:"2e438b8abf573eabaaa2e966dcca5c4843a53cba",closable:o,closed:n,collapseDirection:s,collapsed:t,collapsible:e,description:c,disabled:h,heading:l,headingLevel:r,loading:d,menuOpen:b,messageOverrides:f,onCalcitePanelClose:this.handlePanelClose,onCalcitePanelScroll:this.handlePanelScroll,onCalcitePanelToggle:this.handlePanelToggle,overlayPositioning:u,ref:this.setContainerRef},this.renderBackButton(),i("slot",{key:"39b650abdf64df16f535d45f64dc1b367acfcc9e",name:"action-bar",slot:k.actionBar}),i("slot",{key:"5b36c56874ad762f842c81f9ffbdcdbd3168cf75",name:"header-actions-start",slot:k.headerActionsStart}),i("slot",{key:"2dbf552425d238a4479a12bbec79571d11124577",name:"header-actions-end",slot:k.headerActionsEnd}),i("slot",{key:"2dd0a30236844c91c2cf10a9fbacbe9935ea234c",name:"header-content",slot:k.headerContent}),i("slot",{key:"1b025f746e2e7d58fb057aab36b24e46872e607e",name:"header-menu-actions",slot:k.headerMenuActions}),i("slot",{key:"5dd5986e93dcc11e0b0fade6822814b160053c70",name:"fab",slot:k.fab}),i("slot",{key:"e7cf2702cd2e423d07a8a8ac57c142bc4738b3ef",name:"footer-actions",slot:k.footerActions}),i("slot",{key:"e2561d89aaebe4fbb82b1f546551d05ebb23b0bf",name:"footer",slot:k.footer}),i("slot",{key:"fb6bf40456038f84486b2858765bb9d147800e84"}))))}static get assetsDirs(){return["assets"]}get el(){return s(this)}static get watchers(){return{messageOverrides:["onMessagesChange"],effectiveLocale:["effectiveLocaleChange"]}}};F.style=":host{box-sizing:border-box;background-color:var(--calcite-color-foreground-1);color:var(--calcite-color-text-2);font-size:var(--calcite-font-size--1)}:host *{box-sizing:border-box}:host([disabled]){cursor:default;-webkit-user-select:none;-moz-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}:host([disabled]) *,:host([disabled]) ::slotted(*){pointer-events:none}:host{position:relative;display:flex;inline-size:100%;flex:1 1 auto;overflow:hidden}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}.interaction-container{display:contents}.back-button{border-width:0px;border-style:solid;border-color:var(--calcite-color-border-3);border-inline-end-width:1px}calcite-panel{--calcite-panel-footer-padding:var(--calcite-flow-item-footer-padding);--calcite-panel-header-border-block-end:var(--calcite-flow-item-header-border-block-end)}:host([hidden]){display:none}[hidden]{display:none}";const O=class{constructor(i){t(this,i),this.success=e(this,"success",7),this.fail=e(this,"fail",7),this.drawComplete=e(this,"drawComplete",7),this.editingAttachment=e(this,"editingAttachment",7),this.progressStatus=e(this,"progressStatus",7),this.mapView=void 0,this.selectedLayerId=void 0,this.customizeSubmit=!1,this.searchConfiguration=void 0,this.showSearchWidget=void 0}async mapViewWatchHandler(){await this.mapView.when((async()=>{await this.init()}))}async close(){this._editor&&this._editor.destroy()}async submit(){this._editor&&this._editor.viewModel.featureFormViewModel.submit()}async componentWillLoad(){await this.initModules()}async componentDidLoad(){await this.init()}render(){const t=this.showSearchWidget?"":"display-none";return i(o,{key:"66e42055c22a93c6d34440b65ac950a388639b9a"},i("div",{key:"fc4bf1fc039e4d914e416a394f0671712d116482",id:"feature-form"}),i("div",{key:"aadd529366b2b85e60fdffc306cf41f37c2a6709",class:`search-widget ${t}`,id:"search-widget-ref"}))}async init(){this.mapView&&this.selectedLayerId&&(await this.createEditorWidget(),await this.createSearchWidget())}async initModules(){const[t,i,s]=await x(["esri/widgets/Editor","esri/core/reactiveUtils","esri/widgets/Search"]);this.Editor=t,this.reactiveUtils=i,this.Search=s}async createEditorWidget(){this._editor&&this._editor.destroy();const t=[],i=document.createElement("div");(await _(this.mapView)).forEach((async i=>{t.push({layer:i,enabled:"feature"===(null==i?void 0:i.type)&&(null==i?void 0:i.id)===this.selectedLayerId,addEnabled:!0,updateEnabled:!1,deleteEnabled:!1})})),this._editor=new this.Editor({allowedWorkflows:"create-features",view:this.mapView,layerInfos:t,visibleElements:{snappingControls:!1},container:i}),this.el.appendChild(i);const s=this.reactiveUtils.watch((()=>this._editor.viewModel.state),(t=>{"adding-attachment"===t||"editing-attachment"===t?(this._addingAttachment=!0,this.editingAttachment.emit(!0)):this._addingAttachment&&(this.editingAttachment.emit(!1),this._addingAttachment=!1)}));this._editor.viewModel.addHandles(s);const e=this.reactiveUtils.watch((()=>this._editor.viewModel.featureTemplatesViewModel.state),(t=>{"ready"===t&&(this.progressStatus.emit(.5),this.startCreate())}));this._editor.viewModel.addHandles(e);const a=this.reactiveUtils.watch((()=>this._editor.viewModel.state),(t=>{"creating-features"===t&&(this.showSearchWidget=!0)}));this._editor.viewModel.addHandles(a)}async startCreate(){var t;if(null===(t=this._editor.viewModel.featureTemplatesViewModel.items)||void 0===t?void 0:t.length){const t=this._editor.viewModel.featureTemplatesViewModel.items[0].get("items");this._editor.viewModel.featureTemplatesViewModel.on("select",(()=>{this.progressStatus.emit(.75),setTimeout((()=>{this._editor.viewModel.featureFormViewModel.on("submit",this.submitted.bind(this)),this._editor.viewModel.sketchViewModel.on("create",(t=>{"complete"===t.state&&(this.showSearchWidget=!1,this.progressStatus.emit(1),this.drawComplete.emit())})),this.hideEditorsElements()}),700),this.hideEditorsElements()})),1===t.length&&this._editor.viewModel.featureTemplatesViewModel.select(t[0]),this.hideEditorsElements()}}async createSearchWidget(){let t={view:this.mapView};if(this.searchConfiguration){const i=this._getSearchConfig(this.searchConfiguration,this.mapView);t=Object.assign({},i)}this._search=new this.Search(t),this._search.container="search-widget-ref",this._search.popupEnabled=!1,this._search.resultGraphicEnabled=!1;const i=await S(this.mapView,this.selectedLayerId);let s=null;this._search.on("search-complete",(t=>{var e;this.mapView.goTo(t.results[0].results[0].extent),"point"===i.geometryType&&(s=null===(e=t.results[0].results[0])||void 0===e?void 0:e.feature.geometry)}));const e=this.reactiveUtils.watch((()=>this._search.viewModel.state),(t=>{"ready"===t&&setTimeout((()=>{this._editor.viewModel.sketchViewModel.createGraphic&&s&&(this._editor.viewModel.sketchViewModel.createGraphic.set("geometry",s),this._editor.viewModel.sketchViewModel.complete(),this.hideEditorsElements())}),100)}));this._search.viewModel.addHandles(e)}_getSearchConfig(t,i){const s=t.sources;return(null==s?void 0:s.length)>0?(t.includeDefaultSources=!1,s.forEach((t=>{var s,e;if(t.hasOwnProperty("layer")){const a=t,o=null===(s=a.layer)||void 0===s?void 0:s.id,n=o?i.map.findLayerById(o):null,c=null===(e=null==a?void 0:a.layer)||void 0===e?void 0:e.url;n?a.layer=n:c&&(a.layer=new this.FeatureLayer(c))}})),null==s||s.forEach((t=>{if(t.hasOwnProperty("locator")){const i=t;"ArcGIS World Geocoding Service"===(null==i?void 0:i.name)&&(i.outFields=i.outFields||["Addr_type","Match_addr","StAddr","City"],i.singleLineFieldName="SingleLine"),i.url=i.url,delete i.url}}))):t=Object.assign(Object.assign({},t),{includeDefaultSources:!0}),t}hideEditorsElements(){this.customizeSubmit&&setTimeout((()=>{var t;null===(t=this.el.querySelector(".esri-editor").querySelectorAll("calcite-flow-item"))||void 0===t||t.forEach((t=>{var i,s,e,a,o;const n=null===(e=null===(s=null===(i=t.shadowRoot)||void 0===i?void 0:i.querySelector("calcite-panel"))||void 0===s?void 0:s.shadowRoot)||void 0===e?void 0:e.querySelector("article");null===(a=null==n?void 0:n.querySelector("header"))||void 0===a||a.setAttribute("style","display: none"),null===(o=null==n?void 0:n.querySelector("footer"))||void 0===o||o.setAttribute("style","display: none")}))}),700)}async submitted(t){var i;if(!t.invalid.length&&t.valid.length){try{await this._editor.activeWorkflow.commit(),(null===(i=this._editor.viewModel.failures)||void 0===i?void 0:i.length)&&this._editor.viewModel.failures.some((t=>{if(t.error)throw t.error}))}catch(t){return void this.fail.emit(t)}this.success.emit()}}get el(){return s(this)}static get watchers(){return{mapView:["mapViewWatchHandler"]}}};O.style=":host{display:block}.esri-editor__panel-toolbar{display:none !important}.esri-editor__update-actions{display:none !important}.esri-editor__panel-content{padding-block:0px !important}.esri-editor .esri-item-list__group__header{display:none !important}.esri-editor__panel-content__section .esri-widget__heading{display:none !important}.esri-editor .esri-item-list__filter-container--sticky{padding-block:0px !important;padding-inline:10px !important}.search-widget{width:92% !important;margin:5px 0 20px 14px}.display-none{display:none !important}";const B=class{constructor(i){t(this,i),this.success=e(this,"success",7),this.fail=e(this,"fail",7),this.isActionPending=e(this,"isActionPending",7),this.mapView=void 0,this.table=void 0,this.selectedFeature=void 0,this.customizeSubmit=!1}async mapViewWatchHandler(){await this.mapView.when((async()=>{await this.init()}))}async close(){this._editor&&this._editor.destroy()}async submit(){this._editor&&this._editor.viewModel.featureFormViewModel.submit()}async componentWillLoad(){await this.initModules()}async init(){this.mapView&&await this.createEditorWidget()}async initModules(){const[t,i]=await x(["esri/widgets/Editor","esri/core/reactiveUtils"]);this.Editor=t,this.reactiveUtils=i}render(){return i(a,{key:"9807b7dcad1f8305756e6098f1e64ef8caffcbac"})}async componentDidLoad(){await this.init()}async createEditorWidget(){this._editor&&this._editor.destroy();const t=document.createElement("div");this._editor=new this.Editor({view:this.mapView,visibleElements:{snappingControls:!1},container:t}),this.el.appendChild(t);const i=this.reactiveUtils.watch((()=>{var t;return null===(t=this._editor.viewModel.featureFormViewModel)||void 0===t?void 0:t.state}),(t=>{"ready"===t&&this.hideEditorsElements()}));this._editor.viewModel.addHandles(i);const s=this.reactiveUtils.watch((()=>this._editor.viewModel.featureTemplatesViewModel.state),(t=>{"ready"===t&&this.startCreate()}));this._editor.viewModel.addHandles(s);const e=this.reactiveUtils.watch((()=>this._editor.viewModel.state),(t=>{"adding-attachment"===t||"editing-attachment"===t?(this._addingAttachment=!0,this.isActionPending.emit(!0)):this._addingAttachment&&(this.isActionPending.emit(!1),this._addingAttachment=!1)}));this._editor.viewModel.addHandles(e)}async startCreate(){const t=this.selectedFeature.layer,i=this.table,s=t.relationships[0],e=i.relationships.find((i=>t.layerId===i.relatedTableId)),a=await t.queryFeatures({objectIds:[this.selectedFeature.getObjectId()],outFields:[t.objectIdField,s.keyField]}),o=i.templates[0],n={attributeOverrides:this.makeAttributesForRelatedFeature(a.features[0],s,e),layer:i,template:o};await this._editor.startCreateFeaturesWorkflowAtFeatureCreation(n),this.isActionPending.emit(!1),this._editor.viewModel.featureFormViewModel.on("submit",this.submitted.bind(this))}hideEditorsElements(){this.customizeSubmit&&setTimeout((()=>{var t;null===(t=this.el.querySelector(".esri-editor").querySelectorAll("calcite-flow-item"))||void 0===t||t.forEach((t=>{var i,s,e,a,o;const n=null===(e=null===(s=null===(i=t.shadowRoot)||void 0===i?void 0:i.querySelector("calcite-panel"))||void 0===s?void 0:s.shadowRoot)||void 0===e?void 0:e.querySelector("article");null===(a=null==n?void 0:n.querySelector("header"))||void 0===a||a.setAttribute("style","display: none"),null===(o=null==n?void 0:n.querySelector("footer"))||void 0===o||o.setAttribute("style","display: none")}))}),700)}makeAttributesForRelatedFeature(t,i,s){const e=t.getAttribute(i.keyField);let a=s.keyField;const o=this.table.fields.find((t=>t.name.toLocaleLowerCase()===a.toLocaleLowerCase()));return a=o.name,{[a]:e}}async submitted(t){var i;if(!t.invalid.length&&t.valid.length){try{await this._editor.activeWorkflow.commit(),(null===(i=this._editor.viewModel.failures)||void 0===i?void 0:i.length)&&this._editor.viewModel.failures.some((t=>{if(t.error)throw t.error}))}catch(t){return void this.fail.emit(t)}this.success.emit()}}get el(){return s(this)}static get watchers(){return{mapView:["mapViewWatchHandler"]}}};B.style=":host{display:block}.esri-editor__panel-toolbar{display:none !important}";const T=class{constructor(i){t(this,i),this.loadingStatus=e(this,"loadingStatus",7),this.featureSelect=e(this,"featureSelect",7),this._validFieldTypes=["small-integer","integer","big-integer","single","long"],this.mapView=void 0,this.graphics=void 0,this.reportingOptions=void 0,this._likeFieldAvailable=!1,this._likeCount=0,this._disLikeCount=0,this._dislikeFieldAvailable=!1,this._commentsAvailable=!1,this._isLikeBtnClicked=!1,this._isDislikeBtnClicked=!1,this._relatedFeaturesOIDs=void 0}async graphicsWatchHandler(){await this.getCompleteGraphic(this.graphics[0]),this.checkLikeDislikeFields(),await this.processComments()}async refresh(t){await this.getCompleteGraphic(t),await this.processComments(),this.isLikeDislikeConfigured(t.layer)?t&&this.graphics.length>1&&this.checkLikeDislikeFields():(this._likeFieldAvailable=!1,this._dislikeFieldAvailable=!1)}async back(){this._infoCard.back()}async next(){this._infoCard.next()}async toggleListView(){this._infoCard.toggleListView()}async componentWillLoad(){await this._initModules(),await this.getCompleteGraphic(this.graphics[0]),this.checkLikeDislikeFields(),await this.processComments()}render(){var t,s,e,a,o;const n=(null===(t=this._relatedFeaturesOIDs)||void 0===t?void 0:t.length)>0?`objectId in(${this._relatedFeaturesOIDs})`:"1=0";return i("calcite-panel",{key:"b8d1cc9d4d9040665be3c892f5738a179ab64eaf","full-height":!0},i("info-card",{key:"a4c7771bdf84f85b88bd6bf2544e2a1a985fdbbe",allowEditing:!1,graphics:this.graphics,highlightEnabled:!1,isLoading:!1,isMobile:!1,mapView:this.mapView,paginationEnabled:!1,position:"relative",ref:t=>this._infoCard=t}),(this._likeFieldAvailable||this._dislikeFieldAvailable||this._commentsAvailable)&&i("div",{key:"2d405f3f722eb4fe0de4212ec4ff3e4b8588db40",class:"buttons-container"},this._commentsAvailable&&i("div",{key:"9454b0cb93e665de20fafb4ca75e1a6d3198a03a",class:"comment-btn"},i("span",{key:"8c682aa73f9c28b9db5266cfb5ad970f15535241"},this._relatedFeaturesOIDs.length),i("calcite-icon",{key:"d920e63f8d1d447afa732bd336f6a09e18ccbd2a",icon:"speech-bubble",scale:"s"})),this._likeFieldAvailable&&i("calcite-button",{key:"6b68adcc0b24b1e8d71148182339fa1b6d7922a1",appearance:"transparent",iconEnd:"thumbs-up",kind:this._isLikeBtnClicked?"brand":"neutral",onClick:this.onLikeButtonClick.bind(this),scale:"s"},null!==(e=null!==(s=this._likeCount)&&void 0!==s?s:this._selectedGraphic.attributes[this._likeField])&&void 0!==e?e:0),this._dislikeFieldAvailable&&i("calcite-button",{key:"7c365fdaf5a3de12745e4a7b7a79dc8ec5e37cc0",appearance:"transparent",iconEnd:"thumbs-down",kind:this._isDislikeBtnClicked?"brand":"neutral",onClick:this.onDislikeButtonClick.bind(this),scale:"s"},null!==(o=null!==(a=this._disLikeCount)&&void 0!==a?a:this._selectedGraphic.attributes[this._dislikeField])&&void 0!==o?o:0)),this.relatedTableId&&this._commentsAvailable&&i("feature-list",{key:"7b2b92b001dcdeb51d7ae1c1b39dc263f5ed1934",class:"height-full",mapView:this.mapView,pageSize:5,ref:t=>this._commentsList=t,selectedLayerId:this.relatedTableId,showInitialLoading:!1,textSize:"small",whereClause:n}))}async _initModules(){const[t,i]=await x(["esri/rest/support/RelationshipQuery","esri/Graphic"]);this.RelationshipQuery=t,this.Graphic=i}async getCompleteGraphic(t){const i=t.layer,s=i.createQuery();s.objectIds=[t.getObjectId()];const e=await i.queryFeatures(s);this._selectedGraphic=e.features[0]}async processComments(){var t;const i=this._selectedGraphic.layer;if(this.reportingOptions[i.id].comment&&(null===(t=i.relationships)||void 0===t?void 0:t.length)>0){const t=i.relationships[0].relatedTableId,s=(await j(this.mapView)).filter((i=>t===i.layerId));if(this.relatedTableId=(null==s?void 0:s.length)>0?s[0].id:"",this.relatedTableId){const t=this._selectedGraphic.attributes[i.objectIdField],s=new this.RelationshipQuery({objectIds:[t],outFields:["*"],relationshipId:i.relationships[0].id}),e=await i.queryRelatedFeatures(s).catch((t=>{console.error(t)})),a=[];e[t]&&e[t].features.forEach((t=>{a.push(t.attributes.OBJECTID)})),this._relatedFeaturesOIDs=a,this._commentsAvailable=!0}else this._relatedFeaturesOIDs=[],this._commentsAvailable=!1}else this._relatedFeaturesOIDs=[],this._commentsAvailable=!1,this.relatedTableId=""}isLikeDislikeConfigured(t){let i=!1,s=!1;if(this.reportingOptions&&this.reportingOptions[t.id]){if(!this.reportingOptions[t.id].like&&!this.reportingOptions[t.id].dislike)return!1;const e=this.reportingOptions[t.id].likeField,a=this.reportingOptions[t.id].dislikeField;if(!e&&!a)return!1;t.fields.forEach((o=>{this._validFieldTypes.indexOf(o.type)>-1&&(o.name===e&&this.reportingOptions[t.id].like?i=!0:o.name===a&&this.reportingOptions[t.id].dislike&&(s=!0))}))}return i||s}checkLikeDislikeFields(){this._likeFieldAvailable=!1,this._dislikeFieldAvailable=!1,this._isLikeBtnClicked=!1,this._isDislikeBtnClicked=!1,this._likeCount=0,this._disLikeCount=0;const t=this._selectedGraphic.layer;if(this.reportingOptions&&this.reportingOptions[t.id]){if(this._likeField=this.reportingOptions[t.id].likeField,this._dislikeField=this.reportingOptions[t.id].dislikeField,!this._likeField&&!this._dislikeField)return;t.fields.forEach((t=>{this._validFieldTypes.indexOf(t.type)>-1&&(t.name===this._likeField&&this.reportingOptions[this._selectedGraphic.layer.id].like?(this._likeFieldAvailable=!0,this._likeCount=this._selectedGraphic.attributes[t.name]):t.name===this._dislikeField&&this.reportingOptions[this._selectedGraphic.layer.id].dislike&&(this._dislikeFieldAvailable=!0,this._disLikeCount=this._selectedGraphic.attributes[t.name]))})),this.getFromLocalStorage()}}onLikeButtonClick(){this.loadingStatus.emit(!0),this._isDislikeBtnClicked&&this.reportingOptions[this._selectedGraphic.layer.id].dislike&&this.onDislikeButtonClick(),this._isLikeBtnClicked=!this._isLikeBtnClicked,this._isLikeBtnClicked?this._likeCount++:this._likeCount--,this.updateFeaturesLikeDislikeField(this._likeField,this._isLikeBtnClicked)}onDislikeButtonClick(){this.loadingStatus.emit(!0),this._isLikeBtnClicked&&this.reportingOptions[this._selectedGraphic.layer.id].like&&this.onLikeButtonClick(),this._isDislikeBtnClicked=!this._isDislikeBtnClicked,this._isDislikeBtnClicked?this._disLikeCount++:this._disLikeCount--,this.updateFeaturesLikeDislikeField(this._dislikeField,this._isDislikeBtnClicked)}async updateFeaturesLikeDislikeField(t,i){const s={},e=this._selectedGraphic.layer,a=this._selectedGraphic;a.attributes[t]=i?Number(a.attributes[t])+1:Number(a.attributes[t])-1,s[e.objectIdField]=a.attributes[e.objectIdField],s[t]=a.attributes[t];const o=new this.Graphic;o.attributes=s;const n={updateFeatures:[o]};await e.applyEdits(n).then((()=>{this._selectedGraphic=a,this._infoCard&&this._infoCard.updateCurrentGraphic(this._selectedGraphic),this.setInLocalStorage(),this.loadingStatus.emit(!1)}),(t=>{this.loadingStatus.emit(!1),console.log(t)}))}getFromLocalStorage(){const t=localStorage[this._selectedGraphic.layer.id];if(t){const i=JSON.parse(t).filter((t=>t.id===this._selectedGraphic.getObjectId()));i.length>0&&(this._isLikeBtnClicked=i[0].like,this._isDislikeBtnClicked=i[0].dislike)}}setInLocalStorage(){const t=this._selectedGraphic.layer.id,i=localStorage[t];let s=[];if(i){s=JSON.parse(i);const t=s.findIndex((t=>t.id===this._selectedGraphic.getObjectId()));t>=0&&s.splice(t,1)}s.push({id:this._selectedGraphic.getObjectId(),like:this._isLikeBtnClicked&&0!==this._likeCount,dislike:this._isDislikeBtnClicked&&0!==this._disLikeCount}),localStorage.setItem(t,JSON.stringify(s))}get el(){return s(this)}static get watchers(){return{graphics:["graphicsWatchHandler"]}}};T.style=":host{display:block}.buttons-container{align-items:center;display:flex;padding:10px;color:var(--calcite-color-text-1) !important;background-color:var(--calcite-color-foreground-1) !important;border-block-start:1px solid var(--calcite-color-border-3);border-block-end:1px solid var(--calcite-color-border-3)}.comment-btn{display:flex;gap:5px;font-size:var(--calcite-font-size--2);align-items:center;padding:0 0.5rem}";const N=class{constructor(i){t(this,i),this.layerSelect=e(this,"layerSelect",7),this.layersListLoaded=e(this,"layersListLoaded",7),this.mapView=void 0,this.layers=void 0,this.showFeatureCount=!0,this.showNextIcon=!1,this._noLayersToDisplay=!1,this._mapLayerIds=[],this._isLoading=!1,this._translations=void 0}async refresh(){await this.setLayers()}async componentWillLoad(){await this._getTranslations(),this._isLoading=!0}async componentDidLoad(){await this.setLayers(),this._isLoading=!1}render(){return i(o,{key:"c73bf36c13fed8120273d8a5321dd60fe4d4b5f4"},this._isLoading&&i("calcite-loader",{key:"e748d9cc7d1855d3a2da34702ba853d35d1a2cde",label:"",scale:"m"}),!this._isLoading&&this.mapView&&this._noLayersToDisplay&&i("calcite-notice",{key:"4a06b7694fd91456ee5cdc51d33e4ac633d416b2",class:"error-msg",icon:"layers-reference",kind:"danger",open:!0},i("div",{key:"63b09f02312aba71826957c5b2c04a7750bdfca1",slot:"title"},this._translations.error),i("div",{key:"5a19dfe527a6c66a5477a4c6a14f4686cde73bb3",slot:"message"},this._translations.noLayerToDisplayErrorMsg)),!this._isLoading&&this.mapView&&i("calcite-list",{key:"e8a6170a55f4ba6ea35a1397690c3e365b814886","selection-appearance":"border","selection-mode":"none"},this.renderLayerList()))}async setLayers(){this.mapView&&await this.initLayerHash()}async initLayerHash(){const t=[];this._layerItemsHash=await I(this.mapView,!0),(await _(this.mapView)).forEach((async i=>{var s,e;if("feature"===(null==i?void 0:i.type)&&(null==i?void 0:i.editingEnabled)&&(null===(e=null===(s=null==i?void 0:i.capabilities)||void 0===s?void 0:s.operations)||void 0===e?void 0:e.supportsAdd)&&(this._layerItemsHash[i.id].supportsAdd=!0,this.showFeatureCount)){const s=i.createQuery(),e=i.queryFeatureCount(s);t.push(e),e.then((async t=>{const s=isNaN(t)?"":await L(t,{places:0,api:4,type:"decimal"});this._layerItemsHash[i.id].formattedFeatureCount=s}))}})),await Promise.all(t).then((()=>{const t=this.getLayersToBeShownInList(this._layerItemsHash);this._mapLayerIds=t.reverse(),this.handleNoLayersToDisplay()}),(()=>{this._mapLayerIds=[],this.handleNoLayersToDisplay()}))}handleNoLayersToDisplay(){this._noLayersToDisplay=!(this._mapLayerIds.length>0),this.layersListLoaded.emit(this._mapLayerIds)}getLayersToBeShownInList(t){var i;const s=(null===(i=this.layers)||void 0===i?void 0:i.length)>0?this.layers:[];return Object.keys(t).reduce(((t,i)=>{let e=!0;return(null==s?void 0:s.length)>0&&(e=s.indexOf(i)>-1),e&&t.push(i),t}),[])}renderLayerList(){return this._mapLayerIds.length>0&&this._mapLayerIds.reduce(((t,i)=>(this._layerItemsHash[i]&&t.push(this.getLayerListItem(i)),t)),[])}getLayerListItem(t){const s=this._layerItemsHash[t].formattedFeatureCount;return i("calcite-list-item",{onCalciteListItemSelect:()=>{this.onLayerItemSelected(t)}},i("div",{class:"layer-name",slot:"content-start"},this._layerItemsHash[t].name),this.showFeatureCount&&void 0!==s&&""!==s&&i("div",{class:this.showNextIcon?"":"feature-count",slot:"content-end"},"("+s+")"),this.showNextIcon&&i("calcite-icon",{flipRtl:!0,icon:"chevron-right",scale:"s",slot:"content-end"}))}onLayerItemSelected(t){this.layerSelect.emit({layerId:t,layerName:this._layerItemsHash[t].name})}async _getTranslations(){const t=await C(this.el);this._translations=t[0]}get el(){return s(this)}};N.style=":host{display:block}.error-msg{padding:10px}.layer-name{font-weight:500;padding:10px 12px}.feature-count{padding-right:12px}";export{D as calcite_flow,F as calcite_flow_item,O as create_feature,B as create_related_feature,T as feature_details,N as layer_list}
|
17
|
+
const D=class{constructor(i){t(this,i),this.calciteFlowItemBack=e(this,"calciteFlowItemBack",7),this.calciteFlowItemScroll=e(this,"calciteFlowItemScroll",6),this.calciteFlowItemClose=e(this,"calciteFlowItemClose",6),this.calciteFlowItemToggle=e(this,"calciteFlowItemToggle",6),this.handlePanelScroll=t=>{t.stopPropagation(),this.calciteFlowItemScroll.emit()},this.handlePanelClose=t=>{t.stopPropagation(),this.calciteFlowItemClose.emit()},this.handlePanelToggle=t=>{t.stopPropagation(),this.collapsed=t.target.collapsed,this.calciteFlowItemToggle.emit()},this.backButtonClick=()=>{this.calciteFlowItemBack.emit()},this.setBackRef=t=>{this.backButtonEl=t},this.setContainerRef=t=>{this.containerEl=t},this.closable=!1,this.closed=!1,this.collapsed=!1,this.collapseDirection="down",this.collapsible=!1,this.beforeBack=void 0,this.description=void 0,this.disabled=!1,this.heading=void 0,this.headingLevel=void 0,this.loading=!1,this.menuOpen=!1,this.messageOverrides=void 0,this.messages=void 0,this.overlayPositioning="absolute",this.showBackButton=!1,this.defaultMessages=void 0,this.effectiveLocale=""}onMessagesChange(){}connectedCallback(){d(this),u(this),v(this)}async componentWillLoad(){await y(this),h(this)}componentDidRender(){f(this)}disconnectedCallback(){b(this),m(this),g(this)}componentDidLoad(){l(this)}effectiveLocaleChange(){w(this,this.effectiveLocale)}async setFocus(){await c(this);const{backButtonEl:t,containerEl:i}=this;return t?t.setFocus():i?i.setFocus():void 0}async scrollContentTo(t){var i;await(null===(i=this.containerEl)||void 0===i?void 0:i.scrollContentTo(t))}renderBackButton(){const{el:t}=this,s="rtl"===r(t),{showBackButton:e,backButtonClick:a,messages:o}=this,n=o.back;return e?i("calcite-action",{"aria-label":n,class:"back-button",icon:s?"chevron-right":"chevron-left",key:"flow-back-button",onClick:a,scale:"s",slot:"header-actions-start",text:n,title:n,ref:this.setBackRef}):null}render(){const{collapsed:t,collapseDirection:s,collapsible:e,closable:o,closed:n,description:c,disabled:h,heading:l,headingLevel:r,loading:d,menuOpen:f,messages:b,overlayPositioning:u}=this;return i(a,{key:"ab926d381ff2493f3fd49a5c8724260211d69ca9"},i(p,{key:"6799b56c2116de5e08739ddc2ec1557bd291f3f8",disabled:h},i("calcite-panel",{key:"2e438b8abf573eabaaa2e966dcca5c4843a53cba",closable:o,closed:n,collapseDirection:s,collapsed:t,collapsible:e,description:c,disabled:h,heading:l,headingLevel:r,loading:d,menuOpen:f,messageOverrides:b,onCalcitePanelClose:this.handlePanelClose,onCalcitePanelScroll:this.handlePanelScroll,onCalcitePanelToggle:this.handlePanelToggle,overlayPositioning:u,ref:this.setContainerRef},this.renderBackButton(),i("slot",{key:"39b650abdf64df16f535d45f64dc1b367acfcc9e",name:"action-bar",slot:k.actionBar}),i("slot",{key:"5b36c56874ad762f842c81f9ffbdcdbd3168cf75",name:"header-actions-start",slot:k.headerActionsStart}),i("slot",{key:"2dbf552425d238a4479a12bbec79571d11124577",name:"header-actions-end",slot:k.headerActionsEnd}),i("slot",{key:"2dd0a30236844c91c2cf10a9fbacbe9935ea234c",name:"header-content",slot:k.headerContent}),i("slot",{key:"1b025f746e2e7d58fb057aab36b24e46872e607e",name:"header-menu-actions",slot:k.headerMenuActions}),i("slot",{key:"5dd5986e93dcc11e0b0fade6822814b160053c70",name:"fab",slot:k.fab}),i("slot",{key:"e7cf2702cd2e423d07a8a8ac57c142bc4738b3ef",name:"footer-actions",slot:k.footerActions}),i("slot",{key:"e2561d89aaebe4fbb82b1f546551d05ebb23b0bf",name:"footer",slot:k.footer}),i("slot",{key:"fb6bf40456038f84486b2858765bb9d147800e84"}))))}static get assetsDirs(){return["assets"]}get el(){return s(this)}static get watchers(){return{messageOverrides:["onMessagesChange"],effectiveLocale:["effectiveLocaleChange"]}}};D.style=":host{box-sizing:border-box;background-color:var(--calcite-color-foreground-1);color:var(--calcite-color-text-2);font-size:var(--calcite-font-size--1)}:host *{box-sizing:border-box}:host([disabled]){cursor:default;-webkit-user-select:none;-moz-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}:host([disabled]) *,:host([disabled]) ::slotted(*){pointer-events:none}:host{position:relative;display:flex;inline-size:100%;flex:1 1 auto;overflow:hidden}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}.interaction-container{display:contents}.back-button{border-width:0px;border-style:solid;border-color:var(--calcite-color-border-3);border-inline-end-width:1px}calcite-panel{--calcite-panel-footer-padding:var(--calcite-flow-item-footer-padding);--calcite-panel-header-border-block-end:var(--calcite-flow-item-header-border-block-end)}:host([hidden]){display:none}[hidden]{display:none}";const O=class{constructor(i){t(this,i),this.success=e(this,"success",7),this.fail=e(this,"fail",7),this.drawComplete=e(this,"drawComplete",7),this.editingAttachment=e(this,"editingAttachment",7),this.progressStatus=e(this,"progressStatus",7),this.mapView=void 0,this.selectedLayerId=void 0,this.customizeSubmit=!1,this.searchConfiguration=void 0,this.showSearchWidget=void 0}async mapViewWatchHandler(){await this.mapView.when((async()=>{await this.init()}))}async close(){this._editor&&this._editor.destroy()}async submit(){this._editor&&this._editor.viewModel.featureFormViewModel.submit()}async componentWillLoad(){await this.initModules()}async componentDidLoad(){await this.init()}render(){const t=this.showSearchWidget?"":"display-none";return i(o,{key:"e1427c13c0385279fcb0f122b50b891eac419ec4"},i("div",{key:"039e8d8ff5792765c73cb23df37f37bacc0c9dda",id:"feature-form"}),i("div",{key:"94601056ec69000009f4b71b34a38cea28635d99",class:`search-widget ${t}`,id:"search-widget-ref"}))}async init(){this.mapView&&this.selectedLayerId&&(await this.createEditorWidget(),await this.createSearchWidget())}async initModules(){const[t,i,s]=await x(["esri/widgets/Editor","esri/core/reactiveUtils","esri/widgets/Search"]);this.Editor=t,this.reactiveUtils=i,this.Search=s}async createEditorWidget(){this._editor&&this._editor.destroy();const t=[],i=document.createElement("div");(await _(this.mapView)).forEach((async i=>{t.push({layer:i,enabled:"feature"===(null==i?void 0:i.type)&&(null==i?void 0:i.id)===this.selectedLayerId,addEnabled:!0,updateEnabled:!1,deleteEnabled:!1})})),this._editor=new this.Editor({allowedWorkflows:"create-features",view:this.mapView,layerInfos:t,visibleElements:{snappingControls:!1},container:i}),this.el.appendChild(i);const s=this.reactiveUtils.watch((()=>this._editor.viewModel.state),(t=>{"adding-attachment"===t||"editing-attachment"===t?(this._addingAttachment=!0,this.editingAttachment.emit(!0)):this._addingAttachment&&(this.editingAttachment.emit(!1),this._addingAttachment=!1)}));this._editor.viewModel.addHandles(s);const e=this.reactiveUtils.watch((()=>this._editor.viewModel.featureTemplatesViewModel.state),(t=>{"ready"===t&&(this.progressStatus.emit(.5),this.startCreate())}));this._editor.viewModel.addHandles(e);const a=this.reactiveUtils.watch((()=>this._editor.viewModel.state),(t=>{"creating-features"===t&&(this.showSearchWidget=!0)}));this._editor.viewModel.addHandles(a)}async startCreate(){var t;if(null===(t=this._editor.viewModel.featureTemplatesViewModel.items)||void 0===t?void 0:t.length){const t=this._editor.viewModel.featureTemplatesViewModel.items[0].get("items");this._editor.viewModel.featureTemplatesViewModel.on("select",(()=>{this.progressStatus.emit(.75),setTimeout((()=>{this._editor.viewModel.featureFormViewModel.on("submit",this.submitted.bind(this)),this._editor.viewModel.sketchViewModel.on("create",(t=>{"complete"===t.state&&(this.showSearchWidget=!1,this.progressStatus.emit(1),this.drawComplete.emit())})),this.hideEditorsElements()}),700),this.hideEditorsElements()})),1===t.length&&this._editor.viewModel.featureTemplatesViewModel.select(t[0]),this.hideEditorsElements()}}async createSearchWidget(){let t={view:this.mapView};if(this.searchConfiguration){const i=this._getSearchConfig(this.searchConfiguration,this.mapView);t=Object.assign({},i)}this._search=new this.Search(t),this._search.container="search-widget-ref",this._search.popupEnabled=!1,this._search.resultGraphicEnabled=!1;const i=await S(this.mapView,this.selectedLayerId);let s=null;this._search.on("search-complete",(t=>{var e;this.mapView.goTo(t.results[0].results[0].extent),"point"===i.geometryType&&(s=null===(e=t.results[0].results[0])||void 0===e?void 0:e.feature.geometry)}));const e=this.reactiveUtils.watch((()=>this._search.viewModel.state),(t=>{"ready"===t&&setTimeout((()=>{this._editor.viewModel.sketchViewModel.createGraphic&&s&&(this._editor.viewModel.sketchViewModel.createGraphic.set("geometry",s),this._editor.viewModel.sketchViewModel.complete(),this.hideEditorsElements())}),100)}));this._search.viewModel.addHandles(e)}_getSearchConfig(t,i){const s=t.sources;return(null==s?void 0:s.length)>0?(t.includeDefaultSources=!1,s.forEach((t=>{var s,e;if(t.hasOwnProperty("layer")){const a=t,o=null===(s=a.layer)||void 0===s?void 0:s.id,n=o?i.map.findLayerById(o):null,c=null===(e=null==a?void 0:a.layer)||void 0===e?void 0:e.url;n?a.layer=n:c&&(a.layer=new this.FeatureLayer(c))}})),null==s||s.forEach((t=>{if(t.hasOwnProperty("locator")){const i=t;"ArcGIS World Geocoding Service"===(null==i?void 0:i.name)&&(i.outFields=i.outFields||["Addr_type","Match_addr","StAddr","City"],i.singleLineFieldName="SingleLine"),i.url=i.url,delete i.url}}))):t=Object.assign(Object.assign({},t),{includeDefaultSources:!0}),t}hideEditorsElements(){this.customizeSubmit&&setTimeout((()=>{var t;null===(t=this.el.querySelector(".esri-editor").querySelectorAll("calcite-flow-item"))||void 0===t||t.forEach((t=>{var i,s,e,a,o;const n=null===(e=null===(s=null===(i=t.shadowRoot)||void 0===i?void 0:i.querySelector("calcite-panel"))||void 0===s?void 0:s.shadowRoot)||void 0===e?void 0:e.querySelector("article");null===(a=null==n?void 0:n.querySelector("header"))||void 0===a||a.setAttribute("style","display: none"),null===(o=null==n?void 0:n.querySelector("footer"))||void 0===o||o.setAttribute("style","display: none")}))}),700)}async submitted(t){var i;if(!t.invalid.length&&t.valid.length){try{await this._editor.activeWorkflow.commit(),(null===(i=this._editor.viewModel.failures)||void 0===i?void 0:i.length)&&this._editor.viewModel.failures.some((t=>{if(t.error)throw t.error}))}catch(t){return void this.fail.emit(t)}this.success.emit()}}get el(){return s(this)}static get watchers(){return{mapView:["mapViewWatchHandler"]}}};O.style=":host{display:block}.esri-editor__panel-toolbar{display:none !important}.esri-editor__update-actions{display:none !important}.esri-editor__panel-content{padding-block:0px !important}.esri-editor .esri-item-list__group__header{display:none !important}.esri-editor__panel-content__section .esri-widget__heading{display:none !important}.esri-editor .esri-item-list__filter-container--sticky{padding-block:0px !important;padding-inline:10px !important}.search-widget{width:92% !important;margin:5px 0 20px 14px}.display-none{display:none !important}";const B=class{constructor(i){t(this,i),this.success=e(this,"success",7),this.fail=e(this,"fail",7),this.isActionPending=e(this,"isActionPending",7),this.mapView=void 0,this.table=void 0,this.selectedFeature=void 0,this.customizeSubmit=!1}async mapViewWatchHandler(){await this.mapView.when((async()=>{await this.init()}))}async close(){this._editor&&this._editor.destroy()}async submit(){this._editor&&this._editor.viewModel.featureFormViewModel.submit()}async componentWillLoad(){await this.initModules()}async init(){this.mapView&&await this.createEditorWidget()}async initModules(){const[t,i]=await x(["esri/widgets/Editor","esri/core/reactiveUtils"]);this.Editor=t,this.reactiveUtils=i}render(){return i(a,{key:"579af77dcac88043b178e711e0b47d7982c1c87f"})}async componentDidLoad(){await this.init()}async createEditorWidget(){this._editor&&this._editor.destroy();const t=document.createElement("div");this._editor=new this.Editor({view:this.mapView,visibleElements:{snappingControls:!1},container:t}),this.el.appendChild(t);const i=this.reactiveUtils.watch((()=>{var t;return null===(t=this._editor.viewModel.featureFormViewModel)||void 0===t?void 0:t.state}),(t=>{"ready"===t&&this.hideEditorsElements()}));this._editor.viewModel.addHandles(i);const s=this.reactiveUtils.watch((()=>this._editor.viewModel.featureTemplatesViewModel.state),(t=>{"ready"===t&&this.startCreate()}));this._editor.viewModel.addHandles(s);const e=this.reactiveUtils.watch((()=>this._editor.viewModel.state),(t=>{"adding-attachment"===t||"editing-attachment"===t?(this._addingAttachment=!0,this.isActionPending.emit(!0)):this._addingAttachment&&(this.isActionPending.emit(!1),this._addingAttachment=!1)}));this._editor.viewModel.addHandles(e)}async startCreate(){const t=this.selectedFeature.layer,i=this.table,s=t.relationships[0],e=i.relationships.find((i=>t.layerId===i.relatedTableId)),a=await t.queryFeatures({objectIds:[this.selectedFeature.getObjectId()],outFields:[t.objectIdField,s.keyField]}),o=i.templates[0],n={attributeOverrides:this.makeAttributesForRelatedFeature(a.features[0],s,e),layer:i,template:o};await this._editor.startCreateFeaturesWorkflowAtFeatureCreation(n),this.isActionPending.emit(!1),this._editor.viewModel.featureFormViewModel.on("submit",this.submitted.bind(this))}hideEditorsElements(){this.customizeSubmit&&setTimeout((()=>{var t;null===(t=this.el.querySelector(".esri-editor").querySelectorAll("calcite-flow-item"))||void 0===t||t.forEach((t=>{var i,s,e,a,o;const n=null===(e=null===(s=null===(i=t.shadowRoot)||void 0===i?void 0:i.querySelector("calcite-panel"))||void 0===s?void 0:s.shadowRoot)||void 0===e?void 0:e.querySelector("article");null===(a=null==n?void 0:n.querySelector("header"))||void 0===a||a.setAttribute("style","display: none"),null===(o=null==n?void 0:n.querySelector("footer"))||void 0===o||o.setAttribute("style","display: none")}))}),700)}makeAttributesForRelatedFeature(t,i,s){const e=t.getAttribute(i.keyField);let a=s.keyField;const o=this.table.fields.find((t=>t.name.toLocaleLowerCase()===a.toLocaleLowerCase()));return a=o.name,{[a]:e}}async submitted(t){var i;if(!t.invalid.length&&t.valid.length){try{await this._editor.activeWorkflow.commit(),(null===(i=this._editor.viewModel.failures)||void 0===i?void 0:i.length)&&this._editor.viewModel.failures.some((t=>{if(t.error)throw t.error}))}catch(t){return void this.fail.emit(t)}this.success.emit()}}get el(){return s(this)}static get watchers(){return{mapView:["mapViewWatchHandler"]}}};B.style=":host{display:block}.esri-editor__panel-toolbar{display:none !important}";const N=class{constructor(i){t(this,i),this.loadingStatus=e(this,"loadingStatus",7),this.commentSelect=e(this,"commentSelect",7),this.featureSelectionChange=e(this,"featureSelectionChange",7),this._validFieldTypes=["small-integer","integer","big-integer","single","long"],this.mapView=void 0,this.graphics=void 0,this.reportingOptions=void 0,this.layerItemsHash=void 0,this._likeFieldAvailable=!1,this._likeCount=0,this._disLikeCount=0,this._dislikeFieldAvailable=!1,this._commentsAvailable=!1,this._isLikeBtnClicked=!1,this._isDislikeBtnClicked=!1,this._relatedFeaturesOIDs=void 0}async graphicsWatchHandler(){await this.getCompleteGraphic(this.graphics[0]),this.checkLikeDislikeFields(),await this.processComments()}async refresh(t){await this.getCompleteGraphic(t),await this.processComments(),this.isLikeDislikeConfigured(t.layer)?t&&this.graphics.length>1&&this.checkLikeDislikeFields():(this._likeFieldAvailable=!1,this._dislikeFieldAvailable=!1)}async back(){this._infoCard.back()}async next(){this._infoCard.next()}async toggleListView(){this._infoCard.toggleListView()}async componentWillLoad(){await this._initModules(),await this.getCompleteGraphic(this.graphics[0]),this.checkLikeDislikeFields(),await this.processComments()}render(){var t,s,e,a,o;const n=(null===(t=this._relatedFeaturesOIDs)||void 0===t?void 0:t.length)>0?`objectId in(${this._relatedFeaturesOIDs})`:"1=0";return i("calcite-panel",{key:"f8d1d282a6ebdb4d5a64efd96d88329d375b7fe1","full-height":!0},i("info-card",{key:"3cfca85af149ab445973510ff1a9f94e22c5c833",allowEditing:!1,graphics:this.graphics,highlightEnabled:!1,isLoading:!1,isMobile:!1,mapView:this.mapView,onSelectionChanged:t=>{this.featureSelectionChange.emit(t.detail)},paginationEnabled:!1,position:"relative",ref:t=>this._infoCard=t}),(this._likeFieldAvailable||this._dislikeFieldAvailable||this._commentsAvailable)&&i("div",{key:"a3242d417cef788f0f677bf21c65fb9aaa44f8b2",class:"buttons-container"},this._commentsAvailable&&i("div",{key:"9dcfccc0a48b719d14cb08737d654000a27e21cc",class:"comment-btn"},i("span",{key:"b68cafd0cebfa91c12f32f648ec2f71a51e3b9da"},this._relatedFeaturesOIDs.length),i("calcite-icon",{key:"f2b9c34ac64a5cb7692f80cd73658f077525eee4",icon:"speech-bubble",scale:"s"})),this._likeFieldAvailable&&i("calcite-button",{key:"7a4ec79205b3eccceb7d43de2c227d8407c24a26",appearance:"transparent",iconEnd:"thumbs-up",kind:this._isLikeBtnClicked?"brand":"neutral",onClick:this.onLikeButtonClick.bind(this),scale:"s"},null!==(e=null!==(s=this._likeCount)&&void 0!==s?s:this._selectedGraphic.attributes[this._likeField])&&void 0!==e?e:0),this._dislikeFieldAvailable&&i("calcite-button",{key:"4634f8aeb114f97c9ceaae8eac5da86afa89f217",appearance:"transparent",iconEnd:"thumbs-down",kind:this._isDislikeBtnClicked?"brand":"neutral",onClick:this.onDislikeButtonClick.bind(this),scale:"s"},null!==(o=null!==(a=this._disLikeCount)&&void 0!==a?a:this._selectedGraphic.attributes[this._dislikeField])&&void 0!==o?o:0)),this.relatedTableId&&this._commentsAvailable&&i("feature-list",{key:"30559c6f28a741264972677cef1f182f1012f73f",class:"height-full",mapView:this.mapView,onFeatureSelect:t=>{this.commentSelect.emit(t.detail)},pageSize:5,ref:t=>this._commentsList=t,selectedLayerId:this.relatedTableId,showErrorWhenNoFeatures:!1,showInitialLoading:!1,textSize:"small",whereClause:n}))}async _initModules(){const[t,i]=await x(["esri/rest/support/RelationshipQuery","esri/Graphic"]);this.RelationshipQuery=t,this.Graphic=i}async getCompleteGraphic(t){const i=t.layer,s=i.createQuery();s.objectIds=[t.getObjectId()];const e=await i.queryFeatures(s);this._selectedGraphic=e.features[0]}async processComments(){var t;const i=this._selectedGraphic.layer;if(this.reportingOptions&&this.reportingOptions[i.id]&&this.reportingOptions[i.id].comment&&(null===(t=i.relationships)||void 0===t?void 0:t.length)>0){const t=i.relationships[0].relatedTableId,s=(await j(this.mapView)).filter((i=>t===i.layerId));if(this.relatedTableId=(null==s?void 0:s.length)>0?s[0].id:"",this.relatedTableId){const t=this._selectedGraphic.attributes[i.objectIdField],s=new this.RelationshipQuery({objectIds:[t],outFields:["*"],relationshipId:i.relationships[0].id}),e=await i.queryRelatedFeatures(s).catch((t=>{console.error(t)})),a=[];e[t]&&e[t].features.forEach((t=>{a.push(t.attributes.OBJECTID)})),this._relatedFeaturesOIDs=a,this._commentsAvailable=!0}else this._relatedFeaturesOIDs=[],this._commentsAvailable=!1}else this._relatedFeaturesOIDs=[],this._commentsAvailable=!1,this.relatedTableId=""}isLikeDislikeConfigured(t){let i=!1,s=!1;if(this.reportingOptions&&this.reportingOptions[t.id]){if(!this.reportingOptions[t.id].like&&!this.reportingOptions[t.id].dislike)return!1;const e=this.reportingOptions[t.id].likeField,a=this.reportingOptions[t.id].dislikeField;if(!e&&!a)return!1;t.fields.forEach((o=>{this._validFieldTypes.indexOf(o.type)>-1&&this.layerItemsHash[t.id].supportsUpdate&&(o.name===e&&this.reportingOptions[t.id].like?i=!0:o.name===a&&this.reportingOptions[t.id].dislike&&(s=!0))}))}return i||s}checkLikeDislikeFields(){this._likeFieldAvailable=!1,this._dislikeFieldAvailable=!1,this._isLikeBtnClicked=!1,this._isDislikeBtnClicked=!1,this._likeCount=0,this._disLikeCount=0;const t=this._selectedGraphic.layer;if(this.reportingOptions&&this.reportingOptions[t.id]){if(this._likeField=this.reportingOptions[t.id].likeField,this._dislikeField=this.reportingOptions[t.id].dislikeField,!this._likeField&&!this._dislikeField)return;t.fields.forEach((i=>{this._validFieldTypes.indexOf(i.type)>-1&&this.layerItemsHash[t.id].supportsUpdate&&(i.name===this._likeField&&this.reportingOptions[t.id].like?(this._likeFieldAvailable=!0,this._likeCount=this._selectedGraphic.attributes[i.name]):i.name===this._dislikeField&&this.reportingOptions[t.id].dislike&&(this._dislikeFieldAvailable=!0,this._disLikeCount=this._selectedGraphic.attributes[i.name]))})),this.getFromLocalStorage()}}onLikeButtonClick(){this.loadingStatus.emit(!0),this._isDislikeBtnClicked&&this.reportingOptions[this._selectedGraphic.layer.id].dislike&&this.onDislikeButtonClick(),this._isLikeBtnClicked=!this._isLikeBtnClicked,this._isLikeBtnClicked?this._likeCount++:this._likeCount--,this.updateFeaturesLikeDislikeField(this._likeField,this._isLikeBtnClicked)}onDislikeButtonClick(){this.loadingStatus.emit(!0),this._isLikeBtnClicked&&this.reportingOptions[this._selectedGraphic.layer.id].like&&this.onLikeButtonClick(),this._isDislikeBtnClicked=!this._isDislikeBtnClicked,this._isDislikeBtnClicked?this._disLikeCount++:this._disLikeCount--,this.updateFeaturesLikeDislikeField(this._dislikeField,this._isDislikeBtnClicked)}async updateFeaturesLikeDislikeField(t,i){const s={},e=this._selectedGraphic.layer,a=this._selectedGraphic;a.attributes[t]=i?Number(a.attributes[t])+1:Number(a.attributes[t])-1,s[e.objectIdField]=a.attributes[e.objectIdField],s[t]=a.attributes[t];const o=new this.Graphic;o.attributes=s;const n={updateFeatures:[o]};await e.applyEdits(n).then((()=>{this._selectedGraphic=a,this._infoCard&&this._infoCard.updateCurrentGraphic(this._selectedGraphic),this.setInLocalStorage(),this.loadingStatus.emit(!1)}),(t=>{this.loadingStatus.emit(!1),console.log(t)}))}getFromLocalStorage(){const t=localStorage[this._selectedGraphic.layer.id];if(t){const i=JSON.parse(t).filter((t=>t.id===this._selectedGraphic.getObjectId()));i.length>0&&(this._isLikeBtnClicked=i[0].like,this._isDislikeBtnClicked=i[0].dislike)}}setInLocalStorage(){const t=this._selectedGraphic.layer.id,i=localStorage[t];let s=[];if(i){s=JSON.parse(i);const t=s.findIndex((t=>t.id===this._selectedGraphic.getObjectId()));t>=0&&s.splice(t,1)}s.push({id:this._selectedGraphic.getObjectId(),like:this._isLikeBtnClicked&&0!==this._likeCount,dislike:this._isDislikeBtnClicked&&0!==this._disLikeCount}),localStorage.setItem(t,JSON.stringify(s))}get el(){return s(this)}static get watchers(){return{graphics:["graphicsWatchHandler"]}}};N.style=":host{display:block}.buttons-container{align-items:center;display:flex;padding:10px;color:var(--calcite-color-text-1) !important;background-color:var(--calcite-color-foreground-1) !important;border-block-start:1px solid var(--calcite-color-border-3);border-block-end:1px solid var(--calcite-color-border-3)}.comment-btn{display:flex;gap:5px;font-size:var(--calcite-font-size--2);align-items:center;padding:0 0.5rem}";const T=class{constructor(i){t(this,i),this.layerSelect=e(this,"layerSelect",7),this.layersListLoaded=e(this,"layersListLoaded",7),this.mapView=void 0,this.layers=void 0,this.showFeatureCount=!0,this.showNextIcon=!1,this._noLayersToDisplay=!1,this._mapLayerIds=[],this._isLoading=!1,this._translations=void 0}async refresh(){await this.setLayers()}async componentWillLoad(){await this._getTranslations(),this._isLoading=!0}async componentDidLoad(){await this.setLayers(),this._isLoading=!1}render(){return i(o,{key:"9366302a704c1dbdd7a65aef5c43d0ad84a44b23"},this._isLoading&&i("calcite-loader",{key:"69974a23fd42bc37ef13816efbe6d06e28cb2749",label:"",scale:"m"}),!this._isLoading&&this.mapView&&this._noLayersToDisplay&&i("calcite-notice",{key:"a93abb55b4db09727b3634cb1935e482c377d662",class:"error-msg",icon:"layers-reference",kind:"danger",open:!0},i("div",{key:"b9046685353b8894e6c6094cff47fab7a8e07ffa",slot:"title"},this._translations.error),i("div",{key:"90a052e1d80779a09a32fdd35563a1ce21d582e0",slot:"message"},this._translations.noLayerToDisplayErrorMsg)),!this._isLoading&&this.mapView&&i("calcite-list",{key:"709c1b8edd5710a2476ecef638199c2f929b4165","selection-appearance":"border","selection-mode":"none"},this.renderLayerList()))}async setLayers(){this.mapView&&await this.initLayerHash()}async initLayerHash(){const t=[];this._layerItemsHash=await E(this.mapView,!0),(await _(this.mapView)).forEach((async i=>{if("feature"===(null==i?void 0:i.type)&&this.showFeatureCount){const s=i.createQuery(),e=i.queryFeatureCount(s);t.push(e),e.then((async t=>{const s=isNaN(t)?"":await L(t,{places:0,api:4,type:"decimal"});this._layerItemsHash[i.id].formattedFeatureCount=s}))}})),await Promise.all(t).then((()=>{const t=this.getLayersToBeShownInList(this._layerItemsHash);this._mapLayerIds=t.reverse(),this.handleNoLayersToDisplay()}),(()=>{this._mapLayerIds=[],this.handleNoLayersToDisplay()}))}handleNoLayersToDisplay(){this._noLayersToDisplay=!(this._mapLayerIds.length>0),this.layersListLoaded.emit(this._mapLayerIds)}getLayersToBeShownInList(t){var i;const s=(null===(i=this.layers)||void 0===i?void 0:i.length)>0?this.layers:[];return Object.keys(t).reduce(((t,i)=>(s.indexOf(i)>-1&&t.push(i),t)),[])}renderLayerList(){return this._mapLayerIds.length>0&&this._mapLayerIds.reduce(((t,i)=>(this._layerItemsHash[i]&&t.push(this.getLayerListItem(i)),t)),[])}getLayerListItem(t){const s=this._layerItemsHash[t].formattedFeatureCount;return i("calcite-list-item",{onCalciteListItemSelect:()=>{this.onLayerItemSelected(t)}},i("div",{class:"layer-name",slot:"content-start"},this._layerItemsHash[t].name),this.showFeatureCount&&void 0!==s&&""!==s&&i("div",{class:this.showNextIcon?"":"feature-count",slot:"content-end"},"("+s+")"),this.showNextIcon&&i("calcite-icon",{flipRtl:!0,icon:"chevron-right",scale:"s",slot:"content-end"}))}onLayerItemSelected(t){this.layerSelect.emit({layerId:t,layerName:this._layerItemsHash[t].name})}async _getTranslations(){const t=await C(this.el);this._translations=t[0]}get el(){return s(this)}};T.style=":host{display:block}.error-msg{padding:10px}.layer-name{font-weight:500;padding:10px 12px}.feature-count{padding-right:12px}";export{z as calcite_flow,D as calcite_flow_item,O as create_feature,B as create_related_feature,N as feature_details,T as layer_list}
|