@atlaskit/editor-shared-styles 3.8.1 → 3.9.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.
Files changed (19) hide show
  1. package/CHANGELOG.md +11 -0
  2. package/dist/cjs/consts/consts.js +40 -36
  3. package/dist/cjs/overflow-shadow/overflow-shadow.js +1 -1
  4. package/dist/cjs/scrollbar-styles.js +1 -1
  5. package/dist/cjs/selection/utils.js +1 -1
  6. package/dist/cjs/shortcut/shortcut.js +1 -1
  7. package/dist/es2019/consts/consts.js +40 -36
  8. package/dist/es2019/overflow-shadow/overflow-shadow.js +6 -6
  9. package/dist/es2019/scrollbar-styles.js +2 -2
  10. package/dist/es2019/selection/utils.js +1 -1
  11. package/dist/es2019/shortcut/shortcut.js +2 -2
  12. package/dist/esm/consts/consts.js +40 -36
  13. package/dist/esm/overflow-shadow/overflow-shadow.js +1 -1
  14. package/dist/esm/scrollbar-styles.js +1 -1
  15. package/dist/esm/selection/utils.js +1 -1
  16. package/dist/esm/shortcut/shortcut.js +1 -1
  17. package/dist/types/consts/consts.d.ts +4 -0
  18. package/dist/types-ts4.5/consts/consts.d.ts +4 -0
  19. package/package.json +2 -2
package/CHANGELOG.md CHANGED
@@ -1,5 +1,16 @@
1
1
  # @atlaskit/editor-shared-styles
2
2
 
3
+ ## 3.9.0
4
+
5
+ ### Minor Changes
6
+
7
+ - [`f79abec64be13`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/f79abec64be13) -
8
+ [EDITOR-2624] Add max width mode for ultra wide monitors to the Editor and Renderer
9
+
10
+ ### Patch Changes
11
+
12
+ - Updated dependencies
13
+
3
14
  ## 3.8.1
4
15
 
5
16
  ### Patch Changes
package/dist/cjs/consts/consts.js CHANGED
@@ -16,9 +16,9 @@ var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
16
16
  var akEditorFullPageDefaultFontSize = exports.akEditorFullPageDefaultFontSize = 16;
17
17
  var akEditorFullPageDenseFontSize = exports.akEditorFullPageDenseFontSize = 13;
18
18
  var akEditorCodeFontFamily = exports.akEditorCodeFontFamily = "var(--ds-font-family-code, ui-monospace, Menlo, \"Segoe UI Mono\", \"Ubuntu Mono\", monospace)";
19
- var akEditorSubtleAccent = exports.akEditorSubtleAccent = "var(--ds-background-accent-gray-subtler, #DCDFE4)";
20
- var akEditorBlockquoteBorderColor = exports.akEditorBlockquoteBorderColor = "var(--ds-border, #091E4224)";
21
- var akEditorCodeBackground = exports.akEditorCodeBackground = "var(--ds-background-accent-gray-subtlest, #F1F2F4)";
19
+ var akEditorSubtleAccent = exports.akEditorSubtleAccent = "var(--ds-background-accent-gray-subtler, #DDDEE1)";
20
+ var akEditorBlockquoteBorderColor = exports.akEditorBlockquoteBorderColor = "var(--ds-border, #0B120E24)";
21
+ var akEditorCodeBackground = exports.akEditorCodeBackground = "var(--ds-background-accent-gray-subtlest, #F0F1F2)";
22
22
  var akEditorCodeBlockPadding = exports.akEditorCodeBlockPadding = '12px';
23
23
  var akEditorCodeInlinePadding = exports.akEditorCodeInlinePadding = '2px 4px';
24
24
  var akEditorDeleteBackground = exports.akEditorDeleteBackground = "var(--ds-background-danger, #FFECEB)";
@@ -26,12 +26,12 @@ var akEditorDeleteBackgroundWithOpacity = exports.akEditorDeleteBackgroundWithOp
26
26
  var akEditorDeleteBorder = exports.akEditorDeleteBorder = "var(--ds-border-danger, #E2483D)";
27
27
  var akEditorDeleteIconColor = exports.akEditorDeleteIconColor = "var(--ds-icon-danger, #C9372C)";
28
28
  var akEditorCustomIconSize = exports.akEditorCustomIconSize = 20;
29
- var akEditorSelectedBorderColor = exports.akEditorSelectedBorderColor = "var(--ds-border-selected, #0C66E4)";
29
+ var akEditorSelectedBorderColor = exports.akEditorSelectedBorderColor = "var(--ds-border-selected, #1868DB)";
30
30
  var akEditorSelectedBorderSize = exports.akEditorSelectedBorderSize = 1;
31
31
  var akEditorSelectedBorderBoldSize = exports.akEditorSelectedBorderBoldSize = 2;
32
- var akEditorSelectedBorder = exports.akEditorSelectedBorder = "".concat(akEditorSelectedBorderSize, "px solid ", "var(--ds-border-selected, #0C66E4)");
33
- var akEditorSelectedBoxShadow = exports.akEditorSelectedBoxShadow = "0 0 0 ".concat(akEditorSelectedBorderSize, "px ", "var(--ds-border-selected, #0C66E4)");
34
- var akEditorSelectedBoldBoxShadow = exports.akEditorSelectedBoldBoxShadow = "0 0 0 ".concat(akEditorSelectedBorderBoldSize, "px ", "var(--ds-border-selected, #0C66E4)");
32
+ var akEditorSelectedBorder = exports.akEditorSelectedBorder = "".concat(akEditorSelectedBorderSize, "px solid ", "var(--ds-border-selected, #1868DB)");
33
+ var akEditorSelectedBoxShadow = exports.akEditorSelectedBoxShadow = "0 0 0 ".concat(akEditorSelectedBorderSize, "px ", "var(--ds-border-selected, #1868DB)");
34
+ var akEditorSelectedBoldBoxShadow = exports.akEditorSelectedBoldBoxShadow = "0 0 0 ".concat(akEditorSelectedBorderBoldSize, "px ", "var(--ds-border-selected, #1868DB)");
35
35
  var akEditorSelectedBlanketOpacity = exports.akEditorSelectedBlanketOpacity = 0.3;
36
36
  var akEditorUnitZIndex = exports.akEditorUnitZIndex = 1;
37
37
  var akEditorShadowZIndex = exports.akEditorShadowZIndex = 2;
@@ -51,11 +51,11 @@ var akEditorTableCellOnStickyHeaderZIndex = exports.akEditorTableCellOnStickyHea
51
51
  // z-index used for floating toolbars table cell menu which are above block toolbars
52
52
  var akEditorFloatingOverlapPanelZIndex = exports.akEditorFloatingOverlapPanelZIndex = akEditorFloatingPanelZIndex + 5;
53
53
  var akEditorTableToolbarSize = exports.akEditorTableToolbarSize = 11;
54
- var akEditorTableBorder = exports.akEditorTableBorder = "var(--ds-background-accent-gray-subtler, #DCDFE4)";
55
- var akEditorTableToolbar = exports.akEditorTableToolbar = "var(--ds-background-accent-gray-subtlest, #F1F2F4)";
54
+ var akEditorTableBorder = exports.akEditorTableBorder = "var(--ds-background-accent-gray-subtler, #DDDEE1)";
55
+ var akEditorTableToolbar = exports.akEditorTableToolbar = "var(--ds-background-accent-gray-subtlest, #F0F1F2)";
56
56
  var akEditorTableHeaderCellBackground = exports.akEditorTableHeaderCellBackground = '#F1F2F4';
57
57
  var akEditorTableHeaderCellBackgroundDark = exports.akEditorTableHeaderCellBackgroundDark = '#2C333A';
58
- var akEditorTableBorderSelected = exports.akEditorTableBorderSelected = "var(--ds-border-focused, #388BFF)";
58
+ var akEditorTableBorderSelected = exports.akEditorTableBorderSelected = "var(--ds-border-focused, #4688EC)";
59
59
  var akEditorTableBorderRadius = exports.akEditorTableBorderRadius = '3px';
60
60
  var akEditorTableCellBackgroundOpacity = exports.akEditorTableCellBackgroundOpacity = 0.5;
61
61
  var akEditorFullPageMaxWidth = exports.akEditorFullPageMaxWidth = 680;
@@ -171,6 +171,10 @@ var relativeSizeToBaseFontSize = exports.relativeSizeToBaseFontSize = function r
171
171
  return "calc(".concat(value, " * var(--ak-editor-base-font-size) / ").concat(akEditorFullPageDefaultFontSize, ")");
172
172
  };
