@kiwicom/smart-faq/lib/SmartFAQ/SingleBookingPage/bookingTypes/MulticityOverlayTrip.js

Smart FAQ

"use strict";

var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;

var _style = _interopRequireDefault(require("styled-jsx/style"));

var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));

var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));

var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));

var _getPrototypeOf3 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));

var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));

var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));

var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));

var React = _interopRequireWildcard(require("react"));

var _reactRelay = require("react-relay");

var _Translate = _interopRequireDefault(require("@kiwicom/nitro/lib/components/Translate"));

var _MulticityTrip = _interopRequireDefault(require("./MulticityTrip"));

// @flow
var MulticityOverlayTrip =
/*#__PURE__*/
function (_React$Component) {
  (0, _inherits2.default)(MulticityOverlayTrip, _React$Component);

  function MulticityOverlayTrip() {
    var _getPrototypeOf2;

    var _this;

    (0, _classCallCheck2.default)(this, MulticityOverlayTrip);

    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
      args[_key] = arguments[_key];
    }

    _this = (0, _possibleConstructorReturn2.default)(this, (_getPrototypeOf2 = (0, _getPrototypeOf3.default)(MulticityOverlayTrip)).call.apply(_getPrototypeOf2, [this].concat(args)));
    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)((0, _assertThisInitialized2.default)(_this)), "state", {
      overlapping: true
    });
    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)((0, _assertThisInitialized2.default)(_this)), "toggleOverlapping", function () {
      _this.setState(function (prevState) {
        return {
          overlapping: !prevState.overlapping
        };
      });
    });
    return _this;
  }

  (0, _createClass2.default)(MulticityOverlayTrip, [{
    key: "render",
    value: function render() {
      var booking = this.props.booking;
      var trips = booking.trips;
      return trips && trips.length > 2 ? React.createElement("div", {
        className: "jsx-3809695558"
      }, React.createElement("div", {
        className: "jsx-3809695558" + " " + ((this.state.overlapping ? 'multicityWrapper' : 'multicityWrapper multicityWrapperIsActive') || "")
      }, React.createElement(_MulticityTrip.default, {
        booking: booking
      }), React.createElement("div", {
        className: "jsx-3809695558" + " " + ((this.state.overlapping ? 'multicityOverlay' : 'multicityOverlay multicityOverlayIsActive') || "")
      })), React.createElement("button", {
        onClick: this.toggleOverlapping,
        className: "jsx-3809695558" + " " + "multicityButton"
      }, this.state.overlapping ? React.createElement(_Translate.default, {
        t: "smartfaq.single_booking_page.show_more_trips"
      }) : React.createElement(_Translate.default, {
        t: "smartfaq.single_booking_page.show_less_trips"
      })), React.createElement(_style.default, {
        styleId: "3809695558",
        css: ".multicityWrapper.jsx-3809695558{position:relative;height:215px;max-height:215px;overflow:hidden;-webkit-transition:all 1s ease-in-out;transition:all 1s ease-in-out;}.multicityWrapperIsActive.jsx-3809695558{height:auto;max-height:10000px;-webkit-transition:all 1s ease-in-out;transition:all 1s ease-in-out;}.multicityOverlay.jsx-3809695558{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-align-items:flex-end;-webkit-box-align:flex-end;-ms-flex-align:flex-end;align-items:flex-end;position:absolute;top:0;left:0;width:100%;height:inherit;}.multicityOverlayIsActive.jsx-3809695558{-webkit-animation:overlay-jsx-3809695558 1s ease-in-out forwards;animation:overlay-jsx-3809695558 1s ease-in-out forwards;}.multicityButton.jsx-3809695558{width:100%;background:transparent;border:none;font-weight:bold;-webkit-text-decoration:underline;text-decoration:underline;font-size:0.9rem;cursor:pointer;}.multicityButton.jsx-3809695558:focus{outline:0;}@-webkit-keyframes overlay-jsx-3809695558{0%{opacity:1;}100%{opacity:0;z-index:-1;}}@keyframes overlay-jsx-3809695558{0%{opacity:1;}100%{opacity:0;z-index:-1;}}"
      })) : React.createElement(_MulticityTrip.default, {
        booking: booking
      });
    }
  }]);
  return MulticityOverlayTrip;
}(React.Component);

var _default = (0, _reactRelay.createFragmentContainer)(MulticityOverlayTrip, {
  booking: function booking() {
    var node = require("./__generated__/MulticityOverlayTrip_booking.graphql");

    if (node.hash && node.hash !== "fa2e9943c930537f38303cab2e9c229f") {
      console.error("The definition of 'MulticityOverlayTrip_booking' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data.");
    }

    return require("./__generated__/MulticityOverlayTrip_booking.graphql");
  }
});

exports.default = _default;