allaw-ui 4.8.5 → 4.8.7

package/dist/components/atoms/inputs/SearchBar.js

@@ -49,9 +49,11 @@ import React, { useState } from "react";
 import styles from "./searchBar.module.css";
 import "../../../styles/global.css";
 import "../../../styles/icons.css";
+import TinyInfo from "../typography/TinyInfo";
 var SearchBar = function (_a) {
     var _b = _a.placeholder, placeholder = _b === void 0 ? "Faites une recherche" : _b, endIcon = _a.endIcon, startIcon = _a.startIcon, _c = _a.value, controlledValue = _c === void 0 ? "" : _c, onChange = _a.onChange, _d = _a.showClear, showClear = _d === void 0 ? false : _d, _e = _a.size, size = _e === void 0 ? "normal" : _e, _f = _a.style, styleProp = _f === void 0 ? "classic" : _f, _g = _a.disableAutofill, disableAutofill = _g === void 0 ? false : _g, _h = _a.showLocate, showLocate = _h === void 0 ? false : _h, resolveCityFromCoords = _a.resolveCityFromCoords;
     var _j = useState(controlledValue), value = _j[0], setValue = _j[1];
+    var _k = useState(null), locationError = _k[0], setLocationError = _k[1];
     var handleChange = function (event) {
         var newValue = event.target.value;
         setValue(newValue);
@@ -91,8 +93,6 @@ var SearchBar = function (_a) {
                             undefined)];
                 case 3:
                     error_1 = _a.sent();
-                    // eslint-disable-next-line no-console
-                    console.warn("reverse geocoding failed", error_1);
                     return [2 /*return*/, undefined];
                 case 4: return [2 /*return*/];
             }
@@ -100,42 +100,40 @@ var SearchBar = function (_a) {
     }); };
     var handleLocate = function () {
         if (!(navigator === null || navigator === void 0 ? void 0 : navigator.geolocation)) {
-            console.warn("Geolocation not supported by this browser");
+            setLocationError("La géolocalisation n'est pas supportée par ce navigateur. Saisissez votre ville pour continuer.");
             return;
         }
-        console.log("Requesting geolocation...");
+        setLocationError(null);
         navigator.geolocation.getCurrentPosition(function (pos) { return __awaiter(void 0, void 0, void 0, function () {
             var _a, latitude, longitude, resolver, city;
             return __generator(this, function (_b) {
                 switch (_b.label) {
                     case 0:
-                        console.log("Geolocation success:", pos.coords);
                         _a = pos.coords, latitude = _a.latitude, longitude = _a.longitude;
                         resolver = resolveCityFromCoords || defaultResolveCityFromCoords;
                         return [4 /*yield*/, resolver(latitude, longitude)];
                     case 1:
                         city = _b.sent();
                         if (city) {
-                            console.log("City resolved:", city);
                             setValue(city);
                             onChange === null || onChange === void 0 ? void 0 : onChange(city);
+                            setLocationError(null);
                         }
                         else {
-                            console.warn("Could not resolve city from coordinates");
+                            setLocationError("Impossible de déterminer votre ville. Saisissez-la manuellement pour continuer.");
                         }
                         return [2 /*return*/];
                 }
             });
         }); }, function (err) {
-            console.error("Geolocation error:", err);
             if (err.code === 1) {
-                console.error("Permission denied - user must allow location access");
+                setLocationError("Accès à la localisation refusé. Saisissez votre ville pour continuer.");
             }
             else if (err.code === 2) {
-                console.error("Position unavailable");
+                setLocationError("Position indisponible. Saisissez votre ville pour continuer.");
             }
             else if (err.code === 3) {
-                console.error("Timeout");
+                setLocationError("La localisation a pris trop de temps. Saisissez votre ville pour continuer.");
             }
         }, { enableHighAccuracy: true, timeout: 10000, maximumAge: 0 });
     };
@@ -146,19 +144,26 @@ var SearchBar = function (_a) {
     ]
         .filter(Boolean)
         .join(" ");
-    return (React.createElement("div", { className: wrapperClassName },
-        startIcon && (React.createElement("span", { className: styles.searchBarStartIcon, "aria-hidden": "true" },
-            React.createElement("i", { className: startIcon }))),
-        React.createElement("input", __assign({ type: "text", placeholder: placeholder, className: styles.searchBarPlaceholder, value: controlledValue || value, onChange: handleChange }, (disableAutofill && {
-            autoComplete: "off",
-            "data-form-type": "other",
-            "data-lpignore": "true",
-            "data-1p-ignore": true,
-        }))),
-        showClear && (controlledValue || value) && (React.createElement("button", { type: "button", className: styles.searchBarClearButton, onClick: handleClear, "aria-label": "Effacer la recherche" },
-            React.createElement("i", { className: "allaw-icon-x-small" }))),
-        endIcon && (React.createElement("button", { className: styles.searchBarIconButton, tabIndex: -1, "aria-label": "Rechercher" },
-            React.createElement("i", { className: endIcon }))),
-        showLocate && (React.createElement("button", { type: "button", className: styles.searchBarLocateButton, onClick: handleLocate, "aria-label": "Me localiser", title: "Me localiser" }, "Me localiser"))));
+    return (React.createElement("div", null,
+        React.createElement("div", { className: wrapperClassName },
+            startIcon && (React.createElement("span", { className: styles.searchBarStartIcon, "aria-hidden": "true" },
+                React.createElement("i", { className: startIcon }))),
+            React.createElement("input", __assign({ type: "text", placeholder: placeholder, className: styles.searchBarPlaceholder, value: controlledValue || value, onChange: handleChange }, (disableAutofill && {
+                autoComplete: "off",
+                "data-form-type": "other",
+                "data-lpignore": "true",
+                "data-1p-ignore": true,
+            }))),
+            showClear && (controlledValue || value) && (React.createElement("button", { type: "button", className: styles.searchBarClearButton, onClick: handleClear, "aria-label": "Effacer la recherche" },
+                React.createElement("i", { className: "allaw-icon-x-small" }))),
+            endIcon && (React.createElement("button", { className: styles.searchBarIconButton, tabIndex: -1, "aria-label": "Rechercher" },
+                React.createElement("i", { className: endIcon }))),
+            showLocate && (React.createElement("button", { type: "button", className: styles.searchBarLocateButton, onClick: function (e) {
+                    e.preventDefault();
+                    e.stopPropagation();
+                    handleLocate();
+                }, "aria-label": "Me localiser", title: "Me localiser" }, "Me localiser"))),
+        locationError && (React.createElement("div", { className: styles.searchBarError },
+            React.createElement(TinyInfo, { variant: "medium12", color: "actions-error", text: locationError, align: "left" })))));
 };
 export default SearchBar;

package/dist/components/atoms/inputs/searchBar.module.css

@@ -102,7 +102,7 @@
 }
 
 .searchBarLocateButton:hover {
-  filter: brightness(0.9);
+  background: #1ea8d4;
 }
 
 .sizeBig .searchBarLocateButton {
@@ -147,3 +147,8 @@
 .styleForm:focus-within {
   border-color: #728ea7;
 }
+
+.searchBarError {
+  margin-top: 8px;
+  margin-left: 14px;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "allaw-ui",
-  "version": "4.8.5",
+  "version": "4.8.7",
   "description": "Composants UI pour l'application Allaw",
   "main": "dist/index.js",
   "module": "dist/index.esm.js",