@manuscripts/style-guide 1.8.0-LEAN-3423-3 → 1.8.0-LEAN-3423-5

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.
@@ -38,7 +38,7 @@ var __importStar = (this && this.__importStar) || function (mod) {
38
38
  return result;
39
39
  };
40
40
  Object.defineProperty(exports, "__esModule", { value: true });
41
- exports.ButtonGroup = exports.SecondaryIconButton = exports.RoundIconButton = exports.IconButton = exports.ToggleButtonAlt = exports.ToggleButton = exports.IconTextButton = exports.TertiaryButton = exports.PrimaryButton = exports.SecondaryButton = void 0;
41
+ exports.IconButtonGroup = exports.ButtonGroup = exports.SecondaryIconButton = exports.RoundIconButton = exports.IconButton = exports.ToggleButtonAlt = exports.ToggleButton = exports.IconTextButton = exports.TertiaryButton = exports.PrimaryButton = exports.SecondaryButton = void 0;
42
42
  const styled_components_1 = __importStar(require("styled-components"));
43
43
  const dangerBtnStyles = (0, styled_components_1.css) `
44
44
  ${(props) => btnColors(props.theme.colors.button.error.color.default, props.theme.colors.button.error.background.default, props.theme.colors.button.error.border.default, true)}
@@ -288,3 +288,14 @@ exports.ButtonGroup = styled_components_1.default.div `
288
288
  margin-left: ${(props) => props.theme.grid.unit}px;
289
289
  }
