@botonic/react 0.21.5 → 0.21.7-alpha.0

package/lib/components/custom-message.js

@@ -1,131 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.customMessage = void 0;
-
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
-var _core = require("@botonic/core");
-
-var _lodash = _interopRequireDefault(require("lodash.merge"));
-
-var _react = _interopRequireDefault(require("react"));
-
-var _constants = require("../constants");
-
-var _errorBoundary = require("../util/error-boundary");
-
-var _logs = require("../util/logs");
-
-var _react2 = require("../util/react");
-
-var _message = require("./message");
-
-var _reply = require("./reply");
-
-var _excluded = ["id", "children"];
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
-/**
- *
- * @param name as it appears at ThemeProps' message.customTypes key
- * @param CustomMessageComponent
- * @param defaultProps Props for the wrapper Message
- * @param ErrorBoundary to recover in case it fails
- */
-var customMessage = function customMessage(_ref) {
-  var name = _ref.name,
-      CustomMessageComponent = _ref.component,
-      _ref$defaultProps = _ref.defaultProps,
-      defaultProps = _ref$defaultProps === void 0 ? {} : _ref$defaultProps,
-      _ref$errorBoundary = _ref.errorBoundary,
-      ErrorBoundary = _ref$errorBoundary === void 0 ? (0, _errorBoundary.createErrorBoundary)() : _ref$errorBoundary;
-
-  var CustomMessage = function CustomMessage(props) {
-    (0, _logs.warnDeprecatedProps)(defaultProps, 'customMessage:');
-    if (defaultProps.from === _constants.SENDERS.user) defaultProps.ack = 1;
-    return /*#__PURE__*/_react["default"].createElement(_message.Message, (0, _extends2["default"])({}, (0, _lodash["default"])((0, _react2.mapObjectNonBooleanValues)(defaultProps), props), {
-      type: _core.INPUT.CUSTOM
-    }));
-  };
-
-  var splitChildren = function splitChildren(props) {
-    var children = props.children;
-
-    var isReply = function isReply(e) {
-      return e.type === _reply.Reply;
-    };
-
-    try {
-      if (!Array.isArray(children) && !isReply(children)) {
-        return {
-          replies: null,
-          childrenWithoutReplies: children
-        };
-      }
-
-      var childrenArray = _react["default"].Children.toArray(children);
-
-      var replies = childrenArray.filter(isReply);
-      var childrenWithoutReplies = childrenArray.filter(function (e) {
-        return !isReply(e);
-      });
-      return {
-        replies: replies,
-        childrenWithoutReplies: childrenWithoutReplies
-      };
-    } catch (e) {
-      return {
-        replies: null,
-        childrenWithoutReplies: children
-      };
-    }
-  };
-
-  var WrappedComponent = function WrappedComponent(props) {
-    var id = props.id,
-        children = props.children,
-        customMessageProps = (0, _objectWithoutProperties2["default"])(props, _excluded);
-
-    var _splitChildren = splitChildren(props),
-        replies = _splitChildren.replies,
-        childrenWithoutReplies = _splitChildren.childrenWithoutReplies;
-
-    return /*#__PURE__*/_react["default"].createElement(CustomMessage, {
-      id: id,
-      json: _objectSpread(_objectSpread({}, customMessageProps), {}, {
-        id: id,
-        children: childrenWithoutReplies,
-        customTypeName: name
-      })
-    }, /*#__PURE__*/_react["default"].createElement(ErrorBoundary, (0, _extends2["default"])({
-      key: 'errorBoundary'
-    }, customMessageProps), /*#__PURE__*/_react["default"].createElement(CustomMessageComponent, customMessageProps, childrenWithoutReplies)), replies);
-  };
-
-  WrappedComponent.customTypeName = name; // eslint-disable-next-line react/display-name
-
-  WrappedComponent.deserialize = function (msg) {
-    return /*#__PURE__*/_react["default"].createElement(WrappedComponent, (0, _extends2["default"])({
-      id: msg.id,
-      key: msg.key,
-      json: msg.data
-    }, msg.data));
-  };
-
-  return WrappedComponent;
-};
-
-exports.customMessage = customMessage;
-//# sourceMappingURL=custom-message.js.map

