@lideralia/alife-uikit 1.3.1 → 1.3.3

package/dist/atoms/Layout/Layout.js

@@ -60,18 +60,33 @@ const Box = (0, _styledComponents.default)('div').withConfig({
 })(_styledSystem.space, _styledSystem.color, _styledSystem.layout, _styledSystem.flexbox, _styledSystem.position, _styledSystem.border, _styledSystem.background, _styledSystem.opacity, _styledSystem.shadow, _styledSystem.typography, _styledSystem.variant);
 exports.Box = Box;
 Box.propTypes = _objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread({}, _propTypes.default.space), _propTypes.default.color), _propTypes.default.layout), _propTypes.default.flexbox), _propTypes.default.position), _propTypes.default.border), _propTypes.default.opacity), _propTypes.default.shadow), _propTypes.default.variant);
+
+const getGapValue = gap => {
+  if (gap === undefined) return undefined;
+  if (typeof gap === 'number') return "".concat(gap * 8, "px");
+  return gap;
+};
+
 const Flex = (0, _styledComponents.default)(Box).withConfig({
+  shouldForwardProp: (prop, defaultValidatorFn) => defaultValidatorFn(prop) || prop === 'gap'
+}).attrs(props => ({
+  gap: props.gap
+})).withConfig({
   displayName: "Layout__Flex",
   componentId: "sc-1ozuvye-2"
-})({
-  display: 'flex'
+})(["display:flex;gap:", ";"], _ref => {
+  let {
+    gap
+  } = _ref;
+  return getGapValue(gap);
 });
 exports.Flex = Flex;
 Flex.propTypes = {
   flexWrap: _propTypes2.default.string,
   flexDirection: _propTypes2.default.string,
   alignCols: _propTypes2.default.string,
-  justifyContent: _propTypes2.default.string
+  justifyContent: _propTypes2.default.string,
+  gap: _propTypes2.default.oneOfType([_propTypes2.default.number, _propTypes2.default.string])
 };
 
 const Row = props => {

package/dist/organisms/Cards/Ceremony.js

@@ -33,7 +33,7 @@ var _Typography = require("../../atoms/Typography");
 
 var _CarouselScroll = require("../../molecules/CarouselScroll");
 
-const _excluded = ["isAdmin", "numAttendees", "confirmed", "isAnswered", "pictures", "pictureMap", "urlMap", "userCanAttend", "hasStreaming"];
+const _excluded = ["isAdmin", "numAttendees", "confirmed", "isAnswered", "pictures", "pictureMap", "urlMap", "userCanAttend", "hasStreaming", "warningMessage"];
 
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
@@ -50,7 +50,8 @@ const CardCeremony = props => {
     pictureMap,
     urlMap,
     userCanAttend,
-    hasStreaming
+    hasStreaming,
+    warningMessage
   } = props,
         rest = (0, _objectWithoutProperties2.default)(props, _excluded);
   return _react.default.createElement(_Card.Card, (0, _extends2.default)({
@@ -72,7 +73,9 @@ const CardCeremony = props => {
     borderTopStyle: "solid",
     borderTopWidth: "1px",
     borderTopColor: "black12"
-  })), !isAnswered && userCanAttend && _react.default.createElement(CardCeremony.Assistants, props), isAdmin && numAttendees && _react.default.createElement(CardCeremony.Attendees, props), hasStreaming && _react.default.createElement(CardCeremony.HasStreaming, props));
+  })), !isAnswered && userCanAttend && _react.default.createElement(CardCeremony.Assistants, props), isAdmin && numAttendees && _react.default.createElement(CardCeremony.Attendees, props), warningMessage && _react.default.createElement(CardCeremony.Warning, {
+    warningMessage: warningMessage
+  }), hasStreaming && _react.default.createElement(CardCeremony.HasStreaming, props));
 };
 
 exports.CardCeremony = CardCeremony;
@@ -410,7 +413,6 @@ CardCeremony.HasStreaming = _ref7 => {
   return _react.default.createElement(_react.default.Fragment, null, _react.default.createElement(_Layout.Flex, {
     flexDirection: "column",
     style: {
-      borderRadius: '0px 0px 18px 18px',
       backgroundColor: 'rgba(242, 180, 64, 0.12)'
     }
   }, _react.default.createElement(_Layout.Flex, {
@@ -462,4 +464,32 @@ CardCeremony.HasStreaming = _ref7 => {
     sizeButton: "small",
     action: () => onLogin()
   }, textButtonStreaming)), _react.default.createElement(_Icons.IconInfoCircle, null))));
+};
+
+CardCeremony.Warning = _ref8 => {
+  let {
+    warningMessage
+  } = _ref8;
+  return _react.default.createElement(_Layout.Flex, {
+    flexDirection: "row",
+    style: {
+      backgroundColor: 'rgba(242, 180, 64, 0.12)'
+    },
+    padding: 3,
+    borderTopColor: "black12",
+    borderTopStyle: "solid",
+    borderTopWidth: "1px",
+    alignItems: "center",
+    justifyContent: "center",
+    width: "100%",
+    gap: 1
+  }, _react.default.createElement(_Icon.Icon, {
+    color: "black60",
+    sizeIcon: "display16"
+  }, _react.default.createElement(_Icons.IconAlertCircle, null)), _react.default.createElement(_Typography.Text, {
+    color: "black84",
+    fontWeight: "bold",
+    sizeText: "display13",
+    textAlign: "center"
+  }, warningMessage));
 };

