@manuscripts/style-guide 3.0.2-LEAN-4579.0 → 3.0.2-LEAN-4614.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.
Files changed (15) hide show
  1. package/dist/cjs/components/Drawer.js +24 -13
  2. package/dist/cjs/components/StyledModal.js +1 -3
  3. package/dist/cjs/components/icons/danger.js +13 -0
  4. package/dist/cjs/components/icons/index.js +5 -5
  5. package/dist/es/components/Drawer.js +23 -12
  6. package/dist/es/components/StyledModal.js +1 -3
  7. package/dist/es/components/icons/danger.js +8 -0
  8. package/dist/es/components/icons/index.js +1 -1
  9. package/dist/types/components/Drawer.d.ts +11 -10
  10. package/dist/types/components/icons/danger.d.ts +4 -0
  11. package/dist/types/components/icons/index.d.ts +1 -1
  12. package/package.json +1 -1
  13. package/dist/cjs/components/icons/add-role.js +0 -11
  14. package/dist/es/components/icons/add-role.js +0 -6
  15. package/dist/types/components/icons/add-role.d.ts +0 -4
package/dist/cjs/components/Drawer.js CHANGED
@@ -26,9 +26,10 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
26
26
  return (mod && mod.__esModule) ? mod : { "default": mod };
27
27
  };
28
28
  Object.defineProperty(exports, "__esModule", { value: true });
29
- exports.Drawer = exports.DrawerItemMeta = exports.DrawerItemLabel = exports.DrawerLabelContainer = exports.DrawerIcon = exports.DrawerListItem = exports.DrawerItemsList = void 0;
29
+ exports.Drawer = void 0;
30
30
  const react_1 = __importDefault(require("react"));
31
31
  const styled_components_1 = __importStar(require("styled-components"));
32
+ const icons_1 = require("./icons");
32
33
  const slideIn = (0, styled_components_1.keyframes) `
33
34
  from {
34
35
  transform: translateX(100%);
@@ -39,7 +40,6 @@ const slideIn = (0, styled_components_1.keyframes) `
39
40
  `;
40
41
  const DrawerContainer = styled_components_1.default.div `
41
42
  width: ${(props) => props.width || '300px'};
42
- padding: 40px 0 0 0;
43
43
  background: ${(props) => props.theme.colors.background.primary};
44
44
  border-right: 1px solid ${(props) => props.theme.colors.border.secondary};
45
45
  height: 100%;
@@ -51,7 +51,7 @@ const DrawerContainer = styled_components_1.default.div `
51
51
  top: 0;
52
52
  z-index: 1;
53
53
  `;
54
- const DrawerBackButton = styled_components_1.default.button `
54
+ const BackButton = styled_components_1.default.button `
55
55
  padding: 8px 16px;
56
56
  border: none;
57
57
  background: none;
@@ -69,13 +69,13 @@ const DrawerBackButton = styled_components_1.default.button `
69
69
  opacity: 0.8;
70
70
  }
71
71
  `;
72
- exports.DrawerItemsList = styled_components_1.default.ul `
72
+ const ItemsList = styled_components_1.default.ul `
73
73
  list-style: none;
74
74
  padding: 0;
75
75
  margin: 0;
76
76
  overflow-y: auto;
77
77
  `;
78
- exports.DrawerListItem = styled_components_1.default.li `
78
+ const ListItem = styled_components_1.default.li `
79
79
  padding: 8px 16px;
80
80
  cursor: pointer;
81
81
  display: flex;
@@ -91,7 +91,7 @@ exports.DrawerListItem = styled_components_1.default.li `
91
91
  border-bottom: none;
92
92
  }
93
93
  `;
94
- exports.DrawerIcon = styled_components_1.default.span `
94
+ const Icon = styled_components_1.default.span `
95
95
  width: 20px;
96
96
  height: 20px;
97
97
  display: inline-flex;
@@ -99,36 +99,47 @@ exports.DrawerIcon = styled_components_1.default.span `
99
99
  justify-content: center;
100
100
  `;
101
101
  const DrawerTitle = styled_components_1.default.h2 `
102
- padding: 16px 16px 48px 16px;
102
+ padding: 8px 16px 6px 16px;
103
103
  margin: 0;
104
104
  font-weight: ${(props) => props.theme.font.weight.normal};
105
105
  font-size: ${(props) => props.theme.font.size.large};
106
106
  font-family: ${(props) => props.theme.font.family.sans};
107
107
  color: ${(props) => props.theme.colors.text.secondary};
108
108
  `;
109
- exports.DrawerLabelContainer = styled_components_1.default.div `
109
+ const LabelContainer = styled_components_1.default.div `
110
110
  display: flex;
111
111
  flex-direction: column;
112
112
  gap: 4px;
113
113
  `;
114
- exports.DrawerItemLabel = styled_components_1.default.span `
114
+ const ItemLabel = styled_components_1.default.span `
115
115
  font-weight: ${(props) => props.theme.font.weight.normal};
116
116
  font-size: ${(props) => props.theme.font.size.medium};
117
117
  font-family: ${(props) => props.theme.font.family.sans};
118
118
  color: ${(props) => props.theme.colors.text.primary};
