@atlaskit/code 14.4.7 → 14.5.0

package/dist/esm/syntax-highlighter/index.js

@@ -0,0 +1,38 @@
+/**
+ * Original library: https://github.com/react-syntax-highlighter/react-syntax-highlighter
+ * All modifications by Atlassian
+ */
+
+/**
+ * MIT License
+ *
+ * Copyright (c) 2019 Conor Hastings
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
+
+/**
+ * __Syntax Highlighter__
+ *
+ * A syntax highlighter based on top of [refractor](https://github.com/wooorm/refractor).
+ * @atlaskit/code uses this under-the-hood, but it is not intended for public consumption.
+ * You should be using @atlaskit/code directly.
+ */
+import SyntaxHighlighter from './async';
+export default SyntaxHighlighter;

package/dist/esm/syntax-highlighter/lib/highlight.js

@@ -0,0 +1,84 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var _excluded = ["language", "testId", "text", "codeTagProps", "showLineNumbers", "shouldCreateParentElementForLines", "shouldWrapLongLines", "lineProps", "codeBidiWarnings", "codeBidiWarningLabel", "codeBidiWarningTooltipEnabled", "astGenerator"];
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+import { memo } from 'react';
+import processLines from './process';
+import ReactRenderer from './react-renderer';
+
+/**
+ * Takes in a code string and (in the default behaviour):
+ * - Uses refractor to turn it into a tree structure with highlighting metadata
+ * - Collapses this tree into lines for a renderer
+ * - Passes these lines to a React renderer
+ *
+ * In future, the final step could have a custom renderer.
+ */
+var Highlight = /*#__PURE__*/memo(function Highlight(_ref) {
+  var _ref$language = _ref.language,
+    language = _ref$language === void 0 ? 'text' : _ref$language,
+    testId = _ref.testId,
+    _ref$text = _ref.text,
+    text = _ref$text === void 0 ? '' : _ref$text,
+    _ref$codeTagProps = _ref.codeTagProps,
+    codeTagProps = _ref$codeTagProps === void 0 ? {
+      className: "language-".concat(language)
+    } : _ref$codeTagProps,
+    _ref$showLineNumbers = _ref.showLineNumbers,
+    showLineNumbers = _ref$showLineNumbers === void 0 ? false : _ref$showLineNumbers,
+    _ref$shouldCreatePare = _ref.shouldCreateParentElementForLines,
+    shouldCreateParentElementForLines = _ref$shouldCreatePare === void 0 ? false : _ref$shouldCreatePare,
+    _ref$shouldWrapLongLi = _ref.shouldWrapLongLines,
+    shouldWrapLongLines = _ref$shouldWrapLongLi === void 0 ? false : _ref$shouldWrapLongLi,
+    _ref$lineProps = _ref.lineProps,
+    lineProps = _ref$lineProps === void 0 ? {} : _ref$lineProps,
+    codeBidiWarnings = _ref.codeBidiWarnings,
+    codeBidiWarningLabel = _ref.codeBidiWarningLabel,
+    codeBidiWarningTooltipEnabled = _ref.codeBidiWarningTooltipEnabled,
+    _ref$astGenerator = _ref.astGenerator,
+    astGenerator = _ref$astGenerator === void 0 ? null : _ref$astGenerator,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  // TODO maybe we call this code or text everywhere; for now we match the API in
+  // @atlaskit/codeblock
+  var code = text;
+  var generatorClassName = 'prismjs';
+  var containerProps = _objectSpread(_objectSpread({}, rest), {}, {
+    'data-testid': testId,
+    className: rest.className ? "".concat(generatorClassName, " ").concat(rest.className) : generatorClassName
+  });
+  if (shouldWrapLongLines) {
+    codeTagProps.style = {
+      whiteSpace: 'pre-wrap',
+      wordBreak: 'break-word'
+    };
+  } else {
+    codeTagProps.style = {
+      whiteSpace: 'pre'
+    };
+  }
+  var codeBidiWarningConfig = {
+    codeBidiWarnings: codeBidiWarnings,
+    codeBidiWarningLabel: codeBidiWarningLabel,
+    codeBidiWarningTooltipEnabled: codeBidiWarningTooltipEnabled
+  };
+
+  // Tree + logic into rows
+  var rows = processLines({
+    astGenerator: astGenerator,
+    code: code,
+    language: language,
+    shouldCreateParentElementForLines: shouldCreateParentElementForLines || !!shouldWrapLongLines,
+    lineProps: lineProps,
+    showLineNumbers: showLineNumbers
+  });
+
+  // Rows + logic into a renderer
+  return ReactRenderer({
+    containerProps: containerProps,
+    codeTagProps: codeTagProps,
+    rows: rows,
+    codeBidiWarningConfig: codeBidiWarningConfig
+  });
+});
+export default Highlight;

