trepur_components 0.1.42 → 0.2.1

package/dist/{components/NavItem → NavItem}/index.js

@@ -9,6 +9,8 @@ require("core-js/modules/web.dom-collections.iterator.js");
 
 var _react = _interopRequireWildcard(require("react"));
 
+require("../../../../index.css");
+
 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; }
@@ -27,27 +29,26 @@ const NavItem = _ref => {
     hoverTextColor,
     hoverBgColor,
     bordered,
-    rounded
+    rounded,
+    underlineOnHover
   } = _ref;
-  let linkClasses = linkClassNames ? linkClassNames : ''; //---------- Styling ---------------
+  let linkClasses = linkClassNames ? linkClassNames : '';
+  const underline = underlineOnHover ? ' hover:underline' : ''; //---------- Styling ---------------
 
   const [styles, setStyles] = (0, _react.useState)({
     'backgroundColor': bgColor ? bgColor : 'white',
     color: textColor ? textColor : 'black',
     'borderColor': borderColor ? borderColor : 'black'
   });
-  const [hovering, setHovering] = (0, _react.useState)(false);
 
   const setHoverState = isHovering => {
     if (isHovering) {
-      setHovering(true);
       setStyles({
         'backgroundColor': hoverBgColor ? hoverBgColor : 'black',
         color: hoverTextColor ? hoverTextColor : 'white',
         'borderColor': hoverBorderColor ? hoverBorderColor : 'black'
       });
     } else {
-      setHovering(false);
       setStyles({
         'backgroundColor': bgColor ? bgColor : 'white',
         color: textColor ? textColor : 'black',
@@ -68,7 +69,7 @@ const NavItem = _ref => {
     onMouseOver: () => setHoverState(true),
     onMouseOut: () => setHoverState(false),
     key: name,
-    className: "px-4 mx-2 " + linkClasses + borderClass + round,
+    className: "px-4 mx-2 mb-4 text-center " + linkClasses + borderClass + round + underline,
     onClick: onClick
   }, name)));
 };

package/dist/NewsCard/index.js

@@ -0,0 +1,73 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+require("core-js/modules/es.object.assign.js");
+
+var _react = _interopRequireDefault(require("react"));
+
+var _Image = _interopRequireDefault(require("../../Atoms/Image"));
+
+var _Column = _interopRequireDefault(require("../../Atoms/Column"));
+
+var _Button = _interopRequireDefault(require("../../Atoms/Button"));
+
+require("../../../../index.css");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+const NewsCard = _ref => {
+  let {
+    title,
+    content,
+    image,
+    ctaText,
+    buttonType,
+    url,
+    buttonBgColor,
+    buttonTextColor,
+    buttonBorderColor,
+    hoverButtonBgColor,
+    hoverButtonTextColor,
+    hoverButtonBorderColor,
+    buttonDesign,
+    rounded,
+    boldTitle
+  } = _ref;
+  const roundedClasses = rounded ? 'rounded-lg' : '';
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: 'border flex p-2 ' + roundedClasses
+  }, /*#__PURE__*/_react.default.createElement(_Column.default, {
+    sm: 4,
+    md: 2
+  }, /*#__PURE__*/_react.default.createElement(_Image.default, {
+    classNames: roundedClasses,
+    image: image
+  })), /*#__PURE__*/_react.default.createElement(_Column.default, {
+    sm: 1
+  }), /*#__PURE__*/_react.default.createElement(_Column.default, {
+    sm: 6,
+    className: "expandable w-auto text-center "
+  }, boldTitle ? /*#__PURE__*/_react.default.createElement("b", null, /*#__PURE__*/_react.default.createElement("p", null, title)) : /*#__PURE__*/_react.default.createElement("p", null, title), /*#__PURE__*/_react.default.createElement("p", null, content), ctaText && /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_Button.default, _extends({
+    className: "w-full",
+    ctaText: ctaText,
+    buttonType: buttonType,
+    url: url,
+    bgColor: buttonBgColor,
+    textColor: buttonTextColor,
+    borderColor: buttonBorderColor,
+    hoverBgColor: hoverButtonBgColor,
+    hoverTextColor: hoverButtonTextColor,
+    hoverBorderColor: hoverButtonBorderColor
+  }, buttonDesign && {
+    buttonDesign: buttonDesign
+  })))));
+};
+
+var _default = NewsCard;
+exports.default = _default;

