trepur_components 0.2.34 → 0.2.37

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (12) hide show
  1. package/dist/components/Accordion/index.js +2 -1
  2. package/dist/components/Breadcrumbs/index.js +2 -1
  3. package/dist/components/BreadcrumbsBordered/index.js +1 -0
  4. package/dist/components/BreadcrumbsItem/index.js +9 -9
  5. package/dist/components/Button/index.js +1 -1
  6. package/dist/components/Card/index.js +9 -6
  7. package/dist/components/Collapsible/index.js +7 -5
  8. package/dist/components/InformationIcon/index.js +3 -3
  9. package/dist/components/Nav/index.js +11 -11
  10. package/dist/components/Testimonial/index.js +1 -1
  11. package/dist/components/TextAndTitle/index.js +2 -2
  12. package/package.json +1 -1
package/dist/components/Accordion/index.js CHANGED
@@ -27,8 +27,9 @@ const Accordion = _ref => {
27
27
  id: id
28
28
  }, {
29
29
  className: classes
30
- }), items && items.map(item => {
30
+ }), items && items.map((item, i) => {
31
31
  return /*#__PURE__*/_react.default.createElement(_Collapsible.default, {
32
+ key: item.id + '_' + i,
32
33
  id: item.id,
33
34
  title: item.title,
34
35
  subtitle: item.subtitle,
package/dist/components/Breadcrumbs/index.js CHANGED
@@ -25,7 +25,8 @@ const Breadcrumbs = _ref => {
25
25
  className: classList
26
26
  }, links && links.map((link, i) => {
27
27
  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
28
- className: "flex"
28
+ className: "flex",
29
+ key: i
29
30
  }, /*#__PURE__*/_react.default.createElement("li", {
30
31
  className: "h-8"
31
32
  }, i + 1 >= linksLength ? /*#__PURE__*/_react.default.createElement("p", {
package/dist/components/BreadcrumbsBordered/index.js CHANGED
@@ -46,6 +46,7 @@ const Breadcrumbs = _ref => {
46
46
  }
47
47
 
48
48
  return /*#__PURE__*/_react.default.createElement(_BreadcrumbsItem.default, {
49
+ key: i,
49
50
  classes: margin,
50
51
  name: link.name,
51
52
  link: link.link,
package/dist/components/BreadcrumbsItem/index.js CHANGED
@@ -43,16 +43,16 @@ const BreadcrumbsItem = _ref => {
43
43
  divClassList += divClasses; //---------- Styling ---------------
44
44
 
45
45
  const [styles, setStyles] = (0, _react.useState)({
46
- 'background-color': bgColor ? bgColor : 'gray',
46
+ 'backgroundColor': bgColor ? bgColor : 'gray',
47
47
  'color': textColor ? textColor : 'black',
48
48
  'borderColor': borderColor ? borderColor : 'white'
49
49
  });
50
50
  const [hoverStyles, setHoverStyles] = (0, _react.useState)({
51
- 'background-color': 'transparent',
51
+ 'backgroundColor': 'transparent',
52
52
  'border-left-color': bgColor ? bgColor : 'gray'
53
53
  });
54
54
  const [hoverStylesBackArrows, setHoverStylesBackArrows] = (0, _react.useState)({
55
- 'background-color': 'transparent',
55
+ 'backgroundColor': 'transparent',
56
56
  'color': bgColor ? bgColor : 'gray',
57
57
  'border-left-color': 'transparent'
58
58
  });
@@ -60,31 +60,31 @@ const BreadcrumbsItem = _ref => {
60
60
  const setHoverState = isHovering => {
61
61
  if (isHovering) {
62
62
  setStyles({
63
- 'background-color': hoverBgColor ? hoverBgColor : 'black',
63
+ 'backgroundColor': hoverBgColor ? hoverBgColor : 'black',
64
64
  'color': hoverTextColor ? hoverTextColor : 'white',
65
65
  'borderColor': hoverBorderColor ? hoverBorderColor : 'white'
66
66
  });
67
67
  setHoverStyles({
68
- 'background-color': 'transparent',
68
+ 'backgroundColor': 'transparent',
69
69
  'border-left-color': hoverBgColor ? hoverBgColor : 'black'
70
70
  });
71
71
  setHoverStylesBackArrows({
72
- 'background-color': 'transparent',
72
+ 'backgroundColor': 'transparent',
73
73
  'color': hoverBgColor ? hoverBgColor : 'black',
74
74
  'border-left-color': 'transparent'
75
75
  });
76
76
  } else {
77
77
  setStyles({
78
- 'background-color': bgColor ? bgColor : 'grey',
78
+ 'backgroundColor': bgColor ? bgColor : 'grey',
79
79
  'color': textColor ? textColor : 'black',
80
80
  'border-color': borderColor ? borderColor : 'white'
81
81
  });
82
82
  setHoverStyles({
83
- 'background-color': 'transparent',
83
+ 'backgroundColor': 'transparent',
84
84
  'border-left-color': bgColor ? bgColor : 'gray'
85
85
  });
86
86
  setHoverStylesBackArrows({
87
- 'background-color': 'transparent',
87
+ 'backgroundColor': 'transparent',
88
88
  'color': bgColor ? bgColor : 'gray',
89
89
  'border-left-color': 'transparent'
90
90
  });
package/dist/components/Button/index.js CHANGED
@@ -53,7 +53,7 @@ const Button = _ref => {
53
53
  let externalPadding = buttonType === 'external' ? 'py-3 ' : 'py-2 ';
54
54
  let borderClassList = buttonBordered ? 'border-2 ' : '';
55
55
  let roundedClassList = buttonRounded ? 'rounded-full ' : '';
56
- let standardClasses = ' rounded-lg text-black transition-background-color duration-500 transform ' + borderClassList + roundedClassList;
56
+ let standardClasses = ' rounded-lg text-black transition-backgroundColor duration-500 transform ' + borderClassList + roundedClassList;
57
57
  let slideClasses = ' btn px-8 text-white border-2 bg-gray hover:bg-brand-primary hover:text-black ';
58
58
  let classList = padding;
59
59
  classList += externalPadding;
package/dist/components/Card/index.js CHANGED
@@ -79,7 +79,7 @@ const Card = _ref => {
79
79
  buttonRounded,
80
80
  buttonIconBrand,
81
81
  buttonDisabled,
82
- onHover = false
82
+ onHover
83
83
  } = _ref;
84
84
  const [showHoverButtons, setShowHoverButtons] = (0, _react.useState)(false);
85
85
  let orderClass = cardImageBelowTitle ? ' order-first ' : '';
@@ -101,16 +101,19 @@ const Card = _ref => {
101
101
  let imageClassList = 'w-full ';
102
102
  imageClassList += !cardImageBelowTitle ? roundedImage : '';
103
103
  imageClassList += cardImageClass;
104
+
105
+ const toggleHover = isHovering => {
106
+ onHover && isHovering ? setShowHoverButtons(true) : setShowHoverButtons(false);
107
+ };
108
+
104
109
  return /*#__PURE__*/_react.default.createElement("div", _extends({
105
110
  key: cardId
106
111
  }, cardId && {
107
112
  id: cardId
108
113
  }, {
109
- className: classList
110
- }, onHover && {
111
- onMouseEnter: () => setShowHoverButtons(true)
112
- }, onHover && {
113
- onMouseLeave: () => setShowHoverButtons(false)
114
+ className: classList,
115
+ onMouseEnter: () => toggleHover(true),
116
+ onMouseLeave: () => toggleHover(false)
114
117
  }), /*#__PURE__*/_react.default.createElement("div", {
115
118
  className: "card-content flex flex-1 flex-col"
116
119
  }, mp4File || webmFile || ogvFile ? /*#__PURE__*/_react.default.createElement("div", {
package/dist/components/Collapsible/index.js CHANGED
@@ -26,6 +26,7 @@ function _extends() { _extends = Object.assign || function (target) { for (var i
26
26
  const Collapsible = _ref => {
27
27
  let {
28
28
  id,
29
+ key,
29
30
  classes,
30
31
  title,
31
32
  subtitle,
@@ -46,11 +47,11 @@ const Collapsible = _ref => {
46
47
  } = _ref;
47
48
  const [expanded, setExpanded] = (0, _react.useState)(false);
48
49
  const [styles, setStyles] = (0, _react.useState)({
49
- 'background-color': bgColor ? bgColor : 'grey',
50
+ 'backgroundColor': bgColor ? bgColor : 'grey',
50
51
  color: textColor ? textColor : 'white'
51
52
  });
52
53
  const [contentStyles, setContentStyles] = (0, _react.useState)({
53
- 'background-color': contentBgColor ? contentBgColor : 'white',
54
+ 'backgroundColor': contentBgColor ? contentBgColor : 'white',
54
55
  color: contentTextColor ? contentTextColor : 'black'
55
56
  });
56
57
 
@@ -61,12 +62,12 @@ const Collapsible = _ref => {
61
62
  const setHoverState = isHovering => {
62
63
  if (isHovering) {
63
64
  setStyles({
64
- 'background-color': hoverBgColor ? hoverBgColor : 'black',
65
+ 'backgroundColor': hoverBgColor ? hoverBgColor : 'black',
65
66
  color: hoverTextColor ? hoverTextColor : 'white'
66
67
  });
67
68
  } else {
68
69
  setStyles({
69
- 'background-color': bgColor ? bgColor : 'grey',
70
+ 'backgroundColor': bgColor ? bgColor : 'grey',
70
71
  color: textColor ? textColor : 'white'
71
72
  });
72
73
  }
@@ -83,7 +84,8 @@ const Collapsible = _ref => {
83
84
  return /*#__PURE__*/_react.default.createElement("div", _extends({}, id && {
84
85
  id: id
85
86
  }, {
86
- className: classes
87
+ className: classes,
88
+ key: key
87
89
  }), /*#__PURE__*/_react.default.createElement("div", {
88
90
  style: styles,
89
91
  onMouseOver: () => setHoverState(true),
package/dist/components/InformationIcon/index.js CHANGED
@@ -84,19 +84,19 @@ const InformationIcon = _ref => {
84
84
  }, []); //---------- Styling ---------------
85
85
 
86
86
  const [styles, setStyles] = (0, _react.useState)({
87
- 'background-color': bgColor ? bgColor : 'white',
87
+ 'backgroundColor': bgColor ? bgColor : 'white',
88
88
  color: textColor ? textColor : 'black'
89
89
  });
90
90
 
91
91
  const setHoverState = isHovering => {
92
92
  if (isHovering) {
93
93
  setStyles({
94
- 'background-color': hoverBgColor ? hoverBgColor : 'white',
94
+ 'backgroundColor': hoverBgColor ? hoverBgColor : 'white',
95
95
  color: hoverTextColor ? hoverTextColor : 'black'
96
96
  });
97
97
  } else {
98
98
  setStyles({
99
- 'background-color': bgColor ? bgColor : 'white',
99
+ 'backgroundColor': bgColor ? bgColor : 'white',
100
100
  color: textColor ? textColor : 'black'
101
101
  });
102
102
  }
package/dist/components/Nav/index.js CHANGED
@@ -53,19 +53,19 @@ const Nav = _ref => {
53
53
  } = _ref;
54
54
  //---------- Styling ---------------
55
55
  const [styles, setStyles] = (0, _react.useState)({
56
- 'background-color': mobileNavButtonBgColor ? mobileNavButtonBgColor : 'white',
56
+ 'backgroundColor': mobileNavButtonBgColor ? mobileNavButtonBgColor : 'white',
57
57
  color: mobileNavButtonColor ? mobileNavButtonColor : 'black'
58
58
  });
59
59
 
60
60
  const setHoverState = isHovering => {
61
61
  if (isHovering) {
62
62
  setStyles({
63
- 'background-color': hoverMobileNavButtonBgColor ? hoverMobileNavButtonBgColor : 'black',
63
+ 'backgroundColor': hoverMobileNavButtonBgColor ? hoverMobileNavButtonBgColor : 'black',
64
64
  color: hoverMobileNavButtonColor ? hoverMobileNavButtonColor : 'white'
65
65
  });
66
66
  } else {
67
67
  setStyles({
68
- 'background-color': mobileNavButtonBgColor ? mobileNavButtonBgColor : 'white',
68
+ 'backgroundColor': mobileNavButtonBgColor ? mobileNavButtonBgColor : 'white',
69
69
  color: mobileNavButtonColor ? mobileNavButtonColor : 'black'
70
70
  });
71
71
  }
@@ -73,13 +73,13 @@ const Nav = _ref => {
73
73
 
74
74
  const [sideNavWidth, setSideNavWidth] = (0, _react.useState)({
75
75
  'width': '0px',
76
- 'background-color': mobileBgColor ? mobileBgColor : bgColor
76
+ 'backgroundColor': mobileBgColor ? mobileBgColor : bgColor
77
77
  });
78
78
 
79
79
  const openSideNav = () => {
80
80
  setSideNavWidth({
81
81
  'width': "".concat(sideBarWidth, "px"),
82
- 'background-color': mobileBgColor ? mobileBgColor : bgColor,
82
+ 'backgroundColor': mobileBgColor ? mobileBgColor : bgColor,
83
83
  'padding-right': '10px'
84
84
  });
85
85
  };
@@ -87,26 +87,26 @@ const Nav = _ref => {
87
87
  const closeSideNav = () => {
88
88
  setSideNavWidth({
89
89
  'width': '0px',
90
- 'background-color': mobileBgColor ? mobileBgColor : bgColor
90
+ 'backgroundColor': mobileBgColor ? mobileBgColor : bgColor
91
91
  });
92
92
  };
93
93
 
94
94
  const [navDropdownNavHeight, setDropdownNavHeight] = (0, _react.useState)({
95
95
  'heigth': '0px',
96
- 'background-color': mobileBgColor ? mobileBgColor : bgColor
96
+ 'backgroundColor': mobileBgColor ? mobileBgColor : bgColor
97
97
  });
98
98
 
99
99
  const openDropdownNav = () => {
100
100
  setDropdownNavHeight({
101
101
  'height': "".concat(dropdownNavHeight, "px"),
102
- 'background-color': mobileBgColor ? mobileBgColor : bgColor
102
+ 'backgroundColor': mobileBgColor ? mobileBgColor : bgColor
103
103
  });
104
104
  };
105
105
 
106
106
  const closeDropdownNav = () => {
107
107
  setDropdownNavHeight({
108
108
  'height': '0px',
109
- 'background-color': mobileBgColor ? mobileBgColor : bgColor
109
+ 'backgroundColor': mobileBgColor ? mobileBgColor : bgColor
110
110
  });
111
111
  };
112
112
 
@@ -139,7 +139,7 @@ const Nav = _ref => {
139
139
  id: "sm-nav",
140
140
  className: mobileClassList,
141
141
  style: {
142
- 'background-color': bgColor,
142
+ 'backgroundColor': bgColor,
143
143
  'border-color': borderBottomColor
144
144
  }
145
145
  }, /*#__PURE__*/_react.default.createElement("div", {
@@ -183,7 +183,7 @@ const Nav = _ref => {
183
183
  }))), /*#__PURE__*/_react.default.createElement("div", {
184
184
  className: desktopClassList,
185
185
  style: {
186
- 'background-color': bgColor,
186
+ 'backgroundColor': bgColor,
187
187
  'border-color': borderBottomColor
188
188
  }
189
189
  }, /*#__PURE__*/_react.default.createElement("div", {
package/dist/components/Testimonial/index.js CHANGED
@@ -37,7 +37,7 @@ const Testimonial = _ref => {
37
37
  const imageClassList = imageClasses + ' mx-auto rounded-full w-32 h-32'; //---------- Styling ---------------
38
38
 
39
39
  const styles = {
40
- 'background-color': bgColor,
40
+ 'backgroundColor': bgColor,
41
41
  'color': textColor
42
42
  }; //-----------------------------------
43
43
 
package/dist/components/TextAndTitle/index.js CHANGED
@@ -37,11 +37,11 @@ const TextAndTitle = _ref => {
37
37
  classList += classes ? classes : ''; //---------- Styling ---------------
38
38
 
39
39
  const textStyles = {
40
- 'background-color': bgColor,
40
+ 'backgroundColor': bgColor,
41
41
  'color': textColor
42
42
  };
43
43
  const titleStyles = {
44
- 'background-color': bgColor,
44
+ 'backgroundColor': bgColor,
45
45
  'color': titleColor
46
46
  }; //-----------------------------------
47
47
 
package/package.json CHANGED
@@ -2,7 +2,7 @@
2
2
  "name": "trepur_components",
3
3
  "description": "component lib",
4
4
  "author": "trepur_ttenneb",
5
- "version": "0.2.34",
5
+ "version": "0.2.37",
6
6
  "private": false,
7
7
  "keywords": [
8
8
  "react",