@atlaskit/code 17.2.3 → 17.2.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.
- package/CHANGELOG.md +14 -0
- package/bidi-warning/package.json +1 -1
- package/bidi-warning-decorator/package.json +1 -1
- package/block/package.json +1 -1
- package/constants/package.json +1 -1
- package/dist/cjs/bidi-warning/ui/index.js +8 -3
- package/dist/cjs/code-block.compiled.css +21 -21
- package/dist/cjs/code-block.js +17 -7
- package/dist/cjs/code.compiled.css +1 -1
- package/dist/cjs/code.js +10 -4
- package/dist/cjs/constants.js +4 -0
- package/dist/cjs/syntax-highlighter/lib/process/create-line-element.js +4 -1
- package/dist/cjs/syntax-highlighter/lib/react-renderer/create-element.js +1 -1
- package/dist/es2019/bidi-warning/ui/index.js +8 -3
- package/dist/es2019/code-block.compiled.css +21 -21
- package/dist/es2019/code-block.js +17 -7
- package/dist/es2019/code.compiled.css +1 -1
- package/dist/es2019/code.js +9 -3
- package/dist/es2019/constants.js +4 -0
- package/dist/es2019/syntax-highlighter/lib/process/create-line-element.js +4 -1
- package/dist/es2019/syntax-highlighter/lib/react-renderer/create-element.js +1 -1
- package/dist/esm/bidi-warning/ui/index.js +8 -3
- package/dist/esm/code-block.compiled.css +21 -21
- package/dist/esm/code-block.js +17 -7
- package/dist/esm/code.compiled.css +1 -1
- package/dist/esm/code.js +10 -4
- package/dist/esm/constants.js +4 -0
- package/dist/esm/syntax-highlighter/lib/process/create-line-element.js +4 -1
- package/dist/esm/syntax-highlighter/lib/react-renderer/create-element.js +1 -1
- package/dist/types/bidi-warning/ui/index.d.ts +1 -1
- package/dist/types/bidi-warning/ui/types.d.ts +15 -0
- package/dist/types/code-block.d.ts +0 -1
- package/dist/types/constants.d.ts +4 -0
- package/dist/types/internal/hooks/use-highlight.d.ts +1 -1
- package/dist/types/internal/types.d.ts +20 -0
- package/dist/types/syntax-highlighter/lib/highlight.d.ts +0 -1
- package/dist/types/syntax-highlighter/lib/process/create-line-element.d.ts +9 -1
- package/dist/types/types.d.ts +13 -0
- package/dist/types-ts4.5/bidi-warning/ui/index.d.ts +1 -1
- package/dist/types-ts4.5/bidi-warning/ui/types.d.ts +15 -0
- package/dist/types-ts4.5/code-block.d.ts +0 -1
- package/dist/types-ts4.5/constants.d.ts +7 -0
- package/dist/types-ts4.5/internal/hooks/use-highlight.d.ts +1 -1
- package/dist/types-ts4.5/internal/types.d.ts +20 -0
- package/dist/types-ts4.5/syntax-highlighter/lib/highlight.d.ts +0 -1
- package/dist/types-ts4.5/syntax-highlighter/lib/process/create-line-element.d.ts +9 -1
- package/dist/types-ts4.5/types.d.ts +13 -0
- package/inline/package.json +1 -1
- package/offerings.json +65 -0
- package/package.json +10 -20
- package/types/package.json +1 -1
|
@@ -12,9 +12,9 @@ import { getLineNumWidth } from './internal/theme/styles';
|
|
|
12
12
|
import { normalizeLanguage } from './internal/utils/get-normalized-language';
|
|
13
13
|
import SyntaxHighlighter from './syntax-highlighter';
|
|
14
14
|
const getCodeBlockStyles = {
|
|
15
|
-
root: "
|
|
16
|
-
showLineNumbers: "_17071olh _1i3h1txw
|
|
17
|
-
dontShowLineNumbers: "_1i3h1ule
|
|
15
|
+
root: "_2rko12b0 _1dqoglyw _1wyb1crf _k48pi7a9 _1e0c1txw _vwz4gktf _1reo1wug _o572qvpr _1eimjvyg _bfhktkvp _syaz1fxt _ect41odn _1ozdn7od _7xinn7od _t7aun7od _r28du2gc _tajqu2gc _1ohiu2gc _m802u2gc _i6ntu2gc _1w2xu2gc _1hmyegat _vblregat _vbulegat _196q1xv3 _1vbw1xv3 _1v9c1xv3 _1srn17d7 _18r6myb0 _vyvc1n1a _1d4j1y44 _1f8gstnw _1pzyb3bt _ra6gww7y _13cdh2mm _1pp0126e _zvy9f705 _qcxof705 _qzn01a66 _j0l11wug _1weckb7n _1na21hna _vsnzgrf3 _x7c815vq _lh0y15vq _1m3815vq _qk1e15vq _12l6ysn8 _uga3ysn8 _mx8b7mnp _1kr87mnp _xo19t94y _1bemt94y _nalpstnw _151dstnw _1exb1q9c _1hgu1q9c _1mgnt94y _nhket94y _h909m7j4 _scgayz1z _ipl81e17 _40uk1l04 _i81p1a66 _1gx21e5h _1ls0df4r _vm2c1rh5 _12ok1rh5 _1ls01ule _rude1ule _1q16glyw _1io6glyw _juomusic _lcwuusic _pyovu2gc _ccm6u2gc _1ascu2gc _1yuau2gc _xr0w1a66 _4io21a66 _euyxusvi _cahfusvi _zhnuidpf _1amdidpf _mbgcpf9b _bu7zpf9b _131n1giz _gy101giz _1wfuwrk5 _16kzwrk5 _9kk3moej _cjus1w1g _9k2r1m30 _nhmw1m30 _yl021m30 _eiht5x2v _t9zb5x2v _mqok1w1g _3hsg1w1g _i7ngn7od _9wu1fb2s _1xcoh55r _1t361fxt _137bh55r _1k7d1fxt _97lipnps _12nh9lu1 _1g0517qg _i2ig10m5 _326z1fxt _113p131l _1n6tpnps _tgu817qg _1k47pnps _g0lx1fxt _ys4e131l _7gp8h55r _1yvq10m5 _1vww10m5 _1rju10m5 _1v0lh55r _wmyy17qg _748n17qg _1mfn17qg _1d7e17qg _p2vr17qg _19o610m5 _kxov17qg _1np517qg _m2f517qg _1b9tpnps _1tq6pnps _1rd2pnps _1pbkpnps _k3lipnps _13zt131l _2g12fb2s _k86b10m5 _b5iy131l _gti3131l _1f0gpnps _9d3e17qg _qdiapnps _72uvpnps",
|
|
16
|
+
showLineNumbers: "_17071olh _1i3h1txw _16noidpf _h4fuidpf _pp6yidpf _1g4tidpf _11wmidpf _1bx8idpf",
|
|
17
|
+
dontShowLineNumbers: "_1i3h1ule _16nou2gc _h4fuu2gc _pp6yu2gc _1g4tu2gc _11wmu2gc _1bx8u2gc",
|
|
18
18
|
shouldWrapLongLines: "_13dgkb7n",
|
|
19
19
|
dontWrapLongLines: "_13dgkb7n"
|
|
20
20
|
};
|
|
@@ -30,6 +30,7 @@ const getCodeBlockStyles = {
|
|
|
30
30
|
*/
|
|
31
31
|
const CodeBlock = /*#__PURE__*/memo(function CodeBlock({
|
|
32
32
|
showLineNumbers = true,
|
|
33
|
+
shouldShowLineNumbers,
|
|
33
34
|
firstLineNumber = 1,
|
|
34
35
|
language: providedLanguage = 'text',
|
|
35
36
|
highlight = '',
|
|
@@ -38,16 +39,25 @@ const CodeBlock = /*#__PURE__*/memo(function CodeBlock({
|
|
|
38
39
|
testId,
|
|
39
40
|
text,
|
|
40
41
|
codeBidiWarnings = true,
|
|
42
|
+
hasBidiWarnings,
|
|
41
43
|
codeBidiWarningLabel,
|
|
42
44
|
codeBidiWarningTooltipEnabled = true,
|
|
45
|
+
isBidiWarningTooltipEnabled,
|
|
43
46
|
shouldWrapLongLines = false,
|
|
44
47
|
label = 'Scrollable content'
|
|
45
48
|
}) {
|
|
46
49
|
const scrollableRef = useRef(null);
|
|
47
50
|
const [showContentFocus, setShowContentFocus] = useState(false);
|
|
51
|
+
|
|
52
|
+
// Use children if provided, otherwise fall back to deprecated text prop
|
|
48
53
|
const numLines = (text || '').split('\n').length + (firstLineNumber > 0 ? firstLineNumber : 1) - 1;
|
|
49
54
|
const lineNumberWidth = numLines ? getLineNumWidth(numLines) : 0;
|
|
50
55
|
|
|
56
|
+
// Use new props if provided, otherwise fall back to deprecated props
|
|
57
|
+
const shouldShowLineNumbersValue = shouldShowLineNumbers !== undefined ? shouldShowLineNumbers : showLineNumbers;
|
|
58
|
+
const shouldShowBidiWarnings = hasBidiWarnings !== undefined ? hasBidiWarnings : codeBidiWarnings;
|
|
59
|
+
const shouldEnableTooltip = isBidiWarningTooltipEnabled !== undefined ? isBidiWarningTooltipEnabled : codeBidiWarningTooltipEnabled;
|
|
60
|
+
|
|
51
61
|
// Schedule a content focus on the target element
|
|
52
62
|
// WARNING: In theory, `target` may not be available when `rafSchedule` hits in concurrent rendering
|
|
53
63
|
useEffect(() => {
|
|
@@ -84,7 +94,7 @@ const CodeBlock = /*#__PURE__*/memo(function CodeBlock({
|
|
|
84
94
|
'--ads-highlighted-start-text': highlightedStartText,
|
|
85
95
|
'--ads-highlighted-end-text': highlightedEndText
|
|
86
96
|
},
|
|
87
|
-
showLineNumbers:
|
|
97
|
+
showLineNumbers: shouldShowLineNumbersValue,
|
|
88
98
|
firstLineNumber: firstLineNumber,
|
|
89
99
|
lineProps: getLineProps
|
|
90
100
|
// shouldCreateParentElementForLines is needed to pass down props to each line.
|
|
@@ -93,15 +103,15 @@ const CodeBlock = /*#__PURE__*/memo(function CodeBlock({
|
|
|
93
103
|
,
|
|
94
104
|
shouldCreateParentElementForLines: highlight.length > 0 || !!testId,
|
|
95
105
|
shouldWrapLongLines: shouldWrapLongLines,
|
|
96
|
-
codeBidiWarnings:
|
|
106
|
+
codeBidiWarnings: shouldShowBidiWarnings,
|
|
97
107
|
codeBidiWarningLabel: codeBidiWarningLabel,
|
|
98
|
-
codeBidiWarningTooltipEnabled:
|
|
108
|
+
codeBidiWarningTooltipEnabled: shouldEnableTooltip,
|
|
99
109
|
text: text,
|
|
100
110
|
tabIndex: showContentFocus ? '0' : undefined,
|
|
101
111
|
"aria-label": showContentFocus ? label : undefined,
|
|
102
112
|
role: showContentFocus ? 'region' : undefined,
|
|
103
113
|
scrollRef: scrollableRef,
|
|
104
|
-
className: ax([getCodeBlockStyles.root, shouldWrapLongLines ? getCodeBlockStyles.shouldWrapLongLines : getCodeBlockStyles.dontWrapLongLines,
|
|
114
|
+
className: ax([getCodeBlockStyles.root, shouldWrapLongLines ? getCodeBlockStyles.shouldWrapLongLines : getCodeBlockStyles.dontWrapLongLines, shouldShowLineNumbersValue ? getCodeBlockStyles.showLineNumbers : getCodeBlockStyles.dontShowLineNumbers])
|
|
105
115
|
});
|
|
106
116
|
});
|
|
107
117
|
export default CodeBlock;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
._11c81u0j{font:var(--ds-font-code,normal 400 .875em/1 ui-monospace,Menlo,"Segoe UI Mono","Ubuntu Mono",monospace)}
|
|
2
|
-
.
|
|
2
|
+
._2rkofajl{border-radius:var(--ds-radius-small,3px)}
|
|
3
3
|
._1dqoglyw{border-style:none}
|
|
4
4
|
._16d9qvcn{-webkit-box-decoration-break:clone;box-decoration-break:clone}
|
|
5
5
|
._18m91wug{overflow-y:auto}
|
package/dist/es2019/code.js
CHANGED
|
@@ -6,7 +6,7 @@ import React, { forwardRef, memo } from 'react';
|
|
|
6
6
|
import CodeBidiWarning from './bidi-warning';
|
|
7
7
|
import codeBidiWarningDecorator from './bidi-warning/bidi-warning-decorator';
|
|
8
8
|
const styles = {
|
|
9
|
-
base: "_ca0qyh40 _u5f3m5ip _n3tdyh40 _19bvm5ip
|
|
9
|
+
base: "_ca0qyh40 _u5f3m5ip _n3tdyh40 _19bvm5ip _2rkofajl _11c81u0j _1reo1wug _18m91wug _1dqoglyw _1e0c1nu9 _bfhktkvp _16d9qvcn _syaz1fxt _vwz41kw7 _1i4q1hna _o5721jtm"
|
|
10
10
|
};
|
|
11
11
|
|
|
12
12
|
/**
|
|
@@ -25,13 +25,19 @@ const Code = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function Code({
|
|
|
25
25
|
const {
|
|
26
26
|
children,
|
|
27
27
|
codeBidiWarnings = true,
|
|
28
|
+
hasBidiWarnings,
|
|
28
29
|
codeBidiWarningLabel,
|
|
29
30
|
codeBidiWarningTooltipEnabled = true,
|
|
31
|
+
isBidiWarningTooltipEnabled,
|
|
30
32
|
...otherProps
|
|
31
33
|
} = props;
|
|
32
|
-
|
|
34
|
+
|
|
35
|
+
// Use new props if provided, otherwise fall back to deprecated props
|
|
36
|
+
const shouldShowBidiWarnings = hasBidiWarnings !== undefined ? hasBidiWarnings : codeBidiWarnings;
|
|
37
|
+
const shouldEnableTooltip = isBidiWarningTooltipEnabled !== undefined ? isBidiWarningTooltipEnabled : codeBidiWarningTooltipEnabled;
|
|
38
|
+
const decoratedChildren = shouldShowBidiWarnings ? /*#__PURE__*/React.createElement(RenderCodeChildrenWithBidiWarnings, {
|
|
33
39
|
codeBidiWarningLabel: codeBidiWarningLabel,
|
|
34
|
-
codeBidiWarningTooltipEnabled:
|
|
40
|
+
codeBidiWarningTooltipEnabled: shouldEnableTooltip
|
|
35
41
|
}, children) : children;
|
|
36
42
|
return /*#__PURE__*/React.createElement("code", _extends({
|
|
37
43
|
ref: ref,
|
package/dist/es2019/constants.js
CHANGED
|
@@ -321,6 +321,10 @@ export const SUPPORTED_LANGUAGES = [{
|
|
|
321
321
|
name: 'Protocol Buffers',
|
|
322
322
|
alias: ['protobuf', 'proto'],
|
|
323
323
|
value: 'protobuf'
|
|
324
|
+
}, {
|
|
325
|
+
name: 'TOML',
|
|
326
|
+
alias: ['toml'],
|
|
327
|
+
value: 'toml'
|
|
324
328
|
}, {
|
|
325
329
|
name: 'Handlebars',
|
|
326
330
|
alias: ['handlebars', 'mustache'],
|
|
@@ -3,16 +3,19 @@ export default function createLineElement({
|
|
|
3
3
|
children,
|
|
4
4
|
lineNumber,
|
|
5
5
|
showLineNumbers,
|
|
6
|
+
shouldShowLineNumbers,
|
|
6
7
|
lineProps = {},
|
|
7
8
|
className = []
|
|
8
9
|
}) {
|
|
10
|
+
// Use new prop if provided, otherwise fall back to deprecated prop
|
|
11
|
+
const shouldShowLineNumbersValue = shouldShowLineNumbers !== undefined ? shouldShowLineNumbers : showLineNumbers;
|
|
9
12
|
const propsPassedInFromCodeBlock = typeof lineProps === 'function' ? lineProps(lineNumber) : lineProps;
|
|
10
13
|
const properties = {
|
|
11
14
|
...propsPassedInFromCodeBlock,
|
|
12
15
|
className
|
|
13
16
|
};
|
|
14
17
|
let currentChildren = children;
|
|
15
|
-
if (lineNumber &&
|
|
18
|
+
if (lineNumber && shouldShowLineNumbersValue) {
|
|
16
19
|
// When syntax highlighting is NOT turned on, the entire LOC is just a single
|
|
17
20
|
// child. We can then happily create the line number and the LOC as siblings...
|
|
18
21
|
if (currentChildren.length === 1) {
|
|
@@ -29,7 +29,7 @@ export default function createElement({
|
|
|
29
29
|
bidiCharacter: bidiCharacter,
|
|
30
30
|
key: index,
|
|
31
31
|
label: codeBidiWarningConfig.codeBidiWarningLabel,
|
|
32
|
-
|
|
32
|
+
isTooltipEnabled: codeBidiWarningConfig.codeBidiWarningTooltipEnabled
|
|
33
33
|
}));
|
|
34
34
|
return decorated;
|
|
35
35
|
}
|
|
@@ -16,10 +16,15 @@ export default function BidiWarning(_ref) {
|
|
|
16
16
|
var testId = _ref.testId,
|
|
17
17
|
bidiCharacter = _ref.bidiCharacter,
|
|
18
18
|
skipChildren = _ref.skipChildren,
|
|
19
|
+
shouldSkipChildren = _ref.shouldSkipChildren,
|
|
19
20
|
tooltipEnabled = _ref.tooltipEnabled,
|
|
21
|
+
isTooltipEnabled = _ref.isTooltipEnabled,
|
|
20
22
|
_ref$label = _ref.label,
|
|
21
23
|
label = _ref$label === void 0 ? 'Bidirectional characters change the order that text is rendered. This could be used to obscure malicious code.' : _ref$label;
|
|
22
|
-
if
|
|
24
|
+
// Use new props if provided, otherwise fall back to deprecated props
|
|
25
|
+
var shouldEnableTooltip = isTooltipEnabled !== undefined ? isTooltipEnabled : tooltipEnabled;
|
|
26
|
+
var shouldSkip = shouldSkipChildren !== undefined ? shouldSkipChildren : skipChildren;
|
|
27
|
+
if (shouldEnableTooltip) {
|
|
23
28
|
return (
|
|
24
29
|
/*#__PURE__*/
|
|
25
30
|
// Following patches, this should be updated to use the render props signature which will provide aria attributes.
|
|
@@ -31,13 +36,13 @@ export default function BidiWarning(_ref) {
|
|
|
31
36
|
}, /*#__PURE__*/React.createElement(Decorator, {
|
|
32
37
|
testId: testId,
|
|
33
38
|
bidiCharacter: bidiCharacter
|
|
34
|
-
},
|
|
39
|
+
}, shouldSkip ? null : bidiCharacter))
|
|
35
40
|
);
|
|
36
41
|
}
|
|
37
42
|
return /*#__PURE__*/React.createElement(Decorator, {
|
|
38
43
|
testId: testId,
|
|
39
44
|
bidiCharacter: bidiCharacter
|
|
40
|
-
},
|
|
45
|
+
}, shouldSkip ? null : bidiCharacter);
|
|
41
46
|
}
|
|
42
47
|
var CustomizedTagWithRef = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
43
48
|
var children = props.children,
|
|
@@ -1,26 +1,25 @@
|
|
|
1
1
|
|
|
2
2
|
._1ozdn7od code, ._7xinn7od code[class*=language-], ._t7aun7od pre[class*=language-]{all:unset}
|
|
3
3
|
._i7ngn7od .token:not([class=token],[data-ds--code--row--highlight],[data-ds--code--row]){all:unset}
|
|
4
|
-
.
|
|
4
|
+
._2rko12b0{border-radius:var(--ds-radius-small,4px)}
|
|
5
5
|
._1dqoglyw{border-style:none}
|
|
6
|
-
.
|
|
7
|
-
.
|
|
8
|
-
.
|
|
9
|
-
.
|
|
6
|
+
._196q1xv3 [data-ds--code--row--highlight]:last-child{border-block-end:var(--ds-border-width,1px) dashed transparent}
|
|
7
|
+
._1srn17d7 [data-ds--code--row--highlight] .linenumber:before{border-block-start:var(--ds-border-width,1px) solid var(--ds-border-focused,#388bff)}
|
|
8
|
+
._1vbw1xv3 [data-ds--code--row--highlight]+[data-ds--code--row]:not([data-ds--code--row--highlight]), ._1v9c1xv3 [data-ds--code--row]:not([data-ds--code--row--highlight])+[data-ds--code--row--highlight]{border-block-start:var(--ds-border-width,1px) dashed transparent}
|
|
9
|
+
._ra6gww7y [data-ds--code--row--highlight] .linenumber{border-inline-start:4px solid var(--ds-border-focused,#388bff)}._113p131l .token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.cdata{color:var(--ds-text-subtlest,#626f86)}
|
|
10
10
|
._12l6ysn8 [data-ds--code--row--highlight]:after, ._uga3ysn8 [data-ds--code--row--highlight]:before{clip-path:inset(100%)}
|
|
11
11
|
._12nh9lu1 .token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.deleted{color:var(--ds-text-accent-red,#ae2e24)}
|
|
12
|
-
._12tu1a66 .linenumber, ._zu0j1a66 .ds-sh-line-number{padding-right:var(--ds-space-100,8px)!important}
|
|
13
12
|
._131n1giz .linenumber, ._gy101giz .ds-sh-line-number{font-style:normal!important}
|
|
14
13
|
._137bh55r .token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.inserted{color:var(--ds-text-accent-green,#216e4e)}
|
|
15
14
|
._13cdh2mm [data-ds--code--row--highlight] .linenumber{position:relative}
|
|
16
15
|
._13dgkb7n code:last-of-type{flex-shrink:1}
|
|
17
16
|
._13zt131l .token.token.token.token.token.token.token.substr{color:var(--ds-text-subtlest,#626f86)}
|
|
18
|
-
.
|
|
19
|
-
.
|
|
20
|
-
._15ba126e [data-ds--code--row--highlight] .linenumber{padding-left:var(--ds-space-050,4px)!important}
|
|
17
|
+
._16noidpf code, ._h4fuidpf code[class*=language-], ._pp6yidpf pre[class*=language-]{padding-inline-end:0}
|
|
18
|
+
._16nou2gc code, ._h4fuu2gc code[class*=language-], ._pp6yu2gc pre[class*=language-]{padding-inline-end:var(--ds-space-100,8px)}
|
|
21
19
|
._17071olh code:first-of-type{background-image:linear-gradient(to right,var(--ds--code--line-number-bg-color,var(--ds-background-neutral,#091e420f)),var(--ds--code--line-number-bg-color,var(--ds-background-neutral,#091e420f)) var(--ads-code-line-number-width),transparent var(--ads-code-line-number-width),transparent)}
|
|
22
|
-
.
|
|
20
|
+
._18r6myb0 [data-ds--code--row--highlight] .linenumber:before{inset-inline-start:-4px}
|
|
23
21
|
._19o610m5 .token.token.token.token.token.token.token.token.token.token.url{color:var(--ds-text-accent-purple,#5e4db2)}
|
|
22
|
+
._1ascu2gc .linenumber, ._1yuau2gc .ds-sh-line-number{padding-inline-start:var(--ds-space-100,8px)}
|
|
24
23
|
._1b9tpnps .token.token.token.token.token.token.token.token.builtin, ._1tq6pnps .token.token.token.token.token.token.token.token.bullet, ._1rd2pnps .token.token.token.token.token.token.token.token.code, ._1pbkpnps .token.token.token.token.token.token.token.token.entity, ._k3lipnps .token.token.token.token.token.token.token.token.namespace{color:var(--ds-text-accent-blue,#05c)}
|
|
25
24
|
._1d4j1y44 [data-ds--code--row--highlight] .linenumber:before{width:4px}
|
|
26
25
|
._1e0c1txw{display:flex}
|
|
@@ -29,12 +28,10 @@
|
|
|
29
28
|
._1f0gpnps .token.token.token.selector{color:var(--ds-text-accent-blue,#05c)}
|
|
30
29
|
._1f8gstnw [data-ds--code--row--highlight] .linenumber:before{position:absolute}
|
|
31
30
|
._1g0517qg .token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.constant{color:var(--ds-text-accent-teal,#206a83)}
|
|
32
|
-
.
|
|
31
|
+
._1g4tidpf code, ._11wmidpf code[class*=language-], ._1bx8idpf pre[class*=language-]{padding-inline-start:0}
|
|
32
|
+
._1g4tu2gc code, ._11wmu2gc code[class*=language-], ._1bx8u2gc pre[class*=language-]{padding-inline-start:var(--ds-space-100,8px)}
|
|
33
33
|
._1gx21e5h .linenumber{float:left}
|
|
34
|
-
._1hmimyb0 [data-ds--code--row--highlight] .linenumber:before{left:-4px}
|
|
35
34
|
._1hmyegat code, ._vblregat code[class*=language-], ._vbulegat pre[class*=language-]{tab-size:4}
|
|
36
|
-
._1huoidpf code, ._1a9lidpf code[class*=language-], ._20bqidpf pre[class*=language-]{padding-right:0}
|
|
37
|
-
._1huou2gc code, ._1a9lu2gc code[class*=language-], ._20bqu2gc pre[class*=language-]{padding-right:var(--ds-space-100,8px)}
|
|
38
35
|
._1i3h1txw [data-ds--code--row]{display:flex}
|
|
39
36
|
._1i3h1ule [data-ds--code--row]{display:block}
|
|
40
37
|
._1k47pnps .token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.number{color:var(--ds-text-accent-blue,#05c)}
|
|
@@ -45,24 +42,20 @@
|
|
|
45
42
|
._1mgnt94y [data-ds--code--row--highlight]:after, ._nhket94y [data-ds--code--row--highlight]:before{width:1px}
|
|
46
43
|
._1n6tpnps .token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.prolog{color:var(--ds-text-accent-blue,#05c)}
|
|
47
44
|
._1na21hna code:last-of-type{word-break:break-word}
|
|
48
|
-
.
|
|
49
|
-
._1oggu2gc code, ._bympu2gc code[class*=language-], ._9nnju2gc pre[class*=language-]{padding-left:var(--ds-space-100,8px)}
|
|
45
|
+
._1pp0126e [data-ds--code--row--highlight] .linenumber{padding-inline-start:var(--ds-space-050,4px)!important}
|
|
50
46
|
._1pzyb3bt [data-ds--code--row--highlight] .linenumber:before{content:""}
|
|
51
47
|
._1q16glyw .linenumber, ._1io6glyw .ds-sh-line-number{-webkit-user-select:none;-ms-user-select:none;user-select:none}
|
|
52
|
-
._1ra01n1a [data-ds--code--row--highlight] .linenumber:before{top:-1px}
|
|
53
48
|
._1reo1wug{overflow-x:auto}
|
|
54
49
|
._1t361fxt .token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.operator{color:var(--ds-text,#172b4d)}
|
|
55
50
|
._1v0lh55r .token.token.token.token.token.token.token.token.token.token.token.token.string{color:var(--ds-text-accent-green,#216e4e)}
|
|
56
|
-
._1v15u2gc code, ._ilvcu2gc code[class*=language-], ._m29uu2gc pre[class*=language-]{padding-top:var(--ds-space-100,8px)}
|
|
57
51
|
._1weckb7n code:last-of-type{flex-grow:1}
|
|
58
52
|
._1wfuwrk5 .linenumber, ._16kzwrk5 .ds-sh-line-number{min-width:var(--ads-code-line-number-width)!important}
|
|
59
53
|
._1wyb1crf{font-size:9pt}
|
|
60
54
|
._1xcoh55r .token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.atrule{color:var(--ds-text-accent-green,#216e4e)}
|
|
61
|
-
._1xx2grf3 code:first-of-type{padding-right:0!important}
|
|
62
55
|
._1yvq10m5 .token.token.token.token.token.token.token.token.token.token.token.token.token.class-name, ._1vww10m5 .token.token.token.token.token.token.token.token.token.token.token.token.token.section, ._1rju10m5 .token.token.token.token.token.token.token.token.token.token.token.token.token.title{color:var(--ds-text-accent-purple,#5e4db2)}
|
|
63
|
-
._28ddu2gc .linenumber, ._1i8zu2gc .ds-sh-line-number{padding-left:var(--ds-space-100,8px)}
|
|
64
56
|
._2g12fb2s .token.token.token.token.token.token.doctype{color:var(--ds-text-accent-yellow,#7f5f01)}
|
|
65
57
|
._326z1fxt .token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.punctuation{color:var(--ds-text,#172b4d)}
|
|
58
|
+
._40uk1l04 [data-ds--code--row]{margin-inline-end:-var(--ds-space-100,8px)}
|
|
66
59
|
._7gp8h55r .token.token.token.token.token.token.token.token.token.token.token.token.token.token.meta-keyword{color:var(--ds-text-accent-green,#216e4e)}
|
|
67
60
|
._97lipnps .token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.boolean{color:var(--ds-text-accent-blue,#05c)}
|
|
68
61
|
._9d3e17qg .token.token.attr-name{color:var(--ds-text-accent-teal,#206a83)}
|
|
@@ -78,28 +71,35 @@
|
|
|
78
71
|
._g0lx1fxt .token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.function{color:var(--ds-text,#172b4d)}
|
|
79
72
|
._h909m7j4 [data-ds--code--row--highlight]{background-color:var(--ds-background-neutral,#091e420f)}
|
|
80
73
|
._i2ig10m5 .token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.property{color:var(--ds-text-accent-purple,#5e4db2)}
|
|
74
|
+
._i81p1a66 [data-ds--code--row]{padding-inline-end:var(--ds-space-100,8px)!important}
|
|
81
75
|
._ipl81e17 [data-ds--code--row--highlight]:before{content:" [var(--ads-highlighted-start-text)] "}
|
|
82
76
|
._j0l11wug code:last-of-type{flex-basis:auto}
|
|
83
|
-
._jeky1l04 [data-ds--code--row]{margin-right:-var(--ds-space-100,8px)}
|
|
84
77
|
._juomusic .linenumber, ._lcwuusic .ds-sh-line-number{text-align:right}
|
|
85
78
|
._k48pi7a9{font-weight:var(--ds-font-weight-regular,400)}
|
|
86
79
|
._k86b10m5 .token.token.token.token.token.function-name{color:var(--ds-text-accent-purple,#5e4db2)}
|
|
87
80
|
._kxov17qg .token.token.token.token.token.token.token.token.token.regex, ._1np517qg .token.token.token.token.token.token.token.token.token.symbol, ._m2f517qg .token.token.token.token.token.token.token.token.token.variable{color:var(--ds-text-accent-teal,#206a83)}
|
|
81
|
+
._m802u2gc code, ._i6ntu2gc code[class*=language-], ._1w2xu2gc pre[class*=language-]{padding-block-end:var(--ds-space-100,8px)}
|
|
88
82
|
._mbgcpf9b .linenumber, ._bu7zpf9b .ds-sh-line-number{color:var(--ds-text-subtlest,#626f86)!important}
|
|
89
83
|
._mqok1w1g .token.key:not(.important,.bold), ._3hsg1w1g .token.keyword:not(.important,.bold){font-weight:bolder}
|
|
90
84
|
._mx8b7mnp [data-ds--code--row--highlight]:after, ._1kr87mnp [data-ds--code--row--highlight]:before{clip:rect(1px,1px,1px,1px)}
|
|
91
85
|
._nalpstnw [data-ds--code--row--highlight]:after, ._151dstnw [data-ds--code--row--highlight]:before{position:absolute}
|
|
92
86
|
._nhmw1m30 .token.block-comment:not(.italic), ._yl021m30 .token.comment:not(.italic){font-style:italic}
|
|
93
87
|
._o572qvpr{white-space:pre}
|
|
88
|
+
._pyovu2gc .linenumber, ._ccm6u2gc .ds-sh-line-number{margin-inline-end:var(--ds-space-100,8px)}
|
|
94
89
|
._qdiapnps .token.key, ._72uvpnps .token.keyword{color:var(--ds-text-accent-blue,#05c)}
|
|
90
|
+
._qzn01a66 code:last-of-type{padding-inline-end:var(--ds-space-100,8px)!important}
|
|
91
|
+
._r28du2gc code, ._tajqu2gc code[class*=language-], ._1ohiu2gc pre[class*=language-]{padding-block-start:var(--ds-space-100,8px)}
|
|
95
92
|
._scgayz1z [data-ds--code--row--highlight]:after{content:" [var(--ads-highlighted-end-text)] "}
|
|
96
93
|
._syaz1fxt{color:var(--ds-text,#172b4d)}
|
|
97
94
|
._tgu817qg .token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.attr-value{color:var(--ds-text-accent-teal,#206a83)}
|
|
98
95
|
._vm2c1rh5 .linenumber:after, ._12ok1rh5 .ds-sh-line-number:after{content:attr(data-ds--line-number)}
|
|
96
|
+
._vsnzgrf3 code:first-of-type{padding-inline-end:0!important}
|
|
99
97
|
._vwz4gktf{line-height:20px}
|
|
98
|
+
._vyvc1n1a [data-ds--code--row--highlight] .linenumber:before{inset-block-start:-1px}
|
|
100
99
|
._wmyy17qg .token.token.token.token.token.token.token.token.token.token.token.quote, ._748n17qg .token.token.token.token.token.token.token.token.token.token.token.selector-attr, ._1mfn17qg .token.token.token.token.token.token.token.token.token.token.token.selector-pseudo, ._1d7e17qg .token.token.token.token.token.token.token.token.token.token.token.tag, ._p2vr17qg .token.token.token.token.token.token.token.token.token.token.token.type{color:var(--ds-text-accent-teal,#206a83)}
|
|
101
100
|
._x7c815vq [data-ds--code--row--highlight]:after, ._lh0y15vq [data-ds--code--row--highlight]:before{overflow-x:hidden}
|
|
102
101
|
._xo19t94y [data-ds--code--row--highlight]:after, ._1bemt94y [data-ds--code--row--highlight]:before{height:1px}
|
|
102
|
+
._xr0w1a66 .linenumber, ._4io21a66 .ds-sh-line-number{padding-inline-end:var(--ds-space-100,8px)!important}
|
|
103
103
|
._ys4e131l .token.token.token.token.token.token.token.token.token.token.token.token.token.token.token.meta{color:var(--ds-text-subtlest,#626f86)}
|
|
104
104
|
._zhnuidpf .linenumber, ._1amdidpf .ds-sh-line-number{flex-shrink:0}
|
|
105
105
|
._zvy9f705 code>span:only-child:empty:before, ._qcxof705 code>span:only-child>span:only-child:empty:before{content:" "}
|
package/dist/esm/code-block.js
CHANGED
|
@@ -14,9 +14,9 @@ import { getLineNumWidth } from './internal/theme/styles';
|
|
|
14
14
|
import { normalizeLanguage } from './internal/utils/get-normalized-language';
|
|
15
15
|
import SyntaxHighlighter from './syntax-highlighter';
|
|
16
16
|
var getCodeBlockStyles = {
|
|
17
|
-
root: "
|
|
18
|
-
showLineNumbers: "_17071olh _1i3h1txw
|
|
19
|
-
dontShowLineNumbers: "_1i3h1ule
|
|
17
|
+
root: "_2rko12b0 _1dqoglyw _1wyb1crf _k48pi7a9 _1e0c1txw _vwz4gktf _1reo1wug _o572qvpr _1eimjvyg _bfhktkvp _syaz1fxt _ect41odn _1ozdn7od _7xinn7od _t7aun7od _r28du2gc _tajqu2gc _1ohiu2gc _m802u2gc _i6ntu2gc _1w2xu2gc _1hmyegat _vblregat _vbulegat _196q1xv3 _1vbw1xv3 _1v9c1xv3 _1srn17d7 _18r6myb0 _vyvc1n1a _1d4j1y44 _1f8gstnw _1pzyb3bt _ra6gww7y _13cdh2mm _1pp0126e _zvy9f705 _qcxof705 _qzn01a66 _j0l11wug _1weckb7n _1na21hna _vsnzgrf3 _x7c815vq _lh0y15vq _1m3815vq _qk1e15vq _12l6ysn8 _uga3ysn8 _mx8b7mnp _1kr87mnp _xo19t94y _1bemt94y _nalpstnw _151dstnw _1exb1q9c _1hgu1q9c _1mgnt94y _nhket94y _h909m7j4 _scgayz1z _ipl81e17 _40uk1l04 _i81p1a66 _1gx21e5h _1ls0df4r _vm2c1rh5 _12ok1rh5 _1ls01ule _rude1ule _1q16glyw _1io6glyw _juomusic _lcwuusic _pyovu2gc _ccm6u2gc _1ascu2gc _1yuau2gc _xr0w1a66 _4io21a66 _euyxusvi _cahfusvi _zhnuidpf _1amdidpf _mbgcpf9b _bu7zpf9b _131n1giz _gy101giz _1wfuwrk5 _16kzwrk5 _9kk3moej _cjus1w1g _9k2r1m30 _nhmw1m30 _yl021m30 _eiht5x2v _t9zb5x2v _mqok1w1g _3hsg1w1g _i7ngn7od _9wu1fb2s _1xcoh55r _1t361fxt _137bh55r _1k7d1fxt _97lipnps _12nh9lu1 _1g0517qg _i2ig10m5 _326z1fxt _113p131l _1n6tpnps _tgu817qg _1k47pnps _g0lx1fxt _ys4e131l _7gp8h55r _1yvq10m5 _1vww10m5 _1rju10m5 _1v0lh55r _wmyy17qg _748n17qg _1mfn17qg _1d7e17qg _p2vr17qg _19o610m5 _kxov17qg _1np517qg _m2f517qg _1b9tpnps _1tq6pnps _1rd2pnps _1pbkpnps _k3lipnps _13zt131l _2g12fb2s _k86b10m5 _b5iy131l _gti3131l _1f0gpnps _9d3e17qg _qdiapnps _72uvpnps",
|
|
18
|
+
showLineNumbers: "_17071olh _1i3h1txw _16noidpf _h4fuidpf _pp6yidpf _1g4tidpf _11wmidpf _1bx8idpf",
|
|
19
|
+
dontShowLineNumbers: "_1i3h1ule _16nou2gc _h4fuu2gc _pp6yu2gc _1g4tu2gc _11wmu2gc _1bx8u2gc",
|
|
20
20
|
shouldWrapLongLines: "_13dgkb7n",
|
|
21
21
|
dontWrapLongLines: "_13dgkb7n"
|
|
22
22
|
};
|
|
@@ -33,6 +33,7 @@ var getCodeBlockStyles = {
|
|
|
33
33
|
var CodeBlock = /*#__PURE__*/memo(function CodeBlock(_ref) {
|
|
34
34
|
var _ref$showLineNumbers = _ref.showLineNumbers,
|
|
35
35
|
showLineNumbers = _ref$showLineNumbers === void 0 ? true : _ref$showLineNumbers,
|
|
36
|
+
shouldShowLineNumbers = _ref.shouldShowLineNumbers,
|
|
36
37
|
_ref$firstLineNumber = _ref.firstLineNumber,
|
|
37
38
|
firstLineNumber = _ref$firstLineNumber === void 0 ? 1 : _ref$firstLineNumber,
|
|
38
39
|
_ref$language = _ref.language,
|
|
@@ -47,9 +48,11 @@ var CodeBlock = /*#__PURE__*/memo(function CodeBlock(_ref) {
|
|
|
47
48
|
text = _ref.text,
|
|
48
49
|
_ref$codeBidiWarnings = _ref.codeBidiWarnings,
|
|
49
50
|
codeBidiWarnings = _ref$codeBidiWarnings === void 0 ? true : _ref$codeBidiWarnings,
|
|
51
|
+
hasBidiWarnings = _ref.hasBidiWarnings,
|
|
50
52
|
codeBidiWarningLabel = _ref.codeBidiWarningLabel,
|
|
51
53
|
_ref$codeBidiWarningT = _ref.codeBidiWarningTooltipEnabled,
|
|
52
54
|
codeBidiWarningTooltipEnabled = _ref$codeBidiWarningT === void 0 ? true : _ref$codeBidiWarningT,
|
|
55
|
+
isBidiWarningTooltipEnabled = _ref.isBidiWarningTooltipEnabled,
|
|
53
56
|
_ref$shouldWrapLongLi = _ref.shouldWrapLongLines,
|
|
54
57
|
shouldWrapLongLines = _ref$shouldWrapLongLi === void 0 ? false : _ref$shouldWrapLongLi,
|
|
55
58
|
_ref$label = _ref.label,
|
|
@@ -59,9 +62,16 @@ var CodeBlock = /*#__PURE__*/memo(function CodeBlock(_ref) {
|
|
|
59
62
|
_useState2 = _slicedToArray(_useState, 2),
|
|
60
63
|
showContentFocus = _useState2[0],
|
|
61
64
|
setShowContentFocus = _useState2[1];
|
|
65
|
+
|
|
66
|
+
// Use children if provided, otherwise fall back to deprecated text prop
|
|
62
67
|
var numLines = (text || '').split('\n').length + (firstLineNumber > 0 ? firstLineNumber : 1) - 1;
|
|
63
68
|
var lineNumberWidth = numLines ? getLineNumWidth(numLines) : 0;
|
|
64
69
|
|
|
70
|
+
// Use new props if provided, otherwise fall back to deprecated props
|
|
71
|
+
var shouldShowLineNumbersValue = shouldShowLineNumbers !== undefined ? shouldShowLineNumbers : showLineNumbers;
|
|
72
|
+
var shouldShowBidiWarnings = hasBidiWarnings !== undefined ? hasBidiWarnings : codeBidiWarnings;
|
|
73
|
+
var shouldEnableTooltip = isBidiWarningTooltipEnabled !== undefined ? isBidiWarningTooltipEnabled : codeBidiWarningTooltipEnabled;
|
|
74
|
+
|
|
65
75
|
// Schedule a content focus on the target element
|
|
66
76
|
// WARNING: In theory, `target` may not be available when `rafSchedule` hits in concurrent rendering
|
|
67
77
|
useEffect(function () {
|
|
@@ -101,7 +111,7 @@ var CodeBlock = /*#__PURE__*/memo(function CodeBlock(_ref) {
|
|
|
101
111
|
'--ads-highlighted-start-text': highlightedStartText,
|
|
102
112
|
'--ads-highlighted-end-text': highlightedEndText
|
|
103
113
|
},
|
|
104
|
-
showLineNumbers:
|
|
114
|
+
showLineNumbers: shouldShowLineNumbersValue,
|
|
105
115
|
firstLineNumber: firstLineNumber,
|
|
106
116
|
lineProps: getLineProps
|
|
107
117
|
// shouldCreateParentElementForLines is needed to pass down props to each line.
|
|
@@ -110,15 +120,15 @@ var CodeBlock = /*#__PURE__*/memo(function CodeBlock(_ref) {
|
|
|
110
120
|
,
|
|
111
121
|
shouldCreateParentElementForLines: highlight.length > 0 || !!testId,
|
|
112
122
|
shouldWrapLongLines: shouldWrapLongLines,
|
|
113
|
-
codeBidiWarnings:
|
|
123
|
+
codeBidiWarnings: shouldShowBidiWarnings,
|
|
114
124
|
codeBidiWarningLabel: codeBidiWarningLabel,
|
|
115
|
-
codeBidiWarningTooltipEnabled:
|
|
125
|
+
codeBidiWarningTooltipEnabled: shouldEnableTooltip,
|
|
116
126
|
text: text,
|
|
117
127
|
tabIndex: showContentFocus ? '0' : undefined,
|
|
118
128
|
"aria-label": showContentFocus ? label : undefined,
|
|
119
129
|
role: showContentFocus ? 'region' : undefined,
|
|
120
130
|
scrollRef: scrollableRef,
|
|
121
|
-
className: ax([getCodeBlockStyles.root, shouldWrapLongLines ? getCodeBlockStyles.shouldWrapLongLines : getCodeBlockStyles.dontWrapLongLines,
|
|
131
|
+
className: ax([getCodeBlockStyles.root, shouldWrapLongLines ? getCodeBlockStyles.shouldWrapLongLines : getCodeBlockStyles.dontWrapLongLines, shouldShowLineNumbersValue ? getCodeBlockStyles.showLineNumbers : getCodeBlockStyles.dontShowLineNumbers])
|
|
122
132
|
});
|
|
123
133
|
});
|
|
124
134
|
export default CodeBlock;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
._11c81u0j{font:var(--ds-font-code,normal 400 .875em/1 ui-monospace,Menlo,"Segoe UI Mono","Ubuntu Mono",monospace)}
|
|
2
|
-
.
|
|
2
|
+
._2rkofajl{border-radius:var(--ds-radius-small,3px)}
|
|
3
3
|
._1dqoglyw{border-style:none}
|
|
4
4
|
._16d9qvcn{-webkit-box-decoration-break:clone;box-decoration-break:clone}
|
|
5
5
|
._18m91wug{overflow-y:auto}
|
package/dist/esm/code.js
CHANGED
|
@@ -2,14 +2,14 @@
|
|
|
2
2
|
import _extends from "@babel/runtime/helpers/extends";
|
|
3
3
|
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
|
|
4
4
|
var _excluded = ["testId"],
|
|
5
|
-
_excluded2 = ["children", "codeBidiWarnings", "codeBidiWarningLabel", "codeBidiWarningTooltipEnabled"];
|
|
5
|
+
_excluded2 = ["children", "codeBidiWarnings", "hasBidiWarnings", "codeBidiWarningLabel", "codeBidiWarningTooltipEnabled", "isBidiWarningTooltipEnabled"];
|
|
6
6
|
import "./code.compiled.css";
|
|
7
7
|
import { ax, ix } from "@compiled/react/runtime";
|
|
8
8
|
import React, { forwardRef, memo } from 'react';
|
|
9
9
|
import CodeBidiWarning from './bidi-warning';
|
|
10
10
|
import codeBidiWarningDecorator from './bidi-warning/bidi-warning-decorator';
|
|
11
11
|
var styles = {
|
|
12
|
-
base: "_ca0qyh40 _u5f3m5ip _n3tdyh40 _19bvm5ip
|
|
12
|
+
base: "_ca0qyh40 _u5f3m5ip _n3tdyh40 _19bvm5ip _2rkofajl _11c81u0j _1reo1wug _18m91wug _1dqoglyw _1e0c1nu9 _bfhktkvp _16d9qvcn _syaz1fxt _vwz41kw7 _1i4q1hna _o5721jtm"
|
|
13
13
|
};
|
|
14
14
|
|
|
15
15
|
/**
|
|
@@ -27,13 +27,19 @@ var Code = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function Code(_ref, ref) {
|
|
|
27
27
|
var children = props.children,
|
|
28
28
|
_props$codeBidiWarnin = props.codeBidiWarnings,
|
|
29
29
|
codeBidiWarnings = _props$codeBidiWarnin === void 0 ? true : _props$codeBidiWarnin,
|
|
30
|
+
hasBidiWarnings = props.hasBidiWarnings,
|
|
30
31
|
codeBidiWarningLabel = props.codeBidiWarningLabel,
|
|
31
32
|
_props$codeBidiWarnin2 = props.codeBidiWarningTooltipEnabled,
|
|
32
33
|
codeBidiWarningTooltipEnabled = _props$codeBidiWarnin2 === void 0 ? true : _props$codeBidiWarnin2,
|
|
34
|
+
isBidiWarningTooltipEnabled = props.isBidiWarningTooltipEnabled,
|
|
33
35
|
otherProps = _objectWithoutProperties(props, _excluded2);
|
|
34
|
-
|
|
36
|
+
|
|
37
|
+
// Use new props if provided, otherwise fall back to deprecated props
|
|
38
|
+
var shouldShowBidiWarnings = hasBidiWarnings !== undefined ? hasBidiWarnings : codeBidiWarnings;
|
|
39
|
+
var shouldEnableTooltip = isBidiWarningTooltipEnabled !== undefined ? isBidiWarningTooltipEnabled : codeBidiWarningTooltipEnabled;
|
|
40
|
+
var decoratedChildren = shouldShowBidiWarnings ? /*#__PURE__*/React.createElement(RenderCodeChildrenWithBidiWarnings, {
|
|
35
41
|
codeBidiWarningLabel: codeBidiWarningLabel,
|
|
36
|
-
codeBidiWarningTooltipEnabled:
|
|
42
|
+
codeBidiWarningTooltipEnabled: shouldEnableTooltip
|
|
37
43
|
}, children) : children;
|
|
38
44
|
return /*#__PURE__*/React.createElement("code", _extends({
|
|
39
45
|
ref: ref,
|
package/dist/esm/constants.js
CHANGED
|
@@ -321,6 +321,10 @@ export var SUPPORTED_LANGUAGES = [{
|
|
|
321
321
|
name: 'Protocol Buffers',
|
|
322
322
|
alias: ['protobuf', 'proto'],
|
|
323
323
|
value: 'protobuf'
|
|
324
|
+
}, {
|
|
325
|
+
name: 'TOML',
|
|
326
|
+
alias: ['toml'],
|
|
327
|
+
value: 'toml'
|
|
324
328
|
}, {
|
|
325
329
|
name: 'Handlebars',
|
|
326
330
|
alias: ['handlebars', 'mustache'],
|
|
@@ -7,16 +7,19 @@ export default function createLineElement(_ref) {
|
|
|
7
7
|
var children = _ref.children,
|
|
8
8
|
lineNumber = _ref.lineNumber,
|
|
9
9
|
showLineNumbers = _ref.showLineNumbers,
|
|
10
|
+
shouldShowLineNumbers = _ref.shouldShowLineNumbers,
|
|
10
11
|
_ref$lineProps = _ref.lineProps,
|
|
11
12
|
lineProps = _ref$lineProps === void 0 ? {} : _ref$lineProps,
|
|
12
13
|
_ref$className = _ref.className,
|
|
13
14
|
className = _ref$className === void 0 ? [] : _ref$className;
|
|
15
|
+
// Use new prop if provided, otherwise fall back to deprecated prop
|
|
16
|
+
var shouldShowLineNumbersValue = shouldShowLineNumbers !== undefined ? shouldShowLineNumbers : showLineNumbers;
|
|
14
17
|
var propsPassedInFromCodeBlock = typeof lineProps === 'function' ? lineProps(lineNumber) : lineProps;
|
|
15
18
|
var properties = _objectSpread(_objectSpread({}, propsPassedInFromCodeBlock), {}, {
|
|
16
19
|
className: className
|
|
17
20
|
});
|
|
18
21
|
var currentChildren = children;
|
|
19
|
-
if (lineNumber &&
|
|
22
|
+
if (lineNumber && shouldShowLineNumbersValue) {
|
|
20
23
|
// When syntax highlighting is NOT turned on, the entire LOC is just a single
|
|
21
24
|
// child. We can then happily create the line number and the LOC as siblings...
|
|
22
25
|
if (currentChildren.length === 1) {
|
|
@@ -29,7 +29,7 @@ export default function createElement(_ref) {
|
|
|
29
29
|
bidiCharacter: bidiCharacter,
|
|
30
30
|
key: index,
|
|
31
31
|
label: codeBidiWarningConfig.codeBidiWarningLabel,
|
|
32
|
-
|
|
32
|
+
isTooltipEnabled: codeBidiWarningConfig.codeBidiWarningTooltipEnabled
|
|
33
33
|
});
|
|
34
34
|
});
|
|
35
35
|
return decorated;
|
|
@@ -8,4 +8,4 @@ import { type CodeBidiWarningProps } from './types';
|
|
|
8
8
|
*
|
|
9
9
|
* See 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
|
|
10
10
|
*/
|
|
11
|
-
export default function BidiWarning({ testId, bidiCharacter, skipChildren, tooltipEnabled, label, }: CodeBidiWarningProps): React.JSX.Element;
|
|
11
|
+
export default function BidiWarning({ testId, bidiCharacter, skipChildren, shouldSkipChildren, tooltipEnabled, isTooltipEnabled, label, }: CodeBidiWarningProps): React.JSX.Element;
|
|
@@ -13,14 +13,29 @@ export type CodeBidiWarningProps = {
|
|
|
13
13
|
* Intended to be disabled when used in a mobile view, such as in the editor via mobile bridge,
|
|
14
14
|
* where the tooltip could end up being cut off or otherwise not work as expected.
|
|
15
15
|
* @default true
|
|
16
|
+
* @deprecated Use `isTooltipEnabled` instead
|
|
16
17
|
*/
|
|
17
18
|
tooltipEnabled?: boolean;
|
|
19
|
+
/**
|
|
20
|
+
* Sets whether to render tooltip with the warning or not.
|
|
21
|
+
* Intended to be disabled when used in a mobile view, such as in the editor via mobile bridge,
|
|
22
|
+
* where the tooltip could end up being cut off or otherwise not work as expected.
|
|
23
|
+
* @default true
|
|
24
|
+
*/
|
|
25
|
+
isTooltipEnabled?: boolean;
|
|
18
26
|
/**
|
|
19
27
|
* Sets whether bidi character should be wrapped in decorator.
|
|
20
28
|
* Useful when wrapping the bidi character with the decoration is not achievable.
|
|
21
29
|
* @default false
|
|
30
|
+
* @deprecated Use `shouldSkipChildren` instead
|
|
22
31
|
*/
|
|
23
32
|
skipChildren?: boolean;
|
|
33
|
+
/**
|
|
34
|
+
* Sets whether bidi character should be wrapped in decorator.
|
|
35
|
+
* Useful when wrapping the bidi character with the decoration is not achievable.
|
|
36
|
+
* @default false
|
|
37
|
+
*/
|
|
38
|
+
shouldSkipChildren?: boolean;
|
|
24
39
|
/**
|
|
25
40
|
* Label for the bidi warning tooltip.
|
|
26
41
|
* @default "Bidirectional characters change the order that text is rendered. This could be used to obscure malicious code."
|
|
@@ -318,6 +318,10 @@ export declare const SUPPORTED_LANGUAGES: readonly [{
|
|
|
318
318
|
readonly name: "Protocol Buffers";
|
|
319
319
|
readonly alias: readonly ["protobuf", "proto"];
|
|
320
320
|
readonly value: "protobuf";
|
|
321
|
+
}, {
|
|
322
|
+
readonly name: "TOML";
|
|
323
|
+
readonly alias: readonly ["toml"];
|
|
324
|
+
readonly value: "toml";
|
|
321
325
|
}, {
|
|
322
326
|
readonly name: "Handlebars";
|
|
323
327
|
readonly alias: readonly ["handlebars", "mustache"];
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { type HTMLProps } from 'react';
|
|
2
2
|
import type { CodeBlockProps } from '../types';
|
|
3
|
-
export declare const useHighlightLines: ({ highlight, testId, }: Pick<CodeBlockProps,
|
|
3
|
+
export declare const useHighlightLines: ({ highlight, testId, }: Pick<CodeBlockProps, "highlight" | "testId">) => {
|
|
4
4
|
getHighlightStyles: (lineNumber: number, highlightedLines: number[]) => HTMLProps<HTMLElement>;
|
|
5
5
|
highlightedLines: number[];
|
|
6
6
|
};
|
|
@@ -12,8 +12,14 @@ export interface CodeBlockProps {
|
|
|
12
12
|
/**
|
|
13
13
|
* Sets whether to display code line numbers or not.
|
|
14
14
|
* @default true
|
|
15
|
+
* @deprecated Use `shouldShowLineNumbers` instead
|
|
15
16
|
*/
|
|
16
17
|
showLineNumbers?: boolean;
|
|
18
|
+
/**
|
|
19
|
+
* Sets whether to display code line numbers or not.
|
|
20
|
+
* @default true
|
|
21
|
+
*/
|
|
22
|
+
shouldShowLineNumbers?: boolean;
|
|
17
23
|
/**
|
|
18
24
|
* Sets the number of the first line, if showLineNumbers is set to true.
|
|
19
25
|
* @default 1
|
|
@@ -50,8 +56,14 @@ export interface CodeBlockProps {
|
|
|
50
56
|
/**
|
|
51
57
|
* When set to `false`, disables code decorating with bidi warnings.
|
|
52
58
|
* @default true
|
|
59
|
+
* @deprecated Use `hasBidiWarnings` instead
|
|
53
60
|
*/
|
|
54
61
|
codeBidiWarnings?: boolean;
|
|
62
|
+
/**
|
|
63
|
+
* When set to `false`, disables code decorating with bidi warnings.
|
|
64
|
+
* @default true
|
|
65
|
+
*/
|
|
66
|
+
hasBidiWarnings?: boolean;
|
|
55
67
|
/**
|
|
56
68
|
* Label for the bidi warning tooltip.
|
|
57
69
|
* @default 'Bidirectional characters change the order that text is rendered. This could be used to obscure malicious code.'
|
|
@@ -62,8 +74,16 @@ export interface CodeBlockProps {
|
|
|
62
74
|
* Intended to be disabled when used in a mobile view, such as in the editor via mobile bridge,
|
|
63
75
|
* where the tooltip could end up being cut off or otherwise not work as expected.
|
|
64
76
|
* @default true
|
|
77
|
+
* @deprecated Use `isBidiWarningTooltipEnabled` instead
|
|
65
78
|
*/
|
|
66
79
|
codeBidiWarningTooltipEnabled?: boolean;
|
|
80
|
+
/**
|
|
81
|
+
* Sets whether to render tooltip with the warning or not.
|
|
82
|
+
* Intended to be disabled when used in a mobile view, such as in the editor via mobile bridge,
|
|
83
|
+
* where the tooltip could end up being cut off or otherwise not work as expected.
|
|
84
|
+
* @default true
|
|
85
|
+
*/
|
|
86
|
+
isBidiWarningTooltipEnabled?: boolean;
|
|
67
87
|
/**
|
|
68
88
|
* Sets whether long lines will create a horizontally scrolling container.
|
|
69
89
|
* When set to `true`, these lines will visually wrap instead.
|