173
173
  var VIEWPORT_SIZES = exports.VIEWPORT_SIZES = {
174
+ a4KMonitor: {
175
+ width: 3440,
176
+ height: 1440
177
+ },
174
178
  laptopHiDPI: {
175
179
  width: 1440,
176
180
  height: 900
@@ -212,7 +216,7 @@ var getTableCellBackgroundDarkModeColors = exports.getTableCellBackgroundDarkMod
212
216
  function getTableCellBackgroundDarkModeColorCSS(colorName, colorValue) {
213
217
  return "\n &[colorname=\"".concat(colorName, "\"] {\n background-color: ").concat(colorValue, " !important; // !important to override default style color\n }\n ");
214
218
  }
215
- var avatarColors = exports.avatarColors = ["var(--ds-icon-accent-red, #C9372C)", "var(--ds-background-accent-red-bolder-hovered, #AE2E24)", "var(--ds-icon-accent-magenta, #CD519D)", "var(--ds-background-accent-magenta-bolder-hovered, #943D73)", "var(--ds-icon-accent-orange, #E56910)", "var(--ds-background-accent-orange-bolder-hovered, #A54800)", "var(--ds-icon-accent-green, #22A06B)", "var(--ds-background-accent-green-bolder-hovered, #216E4E)", "var(--ds-icon-accent-blue, #1D7AFC)", "var(--ds-background-accent-blue-bolder-hovered, #0055CC)", "var(--ds-icon-accent-teal, #2898BD)", "var(--ds-background-accent-teal-bolder-hovered, #206A83)", "var(--ds-icon-accent-lime, #6A9A23)", "var(--ds-background-accent-lime-bolder-hovered, #4C6B1F)", "var(--ds-icon-accent-purple, #8270DB)", "var(--ds-background-accent-purple-bolder-hovered, #5E4DB2)", "var(--ds-icon-accent-gray, #758195)", "var(--ds-background-accent-gray-bolder-hovered, #44546F)", "var(--ds-icon-accent-yellow, #B38600)", "var(--ds-background-accent-yellow-bolder-hovered, #7F5F01)", "var(--ds-background-accent-yellow-bolder-pressed, #533F04)"];
219
+ var avatarColors = exports.avatarColors = ["var(--ds-icon-accent-red, #C9372C)", "var(--ds-background-accent-red-bolder-hovered, #AE2E24)", "var(--ds-icon-accent-magenta, #CD519D)", "var(--ds-background-accent-magenta-bolder-hovered, #943D73)", "var(--ds-icon-accent-orange, #E06C00)", "var(--ds-background-accent-orange-bolder-hovered, #9E4C00)", "var(--ds-icon-accent-green, #22A06B)", "var(--ds-background-accent-green-bolder-hovered, #216E4E)", "var(--ds-icon-accent-blue, #357DE8)", "var(--ds-background-accent-blue-bolder-hovered, #1558BC)", "var(--ds-icon-accent-teal, #2898BD)", "var(--ds-background-accent-teal-bolder-hovered, #206A83)", "var(--ds-icon-accent-lime, #6A9A23)", "var(--ds-background-accent-lime-bolder-hovered, #4C6B1F)", "var(--ds-icon-accent-purple, #AF59E1)", "var(--ds-background-accent-purple-bolder-hovered, #803FA5)", "var(--ds-icon-accent-gray, #7D818A)", "var(--ds-background-accent-gray-bolder-hovered, #505258)", "var(--ds-icon-accent-yellow, #B38600)", "var(--ds-background-accent-yellow-bolder-hovered, #7F5F01)", "var(--ds-background-accent-yellow-bolder-pressed, #614A05)"];
216
220
 
217
221
  // MDS-569: Will update references to avatarColors to use participantColors instead, we will then deprecate avatarColors
218
222
  var participantColors = exports.participantColors = [{
@@ -221,8 +225,8 @@ var participantColors = exports.participantColors = [{
221
225
  svgBackgroundColor: "var(--ds-background-accent-red-subtler, #FFD5D2)"
222
226
  }, {
223
227
  textColor: "var(--ds-text-inverse, #FFFFFF)",
224
- backgroundColor: "var(--ds-background-accent-blue-bolder, #0C66E4)",
225
- svgBackgroundColor: "var(--ds-background-accent-blue-subtler, #CCE0FF)"
228
+ backgroundColor: "var(--ds-background-accent-blue-bolder, #1868DB)",
229
+ svgBackgroundColor: "var(--ds-background-accent-blue-subtler, #CFE1FD)"
226
230
  }, {
227
231
  textColor: "var(--ds-text-inverse, #FFFFFF)",
228
232
  backgroundColor: "var(--ds-background-accent-green-bolder, #1F845A)",
@@ -230,11 +234,11 @@ var participantColors = exports.participantColors = [{
230
234
  }, {
231
235
  textColor: "var(--ds-text-inverse, #FFFFFF)",
232
236
  backgroundColor: "var(--ds-background-accent-yellow-bolder, #946F00)",
233
- svgBackgroundColor: "var(--ds-background-accent-yellow-subtler, #F8E6A0)"
237
+ svgBackgroundColor: "var(--ds-background-accent-yellow-subtler, #F5E989)"
234
238
  }, {
235
239
  textColor: "var(--ds-text-inverse, #FFFFFF)",
236
- backgroundColor: "var(--ds-background-accent-purple-bolder, #6E5DC6)",
237
- svgBackgroundColor: "var(--ds-background-accent-purple-subtler, #DFD8FD)"
240
+ backgroundColor: "var(--ds-background-accent-purple-bolder, #964AC0)",
241
+ svgBackgroundColor: "var(--ds-background-accent-purple-subtler, #EED7FC)"
238
242
  }, {
239
243
  textColor: "var(--ds-text-inverse, #FFFFFF)",
240
244
  backgroundColor: "var(--ds-background-accent-magenta-bolder, #AE4787)",
@@ -245,46 +249,46 @@ var participantColors = exports.participantColors = [{
245
249
  svgBackgroundColor: "var(--ds-background-accent-teal-subtler, #C6EDFB)"
246
250
  }, {
247
251
  textColor: "var(--ds-text-inverse, #FFFFFF)",
248
- backgroundColor: "var(--ds-background-accent-orange-bolder, #C25100)",
249
- svgBackgroundColor: "var(--ds-background-accent-orange-subtler, #FEDEC8)"
252
+ backgroundColor: "var(--ds-background-accent-orange-bolder, #BD5B00)",
253
+ svgBackgroundColor: "var(--ds-background-accent-orange-subtler, #FCE4A6)"
250
254
  }, {
251
255
  textColor: "var(--ds-text-inverse, #FFFFFF)",
252
256
  backgroundColor: "var(--ds-background-accent-lime-bolder, #5B7F24)",
253
257
  svgBackgroundColor: "var(--ds-background-accent-lime-subtler, #D3F1A7)"
254
258
  }, {
255
259
  textColor: "var(--ds-text-inverse, #FFFFFF)",
256
- backgroundColor: "var(--ds-background-accent-gray-bolder, #626F86)",
257
- svgBackgroundColor: "var(--ds-background-accent-gray-subtler, #DCDFE4)"
260
+ backgroundColor: "var(--ds-background-accent-gray-bolder, #6B6E76)",
261
+ svgBackgroundColor: "var(--ds-background-accent-gray-subtler, #DDDEE1)"
258
262
  }, {
259
- textColor: "var(--ds-text-accent-gray-bolder, #091E42)",
260
- backgroundColor: "var(--ds-background-accent-blue-subtle, #579DFF)",
261
- svgBackgroundColor: "var(--ds-background-accent-blue-subtlest, #E9F2FF)"
263
+ textColor: "var(--ds-text-accent-gray-bolder, #1E1F21)",
264
+ backgroundColor: "var(--ds-background-accent-blue-subtle, #669DF1)",
265
+ svgBackgroundColor: "var(--ds-background-accent-blue-subtlest, #E9F2FE)"
262
266
  }, {
263
- textColor: "var(--ds-text-accent-gray-bolder, #091E42)",
267
+ textColor: "var(--ds-text-accent-gray-bolder, #1E1F21)",
264
268
  backgroundColor: "var(--ds-background-accent-red-subtle, #F87168)",
265
269
  svgBackgroundColor: "var(--ds-background-accent-red-subtlest, #FFECEB)"
266
270
  }, {
267
- textColor: "var(--ds-text-accent-gray-bolder, #091E42)",
268
- backgroundColor: "var(--ds-background-accent-orange-subtle, #FEA362)",
269
- svgBackgroundColor: "var(--ds-background-accent-orange-subtlest, #FFF3EB)"
271
+ textColor: "var(--ds-text-accent-gray-bolder, #1E1F21)",
272
+ backgroundColor: "var(--ds-background-accent-orange-subtle, #FCA700)",
273
+ svgBackgroundColor: "var(--ds-background-accent-orange-subtlest, #FFF5DB)"
270
274
  }, {
271
- textColor: "var(--ds-text-accent-gray-bolder, #091E42)",
272
- backgroundColor: "var(--ds-background-accent-yellow-subtle, #F5CD47)",
273
- svgBackgroundColor: "var(--ds-background-accent-yellow-subtlest, #FFF7D6)"
275
+ textColor: "var(--ds-text-accent-gray-bolder, #1E1F21)",
276
+ backgroundColor: "var(--ds-background-accent-yellow-subtle, #EED12B)",
277
+ svgBackgroundColor: "var(--ds-background-accent-yellow-subtlest, #FEF7C8)"
274
278
  }, {
275
- textColor: "var(--ds-text-accent-gray-bolder, #091E42)",
279
+ textColor: "var(--ds-text-accent-gray-bolder, #1E1F21)",
276
280
  backgroundColor: "var(--ds-background-accent-green-subtle, #4BCE97)",
277
281
  svgBackgroundColor: "var(--ds-background-accent-green-subtlest, #DCFFF1)"
278
282
  }, {
279
- textColor: "var(--ds-text-accent-gray-bolder, #091E42)",
283
+ textColor: "var(--ds-text-accent-gray-bolder, #1E1F21)",
280
284
  backgroundColor: "var(--ds-background-accent-teal-subtle, #6CC3E0)",
281
285
  svgBackgroundColor: "var(--ds-background-accent-teal-subtlest, #E7F9FF)"
282
286
  }, {
283
- textColor: "var(--ds-text-accent-gray-bolder, #091E42)",
284
- backgroundColor: "var(--ds-background-accent-purple-subtle, #9F8FEF)",
285
- svgBackgroundColor: "var(--ds-background-accent-purple-subtlest, #F3F0FF)"
287
+ textColor: "var(--ds-text-accent-gray-bolder, #1E1F21)",
288
+ backgroundColor: "var(--ds-background-accent-purple-subtle, #C97CF4)",
289
+ svgBackgroundColor: "var(--ds-background-accent-purple-subtlest, #F8EEFE)"
286
290
  }, {
287
- textColor: "var(--ds-text-accent-gray-bolder, #091E42)",
291
+ textColor: "var(--ds-text-accent-gray-bolder, #1E1F21)",
288
292
  backgroundColor: "var(--ds-background-accent-magenta-subtle, #E774BB)",
289
293
  svgBackgroundColor: "var(--ds-background-accent-magenta-subtlest, #FFECF8)"
290
294
  }];
package/dist/cjs/overflow-shadow/overflow-shadow.js CHANGED
@@ -18,5 +18,5 @@ var overflowShadow = exports.overflowShadow = function overflowShadow(_ref) {
18
18
  var rightCoverWidthResolved = rightCoverWidth || width;
19
19
 
20
20
  // eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- needs manual remediation
21
- return (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n/* shadow cover left */\n linear-gradient(\n to right,\n ", " ", ",\n transparent ", "\n ),\n/* shadow cover background left */\n linear-gradient(\n to right,\n ", " ", ",\n transparent ", "\n ),\n/* shadow cover right */\n linear-gradient(\n to left,\n ", " ", ",\n transparent ", "\n ),\n/* shadow cover background right */\n linear-gradient(\n to left,\n ", " ", ",\n transparent ", "\n ),\n/* overflow shadow right spread */\n linear-gradient(\n to left,\n ", " 0,\n ", " ", "\n ),\n /* overflow shadow right perimeter */\n linear-gradient(\n to left,\n ", " 0,\n ", " ", "\n ),\n /* overflow shadow left spread */\n linear-gradient(\n to right,\n ", " 0,\n ", " ", "\n ),\n /* overflow shadow left perimeter */\n linear-gradient(\n to right,\n ", " 0,\n ", " ", "\n )\n"])), "var(--ds-background-neutral, #091E420F)", leftCoverWidthResolved, leftCoverWidthResolved, "var(--ds-surface-raised, #FFFFFF)", leftCoverWidthResolved, leftCoverWidthResolved, "var(--ds-background-neutral, #091E420F)", rightCoverWidthResolved, rightCoverWidthResolved, "var(--ds-surface-raised, #FFFFFF)", rightCoverWidthResolved, rightCoverWidthResolved, "var(--ds-shadow-overflow-spread, #091e4229)", "var(--ds-UNSAFE-transparent, transparent)", width, "var(--ds-shadow-overflow-perimeter, #091e421f)", "var(--ds-UNSAFE-transparent, transparent)", width, "var(--ds-shadow-overflow-spread, #091e4229)", "var(--ds-UNSAFE-transparent, transparent)", width, "var(--ds-shadow-overflow-perimeter, #091e421f)", "var(--ds-UNSAFE-transparent, transparent)", width);
21
+ return (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n/* shadow cover left */\n linear-gradient(\n to right,\n ", " ", ",\n transparent ", "\n ),\n/* shadow cover background left */\n linear-gradient(\n to right,\n ", " ", ",\n transparent ", "\n ),\n/* shadow cover right */\n linear-gradient(\n to left,\n ", " ", ",\n transparent ", "\n ),\n/* shadow cover background right */\n linear-gradient(\n to left,\n ", " ", ",\n transparent ", "\n ),\n/* overflow shadow right spread */\n linear-gradient(\n to left,\n ", " 0,\n ", " ", "\n ),\n /* overflow shadow right perimeter */\n linear-gradient(\n to left,\n ", " 0,\n ", " ", "\n ),\n /* overflow shadow left spread */\n linear-gradient(\n to right,\n ", " 0,\n ", " ", "\n ),\n /* overflow shadow left perimeter */\n linear-gradient(\n to right,\n ", " 0,\n ", " ", "\n )\n"])), "var(--ds-background-neutral, #0515240F)", leftCoverWidthResolved, leftCoverWidthResolved, "var(--ds-surface-raised, #FFFFFF)", leftCoverWidthResolved, leftCoverWidthResolved, "var(--ds-background-neutral, #0515240F)", rightCoverWidthResolved, rightCoverWidthResolved, "var(--ds-surface-raised, #FFFFFF)", rightCoverWidthResolved, rightCoverWidthResolved, "var(--ds-shadow-overflow-spread, #1E1F2129)", "var(--ds-UNSAFE-transparent, transparent)", width, "var(--ds-shadow-overflow-perimeter, #1E1F211f)", "var(--ds-UNSAFE-transparent, transparent)", width, "var(--ds-shadow-overflow-spread, #1E1F2129)", "var(--ds-UNSAFE-transparent, transparent)", width, "var(--ds-shadow-overflow-perimeter, #1E1F211f)", "var(--ds-UNSAFE-transparent, transparent)", width);
22
22
  };
package/dist/cjs/scrollbar-styles.js CHANGED
@@ -7,4 +7,4 @@ exports.scrollbarStyles = void 0;
7
7
  /* eslint-disable @atlaskit/editor/no-re-export */
8
8
  // Entry file in package.json
9
9
 
10
- var scrollbarStyles = exports.scrollbarStyles = "\n -ms-overflow-style: -ms-autohiding-scrollbar;\n\n &::-webkit-scrollbar {\n overflow: hidden,\n }\n\n &::-webkit-scrollbar-corner {\n display: none;\n }\n\n &::-webkit-scrollbar-thumb {\n background-color: ".concat("var(--ds-background-neutral-subtle, #00000000)", ";\n }\n\n &:hover::-webkit-scrollbar-thumb {\n background-color: ", "var(--ds-background-neutral-bold, #44546F)", ";\n border-radius: 8px;\n }\n\n &::-webkit-scrollbar-thumb:hover {\n background-color: ", "var(--ds-background-neutral-bold-hovered, #2C3E5D)", ";\n }\n");
10
+ var scrollbarStyles = exports.scrollbarStyles = "\n -ms-overflow-style: -ms-autohiding-scrollbar;\n\n &::-webkit-scrollbar {\n overflow: hidden,\n }\n\n &::-webkit-scrollbar-corner {\n display: none;\n }\n\n &::-webkit-scrollbar-thumb {\n background-color: ".concat("var(--ds-background-neutral-subtle, #00000000)", ";\n }\n\n &:hover::-webkit-scrollbar-thumb {\n background-color: ", "var(--ds-background-neutral-bold, #292A2E)", ";\n border-radius: 8px;\n }\n\n &::-webkit-scrollbar-thumb:hover {\n background-color: ", "var(--ds-background-neutral-bold-hovered, #3B3D42)", ";\n }\n");
package/dist/cjs/selection/utils.js CHANGED
@@ -29,7 +29,7 @@ var getSelectionStyle = function getSelectionStyle(style) {
29
29
  case _types.SelectionStyle.BoxShadow:
30
30
  return "\n box-shadow: ".concat(_consts.akEditorSelectedBoxShadow, ";\n border-color: transparent;\n ");
31
31
  case _types.SelectionStyle.Background:
32
- return "background-color: ".concat("var(--ds-background-selected, #E9F2FF)", ";");
32
+ return "background-color: ".concat("var(--ds-background-selected, #E9F2FE)", ";");
33
33
  case _types.SelectionStyle.Blanket:
34
34
  return "\n position: relative;\n\n // Fixes ED-9263, where emoji or inline card in panel makes selection go outside the panel\n // in Safari. Looks like it's caused by user-select: all in the emoji element\n -webkit-user-select: text;\n\n ::before {\n position: absolute;\n content: '';\n left: 0;\n right: 0;\n top: 0;\n bottom: 0;\n width: 100%;\n pointer-events: none;\n z-index: ".concat(_consts.akEditorSmallZIndex, ";\n background-color: ", "var(--ds-blanket-selected, #388BFF14)", "\n }");
35
35
  default:
package/dist/cjs/shortcut/shortcut.js CHANGED
@@ -14,4 +14,4 @@ var _templateObject; // eslint-disable-next-line @atlaskit/ui-styling-standard/u
14
14
  * @deprecated use `import { Shortcut } from '@atlaskit/editor-common/ui';` instead
15
15
  */
16
16
  // eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
17
- var shortcutStyle = exports.shortcutStyle = (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n\tbackground-color: ", ";\n\tcolor: ", ";\n\tborder-radius: ", ";\n\tpadding: ", ";\n\tline-height: 12px;\n\tfont-size: ", ";\n\talign-self: flex-end;\n\t@media (max-width: ", "px) {\n\t\tdisplay: none;\n\t}\n"])), "var(--ds-background-neutral, #091E420F)", "var(--ds-text-subtle, #44546F)", "var(--ds-radius-small, 3px)", "var(--ds-space-050, 4px)", (0, _consts.relativeFontSizeToBase16)(11.67), _consts.akEditorMobileMaxWidth);
17
+ var shortcutStyle = exports.shortcutStyle = (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n\tbackground-color: ", ";\n\tcolor: ", ";\n\tborder-radius: ", ";\n\tpadding: ", ";\n\tline-height: 12px;\n\tfont-size: ", ";\n\talign-self: flex-end;\n\t@media (max-width: ", "px) {\n\t\tdisplay: none;\n\t}\n"])), "var(--ds-background-neutral, #0515240F)", "var(--ds-text-subtle, #505258)", "var(--ds-radius-small, 3px)", "var(--ds-space-050, 4px)", (0, _consts.relativeFontSizeToBase16)(11.67), _consts.akEditorMobileMaxWidth);
package/dist/es2019/consts/consts.js CHANGED
@@ -6,9 +6,9 @@ import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
6
6
  export const akEditorFullPageDefaultFontSize = 16;
7
7
  export const akEditorFullPageDenseFontSize = 13;
8
8
  export const akEditorCodeFontFamily = "var(--ds-font-family-code, ui-monospace, Menlo, \"Segoe UI Mono\", \"Ubuntu Mono\", monospace)";
9
- export const akEditorSubtleAccent = "var(--ds-background-accent-gray-subtler, #DCDFE4)";
10
- export const akEditorBlockquoteBorderColor = "var(--ds-border, #091E4224)";
11
- export const akEditorCodeBackground = "var(--ds-background-accent-gray-subtlest, #F1F2F4)";
9
+ export const akEditorSubtleAccent = "var(--ds-background-accent-gray-subtler, #DDDEE1)";
10
+ export const akEditorBlockquoteBorderColor = "var(--ds-border, #0B120E24)";
11
+ export const akEditorCodeBackground = "var(--ds-background-accent-gray-subtlest, #F0F1F2)";
12
12
  export const akEditorCodeBlockPadding = '12px';
13
13
  export const akEditorCodeInlinePadding = '2px 4px';
14
14
  export const akEditorDeleteBackground = "var(--ds-background-danger, #FFECEB)";
@@ -16,12 +16,12 @@ export const akEditorDeleteBackgroundWithOpacity = 'rgba(255, 189, 173, 0.5)'; /
16
16
  export const akEditorDeleteBorder = "var(--ds-border-danger, #E2483D)";
17
17
  export const akEditorDeleteIconColor = "var(--ds-icon-danger, #C9372C)";
18
18
  export const akEditorCustomIconSize = 20;
19
- export const akEditorSelectedBorderColor = "var(--ds-border-selected, #0C66E4)";
19
+ export const akEditorSelectedBorderColor = "var(--ds-border-selected, #1868DB)";
20
20
  export const akEditorSelectedBorderSize = 1;
21
21
  export const akEditorSelectedBorderBoldSize = 2;
22
- export const akEditorSelectedBorder = `${akEditorSelectedBorderSize}px solid ${"var(--ds-border-selected, #0C66E4)"}`;
23
- export const akEditorSelectedBoxShadow = `0 0 0 ${akEditorSelectedBorderSize}px ${"var(--ds-border-selected, #0C66E4)"}`;
24
- export const akEditorSelectedBoldBoxShadow = `0 0 0 ${akEditorSelectedBorderBoldSize}px ${"var(--ds-border-selected, #0C66E4)"}`;
22
+ export const akEditorSelectedBorder = `${akEditorSelectedBorderSize}px solid ${"var(--ds-border-selected, #1868DB)"}`;
23
+ export const akEditorSelectedBoxShadow = `0 0 0 ${akEditorSelectedBorderSize}px ${"var(--ds-border-selected, #1868DB)"}`;
24
+ export const akEditorSelectedBoldBoxShadow = `0 0 0 ${akEditorSelectedBorderBoldSize}px ${"var(--ds-border-selected, #1868DB)"}`;
25
25
  export const akEditorSelectedBlanketOpacity = 0.3;
26
26
  export const akEditorUnitZIndex = 1;
27
27
  export const akEditorShadowZIndex = 2;
@@ -41,11 +41,11 @@ export const akEditorTableCellOnStickyHeaderZIndex = akEditorFloatingDialogZInde
41
41
  // z-index used for floating toolbars table cell menu which are above block toolbars
42
42
  export const akEditorFloatingOverlapPanelZIndex = akEditorFloatingPanelZIndex + 5;
43
43
  export const akEditorTableToolbarSize = 11;
44
- export const akEditorTableBorder = "var(--ds-background-accent-gray-subtler, #DCDFE4)";
45
- export const akEditorTableToolbar = "var(--ds-background-accent-gray-subtlest, #F1F2F4)";
44
+ export const akEditorTableBorder = "var(--ds-background-accent-gray-subtler, #DDDEE1)";
45
+ export const akEditorTableToolbar = "var(--ds-background-accent-gray-subtlest, #F0F1F2)";
46
46
  export const akEditorTableHeaderCellBackground = '#F1F2F4';
47
47
  export const akEditorTableHeaderCellBackgroundDark = '#2C333A';
48
- export const akEditorTableBorderSelected = "var(--ds-border-focused, #388BFF)";
48
+ export const akEditorTableBorderSelected = "var(--ds-border-focused, #4688EC)";
49
49
  export const akEditorTableBorderRadius = '3px';
50
50
  export const akEditorTableCellBackgroundOpacity = 0.5;
51
51
  export const akEditorFullPageMaxWidth = 680;
@@ -154,6 +154,10 @@ export const relativeSizeToBaseFontSize = value => {
154
154
  return `calc(${value} * var(--ak-editor-base-font-size) / ${akEditorFullPageDefaultFontSize})`;
155
155
  };
156
156
  export const VIEWPORT_SIZES = {
157
+ a4KMonitor: {
158
+ width: 3440,
159
+ height: 1440
160
+ },
157
161
  laptopHiDPI: {
158
162
  width: 1440,
159
163
  height: 900
@@ -194,7 +198,7 @@ export function getTableCellBackgroundDarkModeColorCSS(colorName, colorValue) {
194
198
  }
195
199
  `;
196
200
  }
197
- export const avatarColors = ["var(--ds-icon-accent-red, #C9372C)", "var(--ds-background-accent-red-bolder-hovered, #AE2E24)", "var(--ds-icon-accent-magenta, #CD519D)", "var(--ds-background-accent-magenta-bolder-hovered, #943D73)", "var(--ds-icon-accent-orange, #E56910)", "var(--ds-background-accent-orange-bolder-hovered, #A54800)", "var(--ds-icon-accent-green, #22A06B)", "var(--ds-background-accent-green-bolder-hovered, #216E4E)", "var(--ds-icon-accent-blue, #1D7AFC)", "var(--ds-background-accent-blue-bolder-hovered, #0055CC)", "var(--ds-icon-accent-teal, #2898BD)", "var(--ds-background-accent-teal-bolder-hovered, #206A83)", "var(--ds-icon-accent-lime, #6A9A23)", "var(--ds-background-accent-lime-bolder-hovered, #4C6B1F)", "var(--ds-icon-accent-purple, #8270DB)", "var(--ds-background-accent-purple-bolder-hovered, #5E4DB2)", "var(--ds-icon-accent-gray, #758195)", "var(--ds-background-accent-gray-bolder-hovered, #44546F)", "var(--ds-icon-accent-yellow, #B38600)", "var(--ds-background-accent-yellow-bolder-hovered, #7F5F01)", "var(--ds-background-accent-yellow-bolder-pressed, #533F04)"];
201
+ export const avatarColors = ["var(--ds-icon-accent-red, #C9372C)", "var(--ds-background-accent-red-bolder-hovered, #AE2E24)", "var(--ds-icon-accent-magenta, #CD519D)", "var(--ds-background-accent-magenta-bolder-hovered, #943D73)", "var(--ds-icon-accent-orange, #E06C00)", "var(--ds-background-accent-orange-bolder-hovered, #9E4C00)", "var(--ds-icon-accent-green, #22A06B)", "var(--ds-background-accent-green-bolder-hovered, #216E4E)", "var(--ds-icon-accent-blue, #357DE8)", "var(--ds-background-accent-blue-bolder-hovered, #1558BC)", "var(--ds-icon-accent-teal, #2898BD)", "var(--ds-background-accent-teal-bolder-hovered, #206A83)", "var(--ds-icon-accent-lime, #6A9A23)", "var(--ds-background-accent-lime-bolder-hovered, #4C6B1F)", "var(--ds-icon-accent-purple, #AF59E1)", "var(--ds-background-accent-purple-bolder-hovered, #803FA5)", "var(--ds-icon-accent-gray, #7D818A)", "var(--ds-background-accent-gray-bolder-hovered, #505258)", "var(--ds-icon-accent-yellow, #B38600)", "var(--ds-background-accent-yellow-bolder-hovered, #7F5F01)", "var(--ds-background-accent-yellow-bolder-pressed, #614A05)"];
198
202
 
199
203
  // MDS-569: Will update references to avatarColors to use participantColors instead, we will then deprecate avatarColors
200
204
  export const participantColors = [{
@@ -203,8 +207,8 @@ export const participantColors = [{
203
207
  svgBackgroundColor: "var(--ds-background-accent-red-subtler, #FFD5D2)"
204
208
  }, {
205
209
  textColor: "var(--ds-text-inverse, #FFFFFF)",
206
- backgroundColor: "var(--ds-background-accent-blue-bolder, #0C66E4)",
207
- svgBackgroundColor: "var(--ds-background-accent-blue-subtler, #CCE0FF)"
210
+ backgroundColor: "var(--ds-background-accent-blue-bolder, #1868DB)",
211
+ svgBackgroundColor: "var(--ds-background-accent-blue-subtler, #CFE1FD)"
208
212
  }, {
209
213
  textColor: "var(--ds-text-inverse, #FFFFFF)",
210
214
  backgroundColor: "var(--ds-background-accent-green-bolder, #1F845A)",
@@ -212,11 +216,11 @@ export const participantColors = [{
212
216
  }, {
213
217
  textColor: "var(--ds-text-inverse, #FFFFFF)",
214
218
  backgroundColor: "var(--ds-background-accent-yellow-bolder, #946F00)",
215
- svgBackgroundColor: "var(--ds-background-accent-yellow-subtler, #F8E6A0)"
219
+ svgBackgroundColor: "var(--ds-background-accent-yellow-subtler, #F5E989)"
216
220
  }, {
217
221
  textColor: "var(--ds-text-inverse, #FFFFFF)",
218
- backgroundColor: "var(--ds-background-accent-purple-bolder, #6E5DC6)",
219
- svgBackgroundColor: "var(--ds-background-accent-purple-subtler, #DFD8FD)"
222
+ backgroundColor: "var(--ds-background-accent-purple-bolder, #964AC0)",
223
+ svgBackgroundColor: "var(--ds-background-accent-purple-subtler, #EED7FC)"
220
224
  }, {
221
225
  textColor: "var(--ds-text-inverse, #FFFFFF)",
222
226
  backgroundColor: "var(--ds-background-accent-magenta-bolder, #AE4787)",
@@ -227,46 +231,46 @@ export const participantColors = [{
227
231
  svgBackgroundColor: "var(--ds-background-accent-teal-subtler, #C6EDFB)"
228
232
  }, {
229
233
  textColor: "var(--ds-text-inverse, #FFFFFF)",
230
- backgroundColor: "var(--ds-background-accent-orange-bolder, #C25100)",
231
- svgBackgroundColor: "var(--ds-background-accent-orange-subtler, #FEDEC8)"
234
+ backgroundColor: "var(--ds-background-accent-orange-bolder, #BD5B00)",
235
+ svgBackgroundColor: "var(--ds-background-accent-orange-subtler, #FCE4A6)"
232
236
  }, {
233
237
  textColor: "var(--ds-text-inverse, #FFFFFF)",
234
238
  backgroundColor: "var(--ds-background-accent-lime-bolder, #5B7F24)",
235
239
  svgBackgroundColor: "var(--ds-background-accent-lime-subtler, #D3F1A7)"
236
240
  }, {
237
241
  textColor: "var(--ds-text-inverse, #FFFFFF)",
238
- backgroundColor: "var(--ds-background-accent-gray-bolder, #626F86)",
239
- svgBackgroundColor: "var(--ds-background-accent-gray-subtler, #DCDFE4)"
242
+ backgroundColor: "var(--ds-background-accent-gray-bolder, #6B6E76)",
243
+ svgBackgroundColor: "var(--ds-background-accent-gray-subtler, #DDDEE1)"
240
244
  }, {
241
- textColor: "var(--ds-text-accent-gray-bolder, #091E42)",
242
- backgroundColor: "var(--ds-background-accent-blue-subtle, #579DFF)",
243
- svgBackgroundColor: "var(--ds-background-accent-blue-subtlest, #E9F2FF)"
245
+ textColor: "var(--ds-text-accent-gray-bolder, #1E1F21)",
246
+ backgroundColor: "var(--ds-background-accent-blue-subtle, #669DF1)",
247
+ svgBackgroundColor: "var(--ds-background-accent-blue-subtlest, #E9F2FE)"
244
248
  }, {
245
- textColor: "var(--ds-text-accent-gray-bolder, #091E42)",
249
+ textColor: "var(--ds-text-accent-gray-bolder, #1E1F21)",
246
250
  backgroundColor: "var(--ds-background-accent-red-subtle, #F87168)",
247
251
  svgBackgroundColor: "var(--ds-background-accent-red-subtlest, #FFECEB)"
248
252
  }, {
249
- textColor: "var(--ds-text-accent-gray-bolder, #091E42)",
250
- backgroundColor: "var(--ds-background-accent-orange-subtle, #FEA362)",
251
- svgBackgroundColor: "var(--ds-background-accent-orange-subtlest, #FFF3EB)"
253
+ textColor: "var(--ds-text-accent-gray-bolder, #1E1F21)",
254
+ backgroundColor: "var(--ds-background-accent-orange-subtle, #FCA700)",
255
+ svgBackgroundColor: "var(--ds-background-accent-orange-subtlest, #FFF5DB)"
252
256
  }, {
253
- textColor: "var(--ds-text-accent-gray-bolder, #091E42)",
254
- backgroundColor: "var(--ds-background-accent-yellow-subtle, #F5CD47)",
255
- svgBackgroundColor: "var(--ds-background-accent-yellow-subtlest, #FFF7D6)"
257
+ textColor: "var(--ds-text-accent-gray-bolder, #1E1F21)",
258
+ backgroundColor: "var(--ds-background-accent-yellow-subtle, #EED12B)",
259
+ svgBackgroundColor: "var(--ds-background-accent-yellow-subtlest, #FEF7C8)"
256
260
  }, {
257
- textColor: "var(--ds-text-accent-gray-bolder, #091E42)",
261
+ textColor: "var(--ds-text-accent-gray-bolder, #1E1F21)",
258
262
  backgroundColor: "var(--ds-background-accent-green-subtle, #4BCE97)",
259
263
  svgBackgroundColor: "var(--ds-background-accent-green-subtlest, #DCFFF1)"
260
264
  }, {
261
- textColor: "var(--ds-text-accent-gray-bolder, #091E42)",
265
+ textColor: "var(--ds-text-accent-gray-bolder, #1E1F21)",
262
266
  backgroundColor: "var(--ds-background-accent-teal-subtle, #6CC3E0)",
263
267
  svgBackgroundColor: "var(--ds-background-accent-teal-subtlest, #E7F9FF)"
264
268
  }, {
265
- textColor: "var(--ds-text-accent-gray-bolder, #091E42)",
266
- backgroundColor: "var(--ds-background-accent-purple-subtle, #9F8FEF)",
267
- svgBackgroundColor: "var(--ds-background-accent-purple-subtlest, #F3F0FF)"
269
+ textColor: "var(--ds-text-accent-gray-bolder, #1E1F21)",
270
+ backgroundColor: "var(--ds-background-accent-purple-subtle, #C97CF4)",
271
+ svgBackgroundColor: "var(--ds-background-accent-purple-subtlest, #F8EEFE)"
268
272
  }, {
269
- textColor: "var(--ds-text-accent-gray-bolder, #091E42)",
273
+ textColor: "var(--ds-text-accent-gray-bolder, #1E1F21)",
270
274
  backgroundColor: "var(--ds-background-accent-magenta-subtle, #E774BB)",
271
275
  svgBackgroundColor: "var(--ds-background-accent-magenta-subtlest, #FFECF8)"
272
276
  }];
package/dist/es2019/overflow-shadow/overflow-shadow.js CHANGED
@@ -14,7 +14,7 @@ export const overflowShadow = ({
14
14
  /* shadow cover left */
15
15
  linear-gradient(
16
16
  to right,
17
- ${"var(--ds-background-neutral, #091E420F)"} ${leftCoverWidthResolved},
17
+ ${"var(--ds-background-neutral, #0515240F)"} ${leftCoverWidthResolved},
18
18
  transparent ${leftCoverWidthResolved}
19
19
  ),
20
20
  /* shadow cover background left */
@@ -26,7 +26,7 @@ export const overflowShadow = ({
26
26
  /* shadow cover right */
27
27
  linear-gradient(
28
28
  to left,
29
- ${"var(--ds-background-neutral, #091E420F)"} ${rightCoverWidthResolved},
29
+ ${"var(--ds-background-neutral, #0515240F)"} ${rightCoverWidthResolved},
30
30
  transparent ${rightCoverWidthResolved}
31
31
  ),
32
32
  /* shadow cover background right */
@@ -38,25 +38,25 @@ export const overflowShadow = ({
38
38
  /* overflow shadow right spread */
39
39
  linear-gradient(
40
40
  to left,
41
- ${"var(--ds-shadow-overflow-spread, #091e4229)"} 0,
41
+ ${"var(--ds-shadow-overflow-spread, #1E1F2129)"} 0,
42
42
  ${"var(--ds-UNSAFE-transparent, transparent)"} ${width}
43
43
  ),
44
44
  /* overflow shadow right perimeter */
45
45
  linear-gradient(
46
46
  to left,
47
- ${"var(--ds-shadow-overflow-perimeter, #091e421f)"} 0,
47
+ ${"var(--ds-shadow-overflow-perimeter, #1E1F211f)"} 0,
48
48
  ${"var(--ds-UNSAFE-transparent, transparent)"} ${width}
49
49
  ),
50
50
  /* overflow shadow left spread */
51
51
  linear-gradient(
52
52
  to right,
53
- ${"var(--ds-shadow-overflow-spread, #091e4229)"} 0,
53
+ ${"var(--ds-shadow-overflow-spread, #1E1F2129)"} 0,
54
54
  ${"var(--ds-UNSAFE-transparent, transparent)"} ${width}
55
55
  ),
56
56
  /* overflow shadow left perimeter */
57
57
  linear-gradient(
58
58
  to right,
59
- ${"var(--ds-shadow-overflow-perimeter, #091e421f)"} 0,
59
+ ${"var(--ds-shadow-overflow-perimeter, #1E1F211f)"} 0,
60
60
  ${"var(--ds-UNSAFE-transparent, transparent)"} ${width}
61
61
  )
62
62
  `;
package/dist/es2019/scrollbar-styles.js CHANGED
@@ -17,11 +17,11 @@ export const scrollbarStyles = `
17
17
  }
18
18
 
19
19
  &:hover::-webkit-scrollbar-thumb {
20
- background-color: ${"var(--ds-background-neutral-bold, #44546F)"};
20
+ background-color: ${"var(--ds-background-neutral-bold, #292A2E)"};
21
21
  border-radius: 8px;
22
22
  }
23
23
 
24
24
  &::-webkit-scrollbar-thumb:hover {
25
- background-color: ${"var(--ds-background-neutral-bold-hovered, #2C3E5D)"};
25
+ background-color: ${"var(--ds-background-neutral-bold-hovered, #3B3D42)"};
26
26
  }
27
27
  `;
package/dist/es2019/selection/utils.js CHANGED
@@ -46,7 +46,7 @@ const getSelectionStyle = style => {
46
46
  border-color: transparent;
47
47
  `;
48
48
  case SelectionStyle.Background:
49
- return `background-color: ${"var(--ds-background-selected, #E9F2FF)"};`;
49
+ return `background-color: ${"var(--ds-background-selected, #E9F2FE)"};`;
50
50
  case SelectionStyle.Blanket:
51
51
  return `
52
52
  position: relative;
package/dist/es2019/shortcut/shortcut.js CHANGED
@@ -8,8 +8,8 @@ import { akEditorMobileMaxWidth, relativeFontSizeToBase16 } from '../consts';
8
8
  */
9
9
  // eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
10
10
  export const shortcutStyle = css`
11
- background-color: ${"var(--ds-background-neutral, #091E420F)"};
12
- color: ${"var(--ds-text-subtle, #44546F)"};
11
+ background-color: ${"var(--ds-background-neutral, #0515240F)"};
12
+ color: ${"var(--ds-text-subtle, #505258)"};
13
13
  border-radius: ${"var(--ds-radius-small, 3px)"};
14
14
  padding: ${"var(--ds-space-050, 4px)"};
15
15
  line-height: 12px;
package/dist/esm/consts/consts.js CHANGED
@@ -7,9 +7,9 @@ import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
7
7
  export var akEditorFullPageDefaultFontSize = 16;
8
8
  export var akEditorFullPageDenseFontSize = 13;
9
9
  export var akEditorCodeFontFamily = "var(--ds-font-family-code, ui-monospace, Menlo, \"Segoe UI Mono\", \"Ubuntu Mono\", monospace)";
10
- export var akEditorSubtleAccent = "var(--ds-background-accent-gray-subtler, #DCDFE4)";
11
- export var akEditorBlockquoteBorderColor = "var(--ds-border, #091E4224)";
12
- export var akEditorCodeBackground = "var(--ds-background-accent-gray-subtlest, #F1F2F4)";
10
+ export var akEditorSubtleAccent = "var(--ds-background-accent-gray-subtler, #DDDEE1)";
11
+ export var akEditorBlockquoteBorderColor = "var(--ds-border, #0B120E24)";
12
+ export var akEditorCodeBackground = "var(--ds-background-accent-gray-subtlest, #F0F1F2)";
13
13
  export var akEditorCodeBlockPadding = '12px';
14
14
  export var akEditorCodeInlinePadding = '2px 4px';
15
15
  export var akEditorDeleteBackground = "var(--ds-background-danger, #FFECEB)";
@@ -17,12 +17,12 @@ export var akEditorDeleteBackgroundWithOpacity = 'rgba(255, 189, 173, 0.5)'; //
17
17
  export var akEditorDeleteBorder = "var(--ds-border-danger, #E2483D)";
18
18
  export var akEditorDeleteIconColor = "var(--ds-icon-danger, #C9372C)";
19
19
  export var akEditorCustomIconSize = 20;
20
- export var akEditorSelectedBorderColor = "var(--ds-border-selected, #0C66E4)";
20
+ export var akEditorSelectedBorderColor = "var(--ds-border-selected, #1868DB)";
21
21
  export var akEditorSelectedBorderSize = 1;
22
22
  export var akEditorSelectedBorderBoldSize = 2;
23
- export var akEditorSelectedBorder = "".concat(akEditorSelectedBorderSize, "px solid ", "var(--ds-border-selected, #0C66E4)");
24
- export var akEditorSelectedBoxShadow = "0 0 0 ".concat(akEditorSelectedBorderSize, "px ", "var(--ds-border-selected, #0C66E4)");
25
- export var akEditorSelectedBoldBoxShadow = "0 0 0 ".concat(akEditorSelectedBorderBoldSize, "px ", "var(--ds-border-selected, #0C66E4)");
23
+ export var akEditorSelectedBorder = "".concat(akEditorSelectedBorderSize, "px solid ", "var(--ds-border-selected, #1868DB)");
24
+ export var akEditorSelectedBoxShadow = "0 0 0 ".concat(akEditorSelectedBorderSize, "px ", "var(--ds-border-selected, #1868DB)");
25
+ export var akEditorSelectedBoldBoxShadow = "0 0 0 ".concat(akEditorSelectedBorderBoldSize, "px ", "var(--ds-border-selected, #1868DB)");
26
26
  export var akEditorSelectedBlanketOpacity = 0.3;
27
27
  export var akEditorUnitZIndex = 1;
28
28
  export var akEditorShadowZIndex = 2;
@@ -42,11 +42,11 @@ export var akEditorTableCellOnStickyHeaderZIndex = akEditorFloatingDialogZIndex
42
42
  // z-index used for floating toolbars table cell menu which are above block toolbars
43
43
  export var akEditorFloatingOverlapPanelZIndex = akEditorFloatingPanelZIndex + 5;
44
44
  export var akEditorTableToolbarSize = 11;
45
- export var akEditorTableBorder = "var(--ds-background-accent-gray-subtler, #DCDFE4)";
46
- export var akEditorTableToolbar = "var(--ds-background-accent-gray-subtlest, #F1F2F4)";
45
+ export var akEditorTableBorder = "var(--ds-background-accent-gray-subtler, #DDDEE1)";
46
+ export var akEditorTableToolbar = "var(--ds-background-accent-gray-subtlest, #F0F1F2)";
47
47
  export var akEditorTableHeaderCellBackground = '#F1F2F4';
48
48
  export var akEditorTableHeaderCellBackgroundDark = '#2C333A';
49
- export var akEditorTableBorderSelected = "var(--ds-border-focused, #388BFF)";
49
+ export var akEditorTableBorderSelected = "var(--ds-border-focused, #4688EC)";
50
50
  export var akEditorTableBorderRadius = '3px';
51
51
  export var akEditorTableCellBackgroundOpacity = 0.5;
52
52
  export var akEditorFullPageMaxWidth = 680;
@@ -162,6 +162,10 @@ export var relativeSizeToBaseFontSize = function relativeSizeToBaseFontSize(valu
162
162
  return "calc(".concat(value, " * var(--ak-editor-base-font-size) / ").concat(akEditorFullPageDefaultFontSize, ")");
163
163
  };
164
164
  export var VIEWPORT_SIZES = {
165
+ a4KMonitor: {
166
+ width: 3440,
167
+ height: 1440
168
+ },
165
169
  laptopHiDPI: {
166
170
  width: 1440,
167
171
  height: 900
@@ -203,7 +207,7 @@ export var getTableCellBackgroundDarkModeColors = [['White', '#000000'], ['Light
203
207
  export function getTableCellBackgroundDarkModeColorCSS(colorName, colorValue) {
204
208
  return "\n &[colorname=\"".concat(colorName, "\"] {\n background-color: ").concat(colorValue, " !important; // !important to override default style color\n }\n ");
205
209
  }
206
- export var avatarColors = ["var(--ds-icon-accent-red, #C9372C)", "var(--ds-background-accent-red-bolder-hovered, #AE2E24)", "var(--ds-icon-accent-magenta, #CD519D)", "var(--ds-background-accent-magenta-bolder-hovered, #943D73)", "var(--ds-icon-accent-orange, #E56910)", "var(--ds-background-accent-orange-bolder-hovered, #A54800)", "var(--ds-icon-accent-green, #22A06B)", "var(--ds-background-accent-green-bolder-hovered, #216E4E)", "var(--ds-icon-accent-blue, #1D7AFC)", "var(--ds-background-accent-blue-bolder-hovered, #0055CC)", "var(--ds-icon-accent-teal, #2898BD)", "var(--ds-background-accent-teal-bolder-hovered, #206A83)", "var(--ds-icon-accent-lime, #6A9A23)", "var(--ds-background-accent-lime-bolder-hovered, #4C6B1F)", "var(--ds-icon-accent-purple, #8270DB)", "var(--ds-background-accent-purple-bolder-hovered, #5E4DB2)", "var(--ds-icon-accent-gray, #758195)", "var(--ds-background-accent-gray-bolder-hovered, #44546F)", "var(--ds-icon-accent-yellow, #B38600)", "var(--ds-background-accent-yellow-bolder-hovered, #7F5F01)", "var(--ds-background-accent-yellow-bolder-pressed, #533F04)"];
210
+ export var avatarColors = ["var(--ds-icon-accent-red, #C9372C)", "var(--ds-background-accent-red-bolder-hovered, #AE2E24)", "var(--ds-icon-accent-magenta, #CD519D)", "var(--ds-background-accent-magenta-bolder-hovered, #943D73)", "var(--ds-icon-accent-orange, #E06C00)", "var(--ds-background-accent-orange-bolder-hovered, #9E4C00)", "var(--ds-icon-accent-green, #22A06B)", "var(--ds-background-accent-green-bolder-hovered, #216E4E)", "var(--ds-icon-accent-blue, #357DE8)", "var(--ds-background-accent-blue-bolder-hovered, #1558BC)", "var(--ds-icon-accent-teal, #2898BD)", "var(--ds-background-accent-teal-bolder-hovered, #206A83)", "var(--ds-icon-accent-lime, #6A9A23)", "var(--ds-background-accent-lime-bolder-hovered, #4C6B1F)", "var(--ds-icon-accent-purple, #AF59E1)", "var(--ds-background-accent-purple-bolder-hovered, #803FA5)", "var(--ds-icon-accent-gray, #7D818A)", "var(--ds-background-accent-gray-bolder-hovered, #505258)", "var(--ds-icon-accent-yellow, #B38600)", "var(--ds-background-accent-yellow-bolder-hovered, #7F5F01)", "var(--ds-background-accent-yellow-bolder-pressed, #614A05)"];
207
211
 
208
212
  // MDS-569: Will update references to avatarColors to use participantColors instead, we will then deprecate avatarColors
209
213
  export var participantColors = [{
@@ -212,8 +216,8 @@ export var participantColors = [{
212
216
  svgBackgroundColor: "var(--ds-background-accent-red-subtler, #FFD5D2)"
213
217
  }, {
214
218
  textColor: "var(--ds-text-inverse, #FFFFFF)",
215
- backgroundColor: "var(--ds-background-accent-blue-bolder, #0C66E4)",
216
- svgBackgroundColor: "var(--ds-background-accent-blue-subtler, #CCE0FF)"
219
+ backgroundColor: "var(--ds-background-accent-blue-bolder, #1868DB)",
220
+ svgBackgroundColor: "var(--ds-background-accent-blue-subtler, #CFE1FD)"
217
221
  }, {
218
222
  textColor: "var(--ds-text-inverse, #FFFFFF)",
219
223
  backgroundColor: "var(--ds-background-accent-green-bolder, #1F845A)",
@@ -221,11 +225,11 @@ export var participantColors = [{
221
225
  }, {
222
226
  textColor: "var(--ds-text-inverse, #FFFFFF)",
223
227
  backgroundColor: "var(--ds-background-accent-yellow-bolder, #946F00)",
224
- svgBackgroundColor: "var(--ds-background-accent-yellow-subtler, #F8E6A0)"
228
+ svgBackgroundColor: "var(--ds-background-accent-yellow-subtler, #F5E989)"
225
229
  }, {
226
230
  textColor: "var(--ds-text-inverse, #FFFFFF)",
227
- backgroundColor: "var(--ds-background-accent-purple-bolder, #6E5DC6)",
228
- svgBackgroundColor: "var(--ds-background-accent-purple-subtler, #DFD8FD)"
231
+ backgroundColor: "var(--ds-background-accent-purple-bolder, #964AC0)",
232
+ svgBackgroundColor: "var(--ds-background-accent-purple-subtler, #EED7FC)"
229
233
  }, {
230
234
  textColor: "var(--ds-text-inverse, #FFFFFF)",
231
235
  backgroundColor: "var(--ds-background-accent-magenta-bolder, #AE4787)",
@@ -236,46 +240,46 @@ export var participantColors = [{
236
240
  svgBackgroundColor: "var(--ds-background-accent-teal-subtler, #C6EDFB)"
237
241
  }, {
238
242
  textColor: "var(--ds-text-inverse, #FFFFFF)",
239
- backgroundColor: "var(--ds-background-accent-orange-bolder, #C25100)",
240
- svgBackgroundColor: "var(--ds-background-accent-orange-subtler, #FEDEC8)"
243
+ backgroundColor: "var(--ds-background-accent-orange-bolder, #BD5B00)",
244
+ svgBackgroundColor: "var(--ds-background-accent-orange-subtler, #FCE4A6)"
241
245
  }, {
242
246
  textColor: "var(--ds-text-inverse, #FFFFFF)",
243
247
  backgroundColor: "var(--ds-background-accent-lime-bolder, #5B7F24)",
244
248
  svgBackgroundColor: "var(--ds-background-accent-lime-subtler, #D3F1A7)"
245
249
  }, {
246
250
  textColor: "var(--ds-text-inverse, #FFFFFF)",
247
- backgroundColor: "var(--ds-background-accent-gray-bolder, #626F86)",
248
- svgBackgroundColor: "var(--ds-background-accent-gray-subtler, #DCDFE4)"
251
+ backgroundColor: "var(--ds-background-accent-gray-bolder, #6B6E76)",
252
+ svgBackgroundColor: "var(--ds-background-accent-gray-subtler, #DDDEE1)"
249
253
  }, {
250
- textColor: "var(--ds-text-accent-gray-bolder, #091E42)",
251
- backgroundColor: "var(--ds-background-accent-blue-subtle, #579DFF)",
252
- svgBackgroundColor: "var(--ds-background-accent-blue-subtlest, #E9F2FF)"
254
+ textColor: "var(--ds-text-accent-gray-bolder, #1E1F21)",
255
+ backgroundColor: "var(--ds-background-accent-blue-subtle, #669DF1)",
256
+ svgBackgroundColor: "var(--ds-background-accent-blue-subtlest, #E9F2FE)"
253
257
  }, {
254
- textColor: "var(--ds-text-accent-gray-bolder, #091E42)",
258
+ textColor: "var(--ds-text-accent-gray-bolder, #1E1F21)",
255
259
  backgroundColor: "var(--ds-background-accent-red-subtle, #F87168)",
256
260
  svgBackgroundColor: "var(--ds-background-accent-red-subtlest, #FFECEB)"
257
261
  }, {
258
- textColor: "var(--ds-text-accent-gray-bolder, #091E42)",
259
- backgroundColor: "var(--ds-background-accent-orange-subtle, #FEA362)",
260
- svgBackgroundColor: "var(--ds-background-accent-orange-subtlest, #FFF3EB)"
262
+ textColor: "var(--ds-text-accent-gray-bolder, #1E1F21)",
263
+ backgroundColor: "var(--ds-background-accent-orange-subtle, #FCA700)",
264
+ svgBackgroundColor: "var(--ds-background-accent-orange-subtlest, #FFF5DB)"
261
265
  }, {
262
- textColor: "var(--ds-text-accent-gray-bolder, #091E42)",
263
- backgroundColor: "var(--ds-background-accent-yellow-subtle, #F5CD47)",
264
- svgBackgroundColor: "var(--ds-background-accent-yellow-subtlest, #FFF7D6)"
266
+ textColor: "var(--ds-text-accent-gray-bolder, #1E1F21)",
267
+ backgroundColor: "var(--ds-background-accent-yellow-subtle, #EED12B)",
268
+ svgBackgroundColor: "var(--ds-background-accent-yellow-subtlest, #FEF7C8)"
265
269
  }, {
266
- textColor: "var(--ds-text-accent-gray-bolder, #091E42)",
270
+ textColor: "var(--ds-text-accent-gray-bolder, #1E1F21)",
267
271
  backgroundColor: "var(--ds-background-accent-green-subtle, #4BCE97)",
268
272
  svgBackgroundColor: "var(--ds-background-accent-green-subtlest, #DCFFF1)"
269
273
  }, {
270
- textColor: "var(--ds-text-accent-gray-bolder, #091E42)",
274
+ textColor: "var(--ds-text-accent-gray-bolder, #1E1F21)",
271
275
  backgroundColor: "var(--ds-background-accent-teal-subtle, #6CC3E0)",
272
276
  svgBackgroundColor: "var(--ds-background-accent-teal-subtlest, #E7F9FF)"
273
277
  }, {
274
- textColor: "var(--ds-text-accent-gray-bolder, #091E42)",
275
- backgroundColor: "var(--ds-background-accent-purple-subtle, #9F8FEF)",
276
- svgBackgroundColor: "var(--ds-background-accent-purple-subtlest, #F3F0FF)"
278
+ textColor: "var(--ds-text-accent-gray-bolder, #1E1F21)",
279
+ backgroundColor: "var(--ds-background-accent-purple-subtle, #C97CF4)",
280
+ svgBackgroundColor: "var(--ds-background-accent-purple-subtlest, #F8EEFE)"
277
281
  }, {
278
- textColor: "var(--ds-text-accent-gray-bolder, #091E42)",
282
+ textColor: "var(--ds-text-accent-gray-bolder, #1E1F21)",
279
283
  backgroundColor: "var(--ds-background-accent-magenta-subtle, #E774BB)",
280
284
  svgBackgroundColor: "var(--ds-background-accent-magenta-subtlest, #FFECF8)"
281
285
  }];
package/dist/esm/overflow-shadow/overflow-shadow.js CHANGED
@@ -11,5 +11,5 @@ export var overflowShadow = function overflowShadow(_ref) {
11
11
  var rightCoverWidthResolved = rightCoverWidth || width;
12
12
 
13
13
  // eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- needs manual remediation
14
- return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n/* shadow cover left */\n linear-gradient(\n to right,\n ", " ", ",\n transparent ", "\n ),\n/* shadow cover background left */\n linear-gradient(\n to right,\n ", " ", ",\n transparent ", "\n ),\n/* shadow cover right */\n linear-gradient(\n to left,\n ", " ", ",\n transparent ", "\n ),\n/* shadow cover background right */\n linear-gradient(\n to left,\n ", " ", ",\n transparent ", "\n ),\n/* overflow shadow right spread */\n linear-gradient(\n to left,\n ", " 0,\n ", " ", "\n ),\n /* overflow shadow right perimeter */\n linear-gradient(\n to left,\n ", " 0,\n ", " ", "\n ),\n /* overflow shadow left spread */\n linear-gradient(\n to right,\n ", " 0,\n ", " ", "\n ),\n /* overflow shadow left perimeter */\n linear-gradient(\n to right,\n ", " 0,\n ", " ", "\n )\n"])), "var(--ds-background-neutral, #091E420F)", leftCoverWidthResolved, leftCoverWidthResolved, "var(--ds-surface-raised, #FFFFFF)", leftCoverWidthResolved, leftCoverWidthResolved, "var(--ds-background-neutral, #091E420F)", rightCoverWidthResolved, rightCoverWidthResolved, "var(--ds-surface-raised, #FFFFFF)", rightCoverWidthResolved, rightCoverWidthResolved, "var(--ds-shadow-overflow-spread, #091e4229)", "var(--ds-UNSAFE-transparent, transparent)", width, "var(--ds-shadow-overflow-perimeter, #091e421f)", "var(--ds-UNSAFE-transparent, transparent)", width, "var(--ds-shadow-overflow-spread, #091e4229)", "var(--ds-UNSAFE-transparent, transparent)", width, "var(--ds-shadow-overflow-perimeter, #091e421f)", "var(--ds-UNSAFE-transparent, transparent)", width);
14
+ return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n/* shadow cover left */\n linear-gradient(\n to right,\n ", " ", ",\n transparent ", "\n ),\n/* shadow cover background left */\n linear-gradient(\n to right,\n ", " ", ",\n transparent ", "\n ),\n/* shadow cover right */\n linear-gradient(\n to left,\n ", " ", ",\n transparent ", "\n ),\n/* shadow cover background right */\n linear-gradient(\n to left,\n ", " ", ",\n transparent ", "\n ),\n/* overflow shadow right spread */\n linear-gradient(\n to left,\n ", " 0,\n ", " ", "\n ),\n /* overflow shadow right perimeter */\n linear-gradient(\n to left,\n ", " 0,\n ", " ", "\n ),\n /* overflow shadow left spread */\n linear-gradient(\n to right,\n ", " 0,\n ", " ", "\n ),\n /* overflow shadow left perimeter */\n linear-gradient(\n to right,\n ", " 0,\n ", " ", "\n )\n"])), "var(--ds-background-neutral, #0515240F)", leftCoverWidthResolved, leftCoverWidthResolved, "var(--ds-surface-raised, #FFFFFF)", leftCoverWidthResolved, leftCoverWidthResolved, "var(--ds-background-neutral, #0515240F)", rightCoverWidthResolved, rightCoverWidthResolved, "var(--ds-surface-raised, #FFFFFF)", rightCoverWidthResolved, rightCoverWidthResolved, "var(--ds-shadow-overflow-spread, #1E1F2129)", "var(--ds-UNSAFE-transparent, transparent)", width, "var(--ds-shadow-overflow-perimeter, #1E1F211f)", "var(--ds-UNSAFE-transparent, transparent)", width, "var(--ds-shadow-overflow-spread, #1E1F2129)", "var(--ds-UNSAFE-transparent, transparent)", width, "var(--ds-shadow-overflow-perimeter, #1E1F211f)", "var(--ds-UNSAFE-transparent, transparent)", width);
15
15
  };
package/dist/esm/scrollbar-styles.js CHANGED
@@ -1,4 +1,4 @@
1
1
  /* eslint-disable @atlaskit/editor/no-re-export */
2
2
  // Entry file in package.json
3
3
 
4
- export var scrollbarStyles = "\n -ms-overflow-style: -ms-autohiding-scrollbar;\n\n &::-webkit-scrollbar {\n overflow: hidden,\n }\n\n &::-webkit-scrollbar-corner {\n display: none;\n }\n\n &::-webkit-scrollbar-thumb {\n background-color: ".concat("var(--ds-background-neutral-subtle, #00000000)", ";\n }\n\n &:hover::-webkit-scrollbar-thumb {\n background-color: ", "var(--ds-background-neutral-bold, #44546F)", ";\n border-radius: 8px;\n }\n\n &::-webkit-scrollbar-thumb:hover {\n background-color: ", "var(--ds-background-neutral-bold-hovered, #2C3E5D)", ";\n }\n");
4
+ export var scrollbarStyles = "\n -ms-overflow-style: -ms-autohiding-scrollbar;\n\n &::-webkit-scrollbar {\n overflow: hidden,\n }\n\n &::-webkit-scrollbar-corner {\n display: none;\n }\n\n &::-webkit-scrollbar-thumb {\n background-color: ".concat("var(--ds-background-neutral-subtle, #00000000)", ";\n }\n\n &:hover::-webkit-scrollbar-thumb {\n background-color: ", "var(--ds-background-neutral-bold, #292A2E)", ";\n border-radius: 8px;\n }\n\n &::-webkit-scrollbar-thumb:hover {\n background-color: ", "var(--ds-background-neutral-bold-hovered, #3B3D42)", ";\n }\n");
package/dist/esm/selection/utils.js CHANGED
@@ -24,7 +24,7 @@ var getSelectionStyle = function getSelectionStyle(style) {
24
24
  case SelectionStyle.BoxShadow:
25
25
  return "\n box-shadow: ".concat(akEditorSelectedBoxShadow, ";\n border-color: transparent;\n ");
26
26
  case SelectionStyle.Background:
27
- return "background-color: ".concat("var(--ds-background-selected, #E9F2FF)", ";");
27
+ return "background-color: ".concat("var(--ds-background-selected, #E9F2FE)", ";");
28
28
  case SelectionStyle.Blanket:
29
29
  return "\n position: relative;\n\n // Fixes ED-9263, where emoji or inline card in panel makes selection go outside the panel\n // in Safari. Looks like it's caused by user-select: all in the emoji element\n -webkit-user-select: text;\n\n ::before {\n position: absolute;\n content: '';\n left: 0;\n right: 0;\n top: 0;\n bottom: 0;\n width: 100%;\n pointer-events: none;\n z-index: ".concat(akEditorSmallZIndex, ";\n background-color: ", "var(--ds-blanket-selected, #388BFF14)", "\n }");
30
30
  default:
package/dist/esm/shortcut/shortcut.js CHANGED
@@ -9,4 +9,4 @@ import { akEditorMobileMaxWidth, relativeFontSizeToBase16 } from '../consts';
9
9
  * @deprecated use `import { Shortcut } from '@atlaskit/editor-common/ui';` instead
10
10
  */
11
11
  // eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
12
- export var shortcutStyle = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\tbackground-color: ", ";\n\tcolor: ", ";\n\tborder-radius: ", ";\n\tpadding: ", ";\n\tline-height: 12px;\n\tfont-size: ", ";\n\talign-self: flex-end;\n\t@media (max-width: ", "px) {\n\t\tdisplay: none;\n\t}\n"])), "var(--ds-background-neutral, #091E420F)", "var(--ds-text-subtle, #44546F)", "var(--ds-radius-small, 3px)", "var(--ds-space-050, 4px)", relativeFontSizeToBase16(11.67), akEditorMobileMaxWidth);
12
+ export var shortcutStyle = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\tbackground-color: ", ";\n\tcolor: ", ";\n\tborder-radius: ", ";\n\tpadding: ", ";\n\tline-height: 12px;\n\tfont-size: ", ";\n\talign-self: flex-end;\n\t@media (max-width: ", "px) {\n\t\tdisplay: none;\n\t}\n"])), "var(--ds-background-neutral, #0515240F)", "var(--ds-text-subtle, #505258)", "var(--ds-radius-small, 3px)", "var(--ds-space-050, 4px)", relativeFontSizeToBase16(11.67), akEditorMobileMaxWidth);
package/dist/types/consts/consts.d.ts CHANGED
@@ -111,6 +111,10 @@ export declare const relativeFontSizeToBase16: (px: number | string) => string;
111
111
  */
112
112
  export declare const relativeSizeToBaseFontSize: (value: number) => string;
113
113
  export declare const VIEWPORT_SIZES: {
114
+ a4KMonitor: {
115
+ width: number;
116
+ height: number;
117
+ };
114
118
  laptopHiDPI: {
115
119
  width: number;
116
120
  height: number;
package/dist/types-ts4.5/consts/consts.d.ts CHANGED
@@ -111,6 +111,10 @@ export declare const relativeFontSizeToBase16: (px: number | string) => string;
111
111
  */
112
112
  export declare const relativeSizeToBaseFontSize: (value: number) => string;
113
113
  export declare const VIEWPORT_SIZES: {
114
+ a4KMonitor: {
115
+ width: number;
116
+ height: number;
117
+ };
114
118
  laptopHiDPI: {
115
119
  width: number;
116
120
  height: number;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-shared-styles",
3
- "version": "3.8.1",
3
+ "version": "3.9.0",
4
4
  "description": "Style values used in the editor/renderer",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -37,7 +37,7 @@
37
37
  },
38
38
  "dependencies": {
39
39
  "@atlaskit/platform-feature-flags": "^1.1.0",
40
- "@atlaskit/tmp-editor-statsig": "^13.32.0",
40
+ "@atlaskit/tmp-editor-statsig": "^13.35.0",
41
41
  "@atlaskit/tokens": "^8.0.0",
42
42
  "@babel/runtime": "^7.0.0",
43
43
  "@emotion/react": "^11.7.1"