@atlaskit/status 3.1.20 → 3.1.22

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.
Files changed (8) hide show
  1. package/CHANGELOG.md +14 -0
  2. package/dist/cjs/components/analytics.js +1 -1
  3. package/dist/cjs/components/internal/color-palette.js +2 -38
  4. package/dist/es2019/components/analytics.js +1 -1
  5. package/dist/es2019/components/internal/color-palette.js +3 -32
  6. package/dist/esm/components/analytics.js +1 -1
  7. package/dist/esm/components/internal/color-palette.js +3 -39
  8. package/package.json +2 -2
package/CHANGELOG.md CHANGED
@@ -1,5 +1,19 @@
1
1
  # @atlaskit/status
2
2
 
3
+ ## 3.1.22
4
+
5
+ ### Patch Changes
6
+
7
+ - [`46ff42199054d`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/46ff42199054d) -
8
+ Cleans up experiment platform_editor_eslint_suppression_fix
9
+ - Updated dependencies
10
+
11
+ ## 3.1.21
12
+
13
+ ### Patch Changes
14
+
15
+ - Updated dependencies
16
+
3
17
  ## 3.1.20
4
18
 
5
19
  ### Patch Changes
package/dist/cjs/components/analytics.js CHANGED
@@ -10,7 +10,7 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbol
10
10
  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; }
11
11
  var ELEMENTS_CHANNEL = exports.ELEMENTS_CHANNEL = 'fabric-elements';
12
12
  var packageName = "@atlaskit/status";