290
290
  `;
291
+ exports.IconButtonGroup = styled_components_1.default.div `
292
+ display: flex;
293
+ flex-direction: row;
294
+ justify-content: flex-start;
295
+ align-items: center;
296
+
297
+ button {
298
+ width: 28px;
299
+ height: 28px;
300
+ }
301
+ `;
@@ -0,0 +1,52 @@
1
+ "use strict";
2
+ /*!
3
+ * © 2024 Atypon Systems LLC
4
+ *
5
+ * Licensed under the Apache License, Version 2.0 (the "License");
6
+ * you may not use this file except in compliance with the License.
7
+ * You may obtain a copy of the License at
8
+ *
9
+ * http://www.apache.org/licenses/LICENSE-2.0
10
+ *
11
+ * Unless required by applicable law or agreed to in writing, software
12
+ * distributed under the License is distributed on an "AS IS" BASIS,
13
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
14
+ * See the License for the specific language governing permissions and
15
+ * limitations under the License.
16
+ */
17
+ var __importDefault = (this && this.__importDefault) || function (mod) {
18
+ return (mod && mod.__esModule) ? mod : { "default": mod };
19
+ };
20
+ Object.defineProperty(exports, "__esModule", { value: true });
21
+ exports.ContextMenu = void 0;
22
+ const react_1 = __importDefault(require("react"));
23
+ const styled_components_1 = __importDefault(require("styled-components"));
24
+ const Button_1 = require("./Button");
25
+ const icons_1 = require("./icons");
26
+ const Tooltip_1 = require("./Tooltip");
27
+ const ContextMenuIconButton = (0, styled_components_1.default)(Button_1.IconButton) `
28
+ color: #6e6e6e;
29
+ &:not([disabled]):hover,
30
+ &:not([disabled]):focus {
31
+ color: #363636;
32
+ background-color: #f2f2f2;
33
+ border-color: #f2f2f2;
34
+ }
35
+ `;
36
+ const ContextMenu = ({ actions }) => {
37
+ const IconSelector = ({ iconName }) => {
38
+ const icons = {
39
+ AddComment: icons_1.AddComment,
40
+ EditIcon: icons_1.EditIcon,
41
+ };
42
+ const Icon = icons[iconName];
43
+ return react_1.default.createElement(Icon, null);
44
+ };
45
+ return (react_1.default.createElement(react_1.default.Fragment, null,
46
+ react_1.default.createElement(Button_1.IconButtonGroup, null, actions.map((action) => {
47
+ return (react_1.default.createElement(ContextMenuIconButton, { key: action.icon, "data-tooltip-id": action.icon, onClick: action.action },
48
+ react_1.default.createElement(IconSelector, { iconName: action.icon }),
49
+ react_1.default.createElement(Tooltip_1.Tooltip, { id: action.icon, place: "bottom" }, action.label)));
50
+ }))));
51
+ };
52
+ exports.ContextMenu = ContextMenu;
@@ -18,7 +18,7 @@ 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.Menus = void 0;
21
+ exports.Label = exports.Block = exports.BlockItem = exports.StyleBlock = exports.ListContainer = exports.bulletListContextMenu = exports.orderedListContextMenu = exports.Menus = void 0;
22
22
  const react_1 = __importDefault(require("react"));
23
23
  const styled_components_1 = __importDefault(require("styled-components"));
24
24
  const Submenu_1 = require("./Submenu");
@@ -58,3 +58,56 @@ const Menus = ({ menus, innerRef, handleClick, }) => {
58
58
  })));
59
59
  };
60
60
  exports.Menus = Menus;
61
+ exports.orderedListContextMenu = [
62
+ { items: ['1.', '2.', '3.'], type: 'order' },
63
+ { items: ['A.', 'B.', 'C.'], type: 'alpha-upper' },
64
+ { items: ['a.', 'b.', 'c.'], type: 'alpha-lower' },
65
+ { items: ['I.', 'II.', 'III.'], type: 'roman-upper' },
66
+ { items: ['i.', 'ii.', 'iii.'], type: 'roman-lower' },
67
+ ];
68
+ exports.bulletListContextMenu = [
69
+ { items: ['•', '•', '•'], type: 'bullet' },
70
+ { items: ['-', '-', '-'], type: 'simple' },
71
+ ];
72
+ exports.ListContainer = styled_components_1.default.div `
73
+ padding: ${(props) => props.theme.grid.unit * 4}px;
74
+ display: grid;
75
+ grid-template-columns:
76
+ ${(props) => props.theme.grid.unit * 21}px
77
+ ${(props) => props.theme.grid.unit * 21}px;
78
+ gap: 6px;
79
+ `;
80
+ exports.StyleBlock = styled_components_1.default.div `
81
+ border: 1px solid ${(props) => props.theme.colors.border.tertiary};
82
+ padding: ${(props) => props.theme.grid.unit * 2}px;
83
+ cursor: pointer;
84
+ display: flex;
85
+ flex-direction: column;
86
+ row-gap: ${(props) => props.theme.grid.unit * 2}px;
87
+
88
+ &:hover {
89
+ background: ${(props) => props.theme.colors.button.default.border.hover};
90
+ }
91
+
92
+ &:active {
93
+ border-color: ${(props) => props.theme.colors.border.primary};
94
+ }
95
+ `;
96
+ exports.BlockItem = styled_components_1.default.div `
97
+ display: flex;
98
+ align-items: center;
99
+ gap: 6px;
100
+ `;
101
+ exports.Block = styled_components_1.default.div `
102
+ height: 3px;
103
+ width: ${(props) => props.theme.grid.unit * 14}px;
104
+ background: ${(props) => props.theme.colors.border.tertiary};
105
+ `;
106
+ exports.Label = styled_components_1.default.div `
107
+ font-family: Lato, serif;
108
+ font-size: ${(props) => props.theme.font.size.small};
109
+ font-weight: ${(props) => props.theme.font.weight.normal};
110
+ line-height: ${(props) => props.theme.font.lineHeight.small};
111
+ font-style: normal;
112
+ color: ${(props) => (props.hide && 'white') || 'initial'};
113
+ `;
@@ -23,6 +23,7 @@ const TriangleCollapsed_1 = __importDefault(require("@manuscripts/assets/react/T
23
23
  const react_1 = __importDefault(require("react"));
24
24
  const styled_components_1 = __importDefault(require("styled-components"));
25
25
  const menus_1 = require("../../lib/menus");
26
+ const Menus_1 = require("./Menus");
26
27
  const Shortcut_1 = require("./Shortcut");
27
28
  exports.Text = styled_components_1.default.div `
