@atlaskit/editor-plugin-status 2.8.2 → 3.0.1
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 +24 -0
- package/dist/cjs/nodeviews/statusNodeSpec.js +213 -0
- package/dist/cjs/statusPlugin.js +2 -2
- package/dist/es2019/nodeviews/statusNodeSpec.js +207 -0
- package/dist/es2019/statusPlugin.js +2 -2
- package/dist/esm/nodeviews/statusNodeSpec.js +206 -0
- package/dist/esm/statusPlugin.js +2 -2
- package/dist/types/nodeviews/statusNodeSpec.d.ts +6 -0
- package/dist/types-ts4.5/nodeviews/statusNodeSpec.d.ts +6 -0
- package/package.json +17 -11
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,29 @@
|
|
|
1
1
|
# @atlaskit/editor-plugin-status
|
|
2
2
|
|
|
3
|
+
## 3.0.1
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- Updated dependencies
|
|
8
|
+
|
|
9
|
+
## 3.0.0
|
|
10
|
+
|
|
11
|
+
### Major Changes
|
|
12
|
+
|
|
13
|
+
- [#117363](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/117363)
|
|
14
|
+
[`10a0f7f6c2027`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/10a0f7f6c2027) -
|
|
15
|
+
This package's `peerDependencies` have been adjusted for `react` and/or `react-dom` to reflect the
|
|
16
|
+
status of only supporting React 18 going forward. No explicit breaking change to React support has
|
|
17
|
+
been made in this release, but this is to signify going forward, breaking changes for React 16 or
|
|
18
|
+
React 17 may come via non-major semver releases.
|
|
19
|
+
|
|
20
|
+
Please refer this community post for more details:
|
|
21
|
+
https://community.developer.atlassian.com/t/rfc-78-dropping-support-for-react-16-and-rendering-in-a-react-18-concurrent-root-in-jira-and-confluence/87026
|
|
22
|
+
|
|
23
|
+
### Patch Changes
|
|
24
|
+
|
|
25
|
+
- Updated dependencies
|
|
26
|
+
|
|
3
27
|
## 2.8.2
|
|
4
28
|
|
|
5
29
|
### Patch Changes
|
|
@@ -0,0 +1,213 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
|
5
|
+
value: true
|
|
6
|
+
});
|
|
7
|
+
exports.statusNodeSpec = void 0;
|
|
8
|
+
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
9
|
+
var _reactIntlNext = require("react-intl-next");
|
|
10
|
+
var _adfSchema = require("@atlaskit/adf-schema");
|
|
11
|
+
var _lazyNodeView = require("@atlaskit/editor-common/lazy-node-view");
|
|
12
|
+
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
13
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
14
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
15
|
+
var isSSR = Boolean(process.env.REACT_SSR);
|
|
16
|
+
var intl;
|
|
17
|
+
|
|
18
|
+
// copied from packages/elements/status/src/components/Status.tsx
|
|
19
|
+
var colorToLozengeAppearanceMap = {
|
|
20
|
+
neutral: 'default',
|
|
21
|
+
purple: 'new',
|
|
22
|
+
blue: 'inprogress',
|
|
23
|
+
red: 'removed',
|
|
24
|
+
yellow: 'moved',
|
|
25
|
+
green: 'success'
|
|
26
|
+
};
|
|
27
|
+
var lozengeAppearanceToBgColorMap = {
|
|
28
|
+
bold: {
|
|
29
|
+
default: '#DDDEE1',
|
|
30
|
+
inprogress: '#8FB8F6',
|
|
31
|
+
moved: '#F9C84E',
|
|
32
|
+
new: '#D8A0F7',
|
|
33
|
+
removed: '#FD9891',
|
|
34
|
+
success: '#B3DF72'
|
|
35
|
+
},
|
|
36
|
+
subtle: {
|
|
37
|
+
default: "var(--ds-background-neutral-subtle, #00000000)",
|
|
38
|
+
inprogress: "var(--ds-background-neutral-subtle, #00000000)",
|
|
39
|
+
moved: "var(--ds-background-neutral-subtle, #00000000)",
|
|
40
|
+
new: "var(--ds-background-neutral-subtle, #00000000)",
|
|
41
|
+
removed: "var(--ds-background-neutral-subtle, #00000000)",
|
|
42
|
+
success: "var(--ds-background-neutral-subtle, #00000000)"
|
|
43
|
+
}
|
|
44
|
+
};
|
|
45
|
+
var borderStyleMap = {
|
|
46
|
+
subtle: {
|
|
47
|
+
default: "1px solid #B7B9BE",
|
|
48
|
+
inprogress: "1px solid #669DF1",
|
|
49
|
+
moved: "1px solid #FCA700",
|
|
50
|
+
new: "1px solid #C97CF4",
|
|
51
|
+
removed: "1px solid #F87168",
|
|
52
|
+
success: "1px solid #94C748"
|
|
53
|
+
}
|
|
54
|
+
};
|
|
55
|
+
var backgroundColorsOld = {
|
|
56
|
+
bold: {
|
|
57
|
+
default: "var(--ds-background-neutral-bold, #44546F)",
|
|
58
|
+
inprogress: "var(--ds-background-information-bold, #0C66E4)",
|
|
59
|
+
moved: "var(--ds-background-warning-bold, #F5CD47)",
|
|
60
|
+
new: "var(--ds-background-discovery-bold, #6E5DC6)",
|
|
61
|
+
removed: "var(--ds-background-danger-bold, #C9372C)",
|
|
62
|
+
success: "var(--ds-background-success-bold, #1F845A)"
|
|
63
|
+
},
|
|
64
|
+
subtle: {
|
|
65
|
+
default: "var(--ds-background-neutral, #091E420F)",
|
|
66
|
+
inprogress: "var(--ds-background-information, #E9F2FF)",
|
|
67
|
+
moved: "var(--ds-background-warning, #FFF7D6)",
|
|
68
|
+
new: "var(--ds-background-discovery, #F3F0FF)",
|
|
69
|
+
removed: "var(--ds-background-danger, #FFECEB)",
|
|
70
|
+
success: "var(--ds-background-success, #DCFFF1)"
|
|
71
|
+
}
|
|
72
|
+
};
|
|
73
|
+
var textColorsOld = {
|
|
74
|
+
bold: {
|
|
75
|
+
default: "var(--ds-text-inverse, #FFFFFF)",
|
|
76
|
+
inprogress: "var(--ds-text-inverse, #FFFFFF)",
|
|
77
|
+
moved: "var(--ds-text-warning-inverse, #172B4D)",
|
|
78
|
+
new: "var(--ds-text-inverse, #FFFFFF)",
|
|
79
|
+
removed: "var(--ds-text-inverse, #FFFFFF)",
|
|
80
|
+
success: "var(--ds-text-inverse, #FFFFFF)"
|
|
81
|
+
},
|
|
82
|
+
subtle: {
|
|
83
|
+
default: "var(--ds-text-subtle, #44546F)",
|
|
84
|
+
inprogress: "var(--ds-text-information, #0055CC)",
|
|
85
|
+
moved: "var(--ds-text-warning, #A54800)",
|
|
86
|
+
new: "var(--ds-text-discovery, #5E4DB2)",
|
|
87
|
+
removed: "var(--ds-text-danger, #AE2E24)",
|
|
88
|
+
success: "var(--ds-text-success, #216E4E)"
|
|
89
|
+
}
|
|
90
|
+
};
|
|
91
|
+
var DEFAULT_APPEARANCE = 'default';
|
|
92
|
+
|
|
93
|
+
// eg. Version/4.0 Chrome/95.0.4638.50
|
|
94
|
+
var isAndroidChromium = typeof window !== 'undefined' && /Version\/(?:[\0-\t\x0B\f\x0E-\u2027\u202A-\uD7FF\uE000-\uFFFF]|[\uD800-\uDBFF][\uDC00-\uDFFF]|[\uD800-\uDBFF](?![\uDC00-\uDFFF])|(?:[^\uD800-\uDBFF]|^)[\uDC00-\uDFFF])* Chrome\/(?:[\0-\t\x0B\f\x0E-\u2027\u202A-\uD7FF\uE000-\uFFFF]|[\uD800-\uDBFF][\uDC00-\uDFFF]|[\uD800-\uDBFF](?![\uDC00-\uDFFF])|(?:[^\uD800-\uDBFF]|^)[\uDC00-\uDFFF])*/.test(window.navigator.userAgent);
|
|
95
|
+
|
|
96
|
+
/**
|
|
97
|
+
* Wrapper for ADF status node spec to augment toDOM implementation
|
|
98
|
+
* with fallback UI for lazy node view rendering / window virtualization
|
|
99
|
+
* @returns
|
|
100
|
+
*/
|
|
101
|
+
var statusNodeSpec = exports.statusNodeSpec = function statusNodeSpec() {
|
|
102
|
+
if (isSSR || !(0, _platformFeatureFlags.fg)('platform_editor_lego__inline_node_virtualization')) {
|
|
103
|
+
return _adfSchema.status;
|
|
104
|
+
}
|
|
105
|
+
return _objectSpread(_objectSpread({}, _adfSchema.status), {}, {
|
|
106
|
+
toDOM: function toDOM(node) {
|
|
107
|
+
var _style$backgroundColo;
|
|
108
|
+
var _node$attrs = node.attrs,
|
|
109
|
+
text = _node$attrs.text,
|
|
110
|
+
color = _node$attrs.color,
|
|
111
|
+
style = _node$attrs.style;
|
|
112
|
+
intl = intl || (0, _reactIntlNext.createIntl)({
|
|
113
|
+
locale: document.documentElement.lang || 'en-US'
|
|
114
|
+
});
|
|
115
|
+
var isComponentVisualRefresh = (0, _platformFeatureFlags.fg)('platform-component-visual-refresh');
|
|
116
|
+
var editorNodeWrapperAttrs = {
|
|
117
|
+
'data-testid': 'statusContainerView',
|
|
118
|
+
style: (0, _lazyNodeView.convertToInlineCss)(text ? {
|
|
119
|
+
opacity: 1
|
|
120
|
+
} : {
|
|
121
|
+
opacity: 0.5
|
|
122
|
+
})
|
|
123
|
+
};
|
|
124
|
+
|
|
125
|
+
// packages/elements/status/src/components/Status.tsx
|
|
126
|
+
var appearance = colorToLozengeAppearanceMap[color] || DEFAULT_APPEARANCE;
|
|
127
|
+
var statusElementAttrs = {
|
|
128
|
+
style: (0, _lazyNodeView.convertToInlineCss)(isAndroidChromium ? {
|
|
129
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-important-styles -- Ignored via go/DSP-18766
|
|
130
|
+
display: 'inline-block !important',
|
|
131
|
+
verticalAlign: 'middle'
|
|
132
|
+
} : {}),
|
|
133
|
+
class: 'status-lozenge-span',
|
|
134
|
+
'aria-busy': 'true',
|
|
135
|
+
'data-node-type': 'status',
|
|
136
|
+
'data-color': color,
|
|
137
|
+
'data-style': style
|
|
138
|
+
};
|
|
139
|
+
|
|
140
|
+
// packages/design-system/lozenge/src/Lozenge/index.tsx
|
|
141
|
+
var appearanceStyle = isComponentVisualRefresh ? 'bold' : 'subtle';
|
|
142
|
+
var appearanceType = appearance in lozengeAppearanceToBgColorMap[appearanceStyle] ? appearance : 'default';
|
|
143
|
+
var lozengeWrapperAttrs = {
|
|
144
|
+
style: (0, _lazyNodeView.convertToInlineCss)(_objectSpread({
|
|
145
|
+
maxWidth: "calc(200px - ".concat("var(--ds-space-100, 8px)", ")"),
|
|
146
|
+
// container
|
|
147
|
+
display: 'inline-flex',
|
|
148
|
+
boxSizing: 'border-box',
|
|
149
|
+
position: 'static',
|
|
150
|
+
blockSize: 'min-content',
|
|
151
|
+
borderRadius: '3px',
|
|
152
|
+
overflow: 'hidden',
|
|
153
|
+
paddingInline: "var(--ds-space-050, 4px)",
|
|
154
|
+
// background
|
|
155
|
+
backgroundColor: (_style$backgroundColo = style === null || style === void 0 ? void 0 : style.backgroundColor) !== null && _style$backgroundColo !== void 0 ? _style$backgroundColo : lozengeAppearanceToBgColorMap[appearanceStyle][appearanceType]
|
|
156
|
+
}, appearanceStyle === 'subtle' ? (0, _platformFeatureFlags.fg)('visual-refresh_drop_5') ? {
|
|
157
|
+
outline: borderStyleMap[appearanceStyle][appearanceType],
|
|
158
|
+
outlineOffset: -1
|
|
159
|
+
} : {
|
|
160
|
+
border: borderStyleMap[appearanceStyle][appearanceType]
|
|
161
|
+
} : {}))
|
|
162
|
+
};
|
|
163
|
+
var lozengeTextAttrs = {
|
|
164
|
+
style: (0, _lazyNodeView.convertToInlineCss)({
|
|
165
|
+
color: appearanceStyle === 'subtle' ? "var(--ds-text, #172B4D)" : '#292A2E',
|
|
166
|
+
maxWidth: '100%',
|
|
167
|
+
font: "var(--ds-font-body-small, normal 400 11px/16px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)",
|
|
168
|
+
fontWeight: "var(--ds-font-weight-bold, 700)",
|
|
169
|
+
overflow: 'hidden',
|
|
170
|
+
textOverflow: 'ellipsis',
|
|
171
|
+
textTransform: "var(--ds-UNSAFE-textTransformUppercase, uppercase)",
|
|
172
|
+
whiteSpace: 'nowrap'
|
|
173
|
+
})
|
|
174
|
+
};
|
|
175
|
+
if (isComponentVisualRefresh) {
|
|
176
|
+
return ['span', editorNodeWrapperAttrs, ['span', statusElementAttrs, ['span', lozengeWrapperAttrs, ['span', lozengeTextAttrs, text]]]];
|
|
177
|
+
} else {
|
|
178
|
+
var _style$color;
|
|
179
|
+
// packages/design-system/lozenge/src/Lozenge/index.tsx
|
|
180
|
+
var appearanceTypeOld = appearance in backgroundColorsOld[appearanceStyle] ? appearance : 'default';
|
|
181
|
+
var legacyLozengeBoxAttrs = {
|
|
182
|
+
style: (0, _lazyNodeView.convertToInlineCss)({
|
|
183
|
+
backgroundColor: backgroundColorsOld[appearanceStyle][appearanceTypeOld],
|
|
184
|
+
maxWidth: '100%',
|
|
185
|
+
paddingInline: "var(--ds-space-050, 4px)",
|
|
186
|
+
display: 'inline-flex',
|
|
187
|
+
borderRadius: "var(--ds-border-radius, 4px)",
|
|
188
|
+
blockSize: 'min-content',
|
|
189
|
+
position: 'static',
|
|
190
|
+
overflow: 'hidden',
|
|
191
|
+
boxSizing: 'border-box',
|
|
192
|
+
appearance: 'none',
|
|
193
|
+
border: 'none'
|
|
194
|
+
})
|
|
195
|
+
};
|
|
196
|
+
var legacyLozengeTextAttrs = {
|
|
197
|
+
style: (0, _lazyNodeView.convertToInlineCss)({
|
|
198
|
+
font: "var(--ds-font-body-small, normal 400 11px/16px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)",
|
|
199
|
+
fontFamily: "var(--ds-font-family-body, ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)",
|
|
200
|
+
fontWeight: "var(--ds-font-weight-bold, 700)",
|
|
201
|
+
overflow: 'hidden',
|
|
202
|
+
textOverflow: 'ellipsis',
|
|
203
|
+
textTransform: "var(--ds-UNSAFE-textTransformUppercase, uppercase)",
|
|
204
|
+
whiteSpace: 'nowrap',
|
|
205
|
+
color: (_style$color = style === null || style === void 0 ? void 0 : style.color) !== null && _style$color !== void 0 ? _style$color : textColorsOld[appearanceStyle][appearanceTypeOld],
|
|
206
|
+
maxWidth: '100%'
|
|
207
|
+
})
|
|
208
|
+
};
|
|
209
|
+
return ['span', editorNodeWrapperAttrs, ['span', statusElementAttrs, ['span', legacyLozengeBoxAttrs, ['span', legacyLozengeTextAttrs, text]]]];
|
|
210
|
+
}
|
|
211
|
+
}
|
|
212
|
+
});
|
|
213
|
+
};
|
package/dist/cjs/statusPlugin.js
CHANGED
|
@@ -6,7 +6,6 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
6
6
|
});
|
|
7
7
|
exports.statusPlugin = void 0;
|
|
8
8
|
var _react = _interopRequireDefault(require("react"));
|
|
9
|
-
var _adfSchema = require("@atlaskit/adf-schema");
|
|
10
9
|
var _analytics = require("@atlaskit/editor-common/analytics");
|
|
11
10
|
var _keymaps = require("@atlaskit/editor-common/keymaps");
|
|
12
11
|
var _messages = require("@atlaskit/editor-common/messages");
|
|
@@ -14,6 +13,7 @@ var _quickInsert = require("@atlaskit/editor-common/quick-insert");
|
|
|
14
13
|
var _utils = require("@atlaskit/editor-common/utils");
|
|
15
14
|
var _comment = _interopRequireDefault(require("@atlaskit/icon/core/comment"));
|
|
16
15
|
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
16
|
+
var _statusNodeSpec = require("./nodeviews/statusNodeSpec");
|
|
17
17
|
var _actions = require("./pm-plugins/actions");
|
|
18
18
|
var _keymap = require("./pm-plugins/keymap");
|
|
19
19
|
var _plugin = _interopRequireDefault(require("./pm-plugins/plugin"));
|
|
@@ -28,7 +28,7 @@ var statusPlugin = exports.statusPlugin = function statusPlugin(_ref) {
|
|
|
28
28
|
nodes: function nodes() {
|
|
29
29
|
return [{
|
|
30
30
|
name: 'status',
|
|
31
|
-
node:
|
|
31
|
+
node: (0, _statusNodeSpec.statusNodeSpec)()
|
|
32
32
|
}];
|
|
33
33
|
},
|
|
34
34
|
pmPlugins: function pmPlugins() {
|
|
@@ -0,0 +1,207 @@
|
|
|
1
|
+
import { createIntl } from 'react-intl-next';
|
|
2
|
+
import { status } from '@atlaskit/adf-schema';
|
|
3
|
+
import { convertToInlineCss } from '@atlaskit/editor-common/lazy-node-view';
|
|
4
|
+
import { fg } from '@atlaskit/platform-feature-flags';
|
|
5
|
+
const isSSR = Boolean(process.env.REACT_SSR);
|
|
6
|
+
let intl;
|
|
7
|
+
|
|
8
|
+
// copied from packages/elements/status/src/components/Status.tsx
|
|
9
|
+
const colorToLozengeAppearanceMap = {
|
|
10
|
+
neutral: 'default',
|
|
11
|
+
purple: 'new',
|
|
12
|
+
blue: 'inprogress',
|
|
13
|
+
red: 'removed',
|
|
14
|
+
yellow: 'moved',
|
|
15
|
+
green: 'success'
|
|
16
|
+
};
|
|
17
|
+
const lozengeAppearanceToBgColorMap = {
|
|
18
|
+
bold: {
|
|
19
|
+
default: '#DDDEE1',
|
|
20
|
+
inprogress: '#8FB8F6',
|
|
21
|
+
moved: '#F9C84E',
|
|
22
|
+
new: '#D8A0F7',
|
|
23
|
+
removed: '#FD9891',
|
|
24
|
+
success: '#B3DF72'
|
|
25
|
+
},
|
|
26
|
+
subtle: {
|
|
27
|
+
default: "var(--ds-background-neutral-subtle, #00000000)",
|
|
28
|
+
inprogress: "var(--ds-background-neutral-subtle, #00000000)",
|
|
29
|
+
moved: "var(--ds-background-neutral-subtle, #00000000)",
|
|
30
|
+
new: "var(--ds-background-neutral-subtle, #00000000)",
|
|
31
|
+
removed: "var(--ds-background-neutral-subtle, #00000000)",
|
|
32
|
+
success: "var(--ds-background-neutral-subtle, #00000000)"
|
|
33
|
+
}
|
|
34
|
+
};
|
|
35
|
+
const borderStyleMap = {
|
|
36
|
+
subtle: {
|
|
37
|
+
default: `1px solid #B7B9BE`,
|
|
38
|
+
inprogress: `1px solid #669DF1`,
|
|
39
|
+
moved: `1px solid #FCA700`,
|
|
40
|
+
new: `1px solid #C97CF4`,
|
|
41
|
+
removed: `1px solid #F87168`,
|
|
42
|
+
success: `1px solid #94C748`
|
|
43
|
+
}
|
|
44
|
+
};
|
|
45
|
+
const backgroundColorsOld = {
|
|
46
|
+
bold: {
|
|
47
|
+
default: "var(--ds-background-neutral-bold, #44546F)",
|
|
48
|
+
inprogress: "var(--ds-background-information-bold, #0C66E4)",
|
|
49
|
+
moved: "var(--ds-background-warning-bold, #F5CD47)",
|
|
50
|
+
new: "var(--ds-background-discovery-bold, #6E5DC6)",
|
|
51
|
+
removed: "var(--ds-background-danger-bold, #C9372C)",
|
|
52
|
+
success: "var(--ds-background-success-bold, #1F845A)"
|
|
53
|
+
},
|
|
54
|
+
subtle: {
|
|
55
|
+
default: "var(--ds-background-neutral, #091E420F)",
|
|
56
|
+
inprogress: "var(--ds-background-information, #E9F2FF)",
|
|
57
|
+
moved: "var(--ds-background-warning, #FFF7D6)",
|
|
58
|
+
new: "var(--ds-background-discovery, #F3F0FF)",
|
|
59
|
+
removed: "var(--ds-background-danger, #FFECEB)",
|
|
60
|
+
success: "var(--ds-background-success, #DCFFF1)"
|
|
61
|
+
}
|
|
62
|
+
};
|
|
63
|
+
const textColorsOld = {
|
|
64
|
+
bold: {
|
|
65
|
+
default: "var(--ds-text-inverse, #FFFFFF)",
|
|
66
|
+
inprogress: "var(--ds-text-inverse, #FFFFFF)",
|
|
67
|
+
moved: "var(--ds-text-warning-inverse, #172B4D)",
|
|
68
|
+
new: "var(--ds-text-inverse, #FFFFFF)",
|
|
69
|
+
removed: "var(--ds-text-inverse, #FFFFFF)",
|
|
70
|
+
success: "var(--ds-text-inverse, #FFFFFF)"
|
|
71
|
+
},
|
|
72
|
+
subtle: {
|
|
73
|
+
default: "var(--ds-text-subtle, #44546F)",
|
|
74
|
+
inprogress: "var(--ds-text-information, #0055CC)",
|
|
75
|
+
moved: "var(--ds-text-warning, #A54800)",
|
|
76
|
+
new: "var(--ds-text-discovery, #5E4DB2)",
|
|
77
|
+
removed: "var(--ds-text-danger, #AE2E24)",
|
|
78
|
+
success: "var(--ds-text-success, #216E4E)"
|
|
79
|
+
}
|
|
80
|
+
};
|
|
81
|
+
const DEFAULT_APPEARANCE = 'default';
|
|
82
|
+
|
|
83
|
+
// eg. Version/4.0 Chrome/95.0.4638.50
|
|
84
|
+
const isAndroidChromium = typeof window !== 'undefined' && /Version\/.* Chrome\/.*/u.test(window.navigator.userAgent);
|
|
85
|
+
|
|
86
|
+
/**
|
|
87
|
+
* Wrapper for ADF status node spec to augment toDOM implementation
|
|
88
|
+
* with fallback UI for lazy node view rendering / window virtualization
|
|
89
|
+
* @returns
|
|
90
|
+
*/
|
|
91
|
+
export const statusNodeSpec = () => {
|
|
92
|
+
if (isSSR || !fg('platform_editor_lego__inline_node_virtualization')) {
|
|
93
|
+
return status;
|
|
94
|
+
}
|
|
95
|
+
return {
|
|
96
|
+
...status,
|
|
97
|
+
toDOM: node => {
|
|
98
|
+
var _style$backgroundColo;
|
|
99
|
+
const {
|
|
100
|
+
text,
|
|
101
|
+
color,
|
|
102
|
+
style
|
|
103
|
+
} = node.attrs;
|
|
104
|
+
intl = intl || createIntl({
|
|
105
|
+
locale: document.documentElement.lang || 'en-US'
|
|
106
|
+
});
|
|
107
|
+
const isComponentVisualRefresh = fg('platform-component-visual-refresh');
|
|
108
|
+
const editorNodeWrapperAttrs = {
|
|
109
|
+
'data-testid': 'statusContainerView',
|
|
110
|
+
style: convertToInlineCss(text ? {
|
|
111
|
+
opacity: 1
|
|
112
|
+
} : {
|
|
113
|
+
opacity: 0.5
|
|
114
|
+
})
|
|
115
|
+
};
|
|
116
|
+
|
|
117
|
+
// packages/elements/status/src/components/Status.tsx
|
|
118
|
+
const appearance = colorToLozengeAppearanceMap[color] || DEFAULT_APPEARANCE;
|
|
119
|
+
const statusElementAttrs = {
|
|
120
|
+
style: convertToInlineCss(isAndroidChromium ? {
|
|
121
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-important-styles -- Ignored via go/DSP-18766
|
|
122
|
+
display: 'inline-block !important',
|
|
123
|
+
verticalAlign: 'middle'
|
|
124
|
+
} : {}),
|
|
125
|
+
class: 'status-lozenge-span',
|
|
126
|
+
'aria-busy': 'true',
|
|
127
|
+
'data-node-type': 'status',
|
|
128
|
+
'data-color': color,
|
|
129
|
+
'data-style': style
|
|
130
|
+
};
|
|
131
|
+
|
|
132
|
+
// packages/design-system/lozenge/src/Lozenge/index.tsx
|
|
133
|
+
const appearanceStyle = isComponentVisualRefresh ? 'bold' : 'subtle';
|
|
134
|
+
const appearanceType = appearance in lozengeAppearanceToBgColorMap[appearanceStyle] ? appearance : 'default';
|
|
135
|
+
const lozengeWrapperAttrs = {
|
|
136
|
+
style: convertToInlineCss({
|
|
137
|
+
maxWidth: `calc(200px - ${"var(--ds-space-100, 8px)"})`,
|
|
138
|
+
// container
|
|
139
|
+
display: 'inline-flex',
|
|
140
|
+
boxSizing: 'border-box',
|
|
141
|
+
position: 'static',
|
|
142
|
+
blockSize: 'min-content',
|
|
143
|
+
borderRadius: '3px',
|
|
144
|
+
overflow: 'hidden',
|
|
145
|
+
paddingInline: "var(--ds-space-050, 4px)",
|
|
146
|
+
// background
|
|
147
|
+
backgroundColor: (_style$backgroundColo = style === null || style === void 0 ? void 0 : style.backgroundColor) !== null && _style$backgroundColo !== void 0 ? _style$backgroundColo : lozengeAppearanceToBgColorMap[appearanceStyle][appearanceType],
|
|
148
|
+
// border
|
|
149
|
+
...(appearanceStyle === 'subtle' ? fg('visual-refresh_drop_5') ? {
|
|
150
|
+
outline: borderStyleMap[appearanceStyle][appearanceType],
|
|
151
|
+
outlineOffset: -1
|
|
152
|
+
} : {
|
|
153
|
+
border: borderStyleMap[appearanceStyle][appearanceType]
|
|
154
|
+
} : {})
|
|
155
|
+
})
|
|
156
|
+
};
|
|
157
|
+
const lozengeTextAttrs = {
|
|
158
|
+
style: convertToInlineCss({
|
|
159
|
+
color: appearanceStyle === 'subtle' ? "var(--ds-text, #172B4D)" : '#292A2E',
|
|
160
|
+
maxWidth: '100%',
|
|
161
|
+
font: "var(--ds-font-body-small, normal 400 11px/16px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)",
|
|
162
|
+
fontWeight: "var(--ds-font-weight-bold, 700)",
|
|
163
|
+
overflow: 'hidden',
|
|
164
|
+
textOverflow: 'ellipsis',
|
|
165
|
+
textTransform: "var(--ds-UNSAFE-textTransformUppercase, uppercase)",
|
|
166
|
+
whiteSpace: 'nowrap'
|
|
167
|
+
})
|
|
168
|
+
};
|
|
169
|
+
if (isComponentVisualRefresh) {
|
|
170
|
+
return ['span', editorNodeWrapperAttrs, ['span', statusElementAttrs, ['span', lozengeWrapperAttrs, ['span', lozengeTextAttrs, text]]]];
|
|
171
|
+
} else {
|
|
172
|
+
var _style$color;
|
|
173
|
+
// packages/design-system/lozenge/src/Lozenge/index.tsx
|
|
174
|
+
const appearanceTypeOld = appearance in backgroundColorsOld[appearanceStyle] ? appearance : 'default';
|
|
175
|
+
const legacyLozengeBoxAttrs = {
|
|
176
|
+
style: convertToInlineCss({
|
|
177
|
+
backgroundColor: backgroundColorsOld[appearanceStyle][appearanceTypeOld],
|
|
178
|
+
maxWidth: '100%',
|
|
179
|
+
paddingInline: "var(--ds-space-050, 4px)",
|
|
180
|
+
display: 'inline-flex',
|
|
181
|
+
borderRadius: "var(--ds-border-radius, 4px)",
|
|
182
|
+
blockSize: 'min-content',
|
|
183
|
+
position: 'static',
|
|
184
|
+
overflow: 'hidden',
|
|
185
|
+
boxSizing: 'border-box',
|
|
186
|
+
appearance: 'none',
|
|
187
|
+
border: 'none'
|
|
188
|
+
})
|
|
189
|
+
};
|
|
190
|
+
const legacyLozengeTextAttrs = {
|
|
191
|
+
style: convertToInlineCss({
|
|
192
|
+
font: "var(--ds-font-body-small, normal 400 11px/16px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)",
|
|
193
|
+
fontFamily: "var(--ds-font-family-body, ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)",
|
|
194
|
+
fontWeight: "var(--ds-font-weight-bold, 700)",
|
|
195
|
+
overflow: 'hidden',
|
|
196
|
+
textOverflow: 'ellipsis',
|
|
197
|
+
textTransform: "var(--ds-UNSAFE-textTransformUppercase, uppercase)",
|
|
198
|
+
whiteSpace: 'nowrap',
|
|
199
|
+
color: (_style$color = style === null || style === void 0 ? void 0 : style.color) !== null && _style$color !== void 0 ? _style$color : textColorsOld[appearanceStyle][appearanceTypeOld],
|
|
200
|
+
maxWidth: '100%'
|
|
201
|
+
})
|
|
202
|
+
};
|
|
203
|
+
return ['span', editorNodeWrapperAttrs, ['span', statusElementAttrs, ['span', legacyLozengeBoxAttrs, ['span', legacyLozengeTextAttrs, text]]]];
|
|
204
|
+
}
|
|
205
|
+
}
|
|
206
|
+
};
|
|
207
|
+
};
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { status } from '@atlaskit/adf-schema';
|
|
3
2
|
import { ACTION_SUBJECT_ID, ACTION, ACTION_SUBJECT, EVENT_TYPE, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
|
|
4
3
|
import { addInlineComment, ToolTipContent } from '@atlaskit/editor-common/keymaps';
|
|
5
4
|
import { annotationMessages, toolbarInsertBlockMessages as messages } from '@atlaskit/editor-common/messages';
|
|
@@ -7,6 +6,7 @@ import { IconStatus } from '@atlaskit/editor-common/quick-insert';
|
|
|
7
6
|
import { calculateToolbarPositionAboveSelection } from '@atlaskit/editor-common/utils';
|
|
8
7
|
import CommentIcon from '@atlaskit/icon/core/comment';
|
|
9
8
|
import { fg } from '@atlaskit/platform-feature-flags';
|
|
9
|
+
import { statusNodeSpec } from './nodeviews/statusNodeSpec';
|
|
10
10
|
import { commitStatusPicker, insertStatus, removeStatus, updateStatusWithAnalytics } from './pm-plugins/actions';
|
|
11
11
|
import { keymapPlugin } from './pm-plugins/keymap';
|
|
12
12
|
import createStatusPlugin from './pm-plugins/plugin';
|
|
@@ -22,7 +22,7 @@ export const statusPlugin = ({
|
|
|
22
22
|
nodes() {
|
|
23
23
|
return [{
|
|
24
24
|
name: 'status',
|
|
25
|
-
node:
|
|
25
|
+
node: statusNodeSpec()
|
|
26
26
|
}];
|
|
27
27
|
},
|
|
28
28
|
pmPlugins() {
|
|
@@ -0,0 +1,206 @@
|
|
|
1
|
+
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
2
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
3
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
4
|
+
import { createIntl } from 'react-intl-next';
|
|
5
|
+
import { status } from '@atlaskit/adf-schema';
|
|
6
|
+
import { convertToInlineCss } from '@atlaskit/editor-common/lazy-node-view';
|
|
7
|
+
import { fg } from '@atlaskit/platform-feature-flags';
|
|
8
|
+
var isSSR = Boolean(process.env.REACT_SSR);
|
|
9
|
+
var intl;
|
|
10
|
+
|
|
11
|
+
// copied from packages/elements/status/src/components/Status.tsx
|
|
12
|
+
var colorToLozengeAppearanceMap = {
|
|
13
|
+
neutral: 'default',
|
|
14
|
+
purple: 'new',
|
|
15
|
+
blue: 'inprogress',
|
|
16
|
+
red: 'removed',
|
|
17
|
+
yellow: 'moved',
|
|
18
|
+
green: 'success'
|
|
19
|
+
};
|
|
20
|
+
var lozengeAppearanceToBgColorMap = {
|
|
21
|
+
bold: {
|
|
22
|
+
default: '#DDDEE1',
|
|
23
|
+
inprogress: '#8FB8F6',
|
|
24
|
+
moved: '#F9C84E',
|
|
25
|
+
new: '#D8A0F7',
|
|
26
|
+
removed: '#FD9891',
|
|
27
|
+
success: '#B3DF72'
|
|
28
|
+
},
|
|
29
|
+
subtle: {
|
|
30
|
+
default: "var(--ds-background-neutral-subtle, #00000000)",
|
|
31
|
+
inprogress: "var(--ds-background-neutral-subtle, #00000000)",
|
|
32
|
+
moved: "var(--ds-background-neutral-subtle, #00000000)",
|
|
33
|
+
new: "var(--ds-background-neutral-subtle, #00000000)",
|
|
34
|
+
removed: "var(--ds-background-neutral-subtle, #00000000)",
|
|
35
|
+
success: "var(--ds-background-neutral-subtle, #00000000)"
|
|
36
|
+
}
|
|
37
|
+
};
|
|
38
|
+
var borderStyleMap = {
|
|
39
|
+
subtle: {
|
|
40
|
+
default: "1px solid #B7B9BE",
|
|
41
|
+
inprogress: "1px solid #669DF1",
|
|
42
|
+
moved: "1px solid #FCA700",
|
|
43
|
+
new: "1px solid #C97CF4",
|
|
44
|
+
removed: "1px solid #F87168",
|
|
45
|
+
success: "1px solid #94C748"
|
|
46
|
+
}
|
|
47
|
+
};
|
|
48
|
+
var backgroundColorsOld = {
|
|
49
|
+
bold: {
|
|
50
|
+
default: "var(--ds-background-neutral-bold, #44546F)",
|
|
51
|
+
inprogress: "var(--ds-background-information-bold, #0C66E4)",
|
|
52
|
+
moved: "var(--ds-background-warning-bold, #F5CD47)",
|
|
53
|
+
new: "var(--ds-background-discovery-bold, #6E5DC6)",
|
|
54
|
+
removed: "var(--ds-background-danger-bold, #C9372C)",
|
|
55
|
+
success: "var(--ds-background-success-bold, #1F845A)"
|
|
56
|
+
},
|
|
57
|
+
subtle: {
|
|
58
|
+
default: "var(--ds-background-neutral, #091E420F)",
|
|
59
|
+
inprogress: "var(--ds-background-information, #E9F2FF)",
|
|
60
|
+
moved: "var(--ds-background-warning, #FFF7D6)",
|
|
61
|
+
new: "var(--ds-background-discovery, #F3F0FF)",
|
|
62
|
+
removed: "var(--ds-background-danger, #FFECEB)",
|
|
63
|
+
success: "var(--ds-background-success, #DCFFF1)"
|
|
64
|
+
}
|
|
65
|
+
};
|
|
66
|
+
var textColorsOld = {
|
|
67
|
+
bold: {
|
|
68
|
+
default: "var(--ds-text-inverse, #FFFFFF)",
|
|
69
|
+
inprogress: "var(--ds-text-inverse, #FFFFFF)",
|
|
70
|
+
moved: "var(--ds-text-warning-inverse, #172B4D)",
|
|
71
|
+
new: "var(--ds-text-inverse, #FFFFFF)",
|
|
72
|
+
removed: "var(--ds-text-inverse, #FFFFFF)",
|
|
73
|
+
success: "var(--ds-text-inverse, #FFFFFF)"
|
|
74
|
+
},
|
|
75
|
+
subtle: {
|
|
76
|
+
default: "var(--ds-text-subtle, #44546F)",
|
|
77
|
+
inprogress: "var(--ds-text-information, #0055CC)",
|
|
78
|
+
moved: "var(--ds-text-warning, #A54800)",
|
|
79
|
+
new: "var(--ds-text-discovery, #5E4DB2)",
|
|
80
|
+
removed: "var(--ds-text-danger, #AE2E24)",
|
|
81
|
+
success: "var(--ds-text-success, #216E4E)"
|
|
82
|
+
}
|
|
83
|
+
};
|
|
84
|
+
var DEFAULT_APPEARANCE = 'default';
|
|
85
|
+
|
|
86
|
+
// eg. Version/4.0 Chrome/95.0.4638.50
|
|
87
|
+
var isAndroidChromium = typeof window !== 'undefined' && /Version\/(?:[\0-\t\x0B\f\x0E-\u2027\u202A-\uD7FF\uE000-\uFFFF]|[\uD800-\uDBFF][\uDC00-\uDFFF]|[\uD800-\uDBFF](?![\uDC00-\uDFFF])|(?:[^\uD800-\uDBFF]|^)[\uDC00-\uDFFF])* Chrome\/(?:[\0-\t\x0B\f\x0E-\u2027\u202A-\uD7FF\uE000-\uFFFF]|[\uD800-\uDBFF][\uDC00-\uDFFF]|[\uD800-\uDBFF](?![\uDC00-\uDFFF])|(?:[^\uD800-\uDBFF]|^)[\uDC00-\uDFFF])*/.test(window.navigator.userAgent);
|
|
88
|
+
|
|
89
|
+
/**
|
|
90
|
+
* Wrapper for ADF status node spec to augment toDOM implementation
|
|
91
|
+
* with fallback UI for lazy node view rendering / window virtualization
|
|
92
|
+
* @returns
|
|
93
|
+
*/
|
|
94
|
+
export var statusNodeSpec = function statusNodeSpec() {
|
|
95
|
+
if (isSSR || !fg('platform_editor_lego__inline_node_virtualization')) {
|
|
96
|
+
return status;
|
|
97
|
+
}
|
|
98
|
+
return _objectSpread(_objectSpread({}, status), {}, {
|
|
99
|
+
toDOM: function toDOM(node) {
|
|
100
|
+
var _style$backgroundColo;
|
|
101
|
+
var _node$attrs = node.attrs,
|
|
102
|
+
text = _node$attrs.text,
|
|
103
|
+
color = _node$attrs.color,
|
|
104
|
+
style = _node$attrs.style;
|
|
105
|
+
intl = intl || createIntl({
|
|
106
|
+
locale: document.documentElement.lang || 'en-US'
|
|
107
|
+
});
|
|
108
|
+
var isComponentVisualRefresh = fg('platform-component-visual-refresh');
|
|
109
|
+
var editorNodeWrapperAttrs = {
|
|
110
|
+
'data-testid': 'statusContainerView',
|
|
111
|
+
style: convertToInlineCss(text ? {
|
|
112
|
+
opacity: 1
|
|
113
|
+
} : {
|
|
114
|
+
opacity: 0.5
|
|
115
|
+
})
|
|
116
|
+
};
|
|
117
|
+
|
|
118
|
+
// packages/elements/status/src/components/Status.tsx
|
|
119
|
+
var appearance = colorToLozengeAppearanceMap[color] || DEFAULT_APPEARANCE;
|
|
120
|
+
var statusElementAttrs = {
|
|
121
|
+
style: convertToInlineCss(isAndroidChromium ? {
|
|
122
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-important-styles -- Ignored via go/DSP-18766
|
|
123
|
+
display: 'inline-block !important',
|
|
124
|
+
verticalAlign: 'middle'
|
|
125
|
+
} : {}),
|
|
126
|
+
class: 'status-lozenge-span',
|
|
127
|
+
'aria-busy': 'true',
|
|
128
|
+
'data-node-type': 'status',
|
|
129
|
+
'data-color': color,
|
|
130
|
+
'data-style': style
|
|
131
|
+
};
|
|
132
|
+
|
|
133
|
+
// packages/design-system/lozenge/src/Lozenge/index.tsx
|
|
134
|
+
var appearanceStyle = isComponentVisualRefresh ? 'bold' : 'subtle';
|
|
135
|
+
var appearanceType = appearance in lozengeAppearanceToBgColorMap[appearanceStyle] ? appearance : 'default';
|
|
136
|
+
var lozengeWrapperAttrs = {
|
|
137
|
+
style: convertToInlineCss(_objectSpread({
|
|
138
|
+
maxWidth: "calc(200px - ".concat("var(--ds-space-100, 8px)", ")"),
|
|
139
|
+
// container
|
|
140
|
+
display: 'inline-flex',
|
|
141
|
+
boxSizing: 'border-box',
|
|
142
|
+
position: 'static',
|
|
143
|
+
blockSize: 'min-content',
|
|
144
|
+
borderRadius: '3px',
|
|
145
|
+
overflow: 'hidden',
|
|
146
|
+
paddingInline: "var(--ds-space-050, 4px)",
|
|
147
|
+
// background
|
|
148
|
+
backgroundColor: (_style$backgroundColo = style === null || style === void 0 ? void 0 : style.backgroundColor) !== null && _style$backgroundColo !== void 0 ? _style$backgroundColo : lozengeAppearanceToBgColorMap[appearanceStyle][appearanceType]
|
|
149
|
+
}, appearanceStyle === 'subtle' ? fg('visual-refresh_drop_5') ? {
|
|
150
|
+
outline: borderStyleMap[appearanceStyle][appearanceType],
|
|
151
|
+
outlineOffset: -1
|
|
152
|
+
} : {
|
|
153
|
+
border: borderStyleMap[appearanceStyle][appearanceType]
|
|
154
|
+
} : {}))
|
|
155
|
+
};
|
|
156
|
+
var lozengeTextAttrs = {
|
|
157
|
+
style: convertToInlineCss({
|
|
158
|
+
color: appearanceStyle === 'subtle' ? "var(--ds-text, #172B4D)" : '#292A2E',
|
|
159
|
+
maxWidth: '100%',
|
|
160
|
+
font: "var(--ds-font-body-small, normal 400 11px/16px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)",
|
|
161
|
+
fontWeight: "var(--ds-font-weight-bold, 700)",
|
|
162
|
+
overflow: 'hidden',
|
|
163
|
+
textOverflow: 'ellipsis',
|
|
164
|
+
textTransform: "var(--ds-UNSAFE-textTransformUppercase, uppercase)",
|
|
165
|
+
whiteSpace: 'nowrap'
|
|
166
|
+
})
|
|
167
|
+
};
|
|
168
|
+
if (isComponentVisualRefresh) {
|
|
169
|
+
return ['span', editorNodeWrapperAttrs, ['span', statusElementAttrs, ['span', lozengeWrapperAttrs, ['span', lozengeTextAttrs, text]]]];
|
|
170
|
+
} else {
|
|
171
|
+
var _style$color;
|
|
172
|
+
// packages/design-system/lozenge/src/Lozenge/index.tsx
|
|
173
|
+
var appearanceTypeOld = appearance in backgroundColorsOld[appearanceStyle] ? appearance : 'default';
|
|
174
|
+
var legacyLozengeBoxAttrs = {
|
|
175
|
+
style: convertToInlineCss({
|
|
176
|
+
backgroundColor: backgroundColorsOld[appearanceStyle][appearanceTypeOld],
|
|
177
|
+
maxWidth: '100%',
|
|
178
|
+
paddingInline: "var(--ds-space-050, 4px)",
|
|
179
|
+
display: 'inline-flex',
|
|
180
|
+
borderRadius: "var(--ds-border-radius, 4px)",
|
|
181
|
+
blockSize: 'min-content',
|
|
182
|
+
position: 'static',
|
|
183
|
+
overflow: 'hidden',
|
|
184
|
+
boxSizing: 'border-box',
|
|
185
|
+
appearance: 'none',
|
|
186
|
+
border: 'none'
|
|
187
|
+
})
|
|
188
|
+
};
|
|
189
|
+
var legacyLozengeTextAttrs = {
|
|
190
|
+
style: convertToInlineCss({
|
|
191
|
+
font: "var(--ds-font-body-small, normal 400 11px/16px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)",
|
|
192
|
+
fontFamily: "var(--ds-font-family-body, ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)",
|
|
193
|
+
fontWeight: "var(--ds-font-weight-bold, 700)",
|
|
194
|
+
overflow: 'hidden',
|
|
195
|
+
textOverflow: 'ellipsis',
|
|
196
|
+
textTransform: "var(--ds-UNSAFE-textTransformUppercase, uppercase)",
|
|
197
|
+
whiteSpace: 'nowrap',
|
|
198
|
+
color: (_style$color = style === null || style === void 0 ? void 0 : style.color) !== null && _style$color !== void 0 ? _style$color : textColorsOld[appearanceStyle][appearanceTypeOld],
|
|
199
|
+
maxWidth: '100%'
|
|
200
|
+
})
|
|
201
|
+
};
|
|
202
|
+
return ['span', editorNodeWrapperAttrs, ['span', statusElementAttrs, ['span', legacyLozengeBoxAttrs, ['span', legacyLozengeTextAttrs, text]]]];
|
|
203
|
+
}
|
|
204
|
+
}
|
|
205
|
+
});
|
|
206
|
+
};
|
package/dist/esm/statusPlugin.js
CHANGED
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { status } from '@atlaskit/adf-schema';
|
|
3
2
|
import { ACTION_SUBJECT_ID, ACTION, ACTION_SUBJECT, EVENT_TYPE, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
|
|
4
3
|
import { addInlineComment, ToolTipContent } from '@atlaskit/editor-common/keymaps';
|
|
5
4
|
import { annotationMessages, toolbarInsertBlockMessages as messages } from '@atlaskit/editor-common/messages';
|
|
@@ -7,6 +6,7 @@ import { IconStatus } from '@atlaskit/editor-common/quick-insert';
|
|
|
7
6
|
import { calculateToolbarPositionAboveSelection } from '@atlaskit/editor-common/utils';
|
|
8
7
|
import CommentIcon from '@atlaskit/icon/core/comment';
|
|
9
8
|
import { fg } from '@atlaskit/platform-feature-flags';
|
|
9
|
+
import { statusNodeSpec } from './nodeviews/statusNodeSpec';
|
|
10
10
|
import { commitStatusPicker, insertStatus, removeStatus, updateStatusWithAnalytics } from './pm-plugins/actions';
|
|
11
11
|
import { keymapPlugin } from './pm-plugins/keymap';
|
|
12
12
|
import createStatusPlugin from './pm-plugins/plugin';
|
|
@@ -21,7 +21,7 @@ export var statusPlugin = function statusPlugin(_ref) {
|
|
|
21
21
|
nodes: function nodes() {
|
|
22
22
|
return [{
|
|
23
23
|
name: 'status',
|
|
24
|
-
node:
|
|
24
|
+
node: statusNodeSpec()
|
|
25
25
|
}];
|
|
26
26
|
},
|
|
27
27
|
pmPlugins: function pmPlugins() {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/editor-plugin-status",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "3.0.1",
|
|
4
4
|
"description": "Status plugin for @atlaskit/editor-core",
|
|
5
5
|
"author": "Atlassian Pty Ltd",
|
|
6
6
|
"license": "Apache-2.0",
|
|
@@ -32,22 +32,22 @@
|
|
|
32
32
|
},
|
|
33
33
|
"dependencies": {
|
|
34
34
|
"@atlaskit/adf-schema": "^47.2.1",
|
|
35
|
-
"@atlaskit/analytics-next": "^
|
|
36
|
-
"@atlaskit/editor-common": "^
|
|
37
|
-
"@atlaskit/editor-plugin-analytics": "^
|
|
35
|
+
"@atlaskit/analytics-next": "^11.0.0",
|
|
36
|
+
"@atlaskit/editor-common": "^100.2.0",
|
|
37
|
+
"@atlaskit/editor-plugin-analytics": "^2.0.0",
|
|
38
38
|
"@atlaskit/editor-prosemirror": "7.0.0",
|
|
39
|
-
"@atlaskit/editor-shared-styles": "^3.
|
|
40
|
-
"@atlaskit/icon": "^
|
|
39
|
+
"@atlaskit/editor-shared-styles": "^3.4.0",
|
|
40
|
+
"@atlaskit/icon": "^24.1.0",
|
|
41
41
|
"@atlaskit/platform-feature-flags": "^1.1.0",
|
|
42
|
-
"@atlaskit/status": "^
|
|
43
|
-
"@atlaskit/theme": "^
|
|
44
|
-
"@atlaskit/tokens": "^
|
|
42
|
+
"@atlaskit/status": "^3.0.0",
|
|
43
|
+
"@atlaskit/theme": "^17.0.0",
|
|
44
|
+
"@atlaskit/tokens": "^4.2.0",
|
|
45
45
|
"@babel/runtime": "^7.0.0",
|
|
46
46
|
"@emotion/react": "^11.7.1"
|
|
47
47
|
},
|
|
48
48
|
"peerDependencies": {
|
|
49
|
-
"react": "^
|
|
50
|
-
"react-dom": "^
|
|
49
|
+
"react": "^18.2.0",
|
|
50
|
+
"react-dom": "^18.2.0",
|
|
51
51
|
"react-intl-next": "npm:react-intl@^5.18.1"
|
|
52
52
|
},
|
|
53
53
|
"devDependencies": {
|
|
@@ -103,6 +103,12 @@
|
|
|
103
103
|
},
|
|
104
104
|
"platform_inline_node_as_valid_annotation_selection": {
|
|
105
105
|
"type": "boolean"
|
|
106
|
+
},
|
|
107
|
+
"platform_editor_lego__inline_node_virtualization": {
|
|
108
|
+
"type": "boolean"
|
|
109
|
+
},
|
|
110
|
+
"visual-refresh_drop_5": {
|
|
111
|
+
"type": "boolean"
|
|
106
112
|
}
|
|
107
113
|
}
|
|
108
114
|
}
|