13
- var packageVersion = "0.0.0-development";
13
+ var packageVersion = "3.1.21";
14
14
  var createStatusAnalyticsAndFire = exports.createStatusAnalyticsAndFire = function createStatusAnalyticsAndFire(createAnalyticsEvent) {
15
15
  return function (payload) {
16
16
  var statusPayload = _objectSpread(_objectSpread({}, payload), {}, {
package/dist/cjs/components/internal/color-palette.js CHANGED
@@ -13,7 +13,6 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/sli
13
13
  var _react = _interopRequireWildcard(require("react"));
14
14
  var _color = _interopRequireDefault(require("./color"));
15
15
  var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
16
- var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
17
16
  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" != _typeof(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); }
18
17
  var paletteLegacy = [['neutral', "var(--ds-background-neutral, #0515240F)", "var(--ds-border-bold, #7D818A)", "var(--ds-icon, #292A2E)"], ['purple', "var(--ds-background-discovery, #F8EEFE)", "var(--ds-border-discovery, #AF59E1)", "var(--ds-icon-discovery, #AF59E1)"], ['blue', "var(--ds-background-information, #E9F2FE)", "var(--ds-border-information, #357DE8)", "var(--ds-icon-information, #357DE8)"], ['red', "var(--ds-background-danger, #FFECEB)", "var(--ds-border-danger, #E2483D)", "var(--ds-icon-danger, #C9372C)"], ['yellow', "var(--ds-background-warning, #FFF5DB)", "var(--ds-border-warning, #E06C00)", "var(--ds-icon-warning, #E06C00)"], ['green', "var(--ds-background-success, #EFFFD6)", "var(--ds-border-success, #6A9A23)", "var(--ds-icon-success, #6A9A23)"]];
19
18
  var paletteRefreshed = [['neutral', "var(--ds-background-accent-gray-subtler, #DDDEE1)", "var(--ds-border-bold, #7D818A)", "var(--ds-icon, #292A2E)"], ['blue', "var(--ds-background-information-pressed, #ADCBFB)", "var(--ds-border-information, #357DE8)", "var(--ds-icon, #292A2E)"], ['green', "var(--ds-background-success-pressed, #BDE97C)", "var(--ds-border-success, #6A9A23)", "var(--ds-icon, #292A2E)"], ['yellow', "var(--ds-background-warning-pressed, #FBD779)", "var(--ds-border-warning, #E06C00)", "var(--ds-icon, #292A2E)"], ['red', "var(--ds-background-danger-pressed, #FFB8B2)", "var(--ds-border-danger, #E2483D)", "var(--ds-icon, #292A2E)"], ['purple', "var(--ds-background-discovery-pressed, #E3BDFA)", "var(--ds-border-discovery, #AF59E1)", "var(--ds-icon, #292A2E)"]];
@@ -32,10 +31,6 @@ var _default = exports.default = function _default(_ref) {
32
31
  onHover = _ref.onHover;
33
32
  var palette = getPalette();
34
33
  var colorRefs = (0, _react.useRef)([]);
35
- var _useState = (0, _react.useState)(0),
36
- _useState2 = (0, _slicedToArray2.default)(_useState, 2),
37
- currentFocusedColor = _useState2[0],
38
- setCurrentFocusedColor = _useState2[1];
39
34
  (0, _react.useEffect)(function () {
40
35
  colorRefs.current = colorRefs.current.slice(0, palette.length);
41
36
  }, [palette.length]);
@@ -67,43 +62,12 @@ var _default = exports.default = function _default(_ref) {
67
62
  (_colorRefs$current$ne = colorRefs.current[newColorIndex]) === null || _colorRefs$current$ne === void 0 || _colorRefs$current$ne.focus();
68
63
  };
69
64
  }, [colorRefs, palette.length]);
70
- var memoizedHandleKeyDown = (0, _react.useCallback)(function (e) {
71
- var newColorIndex = null;
72
- var nextColor = function nextColor() {
73
- return currentFocusedColor + 1 > palette.length - 1 ? 0 : currentFocusedColor + 1;
74
- };
75
- var previousColor = function previousColor() {
76
- return currentFocusedColor - 1 < 0 ? palette.length - 1 : currentFocusedColor - 1;
77
- };
78
- switch (e.key) {
79
- case 'ArrowRight':
80
- case 'ArrowDown':
81
- e.preventDefault();
82
- newColorIndex = nextColor();
83
- break;
84
- case 'ArrowLeft':
85
- case 'ArrowUp':
86
- e.preventDefault();
87
- newColorIndex = previousColor();
88
- break;
89
- case 'Tab':
90
- setCurrentFocusedColor(0);
91
- break;
92
- }
93
- if (newColorIndex === null) {
94
- return;
95
- }
96
- setCurrentFocusedColor(newColorIndex);
97
- var newRef = colorRefs.current[newColorIndex];
98
- newRef === null || newRef === void 0 || newRef.focus();
99
- }, [currentFocusedColor, setCurrentFocusedColor, colorRefs, palette.length]);
100
65
  return /*#__PURE__*/_react.default.createElement("ul", {
101
66
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
102
67
  className: (0, _runtime.ax)(["_19bvidpf _19pku2gc _2hwxu2gc _otyridpf _18u0u2gc _1e0c1txw _1n261g80", className]),
103
68
  style: {
104
69
  maxWidth: cols * 32
105
- },
106
- onKeyDown: (0, _expValEquals.expValEquals)('platform_editor_eslint_suppression_fix', 'isEnabled', true) ? undefined : memoizedHandleKeyDown
70
+ }
107
71
  }, palette.map(function (_ref2, i) {
108
72
  var _ref3 = (0, _slicedToArray2.default)(_ref2, 4),
109
73
  colorValue = _ref3[0],
@@ -123,7 +87,7 @@ var _default = exports.default = function _default(_ref) {
123
87
  setRef: function setRef(el) {
124
88
  return colorRefs.current[i] = el;
125
89
  },
126
- onKeyDown: (0, _expValEquals.expValEquals)('platform_editor_eslint_suppression_fix', 'isEnabled', true) ? createKeyDownHandler(i) : undefined
90
+ onKeyDown: createKeyDownHandler(i)
127
91
  });
128
92
  }));
129
93
  };
package/dist/es2019/components/analytics.js CHANGED
@@ -1,6 +1,6 @@
1
1
  export const ELEMENTS_CHANNEL = 'fabric-elements';
2
2
  const packageName = "@atlaskit/status";
