trepur_components 0.2.34 → 0.2.35

package/dist/components/Accordion/index.js

@@ -27,8 +27,9 @@ const Accordion = _ref => {
     id: id
   }, {
     className: classes
-  }), items && items.map(item => {
+  }), items && items.map((item, i) => {
     return /*#__PURE__*/_react.default.createElement(_Collapsible.default, {
+      key: item.id + '_' + i,
       id: item.id,
       title: item.title,
       subtitle: item.subtitle,

package/dist/components/Breadcrumbs/index.js

@@ -25,7 +25,8 @@ const Breadcrumbs = _ref => {
     className: classList
   }, links && links.map((link, i) => {
     return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
-      className: "flex"
+      className: "flex",
+      key: i
     }, /*#__PURE__*/_react.default.createElement("li", {
       className: "h-8"
     }, i + 1 >= linksLength ? /*#__PURE__*/_react.default.createElement("p", {

package/dist/components/BreadcrumbsBordered/index.js

@@ -46,6 +46,7 @@ const Breadcrumbs = _ref => {
     }
 
     return /*#__PURE__*/_react.default.createElement(_BreadcrumbsItem.default, {
+      key: i,
       classes: margin,
       name: link.name,
       link: link.link,

package/dist/components/BreadcrumbsItem/index.js

@@ -43,16 +43,16 @@ const BreadcrumbsItem = _ref => {
   divClassList += divClasses; //---------- Styling ---------------
 
   const [styles, setStyles] = (0, _react.useState)({
-    'background-color': bgColor ? bgColor : 'gray',
+    'backgroundColor': bgColor ? bgColor : 'gray',
     'color': textColor ? textColor : 'black',
     'borderColor': borderColor ? borderColor : 'white'
   });
   const [hoverStyles, setHoverStyles] = (0, _react.useState)({
-    'background-color': 'transparent',
+    'backgroundColor': 'transparent',
     'border-left-color': bgColor ? bgColor : 'gray'
   });
   const [hoverStylesBackArrows, setHoverStylesBackArrows] = (0, _react.useState)({
-    'background-color': 'transparent',
+    'backgroundColor': 'transparent',
     'color': bgColor ? bgColor : 'gray',
     'border-left-color': 'transparent'
   });
@@ -60,31 +60,31 @@ const BreadcrumbsItem = _ref => {
   const setHoverState = isHovering => {
     if (isHovering) {
       setStyles({
-        'background-color': hoverBgColor ? hoverBgColor : 'black',
+        'backgroundColor': hoverBgColor ? hoverBgColor : 'black',
         'color': hoverTextColor ? hoverTextColor : 'white',
         'borderColor': hoverBorderColor ? hoverBorderColor : 'white'
       });
       setHoverStyles({
-        'background-color': 'transparent',
+        'backgroundColor': 'transparent',
         'border-left-color': hoverBgColor ? hoverBgColor : 'black'
       });
       setHoverStylesBackArrows({
-        'background-color': 'transparent',
+        'backgroundColor': 'transparent',
         'color': hoverBgColor ? hoverBgColor : 'black',
         'border-left-color': 'transparent'
       });
     } else {
       setStyles({
-        'background-color': bgColor ? bgColor : 'grey',
+        'backgroundColor': bgColor ? bgColor : 'grey',
         'color': textColor ? textColor : 'black',
         'border-color': borderColor ? borderColor : 'white'
       });
       setHoverStyles({
-        'background-color': 'transparent',
+        'backgroundColor': 'transparent',
         'border-left-color': bgColor ? bgColor : 'gray'
       });
       setHoverStylesBackArrows({
-        'background-color': 'transparent',
+        'backgroundColor': 'transparent',
         'color': bgColor ? bgColor : 'gray',
         'border-left-color': 'transparent'
       });

package/dist/components/Button/index.js

@@ -53,7 +53,7 @@ const Button = _ref => {
   let externalPadding = buttonType === 'external' ? 'py-3 ' : 'py-2 ';
   let borderClassList = buttonBordered ? 'border-2 ' : '';
   let roundedClassList = buttonRounded ? 'rounded-full ' : '';
-  let standardClasses = ' rounded-lg text-black transition-background-color duration-500 transform ' + borderClassList + roundedClassList;
+  let standardClasses = ' rounded-lg text-black transition-backgroundColor duration-500 transform ' + borderClassList + roundedClassList;
   let slideClasses = ' btn px-8 text-white border-2 bg-gray hover:bg-brand-primary hover:text-black ';
   let classList = padding;
   classList += externalPadding;

package/dist/components/Card/index.js

@@ -1,13 +1,13 @@
 "use strict";
 
-require("core-js/modules/es.object.assign.js");
+require("core-js/modules/web.dom-collections.iterator.js");
 
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
 
-require("core-js/modules/web.dom-collections.iterator.js");
+require("core-js/modules/es.object.assign.js");
 
 var _react = _interopRequireWildcard(require("react"));
 
@@ -79,9 +79,9 @@ const Card = _ref => {
     buttonRounded,
     buttonIconBrand,
     buttonDisabled,
-    onHover = false
+    onHover
   } = _ref;
-  const [showHoverButtons, setShowHoverButtons] = (0, _react.useState)(false);
+  // const [showHoverButtons, setShowHoverButtons] = useState(false)
   let orderClass = cardImageBelowTitle ? ' order-first ' : '';
   let titleWrapperClass = 'p-3 ';
   titleWrapperClass += orderClass ? orderClass : '';
@@ -106,11 +106,9 @@ const Card = _ref => {
   }, cardId && {
     id: cardId
   }, {
-    className: classList
-  }, onHover && {
-    onMouseEnter: () => setShowHoverButtons(true)
-  }, onHover && {
-    onMouseLeave: () => setShowHoverButtons(false)
+    className: classList // {...(onHover && {onMouseEnter: () => setShowHoverButtons(true)})}
+    // {...(onHover && {onMouseLeave: () => setShowHoverButtons(false)})}
+
   }), /*#__PURE__*/_react.default.createElement("div", {
     className: "card-content flex flex-1 flex-col"
   }, mp4File || webmFile || ogvFile ? /*#__PURE__*/_react.default.createElement("div", {
@@ -139,7 +137,7 @@ const Card = _ref => {
     className: imageClassList,
     src: cardImage,
     alt: cardAltText
-  })), !showHoverButtons ? /*#__PURE__*/_react.default.createElement("div", null, cardTitle && /*#__PURE__*/_react.default.createElement("div", {
+  })), /*#__PURE__*/_react.default.createElement("div", null, cardTitle && /*#__PURE__*/_react.default.createElement("div", {
     className: titleWrapperClass
   }, /*#__PURE__*/_react.default.createElement("h1", {
     className: cardTitleClasses
@@ -151,31 +149,7 @@ const Card = _ref => {
     className: cardDescriptionClass && cardDescriptionClass
   }, cardDescription), cardExtraText && /*#__PURE__*/_react.default.createElement("h2", {
     className: cardExtraTextClass && cardExtraTextClass
-  }, cardExtraText))) : /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("div", {
-    className: "flex pt-2"
-  }, /*#__PURE__*/_react.default.createElement(_Button.default, {
-    buttonType: "icon",
-    buttonUrl: "/",
-    buttonCenterIcon: "heart",
-    buttonBgColor: "white",
-    buttonTextColor: "black",
-    buttonBorderColor: "black",
-    buttonHoverBgColor: "black",
-    buttonHoverTextColor: "white",
-    buttonHoverBorderColor: "black",
-    buttonBordered: true,
-    iconSize: 1,
-    iconHollow: true
-  }), /*#__PURE__*/_react.default.createElement(_Button.default, {
-    buttonClasses: "ml-2 w-full",
-    buttonText: "Add to basket",
-    buttonBordered: true,
-    buttonRounded: false,
-    buttonDisabled: false,
-    buttonBgColor: "#2f4848",
-    buttonBorderColor: "#2f4848",
-    buttonTextColor: "white"
-  })))), cardHasCta && /*#__PURE__*/_react.default.createElement("div", {
+  }, cardExtraText)))), cardHasCta && /*#__PURE__*/_react.default.createElement("div", {
     className: btnClass
   }, /*#__PURE__*/_react.default.createElement(_Button.default, _extends({
     buttonId: buttonId,

package/dist/components/Collapsible/index.js

@@ -26,6 +26,7 @@ function _extends() { _extends = Object.assign || function (target) { for (var i
 const Collapsible = _ref => {
   let {
     id,
+    key,
     classes,
     title,
     subtitle,
@@ -46,11 +47,11 @@ const Collapsible = _ref => {
   } = _ref;
   const [expanded, setExpanded] = (0, _react.useState)(false);
   const [styles, setStyles] = (0, _react.useState)({
-    'background-color': bgColor ? bgColor : 'grey',
+    'backgroundColor': bgColor ? bgColor : 'grey',
     color: textColor ? textColor : 'white'
   });
   const [contentStyles, setContentStyles] = (0, _react.useState)({
-    'background-color': contentBgColor ? contentBgColor : 'white',
+    'backgroundColor': contentBgColor ? contentBgColor : 'white',
     color: contentTextColor ? contentTextColor : 'black'
   });
 
@@ -61,12 +62,12 @@ const Collapsible = _ref => {
   const setHoverState = isHovering => {
     if (isHovering) {
       setStyles({
-        'background-color': hoverBgColor ? hoverBgColor : 'black',
+        'backgroundColor': hoverBgColor ? hoverBgColor : 'black',
         color: hoverTextColor ? hoverTextColor : 'white'
       });
     } else {
       setStyles({
-        'background-color': bgColor ? bgColor : 'grey',
+        'backgroundColor': bgColor ? bgColor : 'grey',
         color: textColor ? textColor : 'white'
       });
     }
@@ -83,7 +84,8 @@ const Collapsible = _ref => {
   return /*#__PURE__*/_react.default.createElement("div", _extends({}, id && {
     id: id
   }, {
-    className: classes
+    className: classes,
+    key: key
   }), /*#__PURE__*/_react.default.createElement("div", {
     style: styles,
     onMouseOver: () => setHoverState(true),

package/dist/components/Form/index.js

@@ -49,6 +49,7 @@ const Form = _ref => {
   }), components && components.map(component => {
     if (component.type === 'Input') {
       return /*#__PURE__*/_react.default.createElement(_Input.default, {
+        key: i,
         classes: component.classes,
         label: component.label,
         placeholder: component.placeholder,
@@ -57,6 +58,7 @@ const Form = _ref => {
       });
     } else if (component.type === 'Button') {
       return /*#__PURE__*/_react.default.createElement(_Button.default, {
+        key: i,
         type: component.htmlType,
         onClick: onClick,
         classes: component.classes,

package/dist/components/InformationIcon/index.js

@@ -84,19 +84,19 @@ const InformationIcon = _ref => {
   }, []); //---------- Styling ---------------
 
   const [styles, setStyles] = (0, _react.useState)({
-    'background-color': bgColor ? bgColor : 'white',
+    'backgroundColor': bgColor ? bgColor : 'white',
     color: textColor ? textColor : 'black'
   });
 
   const setHoverState = isHovering => {
     if (isHovering) {
       setStyles({
-        'background-color': hoverBgColor ? hoverBgColor : 'white',
+        'backgroundColor': hoverBgColor ? hoverBgColor : 'white',
         color: hoverTextColor ? hoverTextColor : 'black'
       });
     } else {
       setStyles({
-        'background-color': bgColor ? bgColor : 'white',
+        'backgroundColor': bgColor ? bgColor : 'white',
         color: textColor ? textColor : 'black'
       });
     }

package/dist/components/Nav/index.js

@@ -53,19 +53,19 @@ const Nav = _ref => {
   } = _ref;
   //---------- Styling ---------------
   const [styles, setStyles] = (0, _react.useState)({
-    'background-color': mobileNavButtonBgColor ? mobileNavButtonBgColor : 'white',
+    'backgroundColor': mobileNavButtonBgColor ? mobileNavButtonBgColor : 'white',
     color: mobileNavButtonColor ? mobileNavButtonColor : 'black'
   });
 
   const setHoverState = isHovering => {
     if (isHovering) {
       setStyles({
-        'background-color': hoverMobileNavButtonBgColor ? hoverMobileNavButtonBgColor : 'black',
+        'backgroundColor': hoverMobileNavButtonBgColor ? hoverMobileNavButtonBgColor : 'black',
         color: hoverMobileNavButtonColor ? hoverMobileNavButtonColor : 'white'
       });
     } else {
       setStyles({
-        'background-color': mobileNavButtonBgColor ? mobileNavButtonBgColor : 'white',
+        'backgroundColor': mobileNavButtonBgColor ? mobileNavButtonBgColor : 'white',
         color: mobileNavButtonColor ? mobileNavButtonColor : 'black'
       });
     }
@@ -73,13 +73,13 @@ const Nav = _ref => {
 
   const [sideNavWidth, setSideNavWidth] = (0, _react.useState)({
     'width': '0px',
-    'background-color': mobileBgColor ? mobileBgColor : bgColor
+    'backgroundColor': mobileBgColor ? mobileBgColor : bgColor
   });
 
   const openSideNav = () => {
     setSideNavWidth({
       'width': "".concat(sideBarWidth, "px"),
-      'background-color': mobileBgColor ? mobileBgColor : bgColor,
+      'backgroundColor': mobileBgColor ? mobileBgColor : bgColor,
       'padding-right': '10px'
     });
   };
@@ -87,26 +87,26 @@ const Nav = _ref => {
   const closeSideNav = () => {
     setSideNavWidth({
       'width': '0px',
-      'background-color': mobileBgColor ? mobileBgColor : bgColor
+      'backgroundColor': mobileBgColor ? mobileBgColor : bgColor
     });
   };
 
   const [navDropdownNavHeight, setDropdownNavHeight] = (0, _react.useState)({
     'heigth': '0px',
-    'background-color': mobileBgColor ? mobileBgColor : bgColor
+    'backgroundColor': mobileBgColor ? mobileBgColor : bgColor
   });
 
   const openDropdownNav = () => {
     setDropdownNavHeight({
       'height': "".concat(dropdownNavHeight, "px"),
-      'background-color': mobileBgColor ? mobileBgColor : bgColor
+      'backgroundColor': mobileBgColor ? mobileBgColor : bgColor
     });
   };
 
   const closeDropdownNav = () => {
     setDropdownNavHeight({
       'height': '0px',
-      'background-color': mobileBgColor ? mobileBgColor : bgColor
+      'backgroundColor': mobileBgColor ? mobileBgColor : bgColor
     });
   };
 
@@ -139,7 +139,7 @@ const Nav = _ref => {
     id: "sm-nav",
     className: mobileClassList,
     style: {
-      'background-color': bgColor,
+      'backgroundColor': bgColor,
       'border-color': borderBottomColor
     }
   }, /*#__PURE__*/_react.default.createElement("div", {
@@ -183,7 +183,7 @@ const Nav = _ref => {
   }))), /*#__PURE__*/_react.default.createElement("div", {
     className: desktopClassList,
     style: {
-      'background-color': bgColor,
+      'backgroundColor': bgColor,
       'border-color': borderBottomColor
     }
   }, /*#__PURE__*/_react.default.createElement("div", {

package/dist/components/Testimonial/index.js

@@ -37,7 +37,7 @@ const Testimonial = _ref => {
   const imageClassList = imageClasses + ' mx-auto rounded-full w-32 h-32'; //---------- Styling ---------------
 
   const styles = {
-    'background-color': bgColor,
+    'backgroundColor': bgColor,
     'color': textColor
   }; //-----------------------------------
 

package/dist/components/TextAndTitle/index.js

@@ -37,11 +37,11 @@ const TextAndTitle = _ref => {
   classList += classes ? classes : ''; //---------- Styling ---------------
 
   const textStyles = {
-    'background-color': bgColor,
+    'backgroundColor': bgColor,
     'color': textColor
   };
   const titleStyles = {
-    'background-color': bgColor,
+    'backgroundColor': bgColor,
     'color': titleColor
   }; //-----------------------------------
 

package/package.json

@@ -2,7 +2,7 @@
   "name": "trepur_components",
   "description": "component lib",
   "author": "trepur_ttenneb",
-  "version": "0.2.34",
+  "version": "0.2.35",
   "private": false,
   "keywords": [
     "react",