@mattilsynet/design 2.2.7 → 2.2.9

package/mtds/map/map-element.js

@@ -1,66 +1,76 @@
-import o from "leaflet";
-import m from "leaflet/dist/images/marker-icon.png";
-import a from "leaflet/dist/images/marker-shadow.png";
-import p from "leaflet/dist/leaflet.css?raw";
-import { IS_BROWSER as i, MTDSElement as c, tag as r, on as u, off as l } from "../utils.js";
-import h from "./map.css.js";
-const d = "https://cache.kartverket.no/v1/wmts/1.0.0/topograatone/default/webmercator/{z}/{y}/{x}.png";
-class k extends c {
+import * as o from "leaflet";
+import m from "leaflet/dist/leaflet.css?raw";
+import a from "leaflet.markercluster/dist/MarkerCluster.css?raw";
+import "leaflet.markercluster";
+import { IS_BROWSER as p, MTDSElement as u, tag as s } from "../utils.js";
+import i from "./map.css.js";
+o.Marker.prototype.options.icon = o.divIcon({
+  html: '<svg class="map-pin" viewBox="0 0 256 256"><rect x="78" y="50" width="100" height="100" /><path fill="var(--mtds-)" d="M128,16a88.1,88.1,0,0,0-88,88c0,75.3,80,132.17,83.41,134.55a8,8,0,0,0,9.18,0C136,236.17,216,179.3,216,104A88.1,88.1,0,0,0,128,16Zm0,56a32,32,0,1,1-32,32A32,32,0,0,1,128,72Z"/></svg>',
+  iconAnchor: [15, 30],
+  iconSize: [30, 30]
+});
+const l = "https://cache.kartverket.no/v1/wmts/1.0.0/topograatone/default/webmercator/{z}/{y}/{x}.png";
+class c extends u {
   map;
+  cluster;
   constructor() {
     super();
-    const e = new CSSStyleSheet();
-    e.replaceSync(`${p}
-${h}`), this.attachShadow({ mode: "open" }).adoptedStyleSheets = [e], this.shadowRoot?.append(r("slot"), r("div")), o.Marker.prototype.options.icon = o.icon({
-      iconAnchor: [12, 41],
-      iconUrl: m,
-      shadowUrl: a
+    const t = new CSSStyleSheet();
+    t.replaceSync(`${m}
+${a}
+${i}`), this.attachShadow({ mode: "open" }).adoptedStyleSheets = [t], this.shadowRoot?.append(s("slot"), s("div")), this.cluster = o.markerClusterGroup({
+      showCoverageOnHover: !1
     });
   }
   connectedCallback() {
-    const e = [63.43067801397488, 10.402166438219403];
-    this.map = o.map(this.shadowRoot?.lastElementChild, { attributionControl: !1 }), this.map.addLayer(o.tileLayer(d, { maxZoom: 19 })), this.map.addLayer(o.marker(e)), this.map.setView(e, 13), u(this, "click", this);
+    this.map = o.map(this.shadowRoot?.lastElementChild, {
+      attributionControl: !1,
+      center: [63.43067801397488, 10.402166438219403],
+      zoom: 13,
+      layers: [o.tileLayer(l, { maxZoom: 18 }), this.cluster]
+    });
   }
-  handleEvent({ target: e }) {
-    console.log(e);
+  addMarker(t) {
+    return o.marker(t).addTo(this.cluster);
   }
   disconnectedCallback() {
-    l(this, "click", this), this.map?.remove();
+    this.map?.remove();
   }
 }
-i && !window.customElements.get("mtds-map") && window.customElements.define("mtds-map", k);
-async function v(n) {
+p && !window.customElements.get("mtds-map") && window.customElements.define("mtds-map", c);
+async function S(r) {
   try {
-    const s = await (await fetch(
-      `https://ws.geonorge.no/adresser/v1/sok?sok=${n}&fuzzy=false&utkoordsys=3857&treffPerSide=100&asciiKompatibel=true`
+    const n = await (await fetch(
+      `https://ws.geonorge.no/adresser/v1/sok?sok=${r}&fuzzy=false&utkoordsys=3857&treffPerSide=100&asciiKompatibel=true`
     )).json();
-    return s.adresser.length > 0 ? s.adresser.map((t) => ({
-      adressekode: t.adressekode,
-      adressetekst: t.adressetekst,
-      bokstav: t.bokstav,
-      bruksenhetsnummer: t.bruksenhetsnummer,
-      bruksnummer: t.bruksnummer,
-      festenummer: t.festenummer,
-      gardsnummer: t.gardsnummer,
-      kommunenavn: t.kommunenavn,
-      kommunenummer: t.kommunenummer,
-      nummer: t.nummer,
-      objtype: t.objtype,
-      oppdateringsdato: t.oppdateringsdato,
-      postnummer: t.postnummer,
-      poststed: t.poststed,
+    return n.adresser.length > 0 ? n.adresser.map((e) => ({
+      adressekode: e.adressekode,
+      adressetekst: e.adressetekst,
+      bokstav: e.bokstav,
+      bruksenhetsnummer: e.bruksenhetsnummer,
+      bruksnummer: e.bruksnummer,
+      festenummer: e.festenummer,
+      gardsnummer: e.gardsnummer,
+      kommunenavn: e.kommunenavn,
+      kommunenummer: e.kommunenummer,
+      nummer: e.nummer,
+      objtype: e.objtype,
+      oppdateringsdato: e.oppdateringsdato,
+      postnummer: e.postnummer,
+      poststed: e.poststed,
       representasjonspunkt: {
-        epsg: t.representasjonspunkt.epsg,
-        lat: t.representasjonspunkt.lat,
-        lon: t.representasjonspunkt.lon
+        epsg: e.representasjonspunkt.epsg,
+        lat: e.representasjonspunkt.lat,
+        lon: e.representasjonspunkt.lon
       }
     })) : [];
-  } catch (e) {
-    return console.log(`Feilet i å hente adresse fra punkt: ${e}`), [];
+  } catch (t) {
+    return console.log(`Feilet i å hente adresse fra punkt: ${t}`), [];
   }
 }
 export {
-  k as MTDSMapElement,
-  v as getPunktFraAdresse
+  o as L,
+  c as MTDSMapElement,
+  S as getPunktFraAdresse
 };
 //# sourceMappingURL=map-element.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"map-element.js","sources":["../../designsystem/map/map-element.ts"],"sourcesContent":["import L, { type LatLngExpression } from \"leaflet\";\nimport icon from 'leaflet/dist/images/marker-icon.png';\nimport iconShadow from 'leaflet/dist/images/marker-shadow.png';\nimport LCSS from \"leaflet/dist/leaflet.css?raw\";\nimport type * as ReactTypes from \"react\";\nimport { IS_BROWSER, MTDSElement, off, on, tag } from \"../utils\";\nimport css from \"./map.css?raw\";\n\ndeclare global {\n\tnamespace React.JSX {\n\t\tinterface IntrinsicElements {\n\t\t\t\"mtds-map\": ReactTypes.DetailedHTMLProps<\n\t\t\t\tReactTypes.HTMLAttributes<MTDSMapElement>,\n\t\t\t\tMTDSMapElement\n\t\t\t> & { class?: string };\n\t\t}\n\t}\n}\n\nconst KARTVERKET_GRAY = 'https://cache.kartverket.no/v1/wmts/1.0.0/topograatone/default/webmercator/{z}/{y}/{x}.png';\n\nexport class MTDSMapElement extends MTDSElement {\n\tmap?: L.Map;\n\n\tconstructor() {\n\t\tsuper();\n\t\tconst sheet = new CSSStyleSheet();\n\t\tsheet.replaceSync(`${LCSS}\\n${css}`);\n\t\tthis.attachShadow({ mode: \"open\" }).adoptedStyleSheets = [sheet];\n\t\tthis.shadowRoot?.append(tag(\"slot\"), tag(\"div\"));\n\n\t\tL.Marker.prototype.options.icon = L.icon({\n\t\t\ticonAnchor: [12, 41],\n\t\t\ticonUrl: icon,\n\t\t\tshadowUrl: iconShadow\n\t\t});\n\t}\n\tconnectedCallback() {\n\t\tconst center: LatLngExpression = [63.43067801397488, 10.402166438219403];\n\t\tthis.map = L.map(this.shadowRoot?.lastElementChild as HTMLElement, { attributionControl: false });\n\t\tthis.map.addLayer(L.tileLayer(KARTVERKET_GRAY, { maxZoom: 19 }));\n\t\tthis.map.addLayer(L.marker(center));\n\t\tthis.map.setView(center, 13)\n\n\t\ton(this, \"click\", this);\n\t}\n\thandleEvent({ target }: Event) {\n\t\tconsole.log(target);\n\t}\n\tdisconnectedCallback() {\n\t\toff(this, \"click\", this);\n\t\tthis.map?.remove();\n\t}\n}\n\nif (IS_BROWSER && !window.customElements.get(\"mtds-map\")) {\n\twindow.customElements.define(\"mtds-map\", MTDSMapElement);\n}\n\nexport type Adresse = {\n\tadressekode: number;\n\tadressetekst: string;\n\tbokstav: string;\n\tbruksenhetsnummer: string[];\n\tbruksnummer: number;\n\tfestenummer: number;\n\tgardsnummer: number;\n\tkommunenavn: string;\n\tkommunenummer: string;\n\tnummer: number;\n\tobjtype: string;\n\toppdateringsdato: string;\n\tpostnummer: string;\n\tpoststed: string;\n\trepresentasjonspunkt: {\n\t\tepsg: string;\n\t\tlat: number;\n\t\tlon: number;\n\t};\n\tstedfestingverifisert: boolean;\n\tundernummer: string | null;\n};\n\n// Hent punkt for adresse fra GeoNorge\nexport async function getPunktFraAdresse(\n\tadresseSoek: string,\n): Promise<Adresse[]> {\n\ttry {\n\t\tconst response = await fetch(\n\t\t\t`https://ws.geonorge.no/adresser/v1/sok?sok=${adresseSoek}&fuzzy=false&utkoordsys=3857&treffPerSide=100&asciiKompatibel=true`,\n\t\t);\n\t\tconst jsonresponse = await response.json();\n\t\tif (jsonresponse.adresser.length > 0) {\n\t\t\treturn jsonresponse.adresser.map((adresse: Adresse) => ({\n\t\t\t\tadressekode: adresse.adressekode,\n\t\t\t\tadressetekst: adresse.adressetekst,\n\t\t\t\tbokstav: adresse.bokstav,\n\t\t\t\tbruksenhetsnummer: adresse.bruksenhetsnummer,\n\t\t\t\tbruksnummer: adresse.bruksnummer,\n\t\t\t\tfestenummer: adresse.festenummer,\n\t\t\t\tgardsnummer: adresse.gardsnummer,\n\t\t\t\tkommunenavn: adresse.kommunenavn,\n\t\t\t\tkommunenummer: adresse.kommunenummer,\n\t\t\t\tnummer: adresse.nummer,\n\t\t\t\tobjtype: adresse.objtype,\n\t\t\t\toppdateringsdato: adresse.oppdateringsdato,\n\t\t\t\tpostnummer: adresse.postnummer,\n\t\t\t\tpoststed: adresse.poststed,\n\t\t\t\trepresentasjonspunkt: {\n\t\t\t\t\tepsg: adresse.representasjonspunkt.epsg,\n\t\t\t\t\tlat: adresse.representasjonspunkt.lat,\n\t\t\t\t\tlon: adresse.representasjonspunkt.lon,\n\t\t\t\t},\n\t\t\t}));\n\t\t} else {\n\t\t\treturn [];\n\t\t}\n\t} catch (error) {\n\t\tconsole.log(`Feilet i å hente adresse fra punkt: ${error}`);\n\t\treturn [];\n\t}\n}\n"],"names":["KARTVERKET_GRAY","MTDSMapElement","MTDSElement","sheet","LCSS","css","tag","L","icon","iconShadow","center","on","target","off","IS_BROWSER","getPunktFraAdresse","adresseSoek","jsonresponse","adresse","error"],"mappings":";;;;;;AAmBA,MAAMA,IAAkB;AAEjB,MAAMC,UAAuBC,EAAY;AAAA,EAC/C;AAAA,EAEA,cAAc;AACb,UAAA;AACA,UAAMC,IAAQ,IAAI,cAAA;AAClB,IAAAA,EAAM,YAAY,GAAGC,CAAI;AAAA,EAAKC,CAAG,EAAE,GACnC,KAAK,aAAa,EAAE,MAAM,OAAA,CAAQ,EAAE,qBAAqB,CAACF,CAAK,GAC/D,KAAK,YAAY,OAAOG,EAAI,MAAM,GAAGA,EAAI,KAAK,CAAC,GAE/CC,EAAE,OAAO,UAAU,QAAQ,OAAOA,EAAE,KAAK;AAAA,MACxC,YAAY,CAAC,IAAI,EAAE;AAAA,MACnB,SAASC;AAAA,MACT,WAAWC;AAAA,IAAA,CACX;AAAA,EACF;AAAA,EACA,oBAAoB;AACnB,UAAMC,IAA2B,CAAC,mBAAmB,kBAAkB;AACvE,SAAK,MAAMH,EAAE,IAAI,KAAK,YAAY,kBAAiC,EAAE,oBAAoB,IAAO,GAChG,KAAK,IAAI,SAASA,EAAE,UAAUP,GAAiB,EAAE,SAAS,GAAA,CAAI,CAAC,GAC/D,KAAK,IAAI,SAASO,EAAE,OAAOG,CAAM,CAAC,GAClC,KAAK,IAAI,QAAQA,GAAQ,EAAE,GAE3BC,EAAG,MAAM,SAAS,IAAI;AAAA,EACvB;AAAA,EACA,YAAY,EAAE,QAAAC,KAAiB;AAC9B,YAAQ,IAAIA,CAAM;AAAA,EACnB;AAAA,EACA,uBAAuB;AACtB,IAAAC,EAAI,MAAM,SAAS,IAAI,GACvB,KAAK,KAAK,OAAA;AAAA,EACX;AACD;AAEIC,KAAc,CAAC,OAAO,eAAe,IAAI,UAAU,KACtD,OAAO,eAAe,OAAO,YAAYb,CAAc;AA4BxD,eAAsBc,EACrBC,GACqB;AACrB,MAAI;AAIH,UAAMC,IAAe,OAHJ,MAAM;AAAA,MACtB,8CAA8CD,CAAW;AAAA,IAAA,GAEtB,KAAA;AACpC,WAAIC,EAAa,SAAS,SAAS,IAC3BA,EAAa,SAAS,IAAI,CAACC,OAAsB;AAAA,MACvD,aAAaA,EAAQ;AAAA,MACrB,cAAcA,EAAQ;AAAA,MACtB,SAASA,EAAQ;AAAA,MACjB,mBAAmBA,EAAQ;AAAA,MAC3B,aAAaA,EAAQ;AAAA,MACrB,aAAaA,EAAQ;AAAA,MACrB,aAAaA,EAAQ;AAAA,MACrB,aAAaA,EAAQ;AAAA,MACrB,eAAeA,EAAQ;AAAA,MACvB,QAAQA,EAAQ;AAAA,MAChB,SAASA,EAAQ;AAAA,MACjB,kBAAkBA,EAAQ;AAAA,MAC1B,YAAYA,EAAQ;AAAA,MACpB,UAAUA,EAAQ;AAAA,MAClB,sBAAsB;AAAA,QACrB,MAAMA,EAAQ,qBAAqB;AAAA,QACnC,KAAKA,EAAQ,qBAAqB;AAAA,QAClC,KAAKA,EAAQ,qBAAqB;AAAA,MAAA;AAAA,IACnC,EACC,IAEK,CAAA;AAAA,EAET,SAASC,GAAO;AACf,mBAAQ,IAAI,uCAAuCA,CAAK,EAAE,GACnD,CAAA;AAAA,EACR;AACD;"}
+{"version":3,"file":"map-element.js","sources":["../../designsystem/map/map-element.ts"],"sourcesContent":["import * as L from \"leaflet\";\nimport LeafletCSS from \"leaflet/dist/leaflet.css?raw\";\nimport LeafletClusterCSS from \"leaflet.markercluster/dist/MarkerCluster.css?raw\";\nimport \"leaflet.markercluster\";\nimport type * as ReactTypes from \"react\";\nimport { IS_BROWSER, MTDSElement, tag } from \"../utils\";\nimport MapCss from \"./map.css?raw\";\n\ntype JSXMapAttrs = ReactTypes.HTMLAttributes<MTDSMapElement>;\ntype JSXMapProps = ReactTypes.DetailedHTMLProps<JSXMapAttrs, MTDSMapElement>;\ndeclare global {\n\tnamespace React.JSX {\n\t\tinterface IntrinsicElements {\n\t\t\t\"mtds-map\": JSXMapProps & { class?: string };\n\t\t}\n\t}\n}\n\nL.Marker.prototype.options.icon = L.divIcon({\n\thtml: '<svg class=\"map-pin\" viewBox=\"0 0 256 256\"><rect x=\"78\" y=\"50\" width=\"100\" height=\"100\" /><path fill=\"var(--mtds-)\" d=\"M128,16a88.1,88.1,0,0,0-88,88c0,75.3,80,132.17,83.41,134.55a8,8,0,0,0,9.18,0C136,236.17,216,179.3,216,104A88.1,88.1,0,0,0,128,16Zm0,56a32,32,0,1,1-32,32A32,32,0,0,1,128,72Z\"/></svg>',\n\ticonAnchor: [15, 30],\n\ticonSize: [30, 30],\n});\n\nconst KARTVERKET_GRAY =\n\t\"https://cache.kartverket.no/v1/wmts/1.0.0/topograatone/default/webmercator/{z}/{y}/{x}.png\";\n\nexport { L };\nexport class MTDSMapElement extends MTDSElement {\n\tmap?: L.Map;\n\tcluster: L.MarkerClusterGroup;\n\n\tconstructor() {\n\t\tsuper();\n\t\tconst sheet = new CSSStyleSheet();\n\t\tsheet.replaceSync(`${LeafletCSS}\\n${LeafletClusterCSS}\\n${MapCss}`);\n\t\tthis.attachShadow({ mode: \"open\" }).adoptedStyleSheets = [sheet];\n\t\tthis.shadowRoot?.append(tag(\"slot\"), tag(\"div\"));\n\t\tthis.cluster = L.markerClusterGroup({\n\t\t\tshowCoverageOnHover: false,\n\t\t});\n\t}\n\tconnectedCallback() {\n\t\tthis.map = L.map(this.shadowRoot?.lastElementChild as HTMLElement, {\n\t\t\tattributionControl: false,\n\t\t\tcenter: [63.43067801397488, 10.402166438219403],\n\t\t\tzoom: 13,\n\t\t\tlayers: [L.tileLayer(KARTVERKET_GRAY, { maxZoom: 18 }), this.cluster],\n\t\t});\n\t}\n\taddMarker(point: L.LatLngExpression) {\n\t\treturn L.marker(point).addTo(this.cluster);\n\t}\n\tdisconnectedCallback() {\n\t\tthis.map?.remove();\n\t}\n}\n\nif (IS_BROWSER && !window.customElements.get(\"mtds-map\"))\n\twindow.customElements.define(\"mtds-map\", MTDSMapElement);\n\nexport type Adresse = {\n\tadressekode: number;\n\tadressetekst: string;\n\tbokstav: string;\n\tbruksenhetsnummer: string[];\n\tbruksnummer: number;\n\tfestenummer: number;\n\tgardsnummer: number;\n\tkommunenavn: string;\n\tkommunenummer: string;\n\tnummer: number;\n\tobjtype: string;\n\toppdateringsdato: string;\n\tpostnummer: string;\n\tpoststed: string;\n\trepresentasjonspunkt: {\n\t\tepsg: string;\n\t\tlat: number;\n\t\tlon: number;\n\t};\n\tstedfestingverifisert: boolean;\n\tundernummer: string | null;\n};\n\n// Hent punkt for adresse fra GeoNorge\nexport async function getPunktFraAdresse(\n\tadresseSoek: string,\n): Promise<Adresse[]> {\n\ttry {\n\t\tconst response = await fetch(\n\t\t\t`https://ws.geonorge.no/adresser/v1/sok?sok=${adresseSoek}&fuzzy=false&utkoordsys=3857&treffPerSide=100&asciiKompatibel=true`,\n\t\t);\n\t\tconst jsonresponse = await response.json();\n\t\tif (jsonresponse.adresser.length > 0) {\n\t\t\treturn jsonresponse.adresser.map((adresse: Adresse) => ({\n\t\t\t\tadressekode: adresse.adressekode,\n\t\t\t\tadressetekst: adresse.adressetekst,\n\t\t\t\tbokstav: adresse.bokstav,\n\t\t\t\tbruksenhetsnummer: adresse.bruksenhetsnummer,\n\t\t\t\tbruksnummer: adresse.bruksnummer,\n\t\t\t\tfestenummer: adresse.festenummer,\n\t\t\t\tgardsnummer: adresse.gardsnummer,\n\t\t\t\tkommunenavn: adresse.kommunenavn,\n\t\t\t\tkommunenummer: adresse.kommunenummer,\n\t\t\t\tnummer: adresse.nummer,\n\t\t\t\tobjtype: adresse.objtype,\n\t\t\t\toppdateringsdato: adresse.oppdateringsdato,\n\t\t\t\tpostnummer: adresse.postnummer,\n\t\t\t\tpoststed: adresse.poststed,\n\t\t\t\trepresentasjonspunkt: {\n\t\t\t\t\tepsg: adresse.representasjonspunkt.epsg,\n\t\t\t\t\tlat: adresse.representasjonspunkt.lat,\n\t\t\t\t\tlon: adresse.representasjonspunkt.lon,\n\t\t\t\t},\n\t\t\t}));\n\t\t} else {\n\t\t\treturn [];\n\t\t}\n\t} catch (error) {\n\t\tconsole.log(`Feilet i å hente adresse fra punkt: ${error}`);\n\t\treturn [];\n\t}\n}\n"],"names":["L","KARTVERKET_GRAY","MTDSMapElement","MTDSElement","sheet","LeafletCSS","LeafletClusterCSS","MapCss","tag","point","IS_BROWSER","getPunktFraAdresse","adresseSoek","jsonresponse","adresse","error"],"mappings":";;;;;;AAkBAA,EAAE,OAAO,UAAU,QAAQ,OAAOA,EAAE,QAAQ;AAAA,EAC3C,MAAM;AAAA,EACN,YAAY,CAAC,IAAI,EAAE;AAAA,EACnB,UAAU,CAAC,IAAI,EAAE;AAClB,CAAC;AAED,MAAMC,IACL;AAGM,MAAMC,UAAuBC,EAAY;AAAA,EAC/C;AAAA,EACA;AAAA,EAEA,cAAc;AACb,UAAA;AACA,UAAMC,IAAQ,IAAI,cAAA;AAClB,IAAAA,EAAM,YAAY,GAAGC,CAAU;AAAA,EAAKC,CAAiB;AAAA,EAAKC,CAAM,EAAE,GAClE,KAAK,aAAa,EAAE,MAAM,OAAA,CAAQ,EAAE,qBAAqB,CAACH,CAAK,GAC/D,KAAK,YAAY,OAAOI,EAAI,MAAM,GAAGA,EAAI,KAAK,CAAC,GAC/C,KAAK,UAAUR,EAAE,mBAAmB;AAAA,MACnC,qBAAqB;AAAA,IAAA,CACrB;AAAA,EACF;AAAA,EACA,oBAAoB;AACnB,SAAK,MAAMA,EAAE,IAAI,KAAK,YAAY,kBAAiC;AAAA,MAClE,oBAAoB;AAAA,MACpB,QAAQ,CAAC,mBAAmB,kBAAkB;AAAA,MAC9C,MAAM;AAAA,MACN,QAAQ,CAACA,EAAE,UAAUC,GAAiB,EAAE,SAAS,GAAA,CAAI,GAAG,KAAK,OAAO;AAAA,IAAA,CACpE;AAAA,EACF;AAAA,EACA,UAAUQ,GAA2B;AACpC,WAAOT,EAAE,OAAOS,CAAK,EAAE,MAAM,KAAK,OAAO;AAAA,EAC1C;AAAA,EACA,uBAAuB;AACtB,SAAK,KAAK,OAAA;AAAA,EACX;AACD;AAEIC,KAAc,CAAC,OAAO,eAAe,IAAI,UAAU,KACtD,OAAO,eAAe,OAAO,YAAYR,CAAc;AA2BxD,eAAsBS,EACrBC,GACqB;AACrB,MAAI;AAIH,UAAMC,IAAe,OAHJ,MAAM;AAAA,MACtB,8CAA8CD,CAAW;AAAA,IAAA,GAEtB,KAAA;AACpC,WAAIC,EAAa,SAAS,SAAS,IAC3BA,EAAa,SAAS,IAAI,CAACC,OAAsB;AAAA,MACvD,aAAaA,EAAQ;AAAA,MACrB,cAAcA,EAAQ;AAAA,MACtB,SAASA,EAAQ;AAAA,MACjB,mBAAmBA,EAAQ;AAAA,MAC3B,aAAaA,EAAQ;AAAA,MACrB,aAAaA,EAAQ;AAAA,MACrB,aAAaA,EAAQ;AAAA,MACrB,aAAaA,EAAQ;AAAA,MACrB,eAAeA,EAAQ;AAAA,MACvB,QAAQA,EAAQ;AAAA,MAChB,SAASA,EAAQ;AAAA,MACjB,kBAAkBA,EAAQ;AAAA,MAC1B,YAAYA,EAAQ;AAAA,MACpB,UAAUA,EAAQ;AAAA,MAClB,sBAAsB;AAAA,QACrB,MAAMA,EAAQ,qBAAqB;AAAA,QACnC,KAAKA,EAAQ,qBAAqB;AAAA,QAClC,KAAKA,EAAQ,qBAAqB;AAAA,MAAA;AAAA,IACnC,EACC,IAEK,CAAA;AAAA,EAET,SAASC,GAAO;AACf,mBAAQ,IAAI,uCAAuCA,CAAK,EAAE,GACnD,CAAA;AAAA,EACR;AACD;"}

package/mtds/map/map.css.js

@@ -1,9 +1,15 @@
-const t = `:host {
+const n = `:host {
+	aspect-ratio: 2;
 	background: var(--mtds-color-neutral-surface-tinted);
-	display: grid;
+	border-radius: var(--mtds-border-radius-md);
+	overflow: clip;
 	position: relative;
+	user-select: none;
+}
+:host(:not([hidden])) {
+	display: grid;
 }
-:host slot {
+slot {
 	display: grid;
 	inset: var(--mtds-3);
 	pointer-events: none;
@@ -13,10 +19,28 @@ const t = `:host {
 ::slotted(*) {
 	pointer-events: all;
 }
-:host .leaflet-container {
+.leaflet-div-icon {
+	background: none;
+	border: 0;
+}
+.leaflet-container {
+	background: var(--mtds-color-neutral-surface-tinted);
+}
+.leaflet-container {
 	outline: 0;
-}`;
+}
+.leaflet-tile-container {
+	filter: contrast(0.75) brightness(1.15);
+}
+
+.map-pin rect {
+	fill: var(--mtds-color-surface-default);
+}
+.map-pin path {
+	fill: var(--mtds-color-text-default);
+}
+`;
 export {
-  t as default
+  n as default
 };
 //# sourceMappingURL=map.css.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"map.css.js","sources":["../../designsystem/map/map.css?raw"],"sourcesContent":["export default \":host {\\n\\tbackground: var(--ds-color-neutral-surface-tinted);\\n\\tdisplay: grid;\\n\\tposition: relative;\\n}\\n:host slot {\\n\\tdisplay: grid;\\n\\tinset: var(--mtds-3);\\n\\tpointer-events: none;\\n\\tposition: absolute;\\n\\tz-index: 2;\\n}\\n::slotted(*) {\\n\\tpointer-events: all;\\n}\\n:host .leaflet-container {\\n\\toutline: 0;\\n}\""],"names":["css"],"mappings":"AAAA,MAAAA,IAAe;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;"}
+{"version":3,"file":"map.css.js","sources":["../../designsystem/map/map.css?raw"],"sourcesContent":["export default \":host {\\n\\taspect-ratio: 2;\\n\\tbackground: var(--ds-color-neutral-surface-tinted);\\n\\tborder-radius: var(--ds-border-radius-md);\\n\\toverflow: clip;\\n\\tposition: relative;\\n\\tuser-select: none;\\n}\\n:host(:not([hidden])) {\\n\\tdisplay: grid;\\n}\\nslot {\\n\\tdisplay: grid;\\n\\tinset: var(--mtds-3);\\n\\tpointer-events: none;\\n\\tposition: absolute;\\n\\tz-index: 2;\\n}\\n::slotted(*) {\\n\\tpointer-events: all;\\n}\\n.leaflet-div-icon {\\n\\tbackground: none;\\n\\tborder: 0;\\n}\\n.leaflet-container {\\n\\tbackground: var(--ds-color-neutral-surface-tinted);\\n}\\n.leaflet-container {\\n\\toutline: 0;\\n}\\n.leaflet-tile-container {\\n\\tfilter: contrast(0.75) brightness(1.15);\\n}\\n\\n.map-pin rect {\\n\\tfill: var(--ds-color-surface-default);\\n}\\n.map-pin path {\\n\\tfill: var(--ds-color-text-default);\\n}\\n\""],"names":["MapCss"],"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;"}