package/dist/{components/Profile → Profile}/index.js

@@ -9,6 +9,8 @@ require("core-js/modules/web.dom-collections.iterator.js");
 
 var _react = _interopRequireWildcard(require("react"));
 
+require("../../../../index.css");
+
 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; }
@@ -16,21 +18,22 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 const Profile = _ref => {
   let {
     profileLinks,
-    alignRight,
-    alignLeft,
+    alignment,
     userImage,
     imageHeight,
     imageWidth,
     classNames,
-    rounded
+    rounded,
+    bordered
   } = _ref;
-  let profileAlignment = alignRight ? ' float-right ' : alignLeft ? ' float-left ' : '';
-  let dropdownAlignement = alignRight ? ' mt-16 -mr-16 ' : alignLeft ? ' mt-16 -ml-16 ' : '';
-  let dropdownTextAlignement = alignRight ? '  ' : alignLeft ? '  ' : 'text-center';
+  let profileAlignment = alignment === 'right' ? ' float-right ' : alignment === 'left' ? ' float-left ' : '';
+  let dropdownAlignement = alignment === 'right' ? ' mt-16 -mr-16 ' : alignment === 'left' ? ' mt-16 -ml-16 ' : '';
+  let dropdownTextAlignement = alignment === 'right' ? '  ' : alignment === 'left' ? '  ' : 'text-center';
   const height = imageHeight && 'h-' + imageHeight;
   const width = imageWidth && 'w-' + imageWidth;
   const round = rounded ? 'rounded-full' : '';
-  const classes = width + ' ' + height + ' ' + round;
+  const border = bordered ? 'border' : '';
+  const classes = 'object-cover ' + width + ' ' + height + ' ' + round + ' ' + border;
   const [profileState, setProfileState] = (0, _react.useState)(false);
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
     className: 'text-center ' + classNames

package/dist/Row/index.js

@@ -0,0 +1,35 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+require("core-js/modules/es.object.assign.js");
+
+var _react = _interopRequireDefault(require("react"));
+
+require("../../../../index.css");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+const Row = _ref => {
+  let {
+    className,
+    children,
+    id,
+    bordered
+  } = _ref;
+  let classes = 'flex flex-wrap ' + className;
+  classes += bordered ? ' border' : '';
+  return /*#__PURE__*/_react.default.createElement("div", _extends({
+    className: classes
+  }, id && {
+    id: id
+  }), children);
+};
+
+var _default = Row;
+exports.default = _default;

package/dist/{components/Search → Search}/index.js

@@ -7,45 +7,54 @@ exports.default = void 0;
 
 var _react = _interopRequireDefault(require("react"));
 
-var _index = _interopRequireDefault(require("../Icon/index"));
+var _Icon = _interopRequireDefault(require("../../Atoms/Icon"));
+
+var _Column = _interopRequireDefault(require("../../Atoms/Column"));
+
+require("../../../../index.css");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 const Search = _ref => {
   let {
     className,
-    onChange: _onChange,
+    onChange,
     placeholder,
     text,
     leftIcon,
     rightIcon
   } = _ref;
-  let classes = className + ' flex';
-  let iconLeft = leftIcon ? /*#__PURE__*/_react.default.createElement(_index.default, {
+  let classes = className ? className + ' flex' : 'flex';
+  let iconLeft = leftIcon ? /*#__PURE__*/_react.default.createElement(_Icon.default, {
     type: leftIcon
   }) : null;
   let leftPadding = leftIcon ? 'pl-9' : 'pl-2';
-  let iconRight = rightIcon ? /*#__PURE__*/_react.default.createElement(_index.default, {
+  let iconRight = rightIcon ? /*#__PURE__*/_react.default.createElement(_Icon.default, {
     type: rightIcon
   }) : null;
+  const onChangeFunc = onChange ? e => onChange(e.target.value) : null;
   return /*#__PURE__*/_react.default.createElement("div", {
     id: "search",
     className: classes
+  }, /*#__PURE__*/_react.default.createElement(_Column.default, {
+    md: 2
   }, text && /*#__PURE__*/_react.default.createElement("h2", {
-    className: "font-base-lg pt-2"
-  }, text), /*#__PURE__*/_react.default.createElement("div", {
-    className: "relative block w-full"
+    className: "font-base-lg py-2 pr-4"
+  }, text)), /*#__PURE__*/_react.default.createElement(_Column.default, {
+    md: 10
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: "relative w-full flex"
   }, leftIcon && /*#__PURE__*/_react.default.createElement("span", {
-    className: "absolute inset-y-0 left-5 flex items-center pl-2"
+    className: "absolute py-4 left-3 flex items-center"
   }, iconLeft), /*#__PURE__*/_react.default.createElement("input", {
-    className: "w-full border-2 border-gray-300 placeholder:italic placeholder:text-gray-400 rounded-md py-1 focus:outline-none focus:border-sky-500 focus:ring-sky-500 focus:ring-1 " + leftPadding,
-    onChange: e => _onChange(e.target.value),
+    className: "w-full border-2 border-gray-300 placeholder:text-gray-400 rounded-md py-2 pr-9 focus:outline-none focus:border-sky-500 focus:ring-sky-500 focus:ring-1 " + leftPadding,
+    onChange: onChangeFunc,
     placeholder: placeholder,
     type: "text",
     name: "search"
   }), rightIcon && /*#__PURE__*/_react.default.createElement("span", {
-    className: "absolute inset-y-0 right-3 flex items-center pl-2"
-  }, iconRight)));
+    className: "absolute py-4 right-3 flex items-center"
+  }, iconRight))));
 };
 
 var _default = Search;

