@atlaskit/renderer 82.0.0 → 82.1.0

package/CHANGELOG.md

@@ -1,5 +1,15 @@
 # @atlaskit/renderer
 
+## 82.1.0
+
+### Minor Changes
+
+- [`c80c71b537d`](https://bitbucket.org/atlassian/atlassian-frontend/commits/c80c71b537d) - [ux] ED-13860 add bidi warning decorations to code components
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 82.0.0
 
 ### Major Changes

package/dist/cjs/react/marks/code.js

@@ -5,16 +5,31 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = Code;
+exports.CodeWithIntl = CodeWithIntl;
+exports.default = void 0;
 
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 
 var _react = _interopRequireDefault(require("react"));
 
+var _reactIntl = require("react-intl");
+
 var _inline = _interopRequireDefault(require("@atlaskit/code/inline"));
 
-function Code(props) {
+var _messages = require("@atlaskit/editor-common/messages");
+
+var _useFeatureFlags = require("../../use-feature-flags");
+
+function CodeWithIntl(props) {
+  var featureFlags = (0, _useFeatureFlags.useFeatureFlags)();
+  var codeBidiWarningLabel = props.intl.formatMessage(_messages.codeBidiWarningMessages.label);
   return /*#__PURE__*/_react.default.createElement(_inline.default, (0, _extends2.default)({
-    className: "code"
+    className: "code",
+    codeBidiWarnings: featureFlags === null || featureFlags === void 0 ? void 0 : featureFlags.codeBidiWarnings,
+    codeBidiWarningLabel: codeBidiWarningLabel
   }, props.dataAttributes), props.children);
-}
+}
+
+var _default = (0, _reactIntl.injectIntl)(CodeWithIntl);
+
+exports.default = _default;

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

@@ -11,6 +11,8 @@ var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/hel
 
 var _react = _interopRequireDefault(require("react"));
 
+var _reactIntl = require("react-intl");
+
 var _styledComponents = _interopRequireDefault(require("styled-components"));
 
 var _code = require("@atlaskit/code");
@@ -23,6 +25,10 @@ var _components = require("@atlaskit/theme/components");
 
 var _constants = require("@atlaskit/theme/constants");
 
+var _messages = require("@atlaskit/editor-common/messages");
+
+var _useFeatureFlags = require("../../use-feature-flags");
+
 var _codeBlockCopyButton = _interopRequireDefault(require("./codeBlockCopyButton"));
 
 var _templateObject;
@@ -32,6 +38,8 @@ function CodeBlock(props) {
       language = props.language,
       _props$allowCopyToCli = props.allowCopyToClipboard,
       allowCopyToClipboard = _props$allowCopyToCli === void 0 ? false : _props$allowCopyToCli;
+  var featureFlags = (0, _useFeatureFlags.useFeatureFlags)();
+  var codeBidiWarningLabel = props.intl.formatMessage(_messages.codeBidiWarningMessages.label);
   var className = ['code-block', props.className].join(' ');
   return /*#__PURE__*/_react.default.createElement("div", {
     className: className
@@ -39,11 +47,15 @@ function CodeBlock(props) {
     content: text
   }) : null, /*#__PURE__*/_react.default.createElement(_code.CodeBlock, {
     language: language,
-    text: text
+    text: text,
+    codeBidiWarnings: featureFlags === null || featureFlags === void 0 ? void 0 : featureFlags.codeBidiWarnings,
+    codeBidiWarningLabel: codeBidiWarningLabel
   }));
 }
 
-var _default = (0, _styledComponents.default)(CodeBlock)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  tab-size: 4;\n  [data-ds--code--code-block] {\n    font-size: ", ";\n    line-height: 1.5rem;\n    background-image: ", ";\n    background-attachment: local, scroll, scroll;\n    background-position: 100% 0, 100% 0, 0 0;\n  }\n"])), (0, _editorSharedStyles.relativeFontSizeToBase16)((0, _constants.fontSize)()), (0, _editorSharedStyles.overflowShadow)({
+var IntlCodeBlock = (0, _reactIntl.injectIntl)(CodeBlock);
+
+var _default = (0, _styledComponents.default)(IntlCodeBlock)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  tab-size: 4;\n  [data-ds--code--code-block] {\n    font-size: ", ";\n    line-height: 1.5rem;\n    background-image: ", ";\n    background-attachment: local, scroll, scroll;\n    background-position: 100% 0, 100% 0, 0 0;\n  }\n"])), (0, _editorSharedStyles.relativeFontSizeToBase16)((0, _constants.fontSize)()), (0, _editorSharedStyles.overflowShadow)({
   background: (0, _components.themed)({
     light: _colors.N20,
     dark: _colors.DN50

package/dist/cjs/version.json

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

package/dist/es2019/react/marks/code.js

@@ -1,8 +1,16 @@
 import _extends from "@babel/runtime/helpers/extends";
 import React from 'react';
+import { injectIntl } from 'react-intl';
 import AkCode from '@atlaskit/code/inline';
-export default function Code(props) {
+import { codeBidiWarningMessages } from '@atlaskit/editor-common/messages';
+import { useFeatureFlags } from '../../use-feature-flags';
+export function CodeWithIntl(props) {
+  const featureFlags = useFeatureFlags();
+  const codeBidiWarningLabel = props.intl.formatMessage(codeBidiWarningMessages.label);
   return /*#__PURE__*/React.createElement(AkCode, _extends({
-    className: "code"
+    className: "code",
+    codeBidiWarnings: featureFlags === null || featureFlags === void 0 ? void 0 : featureFlags.codeBidiWarnings,
+    codeBidiWarningLabel: codeBidiWarningLabel
   }, props.dataAttributes), props.children);
-}
+}
+export default injectIntl(CodeWithIntl);

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

@@ -1,10 +1,13 @@
 import React from 'react';
+import { injectIntl } from 'react-intl';
 import styled from 'styled-components';
 import { CodeBlock as AkCodeBlock } from '@atlaskit/code';
 import { overflowShadow, relativeFontSizeToBase16 } from '@atlaskit/editor-shared-styles';
 import { N20, DN50 } from '@atlaskit/theme/colors';
 import { themed } from '@atlaskit/theme/components';
 import { fontSize, gridSize } from '@atlaskit/theme/constants';
+import { codeBidiWarningMessages } from '@atlaskit/editor-common/messages';
+import { useFeatureFlags } from '../../use-feature-flags';
 import CopyButton from './codeBlockCopyButton';
 
 function CodeBlock(props) {
@@ -13,6 +16,8 @@ function CodeBlock(props) {
     language,
     allowCopyToClipboard = false
   } = props;
+  const featureFlags = useFeatureFlags();
+  const codeBidiWarningLabel = props.intl.formatMessage(codeBidiWarningMessages.label);
   const className = ['code-block', props.className].join(' ');
   return /*#__PURE__*/React.createElement("div", {
     className: className
@@ -20,11 +25,14 @@ function CodeBlock(props) {
     content: text
   }) : null, /*#__PURE__*/React.createElement(AkCodeBlock, {
     language: language,
-    text: text
+    text: text,
+    codeBidiWarnings: featureFlags === null || featureFlags === void 0 ? void 0 : featureFlags.codeBidiWarnings,
+    codeBidiWarningLabel: codeBidiWarningLabel
   }));
 }
 
-export default styled(CodeBlock)`
+const IntlCodeBlock = injectIntl(CodeBlock);
+export default styled(IntlCodeBlock)`
   tab-size: 4;
   [data-ds--code--code-block] {
     font-size: ${relativeFontSizeToBase16(fontSize())};

package/dist/es2019/version.json

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

package/dist/esm/react/marks/code.js

@@ -1,8 +1,16 @@
 import _extends from "@babel/runtime/helpers/extends";
 import React from 'react';
+import { injectIntl } from 'react-intl';
 import AkCode from '@atlaskit/code/inline';
-export default function Code(props) {
+import { codeBidiWarningMessages } from '@atlaskit/editor-common/messages';
+import { useFeatureFlags } from '../../use-feature-flags';
+export function CodeWithIntl(props) {
+  var featureFlags = useFeatureFlags();
+  var codeBidiWarningLabel = props.intl.formatMessage(codeBidiWarningMessages.label);
   return /*#__PURE__*/React.createElement(AkCode, _extends({
-    className: "code"
+    className: "code",
+    codeBidiWarnings: featureFlags === null || featureFlags === void 0 ? void 0 : featureFlags.codeBidiWarnings,
+    codeBidiWarningLabel: codeBidiWarningLabel
   }, props.dataAttributes), props.children);
-}
+}
+export default injectIntl(CodeWithIntl);

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

@@ -3,12 +3,15 @@ import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral
 var _templateObject;
 
 import React from 'react';
+import { injectIntl } from 'react-intl';
 import styled from 'styled-components';
 import { CodeBlock as AkCodeBlock } from '@atlaskit/code';
 import { overflowShadow, relativeFontSizeToBase16 } from '@atlaskit/editor-shared-styles';
 import { N20, DN50 } from '@atlaskit/theme/colors';
 import { themed } from '@atlaskit/theme/components';
 import { fontSize, gridSize } from '@atlaskit/theme/constants';
+import { codeBidiWarningMessages } from '@atlaskit/editor-common/messages';
+import { useFeatureFlags } from '../../use-feature-flags';
 import CopyButton from './codeBlockCopyButton';
 
 function CodeBlock(props) {
@@ -16,6 +19,8 @@ function CodeBlock(props) {
       language = props.language,
       _props$allowCopyToCli = props.allowCopyToClipboard,
       allowCopyToClipboard = _props$allowCopyToCli === void 0 ? false : _props$allowCopyToCli;
+  var featureFlags = useFeatureFlags();
+  var codeBidiWarningLabel = props.intl.formatMessage(codeBidiWarningMessages.label);
   var className = ['code-block', props.className].join(' ');
   return /*#__PURE__*/React.createElement("div", {
     className: className
@@ -23,11 +28,14 @@ function CodeBlock(props) {
     content: text
   }) : null, /*#__PURE__*/React.createElement(AkCodeBlock, {
     language: language,
-    text: text
+    text: text,
+    codeBidiWarnings: featureFlags === null || featureFlags === void 0 ? void 0 : featureFlags.codeBidiWarnings,
+    codeBidiWarningLabel: codeBidiWarningLabel
   }));
 }
 
-export default styled(CodeBlock)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  tab-size: 4;\n  [data-ds--code--code-block] {\n    font-size: ", ";\n    line-height: 1.5rem;\n    background-image: ", ";\n    background-attachment: local, scroll, scroll;\n    background-position: 100% 0, 100% 0, 0 0;\n  }\n"])), relativeFontSizeToBase16(fontSize()), overflowShadow({
+var IntlCodeBlock = injectIntl(CodeBlock);
+export default styled(IntlCodeBlock)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  tab-size: 4;\n  [data-ds--code--code-block] {\n    font-size: ", ";\n    line-height: 1.5rem;\n    background-image: ", ";\n    background-attachment: local, scroll, scroll;\n    background-position: 100% 0, 100% 0, 0 0;\n  }\n"])), relativeFontSizeToBase16(fontSize()), overflowShadow({
   background: themed({
     light: N20,
     dark: DN50

package/dist/esm/version.json

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

package/dist/types/react/marks/code.d.ts

@@ -1,2 +1,8 @@
+import React from 'react';
+import { InjectedIntlProps } from 'react-intl';
 import type { MarkProps } from '../types';
-export default function Code(props: MarkProps): JSX.Element;
+export declare function CodeWithIntl(props: MarkProps & InjectedIntlProps): JSX.Element;
+declare const _default: React.ComponentClass<import("../types").MarkMeta, any> & {
+    WrappedComponent: ReactIntl.ComponentConstructor<import("../types").MarkMeta & InjectedIntlProps>;
+};
+export default _default;

package/dist/types/renderer-context.d.ts

@@ -1,5 +1,7 @@
 import React from 'react';
-export declare type FeatureFlags = {};
+export declare type FeatureFlags = {
+    codeBidiWarnings?: boolean;
+};
 export declare type RendererContextProps = {
     featureFlags?: FeatureFlags;
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/renderer",
-  "version": "82.0.0",
+  "version": "82.1.0",
   "description": "Renderer component",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -30,8 +30,8 @@
     "@atlaskit/analytics-namespaced-context": "^6.3.0",
     "@atlaskit/analytics-next": "^8.2.0",
     "@atlaskit/button": "^16.1.0",
-    "@atlaskit/code": "^14.1.0",
-    "@atlaskit/editor-common": "^60.2.0",
+    "@atlaskit/code": "^14.2.0",
+    "@atlaskit/editor-common": "^60.3.0",
     "@atlaskit/editor-json-transformer": "^8.6.0",
     "@atlaskit/editor-shared-styles": "^1.6.0",
     "@atlaskit/icon": "^21.9.0",
@@ -69,7 +69,7 @@
     "@atlaskit/build-utils": "^2.6.2",
     "@atlaskit/css-reset": "^6.2.0",
     "@atlaskit/docs": "*",
-    "@atlaskit/editor-core": "^151.0.0",
+    "@atlaskit/editor-core": "^151.1.0",
     "@atlaskit/editor-test-helpers": "^15.5.0",
     "@atlaskit/field-range": "^9.0.0",
     "@atlaskit/logo": "^13.5.0",