119
119
  `;
120
- exports.DrawerItemMeta = styled_components_1.default.span `
120
+ const ItemMeta = styled_components_1.default.span `
121
121
  font-weight: ${(props) => props.theme.font.weight.normal};
122
122
  font-size: ${(props) => props.theme.font.size.small};
123
123
  font-family: ${(props) => props.theme.font.family.sans};
124
124
  color: ${(props) => props.theme.colors.text.secondary};
125
125
  `;
126
- const Drawer = ({ title, onBack, width, children, }) => {
126
+ const Drawer = ({ items, selectedIds = [], title, onSelect, onBack, width, }) => {
127
127
  return (react_1.default.createElement(DrawerContainer, { "data-cy": "drawer", width: width },
128
- react_1.default.createElement(DrawerBackButton, { onClick: onBack },
128
+ react_1.default.createElement(BackButton, { onClick: onBack },
129
129
  react_1.default.createElement("span", null, "\u2190"),
130
130
  "Back"),
131
131
  react_1.default.createElement(DrawerTitle, null, title),
132
- children));
132
+ react_1.default.createElement(ItemsList, null, items.map((item) => (react_1.default.createElement(ListItem, { "data-cy": "item", key: item.id, selected: selectedIds?.includes(item.id), onClick: () => onSelect(item.id) },
133
+ react_1.default.createElement(Icon, null, selectedIds?.includes(item.id) ? (react_1.default.createElement(icons_1.AddedIcon, { width: 22, height: 22 })) : (react_1.default.createElement(icons_1.AddIcon, { width: 22, height: 22 }))),
134
+ react_1.default.createElement(LabelContainer, null,
135
+ react_1.default.createElement(ItemLabel, null, item.label),
136
+ react_1.default.createElement(ItemMeta, null,
137
+ item.city && (react_1.default.createElement(react_1.default.Fragment, null,
138
+ item.city,
139
+ item.state || item.country ? ', ' : '')),
140
+ item.state && (react_1.default.createElement(react_1.default.Fragment, null,
141
+ item.state,
142
+ item.country ? ', ' : '')),
143
+ item.country && react_1.default.createElement(react_1.default.Fragment, null, item.country)))))))));
133
144
  };
134
145
  exports.Drawer = Drawer;
package/dist/cjs/components/StyledModal.js CHANGED
@@ -49,12 +49,11 @@ exports.ModalHeader = styled_components_1.default.div `
49
49
  position: absolute;
50
50
  right: 0;
51
51
  top: 0;
52
- z-index: 3;
52
+ z-index: 1;
53
53
  `;
54
54
  exports.CloseButton = (0, styled_components_1.default)(Button_1.RoundIconButton) `
55
55
  box-shadow: none;
56
56
  text-indent: -99999px;
57
- z-index: 2;
58
57
 
59
58
  ::before,
60
59
  ::after {
@@ -113,7 +112,6 @@ exports.ModelContent = styled_components_1.default.div `
113
112
  `;
114
113
  exports.ScrollableModalContent = (0, styled_components_1.default)(exports.ModelContent) `
115
114
  overflow-y: auto;