package/dist/esm/syntax-highlighter/lib/process/create-line-element.js

@@ -0,0 +1,67 @@
+import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
+import getInlineLineNumber from './get-inline-line-number';
+export default function createLineElement(_ref) {
+  var children = _ref.children,
+    lineNumber = _ref.lineNumber,
+    showLineNumbers = _ref.showLineNumbers,
+    _ref$lineProps = _ref.lineProps,
+    lineProps = _ref$lineProps === void 0 ? {} : _ref$lineProps,
+    _ref$className = _ref.className,
+    className = _ref$className === void 0 ? [] : _ref$className;
+  var properties = typeof lineProps === 'function' ? lineProps(lineNumber) : lineProps;
+  properties.className = className;
+  var currentChildren = children;
+  if (lineNumber && showLineNumbers) {
+    // When syntax highlighting is NOT turned on, the entire LOC is just a single
+    // child. We can then happily create the line number and the LOC as siblings...
+    if (currentChildren.length === 1) {
+      currentChildren = [getInlineLineNumber(lineNumber)].concat(_toConsumableArray(currentChildren));
+    } else {
+      // ... However, when syntax highlighting IS on, a span is created for each
+      // tokenised node in the AST (eg. <span>import</span><span>React</span>).
+      // When shouldWrapLongLines is true, the row becomes `display: flex` and
+      // forces all its children to be equal height. This can be a source of
+      // visual bugs where a LOC is broken up weirdly into segments.
+      //
+      //  +---------------------------------------+
+      //  | row                                   |
+      //  |  +----+ +-------+ +--------+ +------+ |
+      //  |  |line| |key    | |keywords| |key   | |
+      //  |  |no. | |word   | |        | |word  | |
+      //  |  |    | |       | |        | |      | |
+      //  |  +----+ +-------+ +--------+ +------+ |
+      //  +---------------------------------------+
+      //
+      // Nesting the children one layer deeper (i.e. creating an extra span)
+      // ensures that the line number and the ENTIRE line of code are aligned by
+      // the parent flexbox (the row).
+      //
+      //  +---------------------------------------------+
+      //  | row                                         |
+      //  | +----+  +--------------------------------+  |
+      //  | |line|  | extra span we are creating     |  |
+      //  | |no. |  |  +-------+ +--------+ +------+ |  |
+      //  | |    |  |  |key    | |keywords| |key   | |  |
+      //  | |    |  |  |word   | |        | |word  | |  |
+      //  | |    |  |  |       | |        | |      | |  |
+      //  | |    |  |  +-------+ +--------+ +------+ |  |
+      //  | +----+  +--------------------------------+  |
+      //  +---------------------------------------------+
+      //
+      currentChildren = [getInlineLineNumber(lineNumber), {
+        type: 'element',
+        tagName: 'span',
+        properties: {
+          className: []
+        },
+        children: currentChildren
+      }];
+    }
+  }
+  return {
+    type: 'element',
+    tagName: 'span',
+    properties: properties,
+    children: currentChildren
+  };
+}

package/dist/esm/syntax-highlighter/lib/process/create-line.js

@@ -0,0 +1,24 @@
+import createLineElement from './create-line-element';
+import getInlineLineNumber from './get-inline-line-number';
+function createLineGenerator(lineProps, shouldCreateParentElementForLines, showLineNumbers) {
+  return function (children, lineNumber) {
+    var className = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : [];
+    // Needed for more complex line creation
+    if (shouldCreateParentElementForLines || className.length > 0) {
+      return createLineElement({
+        children: children,
+        lineNumber: lineNumber,
+        showLineNumbers: showLineNumbers,
+        lineProps: lineProps,
+        className: className
+      });
+    } else {
+      // Simple line creation without the bells and whistles
+      if (showLineNumbers && lineNumber) {
+        children.unshift(getInlineLineNumber(lineNumber));
+      }
+      return children;
+    }
+  };
+}
+export default createLineGenerator;

