utopia-ui 3.0.87 → 3.0.90

package/dist/index.d.ts

@@ -40,7 +40,7 @@ export { default as SVG } from 'react-inlinesvg';
  * ```
  * @category Map
  */
-declare function UtopiaMap({ height, width, center, zoom, children, geo, showFilterControl, showGratitudeControl, showLayerControl, showThemeControl, defaultTheme, donationWidget, }: {
+declare function UtopiaMap({ height, width, center, zoom, children, geo, showFilterControl, showGratitudeControl, showLayerControl, showZoomControl, showThemeControl, defaultTheme, donationWidget, }: {
     /** height of the map (default '500px') */
     height?: string;
     /** width of the map (default '100%') */
@@ -59,6 +59,8 @@ declare function UtopiaMap({ height, width, center, zoom, children, geo, showFil
     showLayerControl?: boolean;
     /** show the layer control widget (default true) */
     showGratitudeControl?: boolean;
+    /** show zoom control widget (default false) */
+    showZoomControl?: boolean;
     /** show a widget to switch the theme */
     showThemeControl?: boolean;
     /** the defaut theme */

package/dist/index.esm.js

@@ -75,7 +75,7 @@ styleInject(css_248z$3);
 var css_248z$2 = ".svg-container {\n    position: relative;\n    width: 33px; /* gleiche Breite wie das untere SVG */\n    height: 44px; /* gleiche Höhe wie das untere SVG */\n  }\n  \n  .overlay-svg {\n    position: absolute;\n    width: 12.5px;\n    top: calc(50% - 5px);\n    left: 50%;\n    transform: translate(-50%, -50%);\n  }";
 styleInject(css_248z$2);
 
-var css_248z$1 = ".leaflet-control-attribution {\n    display: none;\n}\n\n.leaflet-control-locate {\n    display: none;\n}\n\n.leaflet-data-marker {\n    background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACMAAAAQCAYAAACcN8ZaAAAB3klEQVR42s3U4UdDURzG8czMXJnJ1Vwzc6VJZjaZJdlMlpQsKdmUFNOUspRSSqUolfQfr+fF98Vx5mwv9qbDx7LdznnO7/7Omej3+/+Ga0QMUYkhbvBgmhzCQxwxibIGrGEF8CQhU+LLtKQkQNqScUgjxRxTBIxbgfgD/BgnhM8kM5KTeclLQYqGkkMRBckzR8ic/mAgd5BAZplsUaqyIg2sDtHg2brUZJk5SmwopErJUWE8SpmTMhNvya60Zd/SNrR4bkeaskG4uiwRZk6yrJEYFibGAxn+scECHTmTnuVCzvmty3PHciB7bGKN6lQkzysPqIrHmpFhYbKUtckC1/Ioz4ZHuZdbuSLYiRxRpSZVWXZVxAzC0R4Ik5SQsu6w8yd5l2/5kg95I9SdXMoZQfYIUjeqEUrgOkXGPeN4TYRhxy8E+ZUf+eS7B7miIoeybVSjKDnm8u3+gH3pDTYwu1igATvs/pXqvBKiR4i2bNJfi1ZfUAnjgrOG8wY2quNzBKuU/ZS+uSFEl5O0xRGuUIlZCcw7xG5QPkeHYUSNV5WXGou2sC3rBC0LjenqCXGO0WEiTJa0Lr4KixdHBrDGuGGiRqCUpFk8pGIpQtCU7p4YPwxYxEMCk1aAMQZh8Ac8PfbIzYPJOwAAAABJRU5ErkJggg==') no-repeat;\n    background-position: 6px 32px;\n}\n\n.leaflet-container {\n    cursor: inherit;\n}\n\n.leaflet-popup-scrolled {\n    overflow-x: hidden;\n}\n\n.leaflet-popup-content-wrapper, .leaflet-popup-tip{\n    background-color: var(--color-base-100);\n    color: var(--color-base-content);\n    border-radius: var(--radius-box);\n}\n\n.leaflet-popup-tip-container, .leaflet-popup-tip{\n    border-radius: 0;\n}\n\n.leaflet-tooltip {\n    background-color: var(--color-base-100);\n    color: var(--color-base-content);\n    border-width: 0px;\n}\n\n.leaflet-tooltip {\n    border-radius: var(--radius-box);\n    transition: opacity 500ms;\n    transition-delay: 50ms;\n}\n\n.leaflet-tooltip::before {\n    border-top-color: var(--color-base-100);\n}\n\n.leaflet-container {\n    text-align: left;\n    background-image: url(\"data:image/svg+xml,%3Csvg width='40' height='40' stroke='%23000' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cstyle%3E.spinner_V8m1%7Btransform-origin:center;animation:spinner_zKoa 2s linear infinite%7D.spinner_V8m1 circle%7Bstroke-linecap:round;animation:spinner_YpZS 1.5s ease-out infinite%7D%40keyframes spinner_zKoa%7B100%25%7Btransform:rotate(360deg)%7D%7D%40keyframes spinner_YpZS%7B0%25%7Bstroke-dasharray:0 150;stroke-dashoffset:0%7D47.5%25%7Bstroke-dasharray:42 150;stroke-dashoffset:-16%7D95%25%2C100%25%7Bstroke-dasharray:42 150;stroke-dashoffset:-59%7D%7D%3C%2Fstyle%3E%3Cg class='spinner_V8m1'%3E%3Ccircle cx='12' cy='12' r='9.5' fill='none' stroke-width='3'%3E%3C%2Fcircle%3E%3C%2Fg%3E%3C%2Fsvg%3E\");\n    background-repeat: no-repeat;\n    background-attachment: fixed;\n    background-position: 50% 80%;\n}\n\n.leaflet-popup-close-button span {\n    color: var(--color-base-content);\n    opacity: 50%;\n}";
+var css_248z$1 = " .leaflet-control-attribution {\n    display: none;\n}\n\n.leaflet-control-locate {\n    display: none;\n}\n\n.leaflet-data-marker {\n    background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACMAAAAQCAYAAACcN8ZaAAAB3klEQVR42s3U4UdDURzG8czMXJnJ1Vwzc6VJZjaZJdlMlpQsKdmUFNOUspRSSqUolfQfr+fF98Vx5mwv9qbDx7LdznnO7/7Omej3+/+Ga0QMUYkhbvBgmhzCQxwxibIGrGEF8CQhU+LLtKQkQNqScUgjxRxTBIxbgfgD/BgnhM8kM5KTeclLQYqGkkMRBckzR8ic/mAgd5BAZplsUaqyIg2sDtHg2brUZJk5SmwopErJUWE8SpmTMhNvya60Zd/SNrR4bkeaskG4uiwRZk6yrJEYFibGAxn+scECHTmTnuVCzvmty3PHciB7bGKN6lQkzysPqIrHmpFhYbKUtckC1/Ioz4ZHuZdbuSLYiRxRpSZVWXZVxAzC0R4Ik5SQsu6w8yd5l2/5kg95I9SdXMoZQfYIUjeqEUrgOkXGPeN4TYRhxy8E+ZUf+eS7B7miIoeybVSjKDnm8u3+gH3pDTYwu1igATvs/pXqvBKiR4i2bNJfi1ZfUAnjgrOG8wY2quNzBKuU/ZS+uSFEl5O0xRGuUIlZCcw7xG5QPkeHYUSNV5WXGou2sC3rBC0LjenqCXGO0WEiTJa0Lr4KixdHBrDGuGGiRqCUpFk8pGIpQtCU7p4YPwxYxEMCk1aAMQZh8Ac8PfbIzYPJOwAAAABJRU5ErkJggg==') no-repeat;\n    background-position: 6px 32px;\n}\n\n.leaflet-container {\n    cursor: inherit;\n}\n\n.leaflet-popup-scrolled {\n    overflow-x: hidden;\n}\n\n.leaflet-popup-content-wrapper, .leaflet-popup-tip{\n    background-color: var(--color-base-100);\n    color: var(--color-base-content);\n    border-radius: var(--radius-box);\n}\n\n.leaflet-popup-tip-container, .leaflet-popup-tip{\n    border-radius: 0;\n}\n\n.leaflet-tooltip {\n    background-color: var(--color-base-100);\n    color: var(--color-base-content);\n    border-width: 0px;\n}\n\n.leaflet-tooltip {\n    border-radius: var(--radius-box);\n    transition: opacity 500ms;\n    transition-delay: 50ms;\n}\n\n.leaflet-tooltip::before {\n    border-top-color: var(--color-base-100);\n}\n\n.leaflet-container {\n    text-align: left;\n    background-image: url(\"data:image/svg+xml,%3Csvg width='40' height='40' stroke='%23000' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cstyle%3E.spinner_V8m1%7Btransform-origin:center;animation:spinner_zKoa 2s linear infinite%7D.spinner_V8m1 circle%7Bstroke-linecap:round;animation:spinner_YpZS 1.5s ease-out infinite%7D%40keyframes spinner_zKoa%7B100%25%7Btransform:rotate(360deg)%7D%7D%40keyframes spinner_YpZS%7B0%25%7Bstroke-dasharray:0 150;stroke-dashoffset:0%7D47.5%25%7Bstroke-dasharray:42 150;stroke-dashoffset:-16%7D95%25%2C100%25%7Bstroke-dasharray:42 150;stroke-dashoffset:-59%7D%7D%3C%2Fstyle%3E%3Cg class='spinner_V8m1'%3E%3Ccircle cx='12' cy='12' r='9.5' fill='none' stroke-width='3'%3E%3C%2Fcircle%3E%3C%2Fg%3E%3C%2Fsvg%3E\");\n    background-repeat: no-repeat;\n    background-attachment: fixed;\n    background-position: 50% 80%;\n}\n\n.leaflet-popup-close-button span {\n    color: var(--color-base-content);\n    opacity: 50%;\n}\n\n.leaflet-top {\n    top: 6em\n}\n\n.leaflet-left {\n    left: 0.5em\n}\n\n.leaflet-control-zoom {\n    border-radius: var(--radius-box);\n    color: var(--color-base-content);\n    background-color: var(--color-base-100);\n    width: calc(var(--tw-spacing) * 10);\n    border: 2px solid var(--color-base-300) !important;\n    box-shadow: 0 20px 25px -5px  rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1) !important;\n}\n\n.leaflet-control-zoom-in {\n    border-top-left-radius: var(--radius-box) !important;\n    border-top-right-radius: var(--radius-box) !important;\n    color: var(--color-base-content) !important;\n    background-color: var(--color-base-100) !important;\n    width: calc(var(--tw-spacing) * 9) !important;\n    border-bottom: 1px solid var(--color-base-300) !important;\n    height: calc(var(--tw-spacing) * 9) !important;\n    line-height: 40px !important;\n}\n\n.leaflet-control-zoom-out {\n    border-bottom-left-radius: var(--radius-box) !important;\n    border-bottom-right-radius: var(--radius-box) !important;\n    color: var(--color-base-content) !important;\n    background-color: var(--color-base-100) !important;\n    width: calc(var(--tw-spacing) * 9) !important;\n    height: calc(var(--tw-spacing) * 9) !important;\n    line-height: 40px !important;\n}\n\n";
 styleInject(css_248z$1);
 
 var css_248z = ".picker {\n    position: relative;\n}\n\n.swatch {\n    width: 28px;\n    height: 28px;\n    border-radius: 8px;\n    border: 3px solid #fff;\n    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1), inset 0 0 0 1px rgba(0, 0, 0, 0.1);\n    cursor: pointer;\n}\n\n.popover {\n    position: absolute;\n    top: 0;\n    left: 36px;\n    border-radius: 9px;\n    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);\n}";
@@ -1387,8 +1387,6 @@ const createSvg = (shape, markerColor, borderColor) => {
     return svgMap[shape];
 };
 const MarkerIconFactory = (shape, color1, color2, icon, assetsURL) => {
-    console.log(icon);
-    console.log(assetsURL);
     if (icon)
         return divIcon({
             html: `<div class="svg-container">${createSvg(shape, color1, color2)}<img class="overlay-svg" style="width: ${icon.size ? icon.size : '12.5'}px; filter: invert(1) brightness(2);" src="${`${assetsURL ?? ''}` + icon.image}"></div>`,
@@ -2498,7 +2496,7 @@ const SearchControl = () => {
                                 else {
                                     navigate('item/' + item.id + '?' + new URLSearchParams(window.location.search));
                                 }
-                            }, children: [item.layer?.menuIcon ? (jsx(SVG, { src: item.layer.menuIcon, className: 'tw:text-current tw:mr-2 tw:mt-0 tw:w-5', preProcessor: (code) => {
+                            }, children: [item.layer?.menuIcon ? (jsx(SVG, { src: item.layer.menuIcon, className: 'tw:text-current tw:mr-2 tw:mt-0 tw:w-5 tw:h-5', preProcessor: (code) => {
                                         code = code.replace(/fill=".*?"/g, 'fill="currentColor"');
                                         code = code.replace(/stroke=".*?"/g, 'stroke="currentColor"');
                                         return code;
@@ -2881,8 +2879,8 @@ function UtopiaMapInner({ children, geo, showFilterControl = false, showGratitud
  * ```
  * @category Map
  */