116
- max-height: 100%;
117
115
  `;
118
116
  exports.StyledModal = (0, styled_components_1.default)(ReactModalAdapter).attrs({
119
117
  closeTimeoutMS: totalTransitionTime,
package/dist/cjs/components/icons/danger.js ADDED
@@ -0,0 +1,13 @@
1
+ "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
5
+ Object.defineProperty(exports, "__esModule", { value: true });
6
+ const react_1 = __importDefault(require("react"));
7
+ const DangerIcon = (props) => (react_1.default.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", ...props },
8
+ react_1.default.createElement("g", { clipPath: "url(#clip0_32980_20006)" },
9
+ react_1.default.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M8 1C11.866 1 15 4.134 15 8C15 11.866 11.866 15 8 15C4.134 15 1 11.866 1 8C1 4.134 4.13333 1 8 1ZM8 0C12.418 0 16 3.582 16 8C16 12.418 12.418 16 8 16C3.582 16 0 12.418 0 8C0 3.582 3.58133 0 8 0ZM8 10.8C7.82319 10.8 7.65362 10.8702 7.5286 10.9953C7.40357 11.1203 7.33333 11.2899 7.33333 11.4667C7.33333 11.6435 7.40357 11.813 7.5286 11.9381C7.65362 12.0631 7.82319 12.1333 8 12.1333C8.17681 12.1333 8.34638 12.0631 8.47141 11.9381C8.59643 11.813 8.66667 11.6435 8.66667 11.4667C8.66667 11.2899 8.59643 11.1203 8.47141 10.9953C8.34638 10.8702 8.17681 10.8 8 10.8ZM8.01333 4C7.8542 4 7.70159 4.06321 7.58907 4.17574C7.47655 4.28826 7.41333 4.44087 7.41333 4.6V9.4C7.41333 9.55913 7.47655 9.71174 7.58907 9.82426C7.70159 9.93679 7.8542 10 8.01333 10C8.17246 10 8.32508 9.93679 8.4376 9.82426C8.55012 9.71174 8.61333 9.55913 8.61333 9.4V4.6C8.61333 4.44087 8.55012 4.28826 8.4376 4.17574C8.32508 4.06321 8.17246 4 8.01333 4Z", fill: "#353535" })),
10
+ react_1.default.createElement("defs", null,
11
+ react_1.default.createElement("clipPath", { id: "clip0_32980_20006" },
12
+ react_1.default.createElement("rect", { width: "16", height: "16", fill: "white" })))));
13
+ exports.default = DangerIcon;
package/dist/cjs/components/icons/index.js CHANGED
@@ -18,9 +18,9 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
18
18
  return (mod && mod.__esModule) ? mod : { "default": mod };
19
19
  };
20
20
  Object.defineProperty(exports, "__esModule", { value: true });
21
- exports.FileVideoIcon = exports.FileUnknownIcon = exports.FileTableIcon = exports.FilePdfIcon = exports.FileMainDocumentIcon = exports.FileLatexIcon = exports.FileImageIcon = exports.FileGraphicalAbstractIcon = exports.FileFigureIcon = exports.FileDocumentIcon = exports.FileCorruptedIcon = exports.FileCompressedIcon = exports.FileCodeIcon = exports.FileAudioIcon = exports.EditAttrsTrackingIcon = exports.EditIcon = exports.DraggableIcon = exports.DotsIcon = exports.DeleteIcon = exports.DeleteSolidIcon = exports.CorrespondingAuthorIcon = exports.CommentIcon = exports.CommentResolveIcon = exports.CommentReplyIcon = exports.CitationCountIcon = exports.SystemUserAvatarIcon = exports.ChatIcon = exports.BookIcon = exports.AffiliationPlaceholderIcon = exports.AuthorPlaceholderIcon = exports.AffiliationIcon = exports.AlertIcon = exports.AvatarIcon = exports.AttentionRedIcon = exports.AttentionOrangeIcon = exports.AttentionGreenIcon = exports.AttentionBlueIcon = exports.AttachIcon = exports.ArrowUpIcon = exports.ArrowLeftIcon = exports.ArrowDownCircleIcon = exports.ArrowDownIcon = exports.AddRoleIcon = exports.AddIcon = exports.AddOutlineIcon = exports.AddNewIcon = exports.AddedIcon = exports.AddFigureIcon = exports.AddCommentIcon = exports.AddAuthorIcon = void 0;
22
- exports.ToolbarUnindentIcon = exports.ToolbarIndentIcon = exports.ToolbarUnorderedListIcon = exports.ToolbarUnderlineIcon = exports.ToolbarTableIcon = exports.ToolbarSymbolIcon = exports.ToolbarSuperscriptIcon = exports.ToolbarSubscriptIcon = exports.ToolbarOrderedListIcon = exports.ToolbarItalicIcon = exports.ToolbarFigureIcon = exports.ToolbarEquationIcon = exports.ToolbarCodeIcon = exports.ToolbarCitationIcon = exports.ToolbarBoldIcon = exports.TickIcon = exports.TaskStepDoneIcon = exports.SliderOnIcon = exports.SliderOffIcon = exports.SectionCategoryIcon = exports.SearchIcon = exports.ScrollIcon = exports.SaveStatusSavingIcon = exports.SaveStatusSavedIcon = exports.SaveStatusOfflineIcon = exports.RoleReadingIcon = exports.RoleAnnotatingIcon = exports.PlusIcon = exports.OutlineUnorderedListIcon = exports.OutlineTableIcon = exports.OutlineSectionIcon = exports.OutlinePullQuoteIcon = exports.OutlineParagraphIcon = exports.OutlineOrderedListIcon = exports.OutlineManuscriptIcon = exports.OutlineFigureIcon = exports.OutlineEmbedIcon = exports.OutlineEquationIcon = exports.OutlineCodeIcon = exports.OutlineBlockQuoteIcon = exports.ManuscriptIcon = exports.LogoutIcon = exports.LockIcon = exports.LinkIcon = exports.ImageRightIcon = exports.ImageDefaultIcon = exports.ImageLeftIcon = exports.HelpIcon = exports.HandleOutlineIcon = exports.HandleInspectorIcon = void 0;
23
- exports.AddInstitutionIcon = exports.AddUserIcon = exports.ProfileIcon = exports.CrclTickAnimation = exports.VerticalEllipsisIcon = exports.UploadIcon = exports.TriangleExpandedIcon = exports.TriangleCollapsedIcon = void 0;
21
+ exports.HandleInspectorIcon = exports.FileVideoIcon = exports.FileUnknownIcon = exports.FileTableIcon = exports.FilePdfIcon = exports.FileMainDocumentIcon = exports.FileLatexIcon = exports.FileImageIcon = exports.FileGraphicalAbstractIcon = exports.FileFigureIcon = exports.FileDocumentIcon = exports.FileCorruptedIcon = exports.FileCompressedIcon = exports.FileCodeIcon = exports.FileAudioIcon = exports.EditAttrsTrackingIcon = exports.EditIcon = exports.DraggableIcon = exports.DotsIcon = exports.DeleteIcon = exports.DeleteSolidIcon = exports.CorrespondingAuthorIcon = exports.CommentIcon = exports.CommentResolveIcon = exports.CommentReplyIcon = exports.CitationCountIcon = exports.SystemUserAvatarIcon = exports.ChatIcon = exports.BookIcon = exports.AffiliationPlaceholderIcon = exports.AuthorPlaceholderIcon = exports.AffiliationIcon = exports.AlertIcon = exports.AvatarIcon = exports.AttentionRedIcon = exports.AttentionOrangeIcon = exports.AttentionGreenIcon = exports.AttentionBlueIcon = exports.AttachIcon = exports.ArrowUpIcon = exports.ArrowLeftIcon = exports.ArrowDownCircleIcon = exports.ArrowDownIcon = exports.AddIcon = exports.AddOutlineIcon = exports.AddNewIcon = exports.AddedIcon = exports.AddFigureIcon = exports.AddCommentIcon = exports.AddAuthorIcon = void 0;
22
+ exports.TriangleCollapsedIcon = exports.ToolbarUnindentIcon = exports.ToolbarIndentIcon = exports.ToolbarUnorderedListIcon = exports.ToolbarUnderlineIcon = exports.ToolbarTableIcon = exports.ToolbarSymbolIcon = exports.ToolbarSuperscriptIcon = exports.ToolbarSubscriptIcon = exports.ToolbarOrderedListIcon = exports.ToolbarItalicIcon = exports.ToolbarFigureIcon = exports.ToolbarEquationIcon = exports.ToolbarCodeIcon = exports.ToolbarCitationIcon = exports.ToolbarBoldIcon = exports.TickIcon = exports.TaskStepDoneIcon = exports.SliderOnIcon = exports.SliderOffIcon = exports.SectionCategoryIcon = exports.SearchIcon = exports.ScrollIcon = exports.SaveStatusSavingIcon = exports.SaveStatusSavedIcon = exports.SaveStatusOfflineIcon = exports.RoleReadingIcon = exports.RoleAnnotatingIcon = exports.PlusIcon = exports.OutlineUnorderedListIcon = exports.OutlineTableIcon = exports.OutlineSectionIcon = exports.OutlinePullQuoteIcon = exports.OutlineParagraphIcon = exports.OutlineOrderedListIcon = exports.OutlineManuscriptIcon = exports.OutlineFigureIcon = exports.OutlineEmbedIcon = exports.OutlineEquationIcon = exports.OutlineCodeIcon = exports.OutlineBlockQuoteIcon = exports.ManuscriptIcon = exports.LogoutIcon = exports.LockIcon = exports.LinkIcon = exports.ImageRightIcon = exports.ImageDefaultIcon = exports.ImageLeftIcon = exports.HelpIcon = exports.HandleOutlineIcon = void 0;
23
+ exports.DangerIcon = exports.AddInstitutionIcon = exports.AddUserIcon = exports.ProfileIcon = exports.CrclTickAnimation = exports.VerticalEllipsisIcon = exports.UploadIcon = exports.TriangleExpandedIcon = void 0;
24
24
  var add_author_1 = require("./add-author");
25
25
  Object.defineProperty(exports, "AddAuthorIcon", { enumerable: true, get: function () { return __importDefault(add_author_1).default; } });
26
26
  var add_comment_1 = require("./add-comment");
@@ -35,8 +35,6 @@ var add_outline_1 = require("./add-outline");
35
35
  Object.defineProperty(exports, "AddOutlineIcon", { enumerable: true, get: function () { return __importDefault(add_outline_1).default; } });
36
36
  var add_1 = require("./add");
37
37
  Object.defineProperty(exports, "AddIcon", { enumerable: true, get: function () { return __importDefault(add_1).default; } });
38
- var add_role_1 = require("./add-role");
39
- Object.defineProperty(exports, "AddRoleIcon", { enumerable: true, get: function () { return __importDefault(add_role_1).default; } });
40
38
  var arrow_down_1 = require("./arrow-down");
41
39
  Object.defineProperty(exports, "ArrowDownIcon", { enumerable: true, get: function () { return __importDefault(arrow_down_1).default; } });
42
40
  var arrow_down_circle_1 = require("./arrow-down-circle");
@@ -237,3 +235,5 @@ var add_user_1 = require("./add-user");
237
235
  Object.defineProperty(exports, "AddUserIcon", { enumerable: true, get: function () { return __importDefault(add_user_1).default; } });
238
236
  var add_institution_1 = require("./add-institution");
239
237
  Object.defineProperty(exports, "AddInstitutionIcon", { enumerable: true, get: function () { return __importDefault(add_institution_1).default; } });
238
+ var danger_1 = require("./danger");
239
+ Object.defineProperty(exports, "DangerIcon", { enumerable: true, get: function () { return __importDefault(danger_1).default; } });
package/dist/es/components/Drawer.js CHANGED
@@ -1,5 +1,6 @@
1
1
  import React from 'react';
2
2
  import styled, { keyframes } from 'styled-components';
3
+ import { AddedIcon, AddIcon } from './icons';
3
4
  const slideIn = keyframes `
