@skbkontur/markdown 1.11.2 → 1.12.1

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 (13) hide show
  1. package/index.d.ts +1 -1
  2. package/index.js +1 -1
  3. package/package.json +1 -1
  4. package/src/Markdown/Markdown.styled.d.ts +3 -2
  5. package/src/Markdown/Markdown.styled.js +7 -8
  6. package/src/Markdown/MarkdownActions.js +2 -2
  7. package/src/Markdown/MarkdownHelpers/MarkdownFormatButton.js +1 -1
  8. package/src/{Markdown/MarkdownHelpers → MarkdownCombination}/MarkdownCombination.d.ts +1 -1
  9. package/src/MarkdownCombination/MarkdownCombination.js +25 -0
  10. package/src/MarkdownCombination/MarkdownCombination.styled.d.ts +1 -0
  11. package/src/MarkdownCombination/MarkdownCombination.styled.js +7 -0
  12. package/src/MarkdownViewer/MarkdownViewer.styles.js +1 -1
  13. package/src/Markdown/MarkdownHelpers/MarkdownCombination.js +0 -22
package/index.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  export { Markdown, MarkdownProps } from './src/Markdown/Markdown';
2
- export { MarkdownCombination } from './src/Markdown/MarkdownHelpers/MarkdownCombination';
2
+ export { MarkdownCombination } from './src/MarkdownCombination/MarkdownCombination';
3
3
  export { markdownHelpItems, markdownHelpFiles, markdownHelpLists, markdownHelpOther, } from './src/Markdown/MarkdownHelpItems';
4
4
  export { MarkdownViewer } from './src/MarkdownViewer/MarkdownViewer';
5
5
  export { MarkdownApi, RefItem, User, Token, HorizontalPaddings, ViewMode } from '././src/Markdown/types';
package/index.js CHANGED
@@ -1,5 +1,5 @@
1
1
  export { Markdown } from './src/Markdown/Markdown';
2
- export { MarkdownCombination } from './src/Markdown/MarkdownHelpers/MarkdownCombination';
2
+ export { MarkdownCombination } from './src/MarkdownCombination/MarkdownCombination';
3
3
  export { markdownHelpItems, markdownHelpFiles, markdownHelpLists, markdownHelpOther, } from './src/Markdown/MarkdownHelpItems';
4
4
  export { MarkdownViewer } from './src/MarkdownViewer/MarkdownViewer';
5
5
  export { ViewMode } from '././src/Markdown/types';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@skbkontur/markdown",