package/dist/organisms/Header/Header.js

@@ -11,9 +11,7 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 
 var _css = _interopRequireDefault(require("@styled-system/css"));
 
-var _react = _interopRequireWildcard(require("react"));
-
-var _reactLivechat = _interopRequireDefault(require("react-livechat"));
+var _react = _interopRequireDefault(require("react"));
 
 var _styledComponents = _interopRequireDefault(require("styled-components"));
 
@@ -31,10 +29,6 @@ var _Typography = require("../../atoms/Typography");
 
 var _useWindowSize = _interopRequireDefault(require("../../utils/useWindowSize"));
 
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
 const BadgeStyled = _styledComponents.default.span.withConfig({
   displayName: "Header__BadgeStyled",
   componentId: "sc-c0gxqz-0"
@@ -54,6 +48,7 @@ const Header = (_ref, props) => {
     shareAction,
     goToHome,
     goToUserProfile,
+    openSupportChat,
     logo,
     customColor,
     customTextColor,
@@ -61,39 +56,13 @@ const Header = (_ref, props) => {
     shareLabel,
     helpLabel,
     eventAction,
-    paramsLiveChat,
-    allowShowLiveChat,
-    notLoggedIn,
     actionShare,
-    showUserNotificationBadge
+    showUserNotificationBadge,
+    showSupportChatNotification
   } = _ref;
   const {
     width
   } = (0, _useWindowSize.default)();
-  const [liveChat, setLiveChat] = (0, _react.useState)(null);
-  const [showNotification, setShowNotification] = (0, _react.useState)(false);
-
-  const showLiveChat = () => {
-    if (liveChat !== null) {
-      try {
-        liveChat === null || liveChat === void 0 ? void 0 : liveChat.open_chat_window();
-        setShowNotification(false);
-      } catch (e) {}
-    } else {
-      notLoggedIn();
-    }
-  };
-
-  const captureNotification = notification => {
-    if (notification.user_type == 'agent') {
-      try {
-        if (!showNotification && !(liveChat !== null && liveChat !== void 0 && liveChat.chat_window_maximized())) {
-          setShowNotification(true);
-        }
-      } catch (e) {}
-    }
-  };
-
   return _react.default.createElement(_Layout.Box, (0, _extends2.default)({
     boxShadow: "bottom",
     width: "100%",
@@ -108,12 +77,7 @@ const Header = (_ref, props) => {
     alignItems: "center",
     justifyContent: "space-between",
     "data-testid": "test-Header"
-  }, props), allowShowLiveChat && _react.default.createElement(_reactLivechat.default, {
-    onChatLoaded: ref => setLiveChat(ref),
-    license: 13369755,
-    onMessage: notification => captureNotification(notification),
-    params: paramsLiveChat
-  }), _react.default.createElement(_Layout.Box, {
+  }, props), _react.default.createElement(_Layout.Box, {
     onClick: () => goToHome(),
     style: {
       cursor: 'pointer',
@@ -125,7 +89,8 @@ const Header = (_ref, props) => {
   }, logo), _react.default.createElement(_Layout.Flex, null, _react.default.createElement(_Pill.Pill, {
     style: {
       cursor: 'pointer',
-      backgroundColor: customButtonColor || ''
+      backgroundColor: customButtonColor || '',
+      position: 'relative'
     }
   }, _react.default.createElement(_Layout.Flex, {
     onClick: e => shareAction(e),
@@ -159,19 +124,19 @@ const Header = (_ref, props) => {
     sizeText: "display14",
     fontWeight: "bold",
     color: customTextColor || 'black84',
-    onClick: () => showLiveChat()
-  }, helpLabel)), showNotification && _react.default.createElement("div", {
+    onClick: openSupportChat
+  }, helpLabel), showSupportChatNotification && _react.default.createElement("div", {
     style: {
       width: '12px',
       height: '12px',
       backgroundColor: '#EC3C4E',
       borderRadius: '10px',
-      marginTop: '-3px',
-      marginLeft: '-9px',
+      top: '-3px',
+      right: '-3px',
       display: 'inline-block',
       position: 'absolute'
     }
-  }), _react.default.createElement(_Pill.Pill, {
+  })), _react.default.createElement(_Pill.Pill, {
     padding: 1,
     borderRadius: 7,
     marginLeft: 1,
@@ -201,6 +166,6 @@ Header.defaultProps = {
   shareCopy: null,
   eventAction: null,
   paramsLiveChat: null,
-  allowShowLiveChat: true,
-  showUserNotificationBadge: false
+  showUserNotificationBadge: false,
+  showSupportChatNotification: false
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lideralia/alife-uikit",
-  "version": "1.3.01",
+  "version": "1.3.3",
   "description": "Librería y documentación de componentes, basada en el Design System de Alife.",
   "homepage": "https://github.com/lideralia/alife-frontend-components#readme",
   "bugs": {
@@ -96,7 +96,6 @@
     "react-color": "^2.19.3",
     "react-dom": "^17.0.1",
     "react-google-recaptcha": "^2.1.0",
-    "react-livechat": "^1.1.1",
     "react-scripts": "4.0.3",
     "react-select": "^4.1.0",
     "recordrtc": "^5.6.2",