4
5
  from {
5
6
  transform: translateX(100%);
@@ -10,7 +11,6 @@ const slideIn = keyframes `
10
11
  `;
11
12
  const DrawerContainer = styled.div `
12
13
  width: ${(props) => props.width || '300px'};
13
- padding: 40px 0 0 0;
14
14
  background: ${(props) => props.theme.colors.background.primary};
15
15
  border-right: 1px solid ${(props) => props.theme.colors.border.secondary};
16
16
  height: 100%;
@@ -22,7 +22,7 @@ const DrawerContainer = styled.div `
22
22
  top: 0;
23
23
  z-index: 1;
24
24
  `;
25
- const DrawerBackButton = styled.button `
25
+ const BackButton = styled.button `
26
26
  padding: 8px 16px;
27
27
  border: none;
28
28
  background: none;
@@ -40,13 +40,13 @@ const DrawerBackButton = styled.button `
40
40
  opacity: 0.8;
41
41
  }
42
42
  `;
43
- export const DrawerItemsList = styled.ul `
43
+ const ItemsList = styled.ul `
44
44
  list-style: none;
45
45
  padding: 0;
46
46
  margin: 0;
47
47
  overflow-y: auto;
48
48
  `;
49
- export const DrawerListItem = styled.li `
49
+ const ListItem = styled.li `
50
50
  padding: 8px 16px;
