@atlaskit/renderer 108.6.11 → 108.7.1

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # @atlaskit/renderer
 
+## 108.7.1
+
+### Patch Changes
+
+- [`4fe49c40988`](https://bitbucket.org/atlassian/atlassian-frontend/commits/4fe49c40988) - [ux] ED-18966 fix default table in renderer full-width appearance mode
+
+## 108.7.0
+
+### Minor Changes
+
+- [`5f028fb62a1`](https://bitbucket.org/atlassian/atlassian-frontend/commits/5f028fb62a1) - ED-19038 added mediaSingle.widthType support to renderer.
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 108.6.11
 
 ### Patch Changes

package/dist/cjs/react/nodes/mediaSingle/index.js

@@ -55,7 +55,8 @@ var MediaSingle = function MediaSingle(props) {
     isInsideOfBlockNode = props.isInsideOfBlockNode,
     layout = props.layout,
     children = props.children,
-    pctWidth = props.width;
+    widthAttr = props.width,
+    widthType = props.widthType;
   var isCaptionsFlaggedOn = (0, _mediaCommon.getMediaFeatureFlag)('captions', featureFlags);
   var _React$useState = _react.default.useState({
       width: 0,
@@ -163,7 +164,10 @@ var MediaSingle = function MediaSingle(props) {
       height: height,
       lineLength: isInsideOfBlockNode ? containerWidth : lineLength,
       containerWidth: containerWidth,
-      pctWidth: pctWidth,
+      size: {
+        width: widthAttr,
+        widthType: widthType
+      },
       fullWidthMode: isFullWidth
     }, (0, _react2.jsx)(_react.Fragment, null, mediaComponent), isCaptionsFlaggedOn && caption);
   };

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

@@ -258,8 +258,11 @@ var TableContainer = /*#__PURE__*/function (_React$Component) {
       var lineLength = _editorSharedStyles.akEditorDefaultLayoutWidth;
       var tableWidth;
       var left;
+      var calcDefaultLayoutWidthByAppearance = function calcDefaultLayoutWidthByAppearance(tableNode, rendererAppearance) {
+        return rendererAppearance === 'full-width' && !tableNode.attrs.width ? Math.min(_editorSharedStyles.akEditorFullWidthLayoutWidth, renderWidth) : Math.min((0, _nodeWidth.getTableContainerWidth)(tableNode), renderWidth);
+      };
       if ((0, _platformFeatureFlags.getBooleanFF)('platform.editor.custom-table-width') && tableNode) {
-        tableWidth = Math.min((0, _nodeWidth.getTableContainerWidth)(tableNode), renderWidth);
+        tableWidth = calcDefaultLayoutWidthByAppearance(tableNode, rendererAppearance);
       } else {
         tableWidth = (0, _styles.calcTableWidth)(layout, renderWidth, false);
       }

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

@@ -55,7 +55,7 @@ exports.NORMAL_SEVERITY_THRESHOLD = NORMAL_SEVERITY_THRESHOLD;
 var DEGRADED_SEVERITY_THRESHOLD = 3000;
 exports.DEGRADED_SEVERITY_THRESHOLD = DEGRADED_SEVERITY_THRESHOLD;
 var packageName = "@atlaskit/renderer";
-var packageVersion = "108.6.11";
+var packageVersion = "108.7.1";
 var Renderer = /*#__PURE__*/function (_PureComponent) {
   (0, _inherits2.default)(Renderer, _PureComponent);
   var _super = _createSuper(Renderer);

package/dist/cjs/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/renderer",
-	"version": "108.6.11",
+	"version": "108.7.1",
 	"sideEffects": false
 }

package/dist/es2019/react/nodes/mediaSingle/index.js

@@ -42,7 +42,8 @@ const MediaSingle = props => {
     isInsideOfBlockNode,
     layout,
     children,
-    width: pctWidth
+    width: widthAttr,
+    widthType
   } = props;
   const isCaptionsFlaggedOn = getMediaFeatureFlag('captions', featureFlags);
   const [externalImageDimensions, setExternalImageDimensions] = React.useState({
@@ -148,7 +149,10 @@ const MediaSingle = props => {
       height: height,
       lineLength: isInsideOfBlockNode ? containerWidth : lineLength,
       containerWidth: containerWidth,
-      pctWidth: pctWidth,
+      size: {
+        width: widthAttr,
+        widthType
+      },
       fullWidthMode: isFullWidth
     }, jsx(Fragment, null, mediaComponent), isCaptionsFlaggedOn && caption);
   };

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

@@ -8,6 +8,7 @@ import { SortOrder } from '@atlaskit/editor-common/types';
 import { akEditorDefaultLayoutWidth } from '@atlaskit/editor-shared-styles';
 import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 import { getTableContainerWidth } from '@atlaskit/editor-common/node-width';
+import { akEditorFullWidthLayoutWidth } from '@atlaskit/editor-shared-styles';
 import { FullPagePadding } from '../../ui/Renderer/style';
 import { TableHeader } from './tableCell';
 import { withSmartCardStorage } from '../../ui/SmartCardStorage';
@@ -217,8 +218,11 @@ export class TableContainer extends React.Component {
     const lineLength = akEditorDefaultLayoutWidth;
     let tableWidth;
     let left;
+    const calcDefaultLayoutWidthByAppearance = (tableNode, rendererAppearance) => {
+      return rendererAppearance === 'full-width' && !tableNode.attrs.width ? Math.min(akEditorFullWidthLayoutWidth, renderWidth) : Math.min(getTableContainerWidth(tableNode), renderWidth);
+    };
     if (getBooleanFF('platform.editor.custom-table-width') && tableNode) {
-      tableWidth = Math.min(getTableContainerWidth(tableNode), renderWidth);
+      tableWidth = calcDefaultLayoutWidthByAppearance(tableNode, rendererAppearance);
     } else {
       tableWidth = calcTableWidth(layout, renderWidth, false);
     }

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

@@ -35,7 +35,7 @@ import { RenderTracking } from '../../react/utils/performance/RenderTracking';
 export const NORMAL_SEVERITY_THRESHOLD = 2000;
 export const DEGRADED_SEVERITY_THRESHOLD = 3000;
 const packageName = "@atlaskit/renderer";
-const packageVersion = "108.6.11";
+const packageVersion = "108.7.1";
 export class Renderer extends PureComponent {
   constructor(props) {
     super(props);

package/dist/es2019/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/renderer",
-	"version": "108.6.11",
+	"version": "108.7.1",
 	"sideEffects": false
 }

package/dist/esm/react/nodes/mediaSingle/index.js

@@ -43,7 +43,8 @@ var MediaSingle = function MediaSingle(props) {
     isInsideOfBlockNode = props.isInsideOfBlockNode,
     layout = props.layout,
     children = props.children,
-    pctWidth = props.width;
+    widthAttr = props.width,
+    widthType = props.widthType;
   var isCaptionsFlaggedOn = getMediaFeatureFlag('captions', featureFlags);
   var _React$useState = React.useState({
       width: 0,
@@ -151,7 +152,10 @@ var MediaSingle = function MediaSingle(props) {
       height: height,
       lineLength: isInsideOfBlockNode ? containerWidth : lineLength,
       containerWidth: containerWidth,
-      pctWidth: pctWidth,
+      size: {
+        width: widthAttr,
+        widthType: widthType
+      },
       fullWidthMode: isFullWidth
     }, jsx(Fragment, null, mediaComponent), isCaptionsFlaggedOn && caption);
   };

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

@@ -16,6 +16,7 @@ import { SortOrder } from '@atlaskit/editor-common/types';
 import { akEditorDefaultLayoutWidth } from '@atlaskit/editor-shared-styles';
 import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 import { getTableContainerWidth } from '@atlaskit/editor-common/node-width';
+import { akEditorFullWidthLayoutWidth } from '@atlaskit/editor-shared-styles';
 import { FullPagePadding } from '../../ui/Renderer/style';
 import { TableHeader } from './tableCell';
 import { withSmartCardStorage } from '../../ui/SmartCardStorage';
@@ -251,8 +252,11 @@ export var TableContainer = /*#__PURE__*/function (_React$Component) {
       var lineLength = akEditorDefaultLayoutWidth;
       var tableWidth;
       var left;
+      var calcDefaultLayoutWidthByAppearance = function calcDefaultLayoutWidthByAppearance(tableNode, rendererAppearance) {
+        return rendererAppearance === 'full-width' && !tableNode.attrs.width ? Math.min(akEditorFullWidthLayoutWidth, renderWidth) : Math.min(getTableContainerWidth(tableNode), renderWidth);
+      };
       if (getBooleanFF('platform.editor.custom-table-width') && tableNode) {
-        tableWidth = Math.min(getTableContainerWidth(tableNode), renderWidth);
+        tableWidth = calcDefaultLayoutWidthByAppearance(tableNode, rendererAppearance);
       } else {
         tableWidth = calcTableWidth(layout, renderWidth, false);
       }

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

@@ -45,7 +45,7 @@ import { RenderTracking } from '../../react/utils/performance/RenderTracking';
 export var NORMAL_SEVERITY_THRESHOLD = 2000;
 export var DEGRADED_SEVERITY_THRESHOLD = 3000;
 var packageName = "@atlaskit/renderer";
-var packageVersion = "108.6.11";
+var packageVersion = "108.7.1";
 export var Renderer = /*#__PURE__*/function (_PureComponent) {
   _inherits(Renderer, _PureComponent);
   var _super = _createSuper(Renderer);

package/dist/esm/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/renderer",
-	"version": "108.6.11",
+	"version": "108.7.1",
 	"sideEffects": false
 }

package/dist/types/react/nodes/mediaSingle/index.d.ts

@@ -3,7 +3,7 @@ import { default as React } from 'react';
 import { WrappedComponentProps } from 'react-intl-next';
 import { RichMediaLayout as MediaSingleLayout } from '@atlaskit/adf-schema';
 import { MediaFeatureFlags } from '@atlaskit/media-common';
-import type { EventHandlers } from '@atlaskit/editor-common/ui';
+import type { EventHandlers, MediaSingleWidthType } from '@atlaskit/editor-common/ui';
 import { AnalyticsEventPayload } from '../../../analytics/events';
 import { RendererAppearance } from '../../../ui/Renderer/types';
 export interface Props {
@@ -11,6 +11,7 @@ export interface Props {
     layout: MediaSingleLayout;
     eventHandlers?: EventHandlers;
     width?: number;
+    widthType?: MediaSingleWidthType;
     isInsideOfBlockNode?: boolean;
     rendererAppearance: RendererAppearance;
     fireAnalyticsEvent?: (event: AnalyticsEventPayload) => void;

package/dist/types-ts4.5/react/nodes/mediaSingle/index.d.ts

@@ -3,7 +3,7 @@ import { default as React } from 'react';
 import { WrappedComponentProps } from 'react-intl-next';
 import { RichMediaLayout as MediaSingleLayout } from '@atlaskit/adf-schema';
 import { MediaFeatureFlags } from '@atlaskit/media-common';
-import type { EventHandlers } from '@atlaskit/editor-common/ui';
+import type { EventHandlers, MediaSingleWidthType } from '@atlaskit/editor-common/ui';
 import { AnalyticsEventPayload } from '../../../analytics/events';
 import { RendererAppearance } from '../../../ui/Renderer/types';
 export interface Props {
@@ -11,6 +11,7 @@ export interface Props {
     layout: MediaSingleLayout;
     eventHandlers?: EventHandlers;
     width?: number;
+    widthType?: MediaSingleWidthType;
     isInsideOfBlockNode?: boolean;
     rendererAppearance: RendererAppearance;
     fireAnalyticsEvent?: (event: AnalyticsEventPayload) => void;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/renderer",
-  "version": "108.6.11",
+  "version": "108.7.1",
   "description": "Renderer component",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -31,7 +31,7 @@
     "@atlaskit/analytics-next": "^9.1.0",
     "@atlaskit/button": "^16.8.0",
     "@atlaskit/code": "^14.6.0",
-    "@atlaskit/editor-common": "^74.22.0",
+    "@atlaskit/editor-common": "^74.23.0",
     "@atlaskit/editor-json-transformer": "^8.10.0",
     "@atlaskit/editor-palette": "1.5.1",
     "@atlaskit/editor-shared-styles": "^2.4.0",
@@ -69,6 +69,7 @@
     "react-dom": "^16.8.0"
   },
   "devDependencies": {
+    "@af/visual-regression": "*",
     "@atlaskit/analytics-gas-types": "^5.1.0",
     "@atlaskit/css-reset": "^6.5.0",
     "@atlaskit/editor-core": "^186.0.0",