@atlaskit/jql-editor 4.5.2 → 4.6.0

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 CHANGED
@@ -1,5 +1,12 @@
1
1
  # @atlaskit/jql-editor
2
2
 
3
+ ## 4.6.0
4
+
5
+ ### Minor Changes
6
+
7
+ - [`31ba9e3c9a657`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/31ba9e3c9a657) -
8
+ Typography migration (https://product-fabric.atlassian.net/browse/PYX-881)
9
+
3
10
  ## 4.5.2
4
11
 
5
12
  ### Patch Changes
@@ -6,5 +6,5 @@ Object.defineProperty(exports, "__esModule", {
6
6
  exports.useJqlEditorAnalytics = void 0;
7
7
  var _jqlEditorCommon = require("@atlaskit/jql-editor-common");
8
8
  var useJqlEditorAnalytics = exports.useJqlEditorAnalytics = function useJqlEditorAnalytics(analyticsSource) {
9
- return (0, _jqlEditorCommon.useJqlPackageAnalytics)(analyticsSource, "@atlaskit/jql-editor", "4.5.2", _jqlEditorCommon.ANALYTICS_CHANNEL);
9
+ return (0, _jqlEditorCommon.useJqlPackageAnalytics)(analyticsSource, "@atlaskit/jql-editor", "4.6.0", _jqlEditorCommon.ANALYTICS_CHANNEL);
10
10
  };
@@ -8,6 +8,7 @@ exports.JQLEditorHelp = void 0;
8
8
  var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
9
9
  var _react = _interopRequireDefault(require("react"));
10
10
  var _form = require("@atlaskit/form");
11
+ var _primitives = require("@atlaskit/primitives");
11
12
  var _constants = require("../../../common/constants");
12
13
  var _useEditorTheme = require("../../../hooks/use-editor-theme");
13
14
  var _state = require("../../../state");
@@ -25,12 +26,18 @@ var JQLEditorHelp = exports.JQLEditorHelp = function JQLEditorHelp() {
25
26
  var _useScopedId = (0, _state.useScopedId)(_constants.JQL_EDITOR_HELP_CONTENT_ID),
26
27
  _useScopedId2 = (0, _slicedToArray2.default)(_useScopedId, 1),
27
28
  helpContentId = _useScopedId2[0];
28
- var SearchMessage = /*#__PURE__*/_react.default.createElement("span", null, formatMessage(_messages.messages.searchCommand, {
29
+ var SearchMessage = /*#__PURE__*/_react.default.createElement(_primitives.Text, {
30
+ size: "UNSAFE_small",
31
+ color: "inherit"
32
+ }, formatMessage(_messages.messages.searchCommand, {
29
33
  b: function b(text) {
30
34
  return /*#__PURE__*/_react.default.createElement("b", null, text);
31
35
  }
32
36
  }));
33
- var NewLineMessage = /*#__PURE__*/_react.default.createElement("span", null, formatMessage(isSearch ? _messages.messages.newLineCommand : _messages.messages.fieldNewLineCommand, {
37
+ var NewLineMessage = /*#__PURE__*/_react.default.createElement(_primitives.Text, {
38
+ size: "UNSAFE_small",
39
+ color: "inherit"
40
+ }, formatMessage(isSearch ? _messages.messages.newLineCommand : _messages.messages.fieldNewLineCommand, {
34
41
  b: function b(text) {
35
42
  return /*#__PURE__*/_react.default.createElement("b", null, text);
36
43
  }
@@ -7,6 +7,7 @@ Object.defineProperty(exports, "__esModule", {
7
7
  exports.default = exports.JQLEditorReadOnly = void 0;
8
8
  var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
9
9
  var _react = _interopRequireDefault(require("react"));
10
+ var _primitives = require("@atlaskit/primitives");
10
11
  var _useEditorTheme = require("../../hooks/use-editor-theme");
11
12
  var _splitTextByNewLine = require("../../utils/split-text-by-new-line");
12
13
  var _readOnlyControlsContent = require("../jql-editor-controls-content/read-only-controls-content");
@@ -81,7 +82,8 @@ var JQLEditorReadOnlyWithoutTheme = function JQLEditorReadOnlyWithoutTheme(_ref)
81
82
  lineNumbersVisible: lineNumbersVisible,
82
83
  isCompact: isCompact
83
84
  }, blocks.map(function (block, index) {
84
- return /*#__PURE__*/_react.default.createElement("p", {
85
+ return /*#__PURE__*/_react.default.createElement(_primitives.Box, {
86
+ as: "p",
85
87
  key: index
86
88
  }, block);
87
89
  })), /*#__PURE__*/_react.default.createElement(_styled.EditorControls, {
@@ -32,7 +32,7 @@ var fadeOut = (0, _react.keyframes)({
32
32
  });
33
33
 
34
34
  // eslint-disable-next-line @atlaskit/design-system/no-styled-tagged-template-expression, @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
35
- var EditorMain = exports.EditorMain = _styled.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n\t/* CSS reset */\n\tfont-family: ", ";\n\tfont-size: ", "px;\n\tflex-grow: 1;\n\n\t/* These styles and animations are derived from @atlaskit/tooltip */\n\n\t.", " {\n\t\tbackground-color: ", ";\n\t\tcolor: ", ";\n\t\tborder-radius: ", ";\n\t\tbox-sizing: border-box;\n\t\tfont-size: 12px;\n\t\tline-height: 1.3;\n\t\tmax-width: 240px;\n\t\tpadding: ", " ", ";\n\t\tword-wrap: break-word;\n\t\toverflow-wrap: break-word;\n\t\tz-index: ", ";\n\t\tpointer-events: none;\n\t\tposition: absolute;\n\t\tvisibility: hidden;\n\n\t\t/* Horizontally center and vertically position above the target element */\n\t\ttransform: translate(-50%, calc(-100% - ", "));\n\n\t\t&.", " {\n\t\t\tanimation: ", " 350ms cubic-bezier(0.15, 1, 0.3, 1);\n\t\t\tvisibility: visible;\n\t\t}\n\n\t\t&.", " {\n\t\t\tanimation: ", " 350ms cubic-bezier(0.15, 1, 0.3, 1);\n\t\t}\n\t}\n"])), (0, _constants.fontFamily)(), (0, _constants.fontSize)(), _constants2.TOOLTIP_CLASSNAME, "var(--ds-background-neutral-bold, ".concat(_colors.N800, ")"), "var(--ds-text-inverse, ".concat(_colors.N0, ")"), "var(--ds-border-radius-100, 3px)", "var(--ds-space-025, 2px)", "var(--ds-space-075, 6px)", _constants.layers.tooltip(), "var(--ds-space-200, 16px)", _constants2.TOOLTIP_ENTER_CLASSNAME, fadeIn, _constants2.TOOLTIP_EXIT_CLASSNAME, fadeOut);
35
+ var EditorMain = exports.EditorMain = _styled.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n\t/* CSS reset */\n\tfont-family: ", ";\n\tfont-size: ", "px;\n\tflex-grow: 1;\n\n\t/* These styles and animations are derived from @atlaskit/tooltip */\n\n\t.", " {\n\t\tbackground-color: ", ";\n\t\tcolor: ", ";\n\t\tborder-radius: ", ";\n\t\tbox-sizing: border-box;\n\t\tfont: ", ";\n\t\tline-height: 1.3;\n\t\tmax-width: 240px;\n\t\tpadding: ", " ", ";\n\t\tword-wrap: break-word;\n\t\toverflow-wrap: break-word;\n\t\tz-index: ", ";\n\t\tpointer-events: none;\n\t\tposition: absolute;\n\t\tvisibility: hidden;\n\n\t\t/* Horizontally center and vertically position above the target element */\n\t\ttransform: translate(-50%, calc(-100% - ", "));\n\n\t\t&.", " {\n\t\t\tanimation: ", " 350ms cubic-bezier(0.15, 1, 0.3, 1);\n\t\t\tvisibility: visible;\n\t\t}\n\n\t\t&.", " {\n\t\t\tanimation: ", " 350ms cubic-bezier(0.15, 1, 0.3, 1);\n\t\t}\n\t}\n"])), (0, _constants.fontFamily)(), (0, _constants.fontSize)(), _constants2.TOOLTIP_CLASSNAME, "var(--ds-background-neutral-bold, ".concat(_colors.N800, ")"), "var(--ds-text-inverse, ".concat(_colors.N0, ")"), "var(--ds-border-radius-100, 3px)", "var(--ds-font-body-UNSAFE_small, normal 400 12px/16px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)", "var(--ds-space-025, 2px)", "var(--ds-space-075, 6px)", _constants.layers.tooltip(), "var(--ds-space-200, 16px)", _constants2.TOOLTIP_ENTER_CLASSNAME, fadeIn, _constants2.TOOLTIP_EXIT_CLASSNAME, fadeOut);
36
36
 
37
37
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
38
38
  var EditorFooter = exports.EditorFooter = _styled.default.div({
@@ -1,4 +1,4 @@
1
1
  import { ANALYTICS_CHANNEL, useJqlPackageAnalytics } from '@atlaskit/jql-editor-common';
2
2
  export const useJqlEditorAnalytics = analyticsSource => {
3
- return useJqlPackageAnalytics(analyticsSource, "@atlaskit/jql-editor", "4.5.2", ANALYTICS_CHANNEL);
3
+ return useJqlPackageAnalytics(analyticsSource, "@atlaskit/jql-editor", "4.6.0", ANALYTICS_CHANNEL);
4
4
  };
@@ -1,5 +1,6 @@
1
1
  import React from 'react';
2
2
  import { HelperMessage } from '@atlaskit/form';
3
+ import { Text } from '@atlaskit/primitives';
3
4
  import { JQL_EDITOR_HELP_CONTENT_ID } from '../../../common/constants';
4
5
  import { useEditorThemeContext } from '../../../hooks/use-editor-theme';
5
6
  import { useEditorViewHasFocus, useIntl, useScopedId } from '../../../state';
@@ -14,10 +15,16 @@ export const JQLEditorHelp = () => {
14
15
  isSearch
15
16
  } = useEditorThemeContext();
16
17
  const [helpContentId] = useScopedId(JQL_EDITOR_HELP_CONTENT_ID);
17
- const SearchMessage = /*#__PURE__*/React.createElement("span", null, formatMessage(messages.searchCommand, {
18
+ const SearchMessage = /*#__PURE__*/React.createElement(Text, {
19
+ size: "UNSAFE_small",
20
+ color: "inherit"
21
+ }, formatMessage(messages.searchCommand, {
18
22
  b: text => /*#__PURE__*/React.createElement("b", null, text)
19
23
  }));
20
- const NewLineMessage = /*#__PURE__*/React.createElement("span", null, formatMessage(isSearch ? messages.newLineCommand : messages.fieldNewLineCommand, {
24
+ const NewLineMessage = /*#__PURE__*/React.createElement(Text, {
25
+ size: "UNSAFE_small",
26
+ color: "inherit"
27
+ }, formatMessage(isSearch ? messages.newLineCommand : messages.fieldNewLineCommand, {
21
28
  b: text => /*#__PURE__*/React.createElement("b", null, text)
22
29
  }));
23
30
  return /*#__PURE__*/React.createElement(HelpContainer, {
@@ -1,4 +1,5 @@
1
1
  import React from 'react';
2
+ import { Box } from '@atlaskit/primitives';
2
3
  import { EditorThemeContext, useEditorTheme, useEditorThemeContext } from '../../hooks/use-editor-theme';
3
4
  import { splitTextByNewLine } from '../../utils/split-text-by-new-line';
4
5
  // eslint-disable-next-line @atlassian/tangerine/import/no-parent-imports
@@ -77,7 +78,8 @@ const JQLEditorReadOnlyWithoutTheme = ({
77
78
  expandedRows: expandedRows,
78
79
  lineNumbersVisible: lineNumbersVisible,
79
80
  isCompact: isCompact
80
- }, blocks.map((block, index) => /*#__PURE__*/React.createElement("p", {
81
+ }, blocks.map((block, index) => /*#__PURE__*/React.createElement(Box, {
82
+ as: "p",
81
83
  key: index
82
84
  }, block))), /*#__PURE__*/React.createElement(EditorControls, {
83
85
  isSearch: isSearch,
@@ -39,7 +39,7 @@ export const EditorMain = styled.div`
39
39
  color: ${`var(--ds-text-inverse, ${N0})`};
40
40
  border-radius: ${"var(--ds-border-radius-100, 3px)"};
41
41
  box-sizing: border-box;
42
- font-size: 12px;
42
+ font: ${"var(--ds-font-body-UNSAFE_small, normal 400 12px/16px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)"};
43
43
  line-height: 1.3;
44
44
  max-width: 240px;
45
45
  padding: ${"var(--ds-space-025, 2px)"} ${"var(--ds-space-075, 6px)"};
@@ -1,4 +1,4 @@
1
1
  import { ANALYTICS_CHANNEL, useJqlPackageAnalytics } from '@atlaskit/jql-editor-common';
2
2
  export var useJqlEditorAnalytics = function useJqlEditorAnalytics(analyticsSource) {
3
- return useJqlPackageAnalytics(analyticsSource, "@atlaskit/jql-editor", "4.5.2", ANALYTICS_CHANNEL);
3
+ return useJqlPackageAnalytics(analyticsSource, "@atlaskit/jql-editor", "4.6.0", ANALYTICS_CHANNEL);
4
4
  };
@@ -1,6 +1,7 @@
1
1
  import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
2
2
  import React from 'react';
3
3
  import { HelperMessage } from '@atlaskit/form';
4
+ import { Text } from '@atlaskit/primitives';
4
5
  import { JQL_EDITOR_HELP_CONTENT_ID } from '../../../common/constants';
5
6
  import { useEditorThemeContext } from '../../../hooks/use-editor-theme';
6
7
  import { useEditorViewHasFocus, useIntl, useScopedId } from '../../../state';
@@ -18,12 +19,18 @@ export var JQLEditorHelp = function JQLEditorHelp() {
18
19
  var _useScopedId = useScopedId(JQL_EDITOR_HELP_CONTENT_ID),
19
20
  _useScopedId2 = _slicedToArray(_useScopedId, 1),
20
21
  helpContentId = _useScopedId2[0];
21
- var SearchMessage = /*#__PURE__*/React.createElement("span", null, formatMessage(messages.searchCommand, {
22
+ var SearchMessage = /*#__PURE__*/React.createElement(Text, {
23
+ size: "UNSAFE_small",
24
+ color: "inherit"
25
+ }, formatMessage(messages.searchCommand, {
22
26
  b: function b(text) {
23
27
  return /*#__PURE__*/React.createElement("b", null, text);
24
28
  }
25
29
  }));
26
- var NewLineMessage = /*#__PURE__*/React.createElement("span", null, formatMessage(isSearch ? messages.newLineCommand : messages.fieldNewLineCommand, {
30
+ var NewLineMessage = /*#__PURE__*/React.createElement(Text, {
31
+ size: "UNSAFE_small",
32
+ color: "inherit"
33
+ }, formatMessage(isSearch ? messages.newLineCommand : messages.fieldNewLineCommand, {
27
34
  b: function b(text) {
28
35
  return /*#__PURE__*/React.createElement("b", null, text);
29
36
  }
@@ -1,6 +1,7 @@
1
1
  import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
2
2
  var _excluded = ["isSearch", "isCompact"];
3
3
  import React from 'react';
4
+ import { Box } from '@atlaskit/primitives';
4
5
  import { EditorThemeContext, useEditorTheme, useEditorThemeContext } from '../../hooks/use-editor-theme';
5
6
  import { splitTextByNewLine } from '../../utils/split-text-by-new-line';
6
7
  // eslint-disable-next-line @atlassian/tangerine/import/no-parent-imports
@@ -75,7 +76,8 @@ var JQLEditorReadOnlyWithoutTheme = function JQLEditorReadOnlyWithoutTheme(_ref)
75
76
  lineNumbersVisible: lineNumbersVisible,
76
77
  isCompact: isCompact
77
78
  }, blocks.map(function (block, index) {
78
- return /*#__PURE__*/React.createElement("p", {
79
+ return /*#__PURE__*/React.createElement(Box, {
80
+ as: "p",
79
81
  key: index
80
82
  }, block);
81
83
  })), /*#__PURE__*/React.createElement(EditorControls, {
@@ -28,7 +28,7 @@ var fadeOut = keyframes({
28
28
  });
29
29
 
30
30
  // eslint-disable-next-line @atlaskit/design-system/no-styled-tagged-template-expression, @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
31
- export var EditorMain = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\t/* CSS reset */\n\tfont-family: ", ";\n\tfont-size: ", "px;\n\tflex-grow: 1;\n\n\t/* These styles and animations are derived from @atlaskit/tooltip */\n\n\t.", " {\n\t\tbackground-color: ", ";\n\t\tcolor: ", ";\n\t\tborder-radius: ", ";\n\t\tbox-sizing: border-box;\n\t\tfont-size: 12px;\n\t\tline-height: 1.3;\n\t\tmax-width: 240px;\n\t\tpadding: ", " ", ";\n\t\tword-wrap: break-word;\n\t\toverflow-wrap: break-word;\n\t\tz-index: ", ";\n\t\tpointer-events: none;\n\t\tposition: absolute;\n\t\tvisibility: hidden;\n\n\t\t/* Horizontally center and vertically position above the target element */\n\t\ttransform: translate(-50%, calc(-100% - ", "));\n\n\t\t&.", " {\n\t\t\tanimation: ", " 350ms cubic-bezier(0.15, 1, 0.3, 1);\n\t\t\tvisibility: visible;\n\t\t}\n\n\t\t&.", " {\n\t\t\tanimation: ", " 350ms cubic-bezier(0.15, 1, 0.3, 1);\n\t\t}\n\t}\n"])), fontFamily(), fontSize(), TOOLTIP_CLASSNAME, "var(--ds-background-neutral-bold, ".concat(N800, ")"), "var(--ds-text-inverse, ".concat(N0, ")"), "var(--ds-border-radius-100, 3px)", "var(--ds-space-025, 2px)", "var(--ds-space-075, 6px)", layers.tooltip(), "var(--ds-space-200, 16px)", TOOLTIP_ENTER_CLASSNAME, fadeIn, TOOLTIP_EXIT_CLASSNAME, fadeOut);
31
+ export var EditorMain = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\t/* CSS reset */\n\tfont-family: ", ";\n\tfont-size: ", "px;\n\tflex-grow: 1;\n\n\t/* These styles and animations are derived from @atlaskit/tooltip */\n\n\t.", " {\n\t\tbackground-color: ", ";\n\t\tcolor: ", ";\n\t\tborder-radius: ", ";\n\t\tbox-sizing: border-box;\n\t\tfont: ", ";\n\t\tline-height: 1.3;\n\t\tmax-width: 240px;\n\t\tpadding: ", " ", ";\n\t\tword-wrap: break-word;\n\t\toverflow-wrap: break-word;\n\t\tz-index: ", ";\n\t\tpointer-events: none;\n\t\tposition: absolute;\n\t\tvisibility: hidden;\n\n\t\t/* Horizontally center and vertically position above the target element */\n\t\ttransform: translate(-50%, calc(-100% - ", "));\n\n\t\t&.", " {\n\t\t\tanimation: ", " 350ms cubic-bezier(0.15, 1, 0.3, 1);\n\t\t\tvisibility: visible;\n\t\t}\n\n\t\t&.", " {\n\t\t\tanimation: ", " 350ms cubic-bezier(0.15, 1, 0.3, 1);\n\t\t}\n\t}\n"])), fontFamily(), fontSize(), TOOLTIP_CLASSNAME, "var(--ds-background-neutral-bold, ".concat(N800, ")"), "var(--ds-text-inverse, ".concat(N0, ")"), "var(--ds-border-radius-100, 3px)", "var(--ds-font-body-UNSAFE_small, normal 400 12px/16px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)", "var(--ds-space-025, 2px)", "var(--ds-space-075, 6px)", layers.tooltip(), "var(--ds-space-200, 16px)", TOOLTIP_ENTER_CLASSNAME, fadeIn, TOOLTIP_EXIT_CLASSNAME, fadeOut);
32
32
 
33
33
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
34
34
  export var EditorFooter = styled.div({
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/jql-editor",
3
- "version": "4.5.2",
3
+ "version": "4.6.0",
4
4
  "description": "This package allows consumers to render an advanced JQL editor component to enable autocomplete-assisted authoring and validation of JQL queries.",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -39,17 +39,18 @@
39
39
  "@atlaskit/analytics-gas-types": "^5.1.0",
40
40
  "@atlaskit/analytics-next": "^10.1.0",
41
41
  "@atlaskit/avatar": "^21.15.0",
42
- "@atlaskit/button": "^20.0.0",
42
+ "@atlaskit/button": "^20.1.0",
43
43
  "@atlaskit/editor-prosemirror": "5.0.1",
44
44
  "@atlaskit/form": "^10.5.0",
45
- "@atlaskit/icon": "^22.13.0",
45
+ "@atlaskit/icon": "^22.15.0",
46
46
  "@atlaskit/jql-ast": "^3.3.0",
47
47
  "@atlaskit/jql-autocomplete": "^2.0.0",
48
48
  "@atlaskit/jql-editor-common": "^2.0.0",
49
49
  "@atlaskit/jql-parser": "^2.0.0",
50
+ "@atlaskit/primitives": "^12.0.1",
50
51
  "@atlaskit/spinner": "^16.3.0",
51
52
  "@atlaskit/theme": "^13.0.0",
52
- "@atlaskit/tokens": "^1.58.0",
53
+ "@atlaskit/tokens": "^1.59.0",
53
54
  "@atlaskit/tooltip": "^18.7.0",
54
55
  "@babel/runtime": "^7.0.0",
55
56
  "@emotion/react": "^11.7.1",