@atlaskit/renderer 107.3.0 → 107.3.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +7 -0
- package/dist/cjs/ui/Renderer/index.js +10 -4
- package/dist/cjs/ui/Renderer/style.js +9 -3
- package/dist/cjs/version.json +1 -1
- package/dist/es2019/ui/Renderer/index.js +10 -4
- package/dist/es2019/ui/Renderer/style.js +25 -4
- package/dist/es2019/version.json +1 -1
- package/dist/esm/ui/Renderer/index.js +10 -4
- package/dist/esm/ui/Renderer/style.js +9 -3
- package/dist/esm/version.json +1 -1
- package/dist/types/ui/Renderer/style.d.ts +1 -0
- package/package.json +2 -2
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,12 @@
|
|
|
1
1
|
# @atlaskit/renderer
|
|
2
2
|
|
|
3
|
+
## 107.3.1
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [`9f9b4b1cf60`](https://bitbucket.org/atlassian/atlassian-frontend/commits/9f9b4b1cf60) - [ux] [HOT-103036] Fix table width styling when broken out with fragment mark
|
|
8
|
+
- Updated dependencies
|
|
9
|
+
|
|
3
10
|
## 107.3.0
|
|
4
11
|
|
|
5
12
|
### Minor Changes
|
|
@@ -55,7 +55,7 @@ exports.NORMAL_SEVERITY_THRESHOLD = NORMAL_SEVERITY_THRESHOLD;
|
|
|
55
55
|
var DEGRADED_SEVERITY_THRESHOLD = 3000;
|
|
56
56
|
exports.DEGRADED_SEVERITY_THRESHOLD = DEGRADED_SEVERITY_THRESHOLD;
|
|
57
57
|
var packageName = "@atlaskit/renderer";
|
|
58
|
-
var packageVersion = "107.3.
|
|
58
|
+
var packageVersion = "107.3.1";
|
|
59
59
|
var Renderer = /*#__PURE__*/function (_PureComponent) {
|
|
60
60
|
(0, _inherits2.default)(Renderer, _PureComponent);
|
|
61
61
|
var _super = _createSuper(Renderer);
|
|
@@ -297,6 +297,7 @@ var Renderer = /*#__PURE__*/function (_PureComponent) {
|
|
|
297
297
|
allowCopyToClipboard = _this$props.allowCopyToClipboard,
|
|
298
298
|
allowWrapCodeBlock = _this$props.allowWrapCodeBlock,
|
|
299
299
|
allowCustomPanels = _this$props.allowCustomPanels;
|
|
300
|
+
var featureFlags = this.featureFlags(this.props.featureFlags);
|
|
300
301
|
var allowNestedHeaderLinks = (0, _links.isNestedHeaderLinksEnabled)(allowHeadingAnchorLinks);
|
|
301
302
|
/**
|
|
302
303
|
* Handle clicks inside renderer. If the click isn't on media, in the media picker, or on a
|
|
@@ -344,7 +345,7 @@ var Renderer = /*#__PURE__*/function (_PureComponent) {
|
|
|
344
345
|
}
|
|
345
346
|
};
|
|
346
347
|
try {
|
|
347
|
-
var _this$featureFlags2, _this$featureFlags2$f, _this$featureFlags2$f2;
|
|
348
|
+
var _featureFlags$feature, _this$featureFlags2, _this$featureFlags2$f, _this$featureFlags2$f2;
|
|
348
349
|
var schema = this.getSchema(this.props.schema, this.props.adfStage);
|
|
349
350
|
var _renderDocument = (0, _.renderDocument)(adfDocument, this.serializer, schema, adfStage, this.props.useSpecBasedValidator, this.id, this.fireAnalyticsEvent, this.props.unsupportedContentLevelsTracking, this.props.appearance),
|
|
350
351
|
result = _renderDocument.result,
|
|
@@ -371,6 +372,7 @@ var Renderer = /*#__PURE__*/function (_PureComponent) {
|
|
|
371
372
|
allowWrapCodeBlock: allowWrapCodeBlock,
|
|
372
373
|
allowCustomPanels: allowCustomPanels,
|
|
373
374
|
allowPlaceholderText: allowPlaceholderText,
|
|
375
|
+
useFragmentMarkBreakoutWidthStylingFix: (_featureFlags$feature = featureFlags.featureFlags.useFragmentMarkBreakoutWidthStylingFix) !== null && _featureFlags$feature !== void 0 ? _featureFlags$feature : true,
|
|
374
376
|
innerRef: this.editorRef,
|
|
375
377
|
onClick: handleWrapperOnClick,
|
|
376
378
|
onMouseDown: this.onMouseDownEditView
|
|
@@ -393,6 +395,7 @@ var Renderer = /*#__PURE__*/function (_PureComponent) {
|
|
|
393
395
|
});
|
|
394
396
|
return (0, _react2.jsx)(_react.Fragment, null, reRenderTracking, rendererResult);
|
|
395
397
|
} catch (e) {
|
|
398
|
+
var _featureFlags$feature2;
|
|
396
399
|
if (onError) {
|
|
397
400
|
onError(e);
|
|
398
401
|
}
|
|
@@ -403,6 +406,7 @@ var Renderer = /*#__PURE__*/function (_PureComponent) {
|
|
|
403
406
|
allowPlaceholderText: allowPlaceholderText,
|
|
404
407
|
allowColumnSorting: allowColumnSorting,
|
|
405
408
|
allowNestedHeaderLinks: allowNestedHeaderLinks,
|
|
409
|
+
useFragmentMarkBreakoutWidthStylingFix: (_featureFlags$feature2 = featureFlags.featureFlags.useFragmentMarkBreakoutWidthStylingFix) !== null && _featureFlags$feature2 !== void 0 ? _featureFlags$feature2 : true,
|
|
406
410
|
onClick: handleWrapperOnClick
|
|
407
411
|
}, (0, _react2.jsx)(_ui.UnsupportedBlock, null));
|
|
408
412
|
}
|
|
@@ -455,7 +459,8 @@ var RendererWrapper = /*#__PURE__*/_react.default.memo(function (props) {
|
|
|
455
459
|
appearance = props.appearance,
|
|
456
460
|
children = props.children,
|
|
457
461
|
onClick = props.onClick,
|
|
458
|
-
onMouseDown = props.onMouseDown
|
|
462
|
+
onMouseDown = props.onMouseDown,
|
|
463
|
+
useFragmentMarkBreakoutWidthStylingFix = props.useFragmentMarkBreakoutWidthStylingFix;
|
|
459
464
|
return (0, _react2.jsx)(_ui.WidthProvider, {
|
|
460
465
|
className: "ak-renderer-wrapper"
|
|
461
466
|
}, (0, _react2.jsx)(_ui.BaseTheme, {
|
|
@@ -467,7 +472,8 @@ var RendererWrapper = /*#__PURE__*/_react.default.memo(function (props) {
|
|
|
467
472
|
css: (0, _style.rendererStyles)({
|
|
468
473
|
appearance: appearance,
|
|
469
474
|
allowNestedHeaderLinks: allowNestedHeaderLinks,
|
|
470
|
-
allowColumnSorting: !!allowColumnSorting
|
|
475
|
+
allowColumnSorting: !!allowColumnSorting,
|
|
476
|
+
useFragmentMarkBreakoutWidthStylingFix: useFragmentMarkBreakoutWidthStylingFix
|
|
471
477
|
})
|
|
472
478
|
}, children)));
|
|
473
479
|
});
|
|
@@ -19,7 +19,7 @@ var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
|
|
|
19
19
|
var _consts = require("../../consts");
|
|
20
20
|
var _headingAnchor = require("../../react/nodes/heading-anchor");
|
|
21
21
|
var _lightWeightCodeBlock = require("../../react/nodes/codeBlock/components/lightWeightCodeBlock");
|
|
22
|
-
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
|
|
22
|
+
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8;
|
|
23
23
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
24
24
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
25
25
|
var FullPagePadding = 32;
|
|
@@ -85,13 +85,19 @@ var fullWidthStyles = function fullWidthStyles(_ref5) {
|
|
|
85
85
|
}
|
|
86
86
|
return (0, _react.css)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n max-width: ", "px;\n margin: 0 auto;\n\n .fabric-editor-breakout-mark,\n .pm-table-container,\n .ak-renderer-extension {\n width: 100% !important;\n }\n "])), _editorSharedStyles.akEditorFullWidthLayoutWidth);
|
|
87
87
|
};
|
|
88
|
+
var breakoutWidthStyle = function breakoutWidthStyle(useFragmentMarkBreakoutWidthStylingFix) {
|
|
89
|
+
if (useFragmentMarkBreakoutWidthStylingFix) {
|
|
90
|
+
return (0, _react.css)(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n *:not([data-mark-type='fragment'])\n .", " {\n width: 100% !important;\n left: 0 !important;\n }\n\n [data-mark-type='fragment']\n *\n .", " {\n width: 100% !important;\n left: 0 !important;\n }\n "])), _styles.TableSharedCssClassName.TABLE_CONTAINER, _styles.TableSharedCssClassName.TABLE_CONTAINER);
|
|
91
|
+
}
|
|
92
|
+
return (0, _react.css)(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n * .", " {\n width: 100% !important;\n left: 0 !important;\n }\n "])), _styles.TableSharedCssClassName.TABLE_CONTAINER);
|
|
93
|
+
};
|
|
88
94
|
var rendererStyles = function rendererStyles(wrapperProps) {
|
|
89
95
|
return function (theme) {
|
|
90
96
|
// This is required to be compatible with styled-components prop structure.
|
|
91
97
|
var themeProps = {
|
|
92
98
|
theme: theme
|
|
93
99
|
};
|
|
94
|
-
return (0, _react.css)(
|
|
100
|
+
return (0, _react.css)(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n font-size: ", "px;\n line-height: 1.5rem;\n color: ", ";\n\n .", "::after {\n // we add a clearfix after ak-renderer-document in order to\n // contain internal floats (such as media images that are \"wrap-left\")\n // to just the renderer (and not spill outside of it)\n content: '';\n visibility: hidden;\n display: block;\n height: 0;\n clear: both;\n }\n\n ", "\n ", "\n\n & h1 {\n ", "\n }\n\n & h2 {\n ", "\n }\n\n & h3 {\n ", "\n }\n\n & h4 {\n ", "\n }\n\n & h5 {\n ", "\n }\n\n & h6 {\n ", "\n }\n\n & span.akActionMark {\n color: ", ";\n text-decoration: none;\n\n &:hover {\n color: ", ";\n text-decoration: underline;\n }\n\n &:active {\n color: ", ";\n }\n }\n\n & span.akActionMark {\n cursor: pointer;\n }\n\n & span[data-placeholder] {\n color: ", ";\n }\n\n ", ";\n ", ";\n ", ";\n ", ";\n ", ";\n ", ";\n ", ";\n ", ";\n ", ";\n ", ";\n ", ";\n ", ";\n ", ";\n ", "\n\n & .UnknownBlock {\n font-family: ", ";\n font-size: ", ";\n font-weight: 400;\n white-space: pre-wrap;\n word-wrap: break-word;\n }\n\n & span.date-node {\n background: ", ";\n border-radius: ", "px;\n color: ", ";\n padding: 2px 4px;\n margin: 0 1px;\n transition: background 0.3s;\n }\n\n & span.date-node-highlighted {\n background: ", ";\n color: ", ";\n }\n\n & .renderer-image {\n max-width: 100%;\n display: block;\n margin: ", "px 0;\n }\n\n .", ".rich-media-wrapped\n + .", ":not(.rich-media-wrapped) {\n clear: both;\n }\n\n & .code-block,\n & blockquote,\n & hr,\n & > div > div:not(.rich-media-wrapped),\n .", ".rich-media-wrapped\n + .rich-media-wrapped\n + *:not(.rich-media-wrapped),\n .", ".rich-media-wrapped + div:not(.rich-media-wrapped),\n .", ".image-align-start,\n .", ".image-center,\n .", ".image-align-end {\n clear: both;\n }\n\n & .rich-media-wrapped {\n & + h1,\n & + h2,\n & + h3,\n & + h4,\n & + h5,\n & + h6 {\n margin-top: 8px;\n }\n }\n\n ", "\n /* plugin styles */\n ", " &\n div[class^='image-wrap-'] + div[class^='image-wrap-'] {\n margin-left: 0;\n margin-right: 0;\n }\n\n /* Breakout for tables and extensions */\n .", " > {\n ", "\n\n * .", " {\n overflow-x: auto;\n }\n\n & .", ":first-child {\n margin-top: 0;\n }\n }\n\n .", " {\n .", " {\n margin-top: ", ";\n }\n\n .", " {\n margin-left: 50%;\n transform: translateX(-50%);\n }\n\n .", " {\n overflow-x: auto;\n }\n\n .", "\n .", " {\n display: flex;\n }\n }\n\n ", "\n\n .", " .", " {\n z-index: 0;\n transition: all 0.1s linear;\n display: flex; /* needed to avoid position: fixed jumpiness in Chrome */\n\n /** Shadow overrides */\n &.", "::after,\n &.", "::before {\n top: ", "px;\n height: calc(100% - ", "px);\n z-index: ", ";\n }\n\n &\n .", ",\n &\n .", " {\n height: calc(100% - ", "px);\n }\n\n /**\n * A hack for making all the <th /> heights equal in case some have shorter\n * content than others.\n *\n * This is done to make sort buttons fill entire <th />.\n */\n table {\n height: 1px; /* will be ignored */\n ", ";\n margin-left: 0;\n margin-right: 0;\n }\n\n table tr:first-of-type {\n height: 100%;\n\n td,\n th {\n position: relative;\n }\n }\n\n table[data-number-column='true'] {\n .", " {\n background-color: ", ";\n border-right: 1px solid\n ", ";\n width: ", "px;\n text-align: center;\n color: ", ";\n font-size: ", ";\n }\n\n .fixed .", " {\n border-right: 0px none;\n }\n }\n }\n\n tr[data-header-row].fixed {\n position: fixed !important;\n display: flex;\n overflow: hidden;\n z-index: ", ";\n\n border-right: 1px solid\n ", ";\n border-bottom: 1px solid\n ", ";\n\n /* this is to compensate for the table border */\n transform: translateX(-1px);\n }\n\n .sticky > th {\n z-index: ", ";\n position: sticky !important;\n top: 0;\n }\n\n /* Make the number column header sticky */\n .sticky > td {\n position: sticky !important;\n top: 0;\n }\n\n /* add border for position: sticky\n and work around background-clip: padding-box\n bug for FF causing box-shadow bug in Chrome */\n .sticky th,\n .sticky td {\n box-shadow: 0px 1px\n ", ",\n 0px -0.5px ", ",\n inset -1px 0px ", ",\n 0px -1px ", ";\n }\n\n /* this will remove jumpiness caused in Chrome for sticky headers */\n .fixed + tr {\n min-height: 0px;\n }\n\n /*\n * We wrap CodeBlock in a grid to prevent it from overflowing the container of the renderer.\n * See ED-4159.\n */\n & .code-block {\n max-width: 100%;\n /* -ms- properties are necessary until MS supports the latest version of the grid spec */\n /* stylelint-disable value-no-vendor-prefix, declaration-block-no-duplicate-properties */\n display: -ms-grid;\n display: grid;\n -ms-grid-columns: auto 1fr;\n /* stylelint-enable */\n\n grid-template-columns: minmax(0, 1fr);\n position: relative;\n border-radius: ", "px;\n\n /*\n * The overall renderer has word-wrap: break; which causes issues with\n * code block line numbers in Safari / iOS.\n */\n word-wrap: normal;\n\n & > span {\n /* stylelint-disable value-no-vendor-prefix */\n -ms-grid-row: 1;\n -ms-grid-column: 2;\n /* stylelint-enable */\n grid-column: 1;\n }\n }\n\n & .MediaGroup,\n & .code-block {\n margin-top: ", ";\n\n &:first-child {\n margin-top: 0;\n }\n }\n\n ", "\n\n ", ";\n & [data-layout-section] {\n margin-top: ", "px;\n & > div + div {\n margin-left: ", "px;\n }\n\n @media screen and (max-width: ", "px) {\n & > div + div {\n margin-left: 0;\n }\n }\n\n & .MediaGroup,\n & .code-block {\n margin-top: ", ";\n\n &:first-child {\n margin-top: 0;\n }\n }\n }\n\n & li {\n > .code-block {\n margin: ", " 0 0 0;\n }\n > .code-block:first-child {\n margin-top: 0;\n }\n\n > div:last-of-type.code-block {\n margin-bottom: ", ";\n }\n }\n\n & :not([data-node-type='decisionList']) > li {\n ", "\n }\n "])), (0, _editorSharedStyles.editorFontSize)(themeProps), (0, _components.themed)({
|
|
95
101
|
light: "var(--ds-text, ".concat(colors.N800, ")"),
|
|
96
102
|
dark: "var(--ds-text, #B8C7E0)"
|
|
97
103
|
})(themeProps), _consts.RendererCssClassName.DOCUMENT, fullPageStyles(wrapperProps, themeProps), fullWidthStyles(wrapperProps), headingAnchorStyle('h1'), headingAnchorStyle('h2'), headingAnchorStyle('h3'), headingAnchorStyle('h4'), headingAnchorStyle('h5'), headingAnchorStyle('h6'), "var(--ds-link, ".concat(colors.B400, ")"), "var(--ds-link, ".concat(colors.B300, ")"), "var(--ds-link-pressed, ".concat(colors.B500, ")"), colors.placeholderText(themeProps), _styles.whitespaceSharedStyles, _styles.blockquoteSharedStyles, (0, _styles.headingsSharedStyles)(themeProps), (0, _styles.ruleSharedStyles)(themeProps), _styles.paragraphSharedStyles, _styles.listsSharedStyles, _styles.indentationSharedStyles, _styles.blockMarksSharedStyles, (0, _styles.codeMarkSharedStyles)(themeProps), _styles.shadowSharedStyle, _styles.dateSharedStyle, _styles.textColorStyles, _styles.tasksAndDecisionsStyles, _styles.smartCardSharedStyles, (0, _constants.fontFamily)(), (0, _editorSharedStyles.relativeFontSizeToBase16)((0, _constants.fontSize)()), (0, _components.themed)({
|
|
@@ -100,7 +106,7 @@ var rendererStyles = function rendererStyles(wrapperProps) {
|
|
|
100
106
|
})(themeProps), (0, _constants.borderRadius)(), (0, _components.themed)({
|
|
101
107
|
light: "var(--ds-text, ".concat(colors.N800, ")"),
|
|
102
108
|
dark: "var(--ds-text, ".concat(colors.DN600, ")")
|
|
103
|
-
})(themeProps), "var(--ds-background-danger, ".concat(colors.R50, ")"), "var(--ds-text-danger, ".concat(colors.R500, ")"), (0, _constants.gridSize)() * 3, _styles.richMediaClassName, _styles.richMediaClassName, _styles.richMediaClassName, _styles.richMediaClassName, _styles.richMediaClassName, _styles.richMediaClassName, _styles.richMediaClassName, alignedHeadingAnchorStyle(wrapperProps), _styles.mediaSingleSharedStyle, _consts.RendererCssClassName.DOCUMENT,
|
|
109
|
+
})(themeProps), "var(--ds-background-danger, ".concat(colors.R50, ")"), "var(--ds-text-danger, ".concat(colors.R500, ")"), (0, _constants.gridSize)() * 3, _styles.richMediaClassName, _styles.richMediaClassName, _styles.richMediaClassName, _styles.richMediaClassName, _styles.richMediaClassName, _styles.richMediaClassName, _styles.richMediaClassName, alignedHeadingAnchorStyle(wrapperProps), _styles.mediaSingleSharedStyle, _consts.RendererCssClassName.DOCUMENT, breakoutWidthStyle(wrapperProps.useFragmentMarkBreakoutWidthStylingFix), _consts.RendererCssClassName.EXTENSION_OVERFLOW_CONTAINER, _consts.RendererCssClassName.EXTENSION, _consts.RendererCssClassName.DOCUMENT, _consts.RendererCssClassName.EXTENSION, _editorSharedStyles.blockNodesVerticalMargin, _consts.RendererCssClassName.EXTENSION_CENTER_ALIGN, _styles.TableSharedCssClassName.TABLE_NODE_WRAPPER, _ui.shadowObserverClassNames.SHADOW_CONTAINER, _styles.TableSharedCssClassName.TABLE_NODE_WRAPPER, (0, _styles.tableSharedStyle)(themeProps), _consts.RendererCssClassName.DOCUMENT, _styles.TableSharedCssClassName.TABLE_CONTAINER, _ui.shadowClassNames.RIGHT_SHADOW, _ui.shadowClassNames.LEFT_SHADOW, _styles.tableMarginTop - 1, _styles.tableMarginTop, _editorSharedStyles.akEditorStickyHeaderZIndex, _ui.shadowObserverClassNames.SENTINEL_LEFT, _ui.shadowObserverClassNames.SENTINEL_RIGHT, _styles.tableMarginTop, tableSortableColumnStyle(wrapperProps), _consts.RendererCssClassName.NUMBER_COLUMN, (0, _components.themed)({
|
|
104
110
|
light: "var(--ds-background-neutral, ".concat(_editorSharedStyles.akEditorTableToolbar, ")"),
|
|
105
111
|
dark: "var(--ds-background-neutral, ".concat(_editorSharedStyles.akEditorTableToolbarDark, ")")
|
|
106
112
|
})(themeProps), (0, _components.themed)({
|
package/dist/cjs/version.json
CHANGED
|
@@ -35,7 +35,7 @@ import { RenderTracking } from '../../react/utils/performance/RenderTracking';
|
|
|
35
35
|
export const NORMAL_SEVERITY_THRESHOLD = 2000;
|
|
36
36
|
export const DEGRADED_SEVERITY_THRESHOLD = 3000;
|
|
37
37
|
const packageName = "@atlaskit/renderer";
|
|
38
|
-
const packageVersion = "107.3.
|
|
38
|
+
const packageVersion = "107.3.1";
|
|
39
39
|
export class Renderer extends PureComponent {
|
|
40
40
|
/**
|
|
41
41
|
* This is used in measuring the Renderer Mount time and is then
|
|
@@ -273,6 +273,7 @@ export class Renderer extends PureComponent {
|
|
|
273
273
|
allowWrapCodeBlock,
|
|
274
274
|
allowCustomPanels
|
|
275
275
|
} = this.props;
|
|
276
|
+
const featureFlags = this.featureFlags(this.props.featureFlags);
|
|
276
277
|
const allowNestedHeaderLinks = isNestedHeaderLinksEnabled(allowHeadingAnchorLinks);
|
|
277
278
|
/**
|
|
278
279
|
* Handle clicks inside renderer. If the click isn't on media, in the media picker, or on a
|
|
@@ -320,7 +321,7 @@ export class Renderer extends PureComponent {
|
|
|
320
321
|
}
|
|
321
322
|
};
|
|
322
323
|
try {
|
|
323
|
-
var _this$featureFlags, _this$featureFlags$fe, _this$featureFlags$fe2;
|
|
324
|
+
var _featureFlags$feature, _this$featureFlags, _this$featureFlags$fe, _this$featureFlags$fe2;
|
|
324
325
|
const schema = this.getSchema(this.props.schema, this.props.adfStage);
|
|
325
326
|
const {
|
|
326
327
|
result,
|
|
@@ -346,6 +347,7 @@ export class Renderer extends PureComponent {
|
|
|
346
347
|
allowWrapCodeBlock: allowWrapCodeBlock,
|
|
347
348
|
allowCustomPanels: allowCustomPanels,
|
|
348
349
|
allowPlaceholderText: allowPlaceholderText,
|
|
350
|
+
useFragmentMarkBreakoutWidthStylingFix: (_featureFlags$feature = featureFlags.featureFlags.useFragmentMarkBreakoutWidthStylingFix) !== null && _featureFlags$feature !== void 0 ? _featureFlags$feature : true,
|
|
349
351
|
innerRef: this.editorRef,
|
|
350
352
|
onClick: handleWrapperOnClick,
|
|
351
353
|
onMouseDown: this.onMouseDownEditView
|
|
@@ -368,6 +370,7 @@ export class Renderer extends PureComponent {
|
|
|
368
370
|
});
|
|
369
371
|
return jsx(Fragment, null, reRenderTracking, rendererResult);
|
|
370
372
|
} catch (e) {
|
|
373
|
+
var _featureFlags$feature2;
|
|
371
374
|
if (onError) {
|
|
372
375
|
onError(e);
|
|
373
376
|
}
|
|
@@ -378,6 +381,7 @@ export class Renderer extends PureComponent {
|
|
|
378
381
|
allowPlaceholderText: allowPlaceholderText,
|
|
379
382
|
allowColumnSorting: allowColumnSorting,
|
|
380
383
|
allowNestedHeaderLinks: allowNestedHeaderLinks,
|
|
384
|
+
useFragmentMarkBreakoutWidthStylingFix: (_featureFlags$feature2 = featureFlags.featureFlags.useFragmentMarkBreakoutWidthStylingFix) !== null && _featureFlags$feature2 !== void 0 ? _featureFlags$feature2 : true,
|
|
381
385
|
onClick: handleWrapperOnClick
|
|
382
386
|
}, jsx(UnsupportedBlock, null));
|
|
383
387
|
}
|
|
@@ -426,7 +430,8 @@ const RendererWrapper = /*#__PURE__*/React.memo(props => {
|
|
|
426
430
|
appearance,
|
|
427
431
|
children,
|
|
428
432
|
onClick,
|
|
429
|
-
onMouseDown
|
|
433
|
+
onMouseDown,
|
|
434
|
+
useFragmentMarkBreakoutWidthStylingFix
|
|
430
435
|
} = props;
|
|
431
436
|
return jsx(WidthProvider, {
|
|
432
437
|
className: "ak-renderer-wrapper"
|
|
@@ -439,7 +444,8 @@ const RendererWrapper = /*#__PURE__*/React.memo(props => {
|
|
|
439
444
|
css: rendererStyles({
|
|
440
445
|
appearance,
|
|
441
446
|
allowNestedHeaderLinks,
|
|
442
|
-
allowColumnSorting: !!allowColumnSorting
|
|
447
|
+
allowColumnSorting: !!allowColumnSorting,
|
|
448
|
+
useFragmentMarkBreakoutWidthStylingFix
|
|
443
449
|
})
|
|
444
450
|
}, children)));
|
|
445
451
|
});
|
|
@@ -273,6 +273,30 @@ const fullWidthStyles = ({
|
|
|
273
273
|
}
|
|
274
274
|
`;
|
|
275
275
|
};
|
|
276
|
+
const breakoutWidthStyle = useFragmentMarkBreakoutWidthStylingFix => {
|
|
277
|
+
if (useFragmentMarkBreakoutWidthStylingFix) {
|
|
278
|
+
return css`
|
|
279
|
+
*:not([data-mark-type='fragment'])
|
|
280
|
+
.${TableSharedCssClassName.TABLE_CONTAINER} {
|
|
281
|
+
width: 100% !important;
|
|
282
|
+
left: 0 !important;
|
|
283
|
+
}
|
|
284
|
+
|
|
285
|
+
[data-mark-type='fragment']
|
|
286
|
+
*
|
|
287
|
+
.${TableSharedCssClassName.TABLE_CONTAINER} {
|
|
288
|
+
width: 100% !important;
|
|
289
|
+
left: 0 !important;
|
|
290
|
+
}
|
|
291
|
+
`;
|
|
292
|
+
}
|
|
293
|
+
return css`
|
|
294
|
+
* .${TableSharedCssClassName.TABLE_CONTAINER} {
|
|
295
|
+
width: 100% !important;
|
|
296
|
+
left: 0 !important;
|
|
297
|
+
}
|
|
298
|
+
`;
|
|
299
|
+
};
|
|
276
300
|
export const rendererStyles = wrapperProps => theme => {
|
|
277
301
|
// This is required to be compatible with styled-components prop structure.
|
|
278
302
|
const themeProps = {
|
|
@@ -435,10 +459,7 @@ export const rendererStyles = wrapperProps => theme => {
|
|
|
435
459
|
|
|
436
460
|
/* Breakout for tables and extensions */
|
|
437
461
|
.${RendererCssClassName.DOCUMENT} > {
|
|
438
|
-
|
|
439
|
-
width: 100% !important;
|
|
440
|
-
left: 0 !important;
|
|
441
|
-
}
|
|
462
|
+
${breakoutWidthStyle(wrapperProps.useFragmentMarkBreakoutWidthStylingFix)}
|
|
442
463
|
|
|
443
464
|
* .${RendererCssClassName.EXTENSION_OVERFLOW_CONTAINER} {
|
|
444
465
|
overflow-x: auto;
|
package/dist/es2019/version.json
CHANGED
|
@@ -45,7 +45,7 @@ import { RenderTracking } from '../../react/utils/performance/RenderTracking';
|
|
|
45
45
|
export var NORMAL_SEVERITY_THRESHOLD = 2000;
|
|
46
46
|
export var DEGRADED_SEVERITY_THRESHOLD = 3000;
|
|
47
47
|
var packageName = "@atlaskit/renderer";
|
|
48
|
-
var packageVersion = "107.3.
|
|
48
|
+
var packageVersion = "107.3.1";
|
|
49
49
|
export var Renderer = /*#__PURE__*/function (_PureComponent) {
|
|
50
50
|
_inherits(Renderer, _PureComponent);
|
|
51
51
|
var _super = _createSuper(Renderer);
|
|
@@ -287,6 +287,7 @@ export var Renderer = /*#__PURE__*/function (_PureComponent) {
|
|
|
287
287
|
allowCopyToClipboard = _this$props.allowCopyToClipboard,
|
|
288
288
|
allowWrapCodeBlock = _this$props.allowWrapCodeBlock,
|
|
289
289
|
allowCustomPanels = _this$props.allowCustomPanels;
|
|
290
|
+
var featureFlags = this.featureFlags(this.props.featureFlags);
|
|
290
291
|
var allowNestedHeaderLinks = isNestedHeaderLinksEnabled(allowHeadingAnchorLinks);
|
|
291
292
|
/**
|
|
292
293
|
* Handle clicks inside renderer. If the click isn't on media, in the media picker, or on a
|
|
@@ -334,7 +335,7 @@ export var Renderer = /*#__PURE__*/function (_PureComponent) {
|
|
|
334
335
|
}
|
|
335
336
|
};
|
|
336
337
|
try {
|
|
337
|
-
var _this$featureFlags2, _this$featureFlags2$f, _this$featureFlags2$f2;
|
|
338
|
+
var _featureFlags$feature, _this$featureFlags2, _this$featureFlags2$f, _this$featureFlags2$f2;
|
|
338
339
|
var schema = this.getSchema(this.props.schema, this.props.adfStage);
|
|
339
340
|
var _renderDocument = renderDocument(adfDocument, this.serializer, schema, adfStage, this.props.useSpecBasedValidator, this.id, this.fireAnalyticsEvent, this.props.unsupportedContentLevelsTracking, this.props.appearance),
|
|
340
341
|
result = _renderDocument.result,
|
|
@@ -361,6 +362,7 @@ export var Renderer = /*#__PURE__*/function (_PureComponent) {
|
|
|
361
362
|
allowWrapCodeBlock: allowWrapCodeBlock,
|
|
362
363
|
allowCustomPanels: allowCustomPanels,
|
|
363
364
|
allowPlaceholderText: allowPlaceholderText,
|
|
365
|
+
useFragmentMarkBreakoutWidthStylingFix: (_featureFlags$feature = featureFlags.featureFlags.useFragmentMarkBreakoutWidthStylingFix) !== null && _featureFlags$feature !== void 0 ? _featureFlags$feature : true,
|
|
364
366
|
innerRef: this.editorRef,
|
|
365
367
|
onClick: handleWrapperOnClick,
|
|
366
368
|
onMouseDown: this.onMouseDownEditView
|
|
@@ -383,6 +385,7 @@ export var Renderer = /*#__PURE__*/function (_PureComponent) {
|
|
|
383
385
|
});
|
|
384
386
|
return jsx(Fragment, null, reRenderTracking, rendererResult);
|
|
385
387
|
} catch (e) {
|
|
388
|
+
var _featureFlags$feature2;
|
|
386
389
|
if (onError) {
|
|
387
390
|
onError(e);
|
|
388
391
|
}
|
|
@@ -393,6 +396,7 @@ export var Renderer = /*#__PURE__*/function (_PureComponent) {
|
|
|
393
396
|
allowPlaceholderText: allowPlaceholderText,
|
|
394
397
|
allowColumnSorting: allowColumnSorting,
|
|
395
398
|
allowNestedHeaderLinks: allowNestedHeaderLinks,
|
|
399
|
+
useFragmentMarkBreakoutWidthStylingFix: (_featureFlags$feature2 = featureFlags.featureFlags.useFragmentMarkBreakoutWidthStylingFix) !== null && _featureFlags$feature2 !== void 0 ? _featureFlags$feature2 : true,
|
|
396
400
|
onClick: handleWrapperOnClick
|
|
397
401
|
}, jsx(UnsupportedBlock, null));
|
|
398
402
|
}
|
|
@@ -444,7 +448,8 @@ var RendererWrapper = /*#__PURE__*/React.memo(function (props) {
|
|
|
444
448
|
appearance = props.appearance,
|
|
445
449
|
children = props.children,
|
|
446
450
|
onClick = props.onClick,
|
|
447
|
-
onMouseDown = props.onMouseDown
|
|
451
|
+
onMouseDown = props.onMouseDown,
|
|
452
|
+
useFragmentMarkBreakoutWidthStylingFix = props.useFragmentMarkBreakoutWidthStylingFix;
|
|
448
453
|
return jsx(WidthProvider, {
|
|
449
454
|
className: "ak-renderer-wrapper"
|
|
450
455
|
}, jsx(BaseTheme, {
|
|
@@ -456,7 +461,8 @@ var RendererWrapper = /*#__PURE__*/React.memo(function (props) {
|
|
|
456
461
|
css: rendererStyles({
|
|
457
462
|
appearance: appearance,
|
|
458
463
|
allowNestedHeaderLinks: allowNestedHeaderLinks,
|
|
459
|
-
allowColumnSorting: !!allowColumnSorting
|
|
464
|
+
allowColumnSorting: !!allowColumnSorting,
|
|
465
|
+
useFragmentMarkBreakoutWidthStylingFix: useFragmentMarkBreakoutWidthStylingFix
|
|
460
466
|
})
|
|
461
467
|
}, children)));
|
|
462
468
|
});
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
|
|
2
|
-
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
|
|
2
|
+
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8;
|
|
3
3
|
import { css } from '@emotion/react';
|
|
4
4
|
import { themed } from '@atlaskit/theme/components';
|
|
5
5
|
import { gridSize, fontFamily, fontSize, borderRadius } from '@atlaskit/theme/constants';
|
|
@@ -74,13 +74,19 @@ var fullWidthStyles = function fullWidthStyles(_ref5) {
|
|
|
74
74
|
}
|
|
75
75
|
return css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n max-width: ", "px;\n margin: 0 auto;\n\n .fabric-editor-breakout-mark,\n .pm-table-container,\n .ak-renderer-extension {\n width: 100% !important;\n }\n "])), akEditorFullWidthLayoutWidth);
|
|
76
76
|
};
|
|
77
|
+
var breakoutWidthStyle = function breakoutWidthStyle(useFragmentMarkBreakoutWidthStylingFix) {
|
|
78
|
+
if (useFragmentMarkBreakoutWidthStylingFix) {
|
|
79
|
+
return css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n *:not([data-mark-type='fragment'])\n .", " {\n width: 100% !important;\n left: 0 !important;\n }\n\n [data-mark-type='fragment']\n *\n .", " {\n width: 100% !important;\n left: 0 !important;\n }\n "])), TableSharedCssClassName.TABLE_CONTAINER, TableSharedCssClassName.TABLE_CONTAINER);
|
|
80
|
+
}
|
|
81
|
+
return css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n * .", " {\n width: 100% !important;\n left: 0 !important;\n }\n "])), TableSharedCssClassName.TABLE_CONTAINER);
|
|
82
|
+
};
|
|
77
83
|
export var rendererStyles = function rendererStyles(wrapperProps) {
|
|
78
84
|
return function (theme) {
|
|
79
85
|
// This is required to be compatible with styled-components prop structure.
|
|
80
86
|
var themeProps = {
|
|
81
87
|
theme: theme
|
|
82
88
|
};
|
|
83
|
-
return css(
|
|
89
|
+
return css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n font-size: ", "px;\n line-height: 1.5rem;\n color: ", ";\n\n .", "::after {\n // we add a clearfix after ak-renderer-document in order to\n // contain internal floats (such as media images that are \"wrap-left\")\n // to just the renderer (and not spill outside of it)\n content: '';\n visibility: hidden;\n display: block;\n height: 0;\n clear: both;\n }\n\n ", "\n ", "\n\n & h1 {\n ", "\n }\n\n & h2 {\n ", "\n }\n\n & h3 {\n ", "\n }\n\n & h4 {\n ", "\n }\n\n & h5 {\n ", "\n }\n\n & h6 {\n ", "\n }\n\n & span.akActionMark {\n color: ", ";\n text-decoration: none;\n\n &:hover {\n color: ", ";\n text-decoration: underline;\n }\n\n &:active {\n color: ", ";\n }\n }\n\n & span.akActionMark {\n cursor: pointer;\n }\n\n & span[data-placeholder] {\n color: ", ";\n }\n\n ", ";\n ", ";\n ", ";\n ", ";\n ", ";\n ", ";\n ", ";\n ", ";\n ", ";\n ", ";\n ", ";\n ", ";\n ", ";\n ", "\n\n & .UnknownBlock {\n font-family: ", ";\n font-size: ", ";\n font-weight: 400;\n white-space: pre-wrap;\n word-wrap: break-word;\n }\n\n & span.date-node {\n background: ", ";\n border-radius: ", "px;\n color: ", ";\n padding: 2px 4px;\n margin: 0 1px;\n transition: background 0.3s;\n }\n\n & span.date-node-highlighted {\n background: ", ";\n color: ", ";\n }\n\n & .renderer-image {\n max-width: 100%;\n display: block;\n margin: ", "px 0;\n }\n\n .", ".rich-media-wrapped\n + .", ":not(.rich-media-wrapped) {\n clear: both;\n }\n\n & .code-block,\n & blockquote,\n & hr,\n & > div > div:not(.rich-media-wrapped),\n .", ".rich-media-wrapped\n + .rich-media-wrapped\n + *:not(.rich-media-wrapped),\n .", ".rich-media-wrapped + div:not(.rich-media-wrapped),\n .", ".image-align-start,\n .", ".image-center,\n .", ".image-align-end {\n clear: both;\n }\n\n & .rich-media-wrapped {\n & + h1,\n & + h2,\n & + h3,\n & + h4,\n & + h5,\n & + h6 {\n margin-top: 8px;\n }\n }\n\n ", "\n /* plugin styles */\n ", " &\n div[class^='image-wrap-'] + div[class^='image-wrap-'] {\n margin-left: 0;\n margin-right: 0;\n }\n\n /* Breakout for tables and extensions */\n .", " > {\n ", "\n\n * .", " {\n overflow-x: auto;\n }\n\n & .", ":first-child {\n margin-top: 0;\n }\n }\n\n .", " {\n .", " {\n margin-top: ", ";\n }\n\n .", " {\n margin-left: 50%;\n transform: translateX(-50%);\n }\n\n .", " {\n overflow-x: auto;\n }\n\n .", "\n .", " {\n display: flex;\n }\n }\n\n ", "\n\n .", " .", " {\n z-index: 0;\n transition: all 0.1s linear;\n display: flex; /* needed to avoid position: fixed jumpiness in Chrome */\n\n /** Shadow overrides */\n &.", "::after,\n &.", "::before {\n top: ", "px;\n height: calc(100% - ", "px);\n z-index: ", ";\n }\n\n &\n .", ",\n &\n .", " {\n height: calc(100% - ", "px);\n }\n\n /**\n * A hack for making all the <th /> heights equal in case some have shorter\n * content than others.\n *\n * This is done to make sort buttons fill entire <th />.\n */\n table {\n height: 1px; /* will be ignored */\n ", ";\n margin-left: 0;\n margin-right: 0;\n }\n\n table tr:first-of-type {\n height: 100%;\n\n td,\n th {\n position: relative;\n }\n }\n\n table[data-number-column='true'] {\n .", " {\n background-color: ", ";\n border-right: 1px solid\n ", ";\n width: ", "px;\n text-align: center;\n color: ", ";\n font-size: ", ";\n }\n\n .fixed .", " {\n border-right: 0px none;\n }\n }\n }\n\n tr[data-header-row].fixed {\n position: fixed !important;\n display: flex;\n overflow: hidden;\n z-index: ", ";\n\n border-right: 1px solid\n ", ";\n border-bottom: 1px solid\n ", ";\n\n /* this is to compensate for the table border */\n transform: translateX(-1px);\n }\n\n .sticky > th {\n z-index: ", ";\n position: sticky !important;\n top: 0;\n }\n\n /* Make the number column header sticky */\n .sticky > td {\n position: sticky !important;\n top: 0;\n }\n\n /* add border for position: sticky\n and work around background-clip: padding-box\n bug for FF causing box-shadow bug in Chrome */\n .sticky th,\n .sticky td {\n box-shadow: 0px 1px\n ", ",\n 0px -0.5px ", ",\n inset -1px 0px ", ",\n 0px -1px ", ";\n }\n\n /* this will remove jumpiness caused in Chrome for sticky headers */\n .fixed + tr {\n min-height: 0px;\n }\n\n /*\n * We wrap CodeBlock in a grid to prevent it from overflowing the container of the renderer.\n * See ED-4159.\n */\n & .code-block {\n max-width: 100%;\n /* -ms- properties are necessary until MS supports the latest version of the grid spec */\n /* stylelint-disable value-no-vendor-prefix, declaration-block-no-duplicate-properties */\n display: -ms-grid;\n display: grid;\n -ms-grid-columns: auto 1fr;\n /* stylelint-enable */\n\n grid-template-columns: minmax(0, 1fr);\n position: relative;\n border-radius: ", "px;\n\n /*\n * The overall renderer has word-wrap: break; which causes issues with\n * code block line numbers in Safari / iOS.\n */\n word-wrap: normal;\n\n & > span {\n /* stylelint-disable value-no-vendor-prefix */\n -ms-grid-row: 1;\n -ms-grid-column: 2;\n /* stylelint-enable */\n grid-column: 1;\n }\n }\n\n & .MediaGroup,\n & .code-block {\n margin-top: ", ";\n\n &:first-child {\n margin-top: 0;\n }\n }\n\n ", "\n\n ", ";\n & [data-layout-section] {\n margin-top: ", "px;\n & > div + div {\n margin-left: ", "px;\n }\n\n @media screen and (max-width: ", "px) {\n & > div + div {\n margin-left: 0;\n }\n }\n\n & .MediaGroup,\n & .code-block {\n margin-top: ", ";\n\n &:first-child {\n margin-top: 0;\n }\n }\n }\n\n & li {\n > .code-block {\n margin: ", " 0 0 0;\n }\n > .code-block:first-child {\n margin-top: 0;\n }\n\n > div:last-of-type.code-block {\n margin-bottom: ", ";\n }\n }\n\n & :not([data-node-type='decisionList']) > li {\n ", "\n }\n "])), editorFontSize(themeProps), themed({
|
|
84
90
|
light: "var(--ds-text, ".concat(colors.N800, ")"),
|
|
85
91
|
dark: "var(--ds-text, #B8C7E0)"
|
|
86
92
|
})(themeProps), RendererCssClassName.DOCUMENT, fullPageStyles(wrapperProps, themeProps), fullWidthStyles(wrapperProps), headingAnchorStyle('h1'), headingAnchorStyle('h2'), headingAnchorStyle('h3'), headingAnchorStyle('h4'), headingAnchorStyle('h5'), headingAnchorStyle('h6'), "var(--ds-link, ".concat(colors.B400, ")"), "var(--ds-link, ".concat(colors.B300, ")"), "var(--ds-link-pressed, ".concat(colors.B500, ")"), colors.placeholderText(themeProps), whitespaceSharedStyles, blockquoteSharedStyles, headingsSharedStyles(themeProps), ruleSharedStyles(themeProps), paragraphSharedStyles, listsSharedStyles, indentationSharedStyles, blockMarksSharedStyles, codeMarkSharedStyles(themeProps), shadowSharedStyle, dateSharedStyle, textColorStyles, tasksAndDecisionsStyles, smartCardSharedStyles, fontFamily(), relativeFontSizeToBase16(fontSize()), themed({
|
|
@@ -89,7 +95,7 @@ export var rendererStyles = function rendererStyles(wrapperProps) {
|
|
|
89
95
|
})(themeProps), borderRadius(), themed({
|
|
90
96
|
light: "var(--ds-text, ".concat(colors.N800, ")"),
|
|
91
97
|
dark: "var(--ds-text, ".concat(colors.DN600, ")")
|
|
92
|
-
})(themeProps), "var(--ds-background-danger, ".concat(colors.R50, ")"), "var(--ds-text-danger, ".concat(colors.R500, ")"), gridSize() * 3, richMediaClassName, richMediaClassName, richMediaClassName, richMediaClassName, richMediaClassName, richMediaClassName, richMediaClassName, alignedHeadingAnchorStyle(wrapperProps), mediaSingleSharedStyle, RendererCssClassName.DOCUMENT,
|
|
98
|
+
})(themeProps), "var(--ds-background-danger, ".concat(colors.R50, ")"), "var(--ds-text-danger, ".concat(colors.R500, ")"), gridSize() * 3, richMediaClassName, richMediaClassName, richMediaClassName, richMediaClassName, richMediaClassName, richMediaClassName, richMediaClassName, alignedHeadingAnchorStyle(wrapperProps), mediaSingleSharedStyle, RendererCssClassName.DOCUMENT, breakoutWidthStyle(wrapperProps.useFragmentMarkBreakoutWidthStylingFix), RendererCssClassName.EXTENSION_OVERFLOW_CONTAINER, RendererCssClassName.EXTENSION, RendererCssClassName.DOCUMENT, RendererCssClassName.EXTENSION, blockNodesVerticalMargin, RendererCssClassName.EXTENSION_CENTER_ALIGN, TableSharedCssClassName.TABLE_NODE_WRAPPER, shadowObserverClassNames.SHADOW_CONTAINER, TableSharedCssClassName.TABLE_NODE_WRAPPER, tableSharedStyle(themeProps), RendererCssClassName.DOCUMENT, TableSharedCssClassName.TABLE_CONTAINER, shadowClassNames.RIGHT_SHADOW, shadowClassNames.LEFT_SHADOW, tableMarginTop - 1, tableMarginTop, akEditorStickyHeaderZIndex, shadowObserverClassNames.SENTINEL_LEFT, shadowObserverClassNames.SENTINEL_RIGHT, tableMarginTop, tableSortableColumnStyle(wrapperProps), RendererCssClassName.NUMBER_COLUMN, themed({
|
|
93
99
|
light: "var(--ds-background-neutral, ".concat(akEditorTableToolbar, ")"),
|
|
94
100
|
dark: "var(--ds-background-neutral, ".concat(akEditorTableToolbarDark, ")")
|
|
95
101
|
})(themeProps), themed({
|
package/dist/esm/version.json
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/renderer",
|
|
3
|
-
"version": "107.3.
|
|
3
|
+
"version": "107.3.1",
|
|
4
4
|
"description": "Renderer component",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -43,7 +43,7 @@
|
|
|
43
43
|
"@atlaskit/media-filmstrip": "^46.1.0",
|
|
44
44
|
"@atlaskit/media-ui": "^22.3.0",
|
|
45
45
|
"@atlaskit/media-viewer": "^47.5.0",
|
|
46
|
-
"@atlaskit/smart-card": "^25.
|
|
46
|
+
"@atlaskit/smart-card": "^25.3.0",
|
|
47
47
|
"@atlaskit/status": "^1.2.0",
|
|
48
48
|
"@atlaskit/task-decision": "^17.5.0",
|
|
49
49
|
"@atlaskit/theme": "^12.3.0",
|