@lnco-ai/ui 1.0.0
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/CHANGELOG.md +1323 -0
- package/LICENSE +661 -0
- package/README.md +60 -0
- package/dist/Authorization/PreventGuestWrapper.d.ts +19 -0
- package/dist/Authorization/PreventGuestWrapper.js +15 -0
- package/dist/Authorization/RedirectionContent.d.ts +9 -0
- package/dist/Authorization/RedirectionContent.js +24 -0
- package/dist/Authorization/SignedInWrapper.d.ts +10 -0
- package/dist/Authorization/SignedInWrapper.js +21 -0
- package/dist/Avatar/Avatar.d.ts +24 -0
- package/dist/Avatar/Avatar.js +22 -0
- package/dist/Avatar/stringToColor.d.ts +12 -0
- package/dist/Avatar/stringToColor.js +31 -0
- package/dist/Avatar/stringToColor.test.d.ts +1 -0
- package/dist/Avatar/stringToColor.test.js +8 -0
- package/dist/Card/Card.d.ts +39 -0
- package/dist/Card/Card.js +76 -0
- package/dist/Card/CardHeader.d.ts +12 -0
- package/dist/Card/CardHeader.js +8 -0
- package/dist/Card/CardThumbnail.d.ts +10 -0
- package/dist/Card/CardThumbnail.js +14 -0
- package/dist/Card/FolderCard.d.ts +14 -0
- package/dist/Card/FolderCard.js +44 -0
- package/dist/Card/LinkCard.d.ts +11 -0
- package/dist/Card/LinkCard.js +41 -0
- package/dist/Card/components/CardThumbnail.d.ts +8 -0
- package/dist/Card/components/CardThumbnail.js +15 -0
- package/dist/Card/constants.d.ts +1 -0
- package/dist/Card/constants.js +1 -0
- package/dist/Collapse/Collapse.d.ts +10 -0
- package/dist/Collapse/Collapse.js +48 -0
- package/dist/Collapse/withCollapse.d.ts +7 -0
- package/dist/Collapse/withCollapse.js +8 -0
- package/dist/CookiesBanner/CookiesBanner.d.ts +10 -0
- package/dist/CookiesBanner/CookiesBanner.js +60 -0
- package/dist/CreativeCommons/CreativeCommons.d.ts +14 -0
- package/dist/CreativeCommons/CreativeCommons.js +75 -0
- package/dist/CreativeCommons/icons/By.d.ts +3 -0
- package/dist/CreativeCommons/icons/By.js +3 -0
- package/dist/CreativeCommons/icons/CCIconsProps.d.ts +3 -0
- package/dist/CreativeCommons/icons/CCIconsProps.js +1 -0
- package/dist/CreativeCommons/icons/Cc.d.ts +3 -0
- package/dist/CreativeCommons/icons/Cc.js +3 -0
- package/dist/CreativeCommons/icons/Cc0.d.ts +3 -0
- package/dist/CreativeCommons/icons/Cc0.js +3 -0
- package/dist/CreativeCommons/icons/Nc.d.ts +3 -0
- package/dist/CreativeCommons/icons/Nc.js +3 -0
- package/dist/CreativeCommons/icons/Nd.d.ts +3 -0
- package/dist/CreativeCommons/icons/Nd.js +3 -0
- package/dist/CreativeCommons/icons/Sa.d.ts +3 -0
- package/dist/CreativeCommons/icons/Sa.js +3 -0
- package/dist/CustomInitialLoader/CustomInitialLoader.d.ts +5 -0
- package/dist/CustomInitialLoader/CustomInitialLoader.js +25 -0
- package/dist/DrawerHeader/DrawerHeader.d.ts +7 -0
- package/dist/DrawerHeader/DrawerHeader.js +16 -0
- package/dist/GraaspLogo/EpflLogo.d.ts +5 -0
- package/dist/GraaspLogo/EpflLogo.js +3 -0
- package/dist/GraaspLogo/GraaspLogo.d.ts +8 -0
- package/dist/GraaspLogo/GraaspLogo.js +5 -0
- package/dist/Header/Header.d.ts +21 -0
- package/dist/Header/Header.js +33 -0
- package/dist/HeaderUserInformation/HeaderUserInformation.d.ts +22 -0
- package/dist/HeaderUserInformation/HeaderUserInformation.js +23 -0
- package/dist/ItemBadges/ItemBadges.d.ts +17 -0
- package/dist/ItemBadges/ItemBadges.js +10 -0
- package/dist/ItemFlag/ItemFlagButton.d.ts +9 -0
- package/dist/ItemFlag/ItemFlagButton.js +11 -0
- package/dist/ItemFlag/ItemFlagDialog.d.ts +14 -0
- package/dist/ItemFlag/ItemFlagDialog.js +25 -0
- package/dist/Loader/Loader.d.ts +7 -0
- package/dist/Loader/Loader.js +4 -0
- package/dist/Main/LogoHeader.d.ts +2 -0
- package/dist/Main/LogoHeader.js +5 -0
- package/dist/Main/Main.d.ts +59 -0
- package/dist/Main/Main.js +82 -0
- package/dist/MainMenu/MainMenu.d.ts +10 -0
- package/dist/MainMenu/MainMenu.js +6 -0
- package/dist/MainMenu/MenuItem/MenuItem.d.ts +16 -0
- package/dist/MainMenu/MenuItem/MenuItem.js +16 -0
- package/dist/MainMenu/hooks.d.ts +10 -0
- package/dist/MainMenu/hooks.js +21 -0
- package/dist/Navigation/CurrentItemNavigation.d.ts +15 -0
- package/dist/Navigation/CurrentItemNavigation.js +12 -0
- package/dist/Navigation/ExtraItemsMenu.d.ts +10 -0
- package/dist/Navigation/ExtraItemsMenu.js +24 -0
- package/dist/Navigation/ExtraItemsNavigation.d.ts +11 -0
- package/dist/Navigation/ExtraItemsNavigation.js +11 -0
- package/dist/Navigation/HomeMenu.d.ts +17 -0
- package/dist/Navigation/HomeMenu.js +28 -0
- package/dist/Navigation/ItemMenu.d.ts +16 -0
- package/dist/Navigation/ItemMenu.js +32 -0
- package/dist/Navigation/Navigation.d.ts +26 -0
- package/dist/Navigation/Navigation.js +15 -0
- package/dist/Navigation/ParentsNavigation.d.ts +10 -0
- package/dist/Navigation/ParentsNavigation.js +8 -0
- package/dist/Navigation/common/CenterAlignWrapper.d.ts +3 -0
- package/dist/Navigation/common/CenterAlignWrapper.js +7 -0
- package/dist/Navigation/common/NavigationLink.d.ts +8 -0
- package/dist/Navigation/common/NavigationLink.js +7 -0
- package/dist/Navigation/common/constants.d.ts +1 -0
- package/dist/Navigation/common/constants.js +1 -0
- package/dist/PlatformSwitch/PlatformSwitch.d.ts +57 -0
- package/dist/PlatformSwitch/PlatformSwitch.js +66 -0
- package/dist/PlatformSwitch/hooks.d.ts +30 -0
- package/dist/PlatformSwitch/hooks.js +49 -0
- package/dist/SearchInput/SearchInput.d.ts +20 -0
- package/dist/SearchInput/SearchInput.js +14 -0
- package/dist/Select/Select.d.ts +24 -0
- package/dist/Select/Select.js +7 -0
- package/dist/Sidebar/Sidebar.d.ts +11 -0
- package/dist/Sidebar/Sidebar.js +25 -0
- package/dist/StyledComponents/StyledBaseComponents.d.ts +11 -0
- package/dist/StyledComponents/StyledBaseComponents.js +11 -0
- package/dist/TextDisplay/TextDisplay.d.ts +5 -0
- package/dist/TextDisplay/TextDisplay.js +24 -0
- package/dist/TextDisplay/fixtures.d.ts +3 -0
- package/dist/TextDisplay/fixtures.js +84 -0
- package/dist/TextDisplay/withFlavor.d.ts +8 -0
- package/dist/TextDisplay/withFlavor.js +25 -0
- package/dist/TextEditor/TextEditor.d.ts +16 -0
- package/dist/TextEditor/TextEditor.js +74 -0
- package/dist/ThemeContext/LanguageSelect.d.ts +15 -0
- package/dist/ThemeContext/LanguageSelect.js +19 -0
- package/dist/ThemeContext/ThemeContext.d.ts +22 -0
- package/dist/ThemeContext/ThemeContext.js +31 -0
- package/dist/Thumbnail/Thumbnail.d.ts +28 -0
- package/dist/Thumbnail/Thumbnail.js +27 -0
- package/dist/Tree/Breadcrumbs.d.ts +14 -0
- package/dist/Tree/Breadcrumbs.js +30 -0
- package/dist/Tree/RowMenu.d.ts +12 -0
- package/dist/Tree/RowMenu.js +37 -0
- package/dist/Tree/RowMenus.d.ts +18 -0
- package/dist/Tree/RowMenus.js +7 -0
- package/dist/Tree/types.d.ts +6 -0
- package/dist/Tree/types.js +1 -0
- package/dist/UserSwitch/UserSwitch.d.ts +17 -0
- package/dist/UserSwitch/UserSwitch.js +46 -0
- package/dist/UserSwitch/UserSwitchWrapper.d.ts +37 -0
- package/dist/UserSwitch/UserSwitchWrapper.js +74 -0
- package/dist/appComponents/ErrorFallback.d.ts +57 -0
- package/dist/appComponents/ErrorFallback.js +72 -0
- package/dist/appComponents/QuestionLabel.d.ts +9 -0
- package/dist/appComponents/QuestionLabel.js +4 -0
- package/dist/appComponents/index.d.ts +6 -0
- package/dist/appComponents/index.js +5 -0
- package/dist/appComponents/statusChips/RequiredChip.d.ts +3 -0
- package/dist/appComponents/statusChips/RequiredChip.js +5 -0
- package/dist/appComponents/statusChips/SavedChip.d.ts +3 -0
- package/dist/appComponents/statusChips/SavedChip.js +5 -0
- package/dist/appComponents/statusChips/SubmittedChip.d.ts +3 -0
- package/dist/appComponents/statusChips/SubmittedChip.js +5 -0
- package/dist/appComponents/statusChips/types.d.ts +5 -0
- package/dist/appComponents/statusChips/types.js +1 -0
- package/dist/appComponents/types.d.ts +8 -0
- package/dist/appComponents/types.js +1 -0
- package/dist/apps.d.ts +1 -0
- package/dist/apps.js +1 -0
- package/dist/buttons/BookmarkButton/BookmarkButton.d.ts +24 -0
- package/dist/buttons/BookmarkButton/BookmarkButton.js +24 -0
- package/dist/buttons/Button/Button.d.ts +37 -0
- package/dist/buttons/Button/Button.js +4 -0
- package/dist/buttons/ChatboxButton/ChatboxButton.d.ts +15 -0
- package/dist/buttons/ChatboxButton/ChatboxButton.js +21 -0
- package/dist/buttons/CopyButton/CopyButton.d.ts +13 -0
- package/dist/buttons/CopyButton/CopyButton.js +14 -0
- package/dist/buttons/DeleteButton/DeleteButton.d.ts +12 -0
- package/dist/buttons/DeleteButton/DeleteButton.js +17 -0
- package/dist/buttons/DownloadButton/DownloadButton.d.ts +30 -0
- package/dist/buttons/DownloadButton/DownloadButton.js +20 -0
- package/dist/buttons/EditButton/EditButton.d.ts +13 -0
- package/dist/buttons/EditButton/EditButton.js +17 -0
- package/dist/buttons/LikeButton/LikeButton.d.ts +28 -0
- package/dist/buttons/LikeButton/LikeButton.js +10 -0
- package/dist/buttons/MenuItemButton.d.ts +11 -0
- package/dist/buttons/MenuItemButton.js +12 -0
- package/dist/buttons/MoveButton/MoveButton.d.ts +13 -0
- package/dist/buttons/MoveButton/MoveButton.js +19 -0
- package/dist/buttons/PinButton/PinButton.d.ts +15 -0
- package/dist/buttons/PinButton/PinButton.js +21 -0
- package/dist/buttons/SaveButton/SaveButton.d.ts +24 -0
- package/dist/buttons/SaveButton/SaveButton.js +4 -0
- package/dist/buttons/ShareButton/ShareButton.d.ts +14 -0
- package/dist/buttons/ShareButton/ShareButton.js +17 -0
- package/dist/buttons/hooks.d.ts +5 -0
- package/dist/buttons/hooks.js +14 -0
- package/dist/buttons/index.d.ts +12 -0
- package/dist/buttons/index.js +12 -0
- package/dist/constants.d.ts +11 -0
- package/dist/constants.js +12 -0
- package/dist/draggable/DraggableElement.d.ts +11 -0
- package/dist/draggable/DraggableElement.js +42 -0
- package/dist/draggable/DraggingWrapper.d.ts +23 -0
- package/dist/draggable/DraggingWrapper.js +20 -0
- package/dist/draggable/InBetween.d.ts +10 -0
- package/dist/draggable/InBetween.js +34 -0
- package/dist/draggable/types.d.ts +10 -0
- package/dist/draggable/types.js +1 -0
- package/dist/enums/errors.d.ts +3 -0
- package/dist/enums/errors.js +3 -0
- package/dist/hooks/useFullscreen.d.ts +5 -0
- package/dist/hooks/useFullscreen.js +37 -0
- package/dist/hooks/useMobileView.d.ts +4 -0
- package/dist/hooks/useMobileView.js +6 -0
- package/dist/icons/AnalyticsIcon.d.ts +15 -0
- package/dist/icons/AnalyticsIcon.js +7 -0
- package/dist/icons/BuildIcon.d.ts +15 -0
- package/dist/icons/BuildIcon.js +7 -0
- package/dist/icons/EtherpadIcon.d.ts +7 -0
- package/dist/icons/EtherpadIcon.js +7 -0
- package/dist/icons/H5PIcon.d.ts +6 -0
- package/dist/icons/H5PIcon.js +6 -0
- package/dist/icons/ItemIcon.d.ts +23 -0
- package/dist/icons/ItemIcon.js +75 -0
- package/dist/icons/LibraryIcon.d.ts +16 -0
- package/dist/icons/LibraryIcon.js +7 -0
- package/dist/icons/PlayIcon.d.ts +15 -0
- package/dist/icons/PlayIcon.js +7 -0
- package/dist/icons/ResizingIcon.d.ts +2 -0
- package/dist/icons/ResizingIcon.js +21 -0
- package/dist/icons/StyledSVGComponents.d.ts +35 -0
- package/dist/icons/StyledSVGComponents.js +53 -0
- package/dist/icons/index.d.ts +6 -0
- package/dist/icons/index.js +6 -0
- package/dist/index.d.ts +61 -0
- package/dist/index.js +60 -0
- package/dist/itemLogin/ForbiddenContent.d.ts +20 -0
- package/dist/itemLogin/ForbiddenContent.js +4 -0
- package/dist/itemLogin/ForbiddenText.d.ts +8 -0
- package/dist/itemLogin/ForbiddenText.js +6 -0
- package/dist/itemLogin/ItemLoginScreen.d.ts +26 -0
- package/dist/itemLogin/ItemLoginScreen.js +72 -0
- package/dist/itemLogin/ItemLoginWrapper.d.ts +23 -0
- package/dist/itemLogin/ItemLoginWrapper.js +43 -0
- package/dist/itemLogin/constants.d.ts +1 -0
- package/dist/itemLogin/constants.js +1 -0
- package/dist/items/AppItem.d.ts +60 -0
- package/dist/items/AppItem.js +69 -0
- package/dist/items/DocumentItem.d.ts +19 -0
- package/dist/items/DocumentItem.js +25 -0
- package/dist/items/DownloadButtonFileItem.d.ts +9 -0
- package/dist/items/DownloadButtonFileItem.js +10 -0
- package/dist/items/EtherpadItem.d.ts +26 -0
- package/dist/items/EtherpadItem.js +15 -0
- package/dist/items/FileAudio.d.ts +9 -0
- package/dist/items/FileAudio.js +10 -0
- package/dist/items/FileImage.d.ts +7 -0
- package/dist/items/FileImage.js +10 -0
- package/dist/items/FileItem.d.ts +25 -0
- package/dist/items/FileItem.js +81 -0
- package/dist/items/FilePdf.d.ts +14 -0
- package/dist/items/FilePdf.js +29 -0
- package/dist/items/FileVideo.d.ts +8 -0
- package/dist/items/FileVideo.js +9 -0
- package/dist/items/H5PItem.d.ts +20 -0
- package/dist/items/H5PItem.js +80 -0
- package/dist/items/ItemSkeleton/ItemSkeleton.d.ts +12 -0
- package/dist/items/ItemSkeleton/ItemSkeleton.js +35 -0
- package/dist/items/LinkItem.d.ts +43 -0
- package/dist/items/LinkItem.js +97 -0
- package/dist/items/SizingWrapper.d.ts +6 -0
- package/dist/items/SizingWrapper.js +23 -0
- package/dist/items/appItemHooks.d.ts +27 -0
- package/dist/items/appItemHooks.js +124 -0
- package/dist/items/constants.d.ts +1 -0
- package/dist/items/constants.js +1 -0
- package/dist/items/iframeStyles.d.ts +4 -0
- package/dist/items/iframeStyles.js +5 -0
- package/dist/items/index.d.ts +5 -0
- package/dist/items/index.js +5 -0
- package/dist/items/withCaption.d.ts +19 -0
- package/dist/items/withCaption.js +58 -0
- package/dist/items/withResizing.d.ts +9 -0
- package/dist/items/withResizing.js +42 -0
- package/dist/text-editor.d.ts +2 -0
- package/dist/text-editor.js +2 -0
- package/dist/theme.d.ts +108 -0
- package/dist/theme.js +214 -0
- package/dist/types.d.ts +43 -0
- package/dist/types.js +32 -0
- package/dist/upload/FileDropper/FileDropper.d.ts +50 -0
- package/dist/upload/FileDropper/FileDropper.js +43 -0
- package/dist/upload/UploadFileButton/UploadFileButton.d.ts +35 -0
- package/dist/upload/UploadFileButton/UploadFileButton.js +17 -0
- package/dist/utils/fixtures.d.ts +3 -0
- package/dist/utils/fixtures.js +7 -0
- package/dist/utils/storybook.d.ts +5 -0
- package/dist/utils/storybook.js +5 -0
- package/package.json +172 -0
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { ChevronDown } from 'lucide-react';
|
|
3
|
+
import { Typography, styled } from '@mui/material';
|
|
4
|
+
import { Accordion, AccordionDetails, AccordionSummary } from '@mui/material';
|
|
5
|
+
import { useState } from 'react';
|
|
6
|
+
const COLLAPSE_MIN_HEIGHT = 56;
|
|
7
|
+
const StyledAccordionSummary = styled(AccordionSummary)(({ theme }) => ({
|
|
8
|
+
'.MuiAccordionSummary-root': {
|
|
9
|
+
marginBottom: -1,
|
|
10
|
+
minHeight: COLLAPSE_MIN_HEIGHT,
|
|
11
|
+
flexDirection: 'row-reverse',
|
|
12
|
+
'&$expanded': {
|
|
13
|
+
minHeight: COLLAPSE_MIN_HEIGHT,
|
|
14
|
+
},
|
|
15
|
+
'& .MuiIconButton-edgeEnd': {
|
|
16
|
+
marginRight: theme.spacing(0.5),
|
|
17
|
+
marginLeft: theme.spacing(0.5),
|
|
18
|
+
},
|
|
19
|
+
},
|
|
20
|
+
'.Mui-expanded': {},
|
|
21
|
+
}));
|
|
22
|
+
const Collapse = ({ title, sx, children, onCollapse, }) => {
|
|
23
|
+
const [expanded, setExpanded] = useState(false);
|
|
24
|
+
const handleChange = (expanded) => () => {
|
|
25
|
+
setExpanded(!expanded);
|
|
26
|
+
onCollapse?.(!expanded);
|
|
27
|
+
};
|
|
28
|
+
return (_jsxs(Accordion, { square: true, elevation: 0, disableGutters: true, sx: [
|
|
29
|
+
{
|
|
30
|
+
outline: '1px solid rgba(0, 0, 0, .125)',
|
|
31
|
+
boxShadow: 'none',
|
|
32
|
+
borderRadius: 2,
|
|
33
|
+
},
|
|
34
|
+
{
|
|
35
|
+
'&:not(:last-child)': {
|
|
36
|
+
borderBottom: 0,
|
|
37
|
+
},
|
|
38
|
+
},
|
|
39
|
+
{
|
|
40
|
+
'&:before': {
|
|
41
|
+
display: 'none',
|
|
42
|
+
},
|
|
43
|
+
},
|
|
44
|
+
// You cannot spread `sx` directly because `SxProps` (typeof sx) might not be an array.
|
|
45
|
+
...(Array.isArray(sx) ? sx : [sx]),
|
|
46
|
+
], expanded: expanded, onChange: handleChange(expanded), children: [_jsx(StyledAccordionSummary, { expandIcon: _jsx(ChevronDown, {}), children: _jsx(Typography, { children: title }) }), _jsx(AccordionDetails, { children: children })] }));
|
|
47
|
+
};
|
|
48
|
+
export default Collapse;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import Collapse from './Collapse.js';
|
|
3
|
+
const withCollapse = ({ item, onCollapse, }) => {
|
|
4
|
+
return (component) => {
|
|
5
|
+
return (_jsx(Collapse, { title: item.name, onCollapse: onCollapse, children: component }));
|
|
6
|
+
};
|
|
7
|
+
};
|
|
8
|
+
export default withCollapse;
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
export type CookiesBannerProps = {
|
|
2
|
+
cookieName: string;
|
|
3
|
+
acceptText?: string;
|
|
4
|
+
declineButtonText?: string;
|
|
5
|
+
domain?: string;
|
|
6
|
+
expires?: number;
|
|
7
|
+
text?: string;
|
|
8
|
+
};
|
|
9
|
+
declare const CookiesBanner: ({ cookieName, acceptText, declineButtonText, domain, expires, text, }: CookiesBannerProps) => JSX.Element;
|
|
10
|
+
export default CookiesBanner;
|
|
@@ -0,0 +1,60 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { Box, Button, Typography, styled } from '@mui/material';
|
|
3
|
+
import { CookieConsent } from 'react-cookie-consent';
|
|
4
|
+
// used to keep track of the decline button internally
|
|
5
|
+
const DECLINE_BUTTON_ID = 'decline-button-id';
|
|
6
|
+
// string classnames used to pass to CookieConsent
|
|
7
|
+
const CONTAINER_CLASS_NAME = 'cookie-container';
|
|
8
|
+
const BUTTON_CLASS_NAME = 'cookie-button';
|
|
9
|
+
const BUTTON_CONTAINER_CLASS_NAME = 'cookie-button-container';
|
|
10
|
+
const CONTENT_CLASS_NAME = 'cookie-content';
|
|
11
|
+
const StyledCookieConsent = styled(Box)(({ theme }) => ({
|
|
12
|
+
zIndex: theme.zIndex.modal,
|
|
13
|
+
position: 'fixed',
|
|
14
|
+
bottom: '0px',
|
|
15
|
+
left: '0px',
|
|
16
|
+
right: '0px',
|
|
17
|
+
width: '100%',
|
|
18
|
+
[theme.breakpoints.up('sm')]: {
|
|
19
|
+
bottom: '10px',
|
|
20
|
+
right: '10px',
|
|
21
|
+
left: 'unset',
|
|
22
|
+
maxWidth: '500px',
|
|
23
|
+
borderRadius: theme.spacing(2),
|
|
24
|
+
overflow: 'hidden',
|
|
25
|
+
outline: '1px solid #f2f2f2',
|
|
26
|
+
boxShadow: theme.shadows[6],
|
|
27
|
+
[`& .${BUTTON_CONTAINER_CLASS_NAME}`]: {
|
|
28
|
+
width: '100%',
|
|
29
|
+
flexDirection: 'row',
|
|
30
|
+
justifyContent: 'space-between',
|
|
31
|
+
},
|
|
32
|
+
},
|
|
33
|
+
[`& .${BUTTON_CONTAINER_CLASS_NAME}`]: {
|
|
34
|
+
display: 'flex',
|
|
35
|
+
width: '100%',
|
|
36
|
+
flexDirection: 'column-reverse',
|
|
37
|
+
justifyContent: 'space-between',
|
|
38
|
+
gap: theme.spacing(1),
|
|
39
|
+
[theme.breakpoints.up('sm')]: {
|
|
40
|
+
flexDirection: 'row',
|
|
41
|
+
},
|
|
42
|
+
},
|
|
43
|
+
[`& .${CONTAINER_CLASS_NAME}`]: {
|
|
44
|
+
padding: theme.spacing(2),
|
|
45
|
+
display: 'flex',
|
|
46
|
+
flexDirection: 'column',
|
|
47
|
+
gap: theme.spacing(2),
|
|
48
|
+
zIndex: `${(theme?.zIndex?.drawer ?? 0) + 1}`,
|
|
49
|
+
backgroundColor: 'rgb(224,235,255,70%)',
|
|
50
|
+
backdropFilter: 'blur(15px) saturate(30%) ',
|
|
51
|
+
color: `${theme.palette.text.primary}`,
|
|
52
|
+
},
|
|
53
|
+
}));
|
|
54
|
+
const CookieButton = (props) => {
|
|
55
|
+
const { id } = props;
|
|
56
|
+
const isDeclinedButton = id === DECLINE_BUTTON_ID;
|
|
57
|
+
return (_jsx(Button, { ...props, fullWidth: true, sx: { sm: { width: 'max-content' } }, color: isDeclinedButton ? undefined : 'primary', variant: isDeclinedButton ? 'outlined' : 'contained' }));
|
|
58
|
+
};
|
|
59
|
+
const CookiesBanner = ({ cookieName, acceptText = 'Accept All', declineButtonText = 'Reject Non-Essential', domain = window.location.hostname, expires = 30, text = `We use cookies and other tracking technologies to improve your browsing experience on our website, to analyze our website traffic, and to understand where our visitors are coming from. By browsing our website, you consent to our use of cookies and other tracking technologies.`, }) => (_jsx(StyledCookieConsent, { children: _jsx(CookieConsent, { buttonText: acceptText, cookieName: cookieName, expires: expires, ButtonComponent: CookieButton, declineButtonText: declineButtonText, enableDeclineButton: true, containerClasses: CONTAINER_CLASS_NAME, declineButtonId: DECLINE_BUTTON_ID, disableStyles: true, disableButtonStyles: true, contentClasses: CONTENT_CLASS_NAME, buttonClasses: BUTTON_CLASS_NAME, buttonWrapperClasses: BUTTON_CONTAINER_CLASS_NAME, extraCookieOptions: { domain }, children: _jsx(Typography, { variant: 'note', children: text }) }) }));
|
|
60
|
+
export default CookiesBanner;
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { SxProps } from '@mui/material';
|
|
2
|
+
import { CCSharingVariant } from '../types.js';
|
|
3
|
+
type CreativeCommonsProps = {
|
|
4
|
+
requireAccreditation?: boolean | undefined;
|
|
5
|
+
allowSharedAdaptation: CCSharingVariant;
|
|
6
|
+
allowCommercialUse: boolean;
|
|
7
|
+
iconSize?: number | undefined;
|
|
8
|
+
withLicenseName?: boolean | undefined;
|
|
9
|
+
textColor?: string | undefined;
|
|
10
|
+
textSize?: number | undefined;
|
|
11
|
+
sx?: SxProps;
|
|
12
|
+
};
|
|
13
|
+
declare const CreativeCommons: (props: CreativeCommonsProps) => JSX.Element;
|
|
14
|
+
export default CreativeCommons;
|
|
@@ -0,0 +1,75 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
|
+
import { Box, Stack, Tooltip, Typography } from '@mui/material';
|
|
3
|
+
import { PRIMARY_COLOR } from '../theme.js';
|
|
4
|
+
import By from './icons/By.js';
|
|
5
|
+
import Cc0 from './icons/Cc0.js';
|
|
6
|
+
import Cc from './icons/Cc.js';
|
|
7
|
+
import Nc from './icons/Nc.js';
|
|
8
|
+
import Nd from './icons/Nd.js';
|
|
9
|
+
import Sa from './icons/Sa.js';
|
|
10
|
+
const ccData = (size) => ({
|
|
11
|
+
cc: {
|
|
12
|
+
title: 'Creative Commons',
|
|
13
|
+
description: '',
|
|
14
|
+
icon: _jsx(Cc, { size: size }),
|
|
15
|
+
},
|
|
16
|
+
cc0: {
|
|
17
|
+
title: 'Public Domain Dedication',
|
|
18
|
+
description: 'You can copy, modify, distribute and perform the work, even for commercial purposes, all without asking permission.',
|
|
19
|
+
icon: _jsx(Cc0, { size: size }),
|
|
20
|
+
},
|
|
21
|
+
by: {
|
|
22
|
+
title: 'Attribution',
|
|
23
|
+
description: 'You must give appropriate credit to the licensor in a reasonable manner.',
|
|
24
|
+
icon: _jsx(By, { size: size }),
|
|
25
|
+
},
|
|
26
|
+
nd: {
|
|
27
|
+
title: 'No Derivative Works',
|
|
28
|
+
description: 'The licensor permits others to copy, distribute and transmit the work provided that any alterations you may make do not constitute an adaptation.',
|
|
29
|
+
icon: _jsx(Nd, { size: size }),
|
|
30
|
+
},
|
|
31
|
+
sa: {
|
|
32
|
+
title: 'Share Alike',
|
|
33
|
+
description: "The licensor permits others to distribute derivative works only under the same license or one compatible with the one that governs the licensor's work.",
|
|
34
|
+
icon: _jsx(Sa, { size: size }),
|
|
35
|
+
},
|
|
36
|
+
nc: {
|
|
37
|
+
title: 'Noncommercial',
|
|
38
|
+
description: "The licensor permits others to copy, distribute and transmit the work. In return, licensees may not use the work for commercial purposes — unless they get the licensor's permission.",
|
|
39
|
+
icon: _jsx(Nc, { size: size }),
|
|
40
|
+
},
|
|
41
|
+
});
|
|
42
|
+
const licenses = {
|
|
43
|
+
attr: 'Attribution 4.0 International',
|
|
44
|
+
attrNoDeriv: 'Attribution-NoDerivatives 4.0 International',
|
|
45
|
+
attrShareAlike: 'Attribution-ShareAlike 4.0 International',
|
|
46
|
+
attrNC: 'Attribution-NonCommercial 4.0 International',
|
|
47
|
+
attrNoDerivNC: 'Attribution-NonCommercial-NoDerivatives 4.0 International',
|
|
48
|
+
attrShareAlikeNC: 'Attribution-NonCommercial-ShareAlike 4.0 International',
|
|
49
|
+
cc0: 'CC0 1.0 Universal',
|
|
50
|
+
};
|
|
51
|
+
const getLicenseName = (requireAccreditation, allowCommercialUse, allowSharedAdaptation) => requireAccreditation
|
|
52
|
+
? allowCommercialUse
|
|
53
|
+
? allowSharedAdaptation === 'yes'
|
|
54
|
+
? licenses.attr
|
|
55
|
+
: allowSharedAdaptation === 'no'
|
|
56
|
+
? licenses.attrNoDeriv
|
|
57
|
+
: licenses.attrShareAlike
|
|
58
|
+
: allowSharedAdaptation === 'yes'
|
|
59
|
+
? licenses.attrNC
|
|
60
|
+
: allowSharedAdaptation === 'no'
|
|
61
|
+
? licenses.attrNoDerivNC
|
|
62
|
+
: licenses.attrShareAlikeNC
|
|
63
|
+
: licenses.cc0;
|
|
64
|
+
const CCIcon = ({ icon, title, description }) => {
|
|
65
|
+
const tooltip = (_jsxs(Stack, { direction: 'column', spacing: 1, children: [_jsx(Typography, { fontWeight: 'bold', variant: 'note', children: title }), description && _jsx(Typography, { variant: 'caption', children: description })] }));
|
|
66
|
+
return (_jsx("div", { children: _jsx(Tooltip, { id: title, title: tooltip, arrow: true, children: _jsx(Box, { children: icon }) }) }));
|
|
67
|
+
};
|
|
68
|
+
const CreativeCommons = (props) => {
|
|
69
|
+
const { requireAccreditation = true, allowCommercialUse, allowSharedAdaptation, iconSize = 50, withLicenseName = true, sx, textColor = PRIMARY_COLOR, textSize = Math.max(iconSize / 4, 10), } = props;
|
|
70
|
+
const iconData = ccData(iconSize);
|
|
71
|
+
const license = getLicenseName(requireAccreditation, allowCommercialUse, allowSharedAdaptation);
|
|
72
|
+
const additionalIcons = requireAccreditation ? (_jsxs(_Fragment, { children: [_jsx(CCIcon, { ...iconData.by }), !allowCommercialUse && _jsx(CCIcon, { ...iconData.nc }), allowSharedAdaptation === 'no' && _jsx(CCIcon, { ...iconData.nd }), allowSharedAdaptation === 'alike' && _jsx(CCIcon, { ...iconData.sa })] })) : (_jsx(CCIcon, { ...iconData.cc0 }));
|
|
73
|
+
return (_jsxs(Stack, { paddingX: 3, paddingY: 2, sx: sx, width: 'min-content', spacing: 2, children: [_jsxs(Stack, { direction: 'row', spacing: 2, children: [_jsx(CCIcon, { ...iconData.cc }), additionalIcons] }), withLicenseName && (_jsx(Typography, { alignSelf: 'center', variant: 'caption', color: textColor, fontSize: textSize, fontWeight: 'bold', textAlign: 'center', children: license }))] }));
|
|
74
|
+
};
|
|
75
|
+
export default CreativeCommons;
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
const By = ({ size }) => (_jsxs("svg", { xmlns: 'http://www.w3.org/2000/svg', width: size, height: size, viewBox: '5.5 -3.5 64 64', xmlSpace: 'preserve', children: [_jsx("circle", { fill: '#FFF', cx: 37.637, cy: 28.806, r: 28.276 }), _jsx("path", { d: 'M37.443-3.5c8.988 0 16.57 3.085 22.742 9.257C66.393 11.967 69.5 19.548 69.5 28.5c0 8.991-3.049 16.476-9.145 22.456-6.476 6.363-14.113 9.544-22.912 9.544-8.649 0-16.153-3.144-22.514-9.43C8.644 44.784 5.5 37.262 5.5 28.5c0-8.761 3.144-16.342 9.429-22.742C21.101-.415 28.604-3.5 37.443-3.5zm.114 5.772c-7.276 0-13.428 2.553-18.457 7.657-5.22 5.334-7.829 11.525-7.829 18.572 0 7.086 2.59 13.22 7.77 18.398 5.181 5.182 11.352 7.771 18.514 7.771 7.123 0 13.334-2.607 18.629-7.828 5.029-4.838 7.543-10.952 7.543-18.343 0-7.276-2.553-13.465-7.656-18.571-5.104-5.104-11.276-7.656-18.514-7.656zm8.572 18.285v13.085h-3.656v15.542h-9.944V33.643h-3.656V20.557c0-.572.2-1.057.599-1.457.401-.399.887-.6 1.457-.6h13.144c.533 0 1.01.2 1.428.6.417.4.628.886.628 1.457zm-13.087-8.228c0-3.008 1.485-4.514 4.458-4.514s4.457 1.504 4.457 4.514c0 2.971-1.486 4.457-4.457 4.457s-4.458-1.486-4.458-4.457z' })] }));
|
|
3
|
+
export default By;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
const Cc = ({ size }) => (_jsxs("svg", { xmlns: 'http://www.w3.org/2000/svg', width: size, height: size, viewBox: '5.5 -3.5 64 64', xmlSpace: 'preserve', children: [_jsx("circle", { fill: '#FFF', cx: 37.785, cy: 28.501, r: 28.836 }), _jsx("path", { d: 'M37.441-3.5c8.951 0 16.572 3.125 22.857 9.372 3.008 3.009 5.295 6.448 6.857 10.314 1.561 3.867 2.344 7.971 2.344 12.314 0 4.381-.773 8.486-2.314 12.313-1.543 3.828-3.82 7.21-6.828 10.143-3.123 3.085-6.666 5.448-10.629 7.086-3.961 1.638-8.057 2.457-12.285 2.457s-8.276-.808-12.143-2.429c-3.866-1.618-7.333-3.961-10.4-7.027-3.067-3.066-5.4-6.524-7-10.372S5.5 32.767 5.5 28.5c0-4.229.809-8.295 2.428-12.2 1.619-3.905 3.972-7.4 7.057-10.486C21.08-.394 28.565-3.5 37.441-3.5zm.116 5.772c-7.314 0-13.467 2.553-18.458 7.657-2.515 2.553-4.448 5.419-5.8 8.6a25.204 25.204 0 0 0-2.029 9.972c0 3.429.675 6.734 2.029 9.913 1.353 3.183 3.285 6.021 5.8 8.516 2.514 2.496 5.351 4.399 8.515 5.715a25.652 25.652 0 0 0 9.943 1.971c3.428 0 6.75-.665 9.973-1.999 3.219-1.335 6.121-3.257 8.713-5.771 4.99-4.876 7.484-10.99 7.484-18.344 0-3.543-.648-6.895-1.943-10.057-1.293-3.162-3.18-5.98-5.654-8.458-5.146-5.143-11.335-7.715-18.573-7.715zm-.401 20.915-4.287 2.229c-.458-.951-1.019-1.619-1.685-2-.667-.38-1.286-.571-1.858-.571-2.856 0-4.286 1.885-4.286 5.657 0 1.714.362 3.084 1.085 4.113.724 1.029 1.791 1.544 3.201 1.544 1.867 0 3.181-.915 3.944-2.743l3.942 2c-.838 1.563-2 2.791-3.486 3.686-1.484.896-3.123 1.343-4.914 1.343-2.857 0-5.163-.875-6.915-2.629-1.752-1.752-2.628-4.19-2.628-7.313 0-3.048.886-5.466 2.657-7.257 1.771-1.79 4.009-2.686 6.715-2.686 3.963-.002 6.8 1.541 8.515 4.627zm18.457 0-4.229 2.229c-.457-.951-1.02-1.619-1.686-2-.668-.38-1.307-.571-1.914-.571-2.857 0-4.287 1.885-4.287 5.657 0 1.714.363 3.084 1.086 4.113.723 1.029 1.789 1.544 3.201 1.544 1.865 0 3.18-.915 3.941-2.743l4 2c-.875 1.563-2.057 2.791-3.541 3.686a9.233 9.233 0 0 1-4.857 1.343c-2.896 0-5.209-.875-6.941-2.629-1.736-1.752-2.602-4.19-2.602-7.313 0-3.048.885-5.466 2.658-7.257 1.77-1.79 4.008-2.686 6.713-2.686 3.962-.002 6.783 1.541 8.458 4.627z' })] }));
|
|
3
|
+
export default Cc;
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
const Cc0 = ({ size }) => (_jsxs("svg", { xmlns: 'http://www.w3.org/2000/svg', width: size, height: size, viewBox: '-0.5 0.5 64 64', xmlSpace: 'preserve', children: [_jsx("circle", { fill: '#FFF', cx: 31.325, cy: 32.873, r: 30.096 }), _jsx("path", { d: 'M31.5 14.08c-10.565 0-13.222 9.969-13.222 18.42 0 8.452 2.656 18.42 13.222 18.42 10.564 0 13.221-9.968 13.221-18.42 0-8.451-2.657-18.42-13.221-18.42zm0 6.946c.429 0 .82.066 1.188.157.761.656 1.133 1.561.403 2.823l-7.036 12.93c-.216-1.636-.247-3.24-.247-4.437 0-3.722.258-11.473 5.692-11.473zm5.266 5.961c.373 1.984.426 4.056.426 5.513 0 3.723-.258 11.475-5.69 11.475-.428 0-.822-.045-1.188-.136a4.343 4.343 0 0 1-.202-.067 3.666 3.666 0 0 1-.336-.11c-1.21-.515-1.972-1.446-.874-3.093l7.864-13.582z' }), _jsx("path", { d: 'M31.433.5C22.556.5 15.074 3.59 8.979 9.8c-3.087 3.087-5.443 6.607-7.082 10.532A31.646 31.646 0 0 0-.5 32.5c0 4.268.797 8.32 2.397 12.168 1.6 3.85 3.921 7.312 6.969 10.396 3.085 3.049 6.549 5.399 10.398 7.037a31.607 31.607 0 0 0 12.169 2.398c4.229 0 8.34-.826 12.303-2.465 3.962-1.639 7.496-3.994 10.621-7.081 3.011-2.933 5.289-6.297 6.812-10.106C62.73 41 63.5 36.883 63.5 32.5c0-4.343-.77-8.454-2.33-12.303-1.562-3.885-3.848-7.32-6.857-10.33C48.025 3.619 40.385.5 31.433.5zm.134 5.759c7.238 0 13.412 2.566 18.554 7.709 2.477 2.477 4.375 5.31 5.67 8.471 1.296 3.162 1.949 6.518 1.949 10.061 0 7.354-2.516 13.454-7.506 18.33-2.592 2.516-5.502 4.447-8.74 5.781a25.512 25.512 0 0 1-9.927 1.994 26.01 26.01 0 0 1-9.949-1.948c-3.163-1.334-6.001-3.238-8.516-5.716-2.515-2.514-4.455-5.353-5.826-8.516-1.333-3.199-2.017-6.498-2.017-9.927 0-3.467.684-6.787 2.017-9.949 1.371-3.2 3.312-6.074 5.826-8.628 4.99-5.103 11.15-7.662 18.465-7.662z' })] }));
|
|
3
|
+
export default Cc0;
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
const Nc = ({ size }) => (_jsxs("svg", { xmlns: 'http://www.w3.org/2000/svg', width: size, height: size, viewBox: '5.5 -3.5 64 64', xmlSpace: 'preserve', children: [_jsx("circle", { fill: '#FFF', cx: 37.47, cy: 28.736, r: 29.471 }), _jsx("path", { d: 'M37.442-3.5c8.99 0 16.571 3.085 22.743 9.256C66.393 11.928 69.5 19.509 69.5 28.5c0 8.992-3.048 16.476-9.145 22.458C53.88 57.32 46.241 60.5 37.442 60.5c-8.686 0-16.19-3.162-22.513-9.485C8.644 44.728 5.5 37.225 5.5 28.5c0-8.762 3.144-16.343 9.429-22.743C21.1-.414 28.604-3.5 37.442-3.5zM12.7 19.872c-.952 2.628-1.429 5.505-1.429 8.629 0 7.086 2.59 13.22 7.77 18.4 5.219 5.144 11.391 7.715 18.514 7.715 7.201 0 13.409-2.608 18.63-7.829 1.867-1.79 3.332-3.657 4.398-5.602l-12.056-5.371c-.421 2.02-1.439 3.667-3.057 4.942-1.622 1.276-3.535 2.011-5.744 2.2v4.915h-3.714v-4.915c-3.543-.036-6.782-1.312-9.714-3.827l4.4-4.457c2.094 1.942 4.476 2.913 7.143 2.913 1.104 0 2.048-.246 2.83-.743.78-.494 1.172-1.312 1.172-2.457 0-.801-.287-1.448-.858-1.943L37.9 31.127l-3.771-1.715-5.086-2.229L12.7 19.872zM37.557 2.214c-7.276 0-13.428 2.571-18.457 7.714a30.623 30.623 0 0 0-3.543 4.287L27.786 19.7c.533-1.676 1.542-3.019 3.029-4.028 1.484-1.009 3.218-1.571 5.2-1.686V9.071h3.715v4.915c2.934.153 5.6 1.143 8 2.971l-4.172 4.286c-1.793-1.257-3.619-1.885-5.486-1.885-.991 0-1.876.191-2.656.571-.781.381-1.172 1.029-1.172 1.943 0 .267.095.533.285.8l4.057 1.83 2.8 1.257 5.144 2.285 16.397 7.314a29.51 29.51 0 0 0 .801-6.857c0-7.353-2.552-13.543-7.656-18.573-5.067-5.143-11.241-7.714-18.515-7.714z' })] }));
|
|
3
|
+
export default Nc;
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
const Nd = ({ size }) => (_jsxs("svg", { xmlns: 'http://www.w3.org/2000/svg', width: size, height: size, viewBox: '0 0 64 64', xmlSpace: 'preserve', children: [_jsx("circle", { fill: '#FFF', cx: 32.064, cy: 31.788, r: 29.013 }), _jsx("path", { d: 'M31.944 0c8.952 0 16.533 3.105 22.744 9.314C60.895 15.486 64 23.046 64 32s-3.049 16.457-9.146 22.514C48.418 60.838 40.78 64 31.943 64c-8.65 0-16.153-3.143-22.514-9.43C3.144 48.286 0 40.762 0 32.001c0-8.724 3.144-16.285 9.43-22.685C15.64 3.106 23.144 0 31.943 0zm.117 5.771c-7.276 0-13.43 2.57-18.459 7.715-5.22 5.297-7.83 11.468-7.83 18.514 0 7.125 2.59 13.257 7.771 18.4 5.181 5.182 11.352 7.77 18.516 7.77 7.123 0 13.332-2.607 18.627-7.827 5.028-4.876 7.543-10.99 7.543-18.343 0-7.313-2.554-13.484-7.657-18.514-5.067-5.144-11.238-7.715-18.511-7.715zm12.056 18.685v5.485H20.86v-5.485h23.257zm0 10.287v5.482H20.86v-5.482h23.257z' })] }));
|
|
3
|
+
export default Nd;
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
const Sa = ({ size }) => (_jsxs("svg", { xmlns: 'http://www.w3.org/2000/svg', width: size, height: size, viewBox: '5.5 -3.5 64 64', xmlSpace: 'preserve', children: [_jsx("circle", { fill: '#FFF', cx: 36.944, cy: 28.631, r: 29.105 }), _jsx("path", { d: 'M37.443-3.5c8.951 0 16.531 3.105 22.742 9.315C66.393 11.987 69.5 19.548 69.5 28.5c0 8.954-3.049 16.457-9.145 22.514-6.437 6.324-14.076 9.486-22.912 9.486-8.649 0-16.153-3.143-22.514-9.429C8.644 44.786 5.5 37.264 5.5 28.501c0-8.723 3.144-16.285 9.429-22.685C21.138-.395 28.643-3.5 37.443-3.5zm.114 5.772c-7.276 0-13.428 2.572-18.457 7.715-5.22 5.296-7.829 11.467-7.829 18.513 0 7.125 2.59 13.257 7.77 18.4 5.181 5.182 11.352 7.771 18.514 7.771 7.123 0 13.334-2.609 18.629-7.828 5.029-4.876 7.543-10.99 7.543-18.343 0-7.313-2.553-13.485-7.656-18.513-5.067-5.145-11.239-7.715-18.514-7.715zM23.271 23.985c.609-3.924 2.189-6.962 4.742-9.114 2.552-2.152 5.656-3.228 9.314-3.228 5.027 0 9.029 1.62 12 4.856 2.971 3.238 4.457 7.391 4.457 12.457 0 4.915-1.543 9-4.627 12.256-3.088 3.256-7.086 4.886-12.002 4.886-3.619 0-6.743-1.085-9.371-3.257-2.629-2.172-4.209-5.257-4.743-9.257H31.1c.19 3.886 2.533 5.829 7.029 5.829 2.246 0 4.057-.972 5.428-2.914 1.373-1.942 2.059-4.534 2.059-7.771 0-3.391-.629-5.971-1.885-7.743-1.258-1.771-3.066-2.657-5.43-2.657-4.268 0-6.667 1.885-7.2 5.656h2.343l-6.342 6.343-6.343-6.343 2.512.001z' })] }));
|
|
3
|
+
export default Sa;
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { Container, LinearProgress, linearProgressClasses, styled, } from '@mui/material';
|
|
3
|
+
import GraaspLogo from '../GraaspLogo/GraaspLogo.js';
|
|
4
|
+
const StyledContainer = styled(Container)(() => ({
|
|
5
|
+
height: '100vh',
|
|
6
|
+
display: 'flex',
|
|
7
|
+
flexDirection: 'column',
|
|
8
|
+
justifyContent: 'center',
|
|
9
|
+
alignItems: 'center',
|
|
10
|
+
}));
|
|
11
|
+
const StyledLinearProgress = styled(LinearProgress)(({ theme }) => ({
|
|
12
|
+
width: '50%',
|
|
13
|
+
minWidth: 200,
|
|
14
|
+
margin: '0 auto',
|
|
15
|
+
height: 10,
|
|
16
|
+
borderRadius: 2,
|
|
17
|
+
marginTop: theme.spacing(2),
|
|
18
|
+
[`& .${linearProgressClasses.bar}`]: {
|
|
19
|
+
backgroundColor: theme.palette.primary.main,
|
|
20
|
+
},
|
|
21
|
+
}));
|
|
22
|
+
const CustomInitialLoader = ({ id }) => {
|
|
23
|
+
return (_jsxs(StyledContainer, { id: id, children: [_jsx(GraaspLogo, { height: 100 }), _jsx("div", { children: _jsx(StyledLinearProgress, {}) })] }));
|
|
24
|
+
};
|
|
25
|
+
export default CustomInitialLoader;
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
export interface DrawerHeaderProps {
|
|
2
|
+
children?: JSX.Element;
|
|
3
|
+
direction?: string;
|
|
4
|
+
handleDrawerClose?: () => void;
|
|
5
|
+
}
|
|
6
|
+
export declare const DrawerHeader: ({ handleDrawerClose, children, direction, }: DrawerHeaderProps) => JSX.Element;
|
|
7
|
+
export default DrawerHeader;
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { ChevronLeft, ChevronRight } from 'lucide-react';
|
|
3
|
+
import { IconButton, ListItem, ListItemSecondaryAction, styled, useTheme, } from '@mui/material';
|
|
4
|
+
import { DEFAULT_DIRECTION, DRAWER_HEADER_HEIGHT } from '../constants.js';
|
|
5
|
+
const StyledListItem = styled(ListItem)({
|
|
6
|
+
height: DRAWER_HEADER_HEIGHT,
|
|
7
|
+
});
|
|
8
|
+
const StyledListItemSecondaryAction = styled(ListItemSecondaryAction)(({ theme }) => ({
|
|
9
|
+
right: theme.spacing(1),
|
|
10
|
+
}));
|
|
11
|
+
export const DrawerHeader = ({ handleDrawerClose, children, direction, }) => {
|
|
12
|
+
const theme = useTheme();
|
|
13
|
+
const dir = direction ?? theme?.direction ?? DEFAULT_DIRECTION;
|
|
14
|
+
return (_jsxs(StyledListItem, { divider: true, ContainerComponent: 'div', children: [children, _jsx(StyledListItemSecondaryAction, { children: _jsx(IconButton, { onClick: handleDrawerClose, children: dir === 'ltr' ? (_jsx(ChevronLeft, { "data-testid": 'ChevronLeftIcon' })) : (_jsx(ChevronRight, { "data-testid": 'ChevronRightIcon' })) }) })] }));
|
|
15
|
+
};
|
|
16
|
+
export default DrawerHeader;
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
const EPFLLogo = ({ height }) => (_jsxs("svg", { id: 'logo_epfl_2019', "data-name": 'logo epfl 2019', xmlns: 'http://www.w3.org/2000/svg', height: height, style: { fill: 'red' }, viewBox: '0 0 182.4 53', children: [_jsx("title", { children: "epfl-logo-new" }), _jsx("polygon", { points: '0 21.6 11.43 21.6 11.43 9.8 38.34 9.8 38.34 0 0 0 0 21.6' }), _jsx("polygon", { points: '0 53 38.34 53 38.34 43.2 11.43 43.2 11.43 31.4 0 31.4 0 53' }), _jsx("rect", { x: '11.43', y: '21.6', width: '24.61', height: '9.8' }), _jsx("path", { d: 'M86,4.87a16.12,16.12,0,0,0-5.68-3.53A23.76,23.76,0,0,0,71.82,0H48.14V53H59.57V31.4H71.82a23.76,23.76,0,0,0,8.46-1.34A16.12,16.12,0,0,0,86,26.53a13.43,13.43,0,0,0,3.19-5,17.38,17.38,0,0,0,0-11.62A13.52,13.52,0,0,0,86,4.87ZM78,18.73a5.7,5.7,0,0,1-2.26,1.8,11.33,11.33,0,0,1-3.27.85,32,32,0,0,1-3.86.22H59.57V9.8h9.05a32,32,0,0,1,3.86.22,11,11,0,0,1,3.27.86A5.59,5.59,0,0,1,78,12.67a5,5,0,0,1,.86,3A5,5,0,0,1,78,18.73Z' }), _jsx("polygon", { points: '155.47 43.2 155.47 0 144.04 0 144.04 53 182.38 53 182.38 43.2 155.47 43.2' }), _jsx("polygon", { points: '97.42 21.6 108.85 21.6 108.85 9.8 135.76 9.8 135.76 0 97.42 0 97.42 21.6' }), _jsx("rect", { x: '97.42', y: '31.4', width: '11.43', height: '21.6' }), _jsx("rect", { x: '108.85', y: '21.6', width: '24.61', height: '9.8' })] }));
|
|
3
|
+
export default EPFLLogo;
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
|
+
const GraaspLogo = ({ height, sx }) => {
|
|
3
|
+
return (_jsx(_Fragment, { children: _jsx("img", { alt: 'LNCO Logo', height: height, style: { ...sx }, src: '/lnco-logo.png' }) }));
|
|
4
|
+
};
|
|
5
|
+
export default GraaspLogo;
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import '@mui/material';
|
|
2
|
+
import { SxProps } from '@mui/material';
|
|
3
|
+
import { AllowedContext } from '../types.js';
|
|
4
|
+
export declare const buildHeaderGradient: (color: string) => string;
|
|
5
|
+
type Props = {
|
|
6
|
+
context?: `${AllowedContext}` | AllowedContext;
|
|
7
|
+
centerContent?: JSX.Element;
|
|
8
|
+
handleDrawerOpen?: () => void;
|
|
9
|
+
handleDrawerClose?: () => void;
|
|
10
|
+
hasSidebar?: boolean;
|
|
11
|
+
id?: string;
|
|
12
|
+
menuButtonId?: string;
|
|
13
|
+
isSidebarOpen?: boolean;
|
|
14
|
+
leftContent?: JSX.Element;
|
|
15
|
+
openDrawerAriaLabel?: string;
|
|
16
|
+
closeDrawerAriaLabel?: string;
|
|
17
|
+
rightContent?: JSX.Element;
|
|
18
|
+
sx?: SxProps;
|
|
19
|
+
};
|
|
20
|
+
export declare const Header: ({ context, centerContent, menuButtonId, id, hasSidebar, handleDrawerOpen, handleDrawerClose, isSidebarOpen, openDrawerAriaLabel, closeDrawerAriaLabel, leftContent, rightContent, sx, }: Props) => JSX.Element;
|
|
21
|
+
export default Header;
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
|
+
import { SidebarClose, SidebarOpen } from 'lucide-react';
|
|
3
|
+
import '@mui/material';
|
|
4
|
+
import { AppBar, IconButton, Stack, Toolbar, styled, } from '@mui/material';
|
|
5
|
+
import { AccentColors, PRIMARY_COLOR } from '../theme.js';
|
|
6
|
+
const OPEN_DRAWER_LABEL = 'Open Drawer';
|
|
7
|
+
const CLOSE_DRAWER_LABEL = 'Close Drawer';
|
|
8
|
+
export const buildHeaderGradient = (color) => `linear-gradient(90deg, #111 0%, #111 35%, ${color} 100%);`;
|
|
9
|
+
const StyledIconButton = styled(IconButton)(({ theme, isSidebarOpen }) => ({
|
|
10
|
+
marginLeft: theme.spacing(2),
|
|
11
|
+
marginRight: theme.spacing(3),
|
|
12
|
+
float: 'left',
|
|
13
|
+
...(isSidebarOpen ? { display: 'none' } : {}),
|
|
14
|
+
[theme.breakpoints.down('sm')]: {
|
|
15
|
+
marginLeft: theme.spacing(1),
|
|
16
|
+
marginRight: theme.spacing(0),
|
|
17
|
+
},
|
|
18
|
+
}));
|
|
19
|
+
const HeaderMenuIcon = ({ isOpen, buttonId, openAriaLabel, closedAriaLabel, handleOpen, handleClose, }) => {
|
|
20
|
+
if (isOpen) {
|
|
21
|
+
return (_jsx(StyledIconButton, { id: buttonId, color: 'inherit', "aria-label": openAriaLabel, onClick: handleClose, children: _jsx(SidebarClose, {}) }));
|
|
22
|
+
}
|
|
23
|
+
return (_jsx(StyledIconButton, { id: buttonId, color: 'inherit', "aria-label": closedAriaLabel, onClick: handleOpen, children: _jsx(SidebarOpen, {}) }));
|
|
24
|
+
};
|
|
25
|
+
export const Header = ({ context, centerContent, menuButtonId, id, hasSidebar, handleDrawerOpen, handleDrawerClose, isSidebarOpen = false, openDrawerAriaLabel = OPEN_DRAWER_LABEL, closeDrawerAriaLabel = CLOSE_DRAWER_LABEL, leftContent, rightContent, sx, }) => {
|
|
26
|
+
return (_jsxs(_Fragment, { children: [_jsx(AppBar, { id: id, position: 'sticky', sx: {
|
|
27
|
+
background: context
|
|
28
|
+
? buildHeaderGradient(AccentColors[context])
|
|
29
|
+
: PRIMARY_COLOR,
|
|
30
|
+
...sx,
|
|
31
|
+
}, children: _jsxs(Toolbar, { disableGutters: true, children: [hasSidebar && (_jsx(HeaderMenuIcon, { isOpen: isSidebarOpen, buttonId: menuButtonId, openAriaLabel: openDrawerAriaLabel, closedAriaLabel: closeDrawerAriaLabel, handleClose: handleDrawerClose, handleOpen: handleDrawerOpen })), _jsxs(Stack, { width: '100%', direction: 'row', justifyContent: 'space-between', alignItems: 'center', children: [leftContent, centerContent, rightContent] })] }) }), _jsx(Toolbar, {})] }));
|
|
32
|
+
};
|
|
33
|
+
export default Header;
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import { AriaAttributes, MouseEventHandler } from 'react';
|
|
2
|
+
import { UUID } from '@lnco-ai/sdk';
|
|
3
|
+
export type HeaderUserInformationProps = {
|
|
4
|
+
/**
|
|
5
|
+
* user avatar link
|
|
6
|
+
*/
|
|
7
|
+
avatar: string;
|
|
8
|
+
/**
|
|
9
|
+
* user's name'
|
|
10
|
+
*/
|
|
11
|
+
username: string;
|
|
12
|
+
id?: UUID;
|
|
13
|
+
isLoading?: boolean;
|
|
14
|
+
isPopUpOpen?: boolean;
|
|
15
|
+
noUsernameMessage?: string;
|
|
16
|
+
onClick?: MouseEventHandler<HTMLDivElement>;
|
|
17
|
+
popUpType?: AriaAttributes['aria-haspopup'];
|
|
18
|
+
popUpId?: string;
|
|
19
|
+
role?: string;
|
|
20
|
+
};
|
|
21
|
+
declare const HeaderUserInformation: ({ avatar, id, isLoading, noUsernameMessage, onClick, username, popUpType, popUpId, isPopUpOpen, role, }: HeaderUserInformationProps) => JSX.Element;
|
|
22
|
+
export default HeaderUserInformation;
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { Avatar, Skeleton, Tooltip, Typography, styled } from '@mui/material';
|
|
3
|
+
import { SHORT_TEXT_WIDTH, SMALL_AVATAR_SIZE } from '../constants.js';
|
|
4
|
+
const WrapperDiv = styled('div')({
|
|
5
|
+
display: 'flex',
|
|
6
|
+
alignItems: 'center',
|
|
7
|
+
'&:hover': {
|
|
8
|
+
cursor: 'pointer',
|
|
9
|
+
},
|
|
10
|
+
});
|
|
11
|
+
const StyledSkeleton = styled(Skeleton)(({ theme }) => ({
|
|
12
|
+
margin: theme.spacing(0, 2),
|
|
13
|
+
}));
|
|
14
|
+
const StyledTypography = styled(Typography)(({ theme }) => ({
|
|
15
|
+
margin: theme.spacing(0, 2),
|
|
16
|
+
}));
|
|
17
|
+
const HeaderUserInformation = ({ avatar, id, isLoading = false, noUsernameMessage, onClick, username, popUpType, popUpId, isPopUpOpen, role, }) => {
|
|
18
|
+
if (isLoading) {
|
|
19
|
+
return (_jsxs(WrapperDiv, { children: [_jsx(Skeleton, { variant: 'circular', width: SMALL_AVATAR_SIZE, height: SMALL_AVATAR_SIZE }), _jsx(StyledSkeleton, { variant: 'text', width: SHORT_TEXT_WIDTH })] }));
|
|
20
|
+
}
|
|
21
|
+
return (_jsxs(WrapperDiv, { onClick: onClick, id: id, role: role, "aria-haspopup": popUpType, "aria-controls": popUpId, "aria-expanded": isPopUpOpen, children: [_jsx(Tooltip, { title: username || noUsernameMessage || 'You are not signed in.', children: _jsx(Avatar, { alt: username, src: avatar }) }), username && (_jsx(StyledTypography, { variant: 'subtitle1', children: username }))] }));
|
|
22
|
+
};
|
|
23
|
+
export default HeaderUserInformation;
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
type Props = {
|
|
2
|
+
isHidden?: boolean;
|
|
3
|
+
isHiddenTooltip?: string;
|
|
4
|
+
isPublic?: boolean;
|
|
5
|
+
isPublicTooltip?: string;
|
|
6
|
+
isPublished?: boolean;
|
|
7
|
+
isPublishedTooltip?: string;
|
|
8
|
+
isPinned?: boolean;
|
|
9
|
+
isPinnedTooltip?: string;
|
|
10
|
+
isCollapsible?: boolean;
|
|
11
|
+
isCollapsibleTooltip?: string;
|
|
12
|
+
showChatbox?: boolean;
|
|
13
|
+
showChatboxTooltip?: string;
|
|
14
|
+
backgroundColor?: string;
|
|
15
|
+
};
|
|
16
|
+
declare const ItemBadges: ({ isHidden, isHiddenTooltip, isPinned, isPinnedTooltip, isPublished, isPublishedTooltip, isPublic, isPublicTooltip, isCollapsible, isCollapsibleTooltip, showChatbox, showChatboxTooltip, backgroundColor, }: Props) => JSX.Element;
|
|
17
|
+
export default ItemBadges;
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { EyeOff, FoldVertical, Globe2, MessageSquareTextIcon, PinIcon, } from 'lucide-react';
|
|
3
|
+
import { Avatar, AvatarGroup, Tooltip } from '@mui/material';
|
|
4
|
+
import { LibraryIcon } from '../icons/index.js';
|
|
5
|
+
const BADGE_SIZE = '18px';
|
|
6
|
+
const ItemBadge = ({ tooltip, children, backgroundColor, }) => (_jsx(Tooltip, { title: tooltip, children: _jsx(Avatar, { sx: { width: 24, height: 24, bgcolor: backgroundColor }, children: children }) }));
|
|
7
|
+
const ItemBadges = ({ isHidden = false, isHiddenTooltip = 'Hidden', isPinned = false, isPinnedTooltip = 'Pinned', isPublished = false, isPublishedTooltip = 'Published', isPublic = false, isPublicTooltip = 'Public', isCollapsible = false, isCollapsibleTooltip = 'Collapsible', showChatbox = false, showChatboxTooltip = 'Chat', backgroundColor = '#757575', }) => {
|
|
8
|
+
return (_jsxs(AvatarGroup, { max: 10, children: [isHidden && (_jsx(ItemBadge, { backgroundColor: backgroundColor, tooltip: isHiddenTooltip, children: _jsx(EyeOff, { size: BADGE_SIZE }) })), isPinned && (_jsx(ItemBadge, { backgroundColor: backgroundColor, tooltip: isPinnedTooltip, children: _jsx(PinIcon, { size: BADGE_SIZE }) })), isPublished && (_jsx(ItemBadge, { backgroundColor: backgroundColor, tooltip: isPublishedTooltip, children: _jsx(LibraryIcon, { primaryOpacity: 1, primaryColor: 'white', disableHover: true }) })), isPublic && (_jsx(ItemBadge, { backgroundColor: backgroundColor, tooltip: isPublicTooltip, children: _jsx(Globe2, { size: BADGE_SIZE }) })), isCollapsible && (_jsx(ItemBadge, { backgroundColor: backgroundColor, tooltip: isCollapsibleTooltip, children: _jsx(FoldVertical, { size: BADGE_SIZE }) })), showChatbox && (_jsx(ItemBadge, { backgroundColor: backgroundColor, tooltip: showChatboxTooltip, children: _jsx(MessageSquareTextIcon, { size: BADGE_SIZE }) }))] }));
|
|
9
|
+
};
|
|
10
|
+
export default ItemBadges;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { ColorVariantsType, IconSizeVariant } from '../types.js';
|
|
2
|
+
export interface ItemFlagButtonProps {
|
|
3
|
+
buttonColor?: ColorVariantsType;
|
|
4
|
+
iconSize?: IconSizeVariant;
|
|
5
|
+
setOpen: (arg: boolean) => void;
|
|
6
|
+
tooltip?: string;
|
|
7
|
+
}
|
|
8
|
+
export declare const ItemFlagButton: ({ buttonColor, iconSize, setOpen, tooltip, }: ItemFlagButtonProps) => JSX.Element;
|
|
9
|
+
export default ItemFlagButton;
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { FlagIcon } from 'lucide-react';
|
|
3
|
+
import { IconButton, Tooltip } from '@mui/material';
|
|
4
|
+
import { ColorVariants } from '../types.js';
|
|
5
|
+
export const ItemFlagButton = ({ buttonColor = ColorVariants.Error, iconSize = 'large', setOpen, tooltip = 'Report', }) => {
|
|
6
|
+
const openItemFlagDialog = () => {
|
|
7
|
+
setOpen(true);
|
|
8
|
+
};
|
|
9
|
+
return (_jsx(Tooltip, { title: tooltip, children: _jsx("span", { children: _jsx(IconButton, { color: buttonColor, onClick: openItemFlagDialog, children: _jsx(FlagIcon, { fontSize: iconSize }) }) }) }));
|
|
10
|
+
};
|
|
11
|
+
export default ItemFlagButton;
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { FlagType } from '@lnco-ai/sdk';
|
|
2
|
+
export interface ItemFlagDialogProps {
|
|
3
|
+
flags: FlagType[];
|
|
4
|
+
onFlag: (flag?: FlagType) => void;
|
|
5
|
+
open: boolean;
|
|
6
|
+
onClose: () => void;
|
|
7
|
+
descriptionText?: string;
|
|
8
|
+
title?: string;
|
|
9
|
+
cancelButtonText?: string;
|
|
10
|
+
confirmButtonText?: string;
|
|
11
|
+
formatFlag?: (flag: string) => string;
|
|
12
|
+
}
|
|
13
|
+
export declare const ItemFlagDialog: ({ flags, onFlag, open, onClose, descriptionText, title, cancelButtonText, confirmButtonText, formatFlag, }: ItemFlagDialogProps) => JSX.Element;
|
|
14
|
+
export default ItemFlagDialog;
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { Dialog, DialogActions, DialogContent, DialogTitle, List, ListItemButton, ListItemText, Typography, styled, } from '@mui/material';
|
|
3
|
+
import { useState } from 'react';
|
|
4
|
+
import Button from '../buttons/Button/Button.js';
|
|
5
|
+
import { FLAG_LIST_MAX_HEIGHT } from '../constants.js';
|
|
6
|
+
const ListTitle = styled(Typography)({
|
|
7
|
+
fontSize: 'small',
|
|
8
|
+
});
|
|
9
|
+
const StyledList = styled(List)({
|
|
10
|
+
width: '100%',
|
|
11
|
+
overflow: 'auto',
|
|
12
|
+
maxHeight: FLAG_LIST_MAX_HEIGHT,
|
|
13
|
+
});
|
|
14
|
+
export const ItemFlagDialog = ({ flags, onFlag, open, onClose, descriptionText = 'Select reason for flagging this item', title = 'Flag Item', cancelButtonText = 'Cancel', confirmButtonText = 'Flag', formatFlag, }) => {
|
|
15
|
+
const [selectedFlag, setSelectedFlag] = useState();
|
|
16
|
+
const handleSelect = (flag) => () => setSelectedFlag(flag);
|
|
17
|
+
const flagToString = (flag) => {
|
|
18
|
+
if (formatFlag) {
|
|
19
|
+
return formatFlag(flag);
|
|
20
|
+
}
|
|
21
|
+
return flag;
|
|
22
|
+
};
|
|
23
|
+
return (_jsxs(Dialog, { open: open, onClose: onClose, maxWidth: 'sm', fullWidth: true, children: [_jsx(DialogTitle, { children: title }), _jsxs(DialogContent, { children: [_jsx(ListTitle, { variant: 'h6', children: descriptionText }), _jsx(StyledList, { children: flags?.map((flag) => (_jsx(ListItemButton, { id: `flagListItem-${flag}`, selected: selectedFlag === flag, onClick: handleSelect(flag), children: _jsx(ListItemText, { primary: flagToString(flag) }) }, flag))) })] }), _jsxs(DialogActions, { children: [_jsx(Button, { onClick: onClose, variant: 'text', children: cancelButtonText }), _jsx(Button, { color: 'error', onClick: () => onFlag(selectedFlag), disabled: !selectedFlag, children: confirmButtonText })] })] }));
|
|
24
|
+
};
|
|
25
|
+
export default ItemFlagDialog;
|