51
51
  cursor: pointer;
52
52
  display: flex;
@@ -62,7 +62,7 @@ export const DrawerListItem = styled.li `
62
62
  border-bottom: none;
63
63
  }
64
64
  `;
65
- export const DrawerIcon = styled.span `
65
+ const Icon = styled.span `
66
66
  width: 20px;
67
67
  height: 20px;
68
68
  display: inline-flex;
@@ -70,35 +70,46 @@ export const DrawerIcon = styled.span `
70
70
  justify-content: center;
71
71
  `;
72
72
  const DrawerTitle = styled.h2 `
73
- padding: 16px 16px 48px 16px;
73
+ padding: 8px 16px 6px 16px;
74
74
  margin: 0;
75
75
  font-weight: ${(props) => props.theme.font.weight.normal};
76
76
  font-size: ${(props) => props.theme.font.size.large};
77
77
  font-family: ${(props) => props.theme.font.family.sans};
78
78
  color: ${(props) => props.theme.colors.text.secondary};
79
79
  `;
80
- export const DrawerLabelContainer = styled.div `
80
+ const LabelContainer = styled.div `
81
81
  display: flex;
82
82
  flex-direction: column;
83
83
  gap: 4px;
84
84
  `;
85
- export const DrawerItemLabel = styled.span `
85
+ const ItemLabel = styled.span `
86
86
  font-weight: ${(props) => props.theme.font.weight.normal};
87
87
  font-size: ${(props) => props.theme.font.size.medium};
88
88
  font-family: ${(props) => props.theme.font.family.sans};
89
89
  color: ${(props) => props.theme.colors.text.primary};
90
90
  `;
91
- export const DrawerItemMeta = styled.span `
91
+ const ItemMeta = styled.span `
92
92
  font-weight: ${(props) => props.theme.font.weight.normal};
93
93
  font-size: ${(props) => props.theme.font.size.small};
94
94
  font-family: ${(props) => props.theme.font.family.sans};
95
95
  color: ${(props) => props.theme.colors.text.secondary};
96
96
  `;
97
- export const Drawer = ({ title, onBack, width, children, }) => {
97
+ export const Drawer = ({ items, selectedIds = [], title, onSelect, onBack, width, }) => {
98
98
  return (React.createElement(DrawerContainer, { "data-cy": "drawer", width: width },
99
- React.createElement(DrawerBackButton, { onClick: onBack },
99
+ React.createElement(BackButton, { onClick: onBack },
100
100
  React.createElement("span", null, "\u2190"),
101
101
  "Back"),
102
102
  React.createElement(DrawerTitle, null, title),
103
- children));
103
+ React.createElement(ItemsList, null, items.map((item) => (React.createElement(ListItem, { "data-cy": "item", key: item.id, selected: selectedIds?.includes(item.id), onClick: () => onSelect(item.id) },
104
+ React.createElement(Icon, null, selectedIds?.includes(item.id) ? (React.createElement(AddedIcon, { width: 22, height: 22 })) : (React.createElement(AddIcon, { width: 22, height: 22 }))),
105
+ React.createElement(LabelContainer, null,
106
+ React.createElement(ItemLabel, null, item.label),
107
+ React.createElement(ItemMeta, null,
108
+ item.city && (React.createElement(React.Fragment, null,
109
+ item.city,
110
+ item.state || item.country ? ', ' : '')),
111
+ item.state && (React.createElement(React.Fragment, null,
112
+ item.state,
113
+ item.country ? ', ' : '')),
114
+ item.country && React.createElement(React.Fragment, null, item.country)))))))));
104
115
  };
package/dist/es/components/StyledModal.js CHANGED
@@ -43,12 +43,11 @@ export const ModalHeader = styled.div `
43
43
  position: absolute;
44
44
  right: 0;
45
45
  top: 0;
46
- z-index: 3;
46
+ z-index: 1;
47
47
  `;
48
48
  export const CloseButton = styled(RoundIconButton) `
49
49
  box-shadow: none;
50
50
  text-indent: -99999px;
51
- z-index: 2;
52
51
 
53
52
  ::before,