28
29
  flex: 1 0 auto;
@@ -37,8 +38,6 @@ exports.SubmenusContainer = styled_components_1.default.div `
37
38
  box-shadow: 0 4px 9px 0 rgba(84, 83, 83, 0.3);
38
39
  color: #353535;
39
40
  min-width: 150px;
40
- max-height: 70vh;
41
- overflow-y: auto;
42
41
  padding: 4px 0;
43
42
  white-space: nowrap;
44
43
  width: auto;
@@ -96,7 +95,7 @@ const Submenu = ({ menu, handleClick }) => {
96
95
  if ((0, menus_1.isMenuSeparator)(menu)) {
97
96
  return react_1.default.createElement(Separator, null);
98
97
  }
99
- if (!menu.submenu) {
98
+ if (!menu.submenu && !menu.options) {
100
99
  return (react_1.default.createElement(Container, { isOpen: menu.isOpen, className: menu.isEnabled ? '' : 'disabled', onMouseDown: (e) => {
101
100
  e.preventDefault();
102
101
  handleClick([]);
@@ -105,6 +104,17 @@ const Submenu = ({ menu, handleClick }) => {
105
104
  react_1.default.createElement(exports.Text, null, menu.label),
106
105
  menu.shortcut && react_1.default.createElement(Shortcut_1.Shortcut, { shortcut: menu.shortcut })));
107
106
  }
107
+ if (menu.options) {
108
+ const styles = menu.id === 'bullet-list-context-menu'
109
+ ? Menus_1.bulletListContextMenu
110
+ : Menus_1.orderedListContextMenu;
111
+ return (react_1.default.createElement(Menus_1.ListContainer, null, styles.map((style, index) => (react_1.default.createElement(Menus_1.StyleBlock, { key: index, onClick: () => {
112
+ menu.options && menu.options[style.type]();
113
+ handleClick([-1, -1]);
114
+ } }, style.items.map((style, index) => (react_1.default.createElement(Menus_1.BlockItem, { key: index },
115
+ react_1.default.createElement(Menus_1.Label, { hide: style === '-' }, style),
116
+ react_1.default.createElement(Menus_1.Block, null)))))))));
117
+ }
108
118
  return (react_1.default.createElement(SubmenuContainer, null,
109
119
  react_1.default.createElement(Container, { onMouseDown: (e) => {
110
120
  e.preventDefault();
@@ -34,7 +34,6 @@ const react_1 = __importStar(require("react"));
34
34
  const styled_components_1 = __importDefault(require("styled-components"));
35
35
  const Button_1 = require("../Button");
36
36
  const Dialog_1 = require("../Dialog");
37
- const icons_1 = require("../icons");
38
37
  const CitationViewer_1 = require("./CitationViewer");
39
38
  const ReferenceLine_1 = require("./ReferenceLine");
40
39
  const ReferenceSearch_1 = require("./ReferenceSearch");
@@ -136,9 +135,7 @@ const CitationEditor = ({ query, rids, items, citationCounts, sources, onCite, o
136
135
  react_1.default.createElement(CloseIconDark_1.default, { className: 'remove-icon' }))))))),
137
136
  react_1.default.createElement(ReferencesModal_1.ReferencesModal, { isOpen: editingForm.show, onCancel: () => setEditingForm({ show: false }), items: items, citationCounts: citationCounts, item: editingForm.item, onSave: onSave, onDelete: onDelete }),
138
137
  react_1.default.createElement(Actions, null,
139
- react_1.default.createElement(Button_1.IconTextButton, { onClick: onComment },
140
- react_1.default.createElement(icons_1.AddComment, null),
141
- react_1.default.createElement(AddCommentButtonText, null, "Add Comment")),
138
+ react_1.default.createElement(Button_1.IconTextButton, null),
142
139
  react_1.default.createElement(Button_1.ButtonGroup, null,
143
140
  react_1.default.createElement(Button_1.SecondaryButton, { onClick: onCancel }, "Done"),
144
141
  react_1.default.createElement(Button_1.PrimaryButton, { disabled: !canEdit, onClick: () => setSearching(true) }, "Add Citation")))));
@@ -67,6 +67,9 @@ const useMenus = (menus) => {
67
67
  const index = indices[depth];
68
68
  setPointer(transformPointer(depth, index));
69
69
  }
70
+ if (menu.options) {
71
+ setPointer([-1, -1, -1]);
72
+ }
70
73
  }, [state]);
71
74
  const ref = (0, react_1.useRef)(null);
72
75
  (0, react_1.useEffect)(() => {
package/dist/cjs/index.js CHANGED
@@ -35,6 +35,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
35
35
  exports.errorsDecoder = exports.useDeepCompareCallback = exports.useDeepCompareMemo = void 0;
36
36
  __exportStar(require("./components/AlertMessage"), exports);
37
37
  __exportStar(require("./components/Button"), exports);
38
+ __exportStar(require("./components/ContextMenu"), exports);
38
39
  __exportStar(require("./components/RadioButton"), exports);
39
40
  __exportStar(require("./components/AutoSaveInput"), exports);
40
41
  __exportStar(require("./components/Avatar"), exports);
@@ -262,3 +262,14 @@ export const ButtonGroup = styled.div `
262
262
  margin-left: ${(props) => props.theme.grid.unit}px;
