@atlaskit/renderer 115.0.1 → 115.0.2
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 +6 -0
- package/dist/cjs/react/nodes/table.js +1 -1
- package/dist/cjs/react/nodes/tableNew.js +8 -2
- package/dist/cjs/ui/Renderer/index.js +9 -1
- package/dist/cjs/ui/Renderer/useMemoFromPropsDerivative.js +4 -20
- package/dist/es2019/react/nodes/table.js +1 -1
- package/dist/es2019/react/nodes/tableNew.js +9 -3
- package/dist/es2019/ui/Renderer/index.js +12 -2
- package/dist/es2019/ui/Renderer/useMemoFromPropsDerivative.js +4 -20
- package/dist/esm/react/nodes/table.js +1 -1
- package/dist/esm/react/nodes/tableNew.js +8 -2
- package/dist/esm/ui/Renderer/index.js +9 -1
- package/dist/esm/ui/Renderer/useMemoFromPropsDerivative.js +4 -20
- package/dist/types/ui/Renderer/useMemoFromPropsDerivative.d.ts +1 -1
- package/dist/types-ts4.5/ui/Renderer/useMemoFromPropsDerivative.d.ts +1 -1
- package/package.json +4 -7
package/CHANGELOG.md
CHANGED
|
@@ -633,7 +633,7 @@ var shouldRenderTableWithCSSWidth = function shouldRenderTableWithCSSWidth(layou
|
|
|
633
633
|
var TableWithWidth = function TableWithWidth(props) {
|
|
634
634
|
var _props$tableNode$attr, _props$tableNode, _props$tableNode2;
|
|
635
635
|
// eslint-disable-next-line @atlaskit/platform/ensure-feature-flag-prefix
|
|
636
|
-
if (shouldRenderTableWithCSSWidth((_props$tableNode$attr = (_props$tableNode = props.tableNode) === null || _props$tableNode === void 0 || (_props$tableNode = _props$tableNode.attrs) === null || _props$tableNode === void 0 ? void 0 : _props$tableNode.layout) !== null && _props$tableNode$attr !== void 0 ? _props$tableNode$attr : '', (_props$tableNode2 = props.tableNode) === null || _props$tableNode2 === void 0 || (_props$tableNode2 = _props$tableNode2.attrs) === null || _props$tableNode2 === void 0 ? void 0 : _props$tableNode2.width) && (0, _platformFeatureFlags.fg)('platform-ssr-table-resize')) {
|
|
636
|
+
if ((shouldRenderTableWithCSSWidth((_props$tableNode$attr = (_props$tableNode = props.tableNode) === null || _props$tableNode === void 0 || (_props$tableNode = _props$tableNode.attrs) === null || _props$tableNode === void 0 ? void 0 : _props$tableNode.layout) !== null && _props$tableNode$attr !== void 0 ? _props$tableNode$attr : '', (_props$tableNode2 = props.tableNode) === null || _props$tableNode2 === void 0 || (_props$tableNode2 = _props$tableNode2.attrs) === null || _props$tableNode2 === void 0 ? void 0 : _props$tableNode2.width) || props.rendererAppearance === 'comment') && (0, _platformFeatureFlags.fg)('platform-ssr-table-resize')) {
|
|
637
637
|
var _props$columnWidths;
|
|
638
638
|
var colWidthsSum = ((_props$columnWidths = props.columnWidths) === null || _props$columnWidths === void 0 ? void 0 : _props$columnWidths.reduce(function (total, val) {
|
|
639
639
|
return total + val;
|
|
@@ -386,6 +386,12 @@ var TableContainer = exports.TableContainer = /*#__PURE__*/function (_React$Comp
|
|
|
386
386
|
this.updatedLayout = layout;
|
|
387
387
|
}
|
|
388
388
|
|
|
389
|
+
// These styling removes extra padding for `comment` rendererAppearance.
|
|
390
|
+
// This is especially relevant for Jira which only uses `comment` appearance and does not need padding.
|
|
391
|
+
var resizerContainerPadding = rendererAppearance === 'comment' ? 0 : gutterPadding;
|
|
392
|
+
var resizerItemMaxWidth = rendererAppearance === 'comment' ? "min(100cqw, var(--ak-editor-table-max-width))" : "min(calc(100cqw - var(--ak-editor-table-gutter-padding)), var(--ak-editor-table-max-width))";
|
|
393
|
+
var resizerItemWidth = rendererAppearance === 'comment' ? "min(100cqw, ".concat(tableWidthAttribute, ")") : "min(calc(100cqw - var(--ak-editor-table-gutter-padding)), ".concat(tableWidthAttribute, ")");
|
|
394
|
+
|
|
389
395
|
// full width tables can have either left-aligned or centered layout despite looking centered in the renderer.
|
|
390
396
|
// in these cases, keep the alignment unset
|
|
391
397
|
var getTableAlignment = function getTableAlignment() {
|
|
@@ -406,7 +412,7 @@ var TableContainer = exports.TableContainer = /*#__PURE__*/function (_React$Comp
|
|
|
406
412
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
|
|
407
413
|
,
|
|
408
414
|
style: {
|
|
409
|
-
width: "min(calc(100cqw - ".concat(
|
|
415
|
+
width: "min(calc(100cqw - ".concat(resizerContainerPadding, "px), ").concat(tableWidthAttribute, ")")
|
|
410
416
|
}
|
|
411
417
|
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
412
418
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
|
|
@@ -416,7 +422,7 @@ var TableContainer = exports.TableContainer = /*#__PURE__*/function (_React$Comp
|
|
|
416
422
|
position: 'relative',
|
|
417
423
|
userSelect: 'auto',
|
|
418
424
|
boxSizing: 'border-box'
|
|
419
|
-
}, '--ak-editor-table-gutter-padding', "".concat(gutterPadding, "px")), '--ak-editor-table-max-width', "".concat(TABLE_MAX_WIDTH, "px")), '--ak-editor-table-min-width', "".concat(tableMinWidth, "px")), "minWidth", 'var(--ak-editor-table-min-width)'), "maxWidth",
|
|
425
|
+
}, '--ak-editor-table-gutter-padding', "".concat(gutterPadding, "px")), '--ak-editor-table-max-width', "".concat(TABLE_MAX_WIDTH, "px")), '--ak-editor-table-min-width', "".concat(tableMinWidth, "px")), "minWidth", 'var(--ak-editor-table-min-width)'), "maxWidth", resizerItemMaxWidth), "width", resizerItemWidth)
|
|
420
426
|
}, /*#__PURE__*/_react.default.createElement("span", {
|
|
421
427
|
className: "resizer-hover-zone"
|
|
422
428
|
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
@@ -60,7 +60,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
|
|
|
60
60
|
var NORMAL_SEVERITY_THRESHOLD = exports.NORMAL_SEVERITY_THRESHOLD = 2000;
|
|
61
61
|
var DEGRADED_SEVERITY_THRESHOLD = exports.DEGRADED_SEVERITY_THRESHOLD = 3000;
|
|
62
62
|
var packageName = "@atlaskit/renderer";
|
|
63
|
-
var packageVersion = "115.0.
|
|
63
|
+
var packageVersion = "115.0.2";
|
|
64
64
|
var setAsQueryContainerStyles = (0, _react2.css)({
|
|
65
65
|
containerName: 'ak-renderer-wrapper',
|
|
66
66
|
containerType: 'inline-size',
|
|
@@ -257,6 +257,14 @@ var RendererFunctionalComponent = exports.RendererFunctionalComponent = function
|
|
|
257
257
|
|
|
258
258
|
// Abstract out the logic into its own function
|
|
259
259
|
var serializer = (0, _useMemoFromPropsDerivative.useMemoFromPropsDerivative)(function (serializerProps) {
|
|
260
|
+
// If progressive rendering is enabled, create a new serializer
|
|
261
|
+
if ((0, _platformFeatureFlags.fg)('cc_complexit_fe_progressive_adf_rendering')) {
|
|
262
|
+
var _props$createSerializ;
|
|
263
|
+
var newSerializer = (_props$createSerializ = props.createSerializer) === null || _props$createSerializ === void 0 ? void 0 : _props$createSerializ.call(props, serializerProps);
|
|
264
|
+
if (newSerializer) {
|
|
265
|
+
return newSerializer;
|
|
266
|
+
}
|
|
267
|
+
}
|
|
260
268
|
return new _.ReactSerializer(serializerProps);
|
|
261
269
|
}, deriveSerializerProps, props);
|
|
262
270
|
var localRef = (0, _react.useRef)(null);
|
|
@@ -13,43 +13,27 @@ function useMemoFromPropsDerivative(factory, propsDerivator, props) {
|
|
|
13
13
|
var prev = (0, _react.useRef)(props);
|
|
14
14
|
var prevFactory = (0, _react.useRef)(null);
|
|
15
15
|
return (0, _react.useMemo)(function () {
|
|
16
|
-
var init = propsDerivator(props);
|
|
17
16
|
if ((0, _platformFeatureFlags.fg)('cc_complexit_fe_reduce_fragment_serialization')) {
|
|
18
17
|
// check if the serializer is already created
|
|
19
18
|
var shouldCreate = !prevFactory.current;
|
|
20
19
|
// check each prop to see if value has changed and also check if the number of props has changed
|
|
21
20
|
if (prev.current !== props) {
|
|
22
|
-
// @ts-ignore - error TS2769: No overload matches this call.
|
|
23
21
|
var propsEntries = Object.entries(props);
|
|
24
|
-
|
|
25
|
-
// @ts-ignore - error TS2769: No overload matches this call.
|
|
26
|
-
var isLengthDifferent = propsEntries.length !== Object.keys(prev.current).length;
|
|
27
|
-
// @ts-ignore
|
|
28
|
-
var isValueDifferent = propsEntries.some(function (_ref) {
|
|
22
|
+
shouldCreate = propsEntries.length !== Object.keys(prev.current).length || propsEntries.some(function (_ref) {
|
|
29
23
|
var _ref2 = (0, _slicedToArray2.default)(_ref, 2),
|
|
30
24
|
key = _ref2[0],
|
|
31
25
|
prop = _ref2[1];
|
|
32
26
|
return prev.current[key] !== prop;
|
|
33
27
|
});
|
|
34
|
-
shouldCreate = isLengthDifferent || isValueDifferent;
|
|
35
28
|
}
|
|
36
29
|
prev.current = props;
|
|
37
30
|
// If first time or any prop value has changed, create a new serializer
|
|
38
31
|
if (shouldCreate) {
|
|
39
|
-
prevFactory.current = factory(
|
|
32
|
+
prevFactory.current = factory(propsDerivator(props));
|
|
40
33
|
}
|
|
34
|
+
return prevFactory.current;
|
|
41
35
|
}
|
|
42
|
-
|
|
43
|
-
// If progressive rendering is enabled, create a new serializer
|
|
44
|
-
if ((0, _platformFeatureFlags.fg)('cc_complexit_fe_progressive_adf_rendering')) {
|
|
45
|
-
var _props$createSerializ;
|
|
46
|
-
// @ts-ignore - erorr TS2339 Property 'createSerializer' does not exist on type 'Props'.
|
|
47
|
-
var newSerializer = (_props$createSerializ = props.createSerializer) === null || _props$createSerializ === void 0 ? void 0 : _props$createSerializ.call(props, init);
|
|
48
|
-
if (newSerializer) {
|
|
49
|
-
return newSerializer;
|
|
50
|
-
}
|
|
51
|
-
}
|
|
52
|
-
return (0, _platformFeatureFlags.fg)('cc_complexit_fe_reduce_fragment_serialization') ? prevFactory.current : factory(init);
|
|
36
|
+
return factory(propsDerivator(props));
|
|
53
37
|
},
|
|
54
38
|
// To keep deps consistent, here disable the exhaustive-deps rule to drop factory from the deps array
|
|
55
39
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
@@ -574,7 +574,7 @@ const shouldRenderTableWithCSSWidth = (layout, width) => {
|
|
|
574
574
|
const TableWithWidth = props => {
|
|
575
575
|
var _props$tableNode$attr, _props$tableNode, _props$tableNode$attr2, _props$tableNode2, _props$tableNode2$att;
|
|
576
576
|
// eslint-disable-next-line @atlaskit/platform/ensure-feature-flag-prefix
|
|
577
|
-
if (shouldRenderTableWithCSSWidth((_props$tableNode$attr = (_props$tableNode = props.tableNode) === null || _props$tableNode === void 0 ? void 0 : (_props$tableNode$attr2 = _props$tableNode.attrs) === null || _props$tableNode$attr2 === void 0 ? void 0 : _props$tableNode$attr2.layout) !== null && _props$tableNode$attr !== void 0 ? _props$tableNode$attr : '', (_props$tableNode2 = props.tableNode) === null || _props$tableNode2 === void 0 ? void 0 : (_props$tableNode2$att = _props$tableNode2.attrs) === null || _props$tableNode2$att === void 0 ? void 0 : _props$tableNode2$att.width) && fg('platform-ssr-table-resize')) {
|
|
577
|
+
if ((shouldRenderTableWithCSSWidth((_props$tableNode$attr = (_props$tableNode = props.tableNode) === null || _props$tableNode === void 0 ? void 0 : (_props$tableNode$attr2 = _props$tableNode.attrs) === null || _props$tableNode$attr2 === void 0 ? void 0 : _props$tableNode$attr2.layout) !== null && _props$tableNode$attr !== void 0 ? _props$tableNode$attr : '', (_props$tableNode2 = props.tableNode) === null || _props$tableNode2 === void 0 ? void 0 : (_props$tableNode2$att = _props$tableNode2.attrs) === null || _props$tableNode2$att === void 0 ? void 0 : _props$tableNode2$att.width) || props.rendererAppearance === 'comment') && fg('platform-ssr-table-resize')) {
|
|
578
578
|
var _props$columnWidths;
|
|
579
579
|
const colWidthsSum = ((_props$columnWidths = props.columnWidths) === null || _props$columnWidths === void 0 ? void 0 : _props$columnWidths.reduce((total, val) => total + val, 0)) || 0;
|
|
580
580
|
if (colWidthsSum || props.allowTableResizing) {
|
|
@@ -334,6 +334,12 @@ export class TableContainer extends React.Component {
|
|
|
334
334
|
this.updatedLayout = layout;
|
|
335
335
|
}
|
|
336
336
|
|
|
337
|
+
// These styling removes extra padding for `comment` rendererAppearance.
|
|
338
|
+
// This is especially relevant for Jira which only uses `comment` appearance and does not need padding.
|
|
339
|
+
const resizerContainerPadding = rendererAppearance === 'comment' ? 0 : gutterPadding;
|
|
340
|
+
const resizerItemMaxWidth = rendererAppearance === 'comment' ? `min(100cqw, var(--ak-editor-table-max-width))` : `min(calc(100cqw - var(--ak-editor-table-gutter-padding)), var(--ak-editor-table-max-width))`;
|
|
341
|
+
const resizerItemWidth = rendererAppearance === 'comment' ? `min(100cqw, ${tableWidthAttribute})` : `min(calc(100cqw - var(--ak-editor-table-gutter-padding)), ${tableWidthAttribute})`;
|
|
342
|
+
|
|
337
343
|
// full width tables can have either left-aligned or centered layout despite looking centered in the renderer.
|
|
338
344
|
// in these cases, keep the alignment unset
|
|
339
345
|
const getTableAlignment = () => {
|
|
@@ -354,7 +360,7 @@ export class TableContainer extends React.Component {
|
|
|
354
360
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
|
|
355
361
|
,
|
|
356
362
|
style: {
|
|
357
|
-
width: `min(calc(100cqw - ${
|
|
363
|
+
width: `min(calc(100cqw - ${resizerContainerPadding}px), ${tableWidthAttribute})`
|
|
358
364
|
}
|
|
359
365
|
}, /*#__PURE__*/React.createElement("div", {
|
|
360
366
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
|
|
@@ -369,8 +375,8 @@ export class TableContainer extends React.Component {
|
|
|
369
375
|
['--ak-editor-table-min-width']: `${tableMinWidth}px`,
|
|
370
376
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
|
|
371
377
|
minWidth: 'var(--ak-editor-table-min-width)',
|
|
372
|
-
maxWidth:
|
|
373
|
-
width:
|
|
378
|
+
maxWidth: resizerItemMaxWidth,
|
|
379
|
+
width: resizerItemWidth
|
|
374
380
|
}
|
|
375
381
|
}, /*#__PURE__*/React.createElement("span", {
|
|
376
382
|
className: "resizer-hover-zone"
|
|
@@ -47,7 +47,7 @@ import { useMemoFromPropsDerivative } from './useMemoFromPropsDerivative';
|
|
|
47
47
|
export const NORMAL_SEVERITY_THRESHOLD = 2000;
|
|
48
48
|
export const DEGRADED_SEVERITY_THRESHOLD = 3000;
|
|
49
49
|
const packageName = "@atlaskit/renderer";
|
|
50
|
-
const packageVersion = "115.0.
|
|
50
|
+
const packageVersion = "115.0.2";
|
|
51
51
|
const setAsQueryContainerStyles = css({
|
|
52
52
|
containerName: 'ak-renderer-wrapper',
|
|
53
53
|
containerType: 'inline-size',
|
|
@@ -249,7 +249,17 @@ export const RendererFunctionalComponent = props => {
|
|
|
249
249
|
}, [createRendererContext, providerFactory, fireAnalyticsEvent]);
|
|
250
250
|
|
|
251
251
|
// Abstract out the logic into its own function
|
|
252
|
-
const serializer = useMemoFromPropsDerivative(serializerProps =>
|
|
252
|
+
const serializer = useMemoFromPropsDerivative(serializerProps => {
|
|
253
|
+
// If progressive rendering is enabled, create a new serializer
|
|
254
|
+
if (fg('cc_complexit_fe_progressive_adf_rendering')) {
|
|
255
|
+
var _props$createSerializ;
|
|
256
|
+
const newSerializer = (_props$createSerializ = props.createSerializer) === null || _props$createSerializ === void 0 ? void 0 : _props$createSerializ.call(props, serializerProps);
|
|
257
|
+
if (newSerializer) {
|
|
258
|
+
return newSerializer;
|
|
259
|
+
}
|
|
260
|
+
}
|
|
261
|
+
return new ReactSerializer(serializerProps);
|
|
262
|
+
}, deriveSerializerProps, props);
|
|
253
263
|
const localRef = useRef(null);
|
|
254
264
|
const editorRef = props.innerRef || localRef;
|
|
255
265
|
const id = useMemo(() => uuid(), []);
|
|
@@ -5,38 +5,22 @@ export function useMemoFromPropsDerivative(factory, propsDerivator, props) {
|
|
|
5
5
|
const prev = useRef(props);
|
|
6
6
|
const prevFactory = useRef(null);
|
|
7
7
|
return useMemo(() => {
|
|
8
|
-
const init = propsDerivator(props);
|
|
9
8
|
if (fg('cc_complexit_fe_reduce_fragment_serialization')) {
|
|
10
9
|
// check if the serializer is already created
|
|
11
10
|
let shouldCreate = !prevFactory.current;
|
|
12
11
|
// check each prop to see if value has changed and also check if the number of props has changed
|
|
13
12
|
if (prev.current !== props) {
|
|
14
|
-
// @ts-ignore - error TS2769: No overload matches this call.
|
|
15
13
|
const propsEntries = Object.entries(props);
|
|
16
|
-
|
|
17
|
-
// @ts-ignore - error TS2769: No overload matches this call.
|
|
18
|
-
const isLengthDifferent = propsEntries.length !== Object.keys(prev.current).length;
|
|
19
|
-
// @ts-ignore
|
|
20
|
-
const isValueDifferent = propsEntries.some(([key, prop]) => prev.current[key] !== prop);
|
|
21
|
-
shouldCreate = isLengthDifferent || isValueDifferent;
|
|
14
|
+
shouldCreate = propsEntries.length !== Object.keys(prev.current).length || propsEntries.some(([key, prop]) => prev.current[key] !== prop);
|
|
22
15
|
}
|
|
23
16
|
prev.current = props;
|
|
24
17
|
// If first time or any prop value has changed, create a new serializer
|
|
25
18
|
if (shouldCreate) {
|
|
26
|
-
prevFactory.current = factory(
|
|
19
|
+
prevFactory.current = factory(propsDerivator(props));
|
|
27
20
|
}
|
|
21
|
+
return prevFactory.current;
|
|
28
22
|
}
|
|
29
|
-
|
|
30
|
-
// If progressive rendering is enabled, create a new serializer
|
|
31
|
-
if (fg('cc_complexit_fe_progressive_adf_rendering')) {
|
|
32
|
-
var _props$createSerializ;
|
|
33
|
-
// @ts-ignore - erorr TS2339 Property 'createSerializer' does not exist on type 'Props'.
|
|
34
|
-
const newSerializer = (_props$createSerializ = props.createSerializer) === null || _props$createSerializ === void 0 ? void 0 : _props$createSerializ.call(props, init);
|
|
35
|
-
if (newSerializer) {
|
|
36
|
-
return newSerializer;
|
|
37
|
-
}
|
|
38
|
-
}
|
|
39
|
-
return fg('cc_complexit_fe_reduce_fragment_serialization') ? prevFactory.current : factory(init);
|
|
23
|
+
return factory(propsDerivator(props));
|
|
40
24
|
},
|
|
41
25
|
// To keep deps consistent, here disable the exhaustive-deps rule to drop factory from the deps array
|
|
42
26
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
@@ -628,7 +628,7 @@ var shouldRenderTableWithCSSWidth = function shouldRenderTableWithCSSWidth(layou
|
|
|
628
628
|
var TableWithWidth = function TableWithWidth(props) {
|
|
629
629
|
var _props$tableNode$attr, _props$tableNode, _props$tableNode2;
|
|
630
630
|
// eslint-disable-next-line @atlaskit/platform/ensure-feature-flag-prefix
|
|
631
|
-
if (shouldRenderTableWithCSSWidth((_props$tableNode$attr = (_props$tableNode = props.tableNode) === null || _props$tableNode === void 0 || (_props$tableNode = _props$tableNode.attrs) === null || _props$tableNode === void 0 ? void 0 : _props$tableNode.layout) !== null && _props$tableNode$attr !== void 0 ? _props$tableNode$attr : '', (_props$tableNode2 = props.tableNode) === null || _props$tableNode2 === void 0 || (_props$tableNode2 = _props$tableNode2.attrs) === null || _props$tableNode2 === void 0 ? void 0 : _props$tableNode2.width) && fg('platform-ssr-table-resize')) {
|
|
631
|
+
if ((shouldRenderTableWithCSSWidth((_props$tableNode$attr = (_props$tableNode = props.tableNode) === null || _props$tableNode === void 0 || (_props$tableNode = _props$tableNode.attrs) === null || _props$tableNode === void 0 ? void 0 : _props$tableNode.layout) !== null && _props$tableNode$attr !== void 0 ? _props$tableNode$attr : '', (_props$tableNode2 = props.tableNode) === null || _props$tableNode2 === void 0 || (_props$tableNode2 = _props$tableNode2.attrs) === null || _props$tableNode2 === void 0 ? void 0 : _props$tableNode2.width) || props.rendererAppearance === 'comment') && fg('platform-ssr-table-resize')) {
|
|
632
632
|
var _props$columnWidths;
|
|
633
633
|
var colWidthsSum = ((_props$columnWidths = props.columnWidths) === null || _props$columnWidths === void 0 ? void 0 : _props$columnWidths.reduce(function (total, val) {
|
|
634
634
|
return total + val;
|
|
@@ -380,6 +380,12 @@ export var TableContainer = /*#__PURE__*/function (_React$Component) {
|
|
|
380
380
|
this.updatedLayout = layout;
|
|
381
381
|
}
|
|
382
382
|
|
|
383
|
+
// These styling removes extra padding for `comment` rendererAppearance.
|
|
384
|
+
// This is especially relevant for Jira which only uses `comment` appearance and does not need padding.
|
|
385
|
+
var resizerContainerPadding = rendererAppearance === 'comment' ? 0 : gutterPadding;
|
|
386
|
+
var resizerItemMaxWidth = rendererAppearance === 'comment' ? "min(100cqw, var(--ak-editor-table-max-width))" : "min(calc(100cqw - var(--ak-editor-table-gutter-padding)), var(--ak-editor-table-max-width))";
|
|
387
|
+
var resizerItemWidth = rendererAppearance === 'comment' ? "min(100cqw, ".concat(tableWidthAttribute, ")") : "min(calc(100cqw - var(--ak-editor-table-gutter-padding)), ".concat(tableWidthAttribute, ")");
|
|
388
|
+
|
|
383
389
|
// full width tables can have either left-aligned or centered layout despite looking centered in the renderer.
|
|
384
390
|
// in these cases, keep the alignment unset
|
|
385
391
|
var getTableAlignment = function getTableAlignment() {
|
|
@@ -400,7 +406,7 @@ export var TableContainer = /*#__PURE__*/function (_React$Component) {
|
|
|
400
406
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
|
|
401
407
|
,
|
|
402
408
|
style: {
|
|
403
|
-
width: "min(calc(100cqw - ".concat(
|
|
409
|
+
width: "min(calc(100cqw - ".concat(resizerContainerPadding, "px), ").concat(tableWidthAttribute, ")")
|
|
404
410
|
}
|
|
405
411
|
}, /*#__PURE__*/React.createElement("div", {
|
|
406
412
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
|
|
@@ -410,7 +416,7 @@ export var TableContainer = /*#__PURE__*/function (_React$Component) {
|
|
|
410
416
|
position: 'relative',
|
|
411
417
|
userSelect: 'auto',
|
|
412
418
|
boxSizing: 'border-box'
|
|
413
|
-
}, '--ak-editor-table-gutter-padding', "".concat(gutterPadding, "px")), '--ak-editor-table-max-width', "".concat(TABLE_MAX_WIDTH, "px")), '--ak-editor-table-min-width', "".concat(tableMinWidth, "px")), "minWidth", 'var(--ak-editor-table-min-width)'), "maxWidth",
|
|
419
|
+
}, '--ak-editor-table-gutter-padding', "".concat(gutterPadding, "px")), '--ak-editor-table-max-width', "".concat(TABLE_MAX_WIDTH, "px")), '--ak-editor-table-min-width', "".concat(tableMinWidth, "px")), "minWidth", 'var(--ak-editor-table-min-width)'), "maxWidth", resizerItemMaxWidth), "width", resizerItemWidth)
|
|
414
420
|
}, /*#__PURE__*/React.createElement("span", {
|
|
415
421
|
className: "resizer-hover-zone"
|
|
416
422
|
}, /*#__PURE__*/React.createElement("div", {
|
|
@@ -50,7 +50,7 @@ import { useMemoFromPropsDerivative } from './useMemoFromPropsDerivative';
|
|
|
50
50
|
export var NORMAL_SEVERITY_THRESHOLD = 2000;
|
|
51
51
|
export var DEGRADED_SEVERITY_THRESHOLD = 3000;
|
|
52
52
|
var packageName = "@atlaskit/renderer";
|
|
53
|
-
var packageVersion = "115.0.
|
|
53
|
+
var packageVersion = "115.0.2";
|
|
54
54
|
var setAsQueryContainerStyles = css({
|
|
55
55
|
containerName: 'ak-renderer-wrapper',
|
|
56
56
|
containerType: 'inline-size',
|
|
@@ -247,6 +247,14 @@ export var RendererFunctionalComponent = function RendererFunctionalComponent(pr
|
|
|
247
247
|
|
|
248
248
|
// Abstract out the logic into its own function
|
|
249
249
|
var serializer = useMemoFromPropsDerivative(function (serializerProps) {
|
|
250
|
+
// If progressive rendering is enabled, create a new serializer
|
|
251
|
+
if (fg('cc_complexit_fe_progressive_adf_rendering')) {
|
|
252
|
+
var _props$createSerializ;
|
|
253
|
+
var newSerializer = (_props$createSerializ = props.createSerializer) === null || _props$createSerializ === void 0 ? void 0 : _props$createSerializ.call(props, serializerProps);
|
|
254
|
+
if (newSerializer) {
|
|
255
|
+
return newSerializer;
|
|
256
|
+
}
|
|
257
|
+
}
|
|
250
258
|
return new ReactSerializer(serializerProps);
|
|
251
259
|
}, deriveSerializerProps, props);
|
|
252
260
|
var localRef = useRef(null);
|
|
@@ -6,43 +6,27 @@ export function useMemoFromPropsDerivative(factory, propsDerivator, props) {
|
|
|
6
6
|
var prev = useRef(props);
|
|
7
7
|
var prevFactory = useRef(null);
|
|
8
8
|
return useMemo(function () {
|
|
9
|
-
var init = propsDerivator(props);
|
|
10
9
|
if (fg('cc_complexit_fe_reduce_fragment_serialization')) {
|
|
11
10
|
// check if the serializer is already created
|
|
12
11
|
var shouldCreate = !prevFactory.current;
|
|
13
12
|
// check each prop to see if value has changed and also check if the number of props has changed
|
|
14
13
|
if (prev.current !== props) {
|
|
15
|
-
// @ts-ignore - error TS2769: No overload matches this call.
|
|
16
14
|
var propsEntries = Object.entries(props);
|
|
17
|
-
|
|
18
|
-
// @ts-ignore - error TS2769: No overload matches this call.
|
|
19
|
-
var isLengthDifferent = propsEntries.length !== Object.keys(prev.current).length;
|
|
20
|
-
// @ts-ignore
|
|
21
|
-
var isValueDifferent = propsEntries.some(function (_ref) {
|
|
15
|
+
shouldCreate = propsEntries.length !== Object.keys(prev.current).length || propsEntries.some(function (_ref) {
|
|
22
16
|
var _ref2 = _slicedToArray(_ref, 2),
|
|
23
17
|
key = _ref2[0],
|
|
24
18
|
prop = _ref2[1];
|
|
25
19
|
return prev.current[key] !== prop;
|
|
26
20
|
});
|
|
27
|
-
shouldCreate = isLengthDifferent || isValueDifferent;
|
|
28
21
|
}
|
|
29
22
|
prev.current = props;
|
|
30
23
|
// If first time or any prop value has changed, create a new serializer
|
|
31
24
|
if (shouldCreate) {
|
|
32
|
-
prevFactory.current = factory(
|
|
25
|
+
prevFactory.current = factory(propsDerivator(props));
|
|
33
26
|
}
|
|
27
|
+
return prevFactory.current;
|
|
34
28
|
}
|
|
35
|
-
|
|
36
|
-
// If progressive rendering is enabled, create a new serializer
|
|
37
|
-
if (fg('cc_complexit_fe_progressive_adf_rendering')) {
|
|
38
|
-
var _props$createSerializ;
|
|
39
|
-
// @ts-ignore - erorr TS2339 Property 'createSerializer' does not exist on type 'Props'.
|
|
40
|
-
var newSerializer = (_props$createSerializ = props.createSerializer) === null || _props$createSerializ === void 0 ? void 0 : _props$createSerializ.call(props, init);
|
|
41
|
-
if (newSerializer) {
|
|
42
|
-
return newSerializer;
|
|
43
|
-
}
|
|
44
|
-
}
|
|
45
|
-
return fg('cc_complexit_fe_reduce_fragment_serialization') ? prevFactory.current : factory(init);
|
|
29
|
+
return factory(propsDerivator(props));
|
|
46
30
|
},
|
|
47
31
|
// To keep deps consistent, here disable the exhaustive-deps rule to drop factory from the deps array
|
|
48
32
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export declare function useMemoFromPropsDerivative<Memo, PropsDerivative, Props
|
|
1
|
+
export declare function useMemoFromPropsDerivative<Memo, PropsDerivative, Props extends Record<string, any>>(factory: (propsDerivative: PropsDerivative) => Memo, propsDerivator: (props: Props) => PropsDerivative, props: Props): Memo | null;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export declare function useMemoFromPropsDerivative<Memo, PropsDerivative, Props
|
|
1
|
+
export declare function useMemoFromPropsDerivative<Memo, PropsDerivative, Props extends Record<string, any>>(factory: (propsDerivative: PropsDerivative) => Memo, propsDerivator: (props: Props) => PropsDerivative, props: Props): Memo | null;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/renderer",
|
|
3
|
-
"version": "115.0.
|
|
3
|
+
"version": "115.0.2",
|
|
4
4
|
"description": "Renderer component",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -50,12 +50,12 @@
|
|
|
50
50
|
"@atlaskit/media-viewer": "^52.0.0",
|
|
51
51
|
"@atlaskit/platform-feature-flags": "^1.1.0",
|
|
52
52
|
"@atlaskit/platform-feature-flags-react": "^0.2.0",
|
|
53
|
-
"@atlaskit/react-ufo": "^3.
|
|
54
|
-
"@atlaskit/smart-card": "^
|
|
53
|
+
"@atlaskit/react-ufo": "^3.10.0",
|
|
54
|
+
"@atlaskit/smart-card": "^37.0.0",
|
|
55
55
|
"@atlaskit/status": "^3.0.0",
|
|
56
56
|
"@atlaskit/task-decision": "^19.2.0",
|
|
57
57
|
"@atlaskit/theme": "^18.0.0",
|
|
58
|
-
"@atlaskit/tmp-editor-statsig": "^4.
|
|
58
|
+
"@atlaskit/tmp-editor-statsig": "^4.18.0",
|
|
59
59
|
"@atlaskit/tokens": "^4.8.0",
|
|
60
60
|
"@atlaskit/tooltip": "^20.0.0",
|
|
61
61
|
"@atlaskit/visually-hidden": "^3.0.0",
|
|
@@ -176,9 +176,6 @@
|
|
|
176
176
|
"platform_editor_table_col_calculation_fix": {
|
|
177
177
|
"type": "boolean"
|
|
178
178
|
},
|
|
179
|
-
"platform_editor_legacy_content_macro": {
|
|
180
|
-
"type": "boolean"
|
|
181
|
-
},
|
|
182
179
|
"platform_editor_accessible_heading_copy_link": {
|
|
183
180
|
"type": "boolean"
|
|
184
181
|
},
|