-function UtopiaMap({ height = '500px', width = '100%', center = [50.6, 9.5], zoom = 10, children, geo, showFilterControl = false, showGratitudeControl = false, showLayerControl = true, showThemeControl = false, defaultTheme, donationWidget, }) {
-    return (jsx(ContextWrapper, { children: jsx(MapContainer, { style: { height, width }, center: new LatLng(center[0], center[1]), zoom: zoom, zoomControl: false, maxZoom: 19, children: jsx(UtopiaMapInner, { geo: geo, showFilterControl: showFilterControl, showGratitudeControl: showGratitudeControl, showLayerControl: showLayerControl, donationWidget: donationWidget, showThemeControl: showThemeControl, defaultTheme: defaultTheme, children: children }) }) }));
+function UtopiaMap({ height = '500px', width = '100%', center = [50.6, 9.5], zoom = 10, children, geo, showFilterControl = false, showGratitudeControl = false, showLayerControl = true, showZoomControl = false, showThemeControl = false, defaultTheme, donationWidget, }) {
+    return (jsx(ContextWrapper, { children: jsx(MapContainer, { style: { height, width }, center: new LatLng(center[0], center[1]), zoom: zoom, zoomControl: showZoomControl, maxZoom: 19, children: jsx(UtopiaMapInner, { geo: geo, showFilterControl: showFilterControl, showGratitudeControl: showGratitudeControl, showLayerControl: showLayerControl, donationWidget: donationWidget, showThemeControl: showThemeControl, defaultTheme: defaultTheme, children: children }) }) }));
 }
 
 const goldenRatioConjugate = 0.618033988749895;