@atlaskit/tokens 1.53.1 → 1.53.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,14 @@
|
|
|
1
1
|
# @atlaskit/tokens
|
|
2
2
|
|
|
3
|
+
## 1.53.2
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [#116982](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/116982)
|
|
8
|
+
[`a8a3ff480c6a1`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/a8a3ff480c6a1) -
|
|
9
|
+
Cleaned up feature flag
|
|
10
|
+
`platform.design-system-team.mutation-observer-performance-improvement_8usdg`.
|
|
11
|
+
|
|
3
12
|
## 1.53.1
|
|
4
13
|
|
|
5
14
|
### Patch Changes
|
|
@@ -8,7 +8,6 @@ exports.default = void 0;
|
|
|
8
8
|
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
|
|
9
9
|
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
|
|
10
10
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
11
|
-
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
12
11
|
var _constants = require("./constants");
|
|
13
12
|
var _getGlobalTheme = _interopRequireDefault(require("./get-global-theme"));
|
|
14
13
|
/**
|
|
@@ -29,34 +28,20 @@ var ThemeMutationObserver = exports.default = /*#__PURE__*/function () {
|
|
|
29
28
|
(0, _classCallCheck2.default)(this, ThemeMutationObserver);
|
|
30
29
|
(0, _defineProperty2.default)(this, "legacyObserver", null);
|
|
31
30
|
this.callback = callback;
|
|
32
|
-
|
|
33
|
-
ThemeMutationObserver.callbacks.add(callback);
|
|
34
|
-
}
|
|
31
|
+
ThemeMutationObserver.callbacks.add(callback);
|
|
35
32
|
}
|
|
36
33
|
(0, _createClass2.default)(ThemeMutationObserver, [{
|
|
37
34
|
key: "observe",
|
|
38
35
|
value: function observe() {
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
ThemeMutationObserver.
|
|
43
|
-
|
|
44
|
-
ThemeMutationObserver.callbacks.forEach(function (callback) {
|
|
45
|
-
return callback(theme);
|
|
46
|
-
});
|
|
47
|
-
});
|
|
48
|
-
// Observer only needs to be configured once
|
|
49
|
-
ThemeMutationObserver.observer.observe(document.documentElement, {
|
|
50
|
-
attributeFilter: [_constants.THEME_DATA_ATTRIBUTE, _constants.COLOR_MODE_ATTRIBUTE]
|
|
51
|
-
});
|
|
52
|
-
}
|
|
53
|
-
} else {
|
|
54
|
-
if (!this.legacyObserver) {
|
|
55
|
-
this.legacyObserver = new MutationObserver(function () {
|
|
56
|
-
_this.callback((0, _getGlobalTheme.default)());
|
|
36
|
+
if (!ThemeMutationObserver.observer) {
|
|
37
|
+
ThemeMutationObserver.observer = new MutationObserver(function () {
|
|
38
|
+
var theme = (0, _getGlobalTheme.default)();
|
|
39
|
+
ThemeMutationObserver.callbacks.forEach(function (callback) {
|
|
40
|
+
return callback(theme);
|
|
57
41
|
});
|
|
58
|
-
}
|
|
59
|
-
|
|
42
|
+
});
|
|
43
|
+
// Observer only needs to be configured once
|
|
44
|
+
ThemeMutationObserver.observer.observe(document.documentElement, {
|
|
60
45
|
attributeFilter: [_constants.THEME_DATA_ATTRIBUTE, _constants.COLOR_MODE_ATTRIBUTE]
|
|
61
46
|
});
|
|
62
47
|
}
|
|
@@ -64,16 +49,12 @@ var ThemeMutationObserver = exports.default = /*#__PURE__*/function () {
|
|
|
64
49
|
}, {
|
|
65
50
|
key: "disconnect",
|
|
66
51
|
value: function disconnect() {
|
|
67
|
-
if (
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
ThemeMutationObserver.observer = null;
|
|
74
|
-
}
|
|
75
|
-
} else {
|
|
76
|
-
this.legacyObserver && this.legacyObserver.disconnect();
|
|
52
|
+
if (this.callback) {
|
|
53
|
+
ThemeMutationObserver.callbacks.delete(this.callback);
|
|
54
|
+
}
|
|
55
|
+
if (ThemeMutationObserver.callbacks.size === 0 && ThemeMutationObserver.observer) {
|
|
56
|
+
ThemeMutationObserver.observer.disconnect();
|
|
57
|
+
ThemeMutationObserver.observer = null;
|
|
77
58
|
}
|
|
78
59
|
}
|
|
79
60
|
}]);
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
2
|
-
import { getBooleanFF } from '@atlaskit/platform-feature-flags';
|
|
3
2
|
import { COLOR_MODE_ATTRIBUTE, THEME_DATA_ATTRIBUTE } from './constants';
|
|
4
3
|
import getGlobalTheme from './get-global-theme';
|
|
5
4
|
/**
|
|
@@ -19,44 +18,27 @@ export default class ThemeMutationObserver {
|
|
|
19
18
|
constructor(callback) {
|
|
20
19
|
_defineProperty(this, "legacyObserver", null);
|
|
21
20
|
this.callback = callback;
|
|
22
|
-
|
|
23
|
-
ThemeMutationObserver.callbacks.add(callback);
|
|
24
|
-
}
|
|
21
|
+
ThemeMutationObserver.callbacks.add(callback);
|
|
25
22
|
}
|
|
26
23
|
observe() {
|
|
27
|
-
if (
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
ThemeMutationObserver.observer.observe(document.documentElement, {
|
|
35
|
-
attributeFilter: [THEME_DATA_ATTRIBUTE, COLOR_MODE_ATTRIBUTE]
|
|
36
|
-
});
|
|
37
|
-
}
|
|
38
|
-
} else {
|
|
39
|
-
if (!this.legacyObserver) {
|
|
40
|
-
this.legacyObserver = new MutationObserver(() => {
|
|
41
|
-
this.callback(getGlobalTheme());
|
|
42
|
-
});
|
|
43
|
-
}
|
|
44
|
-
this.legacyObserver.observe(document.documentElement, {
|
|
24
|
+
if (!ThemeMutationObserver.observer) {
|
|
25
|
+
ThemeMutationObserver.observer = new MutationObserver(() => {
|
|
26
|
+
const theme = getGlobalTheme();
|
|
27
|
+
ThemeMutationObserver.callbacks.forEach(callback => callback(theme));
|
|
28
|
+
});
|
|
29
|
+
// Observer only needs to be configured once
|
|
30
|
+
ThemeMutationObserver.observer.observe(document.documentElement, {
|
|
45
31
|
attributeFilter: [THEME_DATA_ATTRIBUTE, COLOR_MODE_ATTRIBUTE]
|
|
46
32
|
});
|
|
47
33
|
}
|
|
48
34
|
}
|
|
49
35
|
disconnect() {
|
|
50
|
-
if (
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
ThemeMutationObserver.observer = null;
|
|
57
|
-
}
|
|
58
|
-
} else {
|
|
59
|
-
this.legacyObserver && this.legacyObserver.disconnect();
|
|
36
|
+
if (this.callback) {
|
|
37
|
+
ThemeMutationObserver.callbacks.delete(this.callback);
|
|
38
|
+
}
|
|
39
|
+
if (ThemeMutationObserver.callbacks.size === 0 && ThemeMutationObserver.observer) {
|
|
40
|
+
ThemeMutationObserver.observer.disconnect();
|
|
41
|
+
ThemeMutationObserver.observer = null;
|
|
60
42
|
}
|
|
61
43
|
}
|
|
62
44
|
}
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
|
|
2
2
|
import _createClass from "@babel/runtime/helpers/createClass";
|
|
3
3
|
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
4
|
-
import { getBooleanFF } from '@atlaskit/platform-feature-flags';
|
|
5
4
|
import { COLOR_MODE_ATTRIBUTE, THEME_DATA_ATTRIBUTE } from './constants';
|
|
6
5
|
import getGlobalTheme from './get-global-theme';
|
|
7
6
|
/**
|
|
@@ -22,34 +21,20 @@ var ThemeMutationObserver = /*#__PURE__*/function () {
|
|
|
22
21
|
_classCallCheck(this, ThemeMutationObserver);
|
|
23
22
|
_defineProperty(this, "legacyObserver", null);
|
|
24
23
|
this.callback = callback;
|
|
25
|
-
|
|
26
|
-
ThemeMutationObserver.callbacks.add(callback);
|
|
27
|
-
}
|
|
24
|
+
ThemeMutationObserver.callbacks.add(callback);
|
|
28
25
|
}
|
|
29
26
|
_createClass(ThemeMutationObserver, [{
|
|
30
27
|
key: "observe",
|
|
31
28
|
value: function observe() {
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
ThemeMutationObserver.
|
|
36
|
-
|
|
37
|
-
ThemeMutationObserver.callbacks.forEach(function (callback) {
|
|
38
|
-
return callback(theme);
|
|
39
|
-
});
|
|
40
|
-
});
|
|
41
|
-
// Observer only needs to be configured once
|
|
42
|
-
ThemeMutationObserver.observer.observe(document.documentElement, {
|
|
43
|
-
attributeFilter: [THEME_DATA_ATTRIBUTE, COLOR_MODE_ATTRIBUTE]
|
|
44
|
-
});
|
|
45
|
-
}
|
|
46
|
-
} else {
|
|
47
|
-
if (!this.legacyObserver) {
|
|
48
|
-
this.legacyObserver = new MutationObserver(function () {
|
|
49
|
-
_this.callback(getGlobalTheme());
|
|
29
|
+
if (!ThemeMutationObserver.observer) {
|
|
30
|
+
ThemeMutationObserver.observer = new MutationObserver(function () {
|
|
31
|
+
var theme = getGlobalTheme();
|
|
32
|
+
ThemeMutationObserver.callbacks.forEach(function (callback) {
|
|
33
|
+
return callback(theme);
|
|
50
34
|
});
|
|
51
|
-
}
|
|
52
|
-
|
|
35
|
+
});
|
|
36
|
+
// Observer only needs to be configured once
|
|
37
|
+
ThemeMutationObserver.observer.observe(document.documentElement, {
|
|
53
38
|
attributeFilter: [THEME_DATA_ATTRIBUTE, COLOR_MODE_ATTRIBUTE]
|
|
54
39
|
});
|
|
55
40
|
}
|
|
@@ -57,16 +42,12 @@ var ThemeMutationObserver = /*#__PURE__*/function () {
|
|
|
57
42
|
}, {
|
|
58
43
|
key: "disconnect",
|
|
59
44
|
value: function disconnect() {
|
|
60
|
-
if (
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
ThemeMutationObserver.observer = null;
|
|
67
|
-
}
|
|
68
|
-
} else {
|
|
69
|
-
this.legacyObserver && this.legacyObserver.disconnect();
|
|
45
|
+
if (this.callback) {
|
|
46
|
+
ThemeMutationObserver.callbacks.delete(this.callback);
|
|
47
|
+
}
|
|
48
|
+
if (ThemeMutationObserver.callbacks.size === 0 && ThemeMutationObserver.observer) {
|
|
49
|
+
ThemeMutationObserver.observer.disconnect();
|
|
50
|
+
ThemeMutationObserver.observer = null;
|
|
70
51
|
}
|
|
71
52
|
}
|
|
72
53
|
}]);
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/tokens",
|
|
3
|
-
"version": "1.53.
|
|
3
|
+
"version": "1.53.2",
|
|
4
4
|
"description": "Design tokens are the single source of truth to name and store design decisions.",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -130,9 +130,6 @@
|
|
|
130
130
|
"platform-feature-flags": {
|
|
131
131
|
"platform.design-system-team.increased-contrast-themes": {
|
|
132
132
|
"type": "boolean"
|
|
133
|
-
},
|
|
134
|
-
"platform.design-system-team.mutation-observer-performance-improvement_8usdg": {
|
|
135
|
-
"type": "boolean"
|
|
136
133
|
}
|
|
137
134
|
},
|
|
138
135
|
"homepage": "https://atlassian.design/components/tokens"
|