3
- "version": "1.11.2",
3
+ "version": "1.12.1",
4
4
  "publishConfig": {
5
5
  "registry": "https://registry.npmjs.org/",
6
6
  "access": "public"
package/src/Markdown/Markdown.styled.d.ts CHANGED
@@ -15,14 +15,15 @@ export declare const MarkdownPreview: import("styled-components").StyledComponen
15
15
  export declare const MarkdownActionsWrapper: import("styled-components").StyledComponent<"div", MarkdownTheme, {
16
16
  width?: Nullable<number | string>;
17
17
  } & HorizontalPaddings, never>;
18
- export declare const ButtonsWrapper: import("styled-components").StyledComponent<"div", MarkdownTheme, {}, never>;
18
+ export declare const ButtonsWrapper: import("styled-components").StyledComponent<"div", MarkdownTheme, {
19
+ width?: Nullable<number | string>;
20
+ } & HorizontalPaddings, never>;
19
21
  export declare const ActionsWrapper: import("styled-components").StyledComponent<"div", MarkdownTheme, {}, never>;
20
22
  export declare const MarkdownButtonWrapper: import("styled-components").StyledComponent<typeof Button, MarkdownTheme, {}, never>;
21
23
  export declare const MarkdownButtonIcon: import("styled-components").StyledComponent<"div", MarkdownTheme, {}, never>;
22
24
  export declare const MarkdownDropdown: import("styled-components").StyledComponent<"div", MarkdownTheme, {}, never>;
23
25
  export declare const MarkdownSymbolWrapper: import("styled-components").StyledComponent<"span", MarkdownTheme, {}, never>;
24
26
  export declare const MarkdownMenuItem: import("styled-components").StyledComponent<typeof MenuItem, MarkdownTheme, {}, never>;
25
- export declare const HintContentWrapper: import("styled-components").StyledComponent<"div", MarkdownTheme, {}, never>;
26
27
  export declare const MarkdownEditorBlock: import("styled-components").StyledComponent<"div", MarkdownTheme, {}, never>;
27
28
  export declare const getMarkdownMentionStyle: (x: number, y: number) => CSSProperties;
28
29
  export declare const UserDescriptions: import("styled-components").StyledComponent<"div", MarkdownTheme, {}, never>;
package/src/Markdown/Markdown.styled.js CHANGED
@@ -29,28 +29,27 @@ export var MarkdownPreview = styled.div(templateObject_7 || (templateObject_7 =
29
29
  var panelPadding = _a.panelPadding, fullscreenPadding = _a.fullscreenPadding;
30
30
  return (_b = fullscreenPadding !== null && fullscreenPadding !== void 0 ? fullscreenPadding : panelPadding) !== null && _b !== void 0 ? _b : 8;
31
31
  }, function (p) { return p.width && "width: ".concat(typeof p.width === 'string' ? p.width : "".concat(p.width, "px"), ";"); });
32
- export var MarkdownActionsWrapper = styled.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n padding: ", " ", "px 0;\n margin-bottom: 4px;\n box-sizing: border-box;\n ", "\n ", "\n \n a {\n border: none !important;\n text-decoration: none !important;\n }\n"], ["\n padding: ", " ", "px 0;\n margin-bottom: 4px;\n box-sizing: border-box;\n ", "\n ", "\n \n a {\n border: none !important;\n text-decoration: none !important;\n }\n"])), function (p) { return (p.fullscreenPadding ? '16px' : 0); }, function (p) { var _a; return (_a = p.fullscreenPadding) !== null && _a !== void 0 ? _a : 0; }, function (p) { return p.width && "width: ".concat(typeof p.width === 'string' ? p.width : "".concat(p.width, "px"), ";"); }, function (_a) {
32
+ export var MarkdownActionsWrapper = styled.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n padding: ", " ", "px 0;\n margin-bottom: 4px;\n box-sizing: border-box;\n position: ", ";\n ", "\n ", "\n \n a {\n border: none !important;\n text-decoration: none !important;\n }\n"], ["\n padding: ", " ", "px 0;\n margin-bottom: 4px;\n box-sizing: border-box;\n position: ", ";\n ", "\n ", "\n \n a {\n border: none !important;\n text-decoration: none !important;\n }\n"])), function (p) { return (p.fullscreenPadding ? '16px' : 0); }, function (p) { var _a; return (_a = p.fullscreenPadding) !== null && _a !== void 0 ? _a : 0; }, function (p) { return (p.fullscreenPadding ? 'sticky' : 'relative'); }, function (p) { return p.width && "width: ".concat(typeof p.width === 'string' ? p.width : "".concat(p.width, "px"), ";"); }, function (_a) {
33
33
  var theme = _a.theme, panelPadding = _a.panelPadding, fullscreenPadding = _a.fullscreenPadding;
34
34
  if (panelPadding && !fullscreenPadding)
35
35
  return panelStyle({ theme: theme, panelPadding: panelPadding });
36
36
  });