263
263
  }
264
264
  `;
265
+ export const IconButtonGroup = styled.div `
266
+ display: flex;
267
+ flex-direction: row;
268
+ justify-content: flex-start;
269
+ align-items: center;
270
+
271
+ button {
272
+ width: 28px;
273
+ height: 28px;
274
+ }
275
+ `;
@@ -0,0 +1,45 @@
1
+ /*!
2
+ * © 2024 Atypon Systems LLC
3
+ *
4
+ * Licensed under the Apache License, Version 2.0 (the "License");
5
+ * you may not use this file except in compliance with the License.
6
+ * You may obtain a copy of the License at
7
+ *
8
+ * http://www.apache.org/licenses/LICENSE-2.0
9
+ *
10
+ * Unless required by applicable law or agreed to in writing, software
11
+ * distributed under the License is distributed on an "AS IS" BASIS,
12
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13
+ * See the License for the specific language governing permissions and
14
+ * limitations under the License.
15
+ */
16
+ import React from 'react';
17
+ import styled from 'styled-components';
18
+ import { IconButton, IconButtonGroup } from './Button';
19
+ import { AddComment, EditIcon } from './icons';
20
+ import { Tooltip } from './Tooltip';
21
+ const ContextMenuIconButton = styled(IconButton) `
22
+ color: #6e6e6e;
23
+ &:not([disabled]):hover,
24
+ &:not([disabled]):focus {
25
+ color: #363636;
26
+ background-color: #f2f2f2;
27
+ border-color: #f2f2f2;
28
+ }
29
+ `;
30
+ export const ContextMenu = ({ actions }) => {
31
+ const IconSelector = ({ iconName }) => {
32
+ const icons = {
33
+ AddComment: AddComment,
34
+ EditIcon: EditIcon,
35
+ };
36
+ const Icon = icons[iconName];
37
+ return React.createElement(Icon, null);
38
+ };
39
+ return (React.createElement(React.Fragment, null,
40
+ React.createElement(IconButtonGroup, null, actions.map((action) => {
41
+ return (React.createElement(ContextMenuIconButton, { key: action.icon, "data-tooltip-id": action.icon, onClick: action.action },
42
+ React.createElement(IconSelector, { iconName: action.icon }),
43
+ React.createElement(Tooltip, { id: action.icon, place: "bottom" }, action.label)));
44
+ }))));
45
+ };
@@ -51,3 +51,56 @@ export const Menus = ({ menus, innerRef, handleClick, }) => {
51
51
  })))));
52
52
  })));
53
53
  };
54
+ export const orderedListContextMenu = [
55
+ { items: ['1.', '2.', '3.'], type: 'order' },
56
+ { items: ['A.', 'B.', 'C.'], type: 'alpha-upper' },
57
+ { items: ['a.', 'b.', 'c.'], type: 'alpha-lower' },
58
+ { items: ['I.', 'II.', 'III.'], type: 'roman-upper' },
59
+ { items: ['i.', 'ii.', 'iii.'], type: 'roman-lower' },
60
+ ];
61
+ export const bulletListContextMenu = [
62
+ { items: ['•', '•', '•'], type: 'bullet' },
63
+ { items: ['-', '-', '-'], type: 'simple' },
64
+ ];
65
+ export const ListContainer = styled.div `
66
+ padding: ${(props) => props.theme.grid.unit * 4}px;
67
+ display: grid;
68
+ grid-template-columns:
69
+ ${(props) => props.theme.grid.unit * 21}px
70
+ ${(props) => props.theme.grid.unit * 21}px;
71
+ gap: 6px;
72
+ `;
73
+ export const StyleBlock = styled.div `
74
+ border: 1px solid ${(props) => props.theme.colors.border.tertiary};
75
+ padding: ${(props) => props.theme.grid.unit * 2}px;
76
+ cursor: pointer;
77
+ display: flex;
78
+ flex-direction: column;
79
+ row-gap: ${(props) => props.theme.grid.unit * 2}px;
80
+
81
+ &:hover {
82
+ background: ${(props) => props.theme.colors.button.default.border.hover};
83
+ }
84
+
85
+ &:active {
86
+ border-color: ${(props) => props.theme.colors.border.primary};
87
+ }
88
+ `;
89
+ export const BlockItem = styled.div `
90
+ display: flex;
91
+ align-items: center;
92
+ gap: 6px;
93
+ `;
94
+ export const Block = styled.div `
95
+ height: 3px;
96
+ width: ${(props) => props.theme.grid.unit * 14}px;
97
+ background: ${(props) => props.theme.colors.border.tertiary};
98
+ `;
99
+ export const Label = styled.div `
100
+ font-family: Lato, serif;
101
+ font-size: ${(props) => props.theme.font.size.small};
102
+ font-weight: ${(props) => props.theme.font.weight.normal};
103
+ line-height: ${(props) => props.theme.font.lineHeight.small};
104
+ font-style: normal;
105
+ color: ${(props) => (props.hide && 'white') || 'initial'};
106
+ `;
@@ -17,6 +17,7 @@ import TriangleCollapsed from '@manuscripts/assets/react/TriangleCollapsed';
17
17
  import React from 'react';
18
18
  import styled from 'styled-components';
19
19
  import { isMenuSeparator } from '../../lib/menus';
20
+ import { Block, BlockItem, bulletListContextMenu, Label, ListContainer, orderedListContextMenu, StyleBlock, } from './Menus';
20
21
  import { Shortcut } from './Shortcut';
21
22
  export const Text = styled.div `