54
53
  ::after {
@@ -107,7 +106,6 @@ export const ModelContent = styled.div `
107
106
  `;
108
107
  export const ScrollableModalContent = styled(ModelContent) `
109
108
  overflow-y: auto;
110
- max-height: 100%;
111
109
  `;
112
110
  export const StyledModal = styled(ReactModalAdapter).attrs({
113
111
  closeTimeoutMS: totalTransitionTime,
package/dist/es/components/icons/danger.js ADDED
@@ -0,0 +1,8 @@
1
+ import React from 'react';
2
+ const DangerIcon = (props) => (React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", ...props },
3
+ React.createElement("g", { clipPath: "url(#clip0_32980_20006)" },
4
+ React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M8 1C11.866 1 15 4.134 15 8C15 11.866 11.866 15 8 15C4.134 15 1 11.866 1 8C1 4.134 4.13333 1 8 1ZM8 0C12.418 0 16 3.582 16 8C16 12.418 12.418 16 8 16C3.582 16 0 12.418 0 8C0 3.582 3.58133 0 8 0ZM8 10.8C7.82319 10.8 7.65362 10.8702 7.5286 10.9953C7.40357 11.1203 7.33333 11.2899 7.33333 11.4667C7.33333 11.6435 7.40357 11.813 7.5286 11.9381C7.65362 12.0631 7.82319 12.1333 8 12.1333C8.17681 12.1333 8.34638 12.0631 8.47141 11.9381C8.59643 11.813 8.66667 11.6435 8.66667 11.4667C8.66667 11.2899 8.59643 11.1203 8.47141 10.9953C8.34638 10.8702 8.17681 10.8 8 10.8ZM8.01333 4C7.8542 4 7.70159 4.06321 7.58907 4.17574C7.47655 4.28826 7.41333 4.44087 7.41333 4.6V9.4C7.41333 9.55913 7.47655 9.71174 7.58907 9.82426C7.70159 9.93679 7.8542 10 8.01333 10C8.17246 10 8.32508 9.93679 8.4376 9.82426C8.55012 9.71174 8.61333 9.55913 8.61333 9.4V4.6C8.61333 4.44087 8.55012 4.28826 8.4376 4.17574C8.32508 4.06321 8.17246 4 8.01333 4Z", fill: "#353535" })),
5
+ React.createElement("defs", null,
6
+ React.createElement("clipPath", { id: "clip0_32980_20006" },
7
+ React.createElement("rect", { width: "16", height: "16", fill: "white" })))));
8
+ export default DangerIcon;
package/dist/es/components/icons/index.js CHANGED
@@ -20,7 +20,6 @@ export { default as AddedIcon } from './added';
20
20
  export { default as AddNewIcon } from './add-new';
21
21
  export { default as AddOutlineIcon } from './add-outline';
22
22
  export { default as AddIcon } from './add';
23
- export { default as AddRoleIcon } from './add-role';
24
23
  export { default as ArrowDownIcon } from './arrow-down';
25
24
  export { default as ArrowDownCircleIcon } from './arrow-down-circle';
26
25
  export { default as ArrowLeftIcon } from './arrow-left';
@@ -121,3 +120,4 @@ export { default as CrclTickAnimation } from './circle-tick-animation';
121
120
  export { default as ProfileIcon } from './profile-avatar';
122
121
  export { default as AddUserIcon } from './add-user';
123
122
  export { default as AddInstitutionIcon } from './add-institution';
123
+ export { default as DangerIcon } from './danger';
package/dist/types/components/Drawer.d.ts CHANGED
@@ -1,16 +1,17 @@
1
1
  import React from 'react';
2
- export interface DrawerProps {
2
+ interface DrawerProps {
3
+ items: Array<{
4
+ id: string;
5
+ label: string;
6
+ country?: string;
7
+ city?: string;
8
+ state?: string;
9
+ }>;
10
+ selectedIds?: string[];
3
11
  title: string;
12
+ onSelect: (id: string) => void;
4
13
  onBack: () => void;
5
14
  width?: string;
6
- children: React.ReactNode;
7
15
  }
8
- export declare const DrawerItemsList: import("styled-components").StyledComponent<"ul", import("styled-components").DefaultTheme, {}, never>;
9
- export declare const DrawerListItem: import("styled-components").StyledComponent<"li", import("styled-components").DefaultTheme, {
10
- selected?: boolean | undefined;
11
- }, never>;
12
- export declare const DrawerIcon: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, {}, never>;
13
- export declare const DrawerLabelContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
14
- export declare const DrawerItemLabel: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, {}, never>;
15
- export declare const DrawerItemMeta: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, {}, never>;
16
16
  export declare const Drawer: React.FC<DrawerProps>;
17
+ export {};
package/dist/types/components/icons/danger.d.ts ADDED
@@ -0,0 +1,4 @@
1
+ import React from 'react';
2
+ import { IconProps } from './types';
3
+ declare const DangerIcon: (props: IconProps) => React.JSX.Element;
4
+ export default DangerIcon;
package/dist/types/components/icons/index.d.ts CHANGED
@@ -20,7 +20,6 @@ export { default as AddedIcon } from './added';
20
20
  export { default as AddNewIcon } from './add-new';
21
21
  export { default as AddOutlineIcon } from './add-outline';
22
22
  export { default as AddIcon } from './add';
23
- export { default as AddRoleIcon } from './add-role';
24
23
  export { default as ArrowDownIcon } from './arrow-down';
25
24
  export { default as ArrowDownCircleIcon } from './arrow-down-circle';
26
25
  export { default as ArrowLeftIcon } from './arrow-left';
@@ -121,3 +120,4 @@ export { default as CrclTickAnimation } from './circle-tick-animation';
121
120
  export { default as ProfileIcon } from './profile-avatar';
122
121
  export { default as AddUserIcon } from './add-user';
123
122
  export { default as AddInstitutionIcon } from './add-institution';
123
+ export { default as DangerIcon } from './danger';
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@manuscripts/style-guide",
3
3
  "description": "Shared components for Manuscripts applications",
4
- "version": "3.0.2-LEAN-4579.0",
4
+ "version": "3.0.2-LEAN-4614.0",
5
5
  "repository": "github:Atypon-OpenSource/manuscripts-style-guide",
6
6
  "license": "Apache-2.0",
7
7
  "main": "dist/cjs",
package/dist/cjs/components/icons/add-role.js DELETED
@@ -1,11 +0,0 @@
1
- "use strict";
2
- var __importDefault = (this && this.__importDefault) || function (mod) {
3
- return (mod && mod.__esModule) ? mod : { "default": mod };
4
- };
5
- Object.defineProperty(exports, "__esModule", { value: true });
6
- const react_1 = __importDefault(require("react"));
7
- const AddRoleIcon = (props) => (react_1.default.createElement("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props },
8
- react_1.default.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M5.00688 7.74367C5.14845 7.98076 5.07101 8.28773 4.83392 8.42929C3.8872 8.99458 3.31472 9.23561 2.90515 9.40805C2.87244 9.42182 2.84077 9.43516 2.81003 9.44818C2.43279 9.60806 2.23693 9.70285 1.90606 10.0406C1.80749 10.1412 1.7037 10.3521 1.62666 10.6937C1.55288 11.0208 1.51732 11.4038 1.50512 11.7802C1.49301 12.1538 1.50432 12.5058 1.51886 12.7655C1.5261 12.8948 1.53409 13.0002 1.5402 13.0726C1.54039 13.0748 1.54057 13.077 1.54075 13.0791C1.5571 13.0965 1.58434 13.1215 1.62852 13.1526C1.72502 13.2205 1.87112 13.2957 2.07447 13.3717C2.48086 13.5237 3.04678 13.6542 3.72897 13.756C5.08851 13.959 6.82749 14.0364 8.48424 13.9842C8.76025 13.9755 8.99105 14.1922 8.99975 14.4682C9.00846 14.7442 8.79177 14.975 8.51576 14.9837C6.81518 15.0373 5.01419 14.959 3.58133 14.7451C2.86732 14.6385 2.22392 14.4953 1.72416 14.3084C1.47445 14.215 1.24327 14.1044 1.05281 13.9703C0.865818 13.8386 0.682404 13.6591 0.587339 13.416C0.571134 13.3746 0.560531 13.3312 0.555811 13.287L1.05299 13.2339C0.555811 13.287 0.555811 13.287 0.555811 13.287L0.555471 13.2837L0.554734 13.2766L0.552195 13.2508C0.550072 13.2287 0.54714 13.197 0.543741 13.1567C0.536946 13.0762 0.52826 12.9613 0.520422 12.8214C0.504795 12.5423 0.492303 12.1594 0.505648 11.7478C0.518906 11.3388 0.55807 10.8864 0.651169 10.4736C0.741001 10.0754 0.896249 9.64235 1.19176 9.34073C1.64906 8.87397 1.9757 8.71567 2.41983 8.52745C2.45104 8.51423 2.48302 8.50077 2.51589 8.48693C2.91031 8.32093 3.43386 8.10057 4.32126 7.5707C4.55835 7.42914 4.86532 7.50657 5.00688 7.74367ZM9.99312 7.74367C10.1347 7.50658 10.4417 7.42914 10.6787 7.5707C11.3743 7.98602 11.8461 8.21084 12.2004 8.36581C12.4534 8.47647 12.5688 8.77128 12.4581 9.02427C12.3474 9.27727 12.0526 9.39266 11.7996 9.282C11.4098 9.1115 10.9004 8.86775 10.1661 8.42929C9.92899 8.28773 9.85155 7.98076 9.99312 7.74367Z", fill: "#0D79D0" }),
9
- react_1.default.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M7.5 7C9.15685 7 10.5 5.65685 10.5 4C10.5 2.34315 9.15685 1 7.5 1C5.84315 1 4.5 2.34315 4.5 4C4.5 5.65685 5.84315 7 7.5 7ZM7.5 8C9.70914 8 11.5 6.20914 11.5 4C11.5 1.79086 9.70914 0 7.5 0C5.29086 0 3.5 1.79086 3.5 4C3.5 6.20914 5.29086 8 7.5 8Z", fill: "#0D79D0" }),
10
- react_1.default.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M13.25 13.75V15.25C13.25 15.6642 12.9142 16 12.5 16C12.0858 16 11.75 15.6642 11.75 15.25V13.75H10.25C9.83579 13.75 9.5 13.4142 9.5 13C9.5 12.5858 9.83579 12.25 10.25 12.25H11.75V10.75C11.75 10.3358 12.0858 10 12.5 10C12.9142 10 13.25 10.3358 13.25 10.75V12.25H14.75C15.1642 12.25 15.5 12.5858 15.5 13C15.5 13.4142 15.1642 13.75 14.75 13.75H13.25Z", fill: "#0D79D0" })));
11
- exports.default = AddRoleIcon;
package/dist/es/components/icons/add-role.js DELETED
@@ -1,6 +0,0 @@
1
- import React from 'react';
2
- const AddRoleIcon = (props) => (React.createElement("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props },
3
- React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M5.00688 7.74367C5.14845 7.98076 5.07101 8.28773 4.83392 8.42929C3.8872 8.99458 3.31472 9.23561 2.90515 9.40805C2.87244 9.42182 2.84077 9.43516 2.81003 9.44818C2.43279 9.60806 2.23693 9.70285 1.90606 10.0406C1.80749 10.1412 1.7037 10.3521 1.62666 10.6937C1.55288 11.0208 1.51732 11.4038 1.50512 11.7802C1.49301 12.1538 1.50432 12.5058 1.51886 12.7655C1.5261 12.8948 1.53409 13.0002 1.5402 13.0726C1.54039 13.0748 1.54057 13.077 1.54075 13.0791C1.5571 13.0965 1.58434 13.1215 1.62852 13.1526C1.72502 13.2205 1.87112 13.2957 2.07447 13.3717C2.48086 13.5237 3.04678 13.6542 3.72897 13.756C5.08851 13.959 6.82749 14.0364 8.48424 13.9842C8.76025 13.9755 8.99105 14.1922 8.99975 14.4682C9.00846 14.7442 8.79177 14.975 8.51576 14.9837C6.81518 15.0373 5.01419 14.959 3.58133 14.7451C2.86732 14.6385 2.22392 14.4953 1.72416 14.3084C1.47445 14.215 1.24327 14.1044 1.05281 13.9703C0.865818 13.8386 0.682404 13.6591 0.587339 13.416C0.571134 13.3746 0.560531 13.3312 0.555811 13.287L1.05299 13.2339C0.555811 13.287 0.555811 13.287 0.555811 13.287L0.555471 13.2837L0.554734 13.2766L0.552195 13.2508C0.550072 13.2287 0.54714 13.197 0.543741 13.1567C0.536946 13.0762 0.52826 12.9613 0.520422 12.8214C0.504795 12.5423 0.492303 12.1594 0.505648 11.7478C0.518906 11.3388 0.55807 10.8864 0.651169 10.4736C0.741001 10.0754 0.896249 9.64235 1.19176 9.34073C1.64906 8.87397 1.9757 8.71567 2.41983 8.52745C2.45104 8.51423 2.48302 8.50077 2.51589 8.48693C2.91031 8.32093 3.43386 8.10057 4.32126 7.5707C4.55835 7.42914 4.86532 7.50657 5.00688 7.74367ZM9.99312 7.74367C10.1347 7.50658 10.4417 7.42914 10.6787 7.5707C11.3743 7.98602 11.8461 8.21084 12.2004 8.36581C12.4534 8.47647 12.5688 8.77128 12.4581 9.02427C12.3474 9.27727 12.0526 9.39266 11.7996 9.282C11.4098 9.1115 10.9004 8.86775 10.1661 8.42929C9.92899 8.28773 9.85155 7.98076 9.99312 7.74367Z", fill: "#0D79D0" }),
4
- React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M7.5 7C9.15685 7 10.5 5.65685 10.5 4C10.5 2.34315 9.15685 1 7.5 1C5.84315 1 4.5 2.34315 4.5 4C4.5 5.65685 5.84315 7 7.5 7ZM7.5 8C9.70914 8 11.5 6.20914 11.5 4C11.5 1.79086 9.70914 0 7.5 0C5.29086 0 3.5 1.79086 3.5 4C3.5 6.20914 5.29086 8 7.5 8Z", fill: "#0D79D0" }),
5
- React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M13.25 13.75V15.25C13.25 15.6642 12.9142 16 12.5 16C12.0858 16 11.75 15.6642 11.75 15.25V13.75H10.25C9.83579 13.75 9.5 13.4142 9.5 13C9.5 12.5858 9.83579 12.25 10.25 12.25H11.75V10.75C11.75 10.3358 12.0858 10 12.5 10C12.9142 10 13.25 10.3358 13.25 10.75V12.25H14.75C15.1642 12.25 15.5 12.5858 15.5 13C15.5 13.4142 15.1642 13.75 14.75 13.75H13.25Z", fill: "#0D79D0" })));
6
- export default AddRoleIcon;
package/dist/types/components/icons/add-role.d.ts DELETED
@@ -1,4 +0,0 @@
1
- import React from 'react';
2
- import { IconProps } from './types';
3
- declare const AddRoleIcon: React.FC<IconProps>;
4
- export default AddRoleIcon;