@atlaskit/app-provider 4.3.2 → 5.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +32 -0
- package/app-provider/package.json +1 -8
- package/dist/cjs/app-provider.js +2 -2
- package/dist/cjs/context.js +14 -10
- package/dist/cjs/router-link-provider/index.js +2 -0
- package/dist/cjs/theme-provider/context/theme.js +1 -0
- package/dist/cjs/theme-provider/index.js +13 -12
- package/dist/cjs/theme-provider/utils/load-and-mount-themes.js +22 -22
- package/dist/cjs/use-is-app-provider-theming-enabled.js +11 -0
- package/dist/cjs/use-is-inside-app-provider.js +11 -0
- package/dist/es2019/app-provider.js +1 -1
- package/dist/es2019/context.js +2 -9
- package/dist/es2019/router-link-provider/index.js +2 -0
- package/dist/es2019/theme-provider/context/theme.js +1 -0
- package/dist/es2019/theme-provider/index.js +2 -1
- package/dist/es2019/use-is-app-provider-theming-enabled.js +5 -0
- package/dist/es2019/use-is-inside-app-provider.js +5 -0
- package/dist/esm/app-provider.js +1 -1
- package/dist/esm/context.js +2 -9
- package/dist/esm/router-link-provider/index.js +2 -0
- package/dist/esm/theme-provider/context/theme.js +1 -0
- package/dist/esm/theme-provider/index.js +11 -10
- package/dist/esm/theme-provider/utils/load-and-mount-themes.js +22 -22
- package/dist/esm/use-is-app-provider-theming-enabled.js +5 -0
- package/dist/esm/use-is-inside-app-provider.js +5 -0
- package/dist/types/context.d.ts +2 -2
- package/dist/{types-ts4.5/context.d.ts → types/use-is-app-provider-theming-enabled.d.ts} +0 -1
- package/dist/types/use-is-inside-app-provider.d.ts +1 -0
- package/package.json +9 -16
- package/router-link-provider/package.json +1 -8
- package/theme/package.json +1 -8
- package/theme-provider/package.json +1 -8
- package/use-color-mode/package.json +1 -8
- package/use-color-mode-for-migration/package.json +1 -8
- package/use-is-inside-theme-provider/package.json +1 -8
- package/use-router-link/package.json +1 -8
- package/use-set-color-mode/package.json +1 -8
- package/use-set-theme/package.json +1 -8
- package/use-theme/package.json +1 -8
- package/dist/types-ts4.5/app-provider-theming-enabled-context.d.ts +0 -1
- package/dist/types-ts4.5/app-provider.d.ts +0 -40
- package/dist/types-ts4.5/entry-points/app-provider.d.ts +0 -1
- package/dist/types-ts4.5/entry-points/router-link-provider.d.ts +0 -1
- package/dist/types-ts4.5/entry-points/theme-provider.d.ts +0 -2
- package/dist/types-ts4.5/entry-points/theme.d.ts +0 -1
- package/dist/types-ts4.5/entry-points/use-color-mode-for-migration.d.ts +0 -1
- package/dist/types-ts4.5/entry-points/use-color-mode.d.ts +0 -1
- package/dist/types-ts4.5/entry-points/use-is-inside-theme-provider.d.ts +0 -1
- package/dist/types-ts4.5/entry-points/use-router-link.d.ts +0 -1
- package/dist/types-ts4.5/entry-points/use-set-color-mode.d.ts +0 -1
- package/dist/types-ts4.5/entry-points/use-set-theme.d.ts +0 -1
- package/dist/types-ts4.5/entry-points/use-theme.d.ts +0 -1
- package/dist/types-ts4.5/index.d.ts +0 -11
- package/dist/types-ts4.5/inside-app-provider-context.d.ts +0 -1
- package/dist/types-ts4.5/router-link-provider/hooks/use-router-link.d.ts +0 -18
- package/dist/types-ts4.5/router-link-provider/index.d.ts +0 -49
- package/dist/types-ts4.5/theme-provider/context/color-mode.d.ts +0 -6
- package/dist/types-ts4.5/theme-provider/context/inside-theme-provider.d.ts +0 -4
- package/dist/types-ts4.5/theme-provider/context/set-color-mode-context.d.ts +0 -2
- package/dist/types-ts4.5/theme-provider/context/theme.d.ts +0 -10
- package/dist/types-ts4.5/theme-provider/hooks/use-color-mode-for-migration.d.ts +0 -9
- package/dist/types-ts4.5/theme-provider/hooks/use-color-mode.d.ts +0 -7
- package/dist/types-ts4.5/theme-provider/hooks/use-is-inside-theme-provider.d.ts +0 -6
- package/dist/types-ts4.5/theme-provider/hooks/use-set-color-mode.d.ts +0 -7
- package/dist/types-ts4.5/theme-provider/hooks/use-set-theme.d.ts +0 -7
- package/dist/types-ts4.5/theme-provider/hooks/use-theme.d.ts +0 -7
- package/dist/types-ts4.5/theme-provider/index.d.ts +0 -19
- package/dist/types-ts4.5/theme-provider/utils/is-theme-mounted.d.ts +0 -8
- package/dist/types-ts4.5/theme-provider/utils/load-and-mount-themes.d.ts +0 -2
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,37 @@
|
|
|
1
1
|
# @atlaskit/app-provider
|
|
2
2
|
|
|
3
|
+
## 5.0.0
|
|
4
|
+
|
|
5
|
+
### Major Changes
|
|
6
|
+
|
|
7
|
+
- [`f2dc9097319f0`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/f2dc9097319f0) - ###
|
|
8
|
+
Dropped support for _legacy_ Typescript 4 types. **Typescript 5 is now the new minimum**.
|
|
9
|
+
|
|
10
|
+
Removes the `typesVersions` property and `dist/types-ts4.5` directory from the dist.
|
|
11
|
+
|
|
12
|
+
Types are now exclusively via the `"types": "dist/types/index.d.ts"` property.
|
|
13
|
+
|
|
14
|
+
```diff
|
|
15
|
+
- "typesVersions": {
|
|
16
|
+
- ">=4.5 <4.9": {
|
|
17
|
+
- "*": [
|
|
18
|
+
- "dist/types-ts4.5/*",
|
|
19
|
+
- "dist/types-ts4.5/index.d.ts"
|
|
20
|
+
- ]
|
|
21
|
+
- }
|
|
22
|
+
- },
|
|
23
|
+
```
|
|
24
|
+
|
|
25
|
+
### Patch Changes
|
|
26
|
+
|
|
27
|
+
- Updated dependencies
|
|
28
|
+
|
|
29
|
+
## 4.3.3
|
|
30
|
+
|
|
31
|
+
### Patch Changes
|
|
32
|
+
|
|
33
|
+
- Updated dependencies
|
|
34
|
+
|
|
3
35
|
## 4.3.2
|
|
4
36
|
|
|
5
37
|
### Patch Changes
|
|
@@ -6,12 +6,5 @@
|
|
|
6
6
|
"sideEffects": [
|
|
7
7
|
"**/*.compiled.css"
|
|
8
8
|
],
|
|
9
|
-
"types": "../dist/types/entry-points/app-provider.d.ts"
|
|
10
|
-
"typesVersions": {
|
|
11
|
-
">=4.5 <5.9": {
|
|
12
|
-
"*": [
|
|
13
|
-
"../dist/types-ts4.5/entry-points/app-provider.d.ts"
|
|
14
|
-
]
|
|
15
|
-
}
|
|
16
|
-
}
|
|
9
|
+
"types": "../dist/types/entry-points/app-provider.d.ts"
|
|
17
10
|
}
|
package/dist/cjs/app-provider.js
CHANGED
|
@@ -7,10 +7,10 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
7
7
|
exports.default = void 0;
|
|
8
8
|
var _react = _interopRequireDefault(require("react"));
|
|
9
9
|
var _appProviderThemingEnabledContext = require("./app-provider-theming-enabled-context");
|
|
10
|
-
var _context = require("./context");
|
|
11
10
|
var _insideAppProviderContext = require("./inside-app-provider-context");
|
|
12
11
|
var _routerLinkProvider = _interopRequireDefault(require("./router-link-provider"));
|
|
13
12
|
var _themeProvider = _interopRequireDefault(require("./theme-provider"));
|
|
13
|
+
var _useIsInsideAppProvider = require("./use-is-inside-app-provider");
|
|
14
14
|
/**
|
|
15
15
|
* __App provider__
|
|
16
16
|
*
|
|
@@ -25,7 +25,7 @@ function AppProvider(_ref) {
|
|
|
25
25
|
defaultTheme = _ref.defaultTheme,
|
|
26
26
|
routerLinkComponent = _ref.routerLinkComponent,
|
|
27
27
|
UNSAFE_isThemingDisabled = _ref.UNSAFE_isThemingDisabled;
|
|
28
|
-
var isInsideAppProvider = (0,
|
|
28
|
+
var isInsideAppProvider = (0, _useIsInsideAppProvider.useIsInsideAppProvider)();
|
|
29
29
|
if (isInsideAppProvider) {
|
|
30
30
|
throw new Error('App provider should not be nested within another app provider.');
|
|
31
31
|
}
|
package/dist/cjs/context.js
CHANGED
|
@@ -3,13 +3,17 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
6
|
+
Object.defineProperty(exports, "useIsAppProviderThemingEnabled", {
|
|
7
|
+
enumerable: true,
|
|
8
|
+
get: function get() {
|
|
9
|
+
return _useIsAppProviderThemingEnabled.useIsAppProviderThemingEnabled;
|
|
10
|
+
}
|
|
11
|
+
});
|
|
12
|
+
Object.defineProperty(exports, "useIsInsideAppProvider", {
|
|
13
|
+
enumerable: true,
|
|
14
|
+
get: function get() {
|
|
15
|
+
return _useIsInsideAppProvider.useIsInsideAppProvider;
|
|
16
|
+
}
|
|
17
|
+
});
|
|
18
|
+
var _useIsInsideAppProvider = require("./use-is-inside-app-provider");
|
|
19
|
+
var _useIsAppProviderThemingEnabled = require("./use-is-app-provider-theming-enabled");
|
|
@@ -13,4 +13,5 @@ var ThemeContext = exports.ThemeContext = /*#__PURE__*/(0, _react.createContext)
|
|
|
13
13
|
/**
|
|
14
14
|
* __Set theme context__
|
|
15
15
|
*/
|
|
16
|
+
// eslint-disable-next-line @atlaskit/volt-strict-mode/no-multiple-exports
|
|
16
17
|
var SetThemeContext = exports.SetThemeContext = /*#__PURE__*/(0, _react.createContext)(undefined);
|
|
@@ -17,7 +17,8 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/sli
|
|
|
17
17
|
var _react = _interopRequireWildcard(require("react"));
|
|
18
18
|
var _bindEventListener = require("bind-event-listener");
|
|
19
19
|
var _tokens = require("@atlaskit/tokens");
|
|
20
|
-
var
|
|
20
|
+
var _useIsAppProviderThemingEnabled = require("../use-is-app-provider-theming-enabled");
|
|
21
|
+
var _useIsInsideAppProvider = require("../use-is-inside-app-provider");
|
|
21
22
|
var _colorMode = require("./context/color-mode");
|
|
22
23
|
var _insideThemeProvider = require("./context/inside-theme-provider");
|
|
23
24
|
var _setColorModeContext = require("./context/set-color-mode-context");
|
|
@@ -81,8 +82,8 @@ function ThemeProvider(_ref) {
|
|
|
81
82
|
});
|
|
82
83
|
}, []);
|
|
83
84
|
var lastSetGlobalThemePromiseRef = (0, _react.useRef)(null);
|
|
84
|
-
var isInsideAppProvider = (0,
|
|
85
|
-
var isAppProviderThemingEnabled = (0,
|
|
85
|
+
var isInsideAppProvider = (0, _useIsInsideAppProvider.useIsInsideAppProvider)();
|
|
86
|
+
var isAppProviderThemingEnabled = (0, _useIsAppProviderThemingEnabled.useIsAppProviderThemingEnabled)();
|
|
86
87
|
var isInsideThemeProvider = (0, _useIsInsideThemeProvider.useIsInsideThemeProvider)();
|
|
87
88
|
/**
|
|
88
89
|
* A top-level ThemeProvider is detected by being the first ThemeProvider inside an AppProvider.
|
|
@@ -115,20 +116,20 @@ function ThemeProvider(_ref) {
|
|
|
115
116
|
var cleanupLastFnCall = /*#__PURE__*/function () {
|
|
116
117
|
var _ref2 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee() {
|
|
117
118
|
var unbindFn;
|
|
118
|
-
return _regenerator.default.wrap(function
|
|
119
|
+
return _regenerator.default.wrap(function (_context) {
|
|
119
120
|
while (1) switch (_context.prev = _context.next) {
|
|
120
121
|
case 0:
|
|
121
122
|
if (!lastSetGlobalThemePromiseRef.current) {
|
|
122
|
-
_context.next =
|
|
123
|
+
_context.next = 2;
|
|
123
124
|
break;
|
|
124
125
|
}
|
|
125
|
-
_context.next =
|
|
126
|
+
_context.next = 1;
|
|
126
127
|
return lastSetGlobalThemePromiseRef.current;
|
|
127
|
-
case
|
|
128
|
+
case 1:
|
|
128
129
|
unbindFn = _context.sent;
|
|
129
130
|
unbindFn();
|
|
130
131
|
lastSetGlobalThemePromiseRef.current = null;
|
|
131
|
-
case
|
|
132
|
+
case 2:
|
|
132
133
|
case "end":
|
|
133
134
|
return _context.stop();
|
|
134
135
|
}
|
|
@@ -141,17 +142,17 @@ function ThemeProvider(_ref) {
|
|
|
141
142
|
var safelySetGlobalTheme = /*#__PURE__*/function () {
|
|
142
143
|
var _ref3 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2() {
|
|
143
144
|
var promise;
|
|
144
|
-
return _regenerator.default.wrap(function
|
|
145
|
+
return _regenerator.default.wrap(function (_context2) {
|
|
145
146
|
while (1) switch (_context2.prev = _context2.next) {
|
|
146
147
|
case 0:
|
|
147
|
-
_context2.next =
|
|
148
|
+
_context2.next = 1;
|
|
148
149
|
return cleanupLastFnCall();
|
|
149
|
-
case
|
|
150
|
+
case 1:
|
|
150
151
|
promise = (0, _tokens.setGlobalTheme)(_objectSpread(_objectSpread({}, theme), {}, {
|
|
151
152
|
colorMode: reconciledColorMode
|
|
152
153
|
}));
|
|
153
154
|
lastSetGlobalThemePromiseRef.current = promise;
|
|
154
|
-
case
|
|
155
|
+
case 2:
|
|
155
156
|
case "end":
|
|
156
157
|
return _context2.stop();
|
|
157
158
|
}
|
|
@@ -13,28 +13,28 @@ var _isThemeMounted = require("./is-theme-mounted");
|
|
|
13
13
|
var loadThemeCss = /*#__PURE__*/function () {
|
|
14
14
|
var _ref = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(themeId) {
|
|
15
15
|
var _yield$themeImportMap, themeCss;
|
|
16
|
-
return _regenerator.default.wrap(function
|
|
16
|
+
return _regenerator.default.wrap(function (_context) {
|
|
17
17
|
while (1) switch (_context.prev = _context.next) {
|
|
18
18
|
case 0:
|
|
19
19
|
if (!(0, _isThemeMounted.isThemeMounted)(themeId)) {
|
|
20
|
-
_context.next =
|
|
20
|
+
_context.next = 1;
|
|
21
21
|
break;
|
|
22
22
|
}
|
|
23
23
|
return _context.abrupt("return");
|
|
24
|
-
case
|
|
24
|
+
case 1:
|
|
25
25
|
if (themeId) {
|
|
26
|
-
_context.next =
|
|
26
|
+
_context.next = 2;
|
|
27
27
|
break;
|
|
28
28
|
}
|
|
29
29
|
return _context.abrupt("return");
|
|
30
|
-
case
|
|
31
|
-
_context.next =
|
|
30
|
+
case 2:
|
|
31
|
+
_context.next = 3;
|
|
32
32
|
return _tokens.themeImportMap[themeId]();
|
|
33
|
-
case
|
|
33
|
+
case 3:
|
|
34
34
|
_yield$themeImportMap = _context.sent;
|
|
35
35
|
themeCss = _yield$themeImportMap.default;
|
|
36
36
|
return _context.abrupt("return", themeCss);
|
|
37
|
-
case
|
|
37
|
+
case 4:
|
|
38
38
|
case "end":
|
|
39
39
|
return _context.stop();
|
|
40
40
|
}
|
|
@@ -47,17 +47,17 @@ var loadThemeCss = /*#__PURE__*/function () {
|
|
|
47
47
|
var mountThemeCss = /*#__PURE__*/function () {
|
|
48
48
|
var _ref2 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2(css, themeId) {
|
|
49
49
|
var doc, style;
|
|
50
|
-
return _regenerator.default.wrap(function
|
|
50
|
+
return _regenerator.default.wrap(function (_context2) {
|
|
51
51
|
while (1) switch (_context2.prev = _context2.next) {
|
|
52
52
|
case 0:
|
|
53
53
|
// SSR-safe: Only mount on client side
|
|
54
54
|
doc = (0, _browserApis.getDocument)();
|
|
55
55
|
if (doc) {
|
|
56
|
-
_context2.next =
|
|
56
|
+
_context2.next = 1;
|
|
57
57
|
break;
|
|
58
58
|
}
|
|
59
59
|
return _context2.abrupt("return");
|
|
60
|
-
case
|
|
60
|
+
case 1:
|
|
61
61
|
style = doc.createElement('style');
|
|
62
62
|
style.textContent = css;
|
|
63
63
|
style.dataset.theme = themeId;
|
|
@@ -65,13 +65,13 @@ var mountThemeCss = /*#__PURE__*/function () {
|
|
|
65
65
|
// Prevent duplicate mounting of themes.
|
|
66
66
|
// It's possible the theme was already being loaded elsewhere.
|
|
67
67
|
if (!(0, _isThemeMounted.isThemeMounted)(themeId)) {
|
|
68
|
-
_context2.next =
|
|
68
|
+
_context2.next = 2;
|
|
69
69
|
break;
|
|
70
70
|
}
|
|
71
71
|
return _context2.abrupt("return");
|
|
72
|
-
case
|
|
72
|
+
case 2:
|
|
73
73
|
doc.head.appendChild(style);
|
|
74
|
-
case
|
|
74
|
+
case 3:
|
|
75
75
|
case "end":
|
|
76
76
|
return _context2.stop();
|
|
77
77
|
}
|
|
@@ -84,21 +84,21 @@ var mountThemeCss = /*#__PURE__*/function () {
|
|
|
84
84
|
var loadAndMountThemeCss = /*#__PURE__*/function () {
|
|
85
85
|
var _ref3 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee3(themeId) {
|
|
86
86
|
var themeCss;
|
|
87
|
-
return _regenerator.default.wrap(function
|
|
87
|
+
return _regenerator.default.wrap(function (_context3) {
|
|
88
88
|
while (1) switch (_context3.prev = _context3.next) {
|
|
89
89
|
case 0:
|
|
90
|
-
_context3.next =
|
|
90
|
+
_context3.next = 1;
|
|
91
91
|
return loadThemeCss(themeId);
|
|
92
|
-
case
|
|
92
|
+
case 1:
|
|
93
93
|
themeCss = _context3.sent;
|
|
94
94
|
if (themeCss) {
|
|
95
|
-
_context3.next =
|
|
95
|
+
_context3.next = 2;
|
|
96
96
|
break;
|
|
97
97
|
}
|
|
98
98
|
return _context3.abrupt("return");
|
|
99
|
-
case
|
|
99
|
+
case 2:
|
|
100
100
|
mountThemeCss(themeCss, themeId);
|
|
101
|
-
case
|
|
101
|
+
case 3:
|
|
102
102
|
case "end":
|
|
103
103
|
return _context3.stop();
|
|
104
104
|
}
|
|
@@ -111,14 +111,14 @@ var loadAndMountThemeCss = /*#__PURE__*/function () {
|
|
|
111
111
|
var loadAndMountThemes = exports.loadAndMountThemes = /*#__PURE__*/function () {
|
|
112
112
|
var _ref4 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee4(theme) {
|
|
113
113
|
var themesToLoad;
|
|
114
|
-
return _regenerator.default.wrap(function
|
|
114
|
+
return _regenerator.default.wrap(function (_context4) {
|
|
115
115
|
while (1) switch (_context4.prev = _context4.next) {
|
|
116
116
|
case 0:
|
|
117
117
|
themesToLoad = Object.values(theme).filter(function (themeId) {
|
|
118
118
|
return !!themeId;
|
|
119
119
|
});
|
|
120
120
|
themesToLoad.forEach(loadAndMountThemeCss);
|
|
121
|
-
case
|
|
121
|
+
case 1:
|
|
122
122
|
case "end":
|
|
123
123
|
return _context4.stop();
|
|
124
124
|
}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.useIsAppProviderThemingEnabled = void 0;
|
|
7
|
+
var _react = require("react");
|
|
8
|
+
var _appProviderThemingEnabledContext = require("./app-provider-theming-enabled-context");
|
|
9
|
+
var useIsAppProviderThemingEnabled = exports.useIsAppProviderThemingEnabled = function useIsAppProviderThemingEnabled() {
|
|
10
|
+
return (0, _react.useContext)(_appProviderThemingEnabledContext.AppProviderThemingEnabledContext);
|
|
11
|
+
};
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.useIsInsideAppProvider = void 0;
|
|
7
|
+
var _react = require("react");
|
|
8
|
+
var _insideAppProviderContext = require("./inside-app-provider-context");
|
|
9
|
+
var useIsInsideAppProvider = exports.useIsInsideAppProvider = function useIsInsideAppProvider() {
|
|
10
|
+
return (0, _react.useContext)(_insideAppProviderContext.InsideAppProviderContext);
|
|
11
|
+
};
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { AppProviderThemingEnabledContext } from './app-provider-theming-enabled-context';
|
|
3
|
-
import { useIsInsideAppProvider } from './context';
|
|
4
3
|
import { InsideAppProviderContext } from './inside-app-provider-context';
|
|
5
4
|
import RouterLinkProvider from './router-link-provider';
|
|
6
5
|
import ThemeProvider from './theme-provider';
|
|
6
|
+
import { useIsInsideAppProvider } from './use-is-inside-app-provider';
|
|
7
7
|
/**
|
|
8
8
|
* __App provider__
|
|
9
9
|
*
|
package/dist/es2019/context.js
CHANGED
|
@@ -1,9 +1,2 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
import { InsideAppProviderContext } from './inside-app-provider-context';
|
|
4
|
-
export const useIsInsideAppProvider = () => {
|
|
5
|
-
return useContext(InsideAppProviderContext);
|
|
6
|
-
};
|
|
7
|
-
export const useIsAppProviderThemingEnabled = () => {
|
|
8
|
-
return useContext(AppProviderThemingEnabledContext);
|
|
9
|
-
};
|
|
1
|
+
export { useIsInsideAppProvider } from './use-is-inside-app-provider';
|
|
2
|
+
export { useIsAppProviderThemingEnabled } from './use-is-app-provider-theming-enabled';
|
|
@@ -5,7 +5,8 @@ import { ax, ix } from "@compiled/react/runtime";
|
|
|
5
5
|
import React, { useCallback, useEffect, useRef, useState } from 'react';
|
|
6
6
|
import { bind } from 'bind-event-listener';
|
|
7
7
|
import { getThemeHtmlAttrs, setGlobalTheme, SUBTREE_THEME_ATTRIBUTE } from '@atlaskit/tokens';
|
|
8
|
-
import { useIsAppProviderThemingEnabled
|
|
8
|
+
import { useIsAppProviderThemingEnabled } from '../use-is-app-provider-theming-enabled';
|
|
9
|
+
import { useIsInsideAppProvider } from '../use-is-inside-app-provider';
|
|
9
10
|
import { ColorModeContext } from './context/color-mode';
|
|
10
11
|
import { InsideThemeProviderContext } from './context/inside-theme-provider';
|
|
11
12
|
import { SetColorModeContext } from './context/set-color-mode-context';
|
package/dist/esm/app-provider.js
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { AppProviderThemingEnabledContext } from './app-provider-theming-enabled-context';
|
|
3
|
-
import { useIsInsideAppProvider } from './context';
|
|
4
3
|
import { InsideAppProviderContext } from './inside-app-provider-context';
|
|
5
4
|
import RouterLinkProvider from './router-link-provider';
|
|
6
5
|
import ThemeProvider from './theme-provider';
|
|
6
|
+
import { useIsInsideAppProvider } from './use-is-inside-app-provider';
|
|
7
7
|
/**
|
|
8
8
|
* __App provider__
|
|
9
9
|
*
|
package/dist/esm/context.js
CHANGED
|
@@ -1,9 +1,2 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
import { InsideAppProviderContext } from './inside-app-provider-context';
|
|
4
|
-
export var useIsInsideAppProvider = function useIsInsideAppProvider() {
|
|
5
|
-
return useContext(InsideAppProviderContext);
|
|
6
|
-
};
|
|
7
|
-
export var useIsAppProviderThemingEnabled = function useIsAppProviderThemingEnabled() {
|
|
8
|
-
return useContext(AppProviderThemingEnabledContext);
|
|
9
|
-
};
|
|
1
|
+
export { useIsInsideAppProvider } from './use-is-inside-app-provider';
|
|
2
|
+
export { useIsAppProviderThemingEnabled } from './use-is-app-provider-theming-enabled';
|
|
@@ -11,7 +11,8 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
|
|
|
11
11
|
import React, { useCallback, useEffect, useRef, useState } from 'react';
|
|
12
12
|
import { bind } from 'bind-event-listener';
|
|
13
13
|
import { getThemeHtmlAttrs, setGlobalTheme, SUBTREE_THEME_ATTRIBUTE } from '@atlaskit/tokens';
|
|
14
|
-
import { useIsAppProviderThemingEnabled
|
|
14
|
+
import { useIsAppProviderThemingEnabled } from '../use-is-app-provider-theming-enabled';
|
|
15
|
+
import { useIsInsideAppProvider } from '../use-is-inside-app-provider';
|
|
15
16
|
import { ColorModeContext } from './context/color-mode';
|
|
16
17
|
import { InsideThemeProviderContext } from './context/inside-theme-provider';
|
|
17
18
|
import { SetColorModeContext } from './context/set-color-mode-context';
|
|
@@ -106,20 +107,20 @@ function ThemeProvider(_ref) {
|
|
|
106
107
|
var cleanupLastFnCall = /*#__PURE__*/function () {
|
|
107
108
|
var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
|
|
108
109
|
var unbindFn;
|
|
109
|
-
return _regeneratorRuntime.wrap(function
|
|
110
|
+
return _regeneratorRuntime.wrap(function (_context) {
|
|
110
111
|
while (1) switch (_context.prev = _context.next) {
|
|
111
112
|
case 0:
|
|
112
113
|
if (!lastSetGlobalThemePromiseRef.current) {
|
|
113
|
-
_context.next =
|
|
114
|
+
_context.next = 2;
|
|
114
115
|
break;
|
|
115
116
|
}
|
|
116
|
-
_context.next =
|
|
117
|
+
_context.next = 1;
|
|
117
118
|
return lastSetGlobalThemePromiseRef.current;
|
|
118
|
-
case
|
|
119
|
+
case 1:
|
|
119
120
|
unbindFn = _context.sent;
|
|
120
121
|
unbindFn();
|
|
121
122
|
lastSetGlobalThemePromiseRef.current = null;
|
|
122
|
-
case
|
|
123
|
+
case 2:
|
|
123
124
|
case "end":
|
|
124
125
|
return _context.stop();
|
|
125
126
|
}
|
|
@@ -132,17 +133,17 @@ function ThemeProvider(_ref) {
|
|
|
132
133
|
var safelySetGlobalTheme = /*#__PURE__*/function () {
|
|
133
134
|
var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
|
|
134
135
|
var promise;
|
|
135
|
-
return _regeneratorRuntime.wrap(function
|
|
136
|
+
return _regeneratorRuntime.wrap(function (_context2) {
|
|
136
137
|
while (1) switch (_context2.prev = _context2.next) {
|
|
137
138
|
case 0:
|
|
138
|
-
_context2.next =
|
|
139
|
+
_context2.next = 1;
|
|
139
140
|
return cleanupLastFnCall();
|
|
140
|
-
case
|
|
141
|
+
case 1:
|
|
141
142
|
promise = setGlobalTheme(_objectSpread(_objectSpread({}, theme), {}, {
|
|
142
143
|
colorMode: reconciledColorMode
|
|
143
144
|
}));
|
|
144
145
|
lastSetGlobalThemePromiseRef.current = promise;
|
|
145
|
-
case
|
|
146
|
+
case 2:
|
|
146
147
|
case "end":
|
|
147
148
|
return _context2.stop();
|
|
148
149
|
}
|
|
@@ -6,28 +6,28 @@ import { isThemeMounted } from './is-theme-mounted';
|
|
|
6
6
|
var loadThemeCss = /*#__PURE__*/function () {
|
|
7
7
|
var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(themeId) {
|
|
8
8
|
var _yield$themeImportMap, themeCss;
|
|
9
|
-
return _regeneratorRuntime.wrap(function
|
|
9
|
+
return _regeneratorRuntime.wrap(function (_context) {
|
|
10
10
|
while (1) switch (_context.prev = _context.next) {
|
|
11
11
|
case 0:
|
|
12
12
|
if (!isThemeMounted(themeId)) {
|
|
13
|
-
_context.next =
|
|
13
|
+
_context.next = 1;
|
|
14
14
|
break;
|
|
15
15
|
}
|
|
16
16
|
return _context.abrupt("return");
|
|
17
|
-
case
|
|
17
|
+
case 1:
|
|
18
18
|
if (themeId) {
|
|
19
|
-
_context.next =
|
|
19
|
+
_context.next = 2;
|
|
20
20
|
break;
|
|
21
21
|
}
|
|
22
22
|
return _context.abrupt("return");
|
|
23
|
-
case
|
|
24
|
-
_context.next =
|
|
23
|
+
case 2:
|
|
24
|
+
_context.next = 3;
|
|
25
25
|
return themeImportMap[themeId]();
|
|
26
|
-
case
|
|
26
|
+
case 3:
|
|
27
27
|
_yield$themeImportMap = _context.sent;
|
|
28
28
|
themeCss = _yield$themeImportMap.default;
|
|
29
29
|
return _context.abrupt("return", themeCss);
|
|
30
|
-
case
|
|
30
|
+
case 4:
|
|
31
31
|
case "end":
|
|
32
32
|
return _context.stop();
|
|
33
33
|
}
|
|
@@ -40,17 +40,17 @@ var loadThemeCss = /*#__PURE__*/function () {
|
|
|
40
40
|
var mountThemeCss = /*#__PURE__*/function () {
|
|
41
41
|
var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2(css, themeId) {
|
|
42
42
|
var doc, style;
|
|
43
|
-
return _regeneratorRuntime.wrap(function
|
|
43
|
+
return _regeneratorRuntime.wrap(function (_context2) {
|
|
44
44
|
while (1) switch (_context2.prev = _context2.next) {
|
|
45
45
|
case 0:
|
|
46
46
|
// SSR-safe: Only mount on client side
|
|
47
47
|
doc = getDocument();
|
|
48
48
|
if (doc) {
|
|
49
|
-
_context2.next =
|
|
49
|
+
_context2.next = 1;
|
|
50
50
|
break;
|
|
51
51
|
}
|
|
52
52
|
return _context2.abrupt("return");
|
|
53
|
-
case
|
|
53
|
+
case 1:
|
|
54
54
|
style = doc.createElement('style');
|
|
55
55
|
style.textContent = css;
|
|
56
56
|
style.dataset.theme = themeId;
|
|
@@ -58,13 +58,13 @@ var mountThemeCss = /*#__PURE__*/function () {
|
|
|
58
58
|
// Prevent duplicate mounting of themes.
|
|
59
59
|
// It's possible the theme was already being loaded elsewhere.
|
|
60
60
|
if (!isThemeMounted(themeId)) {
|
|
61
|
-
_context2.next =
|
|
61
|
+
_context2.next = 2;
|
|
62
62
|
break;
|
|
63
63
|
}
|
|
64
64
|
return _context2.abrupt("return");
|
|
65
|
-
case
|
|
65
|
+
case 2:
|
|
66
66
|
doc.head.appendChild(style);
|
|
67
|
-
case
|
|
67
|
+
case 3:
|
|
68
68
|
case "end":
|
|
69
69
|
return _context2.stop();
|
|
70
70
|
}
|
|
@@ -77,21 +77,21 @@ var mountThemeCss = /*#__PURE__*/function () {
|
|
|
77
77
|
var loadAndMountThemeCss = /*#__PURE__*/function () {
|
|
78
78
|
var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee3(themeId) {
|
|
79
79
|
var themeCss;
|
|
80
|
-
return _regeneratorRuntime.wrap(function
|
|
80
|
+
return _regeneratorRuntime.wrap(function (_context3) {
|
|
81
81
|
while (1) switch (_context3.prev = _context3.next) {
|
|
82
82
|
case 0:
|
|
83
|
-
_context3.next =
|
|
83
|
+
_context3.next = 1;
|
|
84
84
|
return loadThemeCss(themeId);
|
|
85
|
-
case
|
|
85
|
+
case 1:
|
|
86
86
|
themeCss = _context3.sent;
|
|
87
87
|
if (themeCss) {
|
|
88
|
-
_context3.next =
|
|
88
|
+
_context3.next = 2;
|
|
89
89
|
break;
|
|
90
90
|
}
|
|
91
91
|
return _context3.abrupt("return");
|
|
92
|
-
case
|
|
92
|
+
case 2:
|
|
93
93
|
mountThemeCss(themeCss, themeId);
|
|
94
|
-
case
|
|
94
|
+
case 3:
|
|
95
95
|
case "end":
|
|
96
96
|
return _context3.stop();
|
|
97
97
|
}
|
|
@@ -104,14 +104,14 @@ var loadAndMountThemeCss = /*#__PURE__*/function () {
|
|
|
104
104
|
export var loadAndMountThemes = /*#__PURE__*/function () {
|
|
105
105
|
var _ref4 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee4(theme) {
|
|
106
106
|
var themesToLoad;
|
|
107
|
-
return _regeneratorRuntime.wrap(function
|
|
107
|
+
return _regeneratorRuntime.wrap(function (_context4) {
|
|
108
108
|
while (1) switch (_context4.prev = _context4.next) {
|
|
109
109
|
case 0:
|
|
110
110
|
themesToLoad = Object.values(theme).filter(function (themeId) {
|
|
111
111
|
return !!themeId;
|
|
112
112
|
});
|
|
113
113
|
themesToLoad.forEach(loadAndMountThemeCss);
|
|
114
|
-
case
|
|
114
|
+
case 1:
|
|
115
115
|
case "end":
|
|
116
116
|
return _context4.stop();
|
|
117
117
|
}
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import { useContext } from 'react';
|
|
2
|
+
import { AppProviderThemingEnabledContext } from './app-provider-theming-enabled-context';
|
|
3
|
+
export var useIsAppProviderThemingEnabled = function useIsAppProviderThemingEnabled() {
|
|
4
|
+
return useContext(AppProviderThemingEnabledContext);
|
|
5
|
+
};
|
package/dist/types/context.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export
|
|
2
|
-
export
|
|
1
|
+
export { useIsInsideAppProvider } from './use-is-inside-app-provider';
|
|
2
|
+
export { useIsAppProviderThemingEnabled } from './use-is-app-provider-theming-enabled';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const useIsInsideAppProvider: () => boolean;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/app-provider",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "5.0.0",
|
|
4
4
|
"description": "A top level provider for the Design System.",
|
|
5
5
|
"author": "Atlassian Pty Ltd",
|
|
6
6
|
"license": "Apache-2.0",
|
|
@@ -29,23 +29,15 @@
|
|
|
29
29
|
"module": "dist/esm/index.js",
|
|
30
30
|
"module:es2019": "dist/es2019/index.js",
|
|
31
31
|
"types": "dist/types/index.d.ts",
|
|
32
|
-
"typesVersions": {
|
|
33
|
-
">=4.5 <4.9": {
|
|
34
|
-
"*": [
|
|
35
|
-
"dist/types-ts4.5/*",
|
|
36
|
-
"dist/types-ts4.5/index.d.ts"
|
|
37
|
-
]
|
|
38
|
-
}
|
|
39
|
-
},
|
|
40
32
|
"sideEffects": [
|
|
41
33
|
"**/*.compiled.css"
|
|
42
34
|
],
|
|
43
35
|
"atlaskit:src": "src/index.tsx",
|
|
44
36
|
"dependencies": {
|
|
45
|
-
"@atlaskit/browser-apis": "^0.0
|
|
46
|
-
"@atlaskit/css": "^0.
|
|
47
|
-
"@atlaskit/platform-feature-flags": "^
|
|
48
|
-
"@atlaskit/tokens": "^
|
|
37
|
+
"@atlaskit/browser-apis": "^1.0.0",
|
|
38
|
+
"@atlaskit/css": "^1.0.0",
|
|
39
|
+
"@atlaskit/platform-feature-flags": "^2.0.0",
|
|
40
|
+
"@atlaskit/tokens": "^14.0.0",
|
|
49
41
|
"@babel/runtime": "^7.0.0",
|
|
50
42
|
"bind-event-listener": "^3.0.0"
|
|
51
43
|
},
|
|
@@ -54,12 +46,13 @@
|
|
|
54
46
|
},
|
|
55
47
|
"devDependencies": {
|
|
56
48
|
"@af/visual-regression": "workspace:^",
|
|
57
|
-
"@atlaskit/dropdown-menu": "^
|
|
58
|
-
"@atlaskit/primitives": "^
|
|
49
|
+
"@atlaskit/dropdown-menu": "^17.0.0",
|
|
50
|
+
"@atlaskit/primitives": "^20.0.0",
|
|
59
51
|
"@atlassian/feature-flags-test-utils": "^1.1.0",
|
|
60
52
|
"@atlassian/react-compiler-gating": "workspace:^",
|
|
61
53
|
"@atlassian/ssr-tests": "workspace:^",
|
|
62
|
-
"@atlassian/testing-library": "^0.
|
|
54
|
+
"@atlassian/testing-library": "^0.6.0",
|
|
55
|
+
"react": "^18.2.0",
|
|
63
56
|
"react-dom": "^18.2.0",
|
|
64
57
|
"react-resource-router": "^0.20.0"
|
|
65
58
|
},
|
|
@@ -6,12 +6,5 @@
|
|
|
6
6
|
"sideEffects": [
|
|
7
7
|
"**/*.compiled.css"
|
|
8
8
|
],
|
|
9
|
-
"types": "../dist/types/entry-points/router-link-provider.d.ts"
|
|
10
|
-
"typesVersions": {
|
|
11
|
-
">=4.5 <5.9": {
|
|
12
|
-
"*": [
|
|
13
|
-
"../dist/types-ts4.5/entry-points/router-link-provider.d.ts"
|
|
14
|
-
]
|
|
15
|
-
}
|
|
16
|
-
}
|
|
9
|
+
"types": "../dist/types/entry-points/router-link-provider.d.ts"
|
|
17
10
|
}
|
package/theme/package.json
CHANGED
|
@@ -6,12 +6,5 @@
|
|
|
6
6
|
"sideEffects": [
|
|
7
7
|
"**/*.compiled.css"
|
|
8
8
|
],
|
|
9
|
-
"types": "../dist/types/entry-points/theme.d.ts"
|
|
10
|
-
"typesVersions": {
|
|
11
|
-
">=4.5 <5.9": {
|
|
12
|
-
"*": [
|
|
13
|
-
"../dist/types-ts4.5/entry-points/theme.d.ts"
|
|
14
|
-
]
|
|
15
|
-
}
|
|
16
|
-
}
|
|
9
|
+
"types": "../dist/types/entry-points/theme.d.ts"
|
|
17
10
|
}
|
|
@@ -6,12 +6,5 @@
|
|
|
6
6
|
"sideEffects": [
|
|
7
7
|
"**/*.compiled.css"
|
|
8
8
|
],
|
|
9
|
-
"types": "../dist/types/entry-points/theme-provider.d.ts"
|
|
10
|
-
"typesVersions": {
|
|
11
|
-
">=4.5 <5.9": {
|
|
12
|
-
"*": [
|
|
13
|
-
"../dist/types-ts4.5/entry-points/theme-provider.d.ts"
|
|
14
|
-
]
|
|
15
|
-
}
|
|
16
|
-
}
|
|
9
|
+
"types": "../dist/types/entry-points/theme-provider.d.ts"
|
|
17
10
|
}
|
|
@@ -6,12 +6,5 @@
|
|
|
6
6
|
"sideEffects": [
|
|
7
7
|
"**/*.compiled.css"
|
|
8
8
|
],
|
|
9
|
-
"types": "../dist/types/entry-points/use-color-mode.d.ts"
|
|
10
|
-
"typesVersions": {
|
|
11
|
-
">=4.5 <5.9": {
|
|
12
|
-
"*": [
|
|
13
|
-
"../dist/types-ts4.5/entry-points/use-color-mode.d.ts"
|
|
14
|
-
]
|
|
15
|
-
}
|
|
16
|
-
}
|
|
9
|
+
"types": "../dist/types/entry-points/use-color-mode.d.ts"
|
|
17
10
|
}
|
|
@@ -6,12 +6,5 @@
|
|
|
6
6
|
"sideEffects": [
|
|
7
7
|
"**/*.compiled.css"
|
|
8
8
|
],
|
|
9
|
-
"types": "../dist/types/entry-points/use-color-mode-for-migration.d.ts"
|
|
10
|
-
"typesVersions": {
|
|
11
|
-
">=4.5 <5.9": {
|
|
12
|
-
"*": [
|
|
13
|
-
"../dist/types-ts4.5/entry-points/use-color-mode-for-migration.d.ts"
|
|
14
|
-
]
|
|
15
|
-
}
|
|
16
|
-
}
|
|
9
|
+
"types": "../dist/types/entry-points/use-color-mode-for-migration.d.ts"
|
|
17
10
|
}
|
|
@@ -6,12 +6,5 @@
|
|
|
6
6
|
"sideEffects": [
|
|
7
7
|
"**/*.compiled.css"
|
|
8
8
|
],
|
|
9
|
-
"types": "../dist/types/entry-points/use-is-inside-theme-provider.d.ts"
|
|
10
|
-
"typesVersions": {
|
|
11
|
-
">=4.5 <5.9": {
|
|
12
|
-
"*": [
|
|
13
|
-
"../dist/types-ts4.5/entry-points/use-is-inside-theme-provider.d.ts"
|
|
14
|
-
]
|
|
15
|
-
}
|
|
16
|
-
}
|
|
9
|
+
"types": "../dist/types/entry-points/use-is-inside-theme-provider.d.ts"
|
|
17
10
|
}
|
|
@@ -6,12 +6,5 @@
|
|
|
6
6
|
"sideEffects": [
|
|
7
7
|
"**/*.compiled.css"
|
|
8
8
|
],
|
|
9
|
-
"types": "../dist/types/entry-points/use-router-link.d.ts"
|
|
10
|
-
"typesVersions": {
|
|
11
|
-
">=4.5 <5.9": {
|
|
12
|
-
"*": [
|
|
13
|
-
"../dist/types-ts4.5/entry-points/use-router-link.d.ts"
|
|
14
|
-
]
|
|
15
|
-
}
|
|
16
|
-
}
|
|
9
|
+
"types": "../dist/types/entry-points/use-router-link.d.ts"
|
|
17
10
|
}
|
|
@@ -6,12 +6,5 @@
|
|
|
6
6
|
"sideEffects": [
|
|
7
7
|
"**/*.compiled.css"
|
|
8
8
|
],
|
|
9
|
-
"types": "../dist/types/entry-points/use-set-color-mode.d.ts"
|
|
10
|
-
"typesVersions": {
|
|
11
|
-
">=4.5 <5.9": {
|
|
12
|
-
"*": [
|
|
13
|
-
"../dist/types-ts4.5/entry-points/use-set-color-mode.d.ts"
|
|
14
|
-
]
|
|
15
|
-
}
|
|
16
|
-
}
|
|
9
|
+
"types": "../dist/types/entry-points/use-set-color-mode.d.ts"
|
|
17
10
|
}
|
|
@@ -6,12 +6,5 @@
|
|
|
6
6
|
"sideEffects": [
|
|
7
7
|
"**/*.compiled.css"
|
|
8
8
|
],
|
|
9
|
-
"types": "../dist/types/entry-points/use-set-theme.d.ts"
|
|
10
|
-
"typesVersions": {
|
|
11
|
-
">=4.5 <5.9": {
|
|
12
|
-
"*": [
|
|
13
|
-
"../dist/types-ts4.5/entry-points/use-set-theme.d.ts"
|
|
14
|
-
]
|
|
15
|
-
}
|
|
16
|
-
}
|
|
9
|
+
"types": "../dist/types/entry-points/use-set-theme.d.ts"
|
|
17
10
|
}
|
package/use-theme/package.json
CHANGED
|
@@ -6,12 +6,5 @@
|
|
|
6
6
|
"sideEffects": [
|
|
7
7
|
"**/*.compiled.css"
|
|
8
8
|
],
|
|
9
|
-
"types": "../dist/types/entry-points/use-theme.d.ts"
|
|
10
|
-
"typesVersions": {
|
|
11
|
-
">=4.5 <5.9": {
|
|
12
|
-
"*": [
|
|
13
|
-
"../dist/types-ts4.5/entry-points/use-theme.d.ts"
|
|
14
|
-
]
|
|
15
|
-
}
|
|
16
|
-
}
|
|
9
|
+
"types": "../dist/types/entry-points/use-theme.d.ts"
|
|
17
10
|
}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export declare const AppProviderThemingEnabledContext: import('react').Context<boolean>;
|
|
@@ -1,40 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import type { ThemeColorModes } from '@atlaskit/tokens';
|
|
3
|
-
import { type RouterLinkComponent } from './router-link-provider';
|
|
4
|
-
import { type Theme } from './theme-provider/context/theme';
|
|
5
|
-
interface AppProviderProps {
|
|
6
|
-
/**
|
|
7
|
-
* Initial color mode.
|
|
8
|
-
*/
|
|
9
|
-
defaultColorMode?: ThemeColorModes;
|
|
10
|
-
/**
|
|
11
|
-
* Theme settings.
|
|
12
|
-
*/
|
|
13
|
-
defaultTheme?: Partial<Theme>;
|
|
14
|
-
/**
|
|
15
|
-
* A configured router link component.
|
|
16
|
-
*/
|
|
17
|
-
routerLinkComponent?: RouterLinkComponent<any>;
|
|
18
|
-
/**
|
|
19
|
-
* Disables theming functionality.
|
|
20
|
-
* This is intended for use in apps with existing
|
|
21
|
-
* theming configuration that want to incrementally
|
|
22
|
-
* adopt AppProvider.
|
|
23
|
-
*
|
|
24
|
-
* @warning Use with caution. This prop will be removed in a future release.
|
|
25
|
-
*/
|
|
26
|
-
UNSAFE_isThemingDisabled?: boolean;
|
|
27
|
-
/**
|
|
28
|
-
* App content.
|
|
29
|
-
*/
|
|
30
|
-
children: React.ReactNode;
|
|
31
|
-
}
|
|
32
|
-
/**
|
|
33
|
-
* __App provider__
|
|
34
|
-
*
|
|
35
|
-
* An app provider provides app level configuration such as global theming.
|
|
36
|
-
*
|
|
37
|
-
* Place it at the root of your application.
|
|
38
|
-
*/
|
|
39
|
-
declare function AppProvider({ children, defaultColorMode, defaultTheme, routerLinkComponent, UNSAFE_isThemingDisabled, }: AppProviderProps): React.JSX.Element;
|
|
40
|
-
export default AppProvider;
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export { default } from '../app-provider';
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export type { RouterLinkComponent, RouterLinkComponentProps } from '../router-link-provider/index';
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export type { Theme } from '../theme-provider/context/theme';
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export { UNSAFE_useColorModeForMigration } from '../theme-provider/hooks/use-color-mode-for-migration';
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export { useColorMode } from '../theme-provider/hooks/use-color-mode';
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export { useIsInsideThemeProvider } from '../theme-provider/hooks/use-is-inside-theme-provider';
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export { default as useRouterLink } from '../router-link-provider/hooks/use-router-link';
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export { useSetColorMode } from '../theme-provider/hooks/use-set-color-mode';
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export { useSetTheme } from '../theme-provider/hooks/use-set-theme';
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export { useTheme } from '../theme-provider/hooks/use-theme';
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
export { default } from './app-provider';
|
|
2
|
-
export { UNSAFE_useColorModeForMigration } from './theme-provider/hooks/use-color-mode-for-migration';
|
|
3
|
-
export { useColorMode } from './theme-provider/hooks/use-color-mode';
|
|
4
|
-
export { useSetColorMode } from './theme-provider/hooks/use-set-color-mode';
|
|
5
|
-
export { useSetTheme } from './theme-provider/hooks/use-set-theme';
|
|
6
|
-
export { useTheme } from './theme-provider/hooks/use-theme';
|
|
7
|
-
export type { Theme } from './theme-provider/context/theme';
|
|
8
|
-
export { default as ThemeProvider, type ThemeProviderProps } from './theme-provider';
|
|
9
|
-
export { type RouterLinkComponent, type RouterLinkComponentProps } from './router-link-provider';
|
|
10
|
-
import useRouterLink from './router-link-provider/hooks/use-router-link';
|
|
11
|
-
export { useRouterLink };
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export declare const InsideAppProviderContext: import('react').Context<boolean>;
|
|
@@ -1,18 +0,0 @@
|
|
|
1
|
-
import { type RouterLinkComponent } from '../index';
|
|
2
|
-
/**
|
|
3
|
-
* __useRouterLink()__
|
|
4
|
-
*
|
|
5
|
-
* Hook: Returns app-configured router link component.
|
|
6
|
-
*
|
|
7
|
-
* A generic can be passed to define advanced link configuration:
|
|
8
|
-
* ```
|
|
9
|
-
* type MyRouterLinkConfig = {
|
|
10
|
-
* to: string;
|
|
11
|
-
* replace?: boolean;
|
|
12
|
-
* }
|
|
13
|
-
*
|
|
14
|
-
* const RouterLink = useRouterLink<MyRouterLinkConfig>();
|
|
15
|
-
* ```
|
|
16
|
-
*/
|
|
17
|
-
declare const useRouterLink: <RouterLinkConfig extends Record<string, any> = never>() => RouterLinkComponent<RouterLinkConfig> | undefined;
|
|
18
|
-
export default useRouterLink;
|
|
@@ -1,49 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
export type RouterLinkComponent<RouterLinkConfig extends Record<string, any> = never> = React.ForwardRefExoticComponent<RouterLinkComponentProps<RouterLinkConfig> & React.RefAttributes<HTMLAnchorElement>>;
|
|
3
|
-
export type RouterLinkComponentProps<RouterLinkConfig extends Record<string, any> = never> = {
|
|
4
|
-
/**
|
|
5
|
-
* Standard links can be provided as a string, which should be mapped to the
|
|
6
|
-
* underlying router link component.
|
|
7
|
-
*
|
|
8
|
-
* Alternatively, you can provide an object for advanced link configurations
|
|
9
|
-
* by supplying the expected object type to the generic.
|
|
10
|
-
*
|
|
11
|
-
* @example
|
|
12
|
-
* ```
|
|
13
|
-
* const MyRouterLink = forwardRef(
|
|
14
|
-
* (
|
|
15
|
-
* {
|
|
16
|
-
* href,
|
|
17
|
-
* children,
|
|
18
|
-
* ...rest
|
|
19
|
-
* }: RouterLinkComponentProps<{
|
|
20
|
-
* href: string;
|
|
21
|
-
* replace: boolean;
|
|
22
|
-
* }>,
|
|
23
|
-
* ref: Ref<HTMLAnchorElement>,
|
|
24
|
-
* ) => { ...
|
|
25
|
-
* ```
|
|
26
|
-
*/
|
|
27
|
-
href: string | RouterLinkConfig;
|
|
28
|
-
children?: React.ReactNode;
|
|
29
|
-
};
|
|
30
|
-
export type RouterLinkProviderContextProps<RouterLinkConfig extends Record<string, any> = never> = {
|
|
31
|
-
routerLinkComponent?: RouterLinkComponent<RouterLinkConfig>;
|
|
32
|
-
};
|
|
33
|
-
export declare const RouterLinkProviderContext: React.Context<RouterLinkProviderContextProps<never>>;
|
|
34
|
-
type RouterLinkProviderProps = {
|
|
35
|
-
/**
|
|
36
|
-
* The rendering mechanism of router links within Design System components.
|
|
37
|
-
*/
|
|
38
|
-
routerLinkComponent?: RouterLinkComponent<any>;
|
|
39
|
-
};
|
|
40
|
-
/**
|
|
41
|
-
* __RouterLinkProvider__
|
|
42
|
-
*
|
|
43
|
-
* Provides a configured router link component for use
|
|
44
|
-
* within Design System components.
|
|
45
|
-
*/
|
|
46
|
-
declare const RouterLinkProvider: ({ routerLinkComponent, children, }: RouterLinkProviderProps & {
|
|
47
|
-
children: React.ReactNode;
|
|
48
|
-
}) => React.JSX.Element;
|
|
49
|
-
export default RouterLinkProvider;
|
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
import type { ThemeState } from '@atlaskit/tokens';
|
|
2
|
-
export type Theme = Omit<ThemeState, 'colorMode' | 'contrastMode'>;
|
|
3
|
-
/**
|
|
4
|
-
* __Theme context__
|
|
5
|
-
*/
|
|
6
|
-
export declare const ThemeContext: import('react').Context<Theme | undefined>;
|
|
7
|
-
/**
|
|
8
|
-
* __Set theme context__
|
|
9
|
-
*/
|
|
10
|
-
export declare const SetThemeContext: import('react').Context<((value: Partial<Theme>) => void) | undefined>;
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
import { type ReconciledColorMode } from '../context/color-mode';
|
|
2
|
-
/**
|
|
3
|
-
* __UNSAFE_useColorModeForMigration()__
|
|
4
|
-
*
|
|
5
|
-
* Returns the current color mode when inside the app provider.
|
|
6
|
-
* Unlike useColorMode, this utility returns undefined, instead of throwing an error, when the app provider is missing.
|
|
7
|
-
* This allows it to be used by components that need to operate with and without an app provider.
|
|
8
|
-
*/
|
|
9
|
-
export declare function UNSAFE_useColorModeForMigration(): ReconciledColorMode | undefined;
|
|
@@ -1,19 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* @jsxRuntime classic
|
|
3
|
-
* @jsx jsx
|
|
4
|
-
*/
|
|
5
|
-
import React from 'react';
|
|
6
|
-
import { type ThemeColorModes } from '@atlaskit/tokens';
|
|
7
|
-
import { type Theme } from './context/theme';
|
|
8
|
-
export interface ThemeProviderProps {
|
|
9
|
-
defaultColorMode?: ThemeColorModes;
|
|
10
|
-
defaultTheme?: Partial<Theme>;
|
|
11
|
-
children: React.ReactNode;
|
|
12
|
-
}
|
|
13
|
-
/**
|
|
14
|
-
* __Theme provider__
|
|
15
|
-
*
|
|
16
|
-
* Provides global theming configuration.
|
|
17
|
-
*/
|
|
18
|
-
declare function ThemeProvider({ children, defaultColorMode, defaultTheme, }: ThemeProviderProps): JSX.Element;
|
|
19
|
-
export default ThemeProvider;
|
|
@@ -1,8 +0,0 @@
|
|
|
1
|
-
import { type ThemeIds } from '@atlaskit/tokens';
|
|
2
|
-
/**
|
|
3
|
-
* Checks if a theme is mounted in the document head.
|
|
4
|
-
*
|
|
5
|
-
* Eventually this won't be necessary as we'll utilise AppProvider context
|
|
6
|
-
* to track theme loading.
|
|
7
|
-
*/
|
|
8
|
-
export declare function isThemeMounted(themeId: ThemeIds): false | Element | null;
|