22
23
  flex: 1 0 auto;
@@ -31,8 +32,6 @@ export const SubmenusContainer = styled.div `
31
32
  box-shadow: 0 4px 9px 0 rgba(84, 83, 83, 0.3);
32
33
  color: #353535;
33
34
  min-width: 150px;
34
- max-height: 70vh;
35
- overflow-y: auto;
36
35
  padding: 4px 0;
37
36
  white-space: nowrap;
38
37
  width: auto;
@@ -90,7 +89,7 @@ export const Submenu = ({ menu, handleClick }) => {
90
89
  if (isMenuSeparator(menu)) {
91
90
  return React.createElement(Separator, null);
92
91
  }
93
- if (!menu.submenu) {
92
+ if (!menu.submenu && !menu.options) {
94
93
  return (React.createElement(Container, { isOpen: menu.isOpen, className: menu.isEnabled ? '' : 'disabled', onMouseDown: (e) => {
95
94
  e.preventDefault();
96
95
  handleClick([]);
@@ -99,6 +98,17 @@ export const Submenu = ({ menu, handleClick }) => {
99
98
  React.createElement(Text, null, menu.label),
100
99
  menu.shortcut && React.createElement(Shortcut, { shortcut: menu.shortcut })));
101
100
  }
101
+ if (menu.options) {
102
+ const styles = menu.id === 'bullet-list-context-menu'
103
+ ? bulletListContextMenu
104
+ : orderedListContextMenu;
105
+ return (React.createElement(ListContainer, null, styles.map((style, index) => (React.createElement(StyleBlock, { key: index, onClick: () => {
106
+ menu.options && menu.options[style.type]();
107
+ handleClick([-1, -1]);
108
+ } }, style.items.map((style, index) => (React.createElement(BlockItem, { key: index },
109
+ React.createElement(Label, { hide: style === '-' }, style),
110
+ React.createElement(Block, null)))))))));
111
+ }
102
112
  return (React.createElement(SubmenuContainer, null,
103
113
  React.createElement(Container, { onMouseDown: (e) => {
104
114
  e.preventDefault();
@@ -5,7 +5,6 @@ import React, { useMemo, useState } from 'react';
5
5
  import styled from 'styled-components';
6
6
  import { ButtonGroup, IconButton, IconTextButton, PrimaryButton, SecondaryButton, } from '../Button';
7
7
  import { Category, Dialog } from '../Dialog';
8
- import { AddComment } from '../icons';
9
8
  import { CitedItem, CitedItems } from './CitationViewer';
10
9
  import { ReferenceLine } from './ReferenceLine';
11
10
  import { ReferenceSearch } from './ReferenceSearch';
@@ -107,9 +106,7 @@ export const CitationEditor = ({ query, rids, items, citationCounts, sources, on
107
106
  React.createElement(CloseIconDark, { className: 'remove-icon' }))))))),
108
107
  React.createElement(ReferencesModal, { isOpen: editingForm.show, onCancel: () => setEditingForm({ show: false }), items: items, citationCounts: citationCounts, item: editingForm.item, onSave: onSave, onDelete: onDelete }),
109
108
  React.createElement(Actions, null,
110
- React.createElement(IconTextButton, { onClick: onComment },
111
- React.createElement(AddComment, null),
112
- React.createElement(AddCommentButtonText, null, "Add Comment")),
109
+ React.createElement(IconTextButton, null),
113
110
  React.createElement(ButtonGroup, null,
114
111
  React.createElement(SecondaryButton, { onClick: onCancel }, "Done"),
115
112
  React.createElement(PrimaryButton, { disabled: !canEdit, onClick: () => setSearching(true) }, "Add Citation")))));
@@ -64,6 +64,9 @@ export const useMenus = (menus) => {
64
64
  const index = indices[depth];
65
65
  setPointer(transformPointer(depth, index));
66
66
  }
67
+ if (menu.options) {
68
+ setPointer([-1, -1, -1]);
69
+ }
67
70
  }, [state]);
68
71
  const ref = useRef(null);
69
72
  useEffect(() => {
package/dist/es/index.js CHANGED
@@ -15,6 +15,7 @@
15
15
  */
16
16
  export * from './components/AlertMessage';
17
17
  export * from './components/Button';
18
+ export * from './components/ContextMenu';
18
19
  export * from './components/RadioButton';
19
20
  export * from './components/AutoSaveInput';
20
21
  export * from './components/Avatar';
@@ -95,3 +95,4 @@ export declare const SecondaryIconButton: import("styled-components").StyledComp
95
95
  iconColor?: string | undefined;
96
96
  }, "type">;
97
97
  export declare const ButtonGroup: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
98
+ export declare const IconButtonGroup: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
@@ -0,0 +1,25 @@
1
+ /*!
2
+ * © 2024 Atypon Systems LLC
3
+ *
4
+ * Licensed under the Apache License, Version 2.0 (the "License");
5
+ * you may not use this file except in compliance with the License.
6
+ * You may obtain a copy of the License at
7
+ *
8
+ * http://www.apache.org/licenses/LICENSE-2.0
9
+ *
10
+ * Unless required by applicable law or agreed to in writing, software
11
+ * distributed under the License is distributed on an "AS IS" BASIS,
12
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13
+ * See the License for the specific language governing permissions and
14
+ * limitations under the License.
15
+ */
16
+ import React from 'react';
17
+ export interface Actions {
18
+ label: string;
19
+ action: () => void;
20
+ icon: string;
21
+ }
22
+ export interface ContextMenuProps {
23
+ actions: Actions[];
24
+ }
25
+ export declare const ContextMenu: React.FC<ContextMenuProps>;
@@ -21,4 +21,19 @@ interface MenusProps {
21
21
  handleClick: (position: number[]) => void;
22
22
  }
23
23
  export declare const Menus: React.FC<MenusProps>;
24
+ export declare const orderedListContextMenu: {
25
+ items: string[];
26
+ type: string;
27
+ }[];
28
+ export declare const bulletListContextMenu: {
29
+ items: string[];
30
+ type: string;
31
+ }[];
32
+ export declare const ListContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
33
+ export declare const StyleBlock: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
34
+ export declare const BlockItem: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
35
+ export declare const Block: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
36
+ export declare const Label: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {
37
+ hide?: boolean | undefined;
38
+ }, never>;
24
39
  export {};
@@ -16,6 +16,7 @@
16
16
  export { Theme } from './theme';
17
17
  export * from './components/AlertMessage';
18
18
  export * from './components/Button';
19
+ export * from './components/ContextMenu';
19
20
  export * from './components/RadioButton';
20
21
  export * from './components/AutoSaveInput';
21
22
  export * from './components/Avatar';
@@ -13,6 +13,8 @@
13
13
  * See the License for the specific language governing permissions and
14
14
  * limitations under the License.
15
15
  */
16
+ import { ManuscriptTransaction } from '@manuscripts/transform';
17
+ export type Dispatch = (tr: ManuscriptTransaction) => void;
16
18
  export interface MenuShortcut {
17
19
  mac: string;
18
20
  pc: string;
@@ -26,6 +28,9 @@ export interface MenuSpec {
26
28
  isEnabled: boolean;
27
29
  run?: () => void;
28
30
  submenu?: (MenuSpec | MenuSeparator)[];
31
+ options?: {
32
+ [key: string]: () => void;
33
+ };
29
34
  }
30
35
  export interface Menu extends MenuSpec {
31
36
  isOpen: boolean;
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": "1.8.0-LEAN-3423-3",
4
+ "version": "1.8.0-LEAN-3423-5",
5
5
  "repository": "github:Atypon-OpenSource/manuscripts-style-guide",
6
6
  "license": "Apache-2.0",
7
7
  "main": "dist/cjs",
@@ -34,7 +34,7 @@
34
34
  "dependencies": {
35
35
  "@manuscripts/assets": "^0.6.4",
36
36
  "@manuscripts/json-schema": "2.2.6-LEAN-3423-0",
37
- "@manuscripts/transform": "2.1.8-LEAN-3423-0",
37
+ "@manuscripts/transform": "2.1.8-LEAN-3423-2",
38
38
  "@reach/tabs": "^0.18.0",
39
39
  "date-fns": "^2.29.3",
40
40
  "formik": "^2.2.9",