trepur_components 0.3.13 → 0.3.14
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.
|
@@ -54,27 +54,76 @@ const Column = _ref => {
|
|
|
54
54
|
9: 'w-9/12',
|
|
55
55
|
10: 'w-10/12',
|
|
56
56
|
11: 'w-11/12',
|
|
57
|
-
12: 'w-
|
|
57
|
+
12: 'w-full'
|
|
58
|
+
};
|
|
59
|
+
const mdWidthOptions = {
|
|
60
|
+
1: 'md:w-1/12',
|
|
61
|
+
2: 'md:w-2/12',
|
|
62
|
+
3: 'md:w-3/12',
|
|
63
|
+
4: 'md:w-4/12',
|
|
64
|
+
5: 'md:w-5/12',
|
|
65
|
+
6: 'md:w-6/12',
|
|
66
|
+
7: 'md:w-7/12',
|
|
67
|
+
8: 'md:w-8/12',
|
|
68
|
+
9: 'md:w-9/12',
|
|
69
|
+
10: 'md:w-10/12',
|
|
70
|
+
11: 'md:w-11/12',
|
|
71
|
+
12: 'md:w-full'
|
|
72
|
+
};
|
|
73
|
+
const lgWidthOptions = {
|
|
74
|
+
1: 'lg:w-1/12',
|
|
75
|
+
2: 'lg:w-2/12',
|
|
76
|
+
3: 'lg:w-3/12',
|
|
77
|
+
4: 'lg:w-4/12',
|
|
78
|
+
5: 'lg:w-5/12',
|
|
79
|
+
6: 'lg:w-6/12',
|
|
80
|
+
7: 'lg:w-7/12',
|
|
81
|
+
8: 'lg:w-8/12',
|
|
82
|
+
9: 'lg:w-9/12',
|
|
83
|
+
10: 'lg:w-10/12',
|
|
84
|
+
11: 'lg:w-11/12',
|
|
85
|
+
12: 'lg:w-full'
|
|
86
|
+
};
|
|
87
|
+
const xlWidthOptions = {
|
|
88
|
+
1: 'xl:w-1/12',
|
|
89
|
+
2: 'xl:w-2/12',
|
|
90
|
+
3: 'xl:w-3/12',
|
|
91
|
+
4: 'xl:w-4/12',
|
|
92
|
+
5: 'xl:w-5/12',
|
|
93
|
+
6: 'xl:w-6/12',
|
|
94
|
+
7: 'xl:w-7/12',
|
|
95
|
+
8: 'xl:w-8/12',
|
|
96
|
+
9: 'xl:w-9/12',
|
|
97
|
+
10: 'xl:w-10/12',
|
|
98
|
+
11: 'xl:w-11/12',
|
|
99
|
+
12: 'xl:w-full'
|
|
58
100
|
};
|
|
59
101
|
|
|
60
|
-
const calculateWidth = size => {
|
|
61
|
-
|
|
102
|
+
const calculateWidth = (screen, size) => {
|
|
103
|
+
switch (screen) {
|
|
104
|
+
case 'sm':
|
|
105
|
+
return widthOptions[size];
|
|
62
106
|
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
} else {
|
|
66
|
-
width = widthOptions[size];
|
|
67
|
-
}
|
|
107
|
+
case 'md':
|
|
108
|
+
return mdWidthOptions[size];
|
|
68
109
|
|
|
69
|
-
|
|
110
|
+
case 'lg':
|
|
111
|
+
return lgWidthOptions[size];
|
|
112
|
+
|
|
113
|
+
case 'xl':
|
|
114
|
+
return xlWidthOptions[size];
|
|
115
|
+
|
|
116
|
+
default:
|
|
117
|
+
return widthOptions[size];
|
|
118
|
+
}
|
|
70
119
|
};
|
|
71
120
|
|
|
72
121
|
const classList = (0, _classnames.default)({
|
|
73
122
|
[columnProps === null || columnProps === void 0 ? void 0 : columnProps.classes]: columnProps === null || columnProps === void 0 ? void 0 : columnProps.classes,
|
|
74
|
-
[
|
|
75
|
-
[
|
|
76
|
-
[
|
|
77
|
-
[
|
|
123
|
+
[calculateWidth('sm', columnProps === null || columnProps === void 0 ? void 0 : columnProps.sm)]: columnProps === null || columnProps === void 0 ? void 0 : columnProps.sm,
|
|
124
|
+
[calculateWidth('md', columnProps === null || columnProps === void 0 ? void 0 : columnProps.md)]: columnProps === null || columnProps === void 0 ? void 0 : columnProps.md,
|
|
125
|
+
[calculateWidth('lg', columnProps === null || columnProps === void 0 ? void 0 : columnProps.lg)]: columnProps === null || columnProps === void 0 ? void 0 : columnProps.lg,
|
|
126
|
+
[calculateWidth('xl', columnProps === null || columnProps === void 0 ? void 0 : columnProps.xl)]: columnProps === null || columnProps === void 0 ? void 0 : columnProps.xl
|
|
78
127
|
}, 'h-full');
|
|
79
128
|
return /*#__PURE__*/_react.default.createElement("div", _extends({}, (columnProps === null || columnProps === void 0 ? void 0 : columnProps.id) && {
|
|
80
129
|
id: columnProps === null || columnProps === void 0 ? void 0 : columnProps.id
|
|
@@ -0,0 +1,62 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
require("core-js/modules/web.dom-collections.iterator.js");
|
|
4
|
+
|
|
5
|
+
Object.defineProperty(exports, "__esModule", {
|
|
6
|
+
value: true
|
|
7
|
+
});
|
|
8
|
+
exports.default = void 0;
|
|
9
|
+
|
|
10
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
11
|
+
|
|
12
|
+
var _Icon = _interopRequireDefault(require("../Icon"));
|
|
13
|
+
|
|
14
|
+
var _Column = _interopRequireDefault(require("../Column"));
|
|
15
|
+
|
|
16
|
+
var _classnames = _interopRequireDefault(require("classnames"));
|
|
17
|
+
|
|
18
|
+
require("../index.css");
|
|
19
|
+
|
|
20
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
21
|
+
|
|
22
|
+
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); }
|
|
23
|
+
|
|
24
|
+
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; }
|
|
25
|
+
|
|
26
|
+
const Nav = _ref => {
|
|
27
|
+
let {
|
|
28
|
+
id,
|
|
29
|
+
classes,
|
|
30
|
+
items,
|
|
31
|
+
barHeight,
|
|
32
|
+
bgColor
|
|
33
|
+
} = _ref;
|
|
34
|
+
const footerBarHeight = barHeight ? barHeight : 'h-full';
|
|
35
|
+
const classList = (0, _classnames.default)({
|
|
36
|
+
[classes]: classes,
|
|
37
|
+
[bgColor]: bgColor,
|
|
38
|
+
'bg-white': !bgColor
|
|
39
|
+
}, footerBarHeight, 'flex flex-wrap items-center');
|
|
40
|
+
return /*#__PURE__*/_react.default.createElement("div", {
|
|
41
|
+
id: id,
|
|
42
|
+
className: classList
|
|
43
|
+
}, items && items.map((item, i) => {
|
|
44
|
+
const columnClassList = (0, _classnames.default)({
|
|
45
|
+
[item === null || item === void 0 ? void 0 : item.columnClasses]: item === null || item === void 0 ? void 0 : item.columnClasses
|
|
46
|
+
}, 'text-center md:text-left');
|
|
47
|
+
return /*#__PURE__*/_react.default.createElement(_Column.default, {
|
|
48
|
+
key: "row_item_1.".concat(i),
|
|
49
|
+
columnProps: {
|
|
50
|
+
classes: columnClassList,
|
|
51
|
+
sm: item.smColumnWidth,
|
|
52
|
+
md: item.mdColumnWidth,
|
|
53
|
+
lg: item.lgColumnWidth,
|
|
54
|
+
xl: item.xlColumnWidth
|
|
55
|
+
},
|
|
56
|
+
children: item.component
|
|
57
|
+
});
|
|
58
|
+
}));
|
|
59
|
+
};
|
|
60
|
+
|
|
61
|
+
var _default = Nav;
|
|
62
|
+
exports.default = _default;
|
|
@@ -52,12 +52,10 @@ const Nav = _ref => {
|
|
|
52
52
|
borderBottom,
|
|
53
53
|
borderBottomColor,
|
|
54
54
|
closeMobileIconProps,
|
|
55
|
-
rowHeight
|
|
56
|
-
showDesktopNavOnScreenSize
|
|
55
|
+
rowHeight
|
|
57
56
|
} = _ref;
|
|
58
57
|
const [showSideNav, setShowSideNav] = (0, _react.useState)(false);
|
|
59
58
|
const [showDropdownNav, setShowDropdownNav] = (0, _react.useState)(false);
|
|
60
|
-
const size = showDesktopNavOnScreenSize ? "".concat(showDesktopNavOnScreenSize, ":") : 'sm:';
|
|
61
59
|
const navRowHeight = rowHeight ? rowHeight : 'h-16';
|
|
62
60
|
const firstRowClassList = (0, _classnames.default)({
|
|
63
61
|
[firstRowClasses]: firstRowClasses
|
|
@@ -83,14 +81,14 @@ const Nav = _ref => {
|
|
|
83
81
|
'bg-white': !mobileBgColor,
|
|
84
82
|
'w-0': !showSideNav,
|
|
85
83
|
["w-".concat(sideBarWidth)]: showSideNav
|
|
86
|
-
}, "z-50 shadow-inner shaddow-lg
|
|
84
|
+
}, "z-50 shadow-inner shaddow-lg md:hidden pt-20 \n fixed top-0 left-0 z-1 overflow-hidden h-full\n duration-700");
|
|
87
85
|
const dropdownNavClasses = (0, _classnames.default)({
|
|
88
86
|
[mobileBgColor]: mobileBgColor,
|
|
89
87
|
[bgColor]: !mobileBgColor && bgColor,
|
|
90
88
|
'bg-white': !mobileBgColor && !bgColor,
|
|
91
89
|
'h-0': !showDropdownNav,
|
|
92
90
|
["h-".concat(dropdownNavHeight)]: showDropdownNav
|
|
93
|
-
}, "z-50
|
|
91
|
+
}, "z-50 md:hidden duration-500 overflow-hidden");
|
|
94
92
|
const logoImageClassList = (0, _classnames.default)({
|
|
95
93
|
[mobileLogoBannerClasses]: mobileLogoBannerClasses
|
|
96
94
|
}, 'h-16 w-auto');
|
|
@@ -98,7 +96,7 @@ const Nav = _ref => {
|
|
|
98
96
|
'fixed w-full z-50 top-0 mt-0': fixedTop,
|
|
99
97
|
'border-b': borderBottom,
|
|
100
98
|
[mobileClasses]: mobileClasses
|
|
101
|
-
}, "flex items-center
|
|
99
|
+
}, "flex items-center md:hidden py-2");
|
|
102
100
|
const colors = (0, _classnames.default)({
|
|
103
101
|
[bgColor]: bgColor,
|
|
104
102
|
'bg-blue': !bgColor,
|
|
@@ -108,7 +106,7 @@ const Nav = _ref => {
|
|
|
108
106
|
const desktopClassList = (0, _classnames.default)({
|
|
109
107
|
'fixed w-full z-50 top-0 mt-0': fixedTop,
|
|
110
108
|
'border-b': borderBottom
|
|
111
|
-
}, "hidden
|
|
109
|
+
}, "hidden md:block items-center justify-between sm:items-stretch text-center");
|
|
112
110
|
return /*#__PURE__*/_react.default.createElement("nav", {
|
|
113
111
|
id: id,
|
|
114
112
|
className: classes
|
package/dist/index.js
CHANGED
|
@@ -81,6 +81,12 @@ Object.defineProperty(exports, "Column", {
|
|
|
81
81
|
return _Column.default;
|
|
82
82
|
}
|
|
83
83
|
});
|
|
84
|
+
Object.defineProperty(exports, "FooterBar", {
|
|
85
|
+
enumerable: true,
|
|
86
|
+
get: function get() {
|
|
87
|
+
return _FooterBar.default;
|
|
88
|
+
}
|
|
89
|
+
});
|
|
84
90
|
Object.defineProperty(exports, "Form", {
|
|
85
91
|
enumerable: true,
|
|
86
92
|
get: function get() {
|
|
@@ -254,6 +260,8 @@ var _Column = _interopRequireDefault(require("./components/Column"));
|
|
|
254
260
|
|
|
255
261
|
var _Form = _interopRequireDefault(require("./components/Form"));
|
|
256
262
|
|
|
263
|
+
var _FooterBar = _interopRequireDefault(require("./components/FooterBar"));
|
|
264
|
+
|
|
257
265
|
var _FyreCard = _interopRequireDefault(require("./components/FyreCard"));
|
|
258
266
|
|
|
259
267
|
var _Icon = _interopRequireDefault(require("./components/Icon"));
|