package/dist/esm/syntax-highlighter/lib/process/flatten-code-tree.js

@@ -0,0 +1,22 @@
+import createLineElement from './create-line-element';
+export default function flattenCodeTree(tree) {
+  var offset = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
+  var className = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : [];
+  var newTree = [];
+  for (var i = 0; i < tree.length; i++) {
+    var node = tree[i];
+    if (node.type === 'text') {
+      newTree.push(createLineElement({
+        children: [node],
+        lineNumber: offset,
+        className: className
+      }));
+    } else if (node.children) {
+      var classNames = className.concat(node.properties.className || []);
+      flattenCodeTree(node.children, offset + 1, classNames).forEach(function (i) {
+        return newTree.push(i);
+      });
+    }
+  }
+  return newTree;
+}

package/dist/esm/syntax-highlighter/lib/process/get-code-tree.js

@@ -0,0 +1,16 @@
+export default function getCodeTree(language, code, astGenerator) {
+  if (language === 'text' || !astGenerator) {
+    return [{
+      type: 'text',
+      value: code
+    }];
+  }
+  try {
+    return astGenerator.highlight(code, language);
+  } catch (e) {
+    return [{
+      type: 'text',
+      value: code
+    }];
+  }
+}

package/dist/esm/syntax-highlighter/lib/process/get-inline-line-number.js

@@ -0,0 +1,17 @@
+export default function getInlineLineNumber(lineNumber) {
+  return {
+    type: 'element',
+    tagName: 'span',
+    properties: {
+      key: "line-number--".concat(lineNumber),
+      className: ['comment', 'linenumber', 'ds-line-number'],
+      // We're placing the lineNumber in a data-attr on an empty span (hence the
+      // empty children array below). This allows CodeBlock to use CSS to
+      // generate the content in a pseudo-element, which is a fix for a bug
+      // where line numbers were being copied (CSS content can't be copied)
+      // https://product-fabric.atlassian.net/browse/DSP-2729
+      'data-ds--line-number': lineNumber
+    },
+    children: []
+  };
+}

package/dist/esm/syntax-highlighter/lib/process/index.js