package/dist/StarRating/index.css

@@ -0,0 +1,8 @@
+.checked {
+  color: orange;
+}
+
+.unchecked {
+  color: orange;
+  opacity: 0.3;
+}

package/dist/{components/StarRating → StarRating}/index.js

@@ -13,7 +13,7 @@ var _react = _interopRequireDefault(require("react"));
 
 var _Icon = _interopRequireDefault(require("../Icon"));
 
-require("./index.css");
+require("../../../../index.css");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
@@ -58,7 +58,7 @@ const StarRating = _ref => {
   };
 
   const getAllStars = () => {
-    const starArray = [...getStarsChecked(), ...getStars()];
+    const starArray = [...getStars(), ...getStarsChecked()];
     return starArray;
   };
 

package/dist/{components/Testimonial → Testimonial}/index.js

@@ -7,6 +7,8 @@ exports.default = void 0;
 
 var _react = _interopRequireDefault(require("react"));
 
+require("../../../../index.css");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 const Testimonial = _ref => {

package/dist/{components/TextAndTitle → TextAndTitle}/index.js

@@ -7,6 +7,8 @@ exports.default = void 0;
 
 var _react = _interopRequireDefault(require("react"));
 
+require("../../../../index.css");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 const TextAndTitle = _ref => {
@@ -16,6 +18,7 @@ const TextAndTitle = _ref => {
     title,
     bgColor,
     textColor,
+    titleColor,
     titleClass,
     textClass
   } = _ref;
@@ -23,17 +26,22 @@ const TextAndTitle = _ref => {
   const textClasses = textClass + '';
   const classes = classNames + ' text-center'; //---------- Styling ---------------
 
-  const styles = {
+  const textStyles = {
     'background-color': bgColor,
     'color': textColor
+  };
+  const titleStyles = {
+    'background-color': bgColor,
+    'color': titleColor
   }; //-----------------------------------
 
   return /*#__PURE__*/_react.default.createElement("div", {
-    style: styles,
     className: classes
   }, /*#__PURE__*/_react.default.createElement("p", {
+    style: titleStyles,
     className: titleClasses
   }, title), /*#__PURE__*/_react.default.createElement("p", {
+    style: textStyles,
     className: textClasses
   }, text));
 };

package/dist/Timeline/index.js

@@ -0,0 +1,127 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+require("core-js/modules/es.array.reverse.js");
+
+var _react = _interopRequireDefault(require("react"));
+
+var _logoBlue = _interopRequireDefault(require("../../../Assets/Images/logoBlue.png"));
+
+var _CardWithTopImage = _interopRequireDefault(require("../CardWithTopImage"));
+
+var _Column = _interopRequireDefault(require("../../Atoms/Column"));
+
+var _Image = _interopRequireDefault(require("../../Atoms/Image"));
+
+var _Row = _interopRequireDefault(require("../../Atoms/Row"));
+
+require("../../../../index.css");
+
+require("./styles.css");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+const Timeline = _ref => {
+  let {
+    isHorizontal,
+    items,
+    reverse,
+    textCenter,
+    useImages
+  } = _ref;
+  const wrapperClasses = 'w-full list-none overflow-x-auto pb-4';
+  let ulClasses = 'timeline status-flow relative list-none pl-0 flex ';
+  let liClasses = 'my-0 status-flow-item relative flex flex-auto flex-row leading-tight ';
+  liClasses += textCenter ? 'text-center ' : '';
+  ulClasses += !reverse ? isHorizontal ? 'flex-row none-reverse justify-between' : 'flex-col none-reverse' : isHorizontal ? 'flex-row reverse justify-between' : 'flex-col reverse';
+  liClasses += !reverse ? isHorizontal ? 'items-center flex-col justify-between' : 'flex-row none-reverse' : isHorizontal ? 'items-center flex-col-reverse' : ' flex-row-reverse';
+  let padding;
+  padding = !reverse ? isHorizontal ? 'pb-2' : 'pl-4' : isHorizontal ? 'pt-2' : 'pr-4';
+  let circle = 'w-4 h-4 my-16 text-center mx-auto rounded-full border bg-black ';
+  circle += isHorizontal ? 'horizontal' : 'vertical';
+  return /*#__PURE__*/_react.default.createElement(_Column.default, {
+    sm: 12,
+    id: "timeline_container",
+    className: wrapperClasses
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: ulClasses
+  }, items && items.map((item, i) => {
+    let before;
+    if (i % 2 === 0) before = true;else before = false;
+    let a = isHorizontal ? '' : i === 0 ? '' : ' ';
+    let circlePos;
+
+    if (items.length - 1 > 0) {
+      if (i === 0) circlePos = 'first-circle';else if (i === items.length - 1) circlePos = 'last-circle';else circlePos = "circle";
+    }
+
+    if (isHorizontal) {
+      return /*#__PURE__*/_react.default.createElement(_Column.default, {
+        id: "timeline-item",
+        className: liClasses + ' py-4 ' + a
+      }, /*#__PURE__*/_react.default.createElement(_Row.default, {
+        className: "h-96"
+      }, before && /*#__PURE__*/_react.default.createElement(_CardWithTopImage.default, {
+        classNames: reverse ? 'w-96 -mt-8' : 'w-96',
+        image: _logoBlue.default,
+        roundedImage: true
+      }, /*#__PURE__*/_react.default.createElement("p", null, item.title + i), /*#__PURE__*/_react.default.createElement("p", null, /*#__PURE__*/_react.default.createElement("small", null, item.subtitle)))), /*#__PURE__*/_react.default.createElement(_Row.default, null, useImages ? /*#__PURE__*/_react.default.createElement("div", {
+        id: circlePos,
+        className: isHorizontal ? 'horizontal py-0 my-0' : 'vertical'
+      }, /*#__PURE__*/_react.default.createElement(_Image.default, {
+        classNames: circle,
+        image: _logoBlue.default,
+        width: 20,
+        height: 20
+      })) : /*#__PURE__*/_react.default.createElement("p", {
+        id: circlePos,
+        className: circle
+      })), /*#__PURE__*/_react.default.createElement(_Row.default, {
+        className: "h-96"
+      }, !before && /*#__PURE__*/_react.default.createElement(_CardWithTopImage.default, {
+        classNames: reverse ? 'w-96' : 'w-96 -mt-8',
+        image: _logoBlue.default,
+        roundedImage: true
+      }, /*#__PURE__*/_react.default.createElement("p", null, item.title + i), /*#__PURE__*/_react.default.createElement("p", null, /*#__PURE__*/_react.default.createElement("small", null, item.subtitle)))));
+    } else {
+      return /*#__PURE__*/_react.default.createElement(_Row.default, {
+        id: "timeline-item",
+        className: liClasses + ' py-4 ' + a
+      }, /*#__PURE__*/_react.default.createElement(_Column.default, {
+        sm: 5,
+        className: "text-center my-auto"
+      }, before && /*#__PURE__*/_react.default.createElement(_CardWithTopImage.default, {
+        image: _logoBlue.default,
+        roundedImage: true
+      }, /*#__PURE__*/_react.default.createElement("p", null, item.title + i), /*#__PURE__*/_react.default.createElement("p", null, /*#__PURE__*/_react.default.createElement("small", null, item.subtitle)))), /*#__PURE__*/_react.default.createElement(_Column.default, {
+        id: "circle-wrapper",
+        sm: 2,
+        className: "my-auto"
+      }, useImages ? /*#__PURE__*/_react.default.createElement("div", {
+        id: circlePos,
+        className: isHorizontal ? 'horizontal' : 'vertical'
+      }, /*#__PURE__*/_react.default.createElement(_Image.default, {
+        classNames: circle,
+        image: _logoBlue.default,
+        width: 20,
+        height: 20
+      })) : /*#__PURE__*/_react.default.createElement("p", {
+        id: circlePos,
+        className: circle
+      })), /*#__PURE__*/_react.default.createElement(_Column.default, {
+        sm: 5,
+        className: "text-center my-auto"
+      }, !before && /*#__PURE__*/_react.default.createElement(_CardWithTopImage.default, {
+        image: _logoBlue.default,
+        roundedImage: true
+      }, /*#__PURE__*/_react.default.createElement("p", null, item.title + i), /*#__PURE__*/_react.default.createElement("p", null, /*#__PURE__*/_react.default.createElement("small", null, item.subtitle)))));
+    }
+  })));
+};
+
+var _default = Timeline;
+exports.default = _default;

package/dist/Timeline/styles.css

@@ -0,0 +1,89 @@
+/* Vertical */
+#circle.vertical:before {
+  position: absolute;
+  display: block;
+  border-left: 1px solid #31a3dd;
+  content: "";
+  height: 50%;
+  top: 0%;
+  left: 49.9%;
+  z-index: -1;
+}
+
+#circle.vertical:after {
+  position: absolute;
+  display: block;
+  border-left: 1px solid #31a3dd;
+  content: "";
+  height: 50%;
+  bottom: 0%;
+  left: 49.9%;
+  z-index: -1;
+}
+
+#first-circle.vertical:after {
+  position: absolute;
+  display: block;
+  border-left: 1px solid #31a3dd;
+  content: "";
+  height: 50%;
+  bottom: 0%;
+  left: 49.9%;
+  z-index: -1;
+}
+
+#last-circle.vertical:before {
+  position: absolute;
+  display: block;
+  border-left: 1px solid #31a3dd;
+  content: "";
+  height: 50%;
+  top: 0%;
+  left: 49.9%;
+  z-index: -1;
+}
+
+/* Horizontal */
+#circle.horizontal:before {
+  position: absolute;
+  display: block;
+  border-top: 1px solid #31a3dd;
+  content: "";
+  width: 70%;
+  top: 50%;
+  left: -8%;
+  z-index: -1;
+}
+
+#circle.horizontal:after {
+  position: absolute;
+  display: block;
+  border-top: 1px solid #31a3dd;
+  content: "";
+  width: 70%;
+  top: 50%;
+  right: -12%;
+  z-index: -1;
+}
+
+#first-circle.horizontal:after {
+  position: absolute;
+  display: block;
+  border-top: 1px solid #31a3dd;
+  content: "";
+  width: 60%;
+  top: 50%;
+  right: -12%;
+  z-index: -1;
+}
+
+#last-circle.horizontal:before {
+  position: absolute;
+  display: block;
+  border-top: 1px solid #31a3dd;
+  content: "";
+  width: 55%;
+  top: 50%;
+  left: -8%;
+  z-index: -1;
+}