3
- const packageVersion = "0.0.0-development";
3
+ const packageVersion = "3.1.21";
4
4
  export const createStatusAnalyticsAndFire = createAnalyticsEvent => payload => {
5
5
  const statusPayload = {
6
6
  ...payload,
package/dist/es2019/components/internal/color-palette.js CHANGED
@@ -1,10 +1,9 @@
1
1
  /* color-palette.tsx generated by @compiled/babel-plugin v0.39.1 */
2
2
  import "./color-palette.compiled.css";
3
3
  import { ax, ix } from "@compiled/react/runtime";
4
- import React, { useEffect, useRef, useCallback, useState } from 'react';
4
+ import React, { useEffect, useRef, useCallback } from 'react';
5
5
  import Color from './color';
6
6
  import { fg } from '@atlaskit/platform-feature-flags';
7
- import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
8
7
  const paletteLegacy = [['neutral', "var(--ds-background-neutral, #0515240F)", "var(--ds-border-bold, #7D818A)", "var(--ds-icon, #292A2E)"], ['purple', "var(--ds-background-discovery, #F8EEFE)", "var(--ds-border-discovery, #AF59E1)", "var(--ds-icon-discovery, #AF59E1)"], ['blue', "var(--ds-background-information, #E9F2FE)", "var(--ds-border-information, #357DE8)", "var(--ds-icon-information, #357DE8)"], ['red', "var(--ds-background-danger, #FFECEB)", "var(--ds-border-danger, #E2483D)", "var(--ds-icon-danger, #C9372C)"], ['yellow', "var(--ds-background-warning, #FFF5DB)", "var(--ds-border-warning, #E06C00)", "var(--ds-icon-warning, #E06C00)"], ['green', "var(--ds-background-success, #EFFFD6)", "var(--ds-border-success, #6A9A23)", "var(--ds-icon-success, #6A9A23)"]];
9
8
  const paletteRefreshed = [['neutral', "var(--ds-background-accent-gray-subtler, #DDDEE1)", "var(--ds-border-bold, #7D818A)", "var(--ds-icon, #292A2E)"], ['blue', "var(--ds-background-information-pressed, #ADCBFB)", "var(--ds-border-information, #357DE8)", "var(--ds-icon, #292A2E)"], ['green', "var(--ds-background-success-pressed, #BDE97C)", "var(--ds-border-success, #6A9A23)", "var(--ds-icon, #292A2E)"], ['yellow', "var(--ds-background-warning-pressed, #FBD779)", "var(--ds-border-warning, #E06C00)", "var(--ds-icon, #292A2E)"], ['red', "var(--ds-background-danger-pressed, #FFB8B2)", "var(--ds-border-danger, #E2483D)", "var(--ds-icon, #292A2E)"], ['purple', "var(--ds-background-discovery-pressed, #E3BDFA)", "var(--ds-border-discovery, #AF59E1)", "var(--ds-icon, #292A2E)"]];
10
9
  const getPalette = () => fg('platform-component-visual-refresh') ? paletteRefreshed : paletteLegacy;
@@ -20,7 +19,6 @@ export default (({
20
19
  }) => {
21
20
  const palette = getPalette();
22
21
  const colorRefs = useRef([]);
23
- const [currentFocusedColor, setCurrentFocusedColor] = useState(0);
24
22
  useEffect(() => {
25
23
  colorRefs.current = colorRefs.current.slice(0, palette.length);
26
24
  }, [palette.length]);
@@ -46,39 +44,12 @@ export default (({
46
44
  }
47
45
  (_colorRefs$current$ne = colorRefs.current[newColorIndex]) === null || _colorRefs$current$ne === void 0 ? void 0 : _colorRefs$current$ne.focus();
48
46
  }, [colorRefs, palette.length]);
49
- const memoizedHandleKeyDown = useCallback(e => {
50
- let newColorIndex = null;
51
- const nextColor = () => currentFocusedColor + 1 > palette.length - 1 ? 0 : currentFocusedColor + 1;
52
- const previousColor = () => currentFocusedColor - 1 < 0 ? palette.length - 1 : currentFocusedColor - 1;
53
- switch (e.key) {
54
- case 'ArrowRight':
55
- case 'ArrowDown':
56
- e.preventDefault();
57
- newColorIndex = nextColor();
58
- break;
59
- case 'ArrowLeft':
60
- case 'ArrowUp':
61
- e.preventDefault();
62
- newColorIndex = previousColor();
63
- break;
64
- case 'Tab':
65
- setCurrentFocusedColor(0);
66
- break;
67
- }
68
- if (newColorIndex === null) {
69
- return;
70
- }
71
- setCurrentFocusedColor(newColorIndex);
72
- const newRef = colorRefs.current[newColorIndex];
73
- newRef === null || newRef === void 0 ? void 0 : newRef.focus();
74
- }, [currentFocusedColor, setCurrentFocusedColor, colorRefs, palette.length]);
75
47
  return /*#__PURE__*/React.createElement("ul", {
76
48
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
77
49
  className: ax(["_19bvidpf _19pku2gc _2hwxu2gc _otyridpf _18u0u2gc _1e0c1txw _1n261g80", className]),
78
50
  style: {
79
51
  maxWidth: cols * 32
80
- },
81
- onKeyDown: expValEquals('platform_editor_eslint_suppression_fix', 'isEnabled', true) ? undefined : memoizedHandleKeyDown
52
+ }
82
53
  }, palette.map(([colorValue, backgroundColor, borderColor, iconColor], i) => /*#__PURE__*/React.createElement(Color, {
83
54
  key: colorValue,
84
55
  value: colorValue,
@@ -90,6 +61,6 @@ export default (({
90
61
  isSelected: colorValue === selectedColor,
91
62
  tabIndex: i === 0 ? 0 : -1,
92
63
  setRef: el => colorRefs.current[i] = el,
93
- onKeyDown: expValEquals('platform_editor_eslint_suppression_fix', 'isEnabled', true) ? createKeyDownHandler(i) : undefined
64
+ onKeyDown: createKeyDownHandler(i)
94
65
  })));
95
66
  });
package/dist/esm/components/analytics.js CHANGED
@@ -3,7 +3,7 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbol
3
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
4
  export var ELEMENTS_CHANNEL = 'fabric-elements';
5
5
  var packageName = "@atlaskit/status";
6
- var packageVersion = "0.0.0-development";
6
+ var packageVersion = "3.1.21";
7
7
  export var createStatusAnalyticsAndFire = function createStatusAnalyticsAndFire(createAnalyticsEvent) {
8
8
  return function (payload) {
9
9
  var statusPayload = _objectSpread(_objectSpread({}, payload), {}, {
package/dist/esm/components/internal/color-palette.js CHANGED
@@ -2,10 +2,9 @@
2
2
  import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
3
3
  import "./color-palette.compiled.css";
4
4
  import { ax, ix } from "@compiled/react/runtime";
5
- import React, { useEffect, useRef, useCallback, useState } from 'react';
5
+ import React, { useEffect, useRef, useCallback } from 'react';
6
6
  import Color from './color';
7
7
  import { fg } from '@atlaskit/platform-feature-flags';
8
- import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
9
8
  var paletteLegacy = [['neutral', "var(--ds-background-neutral, #0515240F)", "var(--ds-border-bold, #7D818A)", "var(--ds-icon, #292A2E)"], ['purple', "var(--ds-background-discovery, #F8EEFE)", "var(--ds-border-discovery, #AF59E1)", "var(--ds-icon-discovery, #AF59E1)"], ['blue', "var(--ds-background-information, #E9F2FE)", "var(--ds-border-information, #357DE8)", "var(--ds-icon-information, #357DE8)"], ['red', "var(--ds-background-danger, #FFECEB)", "var(--ds-border-danger, #E2483D)", "var(--ds-icon-danger, #C9372C)"], ['yellow', "var(--ds-background-warning, #FFF5DB)", "var(--ds-border-warning, #E06C00)", "var(--ds-icon-warning, #E06C00)"], ['green', "var(--ds-background-success, #EFFFD6)", "var(--ds-border-success, #6A9A23)", "var(--ds-icon-success, #6A9A23)"]];
10
9
  var paletteRefreshed = [['neutral', "var(--ds-background-accent-gray-subtler, #DDDEE1)", "var(--ds-border-bold, #7D818A)", "var(--ds-icon, #292A2E)"], ['blue', "var(--ds-background-information-pressed, #ADCBFB)", "var(--ds-border-information, #357DE8)", "var(--ds-icon, #292A2E)"], ['green', "var(--ds-background-success-pressed, #BDE97C)", "var(--ds-border-success, #6A9A23)", "var(--ds-icon, #292A2E)"], ['yellow', "var(--ds-background-warning-pressed, #FBD779)", "var(--ds-border-warning, #E06C00)", "var(--ds-icon, #292A2E)"], ['red', "var(--ds-background-danger-pressed, #FFB8B2)", "var(--ds-border-danger, #E2483D)", "var(--ds-icon, #292A2E)"], ['purple', "var(--ds-background-discovery-pressed, #E3BDFA)", "var(--ds-border-discovery, #AF59E1)", "var(--ds-icon, #292A2E)"]];
11
10
  var getPalette = function getPalette() {
@@ -23,10 +22,6 @@ export default (function (_ref) {
23
22
  onHover = _ref.onHover;
24
23
  var palette = getPalette();
25
24
  var colorRefs = useRef([]);
26
- var _useState = useState(0),
27
- _useState2 = _slicedToArray(_useState, 2),
28
- currentFocusedColor = _useState2[0],
29
- setCurrentFocusedColor = _useState2[1];
30
25
  useEffect(function () {
31
26
  colorRefs.current = colorRefs.current.slice(0, palette.length);
32
27
  }, [palette.length]);
@@ -58,43 +53,12 @@ export default (function (_ref) {
58
53
  (_colorRefs$current$ne = colorRefs.current[newColorIndex]) === null || _colorRefs$current$ne === void 0 || _colorRefs$current$ne.focus();
59
54
  };
60
55
  }, [colorRefs, palette.length]);
61
- var memoizedHandleKeyDown = useCallback(function (e) {
62
- var newColorIndex = null;
63
- var nextColor = function nextColor() {
64
- return currentFocusedColor + 1 > palette.length - 1 ? 0 : currentFocusedColor + 1;
65
- };
66
- var previousColor = function previousColor() {
67
- return currentFocusedColor - 1 < 0 ? palette.length - 1 : currentFocusedColor - 1;
68
- };
69
- switch (e.key) {
70
- case 'ArrowRight':
71
- case 'ArrowDown':
72
- e.preventDefault();
73
- newColorIndex = nextColor();
74
- break;
75
- case 'ArrowLeft':
76
- case 'ArrowUp':
77
- e.preventDefault();
78
- newColorIndex = previousColor();
79
- break;
80
- case 'Tab':
81
- setCurrentFocusedColor(0);
82
- break;
83
- }
84
- if (newColorIndex === null) {
85
- return;
86
- }
87
- setCurrentFocusedColor(newColorIndex);
88
- var newRef = colorRefs.current[newColorIndex];
89
- newRef === null || newRef === void 0 || newRef.focus();
90
- }, [currentFocusedColor, setCurrentFocusedColor, colorRefs, palette.length]);
91
56
  return /*#__PURE__*/React.createElement("ul", {
92
57
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
93
58
  className: ax(["_19bvidpf _19pku2gc _2hwxu2gc _otyridpf _18u0u2gc _1e0c1txw _1n261g80", className]),
94
59
  style: {
95
60
  maxWidth: cols * 32
96
- },
97
- onKeyDown: expValEquals('platform_editor_eslint_suppression_fix', 'isEnabled', true) ? undefined : memoizedHandleKeyDown
61
+ }
98
62
  }, palette.map(function (_ref2, i) {
99
63
  var _ref3 = _slicedToArray(_ref2, 4),
100
64
  colorValue = _ref3[0],
@@ -114,7 +78,7 @@ export default (function (_ref) {
114
78
  setRef: function setRef(el) {
115
79
  return colorRefs.current[i] = el;
116
80
  },
117
- onKeyDown: expValEquals('platform_editor_eslint_suppression_fix', 'isEnabled', true) ? createKeyDownHandler(i) : undefined
81
+ onKeyDown: createKeyDownHandler(i)
118
82
  });
119
83
  }));
120
84
  });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/status",
3
- "version": "3.1.20",
3
+ "version": "3.1.22",
4
4
  "description": "Fabric Status React Components",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -33,7 +33,7 @@
33
33
  "@atlaskit/platform-feature-flags": "^1.1.0",
34
34
  "@atlaskit/primitives": "^18.0.0",
35
35
  "@atlaskit/textfield": "^8.2.0",
36
- "@atlaskit/tmp-editor-statsig": "^40.2.0",
36
+ "@atlaskit/tmp-editor-statsig": "^42.0.0",
37
37
  "@atlaskit/tokens": "^11.1.0",
38
38
  "@babel/runtime": "^7.0.0",
39
39
  "@compiled/react": "^0.20.0"