@@ -0,0 +1,115 @@
+import createLineGenerator from './create-line';
+import createLineElement from './create-line-element';
+import flattenCodeTree from './flatten-code-tree';
+import getCodeTree from './get-code-tree';
+var newLineRegex = /\n/g;
+function getNewLines(str) {
+  return str.match(newLineRegex);
+}
+/**
+ * __Line Processor__
+ *
+ * A line processor, that uses refractor to turn code into a tree structure
+ * with highlighting metadata and collapses this tree into lines for a renderer.
+ */
+export default function processLines(_ref) {
+  var astGenerator = _ref.astGenerator,
+    code = _ref.code,
+    language = _ref.language,
+    shouldCreateParentElementForLines = _ref.shouldCreateParentElementForLines,
+    lineProps = _ref.lineProps,
+    showLineNumbers = _ref.showLineNumbers;
+  var codeTree = getCodeTree(language, code, astGenerator);
+  var startingLineNumber = 1;
+  var createLine = createLineGenerator(lineProps, shouldCreateParentElementForLines, showLineNumbers);
+  var newTree = [];
+  var lastLineBreakIndex = -1;
+  var index = 0;
+
+  // Seems odd we flatten the tree immediately - what work could we do on it more performantly than on the lines?
+  var tree = flattenCodeTree(codeTree);
+  var _loop = function _loop() {
+    var testNode = tree[index];
+    if (testNode.type === 'text') {
+      index++;
+      return "continue";
+    }
+    var node = testNode;
+    var firstChildNode = node.children[0];
+    if (firstChildNode.type === 'text') {
+      var value = firstChildNode.value;
+      var newLines = getNewLines(value);
+      if (newLines) {
+        var splitValue = value.split('\n');
+        splitValue.forEach(function (text, i) {
+          var lineNumber = newTree.length + startingLineNumber;
+          var newChild = {
+            type: 'text',
+            value: "".concat(text, "\n")
+          };
+
+          // if it's the first line
+          if (i === 0) {
+            var _children = tree.slice(lastLineBreakIndex + 1, index).concat(createLineElement({
+              children: [newChild],
+              className: node.properties.className,
+              lineNumber: lineNumber
+            }));
+            var _line = createLine(_children, lineNumber);
+            newTree.push(_line);
+
+            // if it's the last line
+          } else if (i === splitValue.length - 1) {
+            var nextNode = tree[index + 1];
+            var stringChild = nextNode && nextNode.children && nextNode.children[0];
+            // Similar to newChild above, but no newline
+            var lastLineInPreviousSpan = {
+              type: 'text',
+              value: "".concat(text)
+            };
+            if (stringChild) {
+              var newElem = createLineElement({
+                children: [lastLineInPreviousSpan],
+                className: node.properties.className,
+                lineNumber: lineNumber
+              });
+              tree.splice(index + 1, 0, newElem);
+            } else {
+              var _children2 = [lastLineInPreviousSpan];
+              var _line2 = createLine(_children2, lineNumber, node.properties.className);
+              newTree.push(_line2);
+            }
+
+            // if it's neither the first nor the last line
+          } else {
+            var _children3 = [newChild];
+            var _line3 = createLine(_children3, lineNumber, node.properties.className);
+            newTree.push(_line3);
+          }
+        });
+        lastLineBreakIndex = index;
+      }
+    }
+    index++;
+  };
+  while (index < tree.length) {
+    var _ret = _loop();
+    if (_ret === "continue") continue;
+  }
+  if (lastLineBreakIndex !== tree.length - 1) {
+    var children = tree.slice(lastLineBreakIndex + 1, tree.length);
+    if (children && children.length) {
+      var lineNumber = newTree.length + startingLineNumber;
+      var line = createLine(children, lineNumber);
+      newTree.push(line);
+    }
+  }
+  if (shouldCreateParentElementForLines) {
+    return newTree;
+  }
+
+  // If shouldCreateParentElementForLines was off, we still have a tree structure we need to flatten
+  // We have (RefractorNode | RefractorNode[])[] but need RefractorNode[]
+  // This seems like a code smell to review
+  return newTree.flat(1);
+}

package/dist/esm/syntax-highlighter/lib/react-renderer/create-children.js

@@ -0,0 +1,14 @@
+import createElement from './create-element';
+export default function createChildren(codeBidiWarningConfig) {
+  var childrenCount = 0;
+  return function (children) {
+    childrenCount += 1;
+    return children.map(function (child, i) {
+      return createElement({
+        node: child,
+        codeBidiWarningConfig: codeBidiWarningConfig,
+        key: "code-segment-".concat(childrenCount, "-").concat(i)
+      });
+    });
+  };
+}

package/dist/esm/syntax-highlighter/lib/react-renderer/create-element.js

@@ -0,0 +1,50 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+import React from 'react';
+import CodeBidiWarning from '../../../bidi-warning';
+import codeBidiWarningDecorator from '../../../bidi-warning/bidi-warning-decorator';
+import createChildren from './create-children';
+function createClassNameString(classNames) {
+  return classNames ? classNames.join(' ') : '';
+}
+
+// NOTE: This is a function call rather than a React component because, for
+// unknown reasons, it appears to be more performant. We tried and measured both
+// and this stacks up better than as a memoised React component. Something to look
+// into in the future.
+export default function createElement(_ref) {
+  var node = _ref.node,
+    codeBidiWarningConfig = _ref.codeBidiWarningConfig,
+    key = _ref.key;
+  if (node.type === 'text') {
+    var value = node.value;
+    // occasionally a numeric value is passed when the type is text
+    var textValue = "".concat(value);
+    if (codeBidiWarningConfig.codeBidiWarnings) {
+      var decorated = codeBidiWarningDecorator(textValue, function (_ref2) {
+        var bidiCharacter = _ref2.bidiCharacter,
+          index = _ref2.index;
+        return /*#__PURE__*/React.createElement(CodeBidiWarning, {
+          bidiCharacter: bidiCharacter,
+          key: index,
+          label: codeBidiWarningConfig.codeBidiWarningLabel,
+          tooltipEnabled: codeBidiWarningConfig.codeBidiWarningTooltipEnabled
+        });
+      });
+      return decorated;
+    }
+    return textValue;
+  } else {
+    var properties = node.properties,
+      tagName = node.tagName;
+    var childrenCreator = createChildren(codeBidiWarningConfig);
+    var props = _objectSpread(_objectSpread({}, properties), {}, {
+      className: createClassNameString(properties.className)
+    });
+    var children = childrenCreator(node.children);
+    return /*#__PURE__*/React.createElement(tagName, _objectSpread({
+      key: key
+    }, props), children);
+  }
+}