package/dist/Tubestops/index.js

@@ -0,0 +1,59 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+require("core-js/modules/es.array.reverse.js");
+
+var _react = _interopRequireDefault(require("react"));
+
+require("./styles.css");
+
+require("../../../../index.css");
+
+var _logoBlue = _interopRequireDefault(require("../../../Assets/Images/logoBlue.png"));
+
+var _CardWithTopImage = _interopRequireDefault(require("../../Organisms/CardWithTopImage"));
+
+var _Column = _interopRequireDefault(require("../Column"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+const Tubestops = _ref => {
+  let {
+    isHorizontal,
+    items,
+    reverse,
+    textCenter
+  } = _ref;
+  const wrapperClasses = 'w-full list-none';
+  let ulClasses = 'tubestop status-flow relative list-none pl-0 flex ';
+  let liClasses = 'mb-0 status-flow-item relative flex flex-auto flex-row leading-tight ';
+  liClasses += textCenter ? 'text-center ' : '';
+  ulClasses += !reverse ? isHorizontal ? 'flex-row none-reverse justify-between' : 'flex-col none-reverse' : isHorizontal ? 'flex-row reverse justify-between' : 'flex-col reverse';
+  liClasses += !reverse ? isHorizontal ? 'items-center flex-col-reverse justify-between' : 'flex-row none-reverse' : isHorizontal ? 'items-center flex-col' : ' flex-row-reverse';
+  let padding;
+  padding = !reverse ? isHorizontal ? 'pb-2' : 'pl-4' : isHorizontal ? 'pt-2' : 'pr-4';
+  const circle = 'w-4 h-4 rounded-full bg-black z-10';
+  return /*#__PURE__*/_react.default.createElement(_Column.default, {
+    md: 4,
+    id: "timeline_container",
+    className: wrapperClasses
+  }, /*#__PURE__*/_react.default.createElement("ul", {
+    className: ulClasses
+  }, items && items.map((item, i) => {
+    let a = isHorizontal ? i === 0 ? '' : '' : i === 0 ? '' : 'my-12';
+    return /*#__PURE__*/_react.default.createElement("li", {
+      className: liClasses + ' ' + a
+    }, /*#__PURE__*/_react.default.createElement("span", {
+      className: circle
+    }), /*#__PURE__*/_react.default.createElement("div", {
+      className: padding
+    }, /*#__PURE__*/_react.default.createElement("p", null, item.title + i), /*#__PURE__*/_react.default.createElement("p", null, /*#__PURE__*/_react.default.createElement("small", null, item.subtitle))));
+  })));
+};
+
+var _default = Tubestops;
+exports.default = _default;