package/lib/components/custom-message.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/components/custom-message.jsx"],"names":["customMessage","name","CustomMessageComponent","component","defaultProps","errorBoundary","ErrorBoundary","CustomMessage","props","from","SENDERS","user","ack","INPUT","CUSTOM","splitChildren","children","isReply","e","type","Reply","Array","isArray","replies","childrenWithoutReplies","childrenArray","React","Children","toArray","filter","WrappedComponent","id","customMessageProps","customTypeName","deserialize","msg","key","data"],"mappings":"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","sourcesContent":["import { INPUT } from '@botonic/core'\nimport merge from 'lodash.merge'\nimport React from 'react'\n\nimport { SENDERS } from '../constants'\nimport { createErrorBoundary } from '../util/error-boundary'\nimport { warnDeprecatedProps } from '../util/logs'\nimport { mapObjectNonBooleanValues } from '../util/react'\nimport { Message } from './message'\nimport { Reply } from './reply'\n\n/**\n *\n * @param name as it appears at ThemeProps' message.customTypes key\n * @param CustomMessageComponent\n * @param defaultProps Props for the wrapper Message\n * @param ErrorBoundary to recover in case it fails\n */\nexport const customMessage = ({\n  name,\n  component: CustomMessageComponent,\n  defaultProps = {},\n  errorBoundary: ErrorBoundary = createErrorBoundary(),\n}) => {\n  const CustomMessage = props => {\n    warnDeprecatedProps(defaultProps, 'customMessage:')\n    if (defaultProps.from === SENDERS.user) defaultProps.ack = 1\n    return (\n      <Message\n        {...merge(mapObjectNonBooleanValues(defaultProps), props)}\n        type={INPUT.CUSTOM}\n      />\n    )\n  }\n\n  const splitChildren = props => {\n    const { children } = props\n    const isReply = e => e.type === Reply\n    try {\n      if (!Array.isArray(children) && !isReply(children)) {\n        return { replies: null, childrenWithoutReplies: children }\n      }\n      const childrenArray = React.Children.toArray(children)\n      const replies = childrenArray.filter(isReply)\n      const childrenWithoutReplies = childrenArray.filter(e => !isReply(e))\n      return {\n        replies: replies,\n        childrenWithoutReplies,\n      }\n    } catch (e) {\n      return { replies: null, childrenWithoutReplies: children }\n    }\n  }\n\n  const WrappedComponent = props => {\n    const { id, children, ...customMessageProps } = props\n    const { replies, childrenWithoutReplies } = splitChildren(props)\n    return (\n      <CustomMessage\n        id={id}\n        json={{\n          ...customMessageProps,\n          id,\n          children: childrenWithoutReplies,\n          customTypeName: name,\n        }}\n      >\n        <ErrorBoundary key={'errorBoundary'} {...customMessageProps}>\n          <CustomMessageComponent {...customMessageProps}>\n            {childrenWithoutReplies}\n          </CustomMessageComponent>\n        </ErrorBoundary>\n        {replies}\n      </CustomMessage>\n    )\n  }\n  WrappedComponent.customTypeName = name\n  // eslint-disable-next-line react/display-name\n  WrappedComponent.deserialize = msg => (\n    <WrappedComponent id={msg.id} key={msg.key} json={msg.data} {...msg.data} />\n  )\n  return WrappedComponent\n}\n"],"file":"custom-message.js"}

package/lib/components/document.js

@@ -1,76 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-var _typeof = require("@babel/runtime/helpers/typeof");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.Document = void 0;
-
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
-var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-
-var _core = require("@botonic/core");
-
-var _react = _interopRequireWildcard(require("react"));
-
-var _styledComponents = _interopRequireDefault(require("styled-components"));
-
-var _constants = require("../constants");
-
-var _contexts = require("../contexts");
-
-var _message = require("./message");
-
-var _templateObject;
-
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(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; }
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
-var StyledButton = _styledComponents["default"].a(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n  display: block;\n  height: 25px;\n  background-color: #f0f0f0;\n  padding: 10px;\n  text-align: center;\n  border-radius: 5px;\n  color: black;\n  font-weight: bold;\n  line-height: 25px;\n  text-decoration: none;\n  border: 1px solid black;\n  opacity: 0.9;\n  &:hover {\n    opacity: 1;\n  }\n"])));
-
-var serialize = function serialize(documentProps) {
-  return {
-    document: documentProps.src
-  };
-};
-
-var Document = function Document(props) {
-  var content = props.children;
-
-  var _useContext = (0, _react.useContext)(_contexts.WebchatContext),
-      getThemeProperty = _useContext.getThemeProperty;
-
-  var documentDownload = getThemeProperty(_constants.WEBCHAT.CUSTOM_PROPERTIES.documentDownload, {});
-  if (typeof documentDownload === 'function') documentDownload = documentDownload(props.from);
-
-  if ((0, _core.isBrowser)()) {
-    content = /*#__PURE__*/_react["default"].createElement(StyledButton, {
-      href: props.src,
-      target: "_blank",
-      rel: "noreferrer",
-      style: _objectSpread({}, documentDownload.style)
-    }, documentDownload.text || 'Download');
-  }
-
-  return /*#__PURE__*/_react["default"].createElement(_message.Message, (0, _extends2["default"])({
-    role: _constants.ROLES.DOCUMENT_MESSAGE,
-    json: serialize(props)
-  }, props, {
-    type: _core.INPUT.DOCUMENT
-  }), content);
-};
-
-exports.Document = Document;
-Document.serialize = serialize;
-//# sourceMappingURL=document.js.map

package/lib/components/document.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/components/document.jsx"],"names":["StyledButton","styled","a","serialize","documentProps","document","src","Document","props","content","children","WebchatContext","getThemeProperty","documentDownload","WEBCHAT","CUSTOM_PROPERTIES","from","style","text","ROLES","DOCUMENT_MESSAGE","INPUT","DOCUMENT"],"mappings":";;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AAEA;;AACA;;AACA;;;;;;;;;;;;AAEA,IAAMA,YAAY,GAAGC,6BAAOC,CAAV,iYAAlB;;AAkBA,IAAMC,SAAS,GAAG,SAAZA,SAAY,CAAAC,aAAa,EAAI;AACjC,SAAO;AAAEC,IAAAA,QAAQ,EAAED,aAAa,CAACE;AAA1B,GAAP;AACD,CAFD;;AAIO,IAAMC,QAAQ,GAAG,SAAXA,QAAW,CAAAC,KAAK,EAAI;AAC/B,MAAIC,OAAO,GAAGD,KAAK,CAACE,QAApB;;AAEA,oBAA6B,uBAAWC,wBAAX,CAA7B;AAAA,MAAQC,gBAAR,eAAQA,gBAAR;;AACA,MAAIC,gBAAgB,GAAGD,gBAAgB,CACrCE,mBAAQC,iBAAR,CAA0BF,gBADW,EAErC,EAFqC,CAAvC;AAIA,MAAI,OAAOA,gBAAP,KAA4B,UAAhC,EACEA,gBAAgB,GAAGA,gBAAgB,CAACL,KAAK,CAACQ,IAAP,CAAnC;;AAEF,MAAI,sBAAJ,EAAiB;AACfP,IAAAA,OAAO,gBACL,gCAAC,YAAD;AACE,MAAA,IAAI,EAAED,KAAK,CAACF,GADd;AAEE,MAAA,MAAM,EAAC,QAFT;AAGE,MAAA,GAAG,EAAC,YAHN;AAIE,MAAA,KAAK,oBACAO,gBAAgB,CAACI,KADjB;AAJP,OAQGJ,gBAAgB,CAACK,IAAjB,IAAyB,UAR5B,CADF;AAYD;;AAED,sBACE,gCAAC,gBAAD;AACE,IAAA,IAAI,EAAEC,iBAAMC,gBADd;AAEE,IAAA,IAAI,EAAEjB,SAAS,CAACK,KAAD;AAFjB,KAGMA,KAHN;AAIE,IAAA,IAAI,EAAEa,YAAMC;AAJd,MAMGb,OANH,CADF;AAUD,CApCM;;;AAsCPF,QAAQ,CAACJ,SAAT,GAAqBA,SAArB","sourcesContent":["import { INPUT, isBrowser } from '@botonic/core'\nimport React, { useContext } from 'react'\nimport styled from 'styled-components'\n\nimport { ROLES, WEBCHAT } from '../constants'\nimport { WebchatContext } from '../contexts'\nimport { Message } from './message'\n\nconst StyledButton = styled.a`\n  display: block;\n  height: 25px;\n  background-color: #f0f0f0;\n  padding: 10px;\n  text-align: center;\n  border-radius: 5px;\n  color: black;\n  font-weight: bold;\n  line-height: 25px;\n  text-decoration: none;\n  border: 1px solid black;\n  opacity: 0.9;\n  &:hover {\n    opacity: 1;\n  }\n`\n\nconst serialize = documentProps => {\n  return { document: documentProps.src }\n}\n\nexport const Document = props => {\n  let content = props.children\n\n  const { getThemeProperty } = useContext(WebchatContext)\n  let documentDownload = getThemeProperty(\n    WEBCHAT.CUSTOM_PROPERTIES.documentDownload,\n    {}\n  )\n  if (typeof documentDownload === 'function')\n    documentDownload = documentDownload(props.from)\n\n  if (isBrowser()) {\n    content = (\n      <StyledButton\n        href={props.src}\n        target='_blank'\n        rel='noreferrer'\n        style={{\n          ...documentDownload.style,\n        }}\n      >\n        {documentDownload.text || 'Download'}\n      </StyledButton>\n    )\n  }\n\n  return (\n    <Message\n      role={ROLES.DOCUMENT_MESSAGE}\n      json={serialize(props)}\n      {...props}\n      type={INPUT.DOCUMENT}\n    >\n      {content}\n    </Message>\n  )\n}\n\nDocument.serialize = serialize\n"],"file":"document.js"}

package/lib/components/element.js

@@ -1,69 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.Element = void 0;
-
-var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
-
-var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-
-var _react = _interopRequireDefault(require("react"));
-
-var _styledComponents = _interopRequireDefault(require("styled-components"));
-
-var _constants = require("../constants");
-
-var _react2 = require("../util/react");
-
-var _templateObject;
-
-var ElementContainer = _styledComponents["default"].div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n  display: flex;\n  flex-direction: column;\n  width: ", "px;\n  margin-right: ", "px;\n  border-radius: 6px;\n  border: 1px solid ", ";\n  overflow: hidden;\n  justify-content: space-between;\n"])), _constants.WEBCHAT.DEFAULTS.ELEMENT_WIDTH, _constants.WEBCHAT.DEFAULTS.ELEMENT_MARGIN_RIGHT, _constants.COLORS.SEASHELL_WHITE);
-
-var Element = function Element(props) {
-  var renderBrowser = function renderBrowser() {
-    return /*#__PURE__*/_react["default"].createElement(ElementContainer, null, props.children);
-  };
-
-  var renderNode = function renderNode() {
-    return /*#__PURE__*/_react["default"].createElement("element", null, props.children);
-  };
-
-  return (0, _react2.renderComponent)({
-    renderBrowser: renderBrowser,
-    renderNode: renderNode
-  });
-};
-
-exports.Element = Element;
-
-Element.serialize = function (elementProps) {
-  var element = Object.assign.apply(Object, [{}].concat((0, _toConsumableArray2["default"])(elementProps.children.filter(function (c) {
-    return c && c.type && c.type.name != 'Button';
-  }).map(function (c) {
-    return c.type.serialize && c.type.serialize(c.props);
-  })))); // When we are serializer buttons from backend, we are receiving the data
-  // as an array of buttons, so we have to keep robust with serve and deal with arrays
-
-  element.buttons = (0, _toConsumableArray2["default"])(elementProps.children.filter(function (c) {
-    if (c instanceof Array) return true;
-    return c && c.type && c.type.name == 'Button';
-  }).map(function (b) {
-    if (b instanceof Array) {
-      return b.map(function (bb) {
-        return bb && bb.type && bb.type.serialize && bb.type.serialize(bb.props).button;
-      });
-    }
-
-    return b && b.type && b.type.serialize && b.type.serialize(b.props).button;
-  })); // When we have the buttons from backend, we have all buttons inside an array on the first position
-  // of another array in element['buttons'] we want that element['buttons'] to be an array of buttons,
-  // not an array of another array of buttons
-
-  if (element.buttons[0] instanceof Array) element.buttons = element.buttons[0];
-  return element;
-};
-//# sourceMappingURL=element.js.map

package/lib/components/element.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/components/element.jsx"],"names":["ElementContainer","styled","div","WEBCHAT","DEFAULTS","ELEMENT_WIDTH","ELEMENT_MARGIN_RIGHT","COLORS","SEASHELL_WHITE","Element","props","renderBrowser","children","renderNode","serialize","elementProps","element","Object","assign","filter","c","type","name","map","buttons","Array","b","bb","button"],"mappings":";;;;;;;;;;;;;AAAA;;AACA;;AAEA;;AACA;;;;AAEA,IAAMA,gBAAgB,GAAGC,6BAAOC,GAAV,2RAGXC,mBAAQC,QAAR,CAAiBC,aAHN,EAIJF,mBAAQC,QAAR,CAAiBE,oBAJb,EAMAC,kBAAOC,cANP,CAAtB;;AAWO,IAAMC,OAAO,GAAG,SAAVA,OAAU,CAAAC,KAAK,EAAI;AAC9B,MAAMC,aAAa,GAAG,SAAhBA,aAAgB;AAAA,wBACpB,gCAAC,gBAAD,QAAmBD,KAAK,CAACE,QAAzB,CADoB;AAAA,GAAtB;;AAIA,MAAMC,UAAU,GAAG,SAAbA,UAAa;AAAA,wBAAM,iDAAUH,KAAK,CAACE,QAAhB,CAAN;AAAA,GAAnB;;AAEA,SAAO,6BAAgB;AAAED,IAAAA,aAAa,EAAbA,aAAF;AAAiBE,IAAAA,UAAU,EAAVA;AAAjB,GAAhB,CAAP;AACD,CARM;;;;AAUPJ,OAAO,CAACK,SAAR,GAAoB,UAAAC,YAAY,EAAI;AAClC,MAAMC,OAAO,GAAGC,MAAM,CAACC,MAAP,OAAAD,MAAM,GACpB,EADoB,6CAEjBF,YAAY,CAACH,QAAb,CACAO,MADA,CACO,UAAAC,CAAC;AAAA,WAAIA,CAAC,IAAIA,CAAC,CAACC,IAAP,IAAeD,CAAC,CAACC,IAAF,CAAOC,IAAP,IAAe,QAAlC;AAAA,GADR,EAEAC,GAFA,CAEI,UAAAH,CAAC;AAAA,WAAIA,CAAC,CAACC,IAAF,CAAOP,SAAP,IAAoBM,CAAC,CAACC,IAAF,CAAOP,SAAP,CAAiBM,CAAC,CAACV,KAAnB,CAAxB;AAAA,GAFL,CAFiB,GAAtB,CADkC,CAOlC;AACA;;AACAM,EAAAA,OAAO,CAACQ,OAAR,uCACKT,YAAY,CAACH,QAAb,CACAO,MADA,CACO,UAAAC,CAAC,EAAI;AACX,QAAIA,CAAC,YAAYK,KAAjB,EAAwB,OAAO,IAAP;AACxB,WAAOL,CAAC,IAAIA,CAAC,CAACC,IAAP,IAAeD,CAAC,CAACC,IAAF,CAAOC,IAAP,IAAe,QAArC;AACD,GAJA,EAKAC,GALA,CAKI,UAAAG,CAAC,EAAI;AACR,QAAIA,CAAC,YAAYD,KAAjB,EAAwB;AACtB,aAAOC,CAAC,CAACH,GAAF,CACL,UAAAI,EAAE;AAAA,eACAA,EAAE,IACFA,EAAE,CAACN,IADH,IAEAM,EAAE,CAACN,IAAH,CAAQP,SAFR,IAGAa,EAAE,CAACN,IAAH,CAAQP,SAAR,CAAkBa,EAAE,CAACjB,KAArB,EAA4BkB,MAJ5B;AAAA,OADG,CAAP;AAOD;;AACD,WACEF,CAAC,IAAIA,CAAC,CAACL,IAAP,IAAeK,CAAC,CAACL,IAAF,CAAOP,SAAtB,IAAmCY,CAAC,CAACL,IAAF,CAAOP,SAAP,CAAiBY,CAAC,CAAChB,KAAnB,EAA0BkB,MAD/D;AAGD,GAlBA,CADL,EATkC,CA8BlC;AACA;AACA;;AACA,MAAIZ,OAAO,CAACQ,OAAR,CAAgB,CAAhB,aAA8BC,KAAlC,EAAyCT,OAAO,CAACQ,OAAR,GAAkBR,OAAO,CAACQ,OAAR,CAAgB,CAAhB,CAAlB;AACzC,SAAOR,OAAP;AACD,CAnCD","sourcesContent":["import React from 'react'\nimport styled from 'styled-components'\n\nimport { COLORS, WEBCHAT } from '../constants'\nimport { renderComponent } from '../util/react'\n\nconst ElementContainer = styled.div`\n  display: flex;\n  flex-direction: column;\n  width: ${WEBCHAT.DEFAULTS.ELEMENT_WIDTH}px;\n  margin-right: ${WEBCHAT.DEFAULTS.ELEMENT_MARGIN_RIGHT}px;\n  border-radius: 6px;\n  border: 1px solid ${COLORS.SEASHELL_WHITE};\n  overflow: hidden;\n  justify-content: space-between;\n`\n\nexport const Element = props => {\n  const renderBrowser = () => (\n    <ElementContainer>{props.children}</ElementContainer>\n  )\n\n  const renderNode = () => <element>{props.children}</element>\n\n  return renderComponent({ renderBrowser, renderNode })\n}\n\nElement.serialize = elementProps => {\n  const element = Object.assign(\n    {},\n    ...elementProps.children\n      .filter(c => c && c.type && c.type.name != 'Button')\n      .map(c => c.type.serialize && c.type.serialize(c.props))\n  )\n  // When we are serializer buttons from backend, we are receiving the data\n  // as an array of buttons, so we have to keep robust with serve and deal with arrays\n  element.buttons = [\n    ...elementProps.children\n      .filter(c => {\n        if (c instanceof Array) return true\n        return c && c.type && c.type.name == 'Button'\n      })\n      .map(b => {\n        if (b instanceof Array) {\n          return b.map(\n            bb =>\n              bb &&\n              bb.type &&\n              bb.type.serialize &&\n              bb.type.serialize(bb.props).button\n          )\n        }\n        return (\n          b && b.type && b.type.serialize && b.type.serialize(b.props).button\n        )\n      }),\n  ]\n  // When we have the buttons from backend, we have all buttons inside an array on the first position\n  // of another array in element['buttons'] we want that element['buttons'] to be an array of buttons,\n  // not an array of another array of buttons\n  if (element.buttons[0] instanceof Array) element.buttons = element.buttons[0]\n  return element\n}\n"],"file":"element.js"}

package/lib/components/handoff.js

@@ -1,69 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-var _typeof = require("@babel/runtime/helpers/typeof");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.Handoff = void 0;
-
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
-var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-
-var _react = _interopRequireWildcard(require("react"));
-
-var _styledComponents = _interopRequireDefault(require("styled-components"));
-
-var _constants = require("../constants");
-
-var _contexts = require("../contexts");
-
-var _templateObject, _templateObject2, _templateObject3, _templateObject4;
-
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(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; }
-
-var Container = _styledComponents["default"].div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n  display: flex;\n  font-family: inherit;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  padding: 24px;\n"])));
-
-var TransferredContainer = _styledComponents["default"].div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["\n  text-align: center;\n  white-space: normal;\n"])));
-
-var EndedContainer = _styledComponents["default"].div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["\n  text-align: center;\n  white-space: normal;\n"])));
-
-var StyledButton = _styledComponents["default"].button(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["\n  max-width: 60%;\n  padding: 12px 24px;\n  background-color: ", ";\n  border: none;\n  border-radius: 4px;\n  margin-top: 8px;\n  cursor: pointer;\n"])), _constants.COLORS.SOLID_WHITE);
-
-var Handoff = function Handoff(props) {
-  var _useContext = (0, _react.useContext)(_contexts.WebchatContext),
-      resolveCase = _useContext.resolveCase;
-
-  var _useState = (0, _react.useState)({
-    showContinue: true
-  }),
-      _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
-      state = _useState2[0],
-      setState = _useState2[1];
-
-  var continueClick = function continueClick() {
-    setState({
-      showContinue: false
-    });
-    resolveCase();
-  };
-
-  var bgColor = state.showContinue ? _constants.COLORS.FRINGY_FLOWER_GREEN : _constants.COLORS.TASMAN_GRAY;
-  var fontColor = state.showContinue ? _constants.COLORS.APPLE_GREEN : _constants.COLORS.CACTUS_GREEN;
-  return /*#__PURE__*/_react["default"].createElement(Container, {
-    style: {
-      color: fontColor,
-      backgroundColor: bgColor
-    }
-  }, state.showContinue ? /*#__PURE__*/_react["default"].createElement(TransferredContainer, null, "Conversation transferred to a human agent...") : /*#__PURE__*/_react["default"].createElement(EndedContainer, null, "Human handoff ended"), state.showContinue && /*#__PURE__*/_react["default"].createElement(StyledButton, {
-    onClick: continueClick
-  }, "Continue"));
-};
-
-exports.Handoff = Handoff;
-//# sourceMappingURL=handoff.js.map