package/dist/esm/syntax-highlighter/lib/react-renderer/index.js

@@ -0,0 +1,24 @@
+import React from 'react';
+import createElement from './create-element';
+
+/**
+ * __React Renderer__
+ *
+ * A component that receives processed code lines and renders them into the code
+ * rows inside the wrapping span and nested code tag, applying passed props and
+ * code bidi warning config settings.
+ */
+export default function ReactRenderer(_ref) {
+  var containerProps = _ref.containerProps,
+    codeTagProps = _ref.codeTagProps,
+    rows = _ref.rows,
+    codeBidiWarningConfig = _ref.codeBidiWarningConfig;
+  var renderedRows = rows.map(function (node, i) {
+    return createElement({
+      node: node,
+      codeBidiWarningConfig: codeBidiWarningConfig,
+      key: "code-segment".concat(i)
+    });
+  });
+  return /*#__PURE__*/React.createElement("span", containerProps, /*#__PURE__*/React.createElement("code", codeTagProps, renderedRows));
+}

package/dist/esm/syntax-highlighter/types.js

@@ -0,0 +1,24 @@
+import _createClass from "@babel/runtime/helpers/createClass";
+import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
+import _inherits from "@babel/runtime/helpers/inherits";
+import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
+import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+import React from 'react';
+// This wrapper supports the async loading of refractor and language grammars. The internal Highlight is a memo() functional component as expected
+// eslint-disable-next-line @repo/internal/react/no-class-components
+export var SyntaxHighlighter = /*#__PURE__*/function (_React$PureComponent) {
+  _inherits(SyntaxHighlighter, _React$PureComponent);
+  var _super = _createSuper(SyntaxHighlighter);
+  function SyntaxHighlighter() {
+    _classCallCheck(this, SyntaxHighlighter);
+    return _super.apply(this, arguments);
+  }
+  return _createClass(SyntaxHighlighter);
+}(React.PureComponent);
+
+/**
+ * Function that receives current line number as argument and returns a
+ * line props object to be applied to each `span` wrapping code line.
+ */

package/dist/esm/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/code",
-	"version": "14.4.7",
+	"version": "14.5.0",
 	"sideEffects": false
 }

package/dist/types/bidi-warning/bidi-warning-decorator.d.ts

@@ -1,4 +1,11 @@
 export declare const bidiCharacterRegex: RegExp;
