@atlaskit/code 14.6.9 → 15.1.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 +12 -0
- package/dist/cjs/code-block.js +2 -4
- package/dist/cjs/code.js +1 -5
- package/dist/cjs/constants.js +18 -0
- package/dist/cjs/internal/theme/get-theme.js +53 -212
- package/dist/cjs/internal/theme/styles.js +22 -25
- package/dist/es2019/code-block.js +1 -3
- package/dist/es2019/code.js +2 -4
- package/dist/es2019/constants.js +18 -0
- package/dist/es2019/internal/theme/get-theme.js +54 -213
- package/dist/es2019/internal/theme/styles.js +6 -9
- package/dist/esm/code-block.js +2 -4
- package/dist/esm/code.js +2 -6
- package/dist/esm/constants.js +18 -0
- package/dist/esm/internal/theme/get-theme.js +53 -212
- package/dist/esm/internal/theme/styles.js +5 -8
- package/dist/types/constants.d.ts +16 -0
- package/dist/types/internal/theme/get-theme.d.ts +3 -4
- package/dist/types/internal/theme/styles.d.ts +3 -6
- package/dist/types-ts4.5/constants.d.ts +31 -0
- package/dist/types-ts4.5/internal/theme/get-theme.d.ts +3 -4
- package/dist/types-ts4.5/internal/theme/styles.d.ts +3 -6
- package/package.json +2 -2
- package/report.api.md +21 -8
- package/tmp/api-report-tmp.d.ts +17 -4
|
@@ -3,230 +3,71 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbol
|
|
|
3
3
|
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
4
4
|
import memoizeOne from 'memoize-one';
|
|
5
5
|
import * as colors from '@atlaskit/theme/colors';
|
|
6
|
-
import { themed } from '@atlaskit/theme/components';
|
|
7
6
|
import { codeFontFamily } from '@atlaskit/theme/constants';
|
|
8
7
|
// Hardcoded values have been used due to the current color palette not having any
|
|
9
8
|
// accessible color options for Teal and Yellow and +20A
|
|
10
9
|
var T800 = '#067384';
|
|
11
10
|
var Y1100 = '#7A5D1A';
|
|
12
|
-
var
|
|
13
|
-
export var getBaseTheme = function getBaseTheme(theme) {
|
|
11
|
+
export var getBaseTheme = function getBaseTheme() {
|
|
14
12
|
return {
|
|
15
13
|
fontFamily: codeFontFamily(),
|
|
16
14
|
fontFamilyItalic: "SFMono-MediumItalic, ".concat(codeFontFamily()),
|
|
17
|
-
backgroundColor:
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
theme: theme
|
|
22
|
-
}),
|
|
23
|
-
textColor: themed({
|
|
24
|
-
light: "var(--ds-text, ".concat(colors.N800, ")"),
|
|
25
|
-
dark: "var(--ds-text, ".concat(colors.DN800, ")")
|
|
26
|
-
})({
|
|
27
|
-
theme: theme
|
|
28
|
-
}),
|
|
29
|
-
lineNumberColor: themed({
|
|
30
|
-
light: "var(--ds-text-subtlest, ".concat(colors.N400, ")"),
|
|
31
|
-
dark: "var(--ds-text-subtlest, ".concat(colors.DN400, ")")
|
|
32
|
-
})({
|
|
33
|
-
theme: theme
|
|
34
|
-
}),
|
|
35
|
-
lineNumberBgColor: themed({
|
|
36
|
-
light: "var(--ds-background-neutral, ".concat(colors.N30, ")"),
|
|
37
|
-
dark: "var(--ds-background-neutral, ".concat(colors.DN20, ")")
|
|
38
|
-
})({
|
|
39
|
-
theme: theme
|
|
40
|
-
})
|
|
15
|
+
backgroundColor: "var(--ds-background-neutral, ".concat(colors.N20, ")"),
|
|
16
|
+
textColor: "var(--ds-text, ".concat(colors.N800, ")"),
|
|
17
|
+
lineNumberColor: "var(--ds-text-subtlest, ".concat(colors.N400, ")"),
|
|
18
|
+
lineNumberBgColor: "var(--ds-background-neutral, ".concat(colors.N30, ")")
|
|
41
19
|
};
|
|
42
20
|
};
|
|
43
|
-
export var defaultBaseTheme = getBaseTheme(
|
|
44
|
-
|
|
45
|
-
});
|
|
46
|
-
export var getColorPalette = memoizeOne(function (theme) {
|
|
47
|
-
var akTheme = {
|
|
48
|
-
theme: theme
|
|
49
|
-
};
|
|
21
|
+
export var defaultBaseTheme = getBaseTheme();
|
|
22
|
+
export var getColorPalette = memoizeOne(function () {
|
|
50
23
|
return {
|
|
51
|
-
highlightedLineBgColor:
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
codeColor: themed({
|
|
96
|
-
light: "var(--ds-text-accent-blue, ".concat(colors.B400, ")"),
|
|
97
|
-
dark: "var(--ds-text-accent-blue, ".concat(colors.B75, ")")
|
|
98
|
-
})(akTheme),
|
|
99
|
-
regexpColor: themed({
|
|
100
|
-
light: "var(--ds-text-accent-teal, ".concat(T800, ")"),
|
|
101
|
-
dark: "var(--ds-text-accent-teal, ".concat(colors.T200, ")")
|
|
102
|
-
})(akTheme),
|
|
103
|
-
symbolColor: themed({
|
|
104
|
-
light: "var(--ds-text-accent-teal, ".concat(T800, ")"),
|
|
105
|
-
dark: "var(--ds-text-accent-teal, ".concat(colors.T200, ")")
|
|
106
|
-
})(akTheme),
|
|
107
|
-
variableColor: themed({
|
|
108
|
-
light: "var(--ds-text-accent-teal, ".concat(T800, ")"),
|
|
109
|
-
dark: "var(--ds-text-accent-teal, ".concat(colors.T200, ")")
|
|
110
|
-
})(akTheme),
|
|
111
|
-
templateVariableColor: themed({
|
|
112
|
-
light: "var(--ds-text-accent-teal, ".concat(T800, ")"),
|
|
113
|
-
dark: "var(--ds-text-accent-teal, ".concat(colors.T200, ")")
|
|
114
|
-
})(akTheme),
|
|
115
|
-
linkColor: themed({
|
|
116
|
-
light: "var(--ds-text-accent-purple, ".concat(colors.P300, ")"),
|
|
117
|
-
dark: "var(--ds-text-accent-purple, ".concat(colors.P75, ")")
|
|
118
|
-
})(akTheme),
|
|
119
|
-
selectorAttributeColor: themed({
|
|
120
|
-
light: "var(--ds-text-accent-teal, ".concat(T800, ")"),
|
|
121
|
-
dark: "var(--ds-text-accent-teal, ".concat(colors.T200, ")")
|
|
122
|
-
})(akTheme),
|
|
123
|
-
selectorPseudoColor: themed({
|
|
124
|
-
light: "var(--ds-text-accent-teal, ".concat(T800, ")"),
|
|
125
|
-
dark: "var(--ds-text-accent-teal, ".concat(colors.T200, ")")
|
|
126
|
-
})(akTheme),
|
|
127
|
-
typeColor: themed({
|
|
128
|
-
light: "var(--ds-text-accent-teal, ".concat(T800, ")"),
|
|
129
|
-
dark: "var(--ds-text-accent-teal, ".concat(colors.T100, ")")
|
|
130
|
-
})(akTheme),
|
|
131
|
-
stringColor: themed({
|
|
132
|
-
light: "var(--ds-text-accent-green, ".concat(colors.G500, ")"),
|
|
133
|
-
dark: "var(--ds-text-accent-green, ".concat(colors.G200, ")")
|
|
134
|
-
})(akTheme),
|
|
135
|
-
selectorIdColor: themed({
|
|
136
|
-
light: "var(--ds-text-accent-teal, ".concat(T800, ")"),
|
|
137
|
-
dark: "var(--ds-text-accent-teal, ".concat(colors.T100, ")")
|
|
138
|
-
})(akTheme),
|
|
139
|
-
selectorClassColor: themed({
|
|
140
|
-
light: "var(--ds-text-accent-teal, ".concat(T800, ")"),
|
|
141
|
-
dark: "var(--ds-text-accent-teal, ".concat(colors.T100, ")")
|
|
142
|
-
})(akTheme),
|
|
143
|
-
quoteColor: themed({
|
|
144
|
-
light: "var(--ds-text-accent-teal, ".concat(T800, ")"),
|
|
145
|
-
dark: "var(--ds-text-accent-teal, ".concat(colors.T100, ")")
|
|
146
|
-
})(akTheme),
|
|
147
|
-
templateTagColor: themed({
|
|
148
|
-
light: "var(--ds-text-accent-teal, ".concat(T800, ")"),
|
|
149
|
-
dark: "var(--ds-text-accent-teal, ".concat(colors.T100, ")")
|
|
150
|
-
})(akTheme),
|
|
151
|
-
titleColor: themed({
|
|
152
|
-
light: "var(--ds-text-accent-purple, ".concat(colors.P300, ")"),
|
|
153
|
-
dark: "var(--ds-text-accent-purple, ".concat(colors.P75, ")")
|
|
154
|
-
})(akTheme),
|
|
155
|
-
sectionColor: themed({
|
|
156
|
-
light: "var(--ds-text-accent-purple, ".concat(colors.P300, ")"),
|
|
157
|
-
dark: "var(--ds-text-accent-purple, ".concat(colors.P75, ")")
|
|
158
|
-
})(akTheme),
|
|
159
|
-
commentColor: themed({
|
|
160
|
-
light: "var(--ds-text-subtlest, ".concat(colors.N400, ")"),
|
|
161
|
-
dark: "var(--ds-text-subtlest, ".concat(colors.DN400, ")")
|
|
162
|
-
})(akTheme),
|
|
163
|
-
metaKeywordColor: themed({
|
|
164
|
-
light: "var(--ds-text-accent-green, ".concat(colors.G500, ")"),
|
|
165
|
-
dark: "var(--ds-text-accent-green, ".concat(colors.G200, ")")
|
|
166
|
-
})(akTheme),
|
|
167
|
-
metaColor: themed({
|
|
168
|
-
light: "var(--ds-text-subtlest, ".concat(colors.N400, ")"),
|
|
169
|
-
dark: "var(--ds-text-subtlest, ".concat(colors.DN400, ")")
|
|
170
|
-
})(akTheme),
|
|
171
|
-
functionColor: themed({
|
|
172
|
-
light: "var(--ds-text, ".concat(colors.N800, ")"),
|
|
173
|
-
dark: "var(--ds-text, ".concat(colors.DN800, ")")
|
|
174
|
-
})(akTheme),
|
|
175
|
-
numberColor: themed({
|
|
176
|
-
light: "var(--ds-text-accent-blue, ".concat(colors.B400, ")"),
|
|
177
|
-
dark: "var(--ds-text-accent-blue, ".concat(colors.B75, ")")
|
|
178
|
-
})(akTheme),
|
|
179
|
-
prologColor: themed({
|
|
180
|
-
light: "var(--ds-text-accent-blue, ".concat(colors.B400, ")"),
|
|
181
|
-
dark: "var(--ds-text-accent-blue, ".concat(colors.B75, ")")
|
|
182
|
-
})(akTheme),
|
|
183
|
-
cdataColor: themed({
|
|
184
|
-
light: "var(--ds-text-subtlest, ".concat(colors.N400, ")"),
|
|
185
|
-
dark: "var(--ds-text-subtlest, ".concat(colors.B75, ")")
|
|
186
|
-
})(akTheme),
|
|
187
|
-
punctuationColor: themed({
|
|
188
|
-
light: "var(--ds-text, ".concat(colors.N800, ")"),
|
|
189
|
-
dark: "var(--ds-text, ".concat(colors.DN800, ")")
|
|
190
|
-
})(akTheme),
|
|
191
|
-
propertyColor: themed({
|
|
192
|
-
light: "var(--ds-text-accent-purple, ".concat(colors.P300, ")"),
|
|
193
|
-
dark: "var(--ds-text-accent-purple, ".concat(colors.P75, ")")
|
|
194
|
-
})(akTheme),
|
|
195
|
-
constantColor: themed({
|
|
196
|
-
light: "var(--ds-text-accent-teal, ".concat(T800, ")"),
|
|
197
|
-
dark: "var(--ds-text-accent-teal, ".concat(colors.T100, ")")
|
|
198
|
-
})(akTheme),
|
|
199
|
-
booleanColor: themed({
|
|
200
|
-
light: "var(--ds-text-accent-blue, ".concat(colors.B400, ")"),
|
|
201
|
-
dark: "var(--ds-text-accent-blue, ".concat(colors.B75, ")")
|
|
202
|
-
})(akTheme),
|
|
203
|
-
charColor: themed({
|
|
204
|
-
light: "var(--ds-text, ".concat(colors.N800, ")"),
|
|
205
|
-
dark: "var(--ds-text, ".concat(colors.DN800, ")")
|
|
206
|
-
})(akTheme),
|
|
207
|
-
insertedColor: themed({
|
|
208
|
-
light: "var(--ds-text-accent-green, ".concat(colors.G500, ")"),
|
|
209
|
-
dark: "var(--ds-text-accent-green, ".concat(colors.B75, ")")
|
|
210
|
-
})(akTheme),
|
|
211
|
-
deletedColor: themed({
|
|
212
|
-
light: "var(--ds-text-accent-red, ".concat(colors.R500, ")"),
|
|
213
|
-
dark: "var(--ds-text-accent-red, ".concat(colors.B75, ")")
|
|
214
|
-
})(akTheme),
|
|
215
|
-
operatorColor: themed({
|
|
216
|
-
light: "var(--ds-text, ".concat(colors.N800, ")"),
|
|
217
|
-
dark: "var(--ds-text, ".concat(colors.B75, ")")
|
|
218
|
-
})(akTheme),
|
|
219
|
-
atruleColor: themed({
|
|
220
|
-
light: "var(--ds-text-accent-green, ".concat(colors.G500, ")"),
|
|
221
|
-
dark: "var(--ds-text-accent-green, ".concat(colors.G200, ")")
|
|
222
|
-
})(akTheme),
|
|
223
|
-
importantColor: themed({
|
|
224
|
-
light: "var(--ds-text-accent-yellow, ".concat(Y1100, ")"),
|
|
225
|
-
dark: "var(--ds-text-accent-yellow, ".concat(colors.Y300, ")")
|
|
226
|
-
})(akTheme)
|
|
24
|
+
highlightedLineBgColor: "var(--ds-background-neutral, ".concat(colors.N30, ")"),
|
|
25
|
+
highlightedLineBorderColor: "var(--ds-border-focused, ".concat(colors.B200, ")"),
|
|
26
|
+
substringColor: "var(--ds-text-subtlest, ".concat(colors.N400, ")"),
|
|
27
|
+
keywordColor: "var(--ds-text-accent-blue, ".concat(colors.B400, ")"),
|
|
28
|
+
attributeColor: "var(--ds-text-accent-teal, ".concat(T800, ")"),
|
|
29
|
+
selectorTagColor: "var(--ds-text-accent-blue, ".concat(colors.B400, ")"),
|
|
30
|
+
docTagColor: "var(--ds-text-accent-yellow, ".concat(Y1100, ")"),
|
|
31
|
+
nameColor: "var(--ds-text-accent-blue, ".concat(colors.B400, ")"),
|
|
32
|
+
builtInColor: "var(--ds-text-accent-blue, ".concat(colors.B400, ")"),
|
|
33
|
+
literalColor: "var(--ds-text-accent-blue, ".concat(colors.B400, ")"),
|
|
34
|
+
bulletColor: "var(--ds-text-accent-blue, ".concat(colors.B400, ")"),
|
|
35
|
+
codeColor: "var(--ds-text-accent-blue, ".concat(colors.B400, ")"),
|
|
36
|
+
regexpColor: "var(--ds-text-accent-teal, ".concat(T800, ")"),
|
|
37
|
+
symbolColor: "var(--ds-text-accent-teal, ".concat(T800, ")"),
|
|
38
|
+
variableColor: "var(--ds-text-accent-teal, ".concat(T800, ")"),
|
|
39
|
+
templateVariableColor: "var(--ds-text-accent-teal, ".concat(T800, ")"),
|
|
40
|
+
linkColor: "var(--ds-text-accent-purple, ".concat(colors.P300, ")"),
|
|
41
|
+
selectorAttributeColor: "var(--ds-text-accent-teal, ".concat(T800, ")"),
|
|
42
|
+
selectorPseudoColor: "var(--ds-text-accent-teal, ".concat(T800, ")"),
|
|
43
|
+
typeColor: "var(--ds-text-accent-teal, ".concat(T800, ")"),
|
|
44
|
+
stringColor: "var(--ds-text-accent-green, ".concat(colors.G500, ")"),
|
|
45
|
+
selectorIdColor: "var(--ds-text-accent-teal, ".concat(T800, ")"),
|
|
46
|
+
selectorClassColor: "var(--ds-text-accent-teal, ".concat(T800, ")"),
|
|
47
|
+
quoteColor: "var(--ds-text-accent-teal, ".concat(T800, ")"),
|
|
48
|
+
templateTagColor: "var(--ds-text-accent-teal, ".concat(T800, ")"),
|
|
49
|
+
titleColor: "var(--ds-text-accent-purple, ".concat(colors.P300, ")"),
|
|
50
|
+
sectionColor: "var(--ds-text-accent-purple, ".concat(colors.P300, ")"),
|
|
51
|
+
commentColor: "var(--ds-text-subtlest, ".concat(colors.N400, ")"),
|
|
52
|
+
metaKeywordColor: "var(--ds-text-accent-green, ".concat(colors.G500, ")"),
|
|
53
|
+
metaColor: "var(--ds-text-subtlest, ".concat(colors.N400, ")"),
|
|
54
|
+
functionColor: "var(--ds-text, ".concat(colors.N800, ")"),
|
|
55
|
+
numberColor: "var(--ds-text-accent-blue, ".concat(colors.B400, ")"),
|
|
56
|
+
prologColor: "var(--ds-text-accent-blue, ".concat(colors.B400, ")"),
|
|
57
|
+
cdataColor: "var(--ds-text-subtlest, ".concat(colors.N400, ")"),
|
|
58
|
+
punctuationColor: "var(--ds-text, ".concat(colors.N800, ")"),
|
|
59
|
+
propertyColor: "var(--ds-text-accent-purple, ".concat(colors.P300, ")"),
|
|
60
|
+
constantColor: "var(--ds-text-accent-teal, ".concat(T800, ")"),
|
|
61
|
+
booleanColor: "var(--ds-text-accent-blue, ".concat(colors.B400, ")"),
|
|
62
|
+
charColor: "var(--ds-text, ".concat(colors.N800, ")"),
|
|
63
|
+
insertedColor: "var(--ds-text-accent-green, ".concat(colors.G500, ")"),
|
|
64
|
+
deletedColor: "var(--ds-text-accent-red, ".concat(colors.R500, ")"),
|
|
65
|
+
operatorColor: "var(--ds-text, ".concat(colors.N800, ")"),
|
|
66
|
+
atruleColor: "var(--ds-text-accent-green, ".concat(colors.G500, ")"),
|
|
67
|
+
importantColor: "var(--ds-text-accent-yellow, ".concat(Y1100, ")")
|
|
227
68
|
};
|
|
228
69
|
});
|
|
229
|
-
var getTheme = function getTheme(
|
|
230
|
-
return _objectSpread(_objectSpread({}, getBaseTheme(
|
|
70
|
+
var getTheme = function getTheme() {
|
|
71
|
+
return _objectSpread(_objectSpread({}, getBaseTheme()), getColorPalette());
|
|
231
72
|
};
|
|
232
73
|
export default getTheme;
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
2
2
|
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
3
3
|
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
4
|
-
import { borderRadius } from '@atlaskit/theme/constants';
|
|
5
4
|
import { CODE_FONT_SIZE, CODE_LINE_HEIGHT, HIGHLIGHT_BORDER_WIDTH, LINE_NUMBER_GUTTER, SPACING, VAR_CODE_BG_COLOR, VAR_CODE_LINE_NUMBER_BG_COLOR } from './constants';
|
|
6
5
|
import { getBaseTheme, getColorPalette } from './get-theme';
|
|
7
6
|
export var getLineNumWidth = function getLineNumWidth(numLines) {
|
|
@@ -197,7 +196,7 @@ export var getBaseCodeStyles = function getBaseCodeStyles(theme) {
|
|
|
197
196
|
backgroundColor: "var(".concat(VAR_CODE_BG_COLOR, ",").concat(theme.backgroundColor, ")"),
|
|
198
197
|
color: theme.textColor,
|
|
199
198
|
borderStyle: 'none',
|
|
200
|
-
borderRadius: "
|
|
199
|
+
borderRadius: "var(--ds-border-radius, 3px)"
|
|
201
200
|
};
|
|
202
201
|
};
|
|
203
202
|
|
|
@@ -295,10 +294,8 @@ export var getCodeBlockStyles = function getCodeBlockStyles(theme) {
|
|
|
295
294
|
});
|
|
296
295
|
};
|
|
297
296
|
};
|
|
298
|
-
export var getCodeStyles = function getCodeStyles(
|
|
299
|
-
|
|
300
|
-
var akTheme = 'theme' in globalTheme ? globalTheme.theme : globalTheme;
|
|
301
|
-
var theme = getBaseTheme(akTheme);
|
|
297
|
+
export var getCodeStyles = function getCodeStyles() {
|
|
298
|
+
var theme = getBaseTheme();
|
|
302
299
|
var baseStyles = getBaseCodeStyles(theme);
|
|
303
300
|
return _objectSpread(_objectSpread({}, baseStyles), {}, {
|
|
304
301
|
display: 'inline',
|
|
@@ -310,8 +307,8 @@ export var getCodeStyles = function getCodeStyles(globalTheme) {
|
|
|
310
307
|
whiteSpace: 'pre-wrap'
|
|
311
308
|
});
|
|
312
309
|
};
|
|
313
|
-
export var getCodeBlockTheme = function getCodeBlockTheme(
|
|
314
|
-
return _objectSpread(_objectSpread(_objectSpread({}, getBaseTheme(
|
|
310
|
+
export var getCodeBlockTheme = function getCodeBlockTheme(maxLines) {
|
|
311
|
+
return _objectSpread(_objectSpread(_objectSpread({}, getBaseTheme()), getColorPalette()), {}, {
|
|
315
312
|
lineNumberWidth: maxLines ? getLineNumWidth(maxLines) : undefined
|
|
316
313
|
});
|
|
317
314
|
};
|
|
@@ -306,6 +306,22 @@ export declare const SUPPORTED_LANGUAGES: readonly [{
|
|
|
306
306
|
readonly name: "SplunkSPL";
|
|
307
307
|
readonly alias: readonly ["splunk-spl"];
|
|
308
308
|
readonly value: "splunk-spl";
|
|
309
|
+
}, {
|
|
310
|
+
readonly name: "Dockerfile";
|
|
311
|
+
readonly alias: readonly ["docker", "dockerfile"];
|
|
312
|
+
readonly value: "dockerfile";
|
|
313
|
+
}, {
|
|
314
|
+
readonly name: "HCL";
|
|
315
|
+
readonly alias: readonly ["hcl", "terraform"];
|
|
316
|
+
readonly value: "hcl";
|
|
317
|
+
}, {
|
|
318
|
+
readonly name: "NGINX";
|
|
319
|
+
readonly alias: readonly ["nginx"];
|
|
320
|
+
readonly value: "nginx";
|
|
321
|
+
}, {
|
|
322
|
+
readonly name: "Protocol Buffers";
|
|
323
|
+
readonly alias: readonly ["protobuf", "proto"];
|
|
324
|
+
readonly value: "protobuf";
|
|
309
325
|
}];
|
|
310
326
|
export { CODE_BLOCK_SELECTOR } from './internal/theme/constants';
|
|
311
327
|
export type Language = (typeof SUPPORTED_LANGUAGES)[number];
|
|
@@ -1,7 +1,6 @@
|
|
|
1
|
-
import type { Theme } from '@atlaskit/theme/types';
|
|
2
1
|
import type { CodeBlockTheme, CodeTheme } from './types';
|
|
3
|
-
export declare const getBaseTheme: (
|
|
2
|
+
export declare const getBaseTheme: () => CodeTheme;
|
|
4
3
|
export declare const defaultBaseTheme: CodeTheme;
|
|
5
|
-
export declare const getColorPalette: import("memoize-one").MemoizedFn<(
|
|
6
|
-
declare const getTheme: (
|
|
4
|
+
export declare const getColorPalette: import("memoize-one").MemoizedFn<() => CodeBlockTheme>;
|
|
5
|
+
declare const getTheme: () => CodeBlockTheme;
|
|
7
6
|
export default getTheme;
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import type { CSSObject } from '@emotion/react';
|
|
2
|
-
import type { Theme } from '@atlaskit/theme/types';
|
|
3
2
|
import type { CodeBlockTheme, CodeTheme } from './types';
|
|
4
3
|
export declare const getLineNumWidth: (numLines: number) => string;
|
|
5
4
|
/**
|
|
@@ -12,7 +11,7 @@ export declare const getBaseCodeStyles: (theme: CodeTheme) => {
|
|
|
12
11
|
backgroundColor: string;
|
|
13
12
|
color: string | undefined;
|
|
14
13
|
borderStyle: string;
|
|
15
|
-
borderRadius:
|
|
14
|
+
borderRadius: "var(--ds-border-radius)";
|
|
16
15
|
};
|
|
17
16
|
/**
|
|
18
17
|
* Takes an implemented CodeBlock theme, and returns styles required for
|
|
@@ -21,7 +20,5 @@ export declare const getBaseCodeStyles: (theme: CodeTheme) => {
|
|
|
21
20
|
* @param theme
|
|
22
21
|
*/
|
|
23
22
|
export declare const getCodeBlockStyles: (theme: CodeBlockTheme) => (highlightedStartText: string, highlightedEndText: string, showLineNumbers: boolean, shouldWrapLongLines: boolean) => CSSObject;
|
|
24
|
-
export declare const getCodeStyles: (
|
|
25
|
-
|
|
26
|
-
}) => CSSObject;
|
|
27
|
-
export declare const getCodeBlockTheme: (globalTheme: Theme, maxLines?: number) => CodeBlockTheme;
|
|
23
|
+
export declare const getCodeStyles: () => CSSObject;
|
|
24
|
+
export declare const getCodeBlockTheme: (maxLines?: number) => CodeBlockTheme;
|
|
@@ -616,6 +616,37 @@ export declare const SUPPORTED_LANGUAGES: readonly [
|
|
|
616
616
|
"splunk-spl"
|
|
617
617
|
];
|
|
618
618
|
readonly value: "splunk-spl";
|
|
619
|
+
},
|
|
620
|
+
{
|
|
621
|
+
readonly name: "Dockerfile";
|
|
622
|
+
readonly alias: readonly [
|
|
623
|
+
"docker",
|
|
624
|
+
"dockerfile"
|
|
625
|
+
];
|
|
626
|
+
readonly value: "dockerfile";
|
|
627
|
+
},
|
|
628
|
+
{
|
|
629
|
+
readonly name: "HCL";
|
|
630
|
+
readonly alias: readonly [
|
|
631
|
+
"hcl",
|
|
632
|
+
"terraform"
|
|
633
|
+
];
|
|
634
|
+
readonly value: "hcl";
|
|
635
|
+
},
|
|
636
|
+
{
|
|
637
|
+
readonly name: "NGINX";
|
|
638
|
+
readonly alias: readonly [
|
|
639
|
+
"nginx"
|
|
640
|
+
];
|
|
641
|
+
readonly value: "nginx";
|
|
642
|
+
},
|
|
643
|
+
{
|
|
644
|
+
readonly name: "Protocol Buffers";
|
|
645
|
+
readonly alias: readonly [
|
|
646
|
+
"protobuf",
|
|
647
|
+
"proto"
|
|
648
|
+
];
|
|
649
|
+
readonly value: "protobuf";
|
|
619
650
|
}
|
|
620
651
|
];
|
|
621
652
|
export { CODE_BLOCK_SELECTOR } from './internal/theme/constants';
|
|
@@ -1,7 +1,6 @@
|
|
|
1
|
-
import type { Theme } from '@atlaskit/theme/types';
|
|
2
1
|
import type { CodeBlockTheme, CodeTheme } from './types';
|
|
3
|
-
export declare const getBaseTheme: (
|
|
2
|
+
export declare const getBaseTheme: () => CodeTheme;
|
|
4
3
|
export declare const defaultBaseTheme: CodeTheme;
|
|
5
|
-
export declare const getColorPalette: import("memoize-one").MemoizedFn<(
|
|
6
|
-
declare const getTheme: (
|
|
4
|
+
export declare const getColorPalette: import("memoize-one").MemoizedFn<() => CodeBlockTheme>;
|
|
5
|
+
declare const getTheme: () => CodeBlockTheme;
|
|
7
6
|
export default getTheme;
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import type { CSSObject } from '@emotion/react';
|
|
2
|
-
import type { Theme } from '@atlaskit/theme/types';
|
|
3
2
|
import type { CodeBlockTheme, CodeTheme } from './types';
|
|
4
3
|
export declare const getLineNumWidth: (numLines: number) => string;
|
|
5
4
|
/**
|
|
@@ -12,7 +11,7 @@ export declare const getBaseCodeStyles: (theme: CodeTheme) => {
|
|
|
12
11
|
backgroundColor: string;
|
|
13
12
|
color: string | undefined;
|
|
14
13
|
borderStyle: string;
|
|
15
|
-
borderRadius:
|
|
14
|
+
borderRadius: "var(--ds-border-radius)";
|
|
16
15
|
};
|
|
17
16
|
/**
|
|
18
17
|
* Takes an implemented CodeBlock theme, and returns styles required for
|
|
@@ -21,7 +20,5 @@ export declare const getBaseCodeStyles: (theme: CodeTheme) => {
|
|
|
21
20
|
* @param theme
|
|
22
21
|
*/
|
|
23
22
|
export declare const getCodeBlockStyles: (theme: CodeBlockTheme) => (highlightedStartText: string, highlightedEndText: string, showLineNumbers: boolean, shouldWrapLongLines: boolean) => CSSObject;
|
|
24
|
-
export declare const getCodeStyles: (
|
|
25
|
-
|
|
26
|
-
}) => CSSObject;
|
|
27
|
-
export declare const getCodeBlockTheme: (globalTheme: Theme, maxLines?: number) => CodeBlockTheme;
|
|
23
|
+
export declare const getCodeStyles: () => CSSObject;
|
|
24
|
+
export declare const getCodeBlockTheme: (maxLines?: number) => CodeBlockTheme;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/code",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "15.1.0",
|
|
4
4
|
"description": "Code highlights short strings of code snippets inline with body text.",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -28,7 +28,7 @@
|
|
|
28
28
|
"dependencies": {
|
|
29
29
|
"@atlaskit/codemod-utils": "^4.2.0",
|
|
30
30
|
"@atlaskit/theme": "^12.6.0",
|
|
31
|
-
"@atlaskit/tokens": "^1.
|
|
31
|
+
"@atlaskit/tokens": "^1.29.0",
|
|
32
32
|
"@atlaskit/tooltip": "^18.0.0",
|
|
33
33
|
"@atlaskit/visually-hidden": "^1.2.0",
|
|
34
34
|
"@babel/runtime": "^7.0.0",
|
package/report.api.md
CHANGED
|
@@ -22,7 +22,6 @@ import type { HTMLProps } from 'react';
|
|
|
22
22
|
import { NamedExoticComponent } from 'react';
|
|
23
23
|
import { default as React_2 } from 'react';
|
|
24
24
|
import type { ReactNode } from 'react';
|
|
25
|
-
import type { Theme } from '@atlaskit/theme/types';
|
|
26
25
|
|
|
27
26
|
// @public
|
|
28
27
|
export const Code: React_2.MemoExoticComponent<
|
|
@@ -426,13 +425,7 @@ export interface CodeProps extends HTMLProps<HTMLElement> {
|
|
|
426
425
|
}
|
|
427
426
|
|
|
428
427
|
// @public (undocumented)
|
|
429
|
-
export const getCodeStyles: (
|
|
430
|
-
globalTheme:
|
|
431
|
-
| Theme
|
|
432
|
-
| {
|
|
433
|
-
theme: Theme;
|
|
434
|
-
},
|
|
435
|
-
) => CSSObject;
|
|
428
|
+
export const getCodeStyles: () => CSSObject;
|
|
436
429
|
|
|
437
430
|
// @public (undocumented)
|
|
438
431
|
export type Language = (typeof SUPPORTED_LANGUAGES)[number];
|
|
@@ -843,6 +836,26 @@ export const SUPPORTED_LANGUAGES: readonly [
|
|
|
843
836
|
readonly alias: readonly ['splunk-spl'];
|
|
844
837
|
readonly value: 'splunk-spl';
|
|
845
838
|
},
|
|
839
|
+
{
|
|
840
|
+
readonly name: 'Dockerfile';
|
|
841
|
+
readonly alias: readonly ['docker', 'dockerfile'];
|
|
842
|
+
readonly value: 'dockerfile';
|
|
843
|
+
},
|
|
844
|
+
{
|
|
845
|
+
readonly name: 'HCL';
|
|
846
|
+
readonly alias: readonly ['hcl', 'terraform'];
|
|
847
|
+
readonly value: 'hcl';
|
|
848
|
+
},
|
|
849
|
+
{
|
|
850
|
+
readonly name: 'NGINX';
|
|
851
|
+
readonly alias: readonly ['nginx'];
|
|
852
|
+
readonly value: 'nginx';
|
|
853
|
+
},
|
|
854
|
+
{
|
|
855
|
+
readonly name: 'Protocol Buffers';
|
|
856
|
+
readonly alias: readonly ['protobuf', 'proto'];
|
|
857
|
+
readonly value: 'protobuf';
|
|
858
|
+
},
|
|
846
859
|
];
|
|
847
860
|
|
|
848
861
|
// @public (undocumented)
|
package/tmp/api-report-tmp.d.ts
CHANGED
|
@@ -11,7 +11,6 @@ import type { HTMLProps } from 'react';
|
|
|
11
11
|
import { NamedExoticComponent } from 'react';
|
|
12
12
|
import { default as React_2 } from 'react';
|
|
13
13
|
import type { ReactNode } from 'react';
|
|
14
|
-
import type { Theme } from '@atlaskit/theme/types';
|
|
15
14
|
|
|
16
15
|
// @public
|
|
17
16
|
export const Code: React_2.MemoExoticComponent<React_2.ForwardRefExoticComponent<Pick<CodeProps, "about" | "accept" | "acceptCharset" | "accessKey" | "action" | "allowFullScreen" | "allowTransparency" | "alt" | "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" | "as" | "async" | "autoCapitalize" | "autoComplete" | "autoCorrect" | "autoFocus" | "autoPlay" | "autoSave" | "capture" | "cellPadding" | "cellSpacing" | "challenge" | "charSet" | "checked" | "children" | "cite" | "classID" | "className" | "codeBidiWarningLabel" | "codeBidiWarningTooltipEnabled" | "codeBidiWarnings" | "colSpan" | "color" | "cols" | "content" | "contentEditable" | "contextMenu" | "controls" | "coords" | "crossOrigin" | "dangerouslySetInnerHTML" | "data" | "datatype" | "dateTime" | "default" | "defaultChecked" | "defaultValue" | "defer" | "dir" | "disabled" | "download" | "draggable" | "encType" | "form" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "frameBorder" | "headers" | "height" | "hidden" | "high" | "href" | "hrefLang" | "htmlFor" | "httpEquiv" | "id" | "inlist" | "inputMode" | "integrity" | "is" | "itemID" | "itemProp" | "itemRef" | "itemScope" | "itemType" | "key" | "keyParams" | "keyType" | "kind" | "label" | "lang" | "list" | "loop" | "low" | "manifest" | "marginHeight" | "marginWidth" | "max" | "maxLength" | "media" | "mediaGroup" | "method" | "min" | "minLength" | "multiple" | "muted" | "name" | "noValidate" | "nonce" | "onAbort" | "onAbortCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAuxClick" | "onAuxClickCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onBlur" | "onBlurCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onChange" | "onChangeCapture" | "onClick" | "onClickCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onContextMenu" | "onContextMenuCapture" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onError" | "onErrorCapture" | "onFocus" | "onFocusCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onInput" | "onInputCapture" | "onInvalid" | "onInvalidCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onLoad" | "onLoadCapture" | "onLoadStart" | "onLoadStartCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onPaste" | "onPasteCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerOut" | "onPointerOutCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerUp" | "onPointerUpCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onReset" | "onResetCapture" | "onScroll" | "onScrollCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onSelect" | "onSelectCapture" | "onStalled" | "onStalledCapture" | "onSubmit" | "onSubmitCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onWheel" | "onWheelCapture" | "open" | "optimum" | "pattern" | "placeholder" | "playsInline" | "poster" | "prefix" | "preload" | "property" | "radioGroup" | "readOnly" | "rel" | "required" | "resource" | "results" | "reversed" | "role" | "rowSpan" | "rows" | "sandbox" | "scope" | "scoped" | "scrolling" | "seamless" | "security" | "selected" | "shape" | "size" | "sizes" | "slot" | "span" | "spellCheck" | "src" | "srcDoc" | "srcLang" | "srcSet" | "start" | "step" | "style" | "summary" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "tabIndex" | "target" | "testId" | "title" | "translate" | "type" | "typeof" | "unselectable" | "useMap" | "value" | "vocab" | "width" | "wmode" | "wrap"> & React_2.RefAttributes<HTMLElement>>>;
|
|
@@ -44,9 +43,7 @@ export interface CodeProps extends HTMLProps<HTMLElement> {
|
|
|
44
43
|
}
|
|
45
44
|
|
|
46
45
|
// @public (undocumented)
|
|
47
|
-
export const getCodeStyles: (
|
|
48
|
-
theme: Theme;
|
|
49
|
-
}) => CSSObject;
|
|
46
|
+
export const getCodeStyles: () => CSSObject;
|
|
50
47
|
|
|
51
48
|
// @public (undocumented)
|
|
52
49
|
export type Language = (typeof SUPPORTED_LANGUAGES)[number];
|
|
@@ -366,6 +363,22 @@ export const SUPPORTED_LANGUAGES: readonly [{
|
|
|
366
363
|
readonly name: "SplunkSPL";
|
|
367
364
|
readonly alias: readonly ["splunk-spl"];
|
|
368
365
|
readonly value: "splunk-spl";
|
|
366
|
+
}, {
|
|
367
|
+
readonly name: "Dockerfile";
|
|
368
|
+
readonly alias: readonly ["docker", "dockerfile"];
|
|
369
|
+
readonly value: "dockerfile";
|
|
370
|
+
}, {
|
|
371
|
+
readonly name: "HCL";
|
|
372
|
+
readonly alias: readonly ["hcl", "terraform"];
|
|
373
|
+
readonly value: "hcl";
|
|
374
|
+
}, {
|
|
375
|
+
readonly name: "NGINX";
|
|
376
|
+
readonly alias: readonly ["nginx"];
|
|
377
|
+
readonly value: "nginx";
|
|
378
|
+
}, {
|
|
379
|
+
readonly name: "Protocol Buffers";
|
|
380
|
+
readonly alias: readonly ["protobuf", "proto"];
|
|
381
|
+
readonly value: "protobuf";
|
|
369
382
|
}];
|
|
370
383
|
|
|
371
384
|
// @public (undocumented)
|