@widergy/energy-ui 3.172.2 → 3.172.3

package/dist/components/UTGoogleAutocomplete/index.js

@@ -1,140 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _isEmpty = _interopRequireDefault(require("lodash/isEmpty"));
-var _WithGoogleMaps = _interopRequireDefault(require("../WithGoogleMaps"));
-var _WithTheme = _interopRequireDefault(require("../WithTheme"));
-var _UTTouchableWithoutFeedback = _interopRequireDefault(require("../UTTouchableWithoutFeedback"));
-var _UTTextInput = _interopRequireDefault(require("../UTTextInput"));
-var _UTIcon = _interopRequireDefault(require("../UTIcon"));
-var _UTLabel = _interopRequireDefault(require("../UTLabel"));
-var _AlertHandler = _interopRequireDefault(require("../UTAlert/AlertHandler"));
-var _UTAlert = _interopRequireDefault(require("../UTAlert"));
-var _googleMapsTypes = require("../../types/googleMapsTypes");
-var _theme = require("./theme");
-var _google_on_white = _interopRequireDefault(require("./assets/google_on_white.png"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
-function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
-const UTGoogleAutocomplete = _ref => {
-  let {
-    alert,
-    classes,
-    dataTestId,
-    detailErrorLabel = 'Hubo un error al intentar recuperar el detalle de la dirección seleccionada',
-    helperTextDataTestId,
-    inputProps,
-    minChar = 3,
-    noResultsLabel = 'No se encuentran resultados. Ingresa una dirección valida.',
-    onChange,
-    predictionsErrorLabel = 'Hubo un error al intentar recuperar la dirección ingresada',
-    retrieveError = () => {},
-    searchRestrictions = {},
-    setSelectedPlace = () => {},
-    value
-  } = _ref;
-  const [autoCompletePredictions, setAutoCompletePredictions] = (0, _react.useState)([]);
-  const [predictionsNotFound, setPredictionsNotFound] = (0, _react.useState)(false);
-  const [showPredictions, setShowPredicitions] = (0, _react.useState)(false);
-  const placeDetailRef = (0, _react.useRef)();
-  const {
-    google
-  } = window;
-  const googleAutocompleteService = new google.maps.places.AutocompleteService();
-  const GOOGLE_OK_STATUS = google.maps.places.PlacesServiceStatus.OK;
-  const GOOGLE_ZERO_STATUS = google.maps.places.PlacesServiceStatus.ZERO_RESULTS;
-  const sessionToken = (0, _react.useMemo)(() => new google.maps.places.AutocompleteSessionToken(), [google.maps.places.AutocompleteSessionToken]);
-  const handlePredictions = (predictions, status) => {
-    if (status === GOOGLE_OK_STATUS) {
-      setShowPredicitions(true);
-      setPredictionsNotFound(false);
-      const autocompleteSuggestions = predictions.map(prediction => ({
-        id: prediction.place_id,
-        name: prediction.description
-      }));
-      return setAutoCompletePredictions(autocompleteSuggestions);
-    }
-    if (status === GOOGLE_ZERO_STATUS) {
-      setPredictionsNotFound(true);
-      setAutoCompletePredictions([]);
-    } else {
-      _AlertHandler.default.error(predictionsErrorLabel);
-      retrieveError(status);
-    }
-  };
-  const handleInputChange = inputValue => {
-    onChange(inputValue);
-    if (inputValue.length >= minChar) {
-      googleAutocompleteService.getPlacePredictions({
-        input: inputValue,
-        sessionToken,
-        ...searchRestrictions
-      }, handlePredictions);
-    } else {
-      setAutoCompletePredictions([]);
-      setSelectedPlace(null);
-    }
-  };
-  const handleGetDetails = (place, status) => {
-    if (status === GOOGLE_OK_STATUS) {
-      setShowPredicitions(false);
-      setSelectedPlace(place);
-    } else {
-      _AlertHandler.default.error(detailErrorLabel);
-      retrieveError(status);
-    }
-  };
-  return /*#__PURE__*/_react.default.createElement("div", {
-    className: classes.inputContainer
-  }, /*#__PURE__*/_react.default.createElement(_UTAlert.default, {
-    content: alert
-  }), /*#__PURE__*/_react.default.createElement(_UTTextInput.default, _extends({
-    dataTestId: dataTestId,
-    helperTextDataTestId: helperTextDataTestId,
-    input: {
-      value,
-      onChange: handleInputChange
-    },
-    inputClassName: classes.inputClassName
-  }, inputProps)), showPredictions && !(0, _isEmpty.default)(autoCompletePredictions) && autoCompletePredictions.map(_ref2 => {
-    let {
-      id,
-      name
-    } = _ref2;
-    return /*#__PURE__*/_react.default.createElement("div", {
-      ref: placeDetailRef,
-      key: id
-    }, /*#__PURE__*/_react.default.createElement(_UTTouchableWithoutFeedback.default, {
-      onClick: () => {
-        onChange(name);
-        const googleGetPlaceService = new google.maps.places.PlacesService(placeDetailRef.current);
-        googleGetPlaceService.getDetails({
-          placeId: id
-        }, handleGetDetails);
-      },
-      className: classes.resultsContainer
-    }, /*#__PURE__*/_react.default.createElement(_UTIcon.default, {
-      size: 20,
-      name: "IconMapPin",
-      className: classes.resultIcon
-    }), /*#__PURE__*/_react.default.createElement(_UTLabel.default, null, name)));
-  }), value.length >= minChar && predictionsNotFound && /*#__PURE__*/_react.default.createElement("div", {
-    className: classes.noResultsContainer
-  }, /*#__PURE__*/_react.default.createElement(_UTIcon.default, {
-    size: 32,
-    name: "IconSearchOff",
-    className: classes.noResultsIcon
-  }), /*#__PURE__*/_react.default.createElement(_UTLabel.default, {
-    colorTheme: "gray"
-  }, noResultsLabel)), /*#__PURE__*/_react.default.createElement("img", {
-    className: classes.googlelogo,
-    src: _google_on_white.default,
-    alt: "googleLogo"
-  }));
-};
-UTGoogleAutocomplete.propTypes = _googleMapsTypes.UTGoogleAutocompletePropTypes;
-var _default = exports.default = (0, _WithTheme.default)(_theme.retrieveStyle)((0, _WithGoogleMaps.default)()(UTGoogleAutocomplete));
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _react=_interopRequireWildcard(require("react")),_isEmpty=_interopRequireDefault(require("lodash/isEmpty")),_WithGoogleMaps=_interopRequireDefault(require("../WithGoogleMaps")),_WithTheme=_interopRequireDefault(require("../WithTheme")),_UTTouchableWithoutFeedback=_interopRequireDefault(require("../UTTouchableWithoutFeedback")),_UTTextInput=_interopRequireDefault(require("../UTTextInput")),_UTIcon=_interopRequireDefault(require("../UTIcon")),_UTLabel=_interopRequireDefault(require("../UTLabel")),_AlertHandler=_interopRequireDefault(require("../UTAlert/AlertHandler")),_UTAlert=_interopRequireDefault(require("../UTAlert")),_googleMapsTypes=require("../../types/googleMapsTypes"),_theme=require("./theme"),_google_on_white=_interopRequireDefault(require("./assets/google_on_white.png"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}function _interopRequireWildcard(e,t){if("function"==typeof WeakMap)var r=new WeakMap,n=new WeakMap;return(_interopRequireWildcard=function(e,t){if(!t&&e&&e.__esModule)return e;var o,i,f={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return f;if(o=t?n:r){if(o.has(e))return o.get(e);o.set(e,f)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((i=(o=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(i.get||i.set)?o(f,t,i):f[t]=e[t]);return f})(e,t)}function _extends(){return _extends=Object.assign?Object.assign.bind():function(n){for(var e=1;e<arguments.length;e++){var t=arguments[e];for(var r in t)({}).hasOwnProperty.call(t,r)&&(n[r]=t[r])}return n},_extends.apply(null,arguments)}const UTGoogleAutocomplete=_ref=>{let{alert:alert,classes:classes,dataTestId:dataTestId,detailErrorLabel:detailErrorLabel="Hubo un error al intentar recuperar el detalle de la dirección seleccionada",helperTextDataTestId:helperTextDataTestId,inputProps:inputProps,minChar:minChar=3,noResultsLabel:noResultsLabel="No se encuentran resultados. Ingresa una dirección valida.",onChange:onChange,predictionsErrorLabel:predictionsErrorLabel="Hubo un error al intentar recuperar la dirección ingresada",retrieveError:retrieveError=()=>{},searchRestrictions:searchRestrictions={},setSelectedPlace:setSelectedPlace=()=>{},value:value}=_ref;const[autoCompletePredictions,setAutoCompletePredictions]=(0,_react.useState)([]),[predictionsNotFound,setPredictionsNotFound]=(0,_react.useState)(!1),[showPredictions,setShowPredicitions]=(0,_react.useState)(!1),placeDetailRef=(0,_react.useRef)(),{google:google}=window,googleAutocompleteService=new google.maps.places.AutocompleteService,GOOGLE_OK_STATUS=google.maps.places.PlacesServiceStatus.OK,GOOGLE_ZERO_STATUS=google.maps.places.PlacesServiceStatus.ZERO_RESULTS,sessionToken=(0,_react.useMemo)(()=>new google.maps.places.AutocompleteSessionToken,[google.maps.places.AutocompleteSessionToken]),handlePredictions=(predictions,status)=>{if(status===GOOGLE_OK_STATUS){setShowPredicitions(!0),setPredictionsNotFound(!1);const autocompleteSuggestions=predictions.map(prediction=>({id:prediction.place_id,name:prediction.description}));return setAutoCompletePredictions(autocompleteSuggestions)}status===GOOGLE_ZERO_STATUS?(setPredictionsNotFound(!0),setAutoCompletePredictions([])):(_AlertHandler.default.error(predictionsErrorLabel),retrieveError(status))},handleGetDetails=(place,status)=>{status===GOOGLE_OK_STATUS?(setShowPredicitions(!1),setSelectedPlace(place)):(_AlertHandler.default.error(detailErrorLabel),retrieveError(status))};return _react.default.createElement("div",{className:classes.inputContainer},_react.default.createElement(_UTAlert.default,{content:alert}),_react.default.createElement(_UTTextInput.default,_extends({dataTestId:dataTestId,helperTextDataTestId:helperTextDataTestId,input:{value:value,onChange:inputValue=>{onChange(inputValue),inputValue.length>=minChar?googleAutocompleteService.getPlacePredictions({input:inputValue,sessionToken:sessionToken,...searchRestrictions},handlePredictions):(setAutoCompletePredictions([]),setSelectedPlace(null))}},inputClassName:classes.inputClassName},inputProps)),showPredictions&&!(0,_isEmpty.default)(autoCompletePredictions)&&autoCompletePredictions.map(_ref2=>{let{id:id,name:name}=_ref2;return _react.default.createElement("div",{ref:placeDetailRef,key:id},_react.default.createElement(_UTTouchableWithoutFeedback.default,{onClick:()=>{onChange(name);new google.maps.places.PlacesService(placeDetailRef.current).getDetails({placeId:id},handleGetDetails)},className:classes.resultsContainer},_react.default.createElement(_UTIcon.default,{size:20,name:"IconMapPin",className:classes.resultIcon}),_react.default.createElement(_UTLabel.default,null,name)))}),value.length>=minChar&&predictionsNotFound&&_react.default.createElement("div",{className:classes.noResultsContainer},_react.default.createElement(_UTIcon.default,{size:32,name:"IconSearchOff",className:classes.noResultsIcon}),_react.default.createElement(_UTLabel.default,{colorTheme:"gray"},noResultsLabel)),_react.default.createElement("img",{className:classes.googlelogo,src:_google_on_white.default,alt:"googleLogo"}))};UTGoogleAutocomplete.propTypes=_googleMapsTypes.UTGoogleAutocompletePropTypes;var _default=exports.default=(0,_WithTheme.default)(_theme.retrieveStyle)((0,_WithGoogleMaps.default)()(UTGoogleAutocomplete));

package/dist/components/UTGoogleAutocomplete/theme.js

@@ -1,52 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.retrieveStyle = void 0;
-const retrieveStyle = _ref => {
-  var _theme$Palette$action;
-  let {
-    theme
-  } = _ref;
-  return {
-    googlelogo: {
-      width: '45px'
-    },
-    inputContainer: {
-      borderRadius: '8px',
-      display: 'flex',
-      flexDirection: 'column',
-      gridGap: '8px',
-      maxWidth: '480px',
-      padding: '16px',
-      width: '480px'
-    },
-    inputClassName: {
-      width: '480px'
-    },
-    noResultsContainer: {
-      alignItems: 'center',
-      display: 'flex',
-      flexDirection: 'column',
-      gridGap: '24px',
-      padding: '16px'
-    },
-    noResultsIcon: {
-      backgroundColor: theme.Palette.light['03'],
-      borderRadius: '25px',
-      color: theme.Palette.light['05'],
-      padding: '9px'
-    },
-    resultsContainer: {
-      display: 'flex',
-      gridGap: '16px',
-      padding: '12px 0'
-    },
-    resultIcon: {
-      color: ((_theme$Palette$action = theme.Palette.actions) === null || _theme$Palette$action === void 0 ? void 0 : _theme$Palette$action.neutral['05']) || theme.Palette.neutral['05'],
-      minWidth: '20px'
-    }
-  };
-};
-exports.retrieveStyle = retrieveStyle;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.retrieveStyle=void 0;const retrieveStyle=_ref=>{var _theme$Palette$action;let{theme:theme}=_ref;return{googlelogo:{width:"45px"},inputContainer:{borderRadius:"8px",display:"flex",flexDirection:"column",gridGap:"8px",maxWidth:"480px",padding:"16px",width:"480px"},inputClassName:{width:"480px"},noResultsContainer:{alignItems:"center",display:"flex",flexDirection:"column",gridGap:"24px",padding:"16px"},noResultsIcon:{backgroundColor:theme.Palette.light["03"],borderRadius:"25px",color:theme.Palette.light["05"],padding:"9px"},resultsContainer:{display:"flex",gridGap:"16px",padding:"12px 0"},resultIcon:{color:(null===(_theme$Palette$action=theme.Palette.actions)||void 0===_theme$Palette$action?void 0:_theme$Palette$action.neutral["05"])||theme.Palette.neutral["05"],minWidth:"20px"}}};exports.retrieveStyle=retrieveStyle;