37
- export var ButtonsWrapper = styled.div(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n flex-wrap: wrap;\n margin: 0 -7px;\n"], ["\n display: flex;\n align-items: center;\n justify-content: space-between;\n flex-wrap: wrap;\n margin: 0 -7px;\n"])));
37
+ export var ButtonsWrapper = styled.div(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n flex-wrap: wrap;\n margin: 0 -7px;\n border-bottom: ", ";\n"], ["\n display: flex;\n align-items: center;\n justify-content: space-between;\n flex-wrap: wrap;\n margin: 0 -7px;\n border-bottom: ", ";\n"])), function (p) { return (p.fullscreenPadding ? "1px solid ".concat(p.theme.colors.grayDefault) : 'none'); });
38
38
  export var ActionsWrapper = styled.div(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n flex-wrap: wrap;\n"], ["\n display: flex;\n align-items: center;\n flex-wrap: wrap;\n"])));
39
39
  export var MarkdownButtonWrapper = styled(Button)(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n button {\n padding: 4px;\n border: none;\n box-sizing: border-box;\n }\n"], ["\n button {\n padding: 4px;\n border: none;\n box-sizing: border-box;\n }\n"])));
40
40
  export var MarkdownButtonIcon = styled.div(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n height: 24px;\n display: flex;\n width: 100%;\n align-items: center;\n justify-content: center;\n"], ["\n height: 24px;\n display: flex;\n width: 100%;\n align-items: center;\n justify-content: center;\n"])));
41
41
  export var MarkdownDropdown = styled.div(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n button {\n font-size: ", ";\n }\n"], ["\n button {\n font-size: ", ";\n }\n"])), function (p) { return p.theme.elementsFontSize; });
42
42
  export var MarkdownSymbolWrapper = styled.span(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n color: ", ";\n"], ["\n color: ", ";\n"])), function (p) { return p.theme.colors.brand; });
43
43
  export var MarkdownMenuItem = styled(MenuItem)(templateObject_15 || (templateObject_15 = __makeTemplateObject(["\n padding-left: 8px;\n padding-right: 8px;\n color: ", ";\n"], ["\n padding-left: 8px;\n padding-right: 8px;\n color: ", ";\n"])), function (p) { return p.theme.colors.grayDefault; });
44
- export var HintContentWrapper = styled.div(templateObject_16 || (templateObject_16 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 16px;\n width: 100%;\n"], ["\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 16px;\n width: 100%;\n"])));
45
- export var MarkdownEditorBlock = styled.div(templateObject_17 || (templateObject_17 = __makeTemplateObject(["\n position: relative;\n"], ["\n position: relative;\n"])));
44
+ export var MarkdownEditorBlock = styled.div(templateObject_16 || (templateObject_16 = __makeTemplateObject(["\n position: relative;\n"], ["\n position: relative;\n"])));
46
45
  export var getMarkdownMentionStyle = function (x, y) { return ({
47
46
  position: 'absolute',
48
47
  top: y,
49
48
  left: x,
50
49
  }); };
51
- export var UserDescriptions = styled.div(templateObject_18 || (templateObject_18 = __makeTemplateObject(["\n white-space: pre-line;\n overflow-wrap: break-word;\n word-wrap: break-word;\n word-break: break-word;\n overflow: hidden;\n margin-top: 4px;\n"], ["\n white-space: pre-line;\n overflow-wrap: break-word;\n word-wrap: break-word;\n word-break: break-word;\n overflow: hidden;\n margin-top: 4px;\n"])));
52
- export var MentionMenuItem = styled(MenuItem)(templateObject_19 || (templateObject_19 = __makeTemplateObject(["\n padding: 4px 28px;\n"], ["\n padding: 4px 28px;\n"])));
53
- export var VisuallyHidden = styled.span(templateObject_20 || (templateObject_20 = __makeTemplateObject(["\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n border: 0;\n"], ["\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n border: 0;\n"])));
50
+ export var UserDescriptions = styled.div(templateObject_17 || (templateObject_17 = __makeTemplateObject(["\n white-space: pre-line;\n overflow-wrap: break-word;\n word-wrap: break-word;\n word-break: break-word;\n overflow: hidden;\n margin-top: 4px;\n"], ["\n white-space: pre-line;\n overflow-wrap: break-word;\n word-wrap: break-word;\n word-break: break-word;\n overflow: hidden;\n margin-top: 4px;\n"])));
51
+ export var MentionMenuItem = styled(MenuItem)(templateObject_18 || (templateObject_18 = __makeTemplateObject(["\n padding: 4px 28px;\n"], ["\n padding: 4px 28px;\n"])));
52
+ export var VisuallyHidden = styled.span(templateObject_19 || (templateObject_19 = __makeTemplateObject(["\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n border: 0;\n"], ["\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n border: 0;\n"])));
54
53
  var extendThemeConfigWithSized = function (config) {
55
54
  var finalConfig = {};
56
55
  var configKeys = Object.keys(config);
@@ -91,4 +90,4 @@ export var getMarkdownReactUiTheme = function (theme, reactUiTheme, panelHorizon
91
90
  textareaPaddingY: '0',
92
91
  })))), reactUiTheme);
93
92
  };
94
- var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15, templateObject_16, templateObject_17, templateObject_18, templateObject_19, templateObject_20;
93
+ var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15, templateObject_16, templateObject_17, templateObject_18, templateObject_19;
package/src/Markdown/MarkdownActions.js CHANGED
@@ -13,11 +13,11 @@ import { Dropdown } from '@skbkontur/react-ui';
13
13
  import React from 'react';
14
14
  import { COMMONMARK_HELP_URL } from './constants';
15
15
  import { ActionsWrapper, ButtonsWrapper, MarkdownDropdown, MarkdownMenuItem, MarkdownActionsWrapper, } from './Markdown.styled';
16
- import { MarkdownCombination } from './MarkdownHelpers/MarkdownCombination';
17
16
  import { MarkdownFormatButton } from './MarkdownHelpers/MarkdownFormatButton';
18
17
  import { setMarkdown } from './MarkdownHelpers/markdownHelpers';
19
18
  import { markdownHelpHeaders, markdownHelpLists, markdownHelpOther, markdownHelpText } from './MarkdownHelpItems';
20
19
  import { ViewMode } from './types';
20
+ import { MarkdownCombination } from '../MarkdownCombination/MarkdownCombination';
21
21
  import { AttachPaperclip } from '../MarkdownIcons/AttachPaperclip';
22
22
  import { Collapse } from '../MarkdownIcons/Collapse';
23
23
  import { DocIcon } from '../MarkdownIcons/DocIcon';
@@ -28,7 +28,7 @@ export var MarkdownActions = function (_a) {
28
28
  var textAreaRef = _a.textAreaRef, selectionStart = _a.selectionStart, selectionEnd = _a.selectionEnd, loadingFile = _a.loadingFile, onOpenFileDialog = _a.onOpenFileDialog, onClickFullscreen = _a.onClickFullscreen, fullscreen = _a.fullscreen, viewMode = _a.viewMode, onChangeViewMode = _a.onChangeViewMode, horizontalPaddings = _a.horizontalPaddings, hasFilesApi = _a.hasFilesApi, hideHeadersSelect = _a.hideHeadersSelect, width = _a.width, showShortKeys = _a.showShortKeys;
29
29
  var isPreviewMode = viewMode === ViewMode.Preview;
30
30
  return (React.createElement(MarkdownActionsWrapper, __assign({}, horizontalPaddings, { width: width }),
31
- React.createElement(ButtonsWrapper, null,
31
+ React.createElement(ButtonsWrapper, __assign({}, horizontalPaddings),
32
32
  React.createElement(ActionsWrapper, null,
33
33
  hideHeadersSelect || (React.createElement(MarkdownDropdown, null,
34
34
  React.createElement(Dropdown, { disablePortal: true, disabled: isPreviewMode, menuWidth: 280, caption: "\u0417\u0430\u0433\u043E\u043B\u043E\u0432\u043E\u043A" }, markdownHelpHeaders.map(function (helper, idx) { return (React.createElement(MarkdownMenuItem, { key: idx, onClick: function (event) { return handleMarkdownItemClick(event, helper.format); } },
package/src/Markdown/MarkdownHelpers/MarkdownFormatButton.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import { Hint } from '@skbkontur/react-ui';
2
2
  import React from 'react';
3
- import { MarkdownCombination } from './MarkdownCombination';
3
+ import { MarkdownCombination } from '../../MarkdownCombination/MarkdownCombination';
4
4
  import { MarkdownButtonIcon, MarkdownButtonWrapper, VisuallyHidden } from '../Markdown.styled';
5
5
  export var MarkdownFormatButton = function (_a) {
6
6
  var icon = _a.icon, hintText = _a.hintText, onClick = _a.onClick, format = _a.format, disabled = _a.disabled, text = _a.text, href = _a.href, showShortKey = _a.showShortKey;
package/src/{Markdown/MarkdownHelpers → MarkdownCombination}/MarkdownCombination.d.ts RENAMED
@@ -1,5 +1,5 @@
1
1
  import { FC, ReactNode } from 'react';
2
- import { MarkdownFormat } from '../MarkdownFormat';
2
+ import { MarkdownFormat } from '../Markdown/MarkdownFormat';
3
3
  interface Props {
4
4
  format: MarkdownFormat;
5
5
  text: ReactNode;
package/src/MarkdownCombination/MarkdownCombination.js ADDED
@@ -0,0 +1,25 @@
1
+ import React from 'react';
2
+ import { HintContentWrapper } from './MarkdownCombination.styled';
3
+ import { markdownFormatToShortKeyLong, markdownFormatToShortKeyShort } from '../Markdown/MarkdownHelpItems';
4
+ import { isMacintosh } from '../Markdown/utils/isMacintosh';
5
+ import { ThemeProvider } from '../styles/styled-components';
6
+ import { DEFAULT_MARKDOWN_THEME, MarkdownThemeConsumer } from '../styles/theme';
7
+ export var MarkdownCombination = function (_a) {
8
+ var format = _a.format, text = _a.text, showShortKey = _a.showShortKey;
9
+ var shortKeyLong = markdownFormatToShortKeyLong[format];
10
+ var shortKeyShort = markdownFormatToShortKeyShort[format];
11
+ var shortKey = shortKeyLong || shortKeyShort;
12
+ return (React.createElement(MarkdownThemeConsumer, null, function (theme) { return (React.createElement(ThemeProvider, { theme: theme !== null && theme !== void 0 ? theme : DEFAULT_MARKDOWN_THEME },
13
+ React.createElement(HintContentWrapper, null,
14
+ React.createElement("span", null, text),
15
+ showShortKey && !!shortKey && renderHint()))); }));
16
+ function renderHint() {
17
+ var ctrlKey = isMacintosh() ? '⌘' : 'CTRL';
18
+ var extraKey = shortKeyLong ? '+SHIFT' : '';
19
+ return (React.createElement("span", null,
20
+ ctrlKey,
21
+ extraKey,
22
+ "+",
23
+ shortKey));
24
+ }
25
+ };
package/src/MarkdownCombination/MarkdownCombination.styled.d.ts ADDED
@@ -0,0 +1 @@
1
+ export declare const HintContentWrapper: import("styled-components").StyledComponent<"div", import("../..").MarkdownTheme, {}, never>;
package/src/MarkdownCombination/MarkdownCombination.styled.js ADDED
@@ -0,0 +1,7 @@
1
+ var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
2
+ if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
3
+ return cooked;
4
+ };
5
+ import styled from '../styles/styled-components';
6
+ export var HintContentWrapper = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 16px;\n width: 100%;\n"], ["\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 16px;\n width: 100%;\n"])));
7
+ var templateObject_1;
package/src/MarkdownViewer/MarkdownViewer.styles.js CHANGED
@@ -12,7 +12,7 @@ export var Href = styled.a(templateObject_6 || (templateObject_6 = __makeTemplat
12
12
  export var FileName = styled.span(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n white-space: pre-wrap;\n"], ["\n white-space: pre-wrap;\n"])));
13
13
  export var ImgHref = styled.a(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n text-decoration: none !important;\n border: none !important;\n"], ["\n text-decoration: none !important;\n border: none !important;\n"])));
14
14
  export var TableWrapper = styled.div(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n width: 100%;\n overflow-x: auto;\n"], ["\n width: 100%;\n overflow-x: auto;\n"])));
15
- export var Table = styled.table(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n width: max-content;\n"], ["\n width: max-content;\n"])));
15
+ export var Table = styled.table(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n width: 100%;\n min-width: 400px;\n"], ["\n width: 100%;\n min-width: 400px;\n"])));
16
16
  export function getListStyle(depth) {
17
17
  return depth ? { marginTop: 4 } : { marginBottom: 16 };
18
18
  }
package/src/Markdown/MarkdownHelpers/MarkdownCombination.js DELETED
@@ -1,22 +0,0 @@
1
- import React from 'react';
2
- import { HintContentWrapper } from '../Markdown.styled';
3
- import { markdownFormatToShortKeyLong, markdownFormatToShortKeyShort } from '../MarkdownHelpItems';
4
- import { isMacintosh } from '../utils/isMacintosh';
5
- export var MarkdownCombination = function (_a) {
6
- var format = _a.format, text = _a.text, showShortKey = _a.showShortKey;
7
- var shortKeyLong = markdownFormatToShortKeyLong[format];
8
- var shortKeyShort = markdownFormatToShortKeyShort[format];
9
- var shortKey = shortKeyLong || shortKeyShort;
10
- return (React.createElement(HintContentWrapper, null,
11
- React.createElement("span", null, text),
12
- showShortKey && !!shortKey && renderHint()));
13
- function renderHint() {
14
- var ctrlKey = isMacintosh() ? '⌘' : 'CTRL';
15
- var extraKey = shortKeyLong ? '+SHIFT' : '';
16
- return (React.createElement("span", null,
17
- ctrlKey,
18
- extraKey,
19
- "+",
20
- shortKey));
21
- }
22
- };