@atlaskit/renderer 111.1.3 → 111.1.5

package/CHANGELOG.md

@@ -1,5 +1,22 @@
 # @atlaskit/renderer
 
+## 111.1.5
+
+### Patch Changes
+
+- [#149031](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/149031)
+  [`e6c17327bfead`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/e6c17327bfead) -
+  Adds presentation role to hr tag for accessibility compliance
+
+## 111.1.4
+
+### Patch Changes
+
+- [#148229](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/148229)
+  [`e79a40a7122b6`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/e79a40a7122b6) -
+  Fix table offset in renderer when SSR fix is enabled
+- Updated dependencies
+
 ## 111.1.3
 
 ### Patch Changes

package/dist/cjs/react/nodes/rule.js

@@ -7,5 +7,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = Rule;
 var _react = _interopRequireDefault(require("react"));
 function Rule() {
-  return /*#__PURE__*/_react.default.createElement("hr", null);
+  return /*#__PURE__*/_react.default.createElement("hr", {
+    role: "presentation"
+  });
 }

package/dist/cjs/react/nodes/table.js

@@ -124,9 +124,6 @@ var isHeaderRowEnabled = function isHeaderRowEnabled(rows) {
 var tableCanBeSticky = function tableCanBeSticky(node, children) {
   return isHeaderRowEnabled(children) && node && node.firstChild && !hasRowspan(node.firstChild);
 };
-var canUseLinelength = function canUseLinelength(appearance) {
-  return appearance === 'full-page';
-};
 var TableContainer = exports.TableContainer = /*#__PURE__*/function (_React$Component) {
   (0, _inherits2.default)(TableContainer, _React$Component);
   var _super = _createSuper(TableContainer);
@@ -363,9 +360,17 @@ var TableContainer = exports.TableContainer = /*#__PURE__*/function (_React$Comp
         left = (tableWidth - lineLength) / 2;
         leftCSS = "(".concat(tableWidthCSS, " - ").concat(lineLengthCSS, ") / 2");
       }
-      if (!shouldCalculateLeftForAlignment && canUseLinelength(rendererAppearance) && tableWidthNew > lineLengthFixedWidth) {
-        left = lineLengthFixedWidth / 2 - tableWidth / 2;
-        leftCSS = "".concat(lineLengthCSS, " / 2 - ").concat(tableWidthCSS, " / 2");
+      if (fixTableSSRResizing) {
+        if (!shouldCalculateLeftForAlignment && (0, _appearance.isFullPageAppearance)(rendererAppearance)) {
+          // Note tableWidthCSS here is the renderer width
+          // When the screen is super wide we want table to break out.
+          // However if screen is smaller than 760px. We want table align to left.
+          leftCSS = "min(0px, ".concat(lineLengthCSS, " - ").concat(tableWidthCSS, ") / 2");
+        }
+      } else {
+        if (!shouldCalculateLeftForAlignment && (0, _appearance.isFullPageAppearance)(rendererAppearance) && tableWidthNew > lineLengthFixedWidth) {
+          left = lineLengthFixedWidth / 2 - tableWidth / 2;
+        }
       }
       var children = _react.default.Children.toArray(this.props.children);
 

package/dist/cjs/ui/Renderer/index.js

@@ -65,7 +65,7 @@ function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.
 var NORMAL_SEVERITY_THRESHOLD = exports.NORMAL_SEVERITY_THRESHOLD = 2000;
 var DEGRADED_SEVERITY_THRESHOLD = exports.DEGRADED_SEVERITY_THRESHOLD = 3000;
 var packageName = "@atlaskit/renderer";
-var packageVersion = "111.1.3";
+var packageVersion = "111.1.5";
 var setAsQueryContainerStyles = (0, _react2.css)({
   containerName: 'ak-renderer-wrapper',
   containerType: 'inline-size',

package/dist/es2019/react/nodes/rule.js

@@ -1,4 +1,6 @@
 import React from 'react';
 export default function Rule() {
-  return /*#__PURE__*/React.createElement("hr", null);
+  return /*#__PURE__*/React.createElement("hr", {
+    role: "presentation"
+  });
 }

package/dist/es2019/react/nodes/table.js

@@ -92,7 +92,6 @@ const isHeaderRowEnabled = rows => {
 const tableCanBeSticky = (node, children) => {
   return isHeaderRowEnabled(children) && node && node.firstChild && !hasRowspan(node.firstChild);
 };
-const canUseLinelength = appearance => appearance === 'full-page';
 export class TableContainer extends React.Component {
   constructor(...args) {
     super(...args);
@@ -304,9 +303,17 @@ export class TableContainer extends React.Component {
       left = (tableWidth - lineLength) / 2;
       leftCSS = `(${tableWidthCSS} - ${lineLengthCSS}) / 2`;
     }
-    if (!shouldCalculateLeftForAlignment && canUseLinelength(rendererAppearance) && tableWidthNew > lineLengthFixedWidth) {
-      left = lineLengthFixedWidth / 2 - tableWidth / 2;
-      leftCSS = `${lineLengthCSS} / 2 - ${tableWidthCSS} / 2`;
+    if (fixTableSSRResizing) {
+      if (!shouldCalculateLeftForAlignment && isFullPageAppearance(rendererAppearance)) {
+        // Note tableWidthCSS here is the renderer width
+        // When the screen is super wide we want table to break out.
+        // However if screen is smaller than 760px. We want table align to left.
+        leftCSS = `min(0px, ${lineLengthCSS} - ${tableWidthCSS}) / 2`;
+      }
+    } else {
+      if (!shouldCalculateLeftForAlignment && isFullPageAppearance(rendererAppearance) && tableWidthNew > lineLengthFixedWidth) {
+        left = lineLengthFixedWidth / 2 - tableWidth / 2;
+      }
     }
     const children = React.Children.toArray(this.props.children);
 

package/dist/es2019/ui/Renderer/index.js

@@ -45,7 +45,7 @@ import { nodeToReact } from '../../react/nodes';
 export const NORMAL_SEVERITY_THRESHOLD = 2000;
 export const DEGRADED_SEVERITY_THRESHOLD = 3000;
 const packageName = "@atlaskit/renderer";
-const packageVersion = "111.1.3";
+const packageVersion = "111.1.5";
 const setAsQueryContainerStyles = css({
   containerName: 'ak-renderer-wrapper',
   containerType: 'inline-size',

package/dist/esm/react/nodes/rule.js

@@ -1,4 +1,6 @@
 import React from 'react';
 export default function Rule() {
-  return /*#__PURE__*/React.createElement("hr", null);
+  return /*#__PURE__*/React.createElement("hr", {
+    role: "presentation"
+  });
 }

package/dist/esm/react/nodes/table.js

@@ -117,9 +117,6 @@ var isHeaderRowEnabled = function isHeaderRowEnabled(rows) {
 var tableCanBeSticky = function tableCanBeSticky(node, children) {
   return isHeaderRowEnabled(children) && node && node.firstChild && !hasRowspan(node.firstChild);
 };
-var canUseLinelength = function canUseLinelength(appearance) {
-  return appearance === 'full-page';
-};
 export var TableContainer = /*#__PURE__*/function (_React$Component) {
   _inherits(TableContainer, _React$Component);
   var _super = _createSuper(TableContainer);
@@ -356,9 +353,17 @@ export var TableContainer = /*#__PURE__*/function (_React$Component) {
         left = (tableWidth - lineLength) / 2;
         leftCSS = "(".concat(tableWidthCSS, " - ").concat(lineLengthCSS, ") / 2");
       }
-      if (!shouldCalculateLeftForAlignment && canUseLinelength(rendererAppearance) && tableWidthNew > lineLengthFixedWidth) {
-        left = lineLengthFixedWidth / 2 - tableWidth / 2;
-        leftCSS = "".concat(lineLengthCSS, " / 2 - ").concat(tableWidthCSS, " / 2");
+      if (fixTableSSRResizing) {
+        if (!shouldCalculateLeftForAlignment && isFullPageAppearance(rendererAppearance)) {
+          // Note tableWidthCSS here is the renderer width
+          // When the screen is super wide we want table to break out.
+          // However if screen is smaller than 760px. We want table align to left.
+          leftCSS = "min(0px, ".concat(lineLengthCSS, " - ").concat(tableWidthCSS, ") / 2");
+        }
+      } else {
+        if (!shouldCalculateLeftForAlignment && isFullPageAppearance(rendererAppearance) && tableWidthNew > lineLengthFixedWidth) {
+          left = lineLengthFixedWidth / 2 - tableWidth / 2;
+        }
       }
       var children = React.Children.toArray(this.props.children);
 

package/dist/esm/ui/Renderer/index.js

@@ -55,7 +55,7 @@ import { nodeToReact } from '../../react/nodes';
 export var NORMAL_SEVERITY_THRESHOLD = 2000;
 export var DEGRADED_SEVERITY_THRESHOLD = 3000;
 var packageName = "@atlaskit/renderer";
-var packageVersion = "111.1.3";
+var packageVersion = "111.1.5";
 var setAsQueryContainerStyles = css({
   containerName: 'ak-renderer-wrapper',
   containerType: 'inline-size',

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/renderer",
-	"version": "111.1.3",
+	"version": "111.1.5",
 	"description": "Renderer component",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -29,7 +29,7 @@
 		"@atlaskit/analytics-next": "^10.1.0",
 		"@atlaskit/button": "^20.2.0",
 		"@atlaskit/code": "^15.6.0",
-		"@atlaskit/editor-common": "^93.0.0",
+		"@atlaskit/editor-common": "^93.1.0",
 		"@atlaskit/editor-json-transformer": "^8.18.0",
 		"@atlaskit/editor-palette": "1.6.1",
 		"@atlaskit/editor-prosemirror": "6.0.0",
@@ -37,7 +37,7 @@
 		"@atlaskit/emoji": "^67.8.0",
 		"@atlaskit/feature-gate-js-client": "^4.19.0",
 		"@atlaskit/icon": "^22.20.0",
-		"@atlaskit/link-datasource": "^3.3.0",
+		"@atlaskit/link-datasource": "^3.4.0",
 		"@atlaskit/media-card": "^78.5.0",
 		"@atlaskit/media-client": "^28.0.0",
 		"@atlaskit/media-client-react": "^2.2.0",
@@ -72,7 +72,6 @@
 		"@af/visual-regression": "*",
 		"@atlaskit/analytics-gas-types": "^5.1.0",
 		"@atlaskit/css-reset": "^6.11.0",
-		"@atlaskit/editor-test-helpers": "^19.0.0",
 		"@atlaskit/link-provider": "^1.16.0",
 		"@atlaskit/link-test-helpers": "^7.5.0",
 		"@atlaskit/linking-common": "^5.11.0",