@mattilsynet/design 3.1.18 → 3.1.19

package/mtds/atlas/atlas-element.js

@@ -19,7 +19,7 @@ class r extends g {
   }
   constructor() {
     super(), this.attachShadow({ mode: "open" }).append(m("figure")), C(this, `@layer leaflet{${h}}
-@layer mt.v3-1-18design{${b}`);
+@layer mt.v3-1-19design{${b}`);
   }
   connectedCallback() {
     const t = this.shadowRoot?.lastElementChild, e = a(this, "data-cluster") ?? "false", o = new i.TileLayer(k, {
@@ -41,7 +41,7 @@ class r extends g {
       iconCreateFunction: (s) => new i.DivIcon({
         html: `${s.getChildCount()}`,
         className: "leaflet-cluster-icon",
-        iconSize: [30, 30]
+        iconSize: [40, 40]
       })
     }).addTo(this.map);
     for (const s of r.observedAttributes)

package/mtds/atlas/atlas-element.js.map

@@ -1 +1 @@
-{"version":3,"file":"atlas-element.js","sources":["../../designsystem/atlas/atlas-element.ts"],"sourcesContent":["import L from \"leaflet\";\nimport LeafletCSS from \"leaflet/dist/leaflet.css?raw\";\nimport type {} from \"leaflet.markercluster\"; // Extend L namespace\nimport \"./cluster.js\";\nimport {\n\tattachStyle,\n\tattr,\n\tdefineElement,\n\tisBrowser,\n\tMTDSElement,\n\toff,\n\ton,\n\ttag,\n} from \"../utils\";\nimport css from \"./atlas.css?raw\";\n\nexport { MTDSAtlasMarkerElement } from \"./atlas-marker\";\nexport { MTDSAtlasMatgeoElement } from \"./atlas-matgeo\";\nexport { MTDSAtlasWMSElement } from \"./atlas-wms\";\nexport { L };\n\n// TODO: Add minimum zoom level for adding markers (minimum 17 som standard?)\n// TODO: Add search helper (https://ws.geonorge.no/adresser/v1/openapi.json + https://ws.geonorge.no/adresser/v1/#/default/get_sok)\n// TODO: matgeo-autoload popover info\n\ntype Link = { href: string; rel: string; type: string; title: string };\ntype BBox = [number, number, number, number];\nexport type MTDSAtlasCollections = Record<string, MTDSAtlasCollection>;\nexport type MTDSAtlasCollection = {\n\tcrs: string[];\n\tdescription: string;\n\textent: { spatial: { bbox: BBox[] } };\n\tgeometry: string;\n\tid: string;\n\titemType: string;\n\tlinks: Link[];\n\ttitle: string;\n};\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t\"mtds-atlas\": MTDSAtlasElement;\n\t}\n\n\tinterface Window {\n\t\t_matgeoCollections?: Promise<MTDSAtlasCollections>;\n\t}\n}\n\nlet SKIP_CLICK: number | NodeJS.Timeout = 0;\nconst KARTVERKET_MAX_ZOOM = 18; // Kartverket does not support more than zoom level 18\nconst KARTVERKET_TILES_URL =\n\t\"https://cache.kartverket.no/v1/wmts/1.0.0/topo/default/webmercator/{z}/{y}/{x}.png\";\nexport const MATGEO_URL =\n\t\"https://matgeoservice-256616427209.europe-north1.run.app/ogc/features/collections\";\nconst BOUNDS_NORWAY: L.LatLngBoundsLiteral = [\n\t[57.5, 4.73],\n\t[71.5, 31.44],\n];\n\nexport class MTDSAtlasElement extends MTDSElement {\n\tcluster?: L.MarkerClusterGroup;\n\tmap?: L.Map;\n\n\tstatic get observedAttributes() {\n\t\treturn [\"data-view\", \"data-scrollzoom\"]; // Using ES2015 syntax for backwards compatibility\n\t}\n\tconstructor() {\n\t\tsuper();\n\t\tthis.attachShadow({ mode: \"open\" }).append(tag(\"figure\"));\n\t\tattachStyle(this, `@layer leaflet{${LeafletCSS}}\\n@layer mt.design{${css}`);\n\t}\n\tconnectedCallback() {\n\t\tconst container = this.shadowRoot?.lastElementChild as HTMLElement;\n\t\tconst cluster = attr(this, \"data-cluster\") ?? \"false\";\n\t\tconst tiles = new L.TileLayer(KARTVERKET_TILES_URL, {\n\t\t\tattribution: \"&copy; Kartverket\",\n\t\t\tclassName: \"leaflet-kartverket-tiles\",\n\t\t\tmaxZoom: KARTVERKET_MAX_ZOOM,\n\t\t});\n\n\t\tthis.map = new L.Map(container, {\n\t\t\tattributionControl: false,\n\t\t\tfadeAnimation: false, // Prevent popup fades\n\t\t\tlayers: [tiles],\n\t\t\tzoomControl: false,\n\t\t\tzoomSnap: 0.2,\n\t\t});\n\n\t\ton(this, \"pointerup click\", this.#skipClick); // Prevent clicks from bubbling up unless sent from Leaflet\n\t\tthis.map.addControl(new L.Control.Attribution({ prefix: \"\" }));\n\t\tthis.map.addControl(new L.Control.Zoom({ position: \"bottomright\" }));\n\t\tthis.map.on(\"popupopen popupclose\", this.#handlePopup, this);\n\t\tthis.cluster = new L.MarkerClusterGroup({\n\t\t\tzoomToBoundsOnClick: true,\n\t\t\tshowCoverageOnHover: false,\n\t\t\tdisableClusteringAtZoom:\n\t\t\t\tcluster === \"false\" ? 1 : Number(cluster) || KARTVERKET_MAX_ZOOM + 1,\n\t\t\ticonCreateFunction: (cluster: L.MarkerCluster) =>\n\t\t\t\tnew L.DivIcon({\n\t\t\t\t\thtml: `${cluster.getChildCount()}`,\n\t\t\t\t\tclassName: \"leaflet-cluster-icon\",\n\t\t\t\t\ticonSize: [30, 30],\n\t\t\t\t}),\n\t\t}).addTo(this.map);\n\n\t\t// Initial setup attributes\n\t\tfor (const name of MTDSAtlasElement.observedAttributes)\n\t\t\tthis.attributeChangedCallback(name, null, attr(this, name));\n\t}\n\tattributeChangedCallback(name: string, _prev?: null, next?: string | null) {\n\t\tif (name === \"data-view\") this.setView(next || \"\");\n\t\tif (name === \"data-scrollzoom\")\n\t\t\tthis.map?.scrollWheelZoom[next === \"false\" ? \"disable\" : \"enable\"]();\n\t}\n\tsetView(view: string | number[], opts?: L.FitBoundsOptions) {\n\t\tconst p = `${view}`.split(\",\").map(parseFloat).filter(Number.isFinite);\n\t\tconst b = this.cluster?.getBounds();\n\n\t\tif (p.length === 3) return this.map?.setView([p[0], p[1]], p[2], opts);\n\t\tif (view !== \"fit\") return this.map?.fitBounds(BOUNDS_NORWAY, opts);\n\t\tif (b?.isValid()) return this.map?.fitBounds(b.pad(0.1), opts);\n\t\tthis.cluster?.once(\"layeradd\", () => {\n\t\t\tsetTimeout(() => this.setView(\"fit\"), 50); // Add all markers before fitting\n\t\t});\n\t}\n\tlatLngFromPoint(x: number, y: number) {\n\t\t// @ts-expect-error -- Missing from Leaflet@2.0.0-alpha.1 types\n\t\treturn this.map?.pointerEventToLatLng({ clientX: x, clientY: y });\n\t}\n\tdisconnectedCallback() {\n\t\toff(this, \"pointerup click\", this.#skipClick);\n\t\tthis.map?.remove();\n\t\tthis.map = this.cluster = undefined;\n\t}\n\tasync getCollections() {\n\t\tif (!window._matgeoCollections)\n\t\t\twindow._matgeoCollections = fetch(MATGEO_URL)\n\t\t\t\t.then((res) => res.json())\n\t\t\t\t.then((d) => d.collections.map((c: MTDSAtlasCollection) => [c.id, c]))\n\t\t\t\t.then(Object.fromEntries);\n\t\treturn window._matgeoCollections;\n\t}\n\t#handlePopup({ type, popup }: { type: string; popup: L.Popup }) {\n\t\tconst open = type === \"popupopen\";\n\t\tconst cont = popup.getElement()?.querySelector(\".leaflet-popup-content\");\n\t\tconst slot = cont?.querySelector<HTMLSlotElement>(\":scope > slot\");\n\t\tconst id = cont?.textContent?.match(/^#(\\S+)/)?.[1] || \"\";\n\t\tconst el = document.getElementById(slot?.name || id); // If content of popup is #id, replace with <slot>\n\n\t\tif (!el) return open && id && popup.close(); // Close popup if target element not found\n\t\tL.Util.setOptions(popup, { maxWidth: this.offsetWidth - 40 });\n\t\tattr(el, \"data-popover\", open ? attr(el, \"popover\") : null); // Store previous popover mode\n\t\tattr(el, \"popover\", open ? null : attr(el, \"data-popover\")); // But temporarily remove it so popover renders\n\t\tattr(el, \"slot\", open ? el.id : null); // Render popover in slot\n\t\tif (open) popup.setContent(tag(\"slot\", { name: el.id }));\n\t}\n\t#skipClick(event: Partial<MouseEvent>) {\n\t\tif (event.type === \"click\") SKIP_CLICK && event.stopPropagation?.();\n\t\telse if (document.body.classList.contains(\"leaflet-dragging\"))\n\t\t\tSKIP_CLICK = setTimeout(() => {\n\t\t\t\tSKIP_CLICK = 0;\n\t\t\t}, 50); // Was dragging, so skip succeeding click\n\t}\n}\n\ndefineElement(\"mtds-atlas\", MTDSAtlasElement);\n\nif (isBrowser())\n\tL.Marker.prototype.options.icon = new L.DivIcon({\n\t\thtml: '<div class=\"leaflet-marker-generated-slot\"><div class=\"leaflet-marker-generated-icon\"></div></div>',\n\t\ticonSize: [0, 0],\n\t});\n"],"names":["SKIP_CLICK","KARTVERKET_MAX_ZOOM","KARTVERKET_TILES_URL","MATGEO_URL","BOUNDS_NORWAY","MTDSAtlasElement","MTDSElement","tag","attachStyle","LeafletCSS","css","container","cluster","attr","tiles","L","on","#skipClick","#handlePopup","name","_prev","next","view","opts","p","b","x","y","off","res","d","c","type","popup","open","cont","slot","id","el","event","defineElement","isBrowser"],"mappings":"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"}
+{"version":3,"file":"atlas-element.js","sources":["../../designsystem/atlas/atlas-element.ts"],"sourcesContent":["import L from \"leaflet\";\nimport LeafletCSS from \"leaflet/dist/leaflet.css?raw\";\nimport type {} from \"leaflet.markercluster\"; // Extend L namespace\nimport \"./cluster.js\";\nimport {\n\tattachStyle,\n\tattr,\n\tdefineElement,\n\tisBrowser,\n\tMTDSElement,\n\toff,\n\ton,\n\ttag,\n} from \"../utils\";\nimport css from \"./atlas.css?raw\";\n\nexport { MTDSAtlasMarkerElement } from \"./atlas-marker\";\nexport { MTDSAtlasMatgeoElement } from \"./atlas-matgeo\";\nexport { MTDSAtlasWMSElement } from \"./atlas-wms\";\nexport { L };\n\n// TODO: Add minimum zoom level for adding markers (minimum 17 som standard?)\n// TODO: Add search helper (https://ws.geonorge.no/adresser/v1/openapi.json + https://ws.geonorge.no/adresser/v1/#/default/get_sok)\n// TODO: matgeo-autoload popover info\n\ntype Link = { href: string; rel: string; type: string; title: string };\ntype BBox = [number, number, number, number];\nexport type MTDSAtlasCollections = Record<string, MTDSAtlasCollection>;\nexport type MTDSAtlasCollection = {\n\tcrs: string[];\n\tdescription: string;\n\textent: { spatial: { bbox: BBox[] } };\n\tgeometry: string;\n\tid: string;\n\titemType: string;\n\tlinks: Link[];\n\ttitle: string;\n};\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t\"mtds-atlas\": MTDSAtlasElement;\n\t}\n\n\tinterface Window {\n\t\t_matgeoCollections?: Promise<MTDSAtlasCollections>;\n\t}\n}\n\nlet SKIP_CLICK: number | NodeJS.Timeout = 0;\nconst KARTVERKET_MAX_ZOOM = 18; // Kartverket does not support more than zoom level 18\nconst KARTVERKET_TILES_URL =\n\t\"https://cache.kartverket.no/v1/wmts/1.0.0/topo/default/webmercator/{z}/{y}/{x}.png\";\nexport const MATGEO_URL =\n\t\"https://matgeoservice-256616427209.europe-north1.run.app/ogc/features/collections\";\nconst BOUNDS_NORWAY: L.LatLngBoundsLiteral = [\n\t[57.5, 4.73],\n\t[71.5, 31.44],\n];\n\nexport class MTDSAtlasElement extends MTDSElement {\n\tcluster?: L.MarkerClusterGroup;\n\tmap?: L.Map;\n\n\tstatic get observedAttributes() {\n\t\treturn [\"data-view\", \"data-scrollzoom\"]; // Using ES2015 syntax for backwards compatibility\n\t}\n\tconstructor() {\n\t\tsuper();\n\t\tthis.attachShadow({ mode: \"open\" }).append(tag(\"figure\"));\n\t\tattachStyle(this, `@layer leaflet{${LeafletCSS}}\\n@layer mt.design{${css}`);\n\t}\n\tconnectedCallback() {\n\t\tconst container = this.shadowRoot?.lastElementChild as HTMLElement;\n\t\tconst cluster = attr(this, \"data-cluster\") ?? \"false\";\n\t\tconst tiles = new L.TileLayer(KARTVERKET_TILES_URL, {\n\t\t\tattribution: \"&copy; Kartverket\",\n\t\t\tclassName: \"leaflet-kartverket-tiles\",\n\t\t\tmaxZoom: KARTVERKET_MAX_ZOOM,\n\t\t});\n\n\t\tthis.map = new L.Map(container, {\n\t\t\tattributionControl: false,\n\t\t\tfadeAnimation: false, // Prevent popup fades\n\t\t\tlayers: [tiles],\n\t\t\tzoomControl: false,\n\t\t\tzoomSnap: 0.2,\n\t\t});\n\n\t\ton(this, \"pointerup click\", this.#skipClick); // Prevent clicks from bubbling up unless sent from Leaflet\n\t\tthis.map.addControl(new L.Control.Attribution({ prefix: \"\" }));\n\t\tthis.map.addControl(new L.Control.Zoom({ position: \"bottomright\" }));\n\t\tthis.map.on(\"popupopen popupclose\", this.#handlePopup, this);\n\t\tthis.cluster = new L.MarkerClusterGroup({\n\t\t\tzoomToBoundsOnClick: true,\n\t\t\tshowCoverageOnHover: false,\n\t\t\tdisableClusteringAtZoom:\n\t\t\t\tcluster === \"false\" ? 1 : Number(cluster) || KARTVERKET_MAX_ZOOM + 1,\n\t\t\ticonCreateFunction: (cluster: L.MarkerCluster) =>\n\t\t\t\tnew L.DivIcon({\n\t\t\t\t\thtml: `${cluster.getChildCount()}`,\n\t\t\t\t\tclassName: \"leaflet-cluster-icon\",\n\t\t\t\t\ticonSize: [40, 40],\n\t\t\t\t}),\n\t\t}).addTo(this.map);\n\n\t\t// Initial setup attributes\n\t\tfor (const name of MTDSAtlasElement.observedAttributes)\n\t\t\tthis.attributeChangedCallback(name, null, attr(this, name));\n\t}\n\tattributeChangedCallback(name: string, _prev?: null, next?: string | null) {\n\t\tif (name === \"data-view\") this.setView(next || \"\");\n\t\tif (name === \"data-scrollzoom\")\n\t\t\tthis.map?.scrollWheelZoom[next === \"false\" ? \"disable\" : \"enable\"]();\n\t}\n\tsetView(view: string | number[], opts?: L.FitBoundsOptions) {\n\t\tconst p = `${view}`.split(\",\").map(parseFloat).filter(Number.isFinite);\n\t\tconst b = this.cluster?.getBounds();\n\n\t\tif (p.length === 3) return this.map?.setView([p[0], p[1]], p[2], opts);\n\t\tif (view !== \"fit\") return this.map?.fitBounds(BOUNDS_NORWAY, opts);\n\t\tif (b?.isValid()) return this.map?.fitBounds(b.pad(0.1), opts);\n\t\tthis.cluster?.once(\"layeradd\", () => {\n\t\t\tsetTimeout(() => this.setView(\"fit\"), 50); // Add all markers before fitting\n\t\t});\n\t}\n\tlatLngFromPoint(x: number, y: number) {\n\t\t// @ts-expect-error -- Missing from Leaflet@2.0.0-alpha.1 types\n\t\treturn this.map?.pointerEventToLatLng({ clientX: x, clientY: y });\n\t}\n\tdisconnectedCallback() {\n\t\toff(this, \"pointerup click\", this.#skipClick);\n\t\tthis.map?.remove();\n\t\tthis.map = this.cluster = undefined;\n\t}\n\tasync getCollections() {\n\t\tif (!window._matgeoCollections)\n\t\t\twindow._matgeoCollections = fetch(MATGEO_URL)\n\t\t\t\t.then((res) => res.json())\n\t\t\t\t.then((d) => d.collections.map((c: MTDSAtlasCollection) => [c.id, c]))\n\t\t\t\t.then(Object.fromEntries);\n\t\treturn window._matgeoCollections;\n\t}\n\t#handlePopup({ type, popup }: { type: string; popup: L.Popup }) {\n\t\tconst open = type === \"popupopen\";\n\t\tconst cont = popup.getElement()?.querySelector(\".leaflet-popup-content\");\n\t\tconst slot = cont?.querySelector<HTMLSlotElement>(\":scope > slot\");\n\t\tconst id = cont?.textContent?.match(/^#(\\S+)/)?.[1] || \"\";\n\t\tconst el = document.getElementById(slot?.name || id); // If content of popup is #id, replace with <slot>\n\n\t\tif (!el) return open && id && popup.close(); // Close popup if target element not found\n\t\tL.Util.setOptions(popup, { maxWidth: this.offsetWidth - 40 });\n\t\tattr(el, \"data-popover\", open ? attr(el, \"popover\") : null); // Store previous popover mode\n\t\tattr(el, \"popover\", open ? null : attr(el, \"data-popover\")); // But temporarily remove it so popover renders\n\t\tattr(el, \"slot\", open ? el.id : null); // Render popover in slot\n\t\tif (open) popup.setContent(tag(\"slot\", { name: el.id }));\n\t}\n\t#skipClick(event: Partial<MouseEvent>) {\n\t\tif (event.type === \"click\") SKIP_CLICK && event.stopPropagation?.();\n\t\telse if (document.body.classList.contains(\"leaflet-dragging\"))\n\t\t\tSKIP_CLICK = setTimeout(() => {\n\t\t\t\tSKIP_CLICK = 0;\n\t\t\t}, 50); // Was dragging, so skip succeeding click\n\t}\n}\n\ndefineElement(\"mtds-atlas\", MTDSAtlasElement);\n\nif (isBrowser())\n\tL.Marker.prototype.options.icon = new L.DivIcon({\n\t\thtml: '<div class=\"leaflet-marker-generated-slot\"><div class=\"leaflet-marker-generated-icon\"></div></div>',\n\t\ticonSize: [0, 0],\n\t});\n"],"names":["SKIP_CLICK","KARTVERKET_MAX_ZOOM","KARTVERKET_TILES_URL","MATGEO_URL","BOUNDS_NORWAY","MTDSAtlasElement","MTDSElement","tag","attachStyle","LeafletCSS","css","container","cluster","attr","tiles","L","on","#skipClick","#handlePopup","name","_prev","next","view","opts","p","b","x","y","off","res","d","c","type","popup","open","cont","slot","id","el","event","defineElement","isBrowser"],"mappings":"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"}

package/mtds/atlas/atlas.css.js

@@ -4,14 +4,16 @@ const t = `/**
  * - This file is using --mtds- not --mtds- since we're inside shadow dom
  */	
  
+::slotted([data-color]),  /* Ensure data-color is respected */
 :host {
 	--mtdsc-atlas-border: 1px solid var(--mtds-color-border-subtle);
 	--mtdsc-atlas-cluster-border: 1px solid;
-	--mtdsc-atlas-marker-background: #116e6b;
+	--mtdsc-atlas-marker-background: var(--mtds-color-base-default);
+	--mtdsc-atlas-marker-background-outer: #fff;
 	--mtdsc-atlas-cluster-background: var(--mtdsc-atlas-marker-background);
 	--mtdsc-atlas-cluster-color: var(--mtdsc-atlas-marker-color);
 	--mtdsc-atlas-marker-border: none;
-	--mtdsc-atlas-marker-color: #fff;
+	--mtdsc-atlas-marker-color: var(--mtds-color-base-contrast-default);
 	--mtdsc-atlas-marker-inset: 3px;
 	--mtdsc-atlas-marker-shadow-blur: 4px;
 	--mtdsc-atlas-marker-shadow-color: rgba(0  0 0 / 0.5);
@@ -19,7 +21,8 @@ const t = `/**
 	--mtdsc-atlas-marker-size: var(--mtds-6);
 	--mtdsc-atlas-tile-background: #f7fcfc;
 	--mtdsc-atlas-tile-filter: grayscale(.8) contrast(0.75) brightness(1.15); /* Also in styles.module.css */
-
+}
+:host {
 	border-radius: var(--mtds-border-radius-md);
 	aspect-ratio: 2;
 	overflow: clip;
@@ -88,7 +91,7 @@ const t = `/**
 ::slotted(mtds-atlas-marker)::after {
 	box-shadow: var(--mtdsc-atlas-marker-shadow-offset) var(--mtdsc-atlas-marker-shadow-offset) var(--mtdsc-atlas-marker-shadow-blur) var(--mtdsc-atlas-marker-shadow-color);
 	aspect-ratio: 1;
-	background: var(--mtdsc-atlas-marker-color);
+	background: var(--mtdsc-atlas-marker-background-outer);
 	color: var(--mtdsc-atlas-marker-background);
 	border-radius: 50% 50% 0 50%;
 	/* biome-ignore lint/complexity/noImportantStyles: Overwrite Tailwind */
@@ -99,10 +102,7 @@ const t = `/**
 	inset: calc(var(--mtdsc-atlas-marker-inset) * -1);
 	z-index: -1;
 }
-::slotted(mtds-atlas-marker[data-color]) {
-	--mtdsc-atlas-marker-background: var(--mtds-color-base-default); /* Ensure data-color is respected */
-	--mtdsc-atlas-marker-color: var(--mtds-color-base-contrast-default);
-}
+
 ::slotted(mtds-atlas-marker.leaflet-drag-target) {
 	cursor: grabbing;
 }
@@ -116,7 +116,7 @@ const t = `/**
 	border-radius: 100%;
 	border: var(--mtdsc-atlas-cluster-border);
 	box-sizing: border-box;
-	outline: 1px solid var(--mtdsc-atlas-cluster-background);
+	outline: 2px solid var(--mtdsc-atlas-cluster-background);
 	color: var(--mtdsc-atlas-cluster-color);
 	display: flex;
 	font-size: var(--mtds-body-xs-font-size);

package/mtds/atlas/atlas.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"atlas.css.js","sources":["../../designsystem/atlas/atlas.css?raw"],"sourcesContent":["export default \"/**\\n * NOTE:\\n * - Dark mode styles are in styles.module.css to leverage data-color-scheme attribute\\n * - This file is using --mtds- not --mtds- since we're inside shadow dom\\n */\\t\\n \\n:host {\\n\\t--mtdsc-atlas-border: 1px solid var(--mtds-color-border-subtle);\\n\\t--mtdsc-atlas-cluster-border: 1px solid;\\n\\t--mtdsc-atlas-marker-background: #116e6b;\\n\\t--mtdsc-atlas-cluster-background: var(--mtdsc-atlas-marker-background);\\n\\t--mtdsc-atlas-cluster-color: var(--mtdsc-atlas-marker-color);\\n\\t--mtdsc-atlas-marker-border: none;\\n\\t--mtdsc-atlas-marker-color: #fff;\\n\\t--mtdsc-atlas-marker-inset: 3px;\\n\\t--mtdsc-atlas-marker-shadow-blur: 4px;\\n\\t--mtdsc-atlas-marker-shadow-color: rgba(0  0 0 / 0.5);\\n\\t--mtdsc-atlas-marker-shadow-offset: 2px;\\n\\t--mtdsc-atlas-marker-size: var(--mtds-6);\\n\\t--mtdsc-atlas-tile-background: #f7fcfc;\\n\\t--mtdsc-atlas-tile-filter: grayscale(.8) contrast(0.75) brightness(1.15); /* Also in styles.module.css */\\n\\n\\tborder-radius: var(--mtds-border-radius-md);\\n\\taspect-ratio: 2;\\n\\toverflow: clip;\\n\\tposition: relative;\\n}\\n:host(:not([hidden])) { display: block }\\n:host([data-cursor=\\\"pointer\\\"]) .leaflet-grab { cursor: pointer }\\n\\n/* Focus */\\n.leaflet-control-zoom a:focus-visible,\\n:host:has(.leaflet-container:focus-visible),\\n::slotted(mtds-atlas-marker:focus-visible) {\\n\\tbox-shadow: var(--mtdsc-focus-boxShadow);\\n\\toutline: var(--mtdsc-focus-outline);\\n\\toutline-offset: var(--mtds-border-width-focus);\\n}\\n\\n/* Tiles */\\n.leaflet-kartverket-tiles { filter: var(--mtdsc-atlas-tile-filter); transition: filter 0.5s }\\n.leaflet-container {\\n\\tbackground: var(--mtdsc-atlas-tile-background);\\n\\tborder-radius: inherit;\\n\\tborder: var(--mtdsc-atlas-border);\\n\\tbox-sizing: border-box;\\n\\tfont: inherit;\\n\\theight: 100%;\\n\\tmargin: 0;\\n\\toutline: 0;\\n\\tposition: relative;\\n\\tz-index: 1; /* Ensure <slot> is always on top */\\n}\\n:host([data-tiles=\\\"color\\\"]) {\\n\\t--mtdsc-atlas-tile-background: #e5fcfd;\\n\\t--mtdsc-atlas-tile-filter: grayscale(0.2);\\n}\\n\\n/* Controls */\\n.leaflet-control-attribution { font-size: 12px; border-top-left-radius: var(--mtds-border-radius-md) }\\n.leaflet-control-zoom { border-radius: var(--mtds-border-radius-md); border: 1px solid var(--mtds-color-border-default) }\\n.leaflet-control-zoom a { background: var(--mtds-color-surface-default); border-color: inherit; color: var(--mtds-color-text-default); height: var(--mtds-10); line-height: var(--mtds-10); transition: 0.2s; width: var(--mtds-10) }\\n.leaflet-control-zoom a:first-child { border-top-left-radius: inherit; border-top-right-radius: inherit }\\n.leaflet-control-zoom a:last-child { border-bottom-left-radius: inherit; border-bottom-right-radius: inherit }\\n.leaflet-control-zoom a:hover { background: var(--mtds-color-surface-hover) }\\n.leaflet-control-zoom a:active { background: var(--mtds-color-surface-active) }\\n\\n/* Markers */\\n.leaflet-marker-generated-icon,\\n::slotted(mtds-atlas-marker) {\\n\\tall: unset;\\n\\tcolor: var(--mtdsc-atlas-marker-color);\\n\\tbackground: var(--mtdsc-atlas-marker-background);\\n\\tborder-radius: 100%;\\n\\tbox-sizing: border-box;\\n\\tcursor: pointer;\\n\\tdisplay: grid;\\n\\tplace-items: center;\\n\\tplace-content: center;\\n\\tfont-size: var(--mtds-body-sm-font-size);\\n\\tfont-weight: var(--mtds-font-weight-bold);\\n\\theight: var(--mtdsc-atlas-marker-size);\\n\\t/* biome-ignore lint/complexity/noImportantStyles: Overwrite Tailwind */\\n\\tmargin-bottom: calc(var(--mtdsc-atlas-marker-size) * .25 + var(--mtdsc-atlas-marker-inset))!important;\\n\\twidth: var(--mtdsc-atlas-marker-size);\\n}\\n.leaflet-marker-generated-icon::after,\\n::slotted(mtds-atlas-marker)::after {\\n\\tbox-shadow: var(--mtdsc-atlas-marker-shadow-offset) var(--mtdsc-atlas-marker-shadow-offset) var(--mtdsc-atlas-marker-shadow-blur) var(--mtdsc-atlas-marker-shadow-color);\\n\\taspect-ratio: 1;\\n\\tbackground: var(--mtdsc-atlas-marker-color);\\n\\tcolor: var(--mtdsc-atlas-marker-background);\\n\\tborder-radius: 50% 50% 0 50%;\\n\\t/* biome-ignore lint/complexity/noImportantStyles: Overwrite Tailwind */\\n\\tborder: var(--mtdsc-atlas-marker-border)!important;\\n\\tcontent: \\\"\\\";\\n\\trotate: 45deg;\\n\\tposition: absolute;\\n\\tinset: calc(var(--mtdsc-atlas-marker-inset) * -1);\\n\\tz-index: -1;\\n}\\n::slotted(mtds-atlas-marker[data-color]) {\\n\\t--mtdsc-atlas-marker-background: var(--mtds-color-base-default); /* Ensure data-color is respected */\\n\\t--mtdsc-atlas-marker-color: var(--mtds-color-base-contrast-default);\\n}\\n::slotted(mtds-atlas-marker.leaflet-drag-target) {\\n\\tcursor: grabbing;\\n}\\n\\n.leaflet-marker-generated-slot,\\n.leaflet-marker-icon slot { display: block; position: absolute; left: 0; top: 0; translate: -50% -100% }\\n.leaflet-marker-icon { background: none; border: 0 }\\n.leaflet-cluster-icon {\\n\\tbox-shadow: 0 var(--mtdsc-atlas-marker-shadow-offset) var(--mtdsc-atlas-marker-shadow-blur) var(--mtdsc-atlas-marker-shadow-color);\\n\\tbackground-color: var(--mtdsc-atlas-cluster-background);\\n\\tborder-radius: 100%;\\n\\tborder: var(--mtdsc-atlas-cluster-border);\\n\\tbox-sizing: border-box;\\n\\toutline: 1px solid var(--mtdsc-atlas-cluster-background);\\n\\tcolor: var(--mtdsc-atlas-cluster-color);\\n\\tdisplay: flex;\\n\\tfont-size: var(--mtds-body-xs-font-size);\\n\\tfont-weight: var(--mtds-font-weight-bold);\\n\\tplace-content: center;\\n\\tplace-items: center;\\n}\\n\\n/* Popover */\\n.leaflet-popup:has(slot) .leaflet-popup-tip { background: var(--mtds-color-surface-default) }\\n.leaflet-popup:has(slot) .leaflet-popup-close-button { display: none } /* Popup closes on clicking marker anyway */\\n.leaflet-popup:has(slot) .leaflet-popup-content-wrapper { display: contents } /* No need for styling this element */\\n.leaflet-popup:has(slot) .leaflet-popup-content { margin: 0; font: inherit }\\n\\n\""],"names":["css"],"mappings":"AAAA,MAAAA,IAAe;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;"}
+{"version":3,"file":"atlas.css.js","sources":["../../designsystem/atlas/atlas.css?raw"],"sourcesContent":["export default \"/**\\n * NOTE:\\n * - Dark mode styles are in styles.module.css to leverage data-color-scheme attribute\\n * - This file is using --mtds- not --mtds- since we're inside shadow dom\\n */\\t\\n \\n::slotted([data-color]),  /* Ensure data-color is respected */\\n:host {\\n\\t--mtdsc-atlas-border: 1px solid var(--mtds-color-border-subtle);\\n\\t--mtdsc-atlas-cluster-border: 1px solid;\\n\\t--mtdsc-atlas-marker-background: var(--mtds-color-base-default);\\n\\t--mtdsc-atlas-marker-background-outer: #fff;\\n\\t--mtdsc-atlas-cluster-background: var(--mtdsc-atlas-marker-background);\\n\\t--mtdsc-atlas-cluster-color: var(--mtdsc-atlas-marker-color);\\n\\t--mtdsc-atlas-marker-border: none;\\n\\t--mtdsc-atlas-marker-color: var(--mtds-color-base-contrast-default);\\n\\t--mtdsc-atlas-marker-inset: 3px;\\n\\t--mtdsc-atlas-marker-shadow-blur: 4px;\\n\\t--mtdsc-atlas-marker-shadow-color: rgba(0  0 0 / 0.5);\\n\\t--mtdsc-atlas-marker-shadow-offset: 2px;\\n\\t--mtdsc-atlas-marker-size: var(--mtds-6);\\n\\t--mtdsc-atlas-tile-background: #f7fcfc;\\n\\t--mtdsc-atlas-tile-filter: grayscale(.8) contrast(0.75) brightness(1.15); /* Also in styles.module.css */\\n}\\n:host {\\n\\tborder-radius: var(--mtds-border-radius-md);\\n\\taspect-ratio: 2;\\n\\toverflow: clip;\\n\\tposition: relative;\\n}\\n:host(:not([hidden])) { display: block }\\n:host([data-cursor=\\\"pointer\\\"]) .leaflet-grab { cursor: pointer }\\n\\n/* Focus */\\n.leaflet-control-zoom a:focus-visible,\\n:host:has(.leaflet-container:focus-visible),\\n::slotted(mtds-atlas-marker:focus-visible) {\\n\\tbox-shadow: var(--mtdsc-focus-boxShadow);\\n\\toutline: var(--mtdsc-focus-outline);\\n\\toutline-offset: var(--mtds-border-width-focus);\\n}\\n\\n/* Tiles */\\n.leaflet-kartverket-tiles { filter: var(--mtdsc-atlas-tile-filter); transition: filter 0.5s }\\n.leaflet-container {\\n\\tbackground: var(--mtdsc-atlas-tile-background);\\n\\tborder-radius: inherit;\\n\\tborder: var(--mtdsc-atlas-border);\\n\\tbox-sizing: border-box;\\n\\tfont: inherit;\\n\\theight: 100%;\\n\\tmargin: 0;\\n\\toutline: 0;\\n\\tposition: relative;\\n\\tz-index: 1; /* Ensure <slot> is always on top */\\n}\\n:host([data-tiles=\\\"color\\\"]) {\\n\\t--mtdsc-atlas-tile-background: #e5fcfd;\\n\\t--mtdsc-atlas-tile-filter: grayscale(0.2);\\n}\\n\\n/* Controls */\\n.leaflet-control-attribution { font-size: 12px; border-top-left-radius: var(--mtds-border-radius-md) }\\n.leaflet-control-zoom { border-radius: var(--mtds-border-radius-md); border: 1px solid var(--mtds-color-border-default) }\\n.leaflet-control-zoom a { background: var(--mtds-color-surface-default); border-color: inherit; color: var(--mtds-color-text-default); height: var(--mtds-10); line-height: var(--mtds-10); transition: 0.2s; width: var(--mtds-10) }\\n.leaflet-control-zoom a:first-child { border-top-left-radius: inherit; border-top-right-radius: inherit }\\n.leaflet-control-zoom a:last-child { border-bottom-left-radius: inherit; border-bottom-right-radius: inherit }\\n.leaflet-control-zoom a:hover { background: var(--mtds-color-surface-hover) }\\n.leaflet-control-zoom a:active { background: var(--mtds-color-surface-active) }\\n\\n/* Markers */\\n.leaflet-marker-generated-icon,\\n::slotted(mtds-atlas-marker) {\\n\\tall: unset;\\n\\tcolor: var(--mtdsc-atlas-marker-color);\\n\\tbackground: var(--mtdsc-atlas-marker-background);\\n\\tborder-radius: 100%;\\n\\tbox-sizing: border-box;\\n\\tcursor: pointer;\\n\\tdisplay: grid;\\n\\tplace-items: center;\\n\\tplace-content: center;\\n\\tfont-size: var(--mtds-body-sm-font-size);\\n\\tfont-weight: var(--mtds-font-weight-bold);\\n\\theight: var(--mtdsc-atlas-marker-size);\\n\\t/* biome-ignore lint/complexity/noImportantStyles: Overwrite Tailwind */\\n\\tmargin-bottom: calc(var(--mtdsc-atlas-marker-size) * .25 + var(--mtdsc-atlas-marker-inset))!important;\\n\\twidth: var(--mtdsc-atlas-marker-size);\\n}\\n.leaflet-marker-generated-icon::after,\\n::slotted(mtds-atlas-marker)::after {\\n\\tbox-shadow: var(--mtdsc-atlas-marker-shadow-offset) var(--mtdsc-atlas-marker-shadow-offset) var(--mtdsc-atlas-marker-shadow-blur) var(--mtdsc-atlas-marker-shadow-color);\\n\\taspect-ratio: 1;\\n\\tbackground: var(--mtdsc-atlas-marker-background-outer);\\n\\tcolor: var(--mtdsc-atlas-marker-background);\\n\\tborder-radius: 50% 50% 0 50%;\\n\\t/* biome-ignore lint/complexity/noImportantStyles: Overwrite Tailwind */\\n\\tborder: var(--mtdsc-atlas-marker-border)!important;\\n\\tcontent: \\\"\\\";\\n\\trotate: 45deg;\\n\\tposition: absolute;\\n\\tinset: calc(var(--mtdsc-atlas-marker-inset) * -1);\\n\\tz-index: -1;\\n}\\n\\n::slotted(mtds-atlas-marker.leaflet-drag-target) {\\n\\tcursor: grabbing;\\n}\\n\\n.leaflet-marker-generated-slot,\\n.leaflet-marker-icon slot { display: block; position: absolute; left: 0; top: 0; translate: -50% -100% }\\n.leaflet-marker-icon { background: none; border: 0 }\\n.leaflet-cluster-icon {\\n\\tbox-shadow: 0 var(--mtdsc-atlas-marker-shadow-offset) var(--mtdsc-atlas-marker-shadow-blur) var(--mtdsc-atlas-marker-shadow-color);\\n\\tbackground-color: var(--mtdsc-atlas-cluster-background);\\n\\tborder-radius: 100%;\\n\\tborder: var(--mtdsc-atlas-cluster-border);\\n\\tbox-sizing: border-box;\\n\\toutline: 2px solid var(--mtdsc-atlas-cluster-background);\\n\\tcolor: var(--mtdsc-atlas-cluster-color);\\n\\tdisplay: flex;\\n\\tfont-size: var(--mtds-body-xs-font-size);\\n\\tfont-weight: var(--mtds-font-weight-bold);\\n\\tplace-content: center;\\n\\tplace-items: center;\\n}\\n\\n/* Popover */\\n.leaflet-popup:has(slot) .leaflet-popup-tip { background: var(--mtds-color-surface-default) }\\n.leaflet-popup:has(slot) .leaflet-popup-close-button { display: none } /* Popup closes on clicking marker anyway */\\n.leaflet-popup:has(slot) .leaflet-popup-content-wrapper { display: contents } /* No need for styling this element */\\n.leaflet-popup:has(slot) .leaflet-popup-content { margin: 0; font: inherit }\\n\\n\""],"names":["css"],"mappings":"AAAA,MAAAA,IAAe;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;"}

package/mtds/atlas.iife.js

@@ -606,14 +606,16 @@ path.leaflet-interactive:focus:not(:focus-visible) {
  * - This file is using --mtds- not --mtds- since we're inside shadow dom
  */	
  
+::slotted([data-color]),  /* Ensure data-color is respected */
 :host {
 	--mtdsc-atlas-border: 1px solid var(--mtds-color-border-subtle);
 	--mtdsc-atlas-cluster-border: 1px solid;
-	--mtdsc-atlas-marker-background: #116e6b;
+	--mtdsc-atlas-marker-background: var(--mtds-color-base-default);
+	--mtdsc-atlas-marker-background-outer: #fff;
 	--mtdsc-atlas-cluster-background: var(--mtdsc-atlas-marker-background);
 	--mtdsc-atlas-cluster-color: var(--mtdsc-atlas-marker-color);
 	--mtdsc-atlas-marker-border: none;
-	--mtdsc-atlas-marker-color: #fff;
+	--mtdsc-atlas-marker-color: var(--mtds-color-base-contrast-default);
 	--mtdsc-atlas-marker-inset: 3px;
 	--mtdsc-atlas-marker-shadow-blur: 4px;
 	--mtdsc-atlas-marker-shadow-color: rgba(0  0 0 / 0.5);
@@ -621,7 +623,8 @@ path.leaflet-interactive:focus:not(:focus-visible) {
 	--mtdsc-atlas-marker-size: var(--mtds-6);
 	--mtdsc-atlas-tile-background: #f7fcfc;
 	--mtdsc-atlas-tile-filter: grayscale(.8) contrast(0.75) brightness(1.15); /* Also in styles.module.css */
-
+}
+:host {
 	border-radius: var(--mtds-border-radius-md);
 	aspect-ratio: 2;
 	overflow: clip;
@@ -690,7 +693,7 @@ path.leaflet-interactive:focus:not(:focus-visible) {
 ::slotted(mtds-atlas-marker)::after {
 	box-shadow: var(--mtdsc-atlas-marker-shadow-offset) var(--mtdsc-atlas-marker-shadow-offset) var(--mtdsc-atlas-marker-shadow-blur) var(--mtdsc-atlas-marker-shadow-color);
 	aspect-ratio: 1;
-	background: var(--mtdsc-atlas-marker-color);
+	background: var(--mtdsc-atlas-marker-background-outer);
 	color: var(--mtdsc-atlas-marker-background);
 	border-radius: 50% 50% 0 50%;
 	/* biome-ignore lint/complexity/noImportantStyles: Overwrite Tailwind */
@@ -701,10 +704,7 @@ path.leaflet-interactive:focus:not(:focus-visible) {
 	inset: calc(var(--mtdsc-atlas-marker-inset) * -1);
 	z-index: -1;
 }
-::slotted(mtds-atlas-marker[data-color]) {
-	--mtdsc-atlas-marker-background: var(--mtds-color-base-default); /* Ensure data-color is respected */
-	--mtdsc-atlas-marker-color: var(--mtds-color-base-contrast-default);
-}
+
 ::slotted(mtds-atlas-marker.leaflet-drag-target) {
 	cursor: grabbing;
 }
@@ -718,7 +718,7 @@ path.leaflet-interactive:focus:not(:focus-visible) {
 	border-radius: 100%;
 	border: var(--mtdsc-atlas-cluster-border);
 	box-sizing: border-box;
-	outline: 1px solid var(--mtdsc-atlas-cluster-background);
+	outline: 2px solid var(--mtdsc-atlas-cluster-background);
 	color: var(--mtdsc-atlas-cluster-color);
 	display: flex;
 	font-size: var(--mtds-body-xs-font-size);
@@ -734,4 +734,4 @@ path.leaflet-interactive:focus:not(:focus-visible) {
 .leaflet-popup:has(slot) .leaflet-popup-content { margin: 0; font: inherit }
 
 `;let nn=0;class sn extends ue{atlas;marker;static get observedAttributes(){return["hidden","draggable","data-latlng","popovertarget"]}connectedCallback(){queueMicrotask(()=>{const t=ce("slot",{name:`${++nn}`}),e=new _.DivIcon({html:t,iconSize:[0,0]});this.atlas=this.closest("mtds-atlas")||void 0,this.marker=new _.Marker(this.#e(),{draggable:this.draggable,keyboard:!1,icon:e}),this.marker.bindPopup(()=>`#${A(this,"popovertarget")}`),this.marker.on("dragend",this.#t),en(this,"click keydown",this),A(this,"slot",`${nn}`),A(this,"role","button"),A(this,"tabindex","0"),this.attributeChangedCallback("hidden")})}attributeChangedCallback(t){const e=this.marker,i=this.atlas?.cluster;if(t==="popovertarget"&&e?.getPopup()?.update(),t==="data-latlng"){const s=this.#e();e?.getLatLng().equals(s)||e?.setLatLng(s)}t==="draggable"&&e?.dragging?.[this.draggable?"enable":"disable"](),t==="hidden"&&e&&i&&i[this.hidden?"removeLayer":"addLayer"](e)}disconnectedCallback(){Ve(this,"click keydown",this),this.marker?.unbindPopup().off("dragend",this.#t).remove(),this.marker=this.atlas=void 0}handleEvent(t){if(t.type==="click")return this.marker?.fire("click");t.key===" "&&t.preventDefault(),(t.key===" "||t.key==="Enter")&&this.click()}get latlng(){return A(this,"data-latlng")||""}set latlng(t){A(this,"data-latlng",t)}#e(){return this.latlng?.split(",").map(parseFloat)}#t(t){const i=t.target._icon?.firstElementChild?.assignedElements?.()?.[0],{lat:s,lng:o}=t.target.getLatLng();i&&(i.latlng=`${s},${o}`),i?.dispatchEvent(new CustomEvent("dragend",{detail:t,bubbles:!0}))}}pe("mtds-atlas-marker",sn);const lt=11102230246251565e-32,R=134217729,es=(3+8*lt)*lt;function Ke(n,t,e,i,s){let o,r,a,l,h=t[0],d=i[0],c=0,u=0;d>h==d>-h?(o=h,h=t[++c]):(o=d,d=i[++u]);let p=0;if(c<n&&u<e)for(d>h==d>-h?(r=h+o,a=o-(r-h),h=t[++c]):(r=d+o,a=o-(r-d),d=i[++u]),o=r,a!==0&&(s[p++]=a);c<n&&u<e;)d>h==d>-h?(r=o+h,l=r-o,a=o-(r-l)+(h-l),h=t[++c]):(r=o+d,l=r-o,a=o-(r-l)+(d-l),d=i[++u]),o=r,a!==0&&(s[p++]=a);for(;c<n;)r=o+h,l=r-o,a=o-(r-l)+(h-l),h=t[++c],o=r,a!==0&&(s[p++]=a);for(;u<e;)r=o+d,l=r-o,a=o-(r-l)+(d-l),d=i[++u],o=r,a!==0&&(s[p++]=a);return(o!==0||p===0)&&(s[p++]=o),p}function is(n,t){let e=t[0];for(let i=1;i<n;i++)e+=t[i];return e}function $t(n){return new Float64Array(n)}const ns=(3+16*lt)*lt,ss=(2+12*lt)*lt,os=(9+64*lt)*lt*lt,Mt=$t(4),on=$t(8),rn=$t(12),an=$t(16),j=$t(4);function rs(n,t,e,i,s,o,r){let a,l,h,d,c,u,p,y,g,x,v,M,B,O,I,Z,W,E;const T=n-s,N=e-s,U=t-o,q=i-o;O=T*q,u=R*T,p=u-(u-T),y=T-p,u=R*q,g=u-(u-q),x=q-g,I=y*x-(O-p*g-y*g-p*x),Z=U*N,u=R*U,p=u-(u-U),y=U-p,u=R*N,g=u-(u-N),x=N-g,W=y*x-(Z-p*g-y*g-p*x),v=I-W,c=I-v,Mt[0]=I-(v+c)+(c-W),M=O+v,c=M-O,B=O-(M-c)+(v-c),v=B-Z,c=B-v,Mt[1]=B-(v+c)+(c-Z),E=M+v,c=E-M,Mt[2]=M-(E-c)+(v-c),Mt[3]=E;let Q=is(4,Mt),ht=ss*r;if(Q>=ht||-Q>=ht||(c=n-T,a=n-(T+c)+(c-s),c=e-N,h=e-(N+c)+(c-s),c=t-U,l=t-(U+c)+(c-o),c=i-q,d=i-(q+c)+(c-o),a===0&&l===0&&h===0&&d===0)||(ht=os*r+es*Math.abs(Q),Q+=T*d+q*a-(U*h+N*l),Q>=ht||-Q>=ht))return Q;O=a*q,u=R*a,p=u-(u-a),y=a-p,u=R*q,g=u-(u-q),x=q-g,I=y*x-(O-p*g-y*g-p*x),Z=l*N,u=R*l,p=u-(u-l),y=l-p,u=R*N,g=u-(u-N),x=N-g,W=y*x-(Z-p*g-y*g-p*x),v=I-W,c=I-v,j[0]=I-(v+c)+(c-W),M=O+v,c=M-O,B=O-(M-c)+(v-c),v=B-Z,c=B-v,j[1]=B-(v+c)+(c-Z),E=M+v,c=E-M,j[2]=M-(E-c)+(v-c),j[3]=E;const me=Ke(4,Mt,4,j,on);O=T*d,u=R*T,p=u-(u-T),y=T-p,u=R*d,g=u-(u-d),x=d-g,I=y*x-(O-p*g-y*g-p*x),Z=U*h,u=R*U,p=u-(u-U),y=U-p,u=R*h,g=u-(u-h),x=h-g,W=y*x-(Z-p*g-y*g-p*x),v=I-W,c=I-v,j[0]=I-(v+c)+(c-W),M=O+v,c=M-O,B=O-(M-c)+(v-c),v=B-Z,c=B-v,j[1]=B-(v+c)+(c-Z),E=M+v,c=E-M,j[2]=M-(E-c)+(v-c),j[3]=E;const fn=Ke(me,on,4,j,rn);O=a*d,u=R*a,p=u-(u-a),y=a-p,u=R*d,g=u-(u-d),x=d-g,I=y*x-(O-p*g-y*g-p*x),Z=l*h,u=R*l,p=u-(u-l),y=l-p,u=R*h,g=u-(u-h),x=h-g,W=y*x-(Z-p*g-y*g-p*x),v=I-W,c=I-v,j[0]=I-(v+c)+(c-W),M=O+v,c=M-O,B=O-(M-c)+(v-c),v=B-Z,c=B-v,j[1]=B-(v+c)+(c-Z),E=M+v,c=E-M,j[2]=M-(E-c)+(v-c),j[3]=E;const gs=Ke(fn,rn,4,j,an);return an[gs-1]}function as(n,t,e,i,s,o){const r=(t-o)*(e-s),a=(n-s)*(i-o),l=r-a,h=Math.abs(r+a);return Math.abs(l)>=ns*h?l:-rs(n,t,e,i,s,o,h)}function ls(n,t){var e,i,s=0,o,r,a,l,h,d,c,u=n[0],p=n[1],y=t.length;for(e=0;e<y;e++){i=0;var g=t[e],x=g.length-1;if(d=g[0],d[0]!==g[x][0]&&d[1]!==g[x][1])throw new Error("First and last coordinates in a ring must be the same");for(r=d[0]-u,a=d[1]-p,i;i<x;i++){if(c=g[i+1],l=c[0]-u,h=c[1]-p,a===0&&h===0){if(l<=0&&r>=0||r<=0&&l>=0)return 0}else if(h>=0&&a<=0||h<=0&&a>=0){if(o=as(r,l,a,h,0,0),o===0)return 0;(o>0&&h>0&&a<=0||o<0&&h<=0&&a>0)&&s++}d=c,a=h,r=l}}return s%2!==0}function hs(n,t,e={}){const i={type:"Feature"};return(e.id===0||e.id)&&(i.id=e.id),e.bbox&&(i.bbox=e.bbox),i.properties={},i.geometry=n,i}function ds(n,t,e={}){if(!n)throw new Error("coordinates is required");if(!Array.isArray(n))throw new Error("coordinates must be an Array");if(n.length<2)throw new Error("coordinates must be at least 2 numbers long");if(!ln(n[0])||!ln(n[1]))throw new Error("coordinates must contain numbers");return hs({type:"Point",coordinates:n},t,e)}function ln(n){return!isNaN(n)&&n!==null&&!Array.isArray(n)}function cs(n){if(!n)throw new Error("coord is required");if(!Array.isArray(n)){if(n.type==="Feature"&&n.geometry!==null&&n.geometry.type==="Point")return[...n.geometry.coordinates];if(n.type==="Point")return[...n.coordinates]}if(Array.isArray(n)&&n.length>=2&&!Array.isArray(n[0])&&!Array.isArray(n[1]))return[...n];throw new Error("coord must be GeoJSON Point or an Array of numbers")}function us(n){return n.type==="Feature"?n.geometry:n}function ps(n,t,e={}){if(!n)throw new Error("point is required");if(!t)throw new Error("polygon is required");const i=cs(n),s=us(t),o=s.type,r=t.bbox;let a=s.coordinates;if(r&&_s(i,r)===!1)return!1;o==="Polygon"&&(a=[a]);let l=!1;for(var h=0;h<a.length;++h){const d=ls(i,a[h]);if(d===0)return!e.ignoreBoundary;d&&(l=!0)}return l}function _s(n,t){return t[0]<=n[0]&&t[1]<=n[1]&&t[2]>=n[0]&&t[3]>=n[1]}const hn="moveend zoomend refresh";class dn extends ue{atlas;geojson;static get observedAttributes(){return["hidden","data-collection","data-color","popovertarget"]}constructor(){super(),this.refresh=Xn(this.refresh,300)}connectedCallback(){queueMicrotask(()=>{this.atlas=this.closest("mtds-atlas")||void 0,this.atlas?.map?.on(hn,this.refresh,this),this.geojson=new _.GeoJSON(null,{style:cn(this),onEachFeature:(t,e)=>e.on("click",this.handleEvent,this)}).bindPopup(()=>`#${A(this,"popovertarget")}`),this.refresh(),this.attributeChangedCallback("hidden")})}attributeChangedCallback(t){const e=this.geojson,i=this.atlas?.map;t==="popovertarget"&&e?.getPopup()?.update(),t==="data-color"&&e?.setStyle(cn(this)),t==="data-collection"&&this.refresh(),t==="hidden"&&e&&i&&i[this.hidden?"removeLayer":"addLayer"](e)}disconnectedCallback(){this.atlas?.map?.off(hn,this.refresh,this),this.geojson?.unbindPopup().remove(),this.geojson=this.atlas=void 0}refresh(t){!this.geojson||!this.atlas?.map?.hasLayer(this.geojson)||this.getCollection().then(e=>{const i=e?.links.find(({rel:r})=>r==="items"),s=t===!0?`&nocache=${Date.now()}`:"",o=this.atlas?.map?.getBounds().toBBoxString();e?fetch(`${i?.href}?bbox=${o}${s}`).then(r=>r.json()).then(r=>this.geojson?.clearLayers().addData(r)):this.atlas?.getCollections().then(r=>{const a=`mtds-atlas-matgeo: Please set a vaild data-collection="${Object.keys(r).join(" | ")}"`;console.warn(a)})})}handleEvent(t){t.originalEvent.stopPropagation(),this.atlas?.getCollections().then(e=>{const i=[t.target],s={...t,targets:i,collections:e},o=ds([t.latlng.lng,t.latlng.lat]);this.atlas?.map?.eachLayer(r=>{if(r===t.target)return;(r.feature?.geometry&&ps(o,r.feature.geometry)||r instanceof _.Marker&&r.getLatLng().equals(t.latlng))&&i.push(r)}),this.dispatchEvent(new MouseEvent("click",t.originalEvent)),this.dispatchEvent(new CustomEvent("atlasfeatureclick",{detail:s,bubbles:!0}))})}async getCollection(){return this.atlas?.getCollections().then(t=>t?.[A(this,"data-collection")||""])}}const cn=n=>({color:`var(--mtds-color-${A(n,"data-color")||"main"}-base-default)`});pe("mtds-atlas-matgeo",dn);class un extends ue{atlas;wms;static get observedAttributes(){return["hidden","data-url","popovertarget"]}connectedCallback(){queueMicrotask(()=>{this.atlas=this.closest("mtds-atlas")||void 0,this.refresh()})}attributeChangedCallback(t){t==="data-url"&&this.refresh(),t==="popovertarget"&&this.wms?.getPopup()?.update(),t==="hidden"&&this.wms&&(this.atlas?.map?.[this.hidden?"removeLayer":"addLayer"](this.wms),this.wms.bringToFront())}refresh(){const t=new URL(A(this,"data-url")||""),e=Object.fromEntries(t.searchParams.entries());this.wms?.unbindPopup().remove(),this.wms=new _.TileLayer.WMS(`${t.origin}${t.pathname}`,e),this.attributeChangedCallback("hidden")}disconnectedCallback(){this.wms?.unbindPopup().remove(),this.wms=this.atlas=void 0}}pe("mtds-atlas-wms",un);let Ye=0;const pn=18,fs="https://cache.kartverket.no/v1/wmts/1.0.0/topo/default/webmercator/{z}/{y}/{x}.png",_n="https://matgeoservice-256616427209.europe-north1.run.app/ogc/features/collections",ms=[[57.5,4.73],[71.5,31.44]];class _e extends ue{cluster;map;static get observedAttributes(){return["data-view","data-scrollzoom"]}constructor(){super(),this.attachShadow({mode:"open"}).append(ce("figure")),Qn(this,`@layer leaflet{${Yn}}
-@layer mt.design{${ts}`)}connectedCallback(){const t=this.shadowRoot?.lastElementChild,e=A(this,"data-cluster")??"false",i=new _.TileLayer(fs,{attribution:"&copy; Kartverket",className:"leaflet-kartverket-tiles",maxZoom:pn});this.map=new _.Map(t,{attributionControl:!1,fadeAnimation:!1,layers:[i],zoomControl:!1,zoomSnap:.2}),en(this,"pointerup click",this.#t),this.map.addControl(new _.Control.Attribution({prefix:""})),this.map.addControl(new _.Control.Zoom({position:"bottomright"})),this.map.on("popupopen popupclose",this.#e,this),this.cluster=new _.MarkerClusterGroup({zoomToBoundsOnClick:!0,showCoverageOnHover:!1,disableClusteringAtZoom:e==="false"?1:Number(e)||pn+1,iconCreateFunction:s=>new _.DivIcon({html:`${s.getChildCount()}`,className:"leaflet-cluster-icon",iconSize:[30,30]})}).addTo(this.map);for(const s of _e.observedAttributes)this.attributeChangedCallback(s,null,A(this,s))}attributeChangedCallback(t,e,i){t==="data-view"&&this.setView(i||""),t==="data-scrollzoom"&&this.map?.scrollWheelZoom[i==="false"?"disable":"enable"]()}setView(t,e){const i=`${t}`.split(",").map(parseFloat).filter(Number.isFinite),s=this.cluster?.getBounds();if(i.length===3)return this.map?.setView([i[0],i[1]],i[2],e);if(t!=="fit")return this.map?.fitBounds(ms,e);if(s?.isValid())return this.map?.fitBounds(s.pad(.1),e);this.cluster?.once("layeradd",()=>{setTimeout(()=>this.setView("fit"),50)})}latLngFromPoint(t,e){return this.map?.pointerEventToLatLng({clientX:t,clientY:e})}disconnectedCallback(){Ve(this,"pointerup click",this.#t),this.map?.remove(),this.map=this.cluster=void 0}async getCollections(){return window._matgeoCollections||(window._matgeoCollections=fetch(_n).then(t=>t.json()).then(t=>t.collections.map(e=>[e.id,e])).then(Object.fromEntries)),window._matgeoCollections}#e({type:t,popup:e}){const i=t==="popupopen",s=e.getElement()?.querySelector(".leaflet-popup-content"),o=s?.querySelector(":scope > slot"),r=s?.textContent?.match(/^#(\S+)/)?.[1]||"",a=document.getElementById(o?.name||r);if(!a)return i&&r&&e.close();_.Util.setOptions(e,{maxWidth:this.offsetWidth-40}),A(a,"data-popover",i?A(a,"popover"):null),A(a,"popover",i?null:A(a,"data-popover")),A(a,"slot",i?a.id:null),i&&e.setContent(ce("slot",{name:a.id}))}#t(t){t.type==="click"?Ye&&t.stopPropagation?.():document.body.classList.contains("leaflet-dragging")&&(Ye=setTimeout(()=>{Ye=0},50))}}return pe("mtds-atlas",_e),tn()&&(_.Marker.prototype.options.icon=new _.DivIcon({html:'<div class="leaflet-marker-generated-slot"><div class="leaflet-marker-generated-icon"></div></div>',iconSize:[0,0]})),H.L=_,H.MATGEO_URL=_n,H.MTDSAtlasElement=_e,H.MTDSAtlasMarkerElement=sn,H.MTDSAtlasMatgeoElement=dn,H.MTDSAtlasWMSElement=un,Object.defineProperty(H,Symbol.toStringTag,{value:"Module"}),H})({});
+@layer mt.design{${ts}`)}connectedCallback(){const t=this.shadowRoot?.lastElementChild,e=A(this,"data-cluster")??"false",i=new _.TileLayer(fs,{attribution:"&copy; Kartverket",className:"leaflet-kartverket-tiles",maxZoom:pn});this.map=new _.Map(t,{attributionControl:!1,fadeAnimation:!1,layers:[i],zoomControl:!1,zoomSnap:.2}),en(this,"pointerup click",this.#t),this.map.addControl(new _.Control.Attribution({prefix:""})),this.map.addControl(new _.Control.Zoom({position:"bottomright"})),this.map.on("popupopen popupclose",this.#e,this),this.cluster=new _.MarkerClusterGroup({zoomToBoundsOnClick:!0,showCoverageOnHover:!1,disableClusteringAtZoom:e==="false"?1:Number(e)||pn+1,iconCreateFunction:s=>new _.DivIcon({html:`${s.getChildCount()}`,className:"leaflet-cluster-icon",iconSize:[40,40]})}).addTo(this.map);for(const s of _e.observedAttributes)this.attributeChangedCallback(s,null,A(this,s))}attributeChangedCallback(t,e,i){t==="data-view"&&this.setView(i||""),t==="data-scrollzoom"&&this.map?.scrollWheelZoom[i==="false"?"disable":"enable"]()}setView(t,e){const i=`${t}`.split(",").map(parseFloat).filter(Number.isFinite),s=this.cluster?.getBounds();if(i.length===3)return this.map?.setView([i[0],i[1]],i[2],e);if(t!=="fit")return this.map?.fitBounds(ms,e);if(s?.isValid())return this.map?.fitBounds(s.pad(.1),e);this.cluster?.once("layeradd",()=>{setTimeout(()=>this.setView("fit"),50)})}latLngFromPoint(t,e){return this.map?.pointerEventToLatLng({clientX:t,clientY:e})}disconnectedCallback(){Ve(this,"pointerup click",this.#t),this.map?.remove(),this.map=this.cluster=void 0}async getCollections(){return window._matgeoCollections||(window._matgeoCollections=fetch(_n).then(t=>t.json()).then(t=>t.collections.map(e=>[e.id,e])).then(Object.fromEntries)),window._matgeoCollections}#e({type:t,popup:e}){const i=t==="popupopen",s=e.getElement()?.querySelector(".leaflet-popup-content"),o=s?.querySelector(":scope > slot"),r=s?.textContent?.match(/^#(\S+)/)?.[1]||"",a=document.getElementById(o?.name||r);if(!a)return i&&r&&e.close();_.Util.setOptions(e,{maxWidth:this.offsetWidth-40}),A(a,"data-popover",i?A(a,"popover"):null),A(a,"popover",i?null:A(a,"data-popover")),A(a,"slot",i?a.id:null),i&&e.setContent(ce("slot",{name:a.id}))}#t(t){t.type==="click"?Ye&&t.stopPropagation?.():document.body.classList.contains("leaflet-dragging")&&(Ye=setTimeout(()=>{Ye=0},50))}}return pe("mtds-atlas",_e),tn()&&(_.Marker.prototype.options.icon=new _.DivIcon({html:'<div class="leaflet-marker-generated-slot"><div class="leaflet-marker-generated-icon"></div></div>',iconSize:[0,0]})),H.L=_,H.MATGEO_URL=_n,H.MTDSAtlasElement=_e,H.MTDSAtlasMarkerElement=sn,H.MTDSAtlasMatgeoElement=dn,H.MTDSAtlasWMSElement=un,Object.defineProperty(H,Symbol.toStringTag,{value:"Module"}),H})({});