package/lib/components/handoff.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/components/handoff.jsx"],"names":["Container","styled","div","TransferredContainer","EndedContainer","StyledButton","button","COLORS","SOLID_WHITE","Handoff","props","WebchatContext","resolveCase","showContinue","state","setState","continueClick","bgColor","FRINGY_FLOWER_GREEN","TASMAN_GRAY","fontColor","APPLE_GREEN","CACTUS_GREEN","color","backgroundColor"],"mappings":";;;;;;;;;;;;;;;AAAA;;AACA;;AAEA;;AACA;;;;;;;;AAEA,IAAMA,SAAS,GAAGC,6BAAOC,GAAV,oOAAf;;AASA,IAAMC,oBAAoB,GAAGF,6BAAOC,GAAV,yIAA1B;;AAKA,IAAME,cAAc,GAAGH,6BAAOC,GAAV,yIAApB;;AAKA,IAAMG,YAAY,GAAGJ,6BAAOK,MAAV,gPAGIC,kBAAOC,WAHX,CAAlB;;AAUO,IAAMC,OAAO,GAAG,SAAVA,OAAU,CAAAC,KAAK,EAAI;AAC9B,oBAAwB,uBAAWC,wBAAX,CAAxB;AAAA,MAAQC,WAAR,eAAQA,WAAR;;AACA,kBAA0B,qBAAS;AAAEC,IAAAA,YAAY,EAAE;AAAhB,GAAT,CAA1B;AAAA;AAAA,MAAOC,KAAP;AAAA,MAAcC,QAAd;;AAEA,MAAMC,aAAa,GAAG,SAAhBA,aAAgB,GAAM;AAC1BD,IAAAA,QAAQ,CAAC;AAAEF,MAAAA,YAAY,EAAE;AAAhB,KAAD,CAAR;AACAD,IAAAA,WAAW;AACZ,GAHD;;AAKA,MAAMK,OAAO,GAAGH,KAAK,CAACD,YAAN,GACZN,kBAAOW,mBADK,GAEZX,kBAAOY,WAFX;AAGA,MAAMC,SAAS,GAAGN,KAAK,CAACD,YAAN,GACdN,kBAAOc,WADO,GAEdd,kBAAOe,YAFX;AAGA,sBACE,gCAAC,SAAD;AACE,IAAA,KAAK,EAAE;AACLC,MAAAA,KAAK,EAAEH,SADF;AAELI,MAAAA,eAAe,EAAEP;AAFZ;AADT,KAMGH,KAAK,CAACD,YAAN,gBACC,gCAAC,oBAAD,uDADD,gBAKC,gCAAC,cAAD,8BAXJ,EAaGC,KAAK,CAACD,YAAN,iBACC,gCAAC,YAAD;AAAc,IAAA,OAAO,EAAEG;AAAvB,gBAdJ,CADF;AAmBD,CAlCM","sourcesContent":["import React, { useContext, useState } from 'react'\nimport styled from 'styled-components'\n\nimport { COLORS } from '../constants'\nimport { WebchatContext } from '../contexts'\n\nconst Container = styled.div`\n  display: flex;\n  font-family: inherit;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  padding: 24px;\n`\n\nconst TransferredContainer = styled.div`\n  text-align: center;\n  white-space: normal;\n`\n\nconst EndedContainer = styled.div`\n  text-align: center;\n  white-space: normal;\n`\n\nconst StyledButton = styled.button`\n  max-width: 60%;\n  padding: 12px 24px;\n  background-color: ${COLORS.SOLID_WHITE};\n  border: none;\n  border-radius: 4px;\n  margin-top: 8px;\n  cursor: pointer;\n`\n\nexport const Handoff = props => {\n  const { resolveCase } = useContext(WebchatContext)\n  const [state, setState] = useState({ showContinue: true })\n\n  const continueClick = () => {\n    setState({ showContinue: false })\n    resolveCase()\n  }\n\n  const bgColor = state.showContinue\n    ? COLORS.FRINGY_FLOWER_GREEN\n    : COLORS.TASMAN_GRAY\n  const fontColor = state.showContinue\n    ? COLORS.APPLE_GREEN\n    : COLORS.CACTUS_GREEN\n  return (\n    <Container\n      style={{\n        color: fontColor,\n        backgroundColor: bgColor,\n      }}\n    >\n      {state.showContinue ? (\n        <TransferredContainer>\n          Conversation transferred to a human agent...\n        </TransferredContainer>\n      ) : (\n        <EndedContainer>Human handoff ended</EndedContainer>\n      )}\n      {state.showContinue && (\n        <StyledButton onClick={continueClick}>Continue</StyledButton>\n      )}\n    </Container>\n  )\n}\n"],"file":"handoff.js"}

