@phila/layerboard 2.1.0 → 3.0.0-beta.0

package/README.md

@@ -1,207 +1,66 @@
-# layerboard ([@phila/layerboard](https://www.npmjs.com/package/@phila/layerboard) in [npmjs.com](https://npmjs.com))
+# vue3-layerboard
 
-layerboard is a framework for creating app that are portals for viewing and downloading data from the City of Philadelphia.
+A Vue 3 + MapLibre GL JS framework for building interactive map applications with layer management, measurement tools, and ArcGIS integration.
 
-For example, [Openmaps](https://github.com/CityOfPhiladelphia/openmaps) is built using layerboard.
+## Features
 
-![](https://s3.amazonaws.com/mapboard-images/OpenMaps2.JPG)
+- **MapLibre GL JS Integration** - Modern, performant vector tile mapping
+- **Layer Management** - Dynamic layer loading from ArcGIS Online web maps
+- **Measurement Tools** - Interactive area and distance measurement
+- **Geolocation** - User location tracking and display
+- **Legend & Layer Controls** - Configurable layer visibility and legends
+- **Popup System** - Feature identification and attribute display
 
-Also, [StreetSmartPHL](https://github.com/CityOfPhiladelphia/StreetSmartPHL) is built using layerboard.
+## Installation
 
-![](https://s3.amazonaws.com/mapboard-images/StreetSmart.JPG)
+```sh
+npm install @phila/layerboard
+```
 
-## Usage
-Check out [the wiki](https://github.com/CityOfPhiladelphia/layerboard/wiki) for usage documentation.
+## Peer Dependencies
 
-## Example Sites
+This package requires the following peer dependencies:
 
-See the examples [Openmaps](https://openmaps.phila.gov) and [StreetSmartPHL](https://streetsmartphl.phila.gov/).
+- `vue` ^3.5.0
+- `pinia` ^3.0.0
+- `maplibre-gl` ^5.0.0
+- `@fortawesome/fontawesome-svg-core` ^7.0.0
+- `@fortawesome/free-solid-svg-icons` ^7.0.0
+- `@fortawesome/vue-fontawesome` ^3.0.0
 
-## Release Notes
+## Development
 
-### 2.0.4 - 3/15/2023
+### Recommended IDE Setup
 
-* uses @phila/vue-mapping 3.1.13 which fixes popout of cyclomedia
+[VS Code](https://code.visualstudio.com/) + [Vue (Official)](https://marketplace.visualstudio.com/items?itemName=Vue.volar) (and disable Vetur).
 
-### 2.0.3 - 3/13/2023
+### Recommended Browser Setup
 
-* allows using cyclomedia 23.2
+- Chromium-based browsers (Chrome, Edge, Brave, etc.):
+  - [Vue.js devtools](https://chromewebstore.google.com/detail/vuejs-devtools/nhdogjmejiglipccpnnnanhbledajbpd)
+  - [Turn on Custom Object Formatter in Chrome DevTools](http://bit.ly/object-formatters)
+- Firefox:
+  - [Vue.js devtools](https://addons.mozilla.org/en-US/firefox/addon/vue-js-devtools/)
+  - [Turn on Custom Object Formatter in Firefox DevTools](https://fxdx.dev/firefox-devtools-custom-object-formatters/)
 
-### 2.0.2 - 2/8/2023
+### Type Support for `.vue` Imports in TS
 
-* uses upgraded @phila packages
-* ran package updates
+TypeScript cannot handle type information for `.vue` imports by default, so we replace the `tsc` CLI with `vue-tsc` for type checking. In editors, we need [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar) to make the TypeScript language service aware of `.vue` types.
 
-### 2.0.1 - 9/9/2022
+### Project Setup
 
-* uses upgraded @phila packages
-* ran package upgrade
+```sh
+npm install
+```
 
-### 2.0.0 - 7/26/2021
+### Compile and Hot-Reload for Development
 
-* uses @phila packages that use npm for package commands
-* requires using npm for all package commands
+```sh
+npm run dev
+```
 
-### 1.1.14 - 10/27/2020
+### Type-Check, Compile and Minify for Production
 
-* uses github actions for pushing to npmjs, uses vue router
-
-### 1.1.13 - 10/7/2020
-
-* uses upgraded vue libraries:
-    * @phila/vue-mapping 2.2.9
-    * @phila/vue-comps 2.1.15
-    * @phila/vue-datafetch 1.4.3
-
-### 1.1.12 - 9/18/2020
-
-* uses pvm 2.2.7 which changes the map address input
-
-### 1.1.11 - 9/18/2020
-
-* changes for streetsmart
-
-### 1.1.10 - 9/17/2020
-
-* adds a layer name if the checkbox is hidden
-* adds space between symbols and labels in legends
-
-### 1.1.9 - 9/17/2020
-
-* uses pvc 2.1.12 that fixes checkboxes, allows placement of controls
-
-### 1.1.8 - 9/17/2020
-
-* uses pvc 2.1.10 which adds infoBox.vue component
-
-### 1.1.7 - 9/16/2020
-
-* uses pvd 1.4.2 with updates for layerboard bugs
-
-### 1.1.6 - 9/16/2020
-
-* fixes moving map to geocode location when you first geocode
-
-### 1.1.5 - 8/13/2020
-
-* fixes bug with cyclomedia activation
-
-### 1.1.4 - 7/29/2020
-
-* upgrades to all @phila/vue libraries
-
-### 1.1.3 - 6/23/2020
-
-* upgrades @phila/vue-mapping with new dependencies
-
-### 1.1.2 - 5/27/2020
-
-* upgrades all packages
-
-### 1.1.1 - 5/7/2020
-
-* allows ordering of popups
-
-### 1.1.0 - 5/6/2020
-
-* uses minor releases of libraries:
-  * @phila/vue-comps 2.1.1
-  * @phila/vue-mapping 2.1.1
-  * @phila/vue-datafetch 1.2.0
-
-### 1.0.1 - 2/3/2020
-
-* uses new locations for phila libraries:
-  * @phila/vue-comps 2.0.9
-  * @phila/vue-mapping 2.0.5
-  * @phila/vue-datafetch 1.1.7
-* pushes to @phila/layerboard instead of @philly/layerboard
-
-### 1.0.0 - 12/17/2019
-
-* Uses new major releases:
-  * Uses @philly/vue-comps 2.0.0
-  * Uses @philly/vue-mapping 2.0.0
-  * Uses @philly/vue-datafetch 1.0.0
-
-### 0.0.37 - 10/23/2019
-
-* fixes linting issue
-
-### 0.0.36 - 10/23/2019
-
-* you have to use the following (at minimum) with this:
-
-    "@vue/cli-plugin-babel": "^4.0.5",
-    "@vue/cli-plugin-eslint": "^4.0.5",
-    "@vue/cli-service": "^4.0.5",
-
-### 0.0.35 - 10/9/2019
-
-* Uses pvc 1.0.42, allows LegendBox class to be passed in
-
-### 0.0.34 - 10/9/2019
-
-* Uses update to L.esri.Webmap to add datetime to popups
-
-### 0.0.33 - 10/8/2019
-
-* Uses new releases of @philly libraries which fix bugs:
-  * Uses @philly/vue-comps 1.0.41
-  * Uses @philly/vue-datafetch 0.0.27
-
-### 0.0.32 - 10/8/2019
-
-* Attempted bug fix for streetsmartphl
-
-### 0.0.31 - 10/7/2019
-
-* Uses new releases of @philly libraries which ran upgrades:
-  * Uses @philly/vue-comps 1.0.40
-  * Uses @philly/vue-mapping 1.0.41
-  * Uses @philly/vue-datafetch 0.0.26
-
-### 0.0.30 - 9/6/2019
-
-* Adds lines to store.js to handle new "fullScreen" changes in pvc
-
-### 0.0.29 - 9/6/2019
-
-* Uses new releases of @philly libraries which ran upgrades:
-  * Uses @philly/vue-comps 1.0.37
-  * Uses @philly/vue-mapping 1.0.36
-  * Uses @philly/vue-datafetch 0.0.24
-
-### 0.0.28 - 8/26/2019
-
-* Allows you to set initial imagery in the config
-
-### 0.0.27 - 8/9/2019
-
-* Uses new releases of @philly libraries which use axios 0.19.0:
-  * Uses @philly/vue-comps 1.0.36
-  * Uses @philly/vue-mapping 1.0.35
-  * Uses @philly/vue-datafetch 0.0.22
-
-### 0.0.26 - 7/11/2019
-
-* Uses new releases of @philly libraries which use axios 0.19.0:
-  * Uses @philly/vue-comps 1.0.33
-  * Uses @philly/vue-mapping 1.0.33
-  * Uses @philly/vue-datafetch 0.0.20
-
-### 0.0.25 - 6/2/2019
-
-* Uses new releases of @philly libraries which use axios 0.19.0:
-  * Uses @philly/vue-comps 1.0.31
-  * Uses @philly/vue-mapping 1.0.31
-  * Uses @philly/vue-datafetch 0.0.18
-
-### 0.0.24 - 5/30/2019
-
-* Uses @philly/vue-comps 1.0.30
-* Uses @philly/vue-mapping 1.0.30
-* Uses @philly/vue-datafetch 0.0.17
-* Allows you to use a [footerContent](https://github.com/CityOfPhiladelphia/mapboard/wiki/footerContent) parameter in your config, which lets you include as many popoverLink and Anchor components in your footer as you need.
-* Allows you to use a [customComps](https://github.com/CityOfPhiladelphia/mapboard/wiki/customComps) parameter in your config to include your own components in a project.
-* Allows you to set up an [initialPopover](https://github.com/CityOfPhiladelphia/mapboard/wiki/initialPopover) to put an alert modal on your site when it loads.
+```sh
+npm run build
+```

package/dist/index.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),q=require("@phila/phila-ui-map-core"),Z=require("@phila/phila-ui-core");var ue=typeof document<"u"?document.currentScript:null;function Ee(t,r,n={}){const o={type:"Feature"};return(n.id===0||n.id)&&(o.id=n.id),n.bbox&&(o.bbox=n.bbox),o.properties=r||{},o.geometry=t,o}function lt(t,r,n={}){for(const a of t){if(a.length<4)throw new Error("Each LinearRing of a Polygon must have 4 or more Positions.");if(a[a.length-1].length!==a[0].length)throw new Error("First and last Position are not equivalent.");for(let i=0;i<a[a.length-1].length;i++)if(a[a.length-1][i]!==a[0][i])throw new Error("First and last Position are not equivalent.")}return Ee({type:"Polygon",coordinates:t},r,n)}function at(t,r,n={}){if(t.length<2)throw new Error("coordinates must be an array of two or more positions");return Ee({type:"LineString",coordinates:t},r,n)}function it(t,r,n={}){return Ee({type:"MultiLineString",coordinates:t},r,n)}function st(t,r,n={}){return Ee({type:"MultiPolygon",coordinates:t},r,n)}function ct(t){return t.type==="Feature"?t.geometry:t}function ut(t,r,n){var o=t.length,a=de(t[0],r),i=[],u,p,f;let L,m;for(n||(n=[]),u=1;u<o;u++){for(L=t[u-1],m=t[u],p=f=de(m,r);;)if(a|p){if(a&p)break;a?(L=_e(L,m,a,r),a=de(L,r)):(m=_e(L,m,p,r),p=de(m,r))}else{i.push(L),p!==f?(i.push(m),u<o-1&&(n.push(i),i=[])):u===o-1&&i.push(m);break}a=f}return i.length&&n.push(i),n}function dt(t,r){var n,o,a,i,u,p,f;for(o=1;o<=8;o*=2){for(n=[],a=t[t.length-1],i=!(de(a,r)&o),u=0;u<t.length;u++)p=t[u],f=!(de(p,r)&o),f!==i&&n.push(_e(a,p,o,r)),f&&n.push(p),a=p,i=f;if(t=n,!t.length)break}return n}function _e(t,r,n,o){return n&8?[t[0]+(r[0]-t[0])*(o[3]-t[1])/(r[1]-t[1]),o[3]]:n&4?[t[0]+(r[0]-t[0])*(o[1]-t[1])/(r[1]-t[1]),o[1]]:n&2?[o[2],t[1]+(r[1]-t[1])*(o[2]-t[0])/(r[0]-t[0])]:n&1?[o[0],t[1]+(r[1]-t[1])*(o[0]-t[0])/(r[0]-t[0])]:null}function de(t,r){var n=0;return t[0]<r[0]?n|=1:t[0]>r[2]&&(n|=2),t[1]<r[1]?n|=4:t[1]>r[3]&&(n|=8),n}function ft(t,r){const n=ct(t),o=n.type,a=t.type==="Feature"?t.properties:{};let i=n.coordinates;switch(o){case"LineString":case"MultiLineString":{const u=[];return o==="LineString"&&(i=[i]),i.forEach(p=>{ut(p,r,u)}),u.length===1?at(u[0],a):it(u,a)}case"Polygon":return lt(We(i,r),a);case"MultiPolygon":return st(i.map(u=>We(u,r)),a);default:throw new Error("geometry "+o+" not supported")}}function We(t,r){const n=[];for(const o of t){const a=dt(o,r);a.length>0&&((a[0][0]!==a[a.length-1][0]||a[0][1]!==a[a.length-1][1])&&a.push(a[0]),a.length>=4&&n.push(a))}return n}var pt=ft;const mt={class:"map-panel"},yt=e.defineComponent({__name:"MapPanel",props:{visibleLayers:{},layerOpacities:{},layerList:{},tiledLayers:{},visibleTiledLayers:{},tiledLayerOpacities:{},cyclomediaConfig:{},pictometryCredentials:{},basemapControlPosition:{default:"top-right"},navigationControlPosition:{default:"bottom-right"},geolocationControlPosition:{default:"bottom-right"},searchControlPosition:{default:"top-left"},drawControlPosition:{default:"bottom-left"},cyclomediaButtonPosition:{default:"top-right"},pictometryButtonPosition:{default:"top-right"},initialZoom:{},initialCenter:{}},emits:["zoom","layerLoading","layerError"],setup(t,{emit:r}){const n=t,o=r,a=e.ref(null),i=e.ref(null),u=e.ref(0);function p(l){o("zoom",l),i.value&&(u.value=f(i.value))}function f(l){const d=l.getZoom(),E=l.getCenter().lat,S=559082264028e-3,B=E*Math.PI/180;return S*Math.cos(B)/Math.pow(2,d)}const L=e.ref({}),m=e.ref(null),h=e.ref(new Set),c=["fema-100-year-floodplain","fema-500-year-floodplain"];async function v(l,d,s,E){const S=encodeURIComponent(E||"1=1"),B=JSON.stringify({xmin:d.west,ymin:d.south,xmax:d.east,ymax:d.north,spatialReference:{wkid:4326}}),P=2e3;let M=0,I=[],U=!0;for(;U;){const D=`${l}/query?where=${S}&geometry=${encodeURIComponent(B)}&geometryType=esriGeometryEnvelope&spatialRel=esriSpatialRelIntersects&outFields=*&returnGeometry=true&resultRecordCount=${P}&resultOffset=${M}&f=geojson`,V=await fetch(D);if(!V.ok)throw new Error(`HTTP ${V.status}: ${V.statusText}`);const O=await V.json();O.features&&O.features.length>0?(I=I.concat(O.features),M+=O.features.length,U=O.features.length===P):U=!1}if(c.includes(s)){const D=[d.west,d.south,d.east,d.north];I=I.map(V=>{if(V.geometry&&(V.geometry.type==="Polygon"||V.geometry.type==="MultiPolygon"))try{return pt(V,D)}catch(O){return console.warn(`Failed to clip feature in ${s}:`,O),V}return V})}return{type:"FeatureCollection",features:I}}async function N(l,d){const s=d.map(async E=>{const S=n.layerList.find(B=>B.config.id===E)?.config;if(S){o("layerLoading",E,!0);try{const B=await v(S.url,l,E,S.where);L.value={...L.value,[E]:B},o("layerError",E,null)}catch(B){const P=B instanceof Error?B.message:"Failed to load";o("layerError",E,P),console.error(`Error loading ${E}:`,B)}finally{o("layerLoading",E,!1)}}});await Promise.all(s)}async function g(l){const d=[...n.visibleLayers];await N(l,d)}function w(l){m.value=l.bounds,g(l.bounds)}function y(l){i.value=l;const d=l.getBounds();m.value={west:d.getWest(),south:d.getSouth(),east:d.getEast(),north:d.getNorth()};const s=l.getZoom();o("zoom",s),u.value=f(l),g(m.value)}e.watch(()=>n.visibleLayers.size,async()=>{if(j.value.length>0&&W(),m.value){const l=new Set(n.visibleLayers),d=[...l].filter(s=>!h.value.has(s));h.value=new Set(l),d.length>0&&await N(m.value,d)}});function k(l){return n.visibleLayers.has(l)}function x(l){return!!L.value[l.id]}const $=e.computed(()=>n.layerList.filter(l=>l.config.type==="circle"&&k(l.config.id)&&x(l.config)).map(l=>l.config)),F=e.computed(()=>n.layerList.filter(l=>l.config.type==="fill"&&k(l.config.id)&&x(l.config)).map(l=>l.config)),_=e.computed(()=>n.layerList.filter(l=>l.config.type==="fill"&&l.config.outlinePaint&&k(l.config.id)&&x(l.config)).map(l=>l.config)),J=e.computed(()=>n.layerList.filter(l=>l.config.type==="line"&&k(l.config.id)&&x(l.config)).map(l=>l.config));function re(l){return n.visibleTiledLayers?.has(l)??!1}function le(l){return n.tiledLayerOpacities?.[l]??1}function $e(l){return`${l.replace(/\/$/,"")}/tile/{z}/{y}/{x}`}function Ne(l){return{type:"raster",tiles:[$e(l.url)],tileSize:256,attribution:l.attribution||""}}const pe=e.ref({}),ve=e.ref(new Set);async function me(l){if(!ve.value.has(l.id)){ve.value.add(l.id);try{const d=l.url.replace(/\/$/,""),s=await fetch(`${d}?f=json`);if(!s.ok){console.warn(`[MapPanel] Failed to fetch metadata for ${l.id}: ${s.status}`);return}const E=await s.json();let S=E.minScale||0,B=E.maxScale||0;if(E.layers&&E.layers.length>0)for(const P of E.layers)P.maxScale&&P.maxScale>0&&(B===0||P.maxScale<B)&&(B=P.maxScale);B===0&&(B=72e3),pe.value={...pe.value,[l.id]:{minScale:S,maxScale:B}},console.log(`[MapPanel] Fetched scale metadata for ${l.id}: minScale=${S}, maxScale=${B}`)}catch(d){console.warn(`[MapPanel] Error fetching metadata for ${l.id}:`,d)}}}e.onMounted(()=>{if(n.tiledLayers)for(const l of n.tiledLayers)l.scaleBasedRendering&&me(l)});function be(l){if(!l.scaleBasedRendering)return"tiled";const d=pe.value[l.id];if(!d)return"tiled";const s=u.value;return s===0||s>d.maxScale?"tiled":"dynamic"}const xe=e.computed(()=>n.tiledLayers?n.tiledLayers.filter(l=>re(l.id)?l.scaleBasedRendering?be(l)==="tiled":!0:!1):[]),Pe=e.computed(()=>n.tiledLayers?n.tiledLayers.filter(l=>re(l.id)&&l.scaleBasedRendering?be(l)==="dynamic":!1):[]);function ae(l){return{type:"raster",tiles:[`${l.url.replace(/\/$/,"")}/export?bbox={bbox-epsg-3857}&bboxSR=3857&imageSR=3857&size=256,256&format=png32&transparent=true&f=image`],tileSize:256,attribution:l.attribution||""}}function K(l){return{type:"geojson",data:L.value[l.id]}}function ie(l){return n.layerOpacities[l]??1}function X(l){const d=ie(l.id),s=l.type==="circle"?"circle-opacity":l.type==="fill"?"fill-opacity":"line-opacity";if(l.type==="fill"&&l.paint["fill-opacity"]===0)return{...l.paint,"fill-opacity":0};const E=l.type==="circle"?"circle-color":l.type==="fill"?"fill-color":"line-color",S={...l.paint},B=S[E],P=S[s]===1,M=typeof B=="string"&&B.startsWith("rgba(");if(P&&M){if(d===1)return S;{const I=B.match(/rgba\((\d+),\s*(\d+),\s*(\d+),\s*([\d.]+)\)/);if(I&&I[4]){const[,U,D,V,O]=I,Me=parseFloat(O)*d;S[E]=`rgba(${U}, ${D}, ${V}, ${Me})`,S[s]=1}return S}}if(M){const I=B.match(/rgba\((\d+),\s*(\d+),\s*(\d+),\s*([\d.]+)\)/);if(I){const[,U,D,V]=I;S[E]=`rgb(${U}, ${D}, ${V})`}}return S[s]=d,S}function Te(l){const d=ie(l.id);return{...l.outlinePaint,"line-opacity":d}}const j=e.ref([]),Y=e.ref(null),R=e.ref(0);function se(l){const d=l.replace(/-outline$/,"");return n.layerList.find(E=>E.config.id===d)?.config}function oe(l,d){return l.replace(/\{([^}]+)\}/g,(s,E)=>{const S=d[E];return S==null?"":String(S)})}function Ve(l,d){if(l==null)return"-";if(d?.dateFormat&&typeof l=="number"){const s=new Date(l);switch(d.dateFormat){case"shortDateShortTime":return s.toLocaleString();case"longMonthDayYear":return s.toLocaleDateString(void 0,{month:"long",day:"numeric",year:"numeric"});case"shortDate":return s.toLocaleDateString();case"longDate":return s.toLocaleDateString(void 0,{weekday:"long",month:"long",day:"numeric",year:"numeric"});default:return s.toLocaleDateString()}}if(typeof l=="number"){if(l>1e12&&!d)return new Date(l).toLocaleDateString();const s=d?.places,E=d?.digitSeparator??!0;if(s!==void 0){const S=l.toFixed(s);if(E){const B=S.split("."),P=B[0]||"0",M=B[1],I=P.replace(/\B(?=(\d{3})+(?!\d))/g,",");return M?`${I}.${M}`:I}return S}return E?l.toLocaleString():String(l)}return String(l)}function ke(l){const d=new Set;return l.filter(s=>{const S=`${s.layer.id.replace(/-outline$/,"")}:${JSON.stringify(s.properties)}`;return d.has(S)?!1:(d.add(S),!0)})}function ee(l,d){const s=new Map;return d.forEach((E,S)=>{s.set(E.id,S)}),l.sort((E,S)=>{const B=E.layer.id.replace(/-outline$/,""),P=S.layer.id.replace(/-outline$/,""),M=s.get(B)??-1;return(s.get(P)??-1)-M})}function ce(l){const d=i.value;if(!d)return;const s=[];n.layerList.forEach(D=>{const V=D.config;n.visibleLayers.has(V.id)&&(s.push(V.id),V.outlinePaint&&s.push(`${V.id}-outline`))});const E=d.project([l.lngLat.lng,l.lngLat.lat]),S=d.queryRenderedFeatures(E,{layers:s});if(S.length===0)return;const B=ke(S),P=n.layerList.map(D=>D.config),M=ee(B,P),I=M.map(D=>{const V=D.layer.id.replace(/-outline$/,""),O=se(V);return O?{layerId:O.id,layerTitle:O.title,properties:D.properties||{},popupConfig:O.popup}:null}).filter(D=>D!==null);if(I.length===0)return;j.value=I,R.value=0,Y.value=[l.lngLat.lng,l.lngLat.lat];const U=M[0];if(U&&U.geometry){const D=U.layer.id.replace(/-outline$/,""),V=se(D);if(V){const O=Re(U.geometry),Me=Ae(V.id,V.type);te.value={geometry:U.geometry,geometryType:O,layerId:V.id,properties:U.properties||{},originalStyle:Me}}}}function W(){j.value=[],Y.value=null,R.value=0,te.value=null}function ne(l){if(j.value.length===0)return;const d=l.target;if(!(d.tagName==="INPUT"||d.tagName==="TEXTAREA"||d.isContentEditable))switch(l.key){case"ArrowLeft":case"ArrowUp":l.preventDefault(),Le();break;case"ArrowRight":case"ArrowDown":l.preventDefault(),G();break;case"Escape":l.preventDefault(),W();break}}e.onMounted(()=>{window.addEventListener("keydown",ne)}),e.onUnmounted(()=>{window.removeEventListener("keydown",ne)});function G(){const l=j.value.length;l<=1||(R.value=(R.value+1)%l)}function Le(){const l=j.value.length;l<=1||(R.value=(R.value-1+l)%l)}const b=e.computed(()=>j.value.length===0?null:j.value[R.value]),C=e.computed(()=>{const l=b.value;return!l||!l.popupConfig?l?.layerTitle||"":oe(l.popupConfig.title,l.properties)}),H=e.computed(()=>{const l=b.value;if(!l)return"";let d='<div class="popup-content">';if(d+=`<h3 class="popup-title">${C.value}</h3>`,l.popupConfig?.fields?.length){d+='<table class="popup-table">';for(const s of l.popupConfig.fields){const E=Ve(l.properties[s.field],s.format);d+=`<tr><th>${s.label}</th><td>${E}</td></tr>`}d+="</table>"}else d+='<p class="popup-no-fields">No additional information available.</p>';return d+="</div>",d}),z=e.ref({type:"FeatureCollection",features:[]}),A=e.ref({type:"FeatureCollection",features:[]}),Fe={"circle-radius":["get","highlightRadius"],"circle-color":"#00FFFF","circle-opacity":.8,"circle-stroke-width":2,"circle-stroke-color":"#FFFFFF"},ze={"line-width":["get","highlightWidth"],"line-color":"#00FFFF","line-opacity":.9},te=e.ref(null);function Re(l){return l.type}function Ae(l,d){const s=se(l);if(!s)return{radius:5,width:2};const E=s.paint||{};if(d==="circle"){const S=E["circle-radius"];return typeof S=="number"?{radius:S}:{radius:5}}if(d==="line"||d==="fill"){const S=E["line-width"];if(typeof S=="number")return{width:S};if(s.outlinePaint&&s.outlinePaint["line-width"]){const B=s.outlinePaint["line-width"];if(typeof B=="number")return{width:B}}return{width:2}}return{radius:5,width:2}}function Ue(l){return!l||l.length===0?[]:l[0]??[]}function tt(l){const{geometry:d,geometryType:s,originalStyle:E}=l;if(s==="Point"||s==="MultiPoint"){const B=(E.radius||5)+3;return{type:"FeatureCollection",features:[{type:"Feature",geometry:d,properties:{highlightRadius:B}}]}}if(s==="LineString"||s==="MultiLineString"){const B=(E.width||2)+3;return{type:"FeatureCollection",features:[{type:"Feature",geometry:d,properties:{highlightWidth:B}}]}}if(s==="Polygon"){const S=d.coordinates,B=Ue(S),M=(E.width||2)+3;return{type:"FeatureCollection",features:[{type:"Feature",geometry:{type:"LineString",coordinates:B},properties:{highlightWidth:M}}]}}if(s==="MultiPolygon"){const S=d.coordinates,P=(E.width||2)+3;return{type:"FeatureCollection",features:S.map(I=>({type:"Feature",geometry:{type:"LineString",coordinates:Ue(I)},properties:{highlightWidth:P}}))}}return{type:"FeatureCollection",features:[]}}function ot(l){if(!l){nt();return}const d=tt(l);l.geometryType==="Point"||l.geometryType==="MultiPoint"?(z.value=d,A.value={type:"FeatureCollection",features:[]}):(A.value=d,z.value={type:"FeatureCollection",features:[]})}function nt(){z.value={type:"FeatureCollection",features:[]},A.value={type:"FeatureCollection",features:[]}}e.watch(te,l=>{ot(l)}),e.watch(()=>n.visibleLayers,l=>{te.value&&!l.has(te.value.layerId)&&(te.value=null,W())},{deep:!0}),e.watch(R,()=>{const l=b.value;if(!l){te.value=null;return}const d=i.value;if(!d||!Y.value)return;const s=[];n.layerList.forEach(P=>{const M=P.config;n.visibleLayers.has(M.id)&&(s.push(M.id),M.outlinePaint&&s.push(`${M.id}-outline`))});const E=d.project(Y.value),B=d.queryRenderedFeatures(E,{layers:s}).find(P=>P.layer.id.replace(/-outline$/,"")===l.layerId&&JSON.stringify(P.properties)===JSON.stringify(l.properties));if(B&&B.geometry){const P=se(l.layerId);if(P){const M=Re(B.geometry),I=Ae(P.id,P.type);te.value={geometry:B.geometry,geometryType:M,layerId:P.id,properties:B.properties||{},originalStyle:I}}}});const Ze=e.ref(null);function rt(l){const[d,s]=l.geometry.coordinates;Ze.value=[d,s]}return(l,d)=>(e.openBlock(),e.createElementBlock("div",mt,[e.createVNode(e.unref(q.Map),{ref_key:"mapRef",ref:a,zoom:n.initialZoom,center:n.initialCenter,"navigation-controls":{position:n.navigationControlPosition},"geolocation-control":{position:n.geolocationControlPosition},"basemap-change-controls":{toggle:!0,dropdown:!0,position:n.basemapControlPosition},"map-search-control":{position:n.searchControlPosition},"enable-cyclomedia":!0,"cyclomedia-config":n.cyclomediaConfig,"cyclomedia-button-position":n.cyclomediaButtonPosition,"enable-pictometry":!0,"pictometry-credentials":n.pictometryCredentials,"pictometry-button-position":n.pictometryButtonPosition,"tool-panel-layout":"vertical","tool-panel-split-ratio":50,onZoom:p,onClick:W,onMoveend:w,onLoad:y,onSearchResult:rt},{default:e.withCtx(()=>[n.drawControlPosition!==null?(e.openBlock(),e.createBlock(e.unref(q.DrawTool),{key:0,position:n.drawControlPosition},null,8,["position"])):e.createCommentVNode("",!0),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(xe.value,s=>(e.openBlock(),e.createBlock(e.unref(q.RasterLayer),{key:"tiled-"+s.id,id:"tiled-"+s.id,source:Ne(s),paint:{"raster-opacity":le(s.id)},minzoom:s.minZoom,maxzoom:s.maxZoom},null,8,["id","source","paint","minzoom","maxzoom"]))),128)),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(Pe.value,s=>(e.openBlock(),e.createBlock(e.unref(q.RasterLayer),{key:"dynamic-"+s.id,id:"dynamic-"+s.id,source:ae(s),paint:{"raster-opacity":le(s.id)},minzoom:s.minZoom,maxzoom:s.maxZoom},null,8,["id","source","paint","minzoom","maxzoom"]))),128)),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList($.value,s=>(e.openBlock(),e.createBlock(e.unref(q.CircleLayer),{key:s.id,id:s.id,source:K(s),paint:X(s),minzoom:s.minZoom,maxzoom:s.maxZoom,"before-id":"highlight-circles",onClick:ce},null,8,["id","source","paint","minzoom","maxzoom"]))),128)),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(F.value,s=>(e.openBlock(),e.createBlock(e.unref(q.FillLayer),{key:s.id,id:s.id,source:K(s),paint:X(s),minzoom:s.minZoom,maxzoom:s.maxZoom,"before-id":"highlight-circles",onClick:ce},null,8,["id","source","paint","minzoom","maxzoom"]))),128)),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(_.value,s=>(e.openBlock(),e.createBlock(e.unref(q.LineLayer),{key:s.id+"-outline",id:s.id+"-outline",source:K(s),paint:Te(s),minzoom:s.minZoom,maxzoom:s.maxZoom,"before-id":"highlight-lines",onClick:ce},null,8,["id","source","paint","minzoom","maxzoom"]))),128)),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(J.value,s=>(e.openBlock(),e.createBlock(e.unref(q.LineLayer),{key:s.id,id:s.id,source:K(s),paint:X(s),minzoom:s.minZoom,maxzoom:s.maxZoom,"before-id":"highlight-lines",onClick:ce},null,8,["id","source","paint","minzoom","maxzoom"]))),128)),e.createVNode(e.unref(q.CircleLayer),{key:"highlight-circles-layer",id:"highlight-circles",source:{type:"geojson",data:z.value},paint:Fe},null,8,["source"]),e.createVNode(e.unref(q.LineLayer),{key:"highlight-lines-layer",id:"highlight-lines",source:{type:"geojson",data:A.value},paint:ze},null,8,["source"]),e.createVNode(e.unref(q.MapMarker),{"lng-lat":Ze.value,color:"#2176d2"},null,8,["lng-lat"]),b.value&&Y.value?(e.openBlock(),e.createBlock(e.unref(q.MapPopup),{key:1,"lng-lat":Y.value,html:H.value,"close-on-click":!1,"show-navigation":j.value.length>1,"current-feature-index":R.value,"total-features":j.value.length,"layer-name":b.value.layerTitle,onClose:W,onNext:G,onPrevious:Le},null,8,["lng-lat","html","show-navigation","current-feature-index","total-features","layer-name"])):e.createCommentVNode("",!0)]),_:1},8,["zoom","center","navigation-controls","geolocation-control","basemap-change-controls","map-search-control","cyclomedia-config","cyclomedia-button-position","pictometry-credentials","pictometry-button-position"])]))}}),he=(t,r)=>{const n=t.__vccOpts||t;for(const[o,a]of r)n[o]=a;return n},Je=he(yt,[["__scopeId","data-v-38b78874"]]),gt=["disabled"],ht=e.defineComponent({inheritAttrs:!1,__name:"PhlButton",props:{href:{},to:{},target:{},rel:{},disabled:{type:Boolean,default:!1},clickTarget:{},variant:{default:"primary"},size:{default:"medium"},iconOnly:{type:Boolean,default:!1},iconRight:{type:Boolean},text:{},className:{},iconDefinition:{},iconClass:{},src:{},svgRaw:{}},setup(t){const r=t,n=u=>"href"in u&&u.href!==void 0||"to"in u&&u.to!==void 0,o=e.computed(()=>Z.cn("phila-button",`phila-button--${r.variant}`,r.size&&`is-${r.size}`,r.iconOnly&&"icon-button",r.iconOnly&&r.variant==="standard"&&"icon-button--standard",r.className)),a=e.computed(()=>n(r)?"to"in r&&r.to!==void 0?{to:r.to,disabled:r.disabled,className:o.value}:{href:r.href,target:r.target,rel:r.rel,disabled:r.disabled,className:o.value}:{}),i=e.computed(()=>({iconDefinition:r.iconDefinition,iconClass:r.iconClass,src:r.src,iconRight:r.iconRight,iconOnly:r.iconOnly,text:r.text,size:r.size}));return(u,p)=>n(r)?(e.openBlock(),e.createBlock(e.unref(Z.BaseLink),e.mergeProps({key:0},{...a.value,...u.$attrs},{role:"button"}),{default:e.withCtx(()=>[e.createVNode(e.unref(Z.ActionContent),e.normalizeProps(e.guardReactiveProps(i.value)),{default:e.withCtx(()=>[e.renderSlot(u.$slots,"default",{},()=>[e.createTextVNode(e.toDisplayString(r.text),1)])]),_:3},16)]),_:3},16)):(e.openBlock(),e.createElementBlock("button",e.mergeProps({key:1,type:"button",disabled:r.disabled,class:o.value},u.$attrs),[e.createVNode(e.unref(Z.ActionContent),e.normalizeProps(e.guardReactiveProps(i.value)),{default:e.withCtx(()=>[e.renderSlot(u.$slots,"default",{},()=>[e.createTextVNode(e.toDisplayString(r.text),1)])]),_:3},16)],16,gt))}});var vt={prefix:"fas",iconName:"circle-exclamation",icon:[512,512,["exclamation-circle"],"f06a","M256 512a256 256 0 1 1 0-512 256 256 0 1 1 0 512zm0-192a32 32 0 1 0 0 64 32 32 0 1 0 0-64zm0-192c-18.2 0-32.7 15.5-31.4 33.7l7.4 104c.9 12.6 11.4 22.3 23.9 22.3 12.6 0 23-9.7 23.9-22.3l7.4-104c1.3-18.2-13.1-33.7-31.4-33.7z"]},bt=vt,kt={prefix:"fas",iconName:"xmark",icon:[384,512,[128473,10005,10006,10060,215,"close","multiply","remove","times"],"f00d","M55.1 73.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L147.2 256 9.9 393.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L192.5 301.3 329.9 438.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L237.8 256 375.1 118.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L192.5 210.7 55.1 73.4z"]},Lt=kt;const wt=["for"],St={class:"state-layer"},Ct={class:"content"},Et={class:"input-text-container"},Bt=["id","placeholder"],$t={key:1,class:"has-text-body-small phila-supporting-text"},Nt={key:2,class:"has-text-body-small phila-error-text"},xt=e.defineComponent({inheritAttrs:!1,__name:"TextField",props:{className:{default:""},label:{default:""},id:{default:`phila-text-field-${Math.random().toString(36).substring(2,9)}`},supportingText:{default:""},placeholder:{default:""},leadingIcon:{default:""},trailingIcon:{default:""},error:{default(){return[]}}},setup(t,{emit:r}){const n=e.useAttrs(),o=t,a=e.computed(()=>typeof o.error=="string"?o.error:o.error[0]),i=e.toRef(o,"id"),u=e.computed(()=>{const L=["default-class"];return n.disabled!=null&&L.push("phila-input--disabled"),a.value&&L.push("phila-input--error"),n.required!=null&&L.push("phila-input--required"),Z.cn(...L)}),p=e.ref(""),f=e.computed(()=>{const L=[];return p.value!==""&&L.push("phila-text-field--filled"),o.className&&L.push(o.className),Z.cn(...L)});return(L,m)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["phila-input",u.value])},[o.label?(e.openBlock(),e.createElementBlock("label",{key:0,for:i.value,class:"has-text-label-small phila-label"},e.toDisplayString(o.label),9,wt)):e.createCommentVNode("",!0),e.createElementVNode("div",{class:e.normalizeClass(["phila-text-field",f.value])},[e.createElementVNode("div",St,[o.leadingIcon?(e.openBlock(),e.createBlock(e.unref(Z.Icon),{key:0,"icon-class":o.leadingIcon,inline:""},null,8,["icon-class"])):e.createCommentVNode("",!0),e.createElementVNode("div",Ct,[e.createElementVNode("div",Et,[e.withDirectives(e.createElementVNode("input",e.mergeProps({id:i.value,"onUpdate:modelValue":m[0]||(m[0]=h=>p.value=h),class:"phila-text-field-input has-text-body-default",placeholder:o.placeholder},e.unref(n)),null,16,Bt),[[e.vModelDynamic,p.value]])])]),p.value!=""?(e.openBlock(),e.createBlock(e.unref(ht),{key:1,variant:"standard",size:"extra-small","icon-only":"",icon:e.unref(Lt),onClick:m[1]||(m[1]=h=>p.value="")},null,8,["icon"])):e.createCommentVNode("",!0),o.trailingIcon?(e.openBlock(),e.createBlock(e.unref(Z.Icon),{key:2,"icon-class":o.trailingIcon,inline:""},null,8,["icon-class"])):e.createCommentVNode("",!0)])],2),o.supportingText?(e.openBlock(),e.createElementBlock("div",$t,e.toDisplayString(o.supportingText),1)):e.createCommentVNode("",!0),a.value?(e.openBlock(),e.createElementBlock("div",Nt,[e.createVNode(e.unref(Z.Icon),{"icon-definition":e.unref(bt),size:"small",inline:""},null,8,["icon-definition"]),e.createTextVNode(" "+e.toDisplayString(a.value),1)])):e.createCommentVNode("",!0)],2))}});var Pt={prefix:"fas",iconName:"caret-right",icon:[256,512,[],"f0da","M249.3 235.8c10.2 12.6 9.5 31.1-2.2 42.8l-128 128c-9.2 9.2-22.9 11.9-34.9 6.9S64.5 396.9 64.5 384l0-256c0-12.9 7.8-24.6 19.8-29.6s25.7-2.2 34.9 6.9l128 128 2.2 2.4z"]},Tt={prefix:"fas",iconName:"caret-left",icon:[256,512,[],"f0d9","M7.7 235.8c-10.3 12.6-9.5 31.1 2.2 42.8l128 128c9.2 9.2 22.9 11.9 34.9 6.9s19.8-16.6 19.8-29.6l0-256c0-12.9-7.8-24.6-19.8-29.6s-25.7-2.2-34.9 6.9l-128 128-2.2 2.4z"]},je={prefix:"fas",iconName:"xmark",icon:[384,512,[128473,10005,10006,10060,215,"close","multiply","remove","times"],"f00d","M55.1 73.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L147.2 256 9.9 393.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L192.5 301.3 329.9 438.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L237.8 256 375.1 118.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L192.5 210.7 55.1 73.4z"]},Vt={prefix:"fas",iconName:"bars",icon:[448,512,["navicon"],"f0c9","M0 96C0 78.3 14.3 64 32 64l384 0c17.7 0 32 14.3 32 32s-14.3 32-32 32L32 128C14.3 128 0 113.7 0 96zM0 256c0-17.7 14.3-32 32-32l384 0c17.7 0 32 14.3 32 32s-14.3 32-32 32L32 288c-17.7 0-32-14.3-32-32zM448 416c0 17.7-14.3 32-32 32L32 448c-17.7 0-32-14.3-32-32s14.3-32 32-32l384 0c17.7 0 32 14.3 32 32z"]},Ft={prefix:"fas",iconName:"circle-info",icon:[512,512,["info-circle"],"f05a","M256 512a256 256 0 1 0 0-512 256 256 0 1 0 0 512zM224 160a32 32 0 1 1 64 0 32 32 0 1 1 -64 0zm-8 64l48 0c13.3 0 24 10.7 24 24l0 88 8 0c13.3 0 24 10.7 24 24s-10.7 24-24 24l-80 0c-13.3 0-24-10.7-24-24s10.7-24 24-24l24 0 0-64-24 0c-13.3 0-24-10.7-24-24s10.7-24 24-24z"]};const zt={class:"layer-panel"},Mt={key:0,class:"search-box"},It={key:1,class:"topics-container"},_t={class:"layer-row"},Dt=["href"],Ot={key:1,class:"metadata-placeholder"},Rt=["checked","disabled","onChange"],At={class:"layer-title"},Ut={key:0,class:"loading-indicator"},Zt=["title"],Wt={key:2,class:"zoom-indicator"},jt={key:0,class:"opacity-control"},qt={class:"opacity-label"},Gt=["value","onInput"],Ht={key:1,class:"layer-legend"},Jt={class:"legend-label"},Qt={key:0,class:"no-results"},Kt=e.defineComponent({__name:"LayerPanel",props:{layerList:{},visibleLayers:{},layerOpacities:{},loadingLayers:{},layerErrors:{},currentZoom:{},searchQuery:{},layerMetadata:{},mode:{default:"flat"},showSearch:{type:Boolean,default:!0},showOpacity:{type:Boolean,default:!0},showLegend:{type:Boolean,default:!0},searchPlaceholder:{default:"Search layers..."}},emits:["toggleLayer","setOpacity","updateSearch"],setup(t,{emit:r}){const n=t,o=r,a=e.computed(()=>{if(!n.searchQuery.trim())return n.layerList;const w=n.searchQuery.toLowerCase();return n.layerList.filter(y=>y.config.title.toLowerCase().includes(w))});function i(w){let y=w.split("?")[0]||w;return y=y.replace(/\/query$/,""),y=y.replace(/\/$/,""),y.toLowerCase()}function u(w){const y=i(w);return n.layerMetadata[y]||null}const p=e.computed(()=>n.layerList.some(w=>u(w.config.url)));function f(w){return n.visibleLayers.has(w)}function L(w){return n.layerOpacities[w]??1}function m(w){return n.loadingLayers.has(w)}function h(w){return n.layerErrors[w]||null}function c(w){const y=n.currentZoom,k=w.minZoom,x=w.maxZoom;return!(k!==void 0&&y<k||x!==void 0&&y>x)}const v=e.computed({get:()=>n.searchQuery,set:w=>o("updateSearch",w)});function N(w){o("toggleLayer",w)}function g(w,y){const k=y.target,x=parseFloat(k.value);o("setOpacity",w,x)}return(w,y)=>(e.openBlock(),e.createElementBlock("aside",zt,[t.showSearch?(e.openBlock(),e.createElementBlock("div",Mt,[e.createVNode(e.unref(xt),{modelValue:v.value,"onUpdate:modelValue":y[0]||(y[0]=k=>v.value=k),placeholder:t.searchPlaceholder,"class-name":"layer-search-field"},null,8,["modelValue","placeholder"])])):e.createCommentVNode("",!0),t.mode==="topics"?(e.openBlock(),e.createElementBlock("div",It,[e.renderSlot(w.$slots,"topics",{},()=>[y[2]||(y[2]=e.createElementVNode("div",{class:"no-topics"},' No topic components provided. Use the "topics" slot to add TopicAccordion components. ',-1))],!0)])):(e.openBlock(),e.createElementBlock("div",{key:2,class:e.normalizeClass(["layer-list",{"has-metadata":p.value}])},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(a.value,k=>(e.openBlock(),e.createElementBlock("div",{key:k.config.id,class:"layer-item"},[e.createElementVNode("div",_t,[u(k.config.url)?(e.openBlock(),e.createElementBlock("a",{key:0,href:u(k.config.url)||"",target:"_blank",rel:"noopener noreferrer",class:"metadata-link",title:"View metadata",onClick:y[1]||(y[1]=e.withModifiers(()=>{},["stop"]))},[e.createVNode(e.unref(Z.Icon),{"icon-definition":e.unref(Ft),size:"small",inline:"",decorative:""},null,8,["icon-definition"])],8,Dt)):p.value?(e.openBlock(),e.createElementBlock("span",Ot)):e.createCommentVNode("",!0),e.createElementVNode("label",{class:e.normalizeClass(["layer-checkbox",{"layer-unavailable":!c(k.config),"layer-error":h(k.config.id)}])},[e.createElementVNode("input",{type:"checkbox",checked:f(k.config.id),disabled:!c(k.config),onChange:x=>N(k.config.id)},null,40,Rt),e.createElementVNode("span",At,[e.createTextVNode(e.toDisplayString(k.config.title)+" ",1),m(k.config.id)?(e.openBlock(),e.createElementBlock("span",Ut," Loading... ")):e.createCommentVNode("",!0),h(k.config.id)?(e.openBlock(),e.createElementBlock("span",{key:1,class:"error-indicator",title:h(k.config.id)||""}," Error ",8,Zt)):e.createCommentVNode("",!0),c(k.config)?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("span",Wt," (zoom in) "))])],2)]),t.showOpacity&&f(k.config.id)?(e.openBlock(),e.createElementBlock("div",jt,[e.createElementVNode("label",qt," Opacity: "+e.toDisplayString(Math.round(L(k.config.id)*100))+"% ",1),e.createElementVNode("input",{type:"range",min:"0",max:"1",step:"0.05",value:L(k.config.id),class:"opacity-slider",onInput:x=>g(k.config.id,x)},null,40,Gt)])):e.createCommentVNode("",!0),t.showLegend&&f(k.config.id)&&k.config.legend?.length?(e.openBlock(),e.createElementBlock("ul",Ht,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(k.config.legend,(x,$)=>(e.openBlock(),e.createElementBlock("li",{key:$,class:"legend-item"},[x.type==="circle"?(e.openBlock(),e.createElementBlock("span",{key:0,class:"legend-symbol legend-circle",style:e.normalizeStyle({backgroundColor:x.color})},null,4)):x.type==="line"?(e.openBlock(),e.createElementBlock("span",{key:1,class:"legend-symbol legend-line",style:e.normalizeStyle({backgroundColor:x.color,height:`${x.width||2}px`})},null,4)):x.type==="fill"?(e.openBlock(),e.createElementBlock("span",{key:2,class:"legend-symbol legend-fill",style:e.normalizeStyle({backgroundColor:x.color})},null,4)):e.createCommentVNode("",!0),e.createElementVNode("span",Jt,e.toDisplayString(x.label),1)]))),128))])):e.createCommentVNode("",!0)]))),128)),a.value.length===0?(e.openBlock(),e.createElementBlock("div",Qt,' No layers match "'+e.toDisplayString(t.searchQuery)+'" ',1)):e.createCommentVNode("",!0)],2))]))}}),Qe=he(Kt,[["__scopeId","data-v-82d84fbe"]]);function T(t){if(!t||!Array.isArray(t)||t.length<3)return"#888888";const r=t[0],n=t[1],o=t[2],i=(t[3]??255)/255;return i===1?`#${r.toString(16).padStart(2,"0")}${n.toString(16).padStart(2,"0")}${o.toString(16).padStart(2,"0")}`:`rgba(${r}, ${n}, ${o}, ${i.toFixed(2)})`}function Q(t){return t!==void 0?t:1}const Xt=559082264;function qe(t){return!t||t<=0?null:Math.round(Math.log2(Xt/t)*100)/100}function Yt(t,r){const n={};if(t&&t>0){const o=qe(t);o!==null&&(n.minZoom=o)}if(r&&r>0){const o=qe(r);o!==null&&(n.maxZoom=o)}return n}function Be(t){if(!t)return"fill";switch(t.type){case"esriSFS":return"fill";case"esriSLS":return"line";case"esriSMS":return"circle";case"esriPMS":return"circle";case"esriPFS":return"fill";default:return"fill"}}function fe(t){return!(!t||t.style==="esriSLSNull"||t.color===null||t.width===0||t.color&&t.color[3]===0)}function Ie(t){return String(t)}function Ke(t,r,n){const o=t.symbol,a=Be(o);console.log("[Transformer] convertSimpleRenderer - geomType:",a,"symbol:",o);let i={},u=[],p=null;if(a==="fill"&&o){const f=o.color===null?0:o.color?.[3]??255,L=f===0?"rgba(0, 0, 0, 0)":T(o.color),m=f===0?0:f<255?1:Q(r);if(console.log(`[Transformer] Fill layer opacity calculation for "${n}":`,{symbolColor:o.color,fillAlpha:f,layerOpacity:r,fillOpacity:m,fillColor:L}),i={"fill-color":L,"fill-opacity":m},fe(o.outline)){const h=o.outline.width||1,c=T(o.outline.color);console.log("[Transformer] Fill layer with outline:",{fillAlpha:f,outlineWidth:h,outlineColor:c,willCreateOutlinePaint:h>1||f===0}),f!==0&&(i["fill-outline-color"]=c),(h>1||f===0)&&(p={"line-color":c,"line-width":h},console.log("[Transformer] Created outlinePaint:",p))}else console.log("[Transformer] No visible outline for fill layer, hasVisibleOutline returned false");u=[{type:"fill",color:T(o.color),label:t.label||"Feature"}]}else if(a==="line"&&o)i={"line-color":T(o.color),"line-width":o.width||1,"line-opacity":Q(r)},u=[{type:"line",color:T(o.color),width:o.width||1,label:t.label||"Feature"}];else if(a==="circle"&&o){const f=Math.round((o.size||6)*.71*100)/100;i={"circle-color":T(o.color),"circle-radius":f,"circle-opacity":Q(r)},fe(o.outline)&&(i["circle-stroke-color"]=T(o.outline.color),i["circle-stroke-width"]=o.outline.width||1),u=[{type:"circle",color:T(o.color),label:t.label||"Feature"}]}return{paint:i,legend:u,geomType:a,outlinePaint:p}}function eo(t,r,n){const o=t.field1,a=t.uniqueValueInfos||[],i=t.defaultSymbol;if(a.length===0)return Ke({...t,symbol:i},r);const u=a[0]?.symbol||i,p=Be(u);let f={},L=[],m=null;if(p==="fill"){const h=["match",["to-string",["get",o]]];for(const c of a){h.push(Ie(c.value)),h.push(T(c.symbol?.color));const v=String(c.value),g=n?.get(v)||c.label||v;L.push({type:"fill",color:T(c.symbol?.color),label:g})}if(h.push(i?T(i.color):"#888888"),f={"fill-color":h,"fill-opacity":Q(r)},fe(u?.outline)){const c=u.outline.width||1,v=T(u.outline.color);f["fill-outline-color"]=v,c>1&&(m={"line-color":v,"line-width":c})}}else if(p==="line"){const h=["match",["to-string",["get",o]]];for(const c of a){h.push(Ie(c.value)),h.push(T(c.symbol?.color));const v=String(c.value),g=n?.get(v)||c.label||v;L.push({type:"line",color:T(c.symbol?.color),width:c.symbol?.width||1,label:g})}h.push(i?T(i.color):"#888888"),f={"line-color":h,"line-width":u?.width||2,"line-opacity":Q(r)}}else if(p==="circle"){const h=["match",["to-string",["get",o]]];for(const v of a){h.push(Ie(v.value)),h.push(T(v.symbol?.color));const N=String(v.value),w=n?.get(N)||v.label||N;L.push({type:"circle",color:T(v.symbol?.color),label:w})}h.push(i?T(i.color):"#888888");const c=Math.round((u?.size||6)*.71*100)/100;f={"circle-color":h,"circle-radius":c,"circle-opacity":Q(r)},fe(u?.outline)&&(f["circle-stroke-color"]=T(u.outline.color),f["circle-stroke-width"]=u.outline.width||1)}return{paint:f,legend:L,geomType:p,outlinePaint:m}}function to(t,r){const n=t.field,o=t.classBreakInfos||[],a=t.visualVariables?.find(m=>m.type==="colorInfo");if(a?.stops&&a.stops.length>0)return oo(a,n,t,r);if(o.length===0)return{paint:{},legend:[],geomType:"fill",outlinePaint:null};const i=o[0]?.symbol,u=Be(i);let p={},f=[],L=null;if(u==="fill"){const m=["step",["get",n]];m.push(T(o[0]?.symbol?.color));for(let h=0;h<o.length;h++){const c=o[h];h>0&&(m.push(o[h-1].classMaxValue),m.push(T(c.symbol?.color))),f.push({type:"fill",color:T(c.symbol?.color),label:c.label||`${c.classMaxValue}`})}if(p={"fill-color":m,"fill-opacity":Q(r)},fe(i?.outline)){const h=i.outline.width||1,c=T(i.outline.color);p["fill-outline-color"]=c,h>1&&(L={"line-color":c,"line-width":h})}}else if(u==="line"){const m=["step",["get",n]];m.push(T(o[0]?.symbol?.color));let h=t.minValue??0;for(let v=0;v<o.length;v++){const N=o[v];v>0&&(m.push(o[v-1].classMaxValue),m.push(T(N.symbol?.color))),f.push({type:"line",color:T(N.symbol?.color),width:N.symbol?.width||i?.width||2,label:N.label||`${h} - ${N.classMaxValue}`}),h=N.classMaxValue+1}const c=i?.width||2;p={"line-color":m,"line-width":c,"line-opacity":Q(r)}}return{paint:p,legend:f,geomType:u,outlinePaint:L}}function oo(t,r,n,o){const a=t.stops||[];if(a.length===0)return{paint:{},legend:[],geomType:"fill",outlinePaint:null};const i=n.classBreakInfos?.[0]?.symbol||n.defaultSymbol,u=Be(i);let p={},f=[],L=null;if(u==="fill"){const m=["interpolate",["linear"],["get",r]];for(const c of a)m.push(c.value),m.push(T(c.color)),f.push({type:"fill",color:T(c.color),label:c.label||`${c.value}`});if(p={"fill-color":["case",["==",["get",r],null],"rgba(0, 0, 0, 0)",m],"fill-opacity":Q(o)},fe(i?.outline)){const c=i.outline.width||1,v=T(i.outline.color);p["fill-outline-color"]=v,c>1&&(L={"line-color":v,"line-width":c})}}return{paint:p,legend:f,geomType:u,outlinePaint:L}}function no(t,r,n,o){if(!t?.renderer)return console.warn("[Transformer] No renderer found in drawingInfo - layer will use service default (not available in WebMap)"),{paint:{},legend:[],geomType:"fill",outlinePaint:null};const a=t.renderer;switch(a.type){case"simple":return Ke(a,r,o);case"uniqueValue":return eo(a,r,n);case"classBreaks":return to(a,r);default:return console.warn(`Unknown renderer type: ${a.type}`),{paint:{},legend:[],geomType:"fill",outlinePaint:null}}}function ro(t){if(!t)return null;const r=t.title||"",o=(t.fieldInfos||[]).filter(a=>a.visible===!0).map(a=>{const i={field:a.fieldName,label:a.label||a.fieldName};return a.format&&(i.format={},a.format.dateFormat&&(i.format.dateFormat=a.format.dateFormat),a.format.digitSeparator!==void 0&&(i.format.digitSeparator=a.format.digitSeparator),a.format.places!==void 0&&(i.format.places=a.format.places),Object.keys(i.format).length===0&&delete i.format),i});return{title:r,fields:o}}function lo(t){return t?.definitionExpression}function ao(t){return(t.includes("_")?t.split("_").slice(1).join(" "):t).toLowerCase().replace(/[^a-z0-9]+/g,"-").replace(/^-|-$/g,"")}function io(t){return t.includes("_")?t.split("_").slice(1).join(" "):t}function so(t){const r=new Map;if(!t)return r;const n=t.split(`
+`),o=/^(\d{1,3})\s+(.+)$/;for(const a of n){const i=a.trim().match(o);if(i){const[,u,p]=i;u&&p&&r.set(u,p.trim())}}return r}async function co(t){try{console.log(`[Transformer] Fetching service metadata from: ${t}`);const r=await fetch(`${t}?f=json`);if(!r.ok)return console.warn(`[Transformer] Failed to fetch service metadata: ${r.status}`),null;const n=await r.json();return n.drawingInfo?{drawingInfo:n.drawingInfo,description:n.description}:null}catch(r){return console.error("[Transformer] Error fetching service metadata:",r),null}}async function De(t){const r=t.operationalLayers||[],n=[],o=["Zoning and Planning_Land Use"];console.log("🔄 [Transformer] ===== STARTING FRESH TRANSFORMATION ====="),console.log("[Transformer] Starting transformation of",r.length,"layers");for(const a of r){if(!a.url){console.log(`Skipping layer without URL: ${a.title}`);continue}if(a.itemId==="4f39b829b96d437da9231727d9c91fab"){console.log(`Skipping layer with under-construction itemId: ${a.title}`);continue}console.log("[Transformer] Processing layer:",a.title),console.log(`[Transformer] Layer "${a.title}" - Renderer type:`,a.layerDefinition?.drawingInfo?.renderer?.type);try{let i=a.layerDefinition?.drawingInfo,u;const p=!i||!i.renderer,f=o.includes(a.title);if((p||f)&&a.url){console.log(f?`[Transformer] Layer "${a.title}" configured to use service renderer instead of WebMap renderer`:`[Transformer] Layer "${a.title}" has no renderer in WebMap, fetching from service...`);const $=await co(a.url);$?(i=$.drawingInfo,console.log(`[Transformer] Fetched renderer from service for "${a.title}":`,$.drawingInfo?.renderer?.type),$.description&&(u=so($.description),u.size>0&&console.log(`[Transformer] Parsed ${u.size} custom labels from service description`))):console.warn(`[Transformer] Failed to fetch renderer from service for "${a.title}"`)}const{paint:L,legend:m,geomType:h,outlinePaint:c}=no(i,a.opacity,u,a.title);console.log(`[Transformer] Layer "${a.title}" - Result: geomType=${h}, hasOutlinePaint=${!!c}`);const v=ro(a.popupInfo),N=lo(a.layerDefinition),g=Yt(a.layerDefinition?.minScale,a.layerDefinition?.maxScale),w=ao(a.title),y=io(a.title);let k=a.opacity??1;const x={id:w,title:y,type:h,url:a.url,opacity:k,paint:L,legend:m,popup:v};N&&(x.where=N),g.minZoom!==void 0&&(x.minZoom=g.minZoom),g.maxZoom!==void 0&&(x.maxZoom=g.maxZoom),c&&(x.outlinePaint=c),n.push(x)}catch(i){console.error(`Error transforming layer ${a.title}:`,i)}}return n.sort((a,i)=>a.title.localeCompare(i.title)),n}const Ge={},Oe="376af635c84643cd816a8c5d017a53aa",uo=Oe;function ge(t,r){let n=`https://www.arcgis.com/sharing/rest/content/items/${t}/data?f=json`;return r&&(n+=`&token=${r}`),n}function fo(){return ge(Oe)}const Se=new Map,ye=new Map;function Xe(t){t?(Se.delete(t),ye.delete(t)):(Se.clear(),ye.clear())}let we,He=0;async function po(){const t=typeof{url:typeof document>"u"?require("url").pathToFileURL(__filename).href:ue&&ue.tagName.toUpperCase()==="SCRIPT"&&ue.src||new URL("index.js",document.baseURI).href}<"u"&&Ge?.VITE_AGO_USERNAME,r=typeof{url:typeof document>"u"?require("url").pathToFileURL(__filename).href:ue&&ue.tagName.toUpperCase()==="SCRIPT"&&ue.src||new URL("index.js",document.baseURI).href}<"u"&&Ge?.VITE_AGO_PASSWORD;if(!(!t||!r)){if(we&&Date.now()<He-3e5)return console.log("[LayerConfigService] Using cached ArcGIS token"),we;console.log("[LayerConfigService] Generating new ArcGIS token...");try{const o=await(await fetch("https://www.arcgis.com/sharing/rest/generateToken",{method:"POST",headers:{"Content-Type":"application/x-www-form-urlencoded"},body:new URLSearchParams({f:"json",username:t,password:r,referer:window.location.origin||"https://localhost",expiration:"120"})})).json();if(o.error){console.error("[LayerConfigService] Failed to generate token:",o.error);return}return we=o.token,He=o.expires,console.log("[LayerConfigService] ArcGIS token generated successfully"),we}catch(n){console.error("[LayerConfigService] Error generating ArcGIS token:",n);return}}}async function mo(t,r){const n=ge(t,r);console.log(`[LayerConfigService] Fetching WebMap from: ${ge(t)}${r?" (with token)":""}`);const o=await fetch(n);if(!o.ok)throw new Error(`Failed to fetch WebMap: ${o.status} ${o.statusText}`);const a=await o.json();if(a.error)throw new Error(`ArcGIS error: ${a.error.message||a.error.code||"Unknown error"}`);return a}async function yo(t){try{console.log(`[LayerConfigService] Loading configs in DYNAMIC mode for WebMap: ${t}`);const r=await po(),n=await mo(t,r);console.log("[LayerConfigService] Transforming WebMap to layer configs");const o=await De(n);return console.log(`[LayerConfigService] Successfully loaded ${o.length} layer configs`),o}catch(r){throw console.error("[LayerConfigService] Error loading dynamic configs:",r),new Error(`Failed to load dynamic layer configs: ${r instanceof Error?r.message:"Unknown error"}`)}}async function Ce(t=Oe){const r=Se.get(t);if(r)return console.log(`[LayerConfigService] ⚠️ Returning CACHED configs for ${t} (transformer will NOT run)`),console.log("[LayerConfigService] To force refresh, call clearCache() or reload with Ctrl+Shift+R"),r;const n=ye.get(t);if(n)return console.log(`[LayerConfigService] Load already in progress for ${t}, waiting...`),n;console.log(`[LayerConfigService] Mode: dynamic, WebMap: ${t}`);const o=(async()=>{try{const a=await yo(t);return Se.set(t,a),a}finally{ye.delete(t)}})();return ye.set(t,o),o}function Ye(t){const r=e.ref({}),n=new Map;for(const c of t)r.value[c.id]={data:null,loading:!1,error:null,lastFetched:null};async function o(c){const v=c.id;r.value={...r.value,[v]:{data:r.value[v]?.data??null,lastFetched:r.value[v]?.lastFetched??null,loading:!0,error:null}};try{let N;if(c.type==="http-get"){const g=await fetch(c.url,{method:"GET",...c.options});if(!g.ok)throw new Error(`HTTP ${g.status}: ${g.statusText}`);N=await g.json()}else if(c.type==="http-post"){const g=await fetch(c.url,{method:"POST",...c.options});if(!g.ok)throw new Error(`HTTP ${g.status}: ${g.statusText}`);N=await g.json()}else if(c.type==="esri"){const w=`${c.url.replace(/\/$/,"")}/query?where=1%3D1&outFields=*&returnGeometry=false&f=json`,y=await fetch(w,c.options);if(!y.ok)throw new Error(`HTTP ${y.status}: ${y.statusText}`);N=(await y.json()).features?.map(x=>x.attributes)||[]}else throw new Error(`Unknown data source type: ${c.type}`);c.transform&&(N=c.transform(N)),r.value={...r.value,[v]:{data:N,loading:!1,error:null,lastFetched:Date.now()}}}catch(N){const g=N instanceof Error?N.message:"Unknown error";console.error(`Failed to fetch data source "${v}":`,g),r.value={...r.value,[v]:{data:r.value[v]?.data??null,lastFetched:r.value[v]?.lastFetched??null,loading:!1,error:g}}}}async function a(){await Promise.all(t.map(c=>o(c)))}async function i(c){const v=t.find(N=>N.id===c);v?await o(v):console.warn(`Data source "${c}" not found`)}function u(c){return r.value[c]?.data??null}const p=e.computed(()=>Object.values(r.value).some(c=>c.loading));function f(c){return r.value[c]?.loading??!1}function L(c){return r.value[c]?.error??null}function m(){for(const c of t)if(c.pollInterval&&c.pollInterval>0){const v=window.setInterval(()=>{o(c)},c.pollInterval);n.set(c.id,v)}}function h(){for(const[,c]of n)window.clearInterval(c);n.clear()}return e.onMounted(()=>{a(),m()}),e.onUnmounted(()=>{h()}),{state:e.readonly(r),isLoading:p,fetchAll:a,refetch:i,getData:u,isSourceLoading:f,getError:L,stopPolling:h}}const go={class:"layerboard-layout"},ho={key:0,class:"layerboard-subtitle"},vo={class:"layerboard-mobile-menu-content"},bo={class:"layerboard-main"},ko={key:0,class:"layerboard-loading"},Lo={key:1,class:"layerboard-error"},wo={key:0},So={key:1},Co={class:"layerboard-modal"},Eo=e.defineComponent({__name:"Layerboard",props:{title:{},subtitle:{},webMapId:{},themeColor:{default:"#0f4d90"},cyclomediaConfig:{},pictometryCredentials:{},showDefaultSidebar:{type:Boolean,default:!0},sidebarWidth:{default:"30%"},sidebarLabel:{default:"Layers"},mapLabel:{default:"Map"},fetchMetadata:{type:Boolean,default:!1},tiledLayers:{default:()=>[]},dataSources:{default:()=>[]},layerStyleOverrides:{default:()=>({})},basemapControlPosition:{default:"top-right"},navigationControlPosition:{default:"bottom-right"},geolocationControlPosition:{default:"bottom-right"},searchControlPosition:{default:"top-left"},drawControlPosition:{default:"bottom-left"},cyclomediaButtonPosition:{default:"top-right"},pictometryButtonPosition:{default:"top-right"},initialZoom:{},initialCenter:{}},emits:["configs-loaded","load-error","zoom"],setup(t,{expose:r,emit:n}){const o=t,a=n,i=e.ref([]),u=e.ref(!0),p=e.ref(null),f=e.ref(12),L=e.ref(""),m=e.ref(new Set),h=e.ref({}),c=e.ref(new Set),v=e.ref({}),N=e.ref({}),g=e.ref(new Set),w=e.ref({});function y(){const b={};for(const C of o.tiledLayers)b[C.id]=C.opacity??1;w.value=b}function k(b){g.value.has(b)?g.value.delete(b):g.value.add(b),g.value=new Set(g.value)}function x(b,C){C?g.value.add(b):g.value.delete(b),g.value=new Set(g.value)}function $(b,C){w.value={...w.value,[b]:C}}const F=o.dataSources.length>0?Ye(o.dataSources):null,_=e.computed(()=>F?.state.value??{}),J=e.computed(()=>F?.isLoading.value??!1);function re(b){return F?.getData(b)??null}function le(b){return F?.refetch(b)??Promise.resolve()}e.provide("layerboard-layers",e.readonly(i)),e.provide("layerboard-visible",m),e.provide("layerboard-opacities",h),e.provide("layerboard-loading",e.readonly(c)),e.provide("layerboard-errors",e.readonly(v)),e.provide("layerboard-zoom",e.readonly(f)),e.provide("layerboard-toggle-layer",ae),e.provide("layerboard-set-layer-visible",K),e.provide("layerboard-set-layers-visible",ie),e.provide("layerboard-set-opacity",X),e.provide("layerboard-tiled-layers",e.readonly(e.computed(()=>o.tiledLayers))),e.provide("layerboard-visible-tiled",g),e.provide("layerboard-tiled-opacities",w),e.provide("layerboard-toggle-tiled",k),e.provide("layerboard-set-tiled-opacity",$),e.provide("layerboard-set-tiled-visible",x),e.provide("layerboard-data-sources-state",_),e.provide("layerboard-data-sources-loading",J),e.provide("layerboard-get-data-source",re),e.provide("layerboard-refetch-data-source",le);const $e=e.computed(()=>({backgroundColor:o.themeColor})),Ne=e.computed(()=>({backgroundColor:o.themeColor})),pe=e.computed(()=>({backgroundColor:o.themeColor})),ve=e.computed(()=>({width:ee.value?"0":o.sidebarWidth}));async function me(){try{u.value=!0,p.value=null;const C=(await Ce(o.webMapId)).map(z=>{const A=o.layerStyleOverrides[z.id];return A?(console.log(`[Layerboard] Applying style override for layer: ${z.id}`),{...z,paint:A.paint??z.paint,outlinePaint:A.outlinePaint??z.outlinePaint,legend:A.legend??z.legend,type:A.type??z.type}):z});i.value=C.map(z=>({config:z,component:z.type}));const H={};C.forEach(z=>{H[z.id]=z.opacity??1}),h.value=H,console.log(`[Layerboard] Loaded ${C.length} layer configs from WebMap ${o.webMapId}`),console.log("[Layerboard] Layer IDs:",C.map(z=>z.id)),a("configs-loaded",C)}catch(b){console.error("[Layerboard] Failed to load layer configs:",b);const C=b instanceof Error?b.message:"Failed to load layer configurations";p.value=C,a("load-error",C)}finally{u.value=!1}}function be(b){let C=b.split("?")[0]||b;return C=C.replace(/\/query$/,""),C=C.replace(/\/$/,""),C.toLowerCase()}async function xe(){if(o.fetchMetadata)try{const b="https://phl.carto.com/api/v2/sql?q="+encodeURIComponent("select url_text, COALESCE(representation, '') as representation from phl.knack_metadata_reps_endpoints_join WHERE ( format = 'API' OR format = 'GeoService' ) AND url_text IS NOT null"),C=await fetch(b);if(!C.ok)return;const H=await C.json(),z={};for(const A of H.rows||[])if(A.url_text&&A.representation){const Fe=be(A.url_text),ze=`https://metadata.phila.gov/#home/representationdetails/${A.representation}/`;z[Fe]=ze}N.value=z}catch(b){console.error("[Layerboard] Error fetching metadata:",b)}}function Pe(b){f.value=b,a("zoom",b)}function ae(b){m.value.has(b)?m.value.delete(b):m.value.add(b),m.value=new Set(m.value)}function K(b,C){C?m.value.add(b):m.value.delete(b),m.value=new Set(m.value)}function ie(b,C){for(const H of b)C?m.value.add(H):m.value.delete(H);m.value=new Set(m.value)}function X(b,C){h.value={...h.value,[b]:C}}function Te(b,C){C?c.value.add(b):c.value.delete(b),c.value=new Set(c.value)}function j(b,C){if(C)v.value={...v.value,[b]:C};else{const{[b]:H,...z}=v.value;v.value=z}}function Y(b){L.value=b}const R=e.ref("map");function se(){R.value=R.value==="sidebar"?"map":"sidebar"}const oe=e.ref(!1);function Ve(){oe.value=!oe.value}function ke(){oe.value=!1}const ee=e.ref(!1);function ce(){ee.value=!ee.value}const W=e.ref(!1);function ne(){W.value=!0}function G(){W.value=!1}function Le(b){b.target.classList.contains("layerboard-modal-backdrop")&&G()}return e.provide("layerboard-open-modal",ne),e.provide("layerboard-close-modal",G),e.provide("layerboard-is-modal-open",e.readonly(W)),r({layerList:i,visibleLayers:m,layerOpacities:h,loadingLayers:c,layerErrors:v,currentZoom:f,toggleLayer:ae,setLayerVisible:K,setLayersVisible:ie,setLayerOpacity:X,reloadConfigs:me,clearCache:()=>Xe(o.webMapId),visibleTiledLayers:g,tiledLayerOpacities:w,toggleTiledLayer:k,setTiledLayerVisible:x,setTiledLayerOpacity:$,dataSourcesState:_,dataSourcesLoading:J,getDataSourceData:re,refetchDataSource:le,isModalOpen:W,openModal:ne,closeModal:G}),e.onMounted(()=>{me(),xe(),y()}),(b,C)=>(e.openBlock(),e.createElementBlock("div",go,[e.createElementVNode("header",{class:"layerboard-header",style:e.normalizeStyle($e.value)},[C[1]||(C[1]=e.createElementVNode("a",{href:"https://www.phila.gov/",class:"layerboard-logo layerboard-desktop-only"},[e.createElementVNode("img",{src:"https://standards.phila.gov/img/logo/city-of-philadelphia-yellow-white.png",alt:"City of Philadelphia"})],-1)),C[2]||(C[2]=e.createElementVNode("span",{class:"layerboard-header-divider layerboard-desktop-only"},null,-1)),e.createElementVNode("button",{class:"layerboard-hamburger layerboard-mobile-only",onClick:Ve,"aria-label":"Toggle menu"},[e.createVNode(e.unref(Z.Icon),{"icon-definition":e.unref(Vt),size:"medium",decorative:""},null,8,["icon-definition"])]),e.renderSlot(b.$slots,"header",{},()=>[e.createElementVNode("h1",null,e.toDisplayString(t.title),1),t.subtitle?(e.openBlock(),e.createElementBlock("span",ho,e.toDisplayString(t.subtitle),1)):e.createCommentVNode("",!0)],!0),oe.value?(e.openBlock(),e.createElementBlock("div",{key:0,class:"layerboard-mobile-menu",style:e.normalizeStyle({backgroundColor:t.themeColor})},[e.createElementVNode("div",vo,[e.renderSlot(b.$slots,"footer",{openModal:ne,closeModal:G,isModalOpen:W.value},()=>[C[0]||(C[0]=e.createTextVNode(" City of Philadelphia ",-1))],!0)]),e.createElementVNode("button",{class:"layerboard-mobile-menu-close",onClick:ke,"aria-label":"Close menu"},[e.createVNode(e.unref(Z.Icon),{"icon-definition":e.unref(je),size:"medium",decorative:""},null,8,["icon-definition"])])],4)):e.createCommentVNode("",!0),oe.value?(e.openBlock(),e.createElementBlock("div",{key:1,class:"layerboard-mobile-menu-backdrop",onClick:ke})):e.createCommentVNode("",!0)],4),e.createElementVNode("div",bo,[u.value?(e.openBlock(),e.createElementBlock("div",ko,[e.createElementVNode("div",{class:"layerboard-spinner",style:e.normalizeStyle({borderTopColor:t.themeColor})},null,4),e.createElementVNode("p",null,"Loading "+e.toDisplayString(t.title)+"...",1)])):p.value?(e.openBlock(),e.createElementBlock("div",Lo,[C[3]||(C[3]=e.createElementVNode("h2",null,"Error Loading Layers",-1)),e.createElementVNode("p",null,e.toDisplayString(p.value),1),e.createElementVNode("button",{class:"layerboard-retry-button",style:e.normalizeStyle({backgroundColor:t.themeColor}),onClick:me}," Retry ",4)])):(e.openBlock(),e.createElementBlock(e.Fragment,{key:2},[e.createElementVNode("aside",{class:e.normalizeClass(["layerboard-sidebar",{"is-active":R.value==="sidebar"}]),style:e.normalizeStyle(ve.value)},[e.renderSlot(b.$slots,"sidebar",{layers:i.value,visibleLayers:m.value,layerOpacities:h.value,loadingLayers:c.value,layerErrors:v.value,currentZoom:f.value,toggleLayer:ae,setLayerVisible:K,setLayersVisible:ie,setOpacity:X,tiledLayers:t.tiledLayers,visibleTiledLayers:g.value,tiledLayerOpacities:w.value,toggleTiledLayer:k,setTiledLayerVisible:x,setTiledLayerOpacity:$,dataSourcesState:_.value,dataSourcesLoading:J.value,getDataSource:re,refetchDataSource:le},()=>[t.showDefaultSidebar?(e.openBlock(),e.createBlock(Qe,{key:0,"layer-list":i.value,"visible-layers":m.value,"layer-opacities":h.value,"loading-layers":c.value,"layer-errors":v.value,"current-zoom":f.value,"search-query":L.value,"layer-metadata":N.value,onToggleLayer:ae,onSetOpacity:X,onUpdateSearch:Y},null,8,["layer-list","visible-layers","layer-opacities","loading-layers","layer-errors","current-zoom","search-query","layer-metadata"])):e.createCommentVNode("",!0)],!0)],6),e.createElementVNode("div",{class:e.normalizeClass(["layerboard-map",{"is-active":R.value==="map"}])},[e.createVNode(Je,{"visible-layers":m.value,"layer-opacities":h.value,"layer-list":i.value,"tiled-layers":t.tiledLayers,"visible-tiled-layers":g.value,"tiled-layer-opacities":w.value,"cyclomedia-config":t.cyclomediaConfig,"pictometry-credentials":t.pictometryCredentials,"basemap-control-position":t.basemapControlPosition,"navigation-control-position":t.navigationControlPosition,"geolocation-control-position":t.geolocationControlPosition,"search-control-position":t.searchControlPosition,"draw-control-position":t.drawControlPosition,"cyclomedia-button-position":t.cyclomediaButtonPosition,"pictometry-button-position":t.pictometryButtonPosition,"initial-zoom":t.initialZoom,"initial-center":t.initialCenter,onZoom:Pe,onLayerLoading:Te,onLayerError:j},null,8,["visible-layers","layer-opacities","layer-list","tiled-layers","visible-tiled-layers","tiled-layer-opacities","cyclomedia-config","pictometry-credentials","basemap-control-position","navigation-control-position","geolocation-control-position","search-control-position","draw-control-position","cyclomedia-button-position","pictometry-button-position","initial-zoom","initial-center"])],2),e.createElementVNode("button",{class:e.normalizeClass(["layerboard-sidebar-toggle",{"is-collapsed":ee.value}]),style:e.normalizeStyle({left:ee.value?"0":o.sidebarWidth}),onClick:ce,"aria-label":"Toggle sidebar"},[e.createVNode(e.unref(Z.Icon),{"icon-definition":ee.value?e.unref(Pt):e.unref(Tt),size:"medium",decorative:""},null,8,["icon-definition"])],6)],64))]),e.createElementVNode("button",{class:"layerboard-mobile-toggle",style:e.normalizeStyle(pe.value),onClick:se},[R.value==="map"?(e.openBlock(),e.createElementBlock("span",wo,e.toDisplayString(t.sidebarLabel),1)):(e.openBlock(),e.createElementBlock("span",So,e.toDisplayString(t.mapLabel),1))],4),e.createElementVNode("footer",{class:"layerboard-footer",style:e.normalizeStyle(Ne.value)},[e.renderSlot(b.$slots,"footer",{openModal:ne,closeModal:G,isModalOpen:W.value},()=>[C[4]||(C[4]=e.createTextVNode(" City of Philadelphia ",-1))],!0)],4),W.value?(e.openBlock(),e.createElementBlock("div",{key:0,class:"layerboard-modal-backdrop",onClick:Le},[e.createElementVNode("div",Co,[e.createElementVNode("button",{class:"layerboard-modal-close",onClick:G,"aria-label":"Close modal"},[e.createVNode(e.unref(Z.Icon),{"icon-definition":e.unref(je),size:"medium",decorative:""},null,8,["icon-definition"])]),e.renderSlot(b.$slots,"modal",{closeModal:G},void 0,!0)])])):e.createCommentVNode("",!0)]))}}),Bo=he(Eo,[["__scopeId","data-v-02a74c3a"]]),$o=["aria-expanded"],No={key:0,class:"topic-icon"},xo={class:"topic-title"},Po={class:"topic-content"},To=e.defineComponent({__name:"TopicAccordion",props:{title:{},icon:{},expanded:{type:Boolean,default:!1},layerIds:{default:()=>[]},headerClass:{}},emits:["toggle","layerChange"],setup(t,{emit:r}){const n=t,o=r,a=e.ref(n.expanded);e.watch(()=>n.expanded,u=>{a.value=u});function i(){a.value=!a.value,o("toggle",a.value)}return(u,p)=>{const f=e.resolveComponent("font-awesome-icon");return e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["topic-accordion",{"is-expanded":a.value}])},[e.createElementVNode("button",{class:e.normalizeClass(["topic-header",t.headerClass]),type:"button","aria-expanded":a.value,onClick:i},[t.icon||u.$slots.icon?(e.openBlock(),e.createElementBlock("span",No,[e.renderSlot(u.$slots,"icon",{},()=>[t.icon?(e.openBlock(),e.createBlock(f,{key:0,icon:["fas",t.icon]},null,8,["icon"])):e.createCommentVNode("",!0)],!0)])):e.createCommentVNode("",!0),e.createElementVNode("span",xo,e.toDisplayString(t.title),1),e.createElementVNode("span",{class:e.normalizeClass(["topic-chevron",{"is-rotated":a.value}])},[...p[0]||(p[0]=[e.createElementVNode("svg",{xmlns:"http://www.w3.org/2000/svg",width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round"},[e.createElementVNode("polyline",{points:"6 9 12 15 18 9"})],-1)])],2)],10,$o),e.withDirectives(e.createElementVNode("div",Po,[e.renderSlot(u.$slots,"default",{},()=>[p[1]||(p[1]=e.createElementVNode("p",{class:"topic-empty"},"No content provided for this topic.",-1))],!0)],512),[[e.vShow,a.value]])],2)}}}),Vo=he(To,[["__scopeId","data-v-fb48c75b"]]),Fo={class:"layer-checkbox-set"},zo=["checked","disabled","onChange"],Mo={class:"layer-title"},Io={key:0,class:"loading-indicator"},_o=["title"],Do={key:2,class:"zoom-indicator"},Oo={class:"layer-title"},Ro={key:0,class:"loading-indicator"},Ao=["title"],Uo={key:2,class:"zoom-indicator"},Zo={key:2,class:"opacity-control"},Wo={class:"opacity-label"},jo=["value","onInput"],qo={key:3,class:"layer-legend"},Go={class:"legend-label"},Ho={key:0,class:"empty-state"},Jo=e.defineComponent({__name:"LayerCheckboxSet",props:{layers:{},visibleLayerIds:{},layerOpacities:{default:()=>({})},loadingLayerIds:{default:()=>new Set},layerErrors:{default:()=>({})},currentZoom:{default:12},showOpacity:{type:Boolean,default:!0},showLegend:{type:Boolean,default:!0}},emits:["toggleLayer","setOpacity"],setup(t,{emit:r}){const n=t,o=r;function a(g){return n.visibleLayerIds.has(g)}function i(g){return n.layerOpacities[g]??1}function u(g){return n.loadingLayerIds.has(g)}function p(g){return n.layerErrors[g]||null}function f(g){const w=n.currentZoom,y=g.minZoom,k=g.maxZoom;return!(y!==void 0&&w<y||k!==void 0&&w>k)}function L(g){return g.displayOptions?.shouldShowCheckbox!==!1}function m(g){return n.showOpacity?g.displayOptions?.shouldShowSlider!==!1:!1}function h(g){return n.showLegend?g.displayOptions?.shouldShowLegendBox!==!1:!1}function c(g){return g.displayOptions?.layerNameChange||g.title}function v(g){o("toggleLayer",g)}function N(g,w){const y=w.target;o("setOpacity",g,parseFloat(y.value))}return(g,w)=>(e.openBlock(),e.createElementBlock("div",Fo,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.layers,y=>(e.openBlock(),e.createElementBlock("div",{key:y.id,class:"layer-item"},[L(y)?(e.openBlock(),e.createElementBlock("label",{key:0,class:e.normalizeClass(["layer-checkbox",{"layer-unavailable":!f(y),"layer-error":p(y.id)}])},[e.createElementVNode("input",{type:"checkbox",checked:a(y.id),disabled:!f(y),onChange:k=>v(y.id)},null,40,zo),e.createElementVNode("span",Mo,[e.createTextVNode(e.toDisplayString(c(y))+" ",1),u(y.id)?(e.openBlock(),e.createElementBlock("span",Io," Loading... ")):e.createCommentVNode("",!0),p(y.id)?(e.openBlock(),e.createElementBlock("span",{key:1,class:"error-indicator",title:p(y.id)||""}," Error ",8,_o)):e.createCommentVNode("",!0),f(y)?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("span",Do," (zoom in) "))])],2)):(e.openBlock(),e.createElementBlock("div",{key:1,class:e.normalizeClass(["layer-label-only",{"layer-unavailable":!f(y),"layer-error":p(y.id)}])},[e.createElementVNode("span",Oo,[e.createTextVNode(e.toDisplayString(c(y))+" ",1),u(y.id)?(e.openBlock(),e.createElementBlock("span",Ro," Loading... ")):e.createCommentVNode("",!0),p(y.id)?(e.openBlock(),e.createElementBlock("span",{key:1,class:"error-indicator",title:p(y.id)||""}," Error ",8,Ao)):e.createCommentVNode("",!0),f(y)?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("span",Uo," (zoom in) "))])],2)),m(y)&&a(y.id)?(e.openBlock(),e.createElementBlock("div",Zo,[e.createElementVNode("label",Wo," Opacity: "+e.toDisplayString(Math.round(i(y.id)*100))+"% ",1),e.createElementVNode("input",{type:"range",min:"0",max:"1",step:"0.05",value:i(y.id),class:"opacity-slider",onInput:k=>N(y.id,k)},null,40,jo)])):e.createCommentVNode("",!0),h(y)&&a(y.id)&&y.legend?.length?(e.openBlock(),e.createElementBlock("ul",qo,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(y.legend,(k,x)=>(e.openBlock(),e.createElementBlock("li",{key:x,class:"legend-item"},[k.type==="circle"?(e.openBlock(),e.createElementBlock("span",{key:0,class:"legend-symbol legend-circle",style:e.normalizeStyle({backgroundColor:k.color})},null,4)):k.type==="line"?(e.openBlock(),e.createElementBlock("span",{key:1,class:"legend-symbol legend-line",style:e.normalizeStyle({backgroundColor:k.color,height:`${k.width||2}px`})},null,4)):k.type==="fill"?(e.openBlock(),e.createElementBlock("span",{key:2,class:"legend-symbol legend-fill",style:e.normalizeStyle({backgroundColor:k.color})},null,4)):e.createCommentVNode("",!0),e.createElementVNode("span",Go,e.toDisplayString(k.label),1)]))),128))])):e.createCommentVNode("",!0)]))),128)),t.layers.length===0?(e.openBlock(),e.createElementBlock("div",Ho," No layers available ")):e.createCommentVNode("",!0)]))}}),Qo=he(Jo,[["__scopeId","data-v-cc5e50fd"]]);function Ko(t){const r=e.ref([]),n=e.ref(new Set),o=e.ref({}),a=e.ref(new Set),i=e.ref({}),u=e.ref(""),p=e.ref(!1),f=e.ref(!1),L=e.ref(null),m=e.computed(()=>{if(!u.value.trim())return r.value;const $=u.value.toLowerCase();return r.value.filter(F=>F.title.toLowerCase().includes($))}),h=e.computed(()=>r.value.map($=>({config:$,component:$.type})));async function c(){if(f.value){console.warn("[useLayerboard] Already initialized");return}p.value=!0,L.value=null;try{let $;t.mode==="dynamic"||!t.mode?t.webMapId?$=await v(t.webMapId):$=await Ce():$=await Ce(),r.value=$;const F={};$.forEach(_=>{F[_.id]=_.opacity??1}),o.value=F,f.value=!0,console.log(`[useLayerboard] Initialized with ${$.length} layers`)}catch($){L.value=$ instanceof Error?$:new Error("Failed to initialize layerboard"),console.error("[useLayerboard] Initialization error:",$)}finally{p.value=!1}}async function v($){const F=ge($);console.log(`[useLayerboard] Fetching WebMap from: ${F}`);const _=await fetch(F);if(!_.ok)throw new Error(`Failed to fetch WebMap: ${_.status} ${_.statusText}`);const J=await _.json();return De(J)}function N($){const F=new Set(n.value);F.has($)?F.delete($):F.add($),n.value=F}function g($,F){o.value={...o.value,[$]:Math.max(0,Math.min(1,F))}}function w($){u.value=$}function y($,F){const _=new Set(a.value);F?_.add($):_.delete($),a.value=_}function k($,F){if(F)i.value={...i.value,[$]:F};else{const{[$]:_,...J}=i.value;i.value=J}}function x(){r.value=[],n.value=new Set,o.value={},a.value=new Set,i.value={},u.value="",p.value=!1,f.value=!1,L.value=null}return{layerConfigs:e.readonly(r),visibleLayers:e.readonly(n),layerOpacities:e.readonly(o),loadingLayers:e.readonly(a),layerErrors:e.readonly(i),searchQuery:e.readonly(u),isLoading:e.readonly(p),isInitialized:e.readonly(f),error:e.readonly(L),filteredLayerConfigs:m,layerList:h,config:t,initialize:c,toggleLayer:N,setLayerOpacity:g,filterLayers:w,setLayerLoading:y,setLayerError:k,reset:x}}function Xo(){const t=e.ref([]),r=e.ref(new Set),n=e.ref(new Set);function o(i){r.value.has(i)?r.value.delete(i):r.value.add(i)}function a(i){t.value=i}return{layers:e.computed(()=>t.value),visibleLayerIds:e.computed(()=>r.value),loadingLayerIds:e.computed(()=>n.value),toggleLayer:o,setLayers:a}}function et(t){const r=e.ref(null),n=e.ref(!1),o=e.ref(null),a=e.ref(0);async function i(f={}){n.value=!0,o.value=null;const L=t.pageSize||2e3;let m=0,h=[],c=!0;try{for(;c;){const N=t.url.replace(/\/$/,""),g=encodeURIComponent(f.where||t.where||"1=1");let w=`${N}/query?where=${g}&outFields=*&returnGeometry=true&resultRecordCount=${L}&resultOffset=${m}&f=geojson`;if(f.bounds){const x=JSON.stringify({xmin:f.bounds.west,ymin:f.bounds.south,xmax:f.bounds.east,ymax:f.bounds.north,spatialReference:{wkid:4326}});w+=`&geometry=${encodeURIComponent(x)}&geometryType=esriGeometryEnvelope&spatialRel=esriSpatialRelIntersects`}const y=await fetch(w);if(!y.ok)throw new Error(`HTTP ${y.status}: ${y.statusText}`);const k=await y.json();k.features&&k.features.length>0?(h=h.concat(k.features),m+=k.features.length,c=k.features.length===L):c=!1}const v={type:"FeatureCollection",features:h};return r.value=v,a.value=h.length,v}catch(v){const N=v instanceof Error?v:new Error("Failed to fetch features");throw o.value=N,N}finally{n.value=!1}}function u(){r.value=null,a.value=0,o.value=null}async function p(f={}){return i(f)}return{data:e.readonly(r),isLoading:e.readonly(n),error:e.readonly(o),totalFeatures:e.readonly(a),config:t,fetch:i,refetch:p,clear:u}}function Yo(t,r,n){const o=et(t);return e.watch(r,async a=>{if(a){const i=n(a);await o.fetch(i)}},{immediate:!0}),o}exports.LayerCheckboxSet=Qo;exports.LayerPanel=Qe;exports.Layerboard=Bo;exports.MapPanel=Je;exports.TopicAccordion=Vo;exports.WEBMAP_ID=uo;exports.buildWebMapUrl=ge;exports.clearCache=Xe;exports.getLayerConfigs=Ce;exports.getWebMapUrl=fo;exports.transformWebMapToLayerConfigs=De;exports.useApiDataSources=Ye;exports.useDataSource=et;exports.useLayerConfig=Xo;exports.useLayerboard=Ko;exports.useReactiveDataSource=Yo;