@atlaskit/jql-editor 5.12.3 → 5.12.4
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 +6 -0
- package/dist/cjs/analytics/util.js +1 -1
- package/dist/cjs/plugins/rich-inline-nodes/nodes/base/index.compiled.css +24 -0
- package/dist/cjs/plugins/rich-inline-nodes/nodes/base/index.js +60 -0
- package/dist/cjs/plugins/rich-inline-nodes/nodes/base/types.js +5 -0
- package/dist/cjs/plugins/rich-inline-nodes/nodes/project/index.compiled.css +8 -0
- package/dist/cjs/plugins/rich-inline-nodes/nodes/project/index.js +71 -0
- package/dist/cjs/plugins/rich-inline-nodes/nodes/project/messages.js +14 -0
- package/dist/cjs/plugins/rich-inline-nodes/nodes/project/types.js +1 -0
- package/dist/es2019/analytics/util.js +1 -1
- package/dist/es2019/plugins/rich-inline-nodes/nodes/base/index.compiled.css +24 -0
- package/dist/es2019/plugins/rich-inline-nodes/nodes/base/index.js +55 -0
- package/dist/es2019/plugins/rich-inline-nodes/nodes/base/types.js +1 -0
- package/dist/es2019/plugins/rich-inline-nodes/nodes/project/index.compiled.css +8 -0
- package/dist/es2019/plugins/rich-inline-nodes/nodes/project/index.js +57 -0
- package/dist/es2019/plugins/rich-inline-nodes/nodes/project/messages.js +8 -0
- package/dist/es2019/plugins/rich-inline-nodes/nodes/project/types.js +0 -0
- package/dist/esm/analytics/util.js +1 -1
- package/dist/esm/plugins/rich-inline-nodes/nodes/base/index.compiled.css +24 -0
- package/dist/esm/plugins/rich-inline-nodes/nodes/base/index.js +53 -0
- package/dist/esm/plugins/rich-inline-nodes/nodes/base/types.js +1 -0
- package/dist/esm/plugins/rich-inline-nodes/nodes/project/index.compiled.css +8 -0
- package/dist/esm/plugins/rich-inline-nodes/nodes/project/index.js +60 -0
- package/dist/esm/plugins/rich-inline-nodes/nodes/project/messages.js +8 -0
- package/dist/esm/plugins/rich-inline-nodes/nodes/project/types.js +0 -0
- package/dist/types/plugins/rich-inline-nodes/nodes/base/index.d.ts +16 -0
- package/dist/types/plugins/rich-inline-nodes/nodes/base/types.d.ts +6 -0
- package/dist/types/plugins/rich-inline-nodes/nodes/project/index.d.ts +10 -0
- package/dist/types/plugins/rich-inline-nodes/nodes/project/messages.d.ts +7 -0
- package/dist/types/plugins/rich-inline-nodes/nodes/project/types.d.ts +5 -0
- package/dist/types-ts4.5/plugins/rich-inline-nodes/nodes/base/index.d.ts +16 -0
- package/dist/types-ts4.5/plugins/rich-inline-nodes/nodes/base/types.d.ts +6 -0
- package/dist/types-ts4.5/plugins/rich-inline-nodes/nodes/project/index.d.ts +10 -0
- package/dist/types-ts4.5/plugins/rich-inline-nodes/nodes/project/messages.d.ts +7 -0
- package/dist/types-ts4.5/plugins/rich-inline-nodes/nodes/project/types.d.ts +5 -0
- package/package.json +6 -3
package/CHANGELOG.md
CHANGED
|
@@ -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", "
|
|
9
|
+
return (0, _jqlEditorCommon.useJqlPackageAnalytics)(analyticsSource, "@atlaskit/jql-editor", "5.12.3", _jqlEditorCommon.ANALYTICS_CHANNEL);
|
|
10
10
|
};
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
._19it145i{border:var(--ds-border-width,1px) solid transparent}
|
|
2
|
+
._2rko12b0{border-radius:var(--ds-radius-small,4px)}
|
|
3
|
+
._1h6dq98m{border-color:var(--ds-border-selected,#1868db)}
|
|
4
|
+
._1rjcidpf{padding-block:0}
|
|
5
|
+
._1e0c1txw{display:flex}
|
|
6
|
+
._1hms8stv{text-decoration-line:underline}
|
|
7
|
+
._1kegt94y{text-decoration-thickness:1px}
|
|
8
|
+
._1pfh1i6y{margin-block-start:var(--ds-space-negative-025,-2px)}
|
|
9
|
+
._4bfu1r31{text-decoration-color:currentColor}
|
|
10
|
+
._4bfu1tmw{text-decoration-color:var(--ds-text-danger,#ae2e24)}
|
|
11
|
+
._4cvr1h6o{align-items:center}
|
|
12
|
+
._4t3i7vkz{height:1pc}
|
|
13
|
+
._4t3igktf{height:20px}
|
|
14
|
+
._ajmm1khm{text-decoration-style:wavy}
|
|
15
|
+
._bfhk15s3{background-color:var(--ds-background-selected,#e9f2fe)}
|
|
16
|
+
._bfhk1gly{background-color:var(--ds-background-danger,#ffeceb)}
|
|
17
|
+
._bfhki8nm{background-color:var(--ds-background-neutral,#0515240f)}
|
|
18
|
+
._bozgv77o{padding-inline-start:var(--ds-space-025,2px)}
|
|
19
|
+
._ect4zzfg{font-family:var(--ds-font-family-code,"Atlassian Mono",ui-monospace,Menlo,"Segoe UI Mono","Ubuntu Mono",monospace)}
|
|
20
|
+
._tdi7glyw{-webkit-text-decoration-skip-ink:none;text-decoration-skip-ink:none}
|
|
21
|
+
._y4ti1b66{padding-inline-end:var(--ds-space-050,4px)}
|
|
22
|
+
._irr31yvi:hover{background-color:var(--ds-background-danger-hovered,#ffd5d2)}
|
|
23
|
+
._irr3plhp:hover{background-color:var(--ds-background-neutral-hovered,#0b120e24)}
|
|
24
|
+
._irr3ufnl:hover{background-color:var(--ds-background-selected-hovered,#cfe1fd)}
|
|
@@ -0,0 +1,60 @@
|
|
|
1
|
+
/* index.tsx generated by @compiled/babel-plugin v0.38.1 */
|
|
2
|
+
"use strict";
|
|
3
|
+
|
|
4
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
5
|
+
Object.defineProperty(exports, "__esModule", {
|
|
6
|
+
value: true
|
|
7
|
+
});
|
|
8
|
+
exports.NodeBase = void 0;
|
|
9
|
+
require("./index.compiled.css");
|
|
10
|
+
var _runtime = require("@compiled/react/runtime");
|
|
11
|
+
var _react = _interopRequireDefault(require("react"));
|
|
12
|
+
var _css = require("@atlaskit/css");
|
|
13
|
+
var _lockLocked = _interopRequireDefault(require("@atlaskit/icon/core/lock-locked"));
|
|
14
|
+
var _compiled = require("@atlaskit/primitives/compiled");
|
|
15
|
+
var styles = {
|
|
16
|
+
nodeWrapper: "_19it145i _2rko12b0 _1rjcidpf _1e0c1txw _4cvr1h6o _bfhki8nm _4t3igktf _bozgv77o _y4ti1b66 _irr3plhp",
|
|
17
|
+
nodeWrapperSelected: "_1h6dq98m _bfhk15s3 _irr3ufnl",
|
|
18
|
+
nodeWrapperError: "_4bfu1r31 _1hms8stv _ajmm1khm _1kegt94y _tdi7glyw _4bfu1tmw",
|
|
19
|
+
nodeWrapperErrorSelected: "_bfhk1gly _irr31yvi",
|
|
20
|
+
textWrapper: "_ect4zzfg",
|
|
21
|
+
iconBeforeWrapper: "_1e0c1txw _4t3i7vkz _4cvr1h6o _1pfh1i6y",
|
|
22
|
+
iconAfterWrapper: ""
|
|
23
|
+
};
|
|
24
|
+
|
|
25
|
+
/**
|
|
26
|
+
* NodeBase Component
|
|
27
|
+
*
|
|
28
|
+
* This component is a base component for rendering a pill-like view for different node types.
|
|
29
|
+
* It is designed to be used in the JQL editor to provide a consistent UI for various entities
|
|
30
|
+
* such as projects, teams, users, etc.
|
|
31
|
+
*
|
|
32
|
+
* Currently, this component is only implemented for the "Project" (Atlas) node type. Separate components
|
|
33
|
+
* already exist for "User" and "Team" nodes. However, to ensure consistency in design, these
|
|
34
|
+
* components should eventually be refactored to use this base component. This will help maintain
|
|
35
|
+
* a uniform look and feel across different node types.
|
|
36
|
+
*/
|
|
37
|
+
|
|
38
|
+
var NodeBase = exports.NodeBase = function NodeBase(props) {
|
|
39
|
+
var iconBefore = props.iconBefore,
|
|
40
|
+
text = props.text,
|
|
41
|
+
isLocked = props.isLocked,
|
|
42
|
+
selected = props.selected,
|
|
43
|
+
error = props.error;
|
|
44
|
+
return /*#__PURE__*/_react.default.createElement(_compiled.Pressable, {
|
|
45
|
+
xcss: (0, _css.cx)(styles.nodeWrapper, error && styles.nodeWrapperError, selected && (error ? styles.nodeWrapperErrorSelected : styles.nodeWrapperSelected))
|
|
46
|
+
}, /*#__PURE__*/_react.default.createElement(_compiled.Inline, {
|
|
47
|
+
space: "space.050",
|
|
48
|
+
alignBlock: "center"
|
|
49
|
+
}, iconBefore && /*#__PURE__*/_react.default.createElement(_compiled.Box, {
|
|
50
|
+
xcss: styles.iconBeforeWrapper
|
|
51
|
+
}, iconBefore), /*#__PURE__*/_react.default.createElement(_compiled.Box, {
|
|
52
|
+
xcss: styles.textWrapper
|
|
53
|
+
}, text), isLocked && /*#__PURE__*/_react.default.createElement(_compiled.Box, {
|
|
54
|
+
xcss: styles.iconAfterWrapper
|
|
55
|
+
}, /*#__PURE__*/_react.default.createElement(_lockLocked.default, {
|
|
56
|
+
size: "small",
|
|
57
|
+
color: "var(--ds-icon-accent-red, #C9372C)",
|
|
58
|
+
label: ""
|
|
59
|
+
}))));
|
|
60
|
+
};
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
._19bvv77o{padding-left:var(--ds-space-025,2px)}
|
|
2
|
+
._1e0c1txw{display:flex}
|
|
3
|
+
._1pfh1i6y{margin-block-start:var(--ds-space-negative-025,-2px)}
|
|
4
|
+
._4cvr1h6o{align-items:center}
|
|
5
|
+
._4t3i7vkz{height:1pc}
|
|
6
|
+
._ca0qv77o{padding-top:var(--ds-space-025,2px)}
|
|
7
|
+
._n3tdv77o{padding-bottom:var(--ds-space-025,2px)}
|
|
8
|
+
._u5f3v77o{padding-right:var(--ds-space-025,2px)}
|
|
@@ -0,0 +1,71 @@
|
|
|
1
|
+
/* index.tsx generated by @compiled/babel-plugin v0.38.1 */
|
|
2
|
+
"use strict";
|
|
3
|
+
|
|
4
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
5
|
+
Object.defineProperty(exports, "__esModule", {
|
|
6
|
+
value: true
|
|
7
|
+
});
|
|
8
|
+
exports.ProjectNode = void 0;
|
|
9
|
+
require("./index.compiled.css");
|
|
10
|
+
var _runtime = require("@compiled/react/runtime");
|
|
11
|
+
var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
|
|
12
|
+
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
13
|
+
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
14
|
+
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
|
15
|
+
var _react = _interopRequireDefault(require("react"));
|
|
16
|
+
var _emoji = require("@atlaskit/emoji");
|
|
17
|
+
var _project = _interopRequireDefault(require("@atlaskit/icon/core/project"));
|
|
18
|
+
var _compiled = require("@atlaskit/primitives/compiled");
|
|
19
|
+
var _state = require("../../../../state");
|
|
20
|
+
var _base = require("../base");
|
|
21
|
+
var _messages = require("./messages");
|
|
22
|
+
var _excluded = ["emojiName", "isRestricted", "text"];
|
|
23
|
+
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != (0, _typeof2.default)(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
|
|
24
|
+
var styles = {
|
|
25
|
+
emojiWrapper: "_1e0c1txw _4t3i7vkz _4cvr1h6o _1pfh1i6y",
|
|
26
|
+
projectIconWrapper: "_ca0qv77o _u5f3v77o _n3tdv77o _19bvv77o"
|
|
27
|
+
};
|
|
28
|
+
var getTownsquareEmojiProvider = function getTownsquareEmojiProvider() {
|
|
29
|
+
// Dynamically import the emoji provider to prevent an unnecessary network call from being made on module import
|
|
30
|
+
return Promise.resolve().then(function () {
|
|
31
|
+
return _interopRequireWildcard(require( /* webpackChunkName: "@atlaskit-internal_@atlaskit/jql-editor/plugins/rich-inline-nodes/nodes/base" */'@atlaskit/townsquare-emoji-provider'));
|
|
32
|
+
}).then(function (mod) {
|
|
33
|
+
return mod.emojiProvider;
|
|
34
|
+
});
|
|
35
|
+
};
|
|
36
|
+
|
|
37
|
+
/**
|
|
38
|
+
* ProjectNode Component
|
|
39
|
+
*
|
|
40
|
+
* This component is a component for rendering a pill-like view for Project (Atlas) node type
|
|
41
|
+
* in the JQL editor
|
|
42
|
+
*/
|
|
43
|
+
var ProjectNode = exports.ProjectNode = function ProjectNode(props) {
|
|
44
|
+
var emojiName = props.emojiName,
|
|
45
|
+
isRestricted = props.isRestricted,
|
|
46
|
+
text = props.text,
|
|
47
|
+
rest = (0, _objectWithoutProperties2.default)(props, _excluded);
|
|
48
|
+
var _useIntl = (0, _state.useIntl)(),
|
|
49
|
+
_useIntl2 = (0, _slicedToArray2.default)(_useIntl, 1),
|
|
50
|
+
formatMessage = _useIntl2[0].formatMessage;
|
|
51
|
+
var townsquareEmojiProvider = getTownsquareEmojiProvider();
|
|
52
|
+
return /*#__PURE__*/_react.default.createElement(_base.NodeBase, (0, _extends2.default)({
|
|
53
|
+
iconBefore: emojiName ? /*#__PURE__*/_react.default.createElement(_compiled.Box, {
|
|
54
|
+
xcss: styles.emojiWrapper
|
|
55
|
+
}, /*#__PURE__*/_react.default.createElement(_emoji.ResourcedEmoji, {
|
|
56
|
+
emojiProvider: townsquareEmojiProvider,
|
|
57
|
+
emojiId: {
|
|
58
|
+
shortName: emojiName
|
|
59
|
+
},
|
|
60
|
+
fitToHeight: 16
|
|
61
|
+
})) : /*#__PURE__*/_react.default.createElement(_compiled.Box, {
|
|
62
|
+
xcss: styles.projectIconWrapper
|
|
63
|
+
}, /*#__PURE__*/_react.default.createElement(_project.default, {
|
|
64
|
+
size: "small",
|
|
65
|
+
label: ""
|
|
66
|
+
})),
|
|
67
|
+
text: isRestricted ? formatMessage(_messages.messages.restrictedProject) : text
|
|
68
|
+
}, rest, {
|
|
69
|
+
isLocked: isRestricted
|
|
70
|
+
}));
|
|
71
|
+
};
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.messages = void 0;
|
|
7
|
+
var _reactIntlNext = require("react-intl-next");
|
|
8
|
+
var messages = exports.messages = (0, _reactIntlNext.defineMessages)({
|
|
9
|
+
restrictedProject: {
|
|
10
|
+
id: 'jql-editor.plugins.rich-inline-nodes.project.restrictedProject',
|
|
11
|
+
defaultMessage: 'Restricted project',
|
|
12
|
+
description: 'This text is shown in the node if the project is locked'
|
|
13
|
+
}
|
|
14
|
+
});
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";
|
|
@@ -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", "
|
|
3
|
+
return useJqlPackageAnalytics(analyticsSource, "@atlaskit/jql-editor", "5.12.3", ANALYTICS_CHANNEL);
|
|
4
4
|
};
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
._19it145i{border:var(--ds-border-width,1px) solid transparent}
|
|
2
|
+
._2rko12b0{border-radius:var(--ds-radius-small,4px)}
|
|
3
|
+
._1h6dq98m{border-color:var(--ds-border-selected,#1868db)}
|
|
4
|
+
._1rjcidpf{padding-block:0}
|
|
5
|
+
._1e0c1txw{display:flex}
|
|
6
|
+
._1hms8stv{text-decoration-line:underline}
|
|
7
|
+
._1kegt94y{text-decoration-thickness:1px}
|
|
8
|
+
._1pfh1i6y{margin-block-start:var(--ds-space-negative-025,-2px)}
|
|
9
|
+
._4bfu1r31{text-decoration-color:currentColor}
|
|
10
|
+
._4bfu1tmw{text-decoration-color:var(--ds-text-danger,#ae2e24)}
|
|
11
|
+
._4cvr1h6o{align-items:center}
|
|
12
|
+
._4t3i7vkz{height:1pc}
|
|
13
|
+
._4t3igktf{height:20px}
|
|
14
|
+
._ajmm1khm{text-decoration-style:wavy}
|
|
15
|
+
._bfhk15s3{background-color:var(--ds-background-selected,#e9f2fe)}
|
|
16
|
+
._bfhk1gly{background-color:var(--ds-background-danger,#ffeceb)}
|
|
17
|
+
._bfhki8nm{background-color:var(--ds-background-neutral,#0515240f)}
|
|
18
|
+
._bozgv77o{padding-inline-start:var(--ds-space-025,2px)}
|
|
19
|
+
._ect4zzfg{font-family:var(--ds-font-family-code,"Atlassian Mono",ui-monospace,Menlo,"Segoe UI Mono","Ubuntu Mono",monospace)}
|
|
20
|
+
._tdi7glyw{-webkit-text-decoration-skip-ink:none;text-decoration-skip-ink:none}
|
|
21
|
+
._y4ti1b66{padding-inline-end:var(--ds-space-050,4px)}
|
|
22
|
+
._irr31yvi:hover{background-color:var(--ds-background-danger-hovered,#ffd5d2)}
|
|
23
|
+
._irr3plhp:hover{background-color:var(--ds-background-neutral-hovered,#0b120e24)}
|
|
24
|
+
._irr3ufnl:hover{background-color:var(--ds-background-selected-hovered,#cfe1fd)}
|
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
/* index.tsx generated by @compiled/babel-plugin v0.38.1 */
|
|
2
|
+
import "./index.compiled.css";
|
|
3
|
+
import { ax, ix } from "@compiled/react/runtime";
|
|
4
|
+
import React from 'react';
|
|
5
|
+
import { cx } from '@atlaskit/css';
|
|
6
|
+
import LockLockedIcon from '@atlaskit/icon/core/lock-locked';
|
|
7
|
+
import { Box, Inline, Pressable } from '@atlaskit/primitives/compiled';
|
|
8
|
+
const styles = {
|
|
9
|
+
nodeWrapper: "_19it145i _2rko12b0 _1rjcidpf _1e0c1txw _4cvr1h6o _bfhki8nm _4t3igktf _bozgv77o _y4ti1b66 _irr3plhp",
|
|
10
|
+
nodeWrapperSelected: "_1h6dq98m _bfhk15s3 _irr3ufnl",
|
|
11
|
+
nodeWrapperError: "_4bfu1r31 _1hms8stv _ajmm1khm _1kegt94y _tdi7glyw _4bfu1tmw",
|
|
12
|
+
nodeWrapperErrorSelected: "_bfhk1gly _irr31yvi",
|
|
13
|
+
textWrapper: "_ect4zzfg",
|
|
14
|
+
iconBeforeWrapper: "_1e0c1txw _4t3i7vkz _4cvr1h6o _1pfh1i6y",
|
|
15
|
+
iconAfterWrapper: ""
|
|
16
|
+
};
|
|
17
|
+
|
|
18
|
+
/**
|
|
19
|
+
* NodeBase Component
|
|
20
|
+
*
|
|
21
|
+
* This component is a base component for rendering a pill-like view for different node types.
|
|
22
|
+
* It is designed to be used in the JQL editor to provide a consistent UI for various entities
|
|
23
|
+
* such as projects, teams, users, etc.
|
|
24
|
+
*
|
|
25
|
+
* Currently, this component is only implemented for the "Project" (Atlas) node type. Separate components
|
|
26
|
+
* already exist for "User" and "Team" nodes. However, to ensure consistency in design, these
|
|
27
|
+
* components should eventually be refactored to use this base component. This will help maintain
|
|
28
|
+
* a uniform look and feel across different node types.
|
|
29
|
+
*/
|
|
30
|
+
|
|
31
|
+
export const NodeBase = props => {
|
|
32
|
+
const {
|
|
33
|
+
iconBefore,
|
|
34
|
+
text,
|
|
35
|
+
isLocked,
|
|
36
|
+
selected,
|
|
37
|
+
error
|
|
38
|
+
} = props;
|
|
39
|
+
return /*#__PURE__*/React.createElement(Pressable, {
|
|
40
|
+
xcss: cx(styles.nodeWrapper, error && styles.nodeWrapperError, selected && (error ? styles.nodeWrapperErrorSelected : styles.nodeWrapperSelected))
|
|
41
|
+
}, /*#__PURE__*/React.createElement(Inline, {
|
|
42
|
+
space: "space.050",
|
|
43
|
+
alignBlock: "center"
|
|
44
|
+
}, iconBefore && /*#__PURE__*/React.createElement(Box, {
|
|
45
|
+
xcss: styles.iconBeforeWrapper
|
|
46
|
+
}, iconBefore), /*#__PURE__*/React.createElement(Box, {
|
|
47
|
+
xcss: styles.textWrapper
|
|
48
|
+
}, text), isLocked && /*#__PURE__*/React.createElement(Box, {
|
|
49
|
+
xcss: styles.iconAfterWrapper
|
|
50
|
+
}, /*#__PURE__*/React.createElement(LockLockedIcon, {
|
|
51
|
+
size: "small",
|
|
52
|
+
color: "var(--ds-icon-accent-red, #C9372C)",
|
|
53
|
+
label: ""
|
|
54
|
+
}))));
|
|
55
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
._19bvv77o{padding-left:var(--ds-space-025,2px)}
|
|
2
|
+
._1e0c1txw{display:flex}
|
|
3
|
+
._1pfh1i6y{margin-block-start:var(--ds-space-negative-025,-2px)}
|
|
4
|
+
._4cvr1h6o{align-items:center}
|
|
5
|
+
._4t3i7vkz{height:1pc}
|
|
6
|
+
._ca0qv77o{padding-top:var(--ds-space-025,2px)}
|
|
7
|
+
._n3tdv77o{padding-bottom:var(--ds-space-025,2px)}
|
|
8
|
+
._u5f3v77o{padding-right:var(--ds-space-025,2px)}
|
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
/* index.tsx generated by @compiled/babel-plugin v0.38.1 */
|
|
2
|
+
import _extends from "@babel/runtime/helpers/extends";
|
|
3
|
+
import "./index.compiled.css";
|
|
4
|
+
import { ax, ix } from "@compiled/react/runtime";
|
|
5
|
+
import React from 'react';
|
|
6
|
+
import { ResourcedEmoji } from '@atlaskit/emoji';
|
|
7
|
+
import ProjectIcon from '@atlaskit/icon/core/project';
|
|
8
|
+
import { Box } from '@atlaskit/primitives/compiled';
|
|
9
|
+
import { useIntl } from '../../../../state';
|
|
10
|
+
import { NodeBase } from '../base';
|
|
11
|
+
import { messages } from './messages';
|
|
12
|
+
const styles = {
|
|
13
|
+
emojiWrapper: "_1e0c1txw _4t3i7vkz _4cvr1h6o _1pfh1i6y",
|
|
14
|
+
projectIconWrapper: "_ca0qv77o _u5f3v77o _n3tdv77o _19bvv77o"
|
|
15
|
+
};
|
|
16
|
+
const getTownsquareEmojiProvider = () => {
|
|
17
|
+
// Dynamically import the emoji provider to prevent an unnecessary network call from being made on module import
|
|
18
|
+
return import( /* webpackChunkName: "@atlaskit-internal_@atlaskit/jql-editor/plugins/rich-inline-nodes/nodes/base" */'@atlaskit/townsquare-emoji-provider').then(mod => mod.emojiProvider);
|
|
19
|
+
};
|
|
20
|
+
|
|
21
|
+
/**
|
|
22
|
+
* ProjectNode Component
|
|
23
|
+
*
|
|
24
|
+
* This component is a component for rendering a pill-like view for Project (Atlas) node type
|
|
25
|
+
* in the JQL editor
|
|
26
|
+
*/
|
|
27
|
+
export const ProjectNode = props => {
|
|
28
|
+
const {
|
|
29
|
+
emojiName,
|
|
30
|
+
isRestricted,
|
|
31
|
+
text,
|
|
32
|
+
...rest
|
|
33
|
+
} = props;
|
|
34
|
+
const [{
|
|
35
|
+
formatMessage
|
|
36
|
+
}] = useIntl();
|
|
37
|
+
const townsquareEmojiProvider = getTownsquareEmojiProvider();
|
|
38
|
+
return /*#__PURE__*/React.createElement(NodeBase, _extends({
|
|
39
|
+
iconBefore: emojiName ? /*#__PURE__*/React.createElement(Box, {
|
|
40
|
+
xcss: styles.emojiWrapper
|
|
41
|
+
}, /*#__PURE__*/React.createElement(ResourcedEmoji, {
|
|
42
|
+
emojiProvider: townsquareEmojiProvider,
|
|
43
|
+
emojiId: {
|
|
44
|
+
shortName: emojiName
|
|
45
|
+
},
|
|
46
|
+
fitToHeight: 16
|
|
47
|
+
})) : /*#__PURE__*/React.createElement(Box, {
|
|
48
|
+
xcss: styles.projectIconWrapper
|
|
49
|
+
}, /*#__PURE__*/React.createElement(ProjectIcon, {
|
|
50
|
+
size: "small",
|
|
51
|
+
label: ""
|
|
52
|
+
})),
|
|
53
|
+
text: isRestricted ? formatMessage(messages.restrictedProject) : text
|
|
54
|
+
}, rest, {
|
|
55
|
+
isLocked: isRestricted
|
|
56
|
+
}));
|
|
57
|
+
};
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { defineMessages } from 'react-intl-next';
|
|
2
|
+
export const messages = defineMessages({
|
|
3
|
+
restrictedProject: {
|
|
4
|
+
id: 'jql-editor.plugins.rich-inline-nodes.project.restrictedProject',
|
|
5
|
+
defaultMessage: 'Restricted project',
|
|
6
|
+
description: 'This text is shown in the node if the project is locked'
|
|
7
|
+
}
|
|
8
|
+
});
|
|
File without changes
|
|
@@ -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", "
|
|
3
|
+
return useJqlPackageAnalytics(analyticsSource, "@atlaskit/jql-editor", "5.12.3", ANALYTICS_CHANNEL);
|
|
4
4
|
};
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
._19it145i{border:var(--ds-border-width,1px) solid transparent}
|
|
2
|
+
._2rko12b0{border-radius:var(--ds-radius-small,4px)}
|
|
3
|
+
._1h6dq98m{border-color:var(--ds-border-selected,#1868db)}
|
|
4
|
+
._1rjcidpf{padding-block:0}
|
|
5
|
+
._1e0c1txw{display:flex}
|
|
6
|
+
._1hms8stv{text-decoration-line:underline}
|
|
7
|
+
._1kegt94y{text-decoration-thickness:1px}
|
|
8
|
+
._1pfh1i6y{margin-block-start:var(--ds-space-negative-025,-2px)}
|
|
9
|
+
._4bfu1r31{text-decoration-color:currentColor}
|
|
10
|
+
._4bfu1tmw{text-decoration-color:var(--ds-text-danger,#ae2e24)}
|
|
11
|
+
._4cvr1h6o{align-items:center}
|
|
12
|
+
._4t3i7vkz{height:1pc}
|
|
13
|
+
._4t3igktf{height:20px}
|
|
14
|
+
._ajmm1khm{text-decoration-style:wavy}
|
|
15
|
+
._bfhk15s3{background-color:var(--ds-background-selected,#e9f2fe)}
|
|
16
|
+
._bfhk1gly{background-color:var(--ds-background-danger,#ffeceb)}
|
|
17
|
+
._bfhki8nm{background-color:var(--ds-background-neutral,#0515240f)}
|
|
18
|
+
._bozgv77o{padding-inline-start:var(--ds-space-025,2px)}
|
|
19
|
+
._ect4zzfg{font-family:var(--ds-font-family-code,"Atlassian Mono",ui-monospace,Menlo,"Segoe UI Mono","Ubuntu Mono",monospace)}
|
|
20
|
+
._tdi7glyw{-webkit-text-decoration-skip-ink:none;text-decoration-skip-ink:none}
|
|
21
|
+
._y4ti1b66{padding-inline-end:var(--ds-space-050,4px)}
|
|
22
|
+
._irr31yvi:hover{background-color:var(--ds-background-danger-hovered,#ffd5d2)}
|
|
23
|
+
._irr3plhp:hover{background-color:var(--ds-background-neutral-hovered,#0b120e24)}
|
|
24
|
+
._irr3ufnl:hover{background-color:var(--ds-background-selected-hovered,#cfe1fd)}
|
|
@@ -0,0 +1,53 @@
|
|
|
1
|
+
/* index.tsx generated by @compiled/babel-plugin v0.38.1 */
|
|
2
|
+
import "./index.compiled.css";
|
|
3
|
+
import { ax, ix } from "@compiled/react/runtime";
|
|
4
|
+
import React from 'react';
|
|
5
|
+
import { cx } from '@atlaskit/css';
|
|
6
|
+
import LockLockedIcon from '@atlaskit/icon/core/lock-locked';
|
|
7
|
+
import { Box, Inline, Pressable } from '@atlaskit/primitives/compiled';
|
|
8
|
+
var styles = {
|
|
9
|
+
nodeWrapper: "_19it145i _2rko12b0 _1rjcidpf _1e0c1txw _4cvr1h6o _bfhki8nm _4t3igktf _bozgv77o _y4ti1b66 _irr3plhp",
|
|
10
|
+
nodeWrapperSelected: "_1h6dq98m _bfhk15s3 _irr3ufnl",
|
|
11
|
+
nodeWrapperError: "_4bfu1r31 _1hms8stv _ajmm1khm _1kegt94y _tdi7glyw _4bfu1tmw",
|
|
12
|
+
nodeWrapperErrorSelected: "_bfhk1gly _irr31yvi",
|
|
13
|
+
textWrapper: "_ect4zzfg",
|
|
14
|
+
iconBeforeWrapper: "_1e0c1txw _4t3i7vkz _4cvr1h6o _1pfh1i6y",
|
|
15
|
+
iconAfterWrapper: ""
|
|
16
|
+
};
|
|
17
|
+
|
|
18
|
+
/**
|
|
19
|
+
* NodeBase Component
|
|
20
|
+
*
|
|
21
|
+
* This component is a base component for rendering a pill-like view for different node types.
|
|
22
|
+
* It is designed to be used in the JQL editor to provide a consistent UI for various entities
|
|
23
|
+
* such as projects, teams, users, etc.
|
|
24
|
+
*
|
|
25
|
+
* Currently, this component is only implemented for the "Project" (Atlas) node type. Separate components
|
|
26
|
+
* already exist for "User" and "Team" nodes. However, to ensure consistency in design, these
|
|
27
|
+
* components should eventually be refactored to use this base component. This will help maintain
|
|
28
|
+
* a uniform look and feel across different node types.
|
|
29
|
+
*/
|
|
30
|
+
|
|
31
|
+
export var NodeBase = function NodeBase(props) {
|
|
32
|
+
var iconBefore = props.iconBefore,
|
|
33
|
+
text = props.text,
|
|
34
|
+
isLocked = props.isLocked,
|
|
35
|
+
selected = props.selected,
|
|
36
|
+
error = props.error;
|
|
37
|
+
return /*#__PURE__*/React.createElement(Pressable, {
|
|
38
|
+
xcss: cx(styles.nodeWrapper, error && styles.nodeWrapperError, selected && (error ? styles.nodeWrapperErrorSelected : styles.nodeWrapperSelected))
|
|
39
|
+
}, /*#__PURE__*/React.createElement(Inline, {
|
|
40
|
+
space: "space.050",
|
|
41
|
+
alignBlock: "center"
|
|
42
|
+
}, iconBefore && /*#__PURE__*/React.createElement(Box, {
|
|
43
|
+
xcss: styles.iconBeforeWrapper
|
|
44
|
+
}, iconBefore), /*#__PURE__*/React.createElement(Box, {
|
|
45
|
+
xcss: styles.textWrapper
|
|
46
|
+
}, text), isLocked && /*#__PURE__*/React.createElement(Box, {
|
|
47
|
+
xcss: styles.iconAfterWrapper
|
|
48
|
+
}, /*#__PURE__*/React.createElement(LockLockedIcon, {
|
|
49
|
+
size: "small",
|
|
50
|
+
color: "var(--ds-icon-accent-red, #C9372C)",
|
|
51
|
+
label: ""
|
|
52
|
+
}))));
|
|
53
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
._19bvv77o{padding-left:var(--ds-space-025,2px)}
|
|
2
|
+
._1e0c1txw{display:flex}
|
|
3
|
+
._1pfh1i6y{margin-block-start:var(--ds-space-negative-025,-2px)}
|
|
4
|
+
._4cvr1h6o{align-items:center}
|
|
5
|
+
._4t3i7vkz{height:1pc}
|
|
6
|
+
._ca0qv77o{padding-top:var(--ds-space-025,2px)}
|
|
7
|
+
._n3tdv77o{padding-bottom:var(--ds-space-025,2px)}
|
|
8
|
+
._u5f3v77o{padding-right:var(--ds-space-025,2px)}
|
|
@@ -0,0 +1,60 @@
|
|
|
1
|
+
/* index.tsx generated by @compiled/babel-plugin v0.38.1 */
|
|
2
|
+
import _extends from "@babel/runtime/helpers/extends";
|
|
3
|
+
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
|
|
4
|
+
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
|
|
5
|
+
var _excluded = ["emojiName", "isRestricted", "text"];
|
|
6
|
+
import "./index.compiled.css";
|
|
7
|
+
import { ax, ix } from "@compiled/react/runtime";
|
|
8
|
+
import React from 'react';
|
|
9
|
+
import { ResourcedEmoji } from '@atlaskit/emoji';
|
|
10
|
+
import ProjectIcon from '@atlaskit/icon/core/project';
|
|
11
|
+
import { Box } from '@atlaskit/primitives/compiled';
|
|
12
|
+
import { useIntl } from '../../../../state';
|
|
13
|
+
import { NodeBase } from '../base';
|
|
14
|
+
import { messages } from './messages';
|
|
15
|
+
var styles = {
|
|
16
|
+
emojiWrapper: "_1e0c1txw _4t3i7vkz _4cvr1h6o _1pfh1i6y",
|
|
17
|
+
projectIconWrapper: "_ca0qv77o _u5f3v77o _n3tdv77o _19bvv77o"
|
|
18
|
+
};
|
|
19
|
+
var getTownsquareEmojiProvider = function getTownsquareEmojiProvider() {
|
|
20
|
+
// Dynamically import the emoji provider to prevent an unnecessary network call from being made on module import
|
|
21
|
+
return import( /* webpackChunkName: "@atlaskit-internal_@atlaskit/jql-editor/plugins/rich-inline-nodes/nodes/base" */'@atlaskit/townsquare-emoji-provider').then(function (mod) {
|
|
22
|
+
return mod.emojiProvider;
|
|
23
|
+
});
|
|
24
|
+
};
|
|
25
|
+
|
|
26
|
+
/**
|
|
27
|
+
* ProjectNode Component
|
|
28
|
+
*
|
|
29
|
+
* This component is a component for rendering a pill-like view for Project (Atlas) node type
|
|
30
|
+
* in the JQL editor
|
|
31
|
+
*/
|
|
32
|
+
export var ProjectNode = function ProjectNode(props) {
|
|
33
|
+
var emojiName = props.emojiName,
|
|
34
|
+
isRestricted = props.isRestricted,
|
|
35
|
+
text = props.text,
|
|
36
|
+
rest = _objectWithoutProperties(props, _excluded);
|
|
37
|
+
var _useIntl = useIntl(),
|
|
38
|
+
_useIntl2 = _slicedToArray(_useIntl, 1),
|
|
39
|
+
formatMessage = _useIntl2[0].formatMessage;
|
|
40
|
+
var townsquareEmojiProvider = getTownsquareEmojiProvider();
|
|
41
|
+
return /*#__PURE__*/React.createElement(NodeBase, _extends({
|
|
42
|
+
iconBefore: emojiName ? /*#__PURE__*/React.createElement(Box, {
|
|
43
|
+
xcss: styles.emojiWrapper
|
|
44
|
+
}, /*#__PURE__*/React.createElement(ResourcedEmoji, {
|
|
45
|
+
emojiProvider: townsquareEmojiProvider,
|
|
46
|
+
emojiId: {
|
|
47
|
+
shortName: emojiName
|
|
48
|
+
},
|
|
49
|
+
fitToHeight: 16
|
|
50
|
+
})) : /*#__PURE__*/React.createElement(Box, {
|
|
51
|
+
xcss: styles.projectIconWrapper
|
|
52
|
+
}, /*#__PURE__*/React.createElement(ProjectIcon, {
|
|
53
|
+
size: "small",
|
|
54
|
+
label: ""
|
|
55
|
+
})),
|
|
56
|
+
text: isRestricted ? formatMessage(messages.restrictedProject) : text
|
|
57
|
+
}, rest, {
|
|
58
|
+
isLocked: isRestricted
|
|
59
|
+
}));
|
|
60
|
+
};
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { defineMessages } from 'react-intl-next';
|
|
2
|
+
export var messages = defineMessages({
|
|
3
|
+
restrictedProject: {
|
|
4
|
+
id: 'jql-editor.plugins.rich-inline-nodes.project.restrictedProject',
|
|
5
|
+
defaultMessage: 'Restricted project',
|
|
6
|
+
description: 'This text is shown in the node if the project is locked'
|
|
7
|
+
}
|
|
8
|
+
});
|
|
File without changes
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import type { NodeViewProps } from '../../util/react-node-view';
|
|
3
|
+
import { type NodeBaseProps } from './types';
|
|
4
|
+
/**
|
|
5
|
+
* NodeBase Component
|
|
6
|
+
*
|
|
7
|
+
* This component is a base component for rendering a pill-like view for different node types.
|
|
8
|
+
* It is designed to be used in the JQL editor to provide a consistent UI for various entities
|
|
9
|
+
* such as projects, teams, users, etc.
|
|
10
|
+
*
|
|
11
|
+
* Currently, this component is only implemented for the "Project" (Atlas) node type. Separate components
|
|
12
|
+
* already exist for "User" and "Team" nodes. However, to ensure consistency in design, these
|
|
13
|
+
* components should eventually be refactored to use this base component. This will help maintain
|
|
14
|
+
* a uniform look and feel across different node types.
|
|
15
|
+
*/
|
|
16
|
+
export declare const NodeBase: (props: NodeViewProps<NodeBaseProps>) => React.JSX.Element;
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import type { NodeViewProps } from '../../util/react-node-view';
|
|
3
|
+
import type { ProjectNodeProps } from './types';
|
|
4
|
+
/**
|
|
5
|
+
* ProjectNode Component
|
|
6
|
+
*
|
|
7
|
+
* This component is a component for rendering a pill-like view for Project (Atlas) node type
|
|
8
|
+
* in the JQL editor
|
|
9
|
+
*/
|
|
10
|
+
export declare const ProjectNode: (props: NodeViewProps<ProjectNodeProps>) => React.JSX.Element;
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import type { NodeViewProps } from '../../util/react-node-view';
|
|
3
|
+
import { type NodeBaseProps } from './types';
|
|
4
|
+
/**
|
|
5
|
+
* NodeBase Component
|
|
6
|
+
*
|
|
7
|
+
* This component is a base component for rendering a pill-like view for different node types.
|
|
8
|
+
* It is designed to be used in the JQL editor to provide a consistent UI for various entities
|
|
9
|
+
* such as projects, teams, users, etc.
|
|
10
|
+
*
|
|
11
|
+
* Currently, this component is only implemented for the "Project" (Atlas) node type. Separate components
|
|
12
|
+
* already exist for "User" and "Team" nodes. However, to ensure consistency in design, these
|
|
13
|
+
* components should eventually be refactored to use this base component. This will help maintain
|
|
14
|
+
* a uniform look and feel across different node types.
|
|
15
|
+
*/
|
|
16
|
+
export declare const NodeBase: (props: NodeViewProps<NodeBaseProps>) => React.JSX.Element;
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import type { NodeViewProps } from '../../util/react-node-view';
|
|
3
|
+
import type { ProjectNodeProps } from './types';
|
|
4
|
+
/**
|
|
5
|
+
* ProjectNode Component
|
|
6
|
+
*
|
|
7
|
+
* This component is a component for rendering a pill-like view for Project (Atlas) node type
|
|
8
|
+
* in the JQL editor
|
|
9
|
+
*/
|
|
10
|
+
export declare const ProjectNode: (props: NodeViewProps<ProjectNodeProps>) => React.JSX.Element;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/jql-editor",
|
|
3
|
-
"version": "5.12.
|
|
3
|
+
"version": "5.12.4",
|
|
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",
|
|
@@ -37,9 +37,11 @@
|
|
|
37
37
|
"@atlaskit/analytics-next": "^11.1.0",
|
|
38
38
|
"@atlaskit/avatar": "^25.7.0",
|
|
39
39
|
"@atlaskit/button": "^23.9.0",
|
|
40
|
+
"@atlaskit/css": "^0.19.0",
|
|
40
41
|
"@atlaskit/editor-prosemirror": "^7.2.0",
|
|
42
|
+
"@atlaskit/emoji": "^69.10.0",
|
|
41
43
|
"@atlaskit/form": "^15.3.0",
|
|
42
|
-
"@atlaskit/icon": "^
|
|
44
|
+
"@atlaskit/icon": "^30.0.0",
|
|
43
45
|
"@atlaskit/jql-ast": "^3.3.0",
|
|
44
46
|
"@atlaskit/jql-autocomplete": "^2.0.0",
|
|
45
47
|
"@atlaskit/jql-editor-common": "^3.0.0",
|
|
@@ -52,8 +54,9 @@
|
|
|
52
54
|
"@atlaskit/spinner": "^19.0.0",
|
|
53
55
|
"@atlaskit/teams-avatar": "^2.4.0",
|
|
54
56
|
"@atlaskit/theme": "^21.0.0",
|
|
55
|
-
"@atlaskit/tokens": "^10.
|
|
57
|
+
"@atlaskit/tokens": "^10.1.0",
|
|
56
58
|
"@atlaskit/tooltip": "^20.14.0",
|
|
59
|
+
"@atlaskit/townsquare-emoji-provider": "^1.0.0",
|
|
57
60
|
"@babel/runtime": "^7.0.0",
|
|
58
61
|
"@emotion/react": "^11.7.1",
|
|
59
62
|
"@emotion/styled": "^11.0.0",
|