@atlaskit/code 14.3.9 → 14.4.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 +16 -0
- package/bidi-warning/package.json +8 -1
- package/bidi-warning-decorator/package.json +8 -1
- package/block/package.json +8 -1
- package/constants/package.json +8 -1
- package/dist/cjs/bidi-warning/ui/styled.js +4 -4
- package/dist/cjs/code-block.js +3 -3
- package/dist/cjs/code.js +7 -7
- package/dist/cjs/internal/theme/styles.js +4 -9
- package/dist/cjs/version.json +1 -1
- package/dist/es2019/bidi-warning/ui/styled.js +1 -1
- package/dist/es2019/code-block.js +2 -2
- package/dist/es2019/code.js +2 -2
- package/dist/es2019/internal/theme/styles.js +4 -9
- package/dist/es2019/version.json +1 -1
- package/dist/esm/bidi-warning/ui/styled.js +1 -1
- package/dist/esm/code-block.js +2 -2
- package/dist/esm/code.js +2 -2
- package/dist/esm/internal/theme/styles.js +4 -9
- package/dist/esm/version.json +1 -1
- package/dist/types/bidi-warning/ui/styled.d.ts +2 -1
- package/dist/types/code.d.ts +1 -1
- package/dist/types/internal/theme/styles.d.ts +10 -2
- package/dist/types-ts4.0/bidi-warning/bidi-warning-decorator.d.ts +5 -0
- package/dist/types-ts4.0/bidi-warning/index.d.ts +1 -0
- package/dist/types-ts4.0/bidi-warning/ui/index.d.ts +3 -0
- package/dist/types-ts4.0/bidi-warning/ui/styled.d.ts +8 -0
- package/dist/types-ts4.0/bidi-warning/ui/types.d.ts +33 -0
- package/dist/types-ts4.0/code-block.d.ts +13 -0
- package/dist/types-ts4.0/code.d.ts +16 -0
- package/dist/types-ts4.0/constants.d.ts +625 -0
- package/dist/types-ts4.0/entry-points/block.d.ts +2 -0
- package/dist/types-ts4.0/entry-points/constants.d.ts +1 -0
- package/dist/types-ts4.0/entry-points/inline.d.ts +2 -0
- package/dist/types-ts4.0/entry-points/types.d.ts +1 -0
- package/dist/types-ts4.0/extract-react-types/code-block.d.ts +37 -0
- package/dist/types-ts4.0/extract-react-types/code.d.ts +2 -0
- package/dist/types-ts4.0/index.d.ts +4 -0
- package/dist/types-ts4.0/internal/hooks/use-highlight.d.ts +6 -0
- package/dist/types-ts4.0/internal/theme/constants.d.ts +8 -0
- package/dist/types-ts4.0/internal/theme/get-theme.d.ts +7 -0
- package/dist/types-ts4.0/internal/theme/styles.d.ts +27 -0
- package/dist/types-ts4.0/internal/theme/types.d.ts +57 -0
- package/dist/types-ts4.0/internal/types.d.ts +57 -0
- package/dist/types-ts4.0/internal/utils/get-normalized-language.d.ts +2 -0
- package/dist/types-ts4.0/react-syntax-highlighter-bidi-warning-renderer.d.ts +9 -0
- package/dist/types-ts4.0/types.d.ts +32 -0
- package/inline/package.json +8 -1
- package/package.json +15 -7
- package/report.api.md +130 -112
- package/types/package.json +8 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,21 @@
|
|
|
1
1
|
# @atlaskit/code
|
|
2
2
|
|
|
3
|
+
## 14.4.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- [`d6bf753bb43`](https://bitbucket.org/atlassian/atlassian-frontend/commits/d6bf753bb43) - Updates `@emotion/core` to `@emotion/react`; v10 to v11. There is no expected behavior change.
|
|
8
|
+
|
|
9
|
+
### Patch Changes
|
|
10
|
+
|
|
11
|
+
- Updated dependencies
|
|
12
|
+
|
|
13
|
+
## 14.3.10
|
|
14
|
+
|
|
15
|
+
### Patch Changes
|
|
16
|
+
|
|
17
|
+
- [`8cc2f888c83`](https://bitbucket.org/atlassian/atlassian-frontend/commits/8cc2f888c83) - Upgrade Typescript from `4.3.5` to `4.5.5`
|
|
18
|
+
|
|
3
19
|
## 14.3.9
|
|
4
20
|
|
|
5
21
|
### Patch Changes
|
|
@@ -4,5 +4,12 @@
|
|
|
4
4
|
"module": "../dist/esm/bidi-warning/index.js",
|
|
5
5
|
"module:es2019": "../dist/es2019/bidi-warning/index.js",
|
|
6
6
|
"sideEffects": false,
|
|
7
|
-
"types": "../dist/types/bidi-warning/index.d.ts"
|
|
7
|
+
"types": "../dist/types/bidi-warning/index.d.ts",
|
|
8
|
+
"typesVersions": {
|
|
9
|
+
">=4.0 <4.5": {
|
|
10
|
+
"*": [
|
|
11
|
+
"../dist/types-ts4.0/bidi-warning/index.d.ts"
|
|
12
|
+
]
|
|
13
|
+
}
|
|
14
|
+
}
|
|
8
15
|
}
|
|
@@ -4,5 +4,12 @@
|
|
|
4
4
|
"module": "../dist/esm/bidi-warning/bidi-warning-decorator.js",
|
|
5
5
|
"module:es2019": "../dist/es2019/bidi-warning/bidi-warning-decorator.js",
|
|
6
6
|
"sideEffects": false,
|
|
7
|
-
"types": "../dist/types/bidi-warning/bidi-warning-decorator.d.ts"
|
|
7
|
+
"types": "../dist/types/bidi-warning/bidi-warning-decorator.d.ts",
|
|
8
|
+
"typesVersions": {
|
|
9
|
+
">=4.0 <4.5": {
|
|
10
|
+
"*": [
|
|
11
|
+
"../dist/types-ts4.0/bidi-warning/bidi-warning-decorator.d.ts"
|
|
12
|
+
]
|
|
13
|
+
}
|
|
14
|
+
}
|
|
8
15
|
}
|
package/block/package.json
CHANGED
|
@@ -4,5 +4,12 @@
|
|
|
4
4
|
"module": "../dist/esm/entry-points/block.js",
|
|
5
5
|
"module:es2019": "../dist/es2019/entry-points/block.js",
|
|
6
6
|
"sideEffects": false,
|
|
7
|
-
"types": "../dist/types/entry-points/block.d.ts"
|
|
7
|
+
"types": "../dist/types/entry-points/block.d.ts",
|
|
8
|
+
"typesVersions": {
|
|
9
|
+
">=4.0 <4.5": {
|
|
10
|
+
"*": [
|
|
11
|
+
"../dist/types-ts4.0/entry-points/block.d.ts"
|
|
12
|
+
]
|
|
13
|
+
}
|
|
14
|
+
}
|
|
8
15
|
}
|
package/constants/package.json
CHANGED
|
@@ -4,5 +4,12 @@
|
|
|
4
4
|
"module": "../dist/esm/entry-points/constants.js",
|
|
5
5
|
"module:es2019": "../dist/es2019/entry-points/constants.js",
|
|
6
6
|
"sideEffects": false,
|
|
7
|
-
"types": "../dist/types/entry-points/constants.d.ts"
|
|
7
|
+
"types": "../dist/types/entry-points/constants.d.ts",
|
|
8
|
+
"typesVersions": {
|
|
9
|
+
">=4.0 <4.5": {
|
|
10
|
+
"*": [
|
|
11
|
+
"../dist/types-ts4.0/entry-points/constants.d.ts"
|
|
12
|
+
]
|
|
13
|
+
}
|
|
14
|
+
}
|
|
8
15
|
}
|
|
@@ -5,12 +5,12 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
});
|
|
6
6
|
exports.Decorator = Decorator;
|
|
7
7
|
|
|
8
|
-
var
|
|
8
|
+
var _react = require("@emotion/react");
|
|
9
9
|
|
|
10
10
|
var _colors = require("@atlaskit/theme/colors");
|
|
11
11
|
|
|
12
12
|
/** @jsx jsx */
|
|
13
|
-
var decoration = (0,
|
|
13
|
+
var decoration = (0, _react.css)({
|
|
14
14
|
// Required as otherwise the following bidi characters cause the span
|
|
15
15
|
// to not receive hover events.
|
|
16
16
|
//
|
|
@@ -47,9 +47,9 @@ function Decorator(_ref) {
|
|
|
47
47
|
children = _ref.children,
|
|
48
48
|
testId = _ref.testId;
|
|
49
49
|
var bidiCharacterCode = getBidiCharacterCode(bidiCharacter);
|
|
50
|
-
return (0,
|
|
50
|
+
return (0, _react.jsx)("span", {
|
|
51
51
|
"aria-label": bidiCharacterCode
|
|
52
|
-
}, (0,
|
|
52
|
+
}, (0, _react.jsx)("span", {
|
|
53
53
|
css: decoration,
|
|
54
54
|
"data-testid": testId,
|
|
55
55
|
"data-bidi-character-code": bidiCharacterCode // This is set to true so that the content is not read out by
|
package/dist/cjs/code-block.js
CHANGED
|
@@ -7,7 +7,7 @@ exports.default = void 0;
|
|
|
7
7
|
|
|
8
8
|
var _react = require("react");
|
|
9
9
|
|
|
10
|
-
var
|
|
10
|
+
var _react2 = require("@emotion/react");
|
|
11
11
|
|
|
12
12
|
var _reactSyntaxHighlighter = require("react-syntax-highlighter");
|
|
13
13
|
|
|
@@ -59,7 +59,7 @@ var CodeBlock = /*#__PURE__*/(0, _react.memo)(function CodeBlock(_ref) {
|
|
|
59
59
|
return (0, _styles.getCodeBlockStyles)(theme);
|
|
60
60
|
}, [theme]);
|
|
61
61
|
var styles = (0, _react.useMemo)(function () {
|
|
62
|
-
return getStyles(highlightedStartText, highlightedEndText, showLineNumbers);
|
|
62
|
+
return (0, _react2.css)(getStyles(highlightedStartText, highlightedEndText, showLineNumbers));
|
|
63
63
|
}, [highlightedStartText, highlightedEndText, showLineNumbers, getStyles]);
|
|
64
64
|
|
|
65
65
|
var _useHighlightLines = (0, _useHighlight.useHighlightLines)({
|
|
@@ -81,7 +81,7 @@ var CodeBlock = /*#__PURE__*/(0, _react.memo)(function CodeBlock(_ref) {
|
|
|
81
81
|
codeBidiWarningLabel: codeBidiWarningLabel,
|
|
82
82
|
codeBidiWarningTooltipEnabled: codeBidiWarningTooltipEnabled
|
|
83
83
|
}) : undefined;
|
|
84
|
-
return (0,
|
|
84
|
+
return (0, _react2.jsx)(_reactSyntaxHighlighter.PrismAsync, {
|
|
85
85
|
"data-testid": testId,
|
|
86
86
|
"data-code-lang": language,
|
|
87
87
|
"data-ds--code--code-block": "",
|
package/dist/cjs/code.js
CHANGED
|
@@ -21,7 +21,7 @@ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/h
|
|
|
21
21
|
|
|
22
22
|
var _react = _interopRequireWildcard(require("react"));
|
|
23
23
|
|
|
24
|
-
var
|
|
24
|
+
var _react2 = require("@emotion/react");
|
|
25
25
|
|
|
26
26
|
var _components = require("@atlaskit/theme/components");
|
|
27
27
|
|
|
@@ -52,7 +52,7 @@ var Code = /*#__PURE__*/(0, _react.memo)( /*#__PURE__*/(0, _react.forwardRef)(fu
|
|
|
52
52
|
props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
|
|
53
53
|
var theme = (0, _components.useGlobalTheme)();
|
|
54
54
|
var styles = (0, _react.useMemo)(function () {
|
|
55
|
-
return (0, _styles.getCodeStyles)(theme);
|
|
55
|
+
return (0, _react2.css)((0, _styles.getCodeStyles)(theme));
|
|
56
56
|
}, [theme]);
|
|
57
57
|
var children = props.children,
|
|
58
58
|
_props$codeBidiWarnin = props.codeBidiWarnings,
|
|
@@ -61,11 +61,11 @@ var Code = /*#__PURE__*/(0, _react.memo)( /*#__PURE__*/(0, _react.forwardRef)(fu
|
|
|
61
61
|
_props$codeBidiWarnin2 = props.codeBidiWarningTooltipEnabled,
|
|
62
62
|
codeBidiWarningTooltipEnabled = _props$codeBidiWarnin2 === void 0 ? true : _props$codeBidiWarnin2,
|
|
63
63
|
otherProps = (0, _objectWithoutProperties2.default)(props, _excluded2);
|
|
64
|
-
var decoratedChildren = codeBidiWarnings ? (0,
|
|
64
|
+
var decoratedChildren = codeBidiWarnings ? (0, _react2.jsx)(RenderCodeChildrenWithBidiWarnings, {
|
|
65
65
|
codeBidiWarningLabel: codeBidiWarningLabel,
|
|
66
66
|
codeBidiWarningTooltipEnabled: codeBidiWarningTooltipEnabled
|
|
67
67
|
}, children) : children;
|
|
68
|
-
return (0,
|
|
68
|
+
return (0, _react2.jsx)("code", (0, _extends2.default)({
|
|
69
69
|
ref: ref,
|
|
70
70
|
"data-testid": testId,
|
|
71
71
|
css: styles
|
|
@@ -82,7 +82,7 @@ function RenderCodeChildrenWithBidiWarnings(_ref2) {
|
|
|
82
82
|
var decorated = (0, _bidiWarningDecorator.default)(childNode, function (_ref3) {
|
|
83
83
|
var bidiCharacter = _ref3.bidiCharacter,
|
|
84
84
|
index = _ref3.index;
|
|
85
|
-
return (0,
|
|
85
|
+
return (0, _react2.jsx)(_bidiWarning.default, {
|
|
86
86
|
bidiCharacter: bidiCharacter,
|
|
87
87
|
key: index,
|
|
88
88
|
label: codeBidiWarningLabel,
|
|
@@ -95,7 +95,7 @@ function RenderCodeChildrenWithBidiWarnings(_ref2) {
|
|
|
95
95
|
if (isReactElement(childNode) && childNode.props.children) {
|
|
96
96
|
// eslint-disable-next-line @repo/internal/react/no-clone-element
|
|
97
97
|
var newChildNode = /*#__PURE__*/_react.default.cloneElement(childNode, {
|
|
98
|
-
children: (0,
|
|
98
|
+
children: (0, _react2.jsx)(RenderCodeChildrenWithBidiWarnings, {
|
|
99
99
|
codeBidiWarningLabel: codeBidiWarningLabel,
|
|
100
100
|
codeBidiWarningTooltipEnabled: codeBidiWarningTooltipEnabled
|
|
101
101
|
}, childNode.props.children)
|
|
@@ -107,7 +107,7 @@ function RenderCodeChildrenWithBidiWarnings(_ref2) {
|
|
|
107
107
|
return childNode;
|
|
108
108
|
});
|
|
109
109
|
|
|
110
|
-
return (0,
|
|
110
|
+
return (0, _react2.jsx)(_react.default.Fragment, null, replacedChildren);
|
|
111
111
|
}
|
|
112
112
|
|
|
113
113
|
function isReactElement(child) {
|
|
@@ -315,17 +315,12 @@ var getCodeStyles = function getCodeStyles(globalTheme) {
|
|
|
315
315
|
var baseStyles = getBaseCodeStyles(theme);
|
|
316
316
|
return _objectSpread(_objectSpread({}, baseStyles), {}, {
|
|
317
317
|
display: 'inline',
|
|
318
|
-
// monospace font appears slightly larger than the serif font so
|
|
319
|
-
// we use a relative size to better match when used inline
|
|
320
|
-
fontSize: '0.875em',
|
|
321
|
-
// NB vertical padding _will_ effect the boxes vertical alignment so it needs to be
|
|
322
|
-
// minimised. 2px provides a minumum and allows the line height to do the heavy lifting
|
|
323
|
-
// ; 0.5ch is to emulate the half space between the next word with varied font sizes.
|
|
324
318
|
padding: '2px 0.5ch',
|
|
325
|
-
|
|
326
|
-
|
|
319
|
+
boxDecorationBreak: 'clone',
|
|
320
|
+
fontSize: '0.875em',
|
|
327
321
|
overflow: 'auto',
|
|
328
|
-
|
|
322
|
+
overflowWrap: 'break-word',
|
|
323
|
+
whiteSpace: 'pre-wrap'
|
|
329
324
|
});
|
|
330
325
|
};
|
|
331
326
|
|
package/dist/cjs/version.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/** @jsx jsx */
|
|
2
2
|
import { memo, useCallback, useMemo } from 'react';
|
|
3
|
-
import { jsx } from '@emotion/
|
|
3
|
+
import { css, jsx } from '@emotion/react';
|
|
4
4
|
import { PrismAsync as SyntaxHighlighter } from 'react-syntax-highlighter';
|
|
5
5
|
import { useGlobalTheme } from '@atlaskit/theme/components';
|
|
6
6
|
import { useHighlightLines } from './internal/hooks/use-highlight';
|
|
@@ -33,7 +33,7 @@ const CodeBlock = /*#__PURE__*/memo(function CodeBlock({
|
|
|
33
33
|
const globalTheme = useGlobalTheme();
|
|
34
34
|
const theme = useMemo(() => getCodeBlockTheme(globalTheme, numLines), [globalTheme, numLines]);
|
|
35
35
|
const getStyles = useMemo(() => getCodeBlockStyles(theme), [theme]);
|
|
36
|
-
const styles = useMemo(() => getStyles(highlightedStartText, highlightedEndText, showLineNumbers), [highlightedStartText, highlightedEndText, showLineNumbers, getStyles]);
|
|
36
|
+
const styles = useMemo(() => css(getStyles(highlightedStartText, highlightedEndText, showLineNumbers)), [highlightedStartText, highlightedEndText, showLineNumbers, getStyles]);
|
|
37
37
|
const {
|
|
38
38
|
getHighlightStyles,
|
|
39
39
|
highlightedLines
|
package/dist/es2019/code.js
CHANGED
|
@@ -2,7 +2,7 @@ import _extends from "@babel/runtime/helpers/extends";
|
|
|
2
2
|
|
|
3
3
|
/** @jsx jsx */
|
|
4
4
|
import React, { forwardRef, memo, useMemo } from 'react';
|
|
5
|
-
import { jsx } from '@emotion/
|
|
5
|
+
import { css, jsx } from '@emotion/react';
|
|
6
6
|
import { useGlobalTheme } from '@atlaskit/theme/components';
|
|
7
7
|
import CodeBidiWarning from './bidi-warning';
|
|
8
8
|
import codeBidiWarningDecorator from './bidi-warning/bidi-warning-decorator';
|
|
@@ -22,7 +22,7 @@ const Code = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function Code({
|
|
|
22
22
|
...props
|
|
23
23
|
}, ref) {
|
|
24
24
|
const theme = useGlobalTheme();
|
|
25
|
-
const styles = useMemo(() => getCodeStyles(theme), [theme]);
|
|
25
|
+
const styles = useMemo(() => css(getCodeStyles(theme)), [theme]);
|
|
26
26
|
const {
|
|
27
27
|
children,
|
|
28
28
|
codeBidiWarnings = true,
|
|
@@ -281,17 +281,12 @@ export const getCodeStyles = globalTheme => {
|
|
|
281
281
|
const baseStyles = getBaseCodeStyles(theme);
|
|
282
282
|
return { ...baseStyles,
|
|
283
283
|
display: 'inline',
|
|
284
|
-
// monospace font appears slightly larger than the serif font so
|
|
285
|
-
// we use a relative size to better match when used inline
|
|
286
|
-
fontSize: '0.875em',
|
|
287
|
-
// NB vertical padding _will_ effect the boxes vertical alignment so it needs to be
|
|
288
|
-
// minimised. 2px provides a minumum and allows the line height to do the heavy lifting
|
|
289
|
-
// ; 0.5ch is to emulate the half space between the next word with varied font sizes.
|
|
290
284
|
padding: '2px 0.5ch',
|
|
291
|
-
|
|
292
|
-
|
|
285
|
+
boxDecorationBreak: 'clone',
|
|
286
|
+
fontSize: '0.875em',
|
|
293
287
|
overflow: 'auto',
|
|
294
|
-
|
|
288
|
+
overflowWrap: 'break-word',
|
|
289
|
+
whiteSpace: 'pre-wrap'
|
|
295
290
|
};
|
|
296
291
|
};
|
|
297
292
|
export const getCodeBlockTheme = (globalTheme, maxLines) => {
|
package/dist/es2019/version.json
CHANGED
package/dist/esm/code-block.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/** @jsx jsx */
|
|
2
2
|
import { memo, useCallback, useMemo } from 'react';
|
|
3
|
-
import { jsx } from '@emotion/
|
|
3
|
+
import { css, jsx } from '@emotion/react';
|
|
4
4
|
import { PrismAsync as SyntaxHighlighter } from 'react-syntax-highlighter';
|
|
5
5
|
import { useGlobalTheme } from '@atlaskit/theme/components';
|
|
6
6
|
import { useHighlightLines } from './internal/hooks/use-highlight';
|
|
@@ -44,7 +44,7 @@ var CodeBlock = /*#__PURE__*/memo(function CodeBlock(_ref) {
|
|
|
44
44
|
return getCodeBlockStyles(theme);
|
|
45
45
|
}, [theme]);
|
|
46
46
|
var styles = useMemo(function () {
|
|
47
|
-
return getStyles(highlightedStartText, highlightedEndText, showLineNumbers);
|
|
47
|
+
return css(getStyles(highlightedStartText, highlightedEndText, showLineNumbers));
|
|
48
48
|
}, [highlightedStartText, highlightedEndText, showLineNumbers, getStyles]);
|
|
49
49
|
|
|
50
50
|
var _useHighlightLines = useHighlightLines({
|
package/dist/esm/code.js
CHANGED
|
@@ -5,7 +5,7 @@ var _excluded = ["testId"],
|
|
|
5
5
|
|
|
6
6
|
/** @jsx jsx */
|
|
7
7
|
import React, { forwardRef, memo, useMemo } from 'react';
|
|
8
|
-
import { jsx } from '@emotion/
|
|
8
|
+
import { css, jsx } from '@emotion/react';
|
|
9
9
|
import { useGlobalTheme } from '@atlaskit/theme/components';
|
|
10
10
|
import CodeBidiWarning from './bidi-warning';
|
|
11
11
|
import codeBidiWarningDecorator from './bidi-warning/bidi-warning-decorator';
|
|
@@ -26,7 +26,7 @@ var Code = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function Code(_ref, ref) {
|
|
|
26
26
|
|
|
27
27
|
var theme = useGlobalTheme();
|
|
28
28
|
var styles = useMemo(function () {
|
|
29
|
-
return getCodeStyles(theme);
|
|
29
|
+
return css(getCodeStyles(theme));
|
|
30
30
|
}, [theme]);
|
|
31
31
|
|
|
32
32
|
var children = props.children,
|
|
@@ -295,17 +295,12 @@ export var getCodeStyles = function getCodeStyles(globalTheme) {
|
|
|
295
295
|
var baseStyles = getBaseCodeStyles(theme);
|
|
296
296
|
return _objectSpread(_objectSpread({}, baseStyles), {}, {
|
|
297
297
|
display: 'inline',
|
|
298
|
-
// monospace font appears slightly larger than the serif font so
|
|
299
|
-
// we use a relative size to better match when used inline
|
|
300
|
-
fontSize: '0.875em',
|
|
301
|
-
// NB vertical padding _will_ effect the boxes vertical alignment so it needs to be
|
|
302
|
-
// minimised. 2px provides a minumum and allows the line height to do the heavy lifting
|
|
303
|
-
// ; 0.5ch is to emulate the half space between the next word with varied font sizes.
|
|
304
298
|
padding: '2px 0.5ch',
|
|
305
|
-
|
|
306
|
-
|
|
299
|
+
boxDecorationBreak: 'clone',
|
|
300
|
+
fontSize: '0.875em',
|
|
307
301
|
overflow: 'auto',
|
|
308
|
-
|
|
302
|
+
overflowWrap: 'break-word',
|
|
303
|
+
whiteSpace: 'pre-wrap'
|
|
309
304
|
});
|
|
310
305
|
};
|
|
311
306
|
export var getCodeBlockTheme = function getCodeBlockTheme(globalTheme, maxLines) {
|
package/dist/esm/version.json
CHANGED
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
/** @jsx jsx */
|
|
2
2
|
import { ReactNode } from 'react';
|
|
3
|
+
import { jsx } from '@emotion/react';
|
|
3
4
|
export declare function Decorator({ bidiCharacter, children, testId, }: {
|
|
4
5
|
bidiCharacter: string;
|
|
5
6
|
children: ReactNode;
|
|
6
7
|
testId?: string;
|
|
7
|
-
}): JSX.Element;
|
|
8
|
+
}): jsx.JSX.Element;
|
package/dist/types/code.d.ts
CHANGED
|
@@ -11,6 +11,6 @@ import type { CodeProps } from './types';
|
|
|
11
11
|
* - [Code](https://atlassian.design/components/code/code)
|
|
12
12
|
* - [Usage](https://atlassian.design/components/code/usage)
|
|
13
13
|
*/
|
|
14
|
-
declare const Code: React.MemoExoticComponent<React.ForwardRefExoticComponent<Pick<CodeProps, "as" | "
|
|
14
|
+
declare const Code: React.MemoExoticComponent<React.ForwardRefExoticComponent<Pick<CodeProps, "as" | "name" | "testId" | "codeBidiWarnings" | "codeBidiWarningLabel" | "codeBidiWarningTooltipEnabled" | "accept" | "acceptCharset" | "action" | "allowFullScreen" | "allowTransparency" | "alt" | "async" | "autoComplete" | "autoFocus" | "autoPlay" | "capture" | "cellPadding" | "cellSpacing" | "charSet" | "challenge" | "checked" | "cite" | "classID" | "cols" | "colSpan" | "content" | "controls" | "coords" | "crossOrigin" | "data" | "dateTime" | "default" | "defer" | "disabled" | "download" | "encType" | "form" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "frameBorder" | "headers" | "height" | "high" | "href" | "hrefLang" | "htmlFor" | "httpEquiv" | "integrity" | "keyParams" | "keyType" | "kind" | "label" | "list" | "loop" | "low" | "manifest" | "marginHeight" | "marginWidth" | "max" | "maxLength" | "media" | "mediaGroup" | "method" | "min" | "minLength" | "multiple" | "muted" | "nonce" | "noValidate" | "open" | "optimum" | "pattern" | "placeholder" | "playsInline" | "poster" | "preload" | "readOnly" | "rel" | "required" | "reversed" | "rows" | "rowSpan" | "sandbox" | "scope" | "scoped" | "scrolling" | "seamless" | "selected" | "shape" | "size" | "sizes" | "span" | "src" | "srcDoc" | "srcLang" | "srcSet" | "start" | "step" | "summary" | "target" | "type" | "useMap" | "value" | "width" | "wmode" | "wrap" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "inputMode" | "is" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "key"> & React.RefAttributes<HTMLElement>>>;
|
|
15
15
|
export { getCodeStyles };
|
|
16
16
|
export default Code;
|
|
@@ -1,11 +1,19 @@
|
|
|
1
|
-
import type { CSSObject } from '@emotion/
|
|
1
|
+
import type { CSSObject } from '@emotion/react';
|
|
2
2
|
import type { Theme } from '@atlaskit/theme/types';
|
|
3
3
|
import type { CodeBlockTheme, CodeTheme } from './types';
|
|
4
4
|
export declare const getLineNumWidth: (numLines: number) => string;
|
|
5
5
|
/**
|
|
6
6
|
* Styles applied at the root element level, common across code/codeblock
|
|
7
7
|
*/
|
|
8
|
-
export declare const getBaseCodeStyles: (theme: CodeTheme) =>
|
|
8
|
+
export declare const getBaseCodeStyles: (theme: CodeTheme) => {
|
|
9
|
+
fontSize: number;
|
|
10
|
+
fontFamily: string | undefined;
|
|
11
|
+
fontWeight: string;
|
|
12
|
+
backgroundColor: string;
|
|
13
|
+
color: string | undefined;
|
|
14
|
+
borderStyle: string;
|
|
15
|
+
borderRadius: string;
|
|
16
|
+
};
|
|
9
17
|
/**
|
|
10
18
|
* Takes an implemented CodeBlock theme, and returns styles required for
|
|
11
19
|
* react-syntax-highlighter.
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default } from './ui';
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
export declare type CodeBidiWarningProps = {
|
|
2
|
+
/**
|
|
3
|
+
* A `testId` prop is provided for specified elements, which is a unique
|
|
4
|
+
* string that appears as a data attribute `data-testid` in the rendered code,
|
|
5
|
+
* serving as a hook for automated tests
|
|
6
|
+
*/
|
|
7
|
+
testId?: string;
|
|
8
|
+
/**
|
|
9
|
+
* A bidi character which can be used to perform a "bidi override attack".
|
|
10
|
+
*
|
|
11
|
+
* See the following document for details.
|
|
12
|
+
*
|
|
13
|
+
* https://hello.atlassian.net/wiki/spaces/PRODSEC/pages/1347434677/PSHELP-2943+Investigate+Trojan+Source+Attack+Vulnerability#1)-Providing-visual-cues-for-our-Customers-in-our-affected-products
|
|
14
|
+
*/
|
|
15
|
+
bidiCharacter: string;
|
|
16
|
+
/**
|
|
17
|
+
* Defaults to enabled (true)
|
|
18
|
+
*
|
|
19
|
+
* Intended to be disabled when used in a mobile view, such as in the editor
|
|
20
|
+
* via mobile bridge, where the tooltip could end up being cut off of otherwise
|
|
21
|
+
* not work as expected.
|
|
22
|
+
*/
|
|
23
|
+
tooltipEnabled?: boolean;
|
|
24
|
+
/**
|
|
25
|
+
* Useful when wrapping the bidi character with the decoration is not achievable.
|
|
26
|
+
*/
|
|
27
|
+
skipChildren?: boolean;
|
|
28
|
+
/**
|
|
29
|
+
* Labels for the previous and next buttons used in pagination.
|
|
30
|
+
* Defaults to `Bidirectional characters change the order that text is rendered. This could be used to obscure malicious code.`.
|
|
31
|
+
*/
|
|
32
|
+
label?: string;
|
|
33
|
+
};
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import type { CodeBlockProps } from './internal/types';
|
|
3
|
+
/**
|
|
4
|
+
* __Code block__
|
|
5
|
+
*
|
|
6
|
+
* A code block highlights an entire block of code and keeps the formatting.
|
|
7
|
+
*
|
|
8
|
+
* - [Examples](https://atlassian.design/components/code/code-block/examples)
|
|
9
|
+
* - [Code](https://atlassian.design/components/code/code-block/code)
|
|
10
|
+
* - [Usage](https://atlassian.design/components/code/code-block/usage)
|
|
11
|
+
*/
|
|
12
|
+
declare const CodeBlock: import("react").NamedExoticComponent<CodeBlockProps>;
|
|
13
|
+
export default CodeBlock;
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
/** @jsx jsx */
|
|
2
|
+
import React from 'react';
|
|
3
|
+
import { getCodeStyles } from './internal/theme/styles';
|
|
4
|
+
import type { CodeProps } from './types';
|
|
5
|
+
/**
|
|
6
|
+
* __Code__
|
|
7
|
+
*
|
|
8
|
+
* Code highlights short strings of code snippets inline with body text.
|
|
9
|
+
*
|
|
10
|
+
* - [Examples](https://atlassian.design/components/code/examples)
|
|
11
|
+
* - [Code](https://atlassian.design/components/code/code)
|
|
12
|
+
* - [Usage](https://atlassian.design/components/code/usage)
|
|
13
|
+
*/
|
|
14
|
+
declare const Code: React.MemoExoticComponent<React.ForwardRefExoticComponent<Pick<CodeProps, "as" | "name" | "testId" | "codeBidiWarnings" | "codeBidiWarningLabel" | "codeBidiWarningTooltipEnabled" | "accept" | "acceptCharset" | "action" | "allowFullScreen" | "allowTransparency" | "alt" | "async" | "autoComplete" | "autoFocus" | "autoPlay" | "capture" | "cellPadding" | "cellSpacing" | "charSet" | "challenge" | "checked" | "cite" | "classID" | "cols" | "colSpan" | "content" | "controls" | "coords" | "crossOrigin" | "data" | "dateTime" | "default" | "defer" | "disabled" | "download" | "encType" | "form" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "frameBorder" | "headers" | "height" | "high" | "href" | "hrefLang" | "htmlFor" | "httpEquiv" | "integrity" | "keyParams" | "keyType" | "kind" | "label" | "list" | "loop" | "low" | "manifest" | "marginHeight" | "marginWidth" | "max" | "maxLength" | "media" | "mediaGroup" | "method" | "min" | "minLength" | "multiple" | "muted" | "nonce" | "noValidate" | "open" | "optimum" | "pattern" | "placeholder" | "playsInline" | "poster" | "preload" | "readOnly" | "rel" | "required" | "reversed" | "rows" | "rowSpan" | "sandbox" | "scope" | "scoped" | "scrolling" | "seamless" | "selected" | "shape" | "size" | "sizes" | "span" | "src" | "srcDoc" | "srcLang" | "srcSet" | "start" | "step" | "summary" | "target" | "type" | "useMap" | "value" | "width" | "wmode" | "wrap" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "inputMode" | "is" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "key"> & React.RefAttributes<HTMLElement>>>;
|
|
15
|
+
export { getCodeStyles };
|
|
16
|
+
export default Code;
|