package/lib/components/image.js

@@ -1,91 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-var _typeof = require("@babel/runtime/helpers/typeof");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.Image = void 0;
-
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
-var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-
-var _core = require("@botonic/core");
-
-var _react = _interopRequireWildcard(require("react"));
-
-var _styledComponents = _interopRequireDefault(require("styled-components"));
-
-var _constants = require("../constants");
-
-var _contexts = require("../contexts");
-
-var _message = require("./message");
-
-var _templateObject;
-
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(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; }
-
-var StyledImage = _styledComponents["default"].img(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n  border-radius: 8px;\n  max-width: 150px;\n  max-height: 150px;\n  margin: -3px -6px;\n  cursor: ", ";\n"])), function (_ref) {
-  var hasPreviewer = _ref.hasPreviewer;
-  return hasPreviewer ? 'pointer' : 'auto';
-});
-
-var serialize = function serialize(imageProps) {
-  return {
-    image: imageProps.src
-  };
-};
-
-var Image = function Image(props) {
-  var content = props.children;
-
-  var _useState = (0, _react.useState)(false),
-      _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
-      isPreviewerOpened = _useState2[0],
-      setIsPreviewerOpened = _useState2[1];
-
-  var openPreviewer = function openPreviewer() {
-    return setIsPreviewerOpened(true);
-  };
-
-  var closePreviewer = function closePreviewer() {
-    return setIsPreviewerOpened(false);
-  };
-
-  var _useContext = (0, _react.useContext)(_contexts.WebchatContext),
-      getThemeProperty = _useContext.getThemeProperty;
-
-  var ImagePreviewer = getThemeProperty(_constants.WEBCHAT.CUSTOM_PROPERTIES.imagePreviewer, null);
-
-  if ((0, _core.isBrowser)()) {
-    content = /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(StyledImage, {
-      src: props.src,
-      onClick: openPreviewer,
-      hasPreviewer: Boolean(ImagePreviewer)
-    }), ImagePreviewer && /*#__PURE__*/_react["default"].createElement(ImagePreviewer, {
-      src: props.src,
-      isPreviewerOpened: isPreviewerOpened,
-      openPreviewer: openPreviewer,
-      closePreviewer: closePreviewer
-    }));
-  }
-
-  return /*#__PURE__*/_react["default"].createElement(_message.Message, (0, _extends2["default"])({
-    role: _constants.ROLES.IMAGE_MESSAGE,
-    json: serialize(props)
-  }, props, {
-    type: _core.INPUT.IMAGE
-  }), content);
-};
-
-exports.Image = Image;
-Image.serialize = serialize;
-//# sourceMappingURL=image.js.map