+/**
+ * __Code Bidi Warning Decorator__
+ *
+ * Checks the code to see if it contains any bidi characters.
+ * In case if bidi characters found - returns children with decorated
+ * bidi characters. If no bidi characters found - original text returned.
+ */
 export default function codeBidiWarningDecorator<DecoratorOutput>(originalText: string, decorate: (options: {
     bidiCharacter: string;
     index?: number;

package/dist/types/bidi-warning/ui/index.d.ts

@@ -1,3 +1,11 @@
 /// <reference types="react" />
 import { CodeBidiWarningProps } from './types';
+/**
+ * __Bidi Warning__
+ *
+ * A component used to render a bidi character warning.
+ * A bidi character can be used to perform a "bidi override attack".
+ *
+ * See https://hello.atlassian.net/wiki/spaces/PRODSEC/pages/1347434677/PSHELP-2943+Investigate+Trojan+Source+Attack+Vulnerability#1)-Providing-visual-cues-for-our-Customers-in-our-affected-products
+ */
 export default function BidiWarning({ testId, bidiCharacter, skipChildren, tooltipEnabled, label, }: CodeBidiWarningProps): JSX.Element;

package/dist/types/bidi-warning/ui/types.d.ts

@@ -1,33 +1,29 @@
 export declare type CodeBidiWarningProps = {
     /**
-     * A `testId` prop is provided for specified elements, which is a unique
-     * string that appears as a data attribute `data-testid` in the rendered code,
-     * serving as a hook for automated tests
+     * A unique string that appears as a data attribute `data-testid`
+     * in the rendered code. Serves as a hook for automated tests.
      */
     testId?: string;
     /**
-     * A bidi character which can be used to perform a "bidi override attack".
-     *
-     * See the following document for details.
-     *
-     * https://hello.atlassian.net/wiki/spaces/PRODSEC/pages/1347434677/PSHELP-2943+Investigate+Trojan+Source+Attack+Vulnerability#1)-Providing-visual-cues-for-our-Customers-in-our-affected-products
+     * A bidi character which can be used to perform a "bidi override attack". See https://hello.atlassian.net/wiki/spaces/PRODSEC/pages/1347434677/PSHELP-2943+Investigate+Trojan+Source+Attack+Vulnerability#1
      */
     bidiCharacter: string;
     /**
-     * Defaults to enabled (true)
-     *
-     * Intended to be disabled when used in a mobile view, such as in the editor
-     * via mobile bridge, where the tooltip could end up being cut off of otherwise
-     * not work as expected.
+     * Sets whether to render tooltip with the warning or not.
+     * Intended to be disabled when used in a mobile view, such as in the editor via mobile bridge,
+     * where the tooltip could end up being cut off or otherwise not work as expected.
+     * @default true
      */
     tooltipEnabled?: boolean;
     /**
+     * Sets whether bidi character should be wrapped in decorator.
      * Useful when wrapping the bidi character with the decoration is not achievable.
+     * @default false
      */
     skipChildren?: boolean;
     /**
-     * Labels for the previous and next buttons used in pagination.
-     * Defaults to `Bidirectional characters change the order that text is rendered. This could be used to obscure malicious code.`.
+     * Label for the bidi warning tooltip.
+     * @default "Bidirectional characters change the order that text is rendered. This could be used to obscure malicious code."
      */
     label?: string;
 };

package/dist/types/extract-react-types/code-block.d.ts

@@ -1,37 +1,47 @@
 export default function CodeBlock(__: {
     /**
-     * The code to be formatted
+     * The code to be formatted.
      */
     text: string;
     /**
-     * A unique string that appears as a data attribute `data-testid`
-     * in the rendered code. Serves as a hook for automated tests.
+     * A unique string that appears as a data attribute `data-testid` in the rendered code. Serves as a hook for automated tests.
      */
     testId?: string;
     /**
-     * Whether to showLineNumbers or not, defaults to true
+     * Sets whether to display code line numbers or not. Defaults to `true`
      */
     showLineNumbers?: boolean;
     /**
-     * The language in which the code is written
-     * @see `SupportedLanguages` for type information in src
+     Language reference designed to be populated from `SUPPORTED_LANGUAGES` in
+     `design-system/code`. Run against language grammars from PrismJS (full list
+     available at [PrismJS documentation](https://prismjs.com/#supported-languages)).
+  
+     When set to `text` will not perform highlighting. If unsupported language
+     provided - code will be treated as "text" with no highlighting.
+  
+     Defaults to `text`
      */
     language?: string;
     /**
-     * Lines to highlight comma delimited.
-     *
-     * Example uses:
-     * - To highlight one line `highlight="3"`
-     * - To highlight a group of lines `highlight="1-5"`
-     * - To highlight multiple groups `highlight="1-5,7,10,15-20"`
+     Comma delimited lines to highlight.
+  
+     Example uses:
+     - To highlight one line `highlight="3"`
+     - To highlight a group of lines `highlight="1-5"`
+     - To highlight multiple groups `highlight="1-5,7,10,15-20"`
      */
     highlight?: string;
     /**
-     * Screen reader text for the start of a highlighted line
+     * Screen reader text for the start of a highlighted line.
      */
     highlightedStartText?: string;
     /**
-     * Screen reader text for the end of a highlighted line
+     * Screen reader text for the end of a highlighted line.
      */
     highlightedEndText?: string;
+    /**
+     * Sets whether long lines will create a horizontally scrolling container.
+     * When set to `true`, these lines will visually wrap instead. Defaults to `false`
+     */
+    shouldWrapLongLines?: boolean;
 }): null;