trepur_components 1.0.41 → 1.0.43
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.
- package/dist/src/lib/components/CarouselThumbnail/CarouselThumbnail.js +1 -7
- package/dist/src/lib/components/CarouselThumbnail/CarouselThumbnail.js.map +1 -1
- package/dist/src/lib/components/FileUploader/FilePreview.d.ts +10 -0
- package/dist/src/lib/components/FileUploader/FilePreview.js +12 -0
- package/dist/src/lib/components/FileUploader/FilePreview.js.map +1 -0
- package/dist/src/lib/components/FileUploader/FileUploader.d.ts +12 -0
- package/dist/src/lib/components/FileUploader/FileUploader.js +58 -0
- package/dist/src/lib/components/FileUploader/FileUploader.js.map +1 -0
- package/dist/src/lib/components/FileUploader/style.module.css +92 -0
- package/dist/src/lib/components/FileUploader/style.module.css.map +1 -0
- package/dist/src/lib/components/Form/Form.d.ts +1 -2
- package/dist/src/lib/components/Form/Form.js +7 -7
- package/dist/src/lib/components/Form/Form.js.map +1 -1
- package/dist/src/lib/components/Form/style.module.css +1 -3
- package/dist/src/lib/components/Form/style.module.css.map +1 -1
- package/dist/src/lib/components/Input/Input.d.ts +2 -5
- package/dist/src/lib/components/Input/Input.js +16 -16
- package/dist/src/lib/components/Input/Input.js.map +1 -1
- package/dist/src/lib/components/Input/style.module.css +43 -71
- package/dist/src/lib/components/Input/style.module.css.map +1 -1
- package/dist/src/lib/components/Nav/Nav.js +9 -6
- package/dist/src/lib/components/Nav/Nav.js.map +1 -1
- package/dist/src/lib/components/Select/Select.d.ts +13 -0
- package/dist/src/lib/components/Select/Select.js +30 -0
- package/dist/src/lib/components/Select/Select.js.map +1 -0
- package/dist/src/lib/components/Select/style.module.css +137 -0
- package/dist/src/lib/components/Select/style.module.css.map +1 -0
- package/dist/src/lib/components/SocialBlock/SocialBlock.d.ts +1 -6
- package/dist/src/lib/components/SocialBlock/SocialBlock.js +3 -3
- package/dist/src/lib/components/SocialBlock/SocialBlock.js.map +1 -1
- package/dist/src/lib/components/TextAndTitle/TextAndTitle.js +4 -11
- package/dist/src/lib/components/TextAndTitle/TextAndTitle.js.map +1 -1
- package/dist/src/lib/components/TextArea/TextArea.d.ts +3 -7
- package/dist/src/lib/components/TextArea/TextArea.js +17 -14
- package/dist/src/lib/components/TextArea/TextArea.js.map +1 -1
- package/dist/src/lib/components/TextArea/style.module.css +34 -76
- package/dist/src/lib/components/TextArea/style.module.css.map +1 -1
- package/dist/src/lib/utils/controls.d.ts +16 -1
- package/dist/src/lib/utils/controls.js +11 -0
- package/dist/src/lib/utils/controls.js.map +1 -1
- package/package.json +1 -1
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import React
|
|
1
|
+
import React from 'react';
|
|
2
2
|
import 'keen-slider/keen-slider.min.css';
|
|
3
3
|
import { useKeenSlider } from 'keen-slider/react';
|
|
4
4
|
import classNames from 'classnames';
|
|
@@ -7,8 +7,6 @@ import ComponentWrapper from '../ComponentWrapper/ComponentWrapper';
|
|
|
7
7
|
import screens from '../../utils/screens';
|
|
8
8
|
const CarouselThumbnail = ({ id, className, slideWrapperClassName, title, description, bgColour, breakpoints, defaultAnimation, disabled, drag, dragSpeed, initial, loop = true, mode = 'snap', range, renderMode, rtl, rubberband, slides, vertical, animationStarted, animationStopped, animationEnded, created, destroyed, detailsChanged, dragged, dragStarted, dragChecked, dragEnded, beforeOptionsChanged, optionsChanged, slideChanged, updated, spacing, number, origin, theme = 'theme-rupertbennett' }) => {
|
|
9
9
|
const classList = classNames(className);
|
|
10
|
-
const [currentSlide, setCurrentSlide] = useState(0);
|
|
11
|
-
const [loaded, setLoaded] = useState(false);
|
|
12
10
|
function WheelControls(slider) {
|
|
13
11
|
let touchTimeout;
|
|
14
12
|
let position;
|
|
@@ -123,12 +121,8 @@ const CarouselThumbnail = ({ id, className, slideWrapperClassName, title, descri
|
|
|
123
121
|
if (((_b = (_a = slider.slides[slider.track.details.rel]) === null || _a === void 0 ? void 0 : _a.firstChild) === null || _b === void 0 ? void 0 : _b.nodeName) === 'DIV') {
|
|
124
122
|
offset = 1;
|
|
125
123
|
}
|
|
126
|
-
setCurrentSlide(slider.track.details.rel + offset);
|
|
127
124
|
},
|
|
128
125
|
// slideChanged: slideChanged,
|
|
129
|
-
created() {
|
|
130
|
-
setLoaded(true);
|
|
131
|
-
},
|
|
132
126
|
// created: created,
|
|
133
127
|
animationStarted,
|
|
134
128
|
animationStopped,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CarouselThumbnail.js","sourceRoot":"","sources":["../../../../../src/lib/components/CarouselThumbnail/CarouselThumbnail.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"CarouselThumbnail.js","sourceRoot":"","sources":["../../../../../src/lib/components/CarouselThumbnail/CarouselThumbnail.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import classNames from 'classnames';
|
|
3
|
+
import style from './style.module.css';
|
|
4
|
+
const FileUploader = ({ id, className, fileData, theme = 'theme-letsgocamping' }) => {
|
|
5
|
+
return (React.createElement("div", { id: id, className: classNames(className, style.fileContainer, theme) }, fileData === null || fileData === void 0 ? void 0 : fileData.map((file, i) => {
|
|
6
|
+
return (React.createElement("ol", { key: `key_${i}` },
|
|
7
|
+
React.createElement("li", { key: file.lastModified, className: classNames(style.fileList, theme) },
|
|
8
|
+
React.createElement("div", { key: file.name, className: classNames(style.fileName, theme) }, file.name))));
|
|
9
|
+
})));
|
|
10
|
+
};
|
|
11
|
+
export default FileUploader;
|
|
12
|
+
//# sourceMappingURL=FilePreview.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"FilePreview.js","sourceRoot":"","sources":["../../../../../src/lib/components/FileUploader/FilePreview.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,UAAU,MAAM,YAAY,CAAA;AACnC,OAAO,KAAK,MAAM,oBAAoB,CAAA;AAUtC,MAAM,YAAY,GAAoB,CAAC,EACrC,EAAE,EACF,SAAS,EACT,QAAQ,EACR,KAAK,GAAG,qBAAqB,EAC9B,EAAE,EAAE;IACH,OAAO,CACL,6BAAK,EAAE,EAAE,EAAE,EAAE,SAAS,EAAE,UAAU,CAAC,SAAS,EAAE,KAAK,CAAC,aAAa,EAAE,KAAK,CAAC,IACtE,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAE,GAAG,CAAC,CAAC,IAAS,EAAE,CAAS,EAAE,EAAE;QACtC,OAAO,CACL,4BAAI,GAAG,EAAE,OAAO,CAAC,EAAE;YACjB,4BAAI,GAAG,EAAE,IAAI,CAAC,YAAY,EAAE,SAAS,EAAE,UAAU,CAAC,KAAK,CAAC,QAAQ,EAAE,KAAK,CAAC;gBACtE,6BAAK,GAAG,EAAE,IAAI,CAAC,IAAI,EAAE,SAAS,EAAE,UAAU,CAAC,KAAK,CAAC,QAAQ,EAAE,KAAK,CAAC,IAC9D,IAAI,CAAC,IAAI,CACN,CACH,CACF,CACN,CAAA;IACH,CAAC,CAAC,CACE,CACP,CAAA;AACH,CAAC,CAAA;AAED,eAAe,YAAY,CAAA"}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { ThemeTypes } from '../../utils/controls';
|
|
3
|
+
interface Props {
|
|
4
|
+
id?: string;
|
|
5
|
+
className?: string;
|
|
6
|
+
data?: any;
|
|
7
|
+
theme?: ThemeTypes;
|
|
8
|
+
imageUrl?: string;
|
|
9
|
+
onDrop?: ([]: Iterable<any>) => void;
|
|
10
|
+
}
|
|
11
|
+
declare const FileUploader: React.FC<Props>;
|
|
12
|
+
export default FileUploader;
|
|
@@ -0,0 +1,58 @@
|
|
|
1
|
+
import React, { useState } from 'react';
|
|
2
|
+
import classNames from 'classnames';
|
|
3
|
+
import FilePreview from './FilePreview';
|
|
4
|
+
import style from './style.module.css';
|
|
5
|
+
import Image from '../Image/Image';
|
|
6
|
+
const FileUploader = ({ id, className, data, theme = 'theme-letsgocamping', imageUrl, onDrop }) => {
|
|
7
|
+
const [inDropZone, setInDropZone] = useState(false);
|
|
8
|
+
const [fileList, setFileList] = useState([]);
|
|
9
|
+
const handleDragEnter = (e) => {
|
|
10
|
+
e.preventDefault();
|
|
11
|
+
e.stopPropagation();
|
|
12
|
+
setInDropZone(true);
|
|
13
|
+
};
|
|
14
|
+
const handleDragLeave = (e) => {
|
|
15
|
+
e.preventDefault();
|
|
16
|
+
e.stopPropagation();
|
|
17
|
+
setInDropZone(false);
|
|
18
|
+
};
|
|
19
|
+
const handleDragOver = (e) => {
|
|
20
|
+
e.preventDefault();
|
|
21
|
+
e.stopPropagation();
|
|
22
|
+
e.dataTransfer.dropEffect = 'copy';
|
|
23
|
+
setInDropZone(true);
|
|
24
|
+
};
|
|
25
|
+
const handleDrop = (e) => {
|
|
26
|
+
var _a;
|
|
27
|
+
e.preventDefault();
|
|
28
|
+
e.stopPropagation();
|
|
29
|
+
let files = [...e.dataTransfer.files];
|
|
30
|
+
if ((files === null || files === void 0 ? void 0 : files.length) > 0) {
|
|
31
|
+
const existingFiles = (_a = fileList === null || fileList === void 0 ? void 0 : fileList.fileList) === null || _a === void 0 ? void 0 : _a.map((f) => f.name);
|
|
32
|
+
files = files.filter((f) => !(existingFiles === null || existingFiles === void 0 ? void 0 : existingFiles.includes(f.name)));
|
|
33
|
+
setFileList(files);
|
|
34
|
+
setInDropZone(false);
|
|
35
|
+
}
|
|
36
|
+
onDrop === null || onDrop === void 0 ? void 0 : onDrop(files);
|
|
37
|
+
};
|
|
38
|
+
const handleFileSelect = (e) => {
|
|
39
|
+
var _a;
|
|
40
|
+
let files = [...e.target.files];
|
|
41
|
+
if ((files === null || files === void 0 ? void 0 : files.length) > 0) {
|
|
42
|
+
const existingFiles = (_a = fileList === null || fileList === void 0 ? void 0 : fileList.fileList) === null || _a === void 0 ? void 0 : _a.map((f) => f.name);
|
|
43
|
+
files = files.filter((f) => !(existingFiles === null || existingFiles === void 0 ? void 0 : existingFiles.includes(f.name)));
|
|
44
|
+
setFileList(files);
|
|
45
|
+
console.log({ files });
|
|
46
|
+
onDrop === null || onDrop === void 0 ? void 0 : onDrop(files);
|
|
47
|
+
}
|
|
48
|
+
};
|
|
49
|
+
return (React.createElement("div", { id: id, className: classNames({ [style.inDropZone]: inDropZone }, className, style.dropzone, theme), onDragEnter: (e) => handleDragEnter(e), onDragOver: (e) => handleDragOver(e), onDragLeave: (e) => handleDragLeave(e), onDrop: (e) => handleDrop(e) },
|
|
50
|
+
imageUrl &&
|
|
51
|
+
React.createElement(Image, { src: imageUrl, altText: 'upload', height: 5, width: 5 }),
|
|
52
|
+
React.createElement("input", { id: 'fileSelect', type: 'file', multiple: true, className: classNames(style.files, theme), onChange: (e) => handleFileSelect(e) }),
|
|
53
|
+
React.createElement("label", { htmlFor: 'fileSelect' }, "You can select multiple Files"),
|
|
54
|
+
React.createElement("h3", { className: classNames(style.uploadMessage, theme) }, "or drag & drop your files here"),
|
|
55
|
+
React.createElement(FilePreview, { fileData: fileList })));
|
|
56
|
+
};
|
|
57
|
+
export default FileUploader;
|
|
58
|
+
//# sourceMappingURL=FileUploader.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"FileUploader.js","sourceRoot":"","sources":["../../../../../src/lib/components/FileUploader/FileUploader.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,92 @@
|
|
|
1
|
+
.dropzone {
|
|
2
|
+
display: flex;
|
|
3
|
+
flex-direction: column;
|
|
4
|
+
align-items: center;
|
|
5
|
+
justify-content: center;
|
|
6
|
+
border-radius: 1rem;
|
|
7
|
+
border-width: 4px;
|
|
8
|
+
border-style: dashed;
|
|
9
|
+
border-color: var(--color-light-grey);
|
|
10
|
+
padding-top: 2rem;
|
|
11
|
+
padding-bottom: 2rem;
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
.active {
|
|
15
|
+
border-width: 4px;
|
|
16
|
+
border-style: dashed;
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
.uploadMessage h3 {
|
|
20
|
+
margin-top: 2rem;
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
.files {
|
|
24
|
+
position: absolute;
|
|
25
|
+
height: 1px;
|
|
26
|
+
width: 1px;
|
|
27
|
+
overflow: hidden;
|
|
28
|
+
border-style: none;
|
|
29
|
+
padding: 0px;
|
|
30
|
+
white-space: nowrap;
|
|
31
|
+
clip: rect(0, 0, 0, 0);
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
.files + label {
|
|
35
|
+
margin-top: 1rem;
|
|
36
|
+
margin-bottom: 0.5rem;
|
|
37
|
+
display: inline-block;
|
|
38
|
+
cursor: pointer;
|
|
39
|
+
text-align: center;
|
|
40
|
+
background-color: #0d6efd;
|
|
41
|
+
border-radius: 4rem;
|
|
42
|
+
color: #fff;
|
|
43
|
+
padding: 0.25rem 0.75rem;
|
|
44
|
+
-webkit-user-select: none;
|
|
45
|
+
user-select: none;
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
.files + label:focus,
|
|
49
|
+
.files + label:hover {
|
|
50
|
+
background-color: #0a58ca;
|
|
51
|
+
color: #fff;
|
|
52
|
+
}
|
|
53
|
+
|
|
54
|
+
.files + label:focus {
|
|
55
|
+
outline: 1px dotted #fff;
|
|
56
|
+
}
|
|
57
|
+
|
|
58
|
+
.uploadBtn {
|
|
59
|
+
margin: 0.5rem;
|
|
60
|
+
width: auto;
|
|
61
|
+
cursor: pointer;
|
|
62
|
+
border-radius: 1rem;
|
|
63
|
+
background-color: var(--color-primary);
|
|
64
|
+
text-align: center;
|
|
65
|
+
text-transform: uppercase;
|
|
66
|
+
color: var(--color-white);
|
|
67
|
+
}
|
|
68
|
+
|
|
69
|
+
.fileList {
|
|
70
|
+
margin-top: 0.25rem;
|
|
71
|
+
display: flex;
|
|
72
|
+
gap: 1rem;
|
|
73
|
+
width: 400px;
|
|
74
|
+
}
|
|
75
|
+
|
|
76
|
+
.fileContainer {
|
|
77
|
+
flex-direction: column;
|
|
78
|
+
align-items: center;
|
|
79
|
+
margin-top: 0.25rem;
|
|
80
|
+
display: flex;
|
|
81
|
+
gap: 1rem;
|
|
82
|
+
width: 400px;
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
.fileName {
|
|
86
|
+
margin-left: 0.5rem;
|
|
87
|
+
}
|
|
88
|
+
|
|
89
|
+
.inDropZone {
|
|
90
|
+
background-color: var(--color-lightest-grey);
|
|
91
|
+
}
|
|
92
|
+
/*# sourceMappingURL=style.module.css.map */
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../../../src/lib/components/FileUploader/style.module.css"],"names":[],"mappings":"AACI;IAAA,aAAgD;IAAhD,sBAAgD;IAAhD,mBAAgD;IAAhD,uBAAgD;IAChD,mBAAgE;IAAhE,iBAAgE;IAAhE,oBAAgE;IAAhE,qCAAgE;IAAhE,iBAAgE;IAAhE;AADgD;;AAKhD;IAAA,iBAA6B;IAA7B;AAA6B;;AAI7B;IAAA;AAAW;;AAIX;IAAA,kBAAyD;IAAzD,WAAyD;IAAzD,UAAyD;IAAzD,gBAAyD;IAAzD,kBAAyD;IAAzD,YAAyD;IACzD,mBAAwB;IACxB;AAFyD;;AAMzD;IAAA,gBAAwD;IAAxD,qBAAwD;IAAxD,qBAAwD;IAAxD,eAAwD;IAAxD,kBAAwD;IACxD,yBAAyB;IACzB,mBAAmB;IACnB,WAAW;IACX,wBAAwB;IACxB,yBAAiB;YAAjB;AALwD;;EAQ1D;;IAEE,yBAAyB;IACzB,WAAW;EACb;;EAEA;IACE,wBAAwB;EAC1B;;AAGE;IAAA,cAAwF;IAAxF,WAAwF;IAAxF,eAAwF;IAAxF,mBAAwF;IAAxF,sCAAwF;IAAxF,kBAAwF;IAAxF,yBAAwF;IAAxF;AAAwF;;AAI1F;IAAA,mBAAgB;IAAhB,aAAgB;EAChB,SAAS;EACT;AAFgB;;AAMhB;IAAA,sBAA4B;IAA5B,mBAA4B;IAC5B,mBAAgB;IAAhB,aAAgB;EAChB,SAAS;EACT;AAH4B;;AAO5B;IAAA;AAAW;;AAIX;IAAA;AAAuB","file":"style.module.css","sourcesContent":[".dropzone {\n @apply flex flex-col justify-center items-center;\n @apply border-4 border-dashed border-light-grey rounded-2xl py-8;\n}\n\n.active {\n @apply border-4 border-dashed;\n}\n\n.uploadMessage h3 {\n @apply mt-8;\n}\n \n.files {\n @apply border-none h-px overflow-hidden p-0 absolute w-px;\n @apply whitespace-nowrap;\n clip: rect(0, 0, 0, 0);\n}\n \n.files + label {\n @apply mt-4 mb-2 cursor-pointer inline-block text-center;\n background-color: #0d6efd;\n border-radius: 4rem;\n color: #fff;\n padding: 0.25rem 0.75rem;\n user-select: none;\n}\n \n .files + label:focus,\n .files + label:hover {\n background-color: #0a58ca;\n color: #fff;\n }\n \n .files + label:focus {\n outline: 1px dotted #fff;\n }\n \n.uploadBtn {\n @apply w-auto text-white uppercase m-2 bg-primary rounded-2xl cursor-pointer text-center;\n}\n\n.fileList {\n @apply flex mt-1;\n gap: 1rem;\n width: 400px;\n}\n\n.fileContainer {\n @apply flex-col items-center;\n @apply flex mt-1;\n gap: 1rem;\n width: 400px;\n}\n\n.fileName {\n @apply ml-2;\n}\n\n.inDropZone {\n @apply bg-lightest-grey;\n}"]}
|
|
@@ -5,7 +5,6 @@ import { ThemeTypes } from '../../utils/controls';
|
|
|
5
5
|
export interface Props {
|
|
6
6
|
id?: string;
|
|
7
7
|
className?: string;
|
|
8
|
-
title?: string;
|
|
9
8
|
onSubmit?: () => void;
|
|
10
9
|
ref?: string;
|
|
11
10
|
components?: Array<inputProps & buttonProps & {
|
|
@@ -13,5 +12,5 @@ export interface Props {
|
|
|
13
12
|
}>;
|
|
14
13
|
theme?: ThemeTypes;
|
|
15
14
|
}
|
|
16
|
-
declare const Form: ({ id, className,
|
|
15
|
+
declare const Form: ({ id, className, onSubmit, ref, components, theme }: Props) => JSX.Element;
|
|
17
16
|
export default Form;
|
|
@@ -1,16 +1,16 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import Button from '../Button/Button';
|
|
3
3
|
import Input from '../Input/Input';
|
|
4
|
-
import
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
React.createElement("form", { id: id, ref: ref, className: className, onSubmit: onSubmit }, components === null || components === void 0 ? void 0 : components.map((component, i) => {
|
|
4
|
+
import classNames from 'classnames';
|
|
5
|
+
import Container from '../Container/Container';
|
|
6
|
+
const Form = ({ id, className, onSubmit, ref, components, theme = 'theme-rupertbennett' }) => {
|
|
7
|
+
return (React.createElement(Container, { withPadding: true },
|
|
8
|
+
React.createElement("form", { id: id, ref: ref, className: classNames(className, theme), onSubmit: onSubmit }, components === null || components === void 0 ? void 0 : components.map((component, i) => {
|
|
9
9
|
if ((component === null || component === void 0 ? void 0 : component.htmlType) === 'Input') {
|
|
10
|
-
return (React.createElement(Input, { key: `input_${i + 0}`, className: component === null || component === void 0 ? void 0 : component.className, label: component === null || component === void 0 ? void 0 : component.label, placeholder: component === null || component === void 0 ? void 0 : component.placeholder, type: component === null || component === void 0 ? void 0 : component.type, name: component === null || component === void 0 ? void 0 : component.name }));
|
|
10
|
+
return (React.createElement(Input, { key: `input_${i + 0}`, className: classNames(component === null || component === void 0 ? void 0 : component.className, theme), label: component === null || component === void 0 ? void 0 : component.label, placeholder: component === null || component === void 0 ? void 0 : component.placeholder, type: component === null || component === void 0 ? void 0 : component.type, name: component === null || component === void 0 ? void 0 : component.name, fullWidth: true }));
|
|
11
11
|
}
|
|
12
12
|
else if (component.htmlType === 'Button') {
|
|
13
|
-
return (React.createElement(Button, { key: `button_${i + 0}`, type: component === null || component === void 0 ? void 0 : component.type, onClick: component === null || component === void 0 ? void 0 : component.onClick, className: component === null || component === void 0 ? void 0 : component.className }, component === null || component === void 0 ? void 0 : component.children));
|
|
13
|
+
return (React.createElement(Button, { key: `button_${i + 0}`, type: component === null || component === void 0 ? void 0 : component.type, onClick: component === null || component === void 0 ? void 0 : component.onClick, className: classNames(component === null || component === void 0 ? void 0 : component.className, theme) }, component === null || component === void 0 ? void 0 : component.children));
|
|
14
14
|
}
|
|
15
15
|
else
|
|
16
16
|
return React.createElement(React.Fragment, null);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Form.js","sourceRoot":"","sources":["../../../../../src/lib/components/Form/Form.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,MAAgC,MAAM,2BAA2B,CAAA;AACxE,OAAO,KAA8B,MAAM,yBAAyB,CAAA;
|
|
1
|
+
{"version":3,"file":"Form.js","sourceRoot":"","sources":["../../../../../src/lib/components/Form/Form.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,MAAgC,MAAM,2BAA2B,CAAA;AACxE,OAAO,KAA8B,MAAM,yBAAyB,CAAA;AAEpE,OAAO,UAAU,MAAM,YAAY,CAAA;AACnC,OAAO,SAAS,MAAM,iCAAiC,CAAA;AAWvD,MAAM,IAAI,GAAG,CAAC,EACZ,EAAE,EACF,SAAS,EACT,QAAQ,EACR,GAAG,EACH,UAAU,EACV,KAAK,GAAG,qBAAqB,EACvB,EAAe,EAAE;IACvB,OAAO,CACL,oBAAC,SAAS,IAAC,WAAW;QACpB,8BAAM,EAAE,EAAE,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,UAAU,CAAC,SAAS,EAAE,KAAK,CAAC,EAAE,QAAQ,EAAE,QAAQ,IAChF,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,GAAG,CAAC,CAAC,SAAS,EAAE,CAAC,EAAE,EAAE;YAChC,IAAI,CAAA,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,QAAQ,MAAK,OAAO,EAAE;gBACnC,OAAO,CACL,oBAAC,KAAK,IACJ,GAAG,EAAE,SAAS,CAAC,GAAG,CAAC,EAAE,EACrB,SAAS,EAAE,UAAU,CAAC,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,SAAS,EAAE,KAAK,CAAC,EAClD,KAAK,EAAE,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,KAAK,EACvB,WAAW,EAAE,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,WAAW,EACnC,IAAI,EAAE,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,IAAI,EACrB,IAAI,EAAE,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,IAAI,EACrB,SAAS,SACT,CACH,CAAA;aACF;iBAAM,IAAI,SAAS,CAAC,QAAQ,KAAK,QAAQ,EAAE;gBAC1C,OAAO,CACL,oBAAC,MAAM,IACL,GAAG,EAAE,UAAU,CAAC,GAAG,CAAC,EAAE,EACtB,IAAI,EAAE,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,IAAI,EACrB,OAAO,EAAE,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,OAAO,EAC3B,SAAS,EAAE,UAAU,CAAC,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,SAAS,EAAE,KAAK,CAAC,IAEjD,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,QAAQ,CACb,CACV,CAAA;aACF;;gBAAM,OAAO,yCAAK,CAAA;QACrB,CAAC,CAAC,CACG,CACG,CACb,CAAA;AACH,CAAC,CAAA;AAED,eAAe,IAAI,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":[
|
|
1
|
+
{"version":3,"sources":[],"names":[],"mappings":"","file":"style.module.css"}
|
|
@@ -3,8 +3,6 @@ import { Colours, ThemeTypes } from '../../utils/controls';
|
|
|
3
3
|
export interface Props {
|
|
4
4
|
id?: string;
|
|
5
5
|
className?: string;
|
|
6
|
-
labelClasses?: string;
|
|
7
|
-
inputClasses?: string;
|
|
8
6
|
autoComplete?: string;
|
|
9
7
|
disabled?: boolean;
|
|
10
8
|
formId?: string;
|
|
@@ -19,8 +17,6 @@ export interface Props {
|
|
|
19
17
|
name?: string;
|
|
20
18
|
placeholder?: string;
|
|
21
19
|
withValidation?: boolean;
|
|
22
|
-
bold?: boolean;
|
|
23
|
-
autoFocus?: boolean;
|
|
24
20
|
onChange?: (e: any) => void;
|
|
25
21
|
onBlur?: () => void;
|
|
26
22
|
onFocus?: () => void;
|
|
@@ -29,6 +25,7 @@ export interface Props {
|
|
|
29
25
|
value?: string;
|
|
30
26
|
bgColour?: Colours;
|
|
31
27
|
theme?: ThemeTypes;
|
|
28
|
+
fullWidth?: boolean;
|
|
32
29
|
}
|
|
33
|
-
declare const Input: ({ id, className,
|
|
30
|
+
declare const Input: ({ id, className, autoComplete, disabled, formId, height, maxLength, minLength, pattern, required, readOnly, label, type, name, placeholder, onChange, onBlur, onFocus, onClick, withValidation, errors, value, fullWidth, theme }: Props) => JSX.Element;
|
|
34
31
|
export default Input;
|
|
@@ -1,24 +1,24 @@
|
|
|
1
|
-
import React from 'react';
|
|
1
|
+
import React, { useRef } from 'react';
|
|
2
2
|
import classNames from 'classnames';
|
|
3
3
|
import style from './style.module.css';
|
|
4
|
-
const Input = ({ id, className,
|
|
5
|
-
const classList = classNames(className, style[bgColour], style.classList, theme);
|
|
6
|
-
const labelClassList = classNames({
|
|
7
|
-
[style.bold]: bold
|
|
8
|
-
}, labelClasses, [style.labelClassList]);
|
|
9
|
-
const inputClassList = classNames({}, inputClasses, style[bgColour], style.inputClassList);
|
|
4
|
+
const Input = ({ id, className, autoComplete, disabled, formId, height, maxLength, minLength, pattern, required, readOnly, label, type, name, placeholder, onChange, onBlur, onFocus, onClick, withValidation, errors, value, fullWidth = false, theme = 'theme-rupertbennett' }) => {
|
|
10
5
|
const newId = id !== undefined ? `-${id}` : '';
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
6
|
+
const fullWidthClasses = classNames({
|
|
7
|
+
[style.fullWidth]: fullWidth,
|
|
8
|
+
[style.notFullWidth]: !fullWidth
|
|
9
|
+
});
|
|
10
|
+
const headerClassList = classNames(fullWidthClasses, style.classList, className, theme);
|
|
11
|
+
const btnRef = useRef(null);
|
|
12
|
+
const handleClick = () => {
|
|
13
|
+
var _a;
|
|
14
|
+
(_a = btnRef.current) === null || _a === void 0 ? void 0 : _a.focus();
|
|
15
|
+
};
|
|
16
|
+
return (React.createElement("div", { id: id, className: headerClassList, onClick: handleClick },
|
|
17
|
+
React.createElement("label", { className: style.label }, label),
|
|
18
|
+
React.createElement("input", { ref: btnRef, id: `input${newId}`, className: style.value, autoComplete: autoComplete, disabled: disabled, form: formId, height: height, maxLength: maxLength, minLength: minLength, pattern: pattern, required: required, readOnly: readOnly, type: type, name: name, value: value, placeholder: placeholder, onChange: (e) => onChange === null || onChange === void 0 ? void 0 : onChange(e), onBlur: onBlur, onFocus: onFocus, onClick: onClick }),
|
|
19
19
|
withValidation === true &&
|
|
20
20
|
React.createElement("div", { id: `errors${newId}` }, errors === null || errors === void 0 ? void 0 : errors.map((error, i) => {
|
|
21
|
-
return (React.createElement("p", { key: `
|
|
21
|
+
return (React.createElement("p", { key: `error-msg-${i + 0}`, className: style.errorText }, error));
|
|
22
22
|
}))));
|
|
23
23
|
};
|
|
24
24
|
export default Input;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Input.js","sourceRoot":"","sources":["../../../../../src/lib/components/Input/Input.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"Input.js","sourceRoot":"","sources":["../../../../../src/lib/components/Input/Input.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AACrC,OAAO,UAAU,MAAM,YAAY,CAAA;AACnC,OAAO,KAAK,MAAM,oBAAoB,CAAA;AA+BtC,MAAM,KAAK,GAAG,CAAC,EACb,EAAE,EACF,SAAS,EACT,YAAY,EACZ,QAAQ,EACR,MAAM,EACN,MAAM,EACN,SAAS,EACT,SAAS,EACT,OAAO,EACP,QAAQ,EACR,QAAQ,EACR,KAAK,EACL,IAAI,EACJ,IAAI,EACJ,WAAW,EACX,QAAQ,EACR,MAAM,EACN,OAAO,EACP,OAAO,EACP,cAAc,EACd,MAAM,EACN,KAAK,EACL,SAAS,GAAG,KAAK,EACjB,KAAK,GAAG,qBAAqB,EACvB,EAAe,EAAE;IACvB,MAAM,KAAK,GAAG,EAAE,KAAK,SAAS,CAAC,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC,CAAC,EAAE,CAAA;IAE9C,MAAM,gBAAgB,GAAG,UAAU,CAAC;QAClC,CAAC,KAAK,CAAC,SAAS,CAAC,EAAE,SAAS;QAC5B,CAAC,KAAK,CAAC,YAAY,CAAC,EAAE,CAAC,SAAS;KACjC,CAAC,CAAA;IAEF,MAAM,eAAe,GACnB,UAAU,CAAC,gBAAgB,EAAE,KAAK,CAAC,SAAS,EAAE,SAAS,EAAE,KAAK,CAAC,CAAA;IAEjE,MAAM,MAAM,GAAG,MAAM,CAAM,IAAI,CAAC,CAAA;IAEhC,MAAM,WAAW,GAAG,GAAS,EAAE;;QAC7B,MAAA,MAAM,CAAC,OAAO,0CAAE,KAAK,EAAE,CAAA;IACzB,CAAC,CAAA;IAED,OAAO,CACL,6BACE,EAAE,EAAE,EAAE,EACN,SAAS,EAAE,eAAe,EAC1B,OAAO,EAAE,WAAW;QAEpB,+BAAO,SAAS,EAAE,KAAK,CAAC,KAAK,IAAG,KAAK,CAAS;QAC9C,+BACE,GAAG,EAAE,MAAM,EACX,EAAE,EAAE,QAAQ,KAAK,EAAE,EACnB,SAAS,EAAE,KAAK,CAAC,KAAK,EACtB,YAAY,EAAE,YAAY,EAC1B,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAE,MAAM,EACZ,MAAM,EAAE,MAAM,EACd,SAAS,EAAE,SAAS,EACpB,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAE,IAAI,EACV,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,WAAW,EACxB,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAG,CAAC,CAAC,EAC9B,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,OAAO,EAChB,OAAO,EAAE,OAAO,GAChB;QACD,cAAc,KAAK,IAAI;YACtB,6BAAK,EAAE,EAAE,SAAS,KAAK,EAAE,IACtB,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,GAAG,CAAC,CAAC,KAAK,EAAE,CAAC,EAAE,EAAE;gBACxB,OAAO,CACL,2BACE,GAAG,EAAE,aAAa,CAAC,GAAG,CAAC,EAAE,EACzB,SAAS,EAAE,KAAK,CAAC,SAAS,IAEzB,KAAK,CACJ,CACL,CAAA;YACH,CAAC,CAAC,CACE,CACJ,CACP,CAAA;AACH,CAAC,CAAA;AAED,eAAe,KAAK,CAAA"}
|
|
@@ -1,114 +1,86 @@
|
|
|
1
1
|
.classList {
|
|
2
2
|
|
|
3
|
-
|
|
3
|
+
width: 100%;
|
|
4
4
|
|
|
5
|
-
|
|
6
|
-
}
|
|
7
|
-
|
|
8
|
-
.errorText {
|
|
9
|
-
|
|
10
|
-
font-size: 16px;
|
|
11
|
-
|
|
12
|
-
color: var(--color-red)
|
|
13
|
-
}
|
|
14
|
-
|
|
15
|
-
.required {
|
|
16
|
-
|
|
17
|
-
color: var(--color-red)
|
|
18
|
-
}
|
|
19
|
-
|
|
20
|
-
.inputClassList {
|
|
21
|
-
|
|
22
|
-
border-radius: 0.375rem;
|
|
23
|
-
|
|
24
|
-
border-width: 1px;
|
|
5
|
+
border-radius: 0.75rem;
|
|
25
6
|
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
padding-right: 0.5rem;
|
|
7
|
+
background-color: var(--color-white);
|
|
29
8
|
|
|
30
|
-
|
|
9
|
+
--tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
|
|
31
10
|
|
|
32
|
-
|
|
11
|
+
--tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
|
|
33
12
|
|
|
34
|
-
|
|
13
|
+
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
35
14
|
|
|
36
|
-
|
|
37
|
-
}
|
|
15
|
+
--tw-drop-shadow: drop-shadow(0 1px 2px rgb(0 0 0 / 0.1)) drop-shadow(0 1px 1px rgb(0 0 0 / 0.06));
|
|
38
16
|
|
|
39
|
-
|
|
17
|
+
filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
|
|
40
18
|
|
|
41
|
-
|
|
19
|
+
cursor: pointer
|
|
42
20
|
}
|
|
43
21
|
|
|
44
|
-
.
|
|
22
|
+
/* .classList:active p {
|
|
23
|
+
@apply hidden;
|
|
24
|
+
}
|
|
45
25
|
|
|
46
|
-
|
|
26
|
+
.classList:active .value {
|
|
27
|
+
@apply pt-3 pb-4;
|
|
28
|
+
} */
|
|
47
29
|
|
|
48
|
-
|
|
30
|
+
.fullWidth {
|
|
49
31
|
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
font-size: 16px;
|
|
53
|
-
|
|
54
|
-
font-weight: 400;
|
|
55
|
-
|
|
56
|
-
color: var(--color-ink)
|
|
32
|
+
width: 100%
|
|
57
33
|
}
|
|
58
34
|
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
border-color: var(--color-white);
|
|
35
|
+
@media (min-width: 640px) {
|
|
62
36
|
|
|
63
|
-
|
|
37
|
+
.notFullWidth {
|
|
64
38
|
|
|
65
|
-
|
|
39
|
+
width: 18rem
|
|
40
|
+
}
|
|
66
41
|
}
|
|
67
42
|
|
|
68
|
-
.
|
|
43
|
+
.label {
|
|
69
44
|
|
|
70
|
-
|
|
71
|
-
|
|
45
|
+
position: absolute;
|
|
46
|
+
|
|
47
|
+
margin-left: 1rem;
|
|
72
48
|
|
|
73
|
-
.
|
|
49
|
+
margin-top: 0.5rem;
|
|
74
50
|
|
|
75
|
-
|
|
51
|
+
background-color: var(--color-white);
|
|
76
52
|
|
|
77
|
-
|
|
53
|
+
font-size: 12px;
|
|
78
54
|
|
|
79
|
-
|
|
55
|
+
font-weight: 100
|
|
80
56
|
}
|
|
81
57
|
|
|
82
|
-
.
|
|
58
|
+
.value {
|
|
83
59
|
|
|
84
|
-
|
|
85
|
-
}
|
|
60
|
+
width: 100%;
|
|
86
61
|
|
|
87
|
-
.
|
|
62
|
+
border-radius: 0.75rem;
|
|
88
63
|
|
|
89
64
|
border-color: var(--color-ink);
|
|
90
65
|
|
|
91
66
|
background-color: var(--color-white);
|
|
92
67
|
|
|
93
|
-
|
|
94
|
-
}
|
|
95
|
-
|
|
96
|
-
.white::placeholder {
|
|
68
|
+
padding-top: 1.5rem;
|
|
97
69
|
|
|
98
|
-
|
|
99
|
-
}
|
|
70
|
+
padding-bottom: 0.25rem;
|
|
100
71
|
|
|
101
|
-
|
|
72
|
+
padding-left: 1rem;
|
|
102
73
|
|
|
103
|
-
|
|
74
|
+
color: var(--color-ink);
|
|
104
75
|
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
color: var(--color-white)
|
|
76
|
+
cursor: pointer
|
|
108
77
|
}
|
|
109
78
|
|
|
110
|
-
.
|
|
111
|
-
|
|
112
|
-
color: var(--color-white)
|
|
79
|
+
/* .value:focus {
|
|
80
|
+
@apply pt-3 pb-4;
|
|
113
81
|
}
|
|
82
|
+
|
|
83
|
+
.value:focus ~ label {
|
|
84
|
+
@apply text-xl;
|
|
85
|
+
} */
|
|
114
86
|
/*# sourceMappingURL=style.module.css.map */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../../src/lib/components/Input/style.module.css"],"names":[],"mappings":"AACI;;IAAA,
|
|
1
|
+
{"version":3,"sources":["../../../../../src/lib/components/Input/style.module.css"],"names":[],"mappings":"AACI;;IAAA,WAAiC;;IAAjC,sBAAiC;;IAAjC,oCAAiC;;IACjC,0EAAyB;;IAAzB,8FAAyB;;IAAzB,uGAAyB;;IAAzB,kGAAyB;;IAAzB,iLAAyB;;IACzB;AAFiC;;AAKrC;;;;;;IAMI;;AAGA;;IAAA;AAAa;;AAIb;;IAAA;;QAAA;IAAc;AAAA;;AAId;;IAAA,kBAAoD;;IAApD,iBAAoD;;IAApD,kBAAoD;;IAApD,oCAAoD;;IAApD,eAAoD;;IAApD;AAAoD;;AAIpD;;IAAA,WAAoE;;IAApE,sBAAoE;;IAApE,8BAAoE;;IAApE,oCAAoE;;IAApE,mBAAoE;;IAApE,uBAAoE;;IAApE,kBAAoE;;IAApE,uBAAoE;;IACpE;AADoE;;AAIxE;;;;;;GAMG","file":"style.module.css","sourcesContent":[".classList {\n @apply w-full bg-white rounded-xl;\n @apply drop-shadow shadow;\n @apply cursor-pointer;\n}\n\n/* .classList:active p {\n @apply hidden;\n} \n\n.classList:active .value {\n @apply pt-3 pb-4;\n} */\n\n.fullWidth {\n @apply w-full;\n}\n\n.notFullWidth {\n @apply sm:w-72;\n}\n\n.label {\n @apply ml-4 absolute mt-2 bg-white text-xs font-thin;\n}\n\n.value {\n @apply pt-6 pb-1 pl-4 border-ink rounded-xl text-ink bg-white w-full;\n @apply cursor-pointer;\n}\n\n/* .value:focus {\n @apply pt-3 pb-4;\n}\n\n.value:focus ~ label {\n @apply text-xl;\n} */"]}
|
|
@@ -51,8 +51,9 @@ const Nav = ({ id, className, navLinks, withMobileSideBar = false, withMobileDro
|
|
|
51
51
|
const themeString = theme.toString();
|
|
52
52
|
return (React.createElement("header", { id: id, className: classList },
|
|
53
53
|
React.createElement(Container, { withPadding: true, className: mobileContainer, theme: theme },
|
|
54
|
-
(withMobileSideBar || withMobileDropdown) &&
|
|
55
|
-
React.createElement(
|
|
54
|
+
(withMobileSideBar || withMobileDropdown) &&
|
|
55
|
+
React.createElement("div", { className: style.collapseBtnWrapper },
|
|
56
|
+
React.createElement(HamburgerIcon, { onClick: toggleMenu, theme: theme, variant: variant === 'dark' ? 'primary' : 'secondary' })),
|
|
56
57
|
React.createElement("a", { className: style.mobileLogo, href: logoLink },
|
|
57
58
|
React.createElement(Image, { src: variant === 'dark' ? mobileLogoDarkTheme : mobileLogo, title: `${(_a = themeString.split('-')[1]) !== null && _a !== void 0 ? _a : ''}-mobile-logo`, altText: `${(_b = themeString.split('-')[1]) !== null && _b !== void 0 ? _b : 'a'}-mobile-logo`, height: 5, width: 5 }))),
|
|
58
59
|
React.createElement(Container, { withPadding: true, className: style.desktopNav, theme: theme },
|
|
@@ -62,10 +63,12 @@ const Nav = ({ id, className, navLinks, withMobileSideBar = false, withMobileDro
|
|
|
62
63
|
React.createElement("nav", { className: style.navItems }, navLinks === null || navLinks === void 0 ? void 0 : navLinks.map((navLink, i) => {
|
|
63
64
|
return (React.createElement(NavItem, Object.assign({ key: `desktop_nav_item_${i}` }, navLink, { className: style.navItemPadding, bordered: false, rounded: false, underlineOnHover: true, variant: variant === 'dark' ? 'secondary' : 'primary', theme: theme })));
|
|
64
65
|
})),
|
|
65
|
-
!(profileMenu === null || profileMenu === void 0 ? void 0 : profileMenu.menuItems) &&
|
|
66
|
-
React.createElement(
|
|
67
|
-
|
|
68
|
-
|
|
66
|
+
!(profileMenu === null || profileMenu === void 0 ? void 0 : profileMenu.menuItems) &&
|
|
67
|
+
React.createElement("div", { className: style.textClassList }, text !== undefined &&
|
|
68
|
+
React.createElement(NavItem, { title: text, href: textLink, className: style.navItemPadding, underlineOnHover: true, variant: variant === 'dark' ? 'secondary' : 'primary', theme: theme })),
|
|
69
|
+
(profileMenu === null || profileMenu === void 0 ? void 0 : profileMenu.menuItems) &&
|
|
70
|
+
React.createElement("div", { className: style.profileClassList },
|
|
71
|
+
React.createElement(MenuButton, Object.assign({}, profileMenu, { menuItems: profileMenu === null || profileMenu === void 0 ? void 0 : profileMenu.menuItems })))),
|
|
69
72
|
withMobileSideBar &&
|
|
70
73
|
React.createElement("div", { className: sideNavClasses }, navLinks === null || navLinks === void 0 ? void 0 : navLinks.map((navLink, i) => {
|
|
71
74
|
return (React.createElement(NavItem, Object.assign({ key: `sidebar_nav_item_${i}` }, navLink, { className: classNames(colours, style.mobileSideBarMenuNavItems), bordered: false, rounded: false, underlineOnHover: true, variant: variant === 'dark' ? 'secondary' : 'primary', theme: theme })));
|