package/lib/components/image.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/components/image.jsx"],"names":["StyledImage","styled","img","hasPreviewer","serialize","imageProps","image","src","Image","props","content","children","isPreviewerOpened","setIsPreviewerOpened","openPreviewer","closePreviewer","WebchatContext","getThemeProperty","ImagePreviewer","WEBCHAT","CUSTOM_PROPERTIES","imagePreviewer","Boolean","ROLES","IMAGE_MESSAGE","INPUT","IMAGE"],"mappings":";;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AAEA;;AACA;;AACA;;;;;;;;AAEA,IAAMA,WAAW,GAAGC,6BAAOC,GAAV,kMAKL;AAAA,MAAGC,YAAH,QAAGA,YAAH;AAAA,SAAuBA,YAAY,GAAG,SAAH,GAAe,MAAlD;AAAA,CALK,CAAjB;;AAQA,IAAMC,SAAS,GAAG,SAAZA,SAAY,CAAAC,UAAU,EAAI;AAC9B,SAAO;AAAEC,IAAAA,KAAK,EAAED,UAAU,CAACE;AAApB,GAAP;AACD,CAFD;;AAIO,IAAMC,KAAK,GAAG,SAARA,KAAQ,CAAAC,KAAK,EAAI;AAC5B,MAAIC,OAAO,GAAGD,KAAK,CAACE,QAApB;;AAEA,kBAAkD,qBAAS,KAAT,CAAlD;AAAA;AAAA,MAAOC,iBAAP;AAAA,MAA0BC,oBAA1B;;AACA,MAAMC,aAAa,GAAG,SAAhBA,aAAgB;AAAA,WAAMD,oBAAoB,CAAC,IAAD,CAA1B;AAAA,GAAtB;;AACA,MAAME,cAAc,GAAG,SAAjBA,cAAiB;AAAA,WAAMF,oBAAoB,CAAC,KAAD,CAA1B;AAAA,GAAvB;;AAEA,oBAA6B,uBAAWG,wBAAX,CAA7B;AAAA,MAAQC,gBAAR,eAAQA,gBAAR;;AACA,MAAMC,cAAc,GAAGD,gBAAgB,CACrCE,mBAAQC,iBAAR,CAA0BC,cADW,EAErC,IAFqC,CAAvC;;AAIA,MAAI,sBAAJ,EAAiB;AACfX,IAAAA,OAAO,gBACL,+EACE,gCAAC,WAAD;AACE,MAAA,GAAG,EAAED,KAAK,CAACF,GADb;AAEE,MAAA,OAAO,EAAEO,aAFX;AAGE,MAAA,YAAY,EAAEQ,OAAO,CAACJ,cAAD;AAHvB,MADF,EAMGA,cAAc,iBACb,gCAAC,cAAD;AACE,MAAA,GAAG,EAAET,KAAK,CAACF,GADb;AAEE,MAAA,iBAAiB,EAAEK,iBAFrB;AAGE,MAAA,aAAa,EAAEE,aAHjB;AAIE,MAAA,cAAc,EAAEC;AAJlB,MAPJ,CADF;AAiBD;;AACD,sBACE,gCAAC,gBAAD;AACE,IAAA,IAAI,EAAEQ,iBAAMC,aADd;AAEE,IAAA,IAAI,EAAEpB,SAAS,CAACK,KAAD;AAFjB,KAGMA,KAHN;AAIE,IAAA,IAAI,EAAEgB,YAAMC;AAJd,MAMGhB,OANH,CADF;AAUD,CAzCM;;;AA2CPF,KAAK,CAACJ,SAAN,GAAkBA,SAAlB","sourcesContent":["import { INPUT, isBrowser } from '@botonic/core'\nimport React, { useContext, useState } from 'react'\nimport styled from 'styled-components'\n\nimport { ROLES, WEBCHAT } from '../constants'\nimport { WebchatContext } from '../contexts'\nimport { Message } from './message'\n\nconst StyledImage = styled.img`\n  border-radius: 8px;\n  max-width: 150px;\n  max-height: 150px;\n  margin: -3px -6px;\n  cursor: ${({ hasPreviewer }) => (hasPreviewer ? 'pointer' : 'auto')};\n`\n\nconst serialize = imageProps => {\n  return { image: imageProps.src }\n}\n\nexport const Image = props => {\n  let content = props.children\n\n  const [isPreviewerOpened, setIsPreviewerOpened] = useState(false)\n  const openPreviewer = () => setIsPreviewerOpened(true)\n  const closePreviewer = () => setIsPreviewerOpened(false)\n\n  const { getThemeProperty } = useContext(WebchatContext)\n  const ImagePreviewer = getThemeProperty(\n    WEBCHAT.CUSTOM_PROPERTIES.imagePreviewer,\n    null\n  )\n  if (isBrowser()) {\n    content = (\n      <>\n        <StyledImage\n          src={props.src}\n          onClick={openPreviewer}\n          hasPreviewer={Boolean(ImagePreviewer)}\n        />\n        {ImagePreviewer && (\n          <ImagePreviewer\n            src={props.src}\n            isPreviewerOpened={isPreviewerOpened}\n            openPreviewer={openPreviewer}\n            closePreviewer={closePreviewer}\n          />\n        )}\n      </>\n    )\n  }\n  return (\n    <Message\n      role={ROLES.IMAGE_MESSAGE}\n      json={serialize(props)}\n      {...props}\n      type={INPUT.IMAGE}\n    >\n      {content}\n    </Message>\n  )\n}\n\nImage.serialize = serialize\n"],"file":"image.js"}