@atlaskit/tokens 1.2.10 → 1.2.11
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +6 -0
- package/dist/cjs/get-token-value.js +1 -1
- package/dist/cjs/get-token.js +1 -1
- package/dist/cjs/set-global-theme.js +12 -9
- package/dist/cjs/theme-config.js +17 -0
- package/dist/cjs/utils/theme-loading.js +6 -5
- package/dist/cjs/version.json +1 -1
- package/dist/es2019/get-token-value.js +1 -1
- package/dist/es2019/get-token.js +1 -1
- package/dist/es2019/set-global-theme.js +3 -0
- package/dist/es2019/theme-config.js +18 -0
- package/dist/es2019/version.json +1 -1
- package/dist/esm/get-token-value.js +1 -1
- package/dist/esm/get-token.js +1 -1
- package/dist/esm/set-global-theme.js +13 -9
- package/dist/esm/theme-config.js +18 -0
- package/dist/esm/utils/theme-loading.js +6 -5
- package/dist/esm/version.json +1 -1
- package/dist/types/get-global-theme.d.ts +2 -2
- package/dist/types/set-global-theme.d.ts +3 -0
- package/dist/types/theme-config.d.ts +1 -1
- package/dist/types/theme-mutation-observer.d.ts +2 -2
- package/dist/types/use-theme-observer.d.ts +2 -2
- package/package.json +1 -1
- package/report.api.md +9 -3
- package/tmp/api-report-tmp.d.ts +9 -3
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,11 @@
|
|
|
1
1
|
# @atlaskit/tokens
|
|
2
2
|
|
|
3
|
+
## 1.2.11
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [`8ec4434b4c2`](https://bitbucket.org/atlassian/atlassian-frontend/commits/8ec4434b4c2) - The return type for `useThemeObserver` now omits `auto` as a possible option for `colorMode`. From the perspective of observers `auto` does not exist because `colorMode` is precalculated at runtime.
|
|
8
|
+
|
|
3
9
|
## 1.2.10
|
|
4
10
|
|
|
5
11
|
### Patch Changes
|
|
@@ -8,7 +8,7 @@ exports.default = void 0;
|
|
|
8
8
|
var _warnOnce = _interopRequireDefault(require("@atlaskit/ds-lib/warn-once"));
|
|
9
9
|
var _tokenNames = _interopRequireDefault(require("./artifacts/token-names"));
|
|
10
10
|
var name = "@atlaskit/tokens";
|
|
11
|
-
var version = "1.2.
|
|
11
|
+
var version = "1.2.11";
|
|
12
12
|
/**
|
|
13
13
|
* Takes a dot-separated token name and and an optional fallback, and returns the current computed CSS value for the
|
|
14
14
|
* resulting CSS Custom Property.
|
package/dist/cjs/get-token.js
CHANGED
|
@@ -9,7 +9,7 @@ var _warnOnce = _interopRequireDefault(require("@atlaskit/ds-lib/warn-once"));
|
|
|
9
9
|
var _tokenNames = _interopRequireDefault(require("./artifacts/token-names"));
|
|
10
10
|
var _constants = require("./constants");
|
|
11
11
|
var name = "@atlaskit/tokens";
|
|
12
|
-
var version = "1.2.
|
|
12
|
+
var version = "1.2.11";
|
|
13
13
|
/**
|
|
14
14
|
* Takes a dot-separated token name and an optional fallback, and returns the CSS custom property for the corresponding token.
|
|
15
15
|
* This should be used to implement design decisions throughout your application.
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
4
5
|
Object.defineProperty(exports, "__esModule", {
|
|
5
6
|
value: true
|
|
6
7
|
});
|
|
7
8
|
exports.getThemeStyles = exports.getThemeHtmlAttrs = exports.getSSRAutoScript = exports.default = void 0;
|
|
8
|
-
var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
|
|
9
9
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
10
10
|
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
11
11
|
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
|
|
@@ -16,6 +16,9 @@ var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
|
16
16
|
var _constants = require("./constants");
|
|
17
17
|
var _themeLoading = require("./utils/theme-loading");
|
|
18
18
|
var _themeStateTransformer = require("./utils/theme-state-transformer");
|
|
19
|
+
function _regeneratorRuntime() { "use strict"; /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */ _regeneratorRuntime = function _regeneratorRuntime() { return exports; }; var exports = {}, Op = Object.prototype, hasOwn = Op.hasOwnProperty, defineProperty = Object.defineProperty || function (obj, key, desc) { obj[key] = desc.value; }, $Symbol = "function" == typeof Symbol ? Symbol : {}, iteratorSymbol = $Symbol.iterator || "@@iterator", asyncIteratorSymbol = $Symbol.asyncIterator || "@@asyncIterator", toStringTagSymbol = $Symbol.toStringTag || "@@toStringTag"; function define(obj, key, value) { return Object.defineProperty(obj, key, { value: value, enumerable: !0, configurable: !0, writable: !0 }), obj[key]; } try { define({}, ""); } catch (err) { define = function define(obj, key, value) { return obj[key] = value; }; } function wrap(innerFn, outerFn, self, tryLocsList) { var protoGenerator = outerFn && outerFn.prototype instanceof Generator ? outerFn : Generator, generator = Object.create(protoGenerator.prototype), context = new Context(tryLocsList || []); return defineProperty(generator, "_invoke", { value: makeInvokeMethod(innerFn, self, context) }), generator; } function tryCatch(fn, obj, arg) { try { return { type: "normal", arg: fn.call(obj, arg) }; } catch (err) { return { type: "throw", arg: err }; } } exports.wrap = wrap; var ContinueSentinel = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} var IteratorPrototype = {}; define(IteratorPrototype, iteratorSymbol, function () { return this; }); var getProto = Object.getPrototypeOf, NativeIteratorPrototype = getProto && getProto(getProto(values([]))); NativeIteratorPrototype && NativeIteratorPrototype !== Op && hasOwn.call(NativeIteratorPrototype, iteratorSymbol) && (IteratorPrototype = NativeIteratorPrototype); var Gp = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(IteratorPrototype); function defineIteratorMethods(prototype) { ["next", "throw", "return"].forEach(function (method) { define(prototype, method, function (arg) { return this._invoke(method, arg); }); }); } function AsyncIterator(generator, PromiseImpl) { function invoke(method, arg, resolve, reject) { var record = tryCatch(generator[method], generator, arg); if ("throw" !== record.type) { var result = record.arg, value = result.value; return value && "object" == _typeof(value) && hasOwn.call(value, "__await") ? PromiseImpl.resolve(value.__await).then(function (value) { invoke("next", value, resolve, reject); }, function (err) { invoke("throw", err, resolve, reject); }) : PromiseImpl.resolve(value).then(function (unwrapped) { result.value = unwrapped, resolve(result); }, function (error) { return invoke("throw", error, resolve, reject); }); } reject(record.arg); } var previousPromise; defineProperty(this, "_invoke", { value: function value(method, arg) { function callInvokeWithMethodAndArg() { return new PromiseImpl(function (resolve, reject) { invoke(method, arg, resolve, reject); }); } return previousPromise = previousPromise ? previousPromise.then(callInvokeWithMethodAndArg, callInvokeWithMethodAndArg) : callInvokeWithMethodAndArg(); } }); } function makeInvokeMethod(innerFn, self, context) { var state = "suspendedStart"; return function (method, arg) { if ("executing" === state) throw new Error("Generator is already running"); if ("completed" === state) { if ("throw" === method) throw arg; return doneResult(); } for (context.method = method, context.arg = arg;;) { var delegate = context.delegate; if (delegate) { var delegateResult = maybeInvokeDelegate(delegate, context); if (delegateResult) { if (delegateResult === ContinueSentinel) continue; return delegateResult; } } if ("next" === context.method) context.sent = context._sent = context.arg;else if ("throw" === context.method) { if ("suspendedStart" === state) throw state = "completed", context.arg; context.dispatchException(context.arg); } else "return" === context.method && context.abrupt("return", context.arg); state = "executing"; var record = tryCatch(innerFn, self, context); if ("normal" === record.type) { if (state = context.done ? "completed" : "suspendedYield", record.arg === ContinueSentinel) continue; return { value: record.arg, done: context.done }; } "throw" === record.type && (state = "completed", context.method = "throw", context.arg = record.arg); } }; } function maybeInvokeDelegate(delegate, context) { var methodName = context.method, method = delegate.iterator[methodName]; if (undefined === method) return context.delegate = null, "throw" === methodName && delegate.iterator.return && (context.method = "return", context.arg = undefined, maybeInvokeDelegate(delegate, context), "throw" === context.method) || "return" !== methodName && (context.method = "throw", context.arg = new TypeError("The iterator does not provide a '" + methodName + "' method")), ContinueSentinel; var record = tryCatch(method, delegate.iterator, context.arg); if ("throw" === record.type) return context.method = "throw", context.arg = record.arg, context.delegate = null, ContinueSentinel; var info = record.arg; return info ? info.done ? (context[delegate.resultName] = info.value, context.next = delegate.nextLoc, "return" !== context.method && (context.method = "next", context.arg = undefined), context.delegate = null, ContinueSentinel) : info : (context.method = "throw", context.arg = new TypeError("iterator result is not an object"), context.delegate = null, ContinueSentinel); } function pushTryEntry(locs) { var entry = { tryLoc: locs[0] }; 1 in locs && (entry.catchLoc = locs[1]), 2 in locs && (entry.finallyLoc = locs[2], entry.afterLoc = locs[3]), this.tryEntries.push(entry); } function resetTryEntry(entry) { var record = entry.completion || {}; record.type = "normal", delete record.arg, entry.completion = record; } function Context(tryLocsList) { this.tryEntries = [{ tryLoc: "root" }], tryLocsList.forEach(pushTryEntry, this), this.reset(!0); } function values(iterable) { if (iterable) { var iteratorMethod = iterable[iteratorSymbol]; if (iteratorMethod) return iteratorMethod.call(iterable); if ("function" == typeof iterable.next) return iterable; if (!isNaN(iterable.length)) { var i = -1, next = function next() { for (; ++i < iterable.length;) { if (hasOwn.call(iterable, i)) return next.value = iterable[i], next.done = !1, next; } return next.value = undefined, next.done = !0, next; }; return next.next = next; } } return { next: doneResult }; } function doneResult() { return { value: undefined, done: !0 }; } return GeneratorFunction.prototype = GeneratorFunctionPrototype, defineProperty(Gp, "constructor", { value: GeneratorFunctionPrototype, configurable: !0 }), defineProperty(GeneratorFunctionPrototype, "constructor", { value: GeneratorFunction, configurable: !0 }), GeneratorFunction.displayName = define(GeneratorFunctionPrototype, toStringTagSymbol, "GeneratorFunction"), exports.isGeneratorFunction = function (genFun) { var ctor = "function" == typeof genFun && genFun.constructor; return !!ctor && (ctor === GeneratorFunction || "GeneratorFunction" === (ctor.displayName || ctor.name)); }, exports.mark = function (genFun) { return Object.setPrototypeOf ? Object.setPrototypeOf(genFun, GeneratorFunctionPrototype) : (genFun.__proto__ = GeneratorFunctionPrototype, define(genFun, toStringTagSymbol, "GeneratorFunction")), genFun.prototype = Object.create(Gp), genFun; }, exports.awrap = function (arg) { return { __await: arg }; }, defineIteratorMethods(AsyncIterator.prototype), define(AsyncIterator.prototype, asyncIteratorSymbol, function () { return this; }), exports.AsyncIterator = AsyncIterator, exports.async = function (innerFn, outerFn, self, tryLocsList, PromiseImpl) { void 0 === PromiseImpl && (PromiseImpl = Promise); var iter = new AsyncIterator(wrap(innerFn, outerFn, self, tryLocsList), PromiseImpl); return exports.isGeneratorFunction(outerFn) ? iter : iter.next().then(function (result) { return result.done ? result.value : iter.next(); }); }, defineIteratorMethods(Gp), define(Gp, toStringTagSymbol, "Generator"), define(Gp, iteratorSymbol, function () { return this; }), define(Gp, "toString", function () { return "[object Generator]"; }), exports.keys = function (val) { var object = Object(val), keys = []; for (var key in object) { keys.push(key); } return keys.reverse(), function next() { for (; keys.length;) { var key = keys.pop(); if (key in object) return next.value = key, next.done = !1, next; } return next.done = !0, next; }; }, exports.values = values, Context.prototype = { constructor: Context, reset: function reset(skipTempReset) { if (this.prev = 0, this.next = 0, this.sent = this._sent = undefined, this.done = !1, this.delegate = null, this.method = "next", this.arg = undefined, this.tryEntries.forEach(resetTryEntry), !skipTempReset) for (var name in this) { "t" === name.charAt(0) && hasOwn.call(this, name) && !isNaN(+name.slice(1)) && (this[name] = undefined); } }, stop: function stop() { this.done = !0; var rootRecord = this.tryEntries[0].completion; if ("throw" === rootRecord.type) throw rootRecord.arg; return this.rval; }, dispatchException: function dispatchException(exception) { if (this.done) throw exception; var context = this; function handle(loc, caught) { return record.type = "throw", record.arg = exception, context.next = loc, caught && (context.method = "next", context.arg = undefined), !!caught; } for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i], record = entry.completion; if ("root" === entry.tryLoc) return handle("end"); if (entry.tryLoc <= this.prev) { var hasCatch = hasOwn.call(entry, "catchLoc"), hasFinally = hasOwn.call(entry, "finallyLoc"); if (hasCatch && hasFinally) { if (this.prev < entry.catchLoc) return handle(entry.catchLoc, !0); if (this.prev < entry.finallyLoc) return handle(entry.finallyLoc); } else if (hasCatch) { if (this.prev < entry.catchLoc) return handle(entry.catchLoc, !0); } else { if (!hasFinally) throw new Error("try statement without catch or finally"); if (this.prev < entry.finallyLoc) return handle(entry.finallyLoc); } } } }, abrupt: function abrupt(type, arg) { for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i]; if (entry.tryLoc <= this.prev && hasOwn.call(entry, "finallyLoc") && this.prev < entry.finallyLoc) { var finallyEntry = entry; break; } } finallyEntry && ("break" === type || "continue" === type) && finallyEntry.tryLoc <= arg && arg <= finallyEntry.finallyLoc && (finallyEntry = null); var record = finallyEntry ? finallyEntry.completion : {}; return record.type = type, record.arg = arg, finallyEntry ? (this.method = "next", this.next = finallyEntry.finallyLoc, ContinueSentinel) : this.complete(record); }, complete: function complete(record, afterLoc) { if ("throw" === record.type) throw record.arg; return "break" === record.type || "continue" === record.type ? this.next = record.arg : "return" === record.type ? (this.rval = this.arg = record.arg, this.method = "return", this.next = "end") : "normal" === record.type && afterLoc && (this.next = afterLoc), ContinueSentinel; }, finish: function finish(finallyLoc) { for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i]; if (entry.finallyLoc === finallyLoc) return this.complete(entry.completion, entry.afterLoc), resetTryEntry(entry), ContinueSentinel; } }, catch: function _catch(tryLoc) { for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i]; if (entry.tryLoc === tryLoc) { var record = entry.completion; if ("throw" === record.type) { var thrown = record.arg; resetTryEntry(entry); } return thrown; } } throw new Error("illegal catch attempt"); }, delegateYield: function delegateYield(iterable, resultName, nextLoc) { return this.delegate = { iterator: values(iterable), resultName: resultName, nextLoc: nextLoc }, "next" === this.method && (this.arg = undefined), ContinueSentinel; } }, exports; }
|
|
20
|
+
// Represents theme state once mounted to the page (auto is hidden from observers)
|
|
21
|
+
|
|
19
22
|
var defaultColorMode = 'light';
|
|
20
23
|
var isMatchMediaAvailable = typeof window !== 'undefined' && 'matchMedia' in window;
|
|
21
24
|
var darkModeMediaQuery = '(prefers-color-scheme: dark)';
|
|
@@ -57,7 +60,7 @@ var checkNativeListener = function checkNativeListener(e) {
|
|
|
57
60
|
* ```
|
|
58
61
|
*/
|
|
59
62
|
var setGlobalTheme = /*#__PURE__*/function () {
|
|
60
|
-
var _ref = (0, _asyncToGenerator2.default)( /*#__PURE__*/
|
|
63
|
+
var _ref = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2() {
|
|
61
64
|
var _ref2,
|
|
62
65
|
_ref2$colorMode,
|
|
63
66
|
colorMode,
|
|
@@ -72,7 +75,7 @@ var setGlobalTheme = /*#__PURE__*/function () {
|
|
|
72
75
|
themePreferences,
|
|
73
76
|
themeAttributes,
|
|
74
77
|
_args2 = arguments;
|
|
75
|
-
return
|
|
78
|
+
return _regeneratorRuntime().wrap(function _callee2$(_context2) {
|
|
76
79
|
while (1) {
|
|
77
80
|
switch (_context2.prev = _context2.next) {
|
|
78
81
|
case 0:
|
|
@@ -86,8 +89,8 @@ var setGlobalTheme = /*#__PURE__*/function () {
|
|
|
86
89
|
return Promise.all((0, _toConsumableArray2.default)(themePreferences).filter(function (themeId) {
|
|
87
90
|
return themeId !== undefined;
|
|
88
91
|
}).map( /*#__PURE__*/function () {
|
|
89
|
-
var _ref3 = (0, _asyncToGenerator2.default)( /*#__PURE__*/
|
|
90
|
-
return
|
|
92
|
+
var _ref3 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(themeId) {
|
|
93
|
+
return _regeneratorRuntime().wrap(function _callee$(_context) {
|
|
91
94
|
while (1) {
|
|
92
95
|
switch (_context.prev = _context.next) {
|
|
93
96
|
case 0:
|
|
@@ -158,7 +161,7 @@ var setGlobalTheme = /*#__PURE__*/function () {
|
|
|
158
161
|
* If an error is encountered while loading themes, the themes arrav will be emptv.
|
|
159
162
|
*/
|
|
160
163
|
var getThemeStyles = /*#__PURE__*/function () {
|
|
161
|
-
var _ref6 = (0, _asyncToGenerator2.default)( /*#__PURE__*/
|
|
164
|
+
var _ref6 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regeneratorRuntime().mark(function _callee4() {
|
|
162
165
|
var _ref7,
|
|
163
166
|
_ref7$colorMode,
|
|
164
167
|
colorMode,
|
|
@@ -173,7 +176,7 @@ var getThemeStyles = /*#__PURE__*/function () {
|
|
|
173
176
|
themePreferences,
|
|
174
177
|
results,
|
|
175
178
|
_args4 = arguments;
|
|
176
|
-
return
|
|
179
|
+
return _regeneratorRuntime().wrap(function _callee4$(_context4) {
|
|
177
180
|
while (1) {
|
|
178
181
|
switch (_context4.prev = _context4.next) {
|
|
179
182
|
case 0:
|
|
@@ -189,9 +192,9 @@ var getThemeStyles = /*#__PURE__*/function () {
|
|
|
189
192
|
}
|
|
190
193
|
_context4.next = 6;
|
|
191
194
|
return Promise.all(themePreferences.map( /*#__PURE__*/function () {
|
|
192
|
-
var _ref8 = (0, _asyncToGenerator2.default)( /*#__PURE__*/
|
|
195
|
+
var _ref8 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regeneratorRuntime().mark(function _callee3(themeId) {
|
|
193
196
|
var css;
|
|
194
|
-
return
|
|
197
|
+
return _regeneratorRuntime().wrap(function _callee3$(_context3) {
|
|
195
198
|
while (1) {
|
|
196
199
|
switch (_context3.prev = _context3.next) {
|
|
197
200
|
case 0:
|
package/dist/cjs/theme-config.js
CHANGED
|
@@ -35,6 +35,23 @@ exports.themeColorModes = themeColorModes;
|
|
|
35
35
|
* These ids must be kebab case
|
|
36
36
|
*/
|
|
37
37
|
var themeIds = ['light', 'dark', 'legacy-light', 'legacy-dark', 'spacing', 'typography', 'shape'];
|
|
38
|
+
|
|
39
|
+
/**
|
|
40
|
+
* Theme to use a base. This will create the theme as
|
|
41
|
+
* an extension with all token values marked as optional
|
|
42
|
+
* to allow tokens to be overridden as required.
|
|
43
|
+
*/
|
|
44
|
+
|
|
45
|
+
/**
|
|
46
|
+
* Palettes: The set of base tokens a given theme may be populated with.
|
|
47
|
+
* For example: legacy light & dark themes use the "legacyPalette" containing colors from our
|
|
48
|
+
* previous color set.
|
|
49
|
+
*/
|
|
50
|
+
|
|
51
|
+
/**
|
|
52
|
+
* ThemeConfig: the source of truth for all theme meta-data.
|
|
53
|
+
* This object should be used whenever interfacing with themes.
|
|
54
|
+
*/
|
|
38
55
|
exports.themeIds = themeIds;
|
|
39
56
|
var themeConfig = {
|
|
40
57
|
'atlassian-light': {
|
|
@@ -1,18 +1,19 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
4
5
|
Object.defineProperty(exports, "__esModule", {
|
|
5
6
|
value: true
|
|
6
7
|
});
|
|
7
8
|
exports.loadThemeCss = exports.loadAndAppendThemeCss = void 0;
|
|
8
|
-
var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
|
|
9
9
|
var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
|
|
10
10
|
var _themeImportMap = _interopRequireDefault(require("../artifacts/theme-import-map"));
|
|
11
11
|
var _constants = require("../constants");
|
|
12
|
+
function _regeneratorRuntime() { "use strict"; /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */ _regeneratorRuntime = function _regeneratorRuntime() { return exports; }; var exports = {}, Op = Object.prototype, hasOwn = Op.hasOwnProperty, defineProperty = Object.defineProperty || function (obj, key, desc) { obj[key] = desc.value; }, $Symbol = "function" == typeof Symbol ? Symbol : {}, iteratorSymbol = $Symbol.iterator || "@@iterator", asyncIteratorSymbol = $Symbol.asyncIterator || "@@asyncIterator", toStringTagSymbol = $Symbol.toStringTag || "@@toStringTag"; function define(obj, key, value) { return Object.defineProperty(obj, key, { value: value, enumerable: !0, configurable: !0, writable: !0 }), obj[key]; } try { define({}, ""); } catch (err) { define = function define(obj, key, value) { return obj[key] = value; }; } function wrap(innerFn, outerFn, self, tryLocsList) { var protoGenerator = outerFn && outerFn.prototype instanceof Generator ? outerFn : Generator, generator = Object.create(protoGenerator.prototype), context = new Context(tryLocsList || []); return defineProperty(generator, "_invoke", { value: makeInvokeMethod(innerFn, self, context) }), generator; } function tryCatch(fn, obj, arg) { try { return { type: "normal", arg: fn.call(obj, arg) }; } catch (err) { return { type: "throw", arg: err }; } } exports.wrap = wrap; var ContinueSentinel = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} var IteratorPrototype = {}; define(IteratorPrototype, iteratorSymbol, function () { return this; }); var getProto = Object.getPrototypeOf, NativeIteratorPrototype = getProto && getProto(getProto(values([]))); NativeIteratorPrototype && NativeIteratorPrototype !== Op && hasOwn.call(NativeIteratorPrototype, iteratorSymbol) && (IteratorPrototype = NativeIteratorPrototype); var Gp = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(IteratorPrototype); function defineIteratorMethods(prototype) { ["next", "throw", "return"].forEach(function (method) { define(prototype, method, function (arg) { return this._invoke(method, arg); }); }); } function AsyncIterator(generator, PromiseImpl) { function invoke(method, arg, resolve, reject) { var record = tryCatch(generator[method], generator, arg); if ("throw" !== record.type) { var result = record.arg, value = result.value; return value && "object" == _typeof(value) && hasOwn.call(value, "__await") ? PromiseImpl.resolve(value.__await).then(function (value) { invoke("next", value, resolve, reject); }, function (err) { invoke("throw", err, resolve, reject); }) : PromiseImpl.resolve(value).then(function (unwrapped) { result.value = unwrapped, resolve(result); }, function (error) { return invoke("throw", error, resolve, reject); }); } reject(record.arg); } var previousPromise; defineProperty(this, "_invoke", { value: function value(method, arg) { function callInvokeWithMethodAndArg() { return new PromiseImpl(function (resolve, reject) { invoke(method, arg, resolve, reject); }); } return previousPromise = previousPromise ? previousPromise.then(callInvokeWithMethodAndArg, callInvokeWithMethodAndArg) : callInvokeWithMethodAndArg(); } }); } function makeInvokeMethod(innerFn, self, context) { var state = "suspendedStart"; return function (method, arg) { if ("executing" === state) throw new Error("Generator is already running"); if ("completed" === state) { if ("throw" === method) throw arg; return doneResult(); } for (context.method = method, context.arg = arg;;) { var delegate = context.delegate; if (delegate) { var delegateResult = maybeInvokeDelegate(delegate, context); if (delegateResult) { if (delegateResult === ContinueSentinel) continue; return delegateResult; } } if ("next" === context.method) context.sent = context._sent = context.arg;else if ("throw" === context.method) { if ("suspendedStart" === state) throw state = "completed", context.arg; context.dispatchException(context.arg); } else "return" === context.method && context.abrupt("return", context.arg); state = "executing"; var record = tryCatch(innerFn, self, context); if ("normal" === record.type) { if (state = context.done ? "completed" : "suspendedYield", record.arg === ContinueSentinel) continue; return { value: record.arg, done: context.done }; } "throw" === record.type && (state = "completed", context.method = "throw", context.arg = record.arg); } }; } function maybeInvokeDelegate(delegate, context) { var methodName = context.method, method = delegate.iterator[methodName]; if (undefined === method) return context.delegate = null, "throw" === methodName && delegate.iterator.return && (context.method = "return", context.arg = undefined, maybeInvokeDelegate(delegate, context), "throw" === context.method) || "return" !== methodName && (context.method = "throw", context.arg = new TypeError("The iterator does not provide a '" + methodName + "' method")), ContinueSentinel; var record = tryCatch(method, delegate.iterator, context.arg); if ("throw" === record.type) return context.method = "throw", context.arg = record.arg, context.delegate = null, ContinueSentinel; var info = record.arg; return info ? info.done ? (context[delegate.resultName] = info.value, context.next = delegate.nextLoc, "return" !== context.method && (context.method = "next", context.arg = undefined), context.delegate = null, ContinueSentinel) : info : (context.method = "throw", context.arg = new TypeError("iterator result is not an object"), context.delegate = null, ContinueSentinel); } function pushTryEntry(locs) { var entry = { tryLoc: locs[0] }; 1 in locs && (entry.catchLoc = locs[1]), 2 in locs && (entry.finallyLoc = locs[2], entry.afterLoc = locs[3]), this.tryEntries.push(entry); } function resetTryEntry(entry) { var record = entry.completion || {}; record.type = "normal", delete record.arg, entry.completion = record; } function Context(tryLocsList) { this.tryEntries = [{ tryLoc: "root" }], tryLocsList.forEach(pushTryEntry, this), this.reset(!0); } function values(iterable) { if (iterable) { var iteratorMethod = iterable[iteratorSymbol]; if (iteratorMethod) return iteratorMethod.call(iterable); if ("function" == typeof iterable.next) return iterable; if (!isNaN(iterable.length)) { var i = -1, next = function next() { for (; ++i < iterable.length;) { if (hasOwn.call(iterable, i)) return next.value = iterable[i], next.done = !1, next; } return next.value = undefined, next.done = !0, next; }; return next.next = next; } } return { next: doneResult }; } function doneResult() { return { value: undefined, done: !0 }; } return GeneratorFunction.prototype = GeneratorFunctionPrototype, defineProperty(Gp, "constructor", { value: GeneratorFunctionPrototype, configurable: !0 }), defineProperty(GeneratorFunctionPrototype, "constructor", { value: GeneratorFunction, configurable: !0 }), GeneratorFunction.displayName = define(GeneratorFunctionPrototype, toStringTagSymbol, "GeneratorFunction"), exports.isGeneratorFunction = function (genFun) { var ctor = "function" == typeof genFun && genFun.constructor; return !!ctor && (ctor === GeneratorFunction || "GeneratorFunction" === (ctor.displayName || ctor.name)); }, exports.mark = function (genFun) { return Object.setPrototypeOf ? Object.setPrototypeOf(genFun, GeneratorFunctionPrototype) : (genFun.__proto__ = GeneratorFunctionPrototype, define(genFun, toStringTagSymbol, "GeneratorFunction")), genFun.prototype = Object.create(Gp), genFun; }, exports.awrap = function (arg) { return { __await: arg }; }, defineIteratorMethods(AsyncIterator.prototype), define(AsyncIterator.prototype, asyncIteratorSymbol, function () { return this; }), exports.AsyncIterator = AsyncIterator, exports.async = function (innerFn, outerFn, self, tryLocsList, PromiseImpl) { void 0 === PromiseImpl && (PromiseImpl = Promise); var iter = new AsyncIterator(wrap(innerFn, outerFn, self, tryLocsList), PromiseImpl); return exports.isGeneratorFunction(outerFn) ? iter : iter.next().then(function (result) { return result.done ? result.value : iter.next(); }); }, defineIteratorMethods(Gp), define(Gp, toStringTagSymbol, "Generator"), define(Gp, iteratorSymbol, function () { return this; }), define(Gp, "toString", function () { return "[object Generator]"; }), exports.keys = function (val) { var object = Object(val), keys = []; for (var key in object) { keys.push(key); } return keys.reverse(), function next() { for (; keys.length;) { var key = keys.pop(); if (key in object) return next.value = key, next.done = !1, next; } return next.done = !0, next; }; }, exports.values = values, Context.prototype = { constructor: Context, reset: function reset(skipTempReset) { if (this.prev = 0, this.next = 0, this.sent = this._sent = undefined, this.done = !1, this.delegate = null, this.method = "next", this.arg = undefined, this.tryEntries.forEach(resetTryEntry), !skipTempReset) for (var name in this) { "t" === name.charAt(0) && hasOwn.call(this, name) && !isNaN(+name.slice(1)) && (this[name] = undefined); } }, stop: function stop() { this.done = !0; var rootRecord = this.tryEntries[0].completion; if ("throw" === rootRecord.type) throw rootRecord.arg; return this.rval; }, dispatchException: function dispatchException(exception) { if (this.done) throw exception; var context = this; function handle(loc, caught) { return record.type = "throw", record.arg = exception, context.next = loc, caught && (context.method = "next", context.arg = undefined), !!caught; } for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i], record = entry.completion; if ("root" === entry.tryLoc) return handle("end"); if (entry.tryLoc <= this.prev) { var hasCatch = hasOwn.call(entry, "catchLoc"), hasFinally = hasOwn.call(entry, "finallyLoc"); if (hasCatch && hasFinally) { if (this.prev < entry.catchLoc) return handle(entry.catchLoc, !0); if (this.prev < entry.finallyLoc) return handle(entry.finallyLoc); } else if (hasCatch) { if (this.prev < entry.catchLoc) return handle(entry.catchLoc, !0); } else { if (!hasFinally) throw new Error("try statement without catch or finally"); if (this.prev < entry.finallyLoc) return handle(entry.finallyLoc); } } } }, abrupt: function abrupt(type, arg) { for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i]; if (entry.tryLoc <= this.prev && hasOwn.call(entry, "finallyLoc") && this.prev < entry.finallyLoc) { var finallyEntry = entry; break; } } finallyEntry && ("break" === type || "continue" === type) && finallyEntry.tryLoc <= arg && arg <= finallyEntry.finallyLoc && (finallyEntry = null); var record = finallyEntry ? finallyEntry.completion : {}; return record.type = type, record.arg = arg, finallyEntry ? (this.method = "next", this.next = finallyEntry.finallyLoc, ContinueSentinel) : this.complete(record); }, complete: function complete(record, afterLoc) { if ("throw" === record.type) throw record.arg; return "break" === record.type || "continue" === record.type ? this.next = record.arg : "return" === record.type ? (this.rval = this.arg = record.arg, this.method = "return", this.next = "end") : "normal" === record.type && afterLoc && (this.next = afterLoc), ContinueSentinel; }, finish: function finish(finallyLoc) { for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i]; if (entry.finallyLoc === finallyLoc) return this.complete(entry.completion, entry.afterLoc), resetTryEntry(entry), ContinueSentinel; } }, catch: function _catch(tryLoc) { for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i]; if (entry.tryLoc === tryLoc) { var record = entry.completion; if ("throw" === record.type) { var thrown = record.arg; resetTryEntry(entry); } return thrown; } } throw new Error("illegal catch attempt"); }, delegateYield: function delegateYield(iterable, resultName, nextLoc) { return this.delegate = { iterator: values(iterable), resultName: resultName, nextLoc: nextLoc }, "next" === this.method && (this.arg = undefined), ContinueSentinel; } }, exports; }
|
|
12
13
|
var loadAndAppendThemeCss = /*#__PURE__*/function () {
|
|
13
|
-
var _ref = (0, _asyncToGenerator2.default)( /*#__PURE__*/
|
|
14
|
+
var _ref = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(themeId) {
|
|
14
15
|
var themeCss, style;
|
|
15
|
-
return
|
|
16
|
+
return _regeneratorRuntime().wrap(function _callee$(_context) {
|
|
16
17
|
while (1) {
|
|
17
18
|
switch (_context.prev = _context.next) {
|
|
18
19
|
case 0:
|
|
@@ -43,9 +44,9 @@ var loadAndAppendThemeCss = /*#__PURE__*/function () {
|
|
|
43
44
|
}();
|
|
44
45
|
exports.loadAndAppendThemeCss = loadAndAppendThemeCss;
|
|
45
46
|
var loadThemeCss = /*#__PURE__*/function () {
|
|
46
|
-
var _ref2 = (0, _asyncToGenerator2.default)( /*#__PURE__*/
|
|
47
|
+
var _ref2 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2(themeId) {
|
|
47
48
|
var _yield$themeImportMap, themeCss;
|
|
48
|
-
return
|
|
49
|
+
return _regeneratorRuntime().wrap(function _callee2$(_context2) {
|
|
49
50
|
while (1) {
|
|
50
51
|
switch (_context2.prev = _context2.next) {
|
|
51
52
|
case 0:
|
package/dist/cjs/version.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import warnOnce from '@atlaskit/ds-lib/warn-once';
|
|
2
2
|
import tokens from './artifacts/token-names';
|
|
3
3
|
const name = "@atlaskit/tokens";
|
|
4
|
-
const version = "1.2.
|
|
4
|
+
const version = "1.2.11";
|
|
5
5
|
/**
|
|
6
6
|
* Takes a dot-separated token name and and an optional fallback, and returns the current computed CSS value for the
|
|
7
7
|
* resulting CSS Custom Property.
|
package/dist/es2019/get-token.js
CHANGED
|
@@ -2,7 +2,7 @@ import warnOnce from '@atlaskit/ds-lib/warn-once';
|
|
|
2
2
|
import tokens from './artifacts/token-names';
|
|
3
3
|
import { TOKEN_NOT_FOUND_CSS_VAR } from './constants';
|
|
4
4
|
const name = "@atlaskit/tokens";
|
|
5
|
-
const version = "1.2.
|
|
5
|
+
const version = "1.2.11";
|
|
6
6
|
/**
|
|
7
7
|
* Takes a dot-separated token name and an optional fallback, and returns the CSS custom property for the corresponding token.
|
|
8
8
|
* This should be used to implement design decisions throughout your application.
|
|
@@ -4,6 +4,9 @@ import { getBooleanFF } from '@atlaskit/platform-feature-flags';
|
|
|
4
4
|
import { COLOR_MODE_ATTRIBUTE, THEME_DATA_ATTRIBUTE } from './constants';
|
|
5
5
|
import { loadAndAppendThemeCss, loadThemeCss } from './utils/theme-loading';
|
|
6
6
|
import { themeObjectToString } from './utils/theme-state-transformer';
|
|
7
|
+
|
|
8
|
+
// Represents theme state once mounted to the page (auto is hidden from observers)
|
|
9
|
+
|
|
7
10
|
const defaultColorMode = 'light';
|
|
8
11
|
const isMatchMediaAvailable = typeof window !== 'undefined' && 'matchMedia' in window;
|
|
9
12
|
const darkModeMediaQuery = '(prefers-color-scheme: dark)';
|
|
@@ -28,6 +28,24 @@ export const themeColorModes = ['light', 'dark', 'auto'];
|
|
|
28
28
|
* These ids must be kebab case
|
|
29
29
|
*/
|
|
30
30
|
export const themeIds = ['light', 'dark', 'legacy-light', 'legacy-dark', 'spacing', 'typography', 'shape'];
|
|
31
|
+
|
|
32
|
+
/**
|
|
33
|
+
* Theme to use a base. This will create the theme as
|
|
34
|
+
* an extension with all token values marked as optional
|
|
35
|
+
* to allow tokens to be overridden as required.
|
|
36
|
+
*/
|
|
37
|
+
|
|
38
|
+
/**
|
|
39
|
+
* Palettes: The set of base tokens a given theme may be populated with.
|
|
40
|
+
* For example: legacy light & dark themes use the "legacyPalette" containing colors from our
|
|
41
|
+
* previous color set.
|
|
42
|
+
*/
|
|
43
|
+
|
|
44
|
+
/**
|
|
45
|
+
* ThemeConfig: the source of truth for all theme meta-data.
|
|
46
|
+
* This object should be used whenever interfacing with themes.
|
|
47
|
+
*/
|
|
48
|
+
|
|
31
49
|
const themeConfig = {
|
|
32
50
|
'atlassian-light': {
|
|
33
51
|
id: 'light',
|
package/dist/es2019/version.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import warnOnce from '@atlaskit/ds-lib/warn-once';
|
|
2
2
|
import tokens from './artifacts/token-names';
|
|
3
3
|
var name = "@atlaskit/tokens";
|
|
4
|
-
var version = "1.2.
|
|
4
|
+
var version = "1.2.11";
|
|
5
5
|
/**
|
|
6
6
|
* Takes a dot-separated token name and and an optional fallback, and returns the current computed CSS value for the
|
|
7
7
|
* resulting CSS Custom Property.
|
package/dist/esm/get-token.js
CHANGED
|
@@ -2,7 +2,7 @@ import warnOnce from '@atlaskit/ds-lib/warn-once';
|
|
|
2
2
|
import tokens from './artifacts/token-names';
|
|
3
3
|
import { TOKEN_NOT_FOUND_CSS_VAR } from './constants';
|
|
4
4
|
var name = "@atlaskit/tokens";
|
|
5
|
-
var version = "1.2.
|
|
5
|
+
var version = "1.2.11";
|
|
6
6
|
/**
|
|
7
7
|
* Takes a dot-separated token name and an optional fallback, and returns the CSS custom property for the corresponding token.
|
|
8
8
|
* This should be used to implement design decisions throughout your application.
|
|
@@ -1,14 +1,18 @@
|
|
|
1
|
+
import _typeof from "@babel/runtime/helpers/typeof";
|
|
1
2
|
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
2
3
|
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
|
|
3
4
|
import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
|
|
4
5
|
import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
|
|
5
|
-
import _regeneratorRuntime from "@babel/runtime/regenerator";
|
|
6
|
+
function _regeneratorRuntime() { "use strict"; /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */ _regeneratorRuntime = function _regeneratorRuntime() { return exports; }; var exports = {}, Op = Object.prototype, hasOwn = Op.hasOwnProperty, defineProperty = Object.defineProperty || function (obj, key, desc) { obj[key] = desc.value; }, $Symbol = "function" == typeof Symbol ? Symbol : {}, iteratorSymbol = $Symbol.iterator || "@@iterator", asyncIteratorSymbol = $Symbol.asyncIterator || "@@asyncIterator", toStringTagSymbol = $Symbol.toStringTag || "@@toStringTag"; function define(obj, key, value) { return Object.defineProperty(obj, key, { value: value, enumerable: !0, configurable: !0, writable: !0 }), obj[key]; } try { define({}, ""); } catch (err) { define = function define(obj, key, value) { return obj[key] = value; }; } function wrap(innerFn, outerFn, self, tryLocsList) { var protoGenerator = outerFn && outerFn.prototype instanceof Generator ? outerFn : Generator, generator = Object.create(protoGenerator.prototype), context = new Context(tryLocsList || []); return defineProperty(generator, "_invoke", { value: makeInvokeMethod(innerFn, self, context) }), generator; } function tryCatch(fn, obj, arg) { try { return { type: "normal", arg: fn.call(obj, arg) }; } catch (err) { return { type: "throw", arg: err }; } } exports.wrap = wrap; var ContinueSentinel = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} var IteratorPrototype = {}; define(IteratorPrototype, iteratorSymbol, function () { return this; }); var getProto = Object.getPrototypeOf, NativeIteratorPrototype = getProto && getProto(getProto(values([]))); NativeIteratorPrototype && NativeIteratorPrototype !== Op && hasOwn.call(NativeIteratorPrototype, iteratorSymbol) && (IteratorPrototype = NativeIteratorPrototype); var Gp = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(IteratorPrototype); function defineIteratorMethods(prototype) { ["next", "throw", "return"].forEach(function (method) { define(prototype, method, function (arg) { return this._invoke(method, arg); }); }); } function AsyncIterator(generator, PromiseImpl) { function invoke(method, arg, resolve, reject) { var record = tryCatch(generator[method], generator, arg); if ("throw" !== record.type) { var result = record.arg, value = result.value; return value && "object" == _typeof(value) && hasOwn.call(value, "__await") ? PromiseImpl.resolve(value.__await).then(function (value) { invoke("next", value, resolve, reject); }, function (err) { invoke("throw", err, resolve, reject); }) : PromiseImpl.resolve(value).then(function (unwrapped) { result.value = unwrapped, resolve(result); }, function (error) { return invoke("throw", error, resolve, reject); }); } reject(record.arg); } var previousPromise; defineProperty(this, "_invoke", { value: function value(method, arg) { function callInvokeWithMethodAndArg() { return new PromiseImpl(function (resolve, reject) { invoke(method, arg, resolve, reject); }); } return previousPromise = previousPromise ? previousPromise.then(callInvokeWithMethodAndArg, callInvokeWithMethodAndArg) : callInvokeWithMethodAndArg(); } }); } function makeInvokeMethod(innerFn, self, context) { var state = "suspendedStart"; return function (method, arg) { if ("executing" === state) throw new Error("Generator is already running"); if ("completed" === state) { if ("throw" === method) throw arg; return doneResult(); } for (context.method = method, context.arg = arg;;) { var delegate = context.delegate; if (delegate) { var delegateResult = maybeInvokeDelegate(delegate, context); if (delegateResult) { if (delegateResult === ContinueSentinel) continue; return delegateResult; } } if ("next" === context.method) context.sent = context._sent = context.arg;else if ("throw" === context.method) { if ("suspendedStart" === state) throw state = "completed", context.arg; context.dispatchException(context.arg); } else "return" === context.method && context.abrupt("return", context.arg); state = "executing"; var record = tryCatch(innerFn, self, context); if ("normal" === record.type) { if (state = context.done ? "completed" : "suspendedYield", record.arg === ContinueSentinel) continue; return { value: record.arg, done: context.done }; } "throw" === record.type && (state = "completed", context.method = "throw", context.arg = record.arg); } }; } function maybeInvokeDelegate(delegate, context) { var methodName = context.method, method = delegate.iterator[methodName]; if (undefined === method) return context.delegate = null, "throw" === methodName && delegate.iterator.return && (context.method = "return", context.arg = undefined, maybeInvokeDelegate(delegate, context), "throw" === context.method) || "return" !== methodName && (context.method = "throw", context.arg = new TypeError("The iterator does not provide a '" + methodName + "' method")), ContinueSentinel; var record = tryCatch(method, delegate.iterator, context.arg); if ("throw" === record.type) return context.method = "throw", context.arg = record.arg, context.delegate = null, ContinueSentinel; var info = record.arg; return info ? info.done ? (context[delegate.resultName] = info.value, context.next = delegate.nextLoc, "return" !== context.method && (context.method = "next", context.arg = undefined), context.delegate = null, ContinueSentinel) : info : (context.method = "throw", context.arg = new TypeError("iterator result is not an object"), context.delegate = null, ContinueSentinel); } function pushTryEntry(locs) { var entry = { tryLoc: locs[0] }; 1 in locs && (entry.catchLoc = locs[1]), 2 in locs && (entry.finallyLoc = locs[2], entry.afterLoc = locs[3]), this.tryEntries.push(entry); } function resetTryEntry(entry) { var record = entry.completion || {}; record.type = "normal", delete record.arg, entry.completion = record; } function Context(tryLocsList) { this.tryEntries = [{ tryLoc: "root" }], tryLocsList.forEach(pushTryEntry, this), this.reset(!0); } function values(iterable) { if (iterable) { var iteratorMethod = iterable[iteratorSymbol]; if (iteratorMethod) return iteratorMethod.call(iterable); if ("function" == typeof iterable.next) return iterable; if (!isNaN(iterable.length)) { var i = -1, next = function next() { for (; ++i < iterable.length;) { if (hasOwn.call(iterable, i)) return next.value = iterable[i], next.done = !1, next; } return next.value = undefined, next.done = !0, next; }; return next.next = next; } } return { next: doneResult }; } function doneResult() { return { value: undefined, done: !0 }; } return GeneratorFunction.prototype = GeneratorFunctionPrototype, defineProperty(Gp, "constructor", { value: GeneratorFunctionPrototype, configurable: !0 }), defineProperty(GeneratorFunctionPrototype, "constructor", { value: GeneratorFunction, configurable: !0 }), GeneratorFunction.displayName = define(GeneratorFunctionPrototype, toStringTagSymbol, "GeneratorFunction"), exports.isGeneratorFunction = function (genFun) { var ctor = "function" == typeof genFun && genFun.constructor; return !!ctor && (ctor === GeneratorFunction || "GeneratorFunction" === (ctor.displayName || ctor.name)); }, exports.mark = function (genFun) { return Object.setPrototypeOf ? Object.setPrototypeOf(genFun, GeneratorFunctionPrototype) : (genFun.__proto__ = GeneratorFunctionPrototype, define(genFun, toStringTagSymbol, "GeneratorFunction")), genFun.prototype = Object.create(Gp), genFun; }, exports.awrap = function (arg) { return { __await: arg }; }, defineIteratorMethods(AsyncIterator.prototype), define(AsyncIterator.prototype, asyncIteratorSymbol, function () { return this; }), exports.AsyncIterator = AsyncIterator, exports.async = function (innerFn, outerFn, self, tryLocsList, PromiseImpl) { void 0 === PromiseImpl && (PromiseImpl = Promise); var iter = new AsyncIterator(wrap(innerFn, outerFn, self, tryLocsList), PromiseImpl); return exports.isGeneratorFunction(outerFn) ? iter : iter.next().then(function (result) { return result.done ? result.value : iter.next(); }); }, defineIteratorMethods(Gp), define(Gp, toStringTagSymbol, "Generator"), define(Gp, iteratorSymbol, function () { return this; }), define(Gp, "toString", function () { return "[object Generator]"; }), exports.keys = function (val) { var object = Object(val), keys = []; for (var key in object) { keys.push(key); } return keys.reverse(), function next() { for (; keys.length;) { var key = keys.pop(); if (key in object) return next.value = key, next.done = !1, next; } return next.done = !0, next; }; }, exports.values = values, Context.prototype = { constructor: Context, reset: function reset(skipTempReset) { if (this.prev = 0, this.next = 0, this.sent = this._sent = undefined, this.done = !1, this.delegate = null, this.method = "next", this.arg = undefined, this.tryEntries.forEach(resetTryEntry), !skipTempReset) for (var name in this) { "t" === name.charAt(0) && hasOwn.call(this, name) && !isNaN(+name.slice(1)) && (this[name] = undefined); } }, stop: function stop() { this.done = !0; var rootRecord = this.tryEntries[0].completion; if ("throw" === rootRecord.type) throw rootRecord.arg; return this.rval; }, dispatchException: function dispatchException(exception) { if (this.done) throw exception; var context = this; function handle(loc, caught) { return record.type = "throw", record.arg = exception, context.next = loc, caught && (context.method = "next", context.arg = undefined), !!caught; } for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i], record = entry.completion; if ("root" === entry.tryLoc) return handle("end"); if (entry.tryLoc <= this.prev) { var hasCatch = hasOwn.call(entry, "catchLoc"), hasFinally = hasOwn.call(entry, "finallyLoc"); if (hasCatch && hasFinally) { if (this.prev < entry.catchLoc) return handle(entry.catchLoc, !0); if (this.prev < entry.finallyLoc) return handle(entry.finallyLoc); } else if (hasCatch) { if (this.prev < entry.catchLoc) return handle(entry.catchLoc, !0); } else { if (!hasFinally) throw new Error("try statement without catch or finally"); if (this.prev < entry.finallyLoc) return handle(entry.finallyLoc); } } } }, abrupt: function abrupt(type, arg) { for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i]; if (entry.tryLoc <= this.prev && hasOwn.call(entry, "finallyLoc") && this.prev < entry.finallyLoc) { var finallyEntry = entry; break; } } finallyEntry && ("break" === type || "continue" === type) && finallyEntry.tryLoc <= arg && arg <= finallyEntry.finallyLoc && (finallyEntry = null); var record = finallyEntry ? finallyEntry.completion : {}; return record.type = type, record.arg = arg, finallyEntry ? (this.method = "next", this.next = finallyEntry.finallyLoc, ContinueSentinel) : this.complete(record); }, complete: function complete(record, afterLoc) { if ("throw" === record.type) throw record.arg; return "break" === record.type || "continue" === record.type ? this.next = record.arg : "return" === record.type ? (this.rval = this.arg = record.arg, this.method = "return", this.next = "end") : "normal" === record.type && afterLoc && (this.next = afterLoc), ContinueSentinel; }, finish: function finish(finallyLoc) { for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i]; if (entry.finallyLoc === finallyLoc) return this.complete(entry.completion, entry.afterLoc), resetTryEntry(entry), ContinueSentinel; } }, catch: function _catch(tryLoc) { for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i]; if (entry.tryLoc === tryLoc) { var record = entry.completion; if ("throw" === record.type) { var thrown = record.arg; resetTryEntry(entry); } return thrown; } } throw new Error("illegal catch attempt"); }, delegateYield: function delegateYield(iterable, resultName, nextLoc) { return this.delegate = { iterator: values(iterable), resultName: resultName, nextLoc: nextLoc }, "next" === this.method && (this.arg = undefined), ContinueSentinel; } }, exports; }
|
|
6
7
|
import { bind } from 'bind-event-listener';
|
|
7
8
|
import noop from '@atlaskit/ds-lib/noop';
|
|
8
9
|
import { getBooleanFF } from '@atlaskit/platform-feature-flags';
|
|
9
10
|
import { COLOR_MODE_ATTRIBUTE, THEME_DATA_ATTRIBUTE } from './constants';
|
|
10
11
|
import { loadAndAppendThemeCss, loadThemeCss } from './utils/theme-loading';
|
|
11
12
|
import { themeObjectToString } from './utils/theme-state-transformer';
|
|
13
|
+
|
|
14
|
+
// Represents theme state once mounted to the page (auto is hidden from observers)
|
|
15
|
+
|
|
12
16
|
var defaultColorMode = 'light';
|
|
13
17
|
var isMatchMediaAvailable = typeof window !== 'undefined' && 'matchMedia' in window;
|
|
14
18
|
var darkModeMediaQuery = '(prefers-color-scheme: dark)';
|
|
@@ -50,7 +54,7 @@ var checkNativeListener = function checkNativeListener(e) {
|
|
|
50
54
|
* ```
|
|
51
55
|
*/
|
|
52
56
|
var setGlobalTheme = /*#__PURE__*/function () {
|
|
53
|
-
var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
|
|
57
|
+
var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2() {
|
|
54
58
|
var _ref2,
|
|
55
59
|
_ref2$colorMode,
|
|
56
60
|
colorMode,
|
|
@@ -65,7 +69,7 @@ var setGlobalTheme = /*#__PURE__*/function () {
|
|
|
65
69
|
themePreferences,
|
|
66
70
|
themeAttributes,
|
|
67
71
|
_args2 = arguments;
|
|
68
|
-
return _regeneratorRuntime.wrap(function _callee2$(_context2) {
|
|
72
|
+
return _regeneratorRuntime().wrap(function _callee2$(_context2) {
|
|
69
73
|
while (1) {
|
|
70
74
|
switch (_context2.prev = _context2.next) {
|
|
71
75
|
case 0:
|
|
@@ -79,8 +83,8 @@ var setGlobalTheme = /*#__PURE__*/function () {
|
|
|
79
83
|
return Promise.all(_toConsumableArray(themePreferences).filter(function (themeId) {
|
|
80
84
|
return themeId !== undefined;
|
|
81
85
|
}).map( /*#__PURE__*/function () {
|
|
82
|
-
var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(themeId) {
|
|
83
|
-
return _regeneratorRuntime.wrap(function _callee$(_context) {
|
|
86
|
+
var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(themeId) {
|
|
87
|
+
return _regeneratorRuntime().wrap(function _callee$(_context) {
|
|
84
88
|
while (1) {
|
|
85
89
|
switch (_context.prev = _context.next) {
|
|
86
90
|
case 0:
|
|
@@ -151,7 +155,7 @@ var setGlobalTheme = /*#__PURE__*/function () {
|
|
|
151
155
|
* If an error is encountered while loading themes, the themes arrav will be emptv.
|
|
152
156
|
*/
|
|
153
157
|
export var getThemeStyles = /*#__PURE__*/function () {
|
|
154
|
-
var _ref6 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee4() {
|
|
158
|
+
var _ref6 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee4() {
|
|
155
159
|
var _ref7,
|
|
156
160
|
_ref7$colorMode,
|
|
157
161
|
colorMode,
|
|
@@ -166,7 +170,7 @@ export var getThemeStyles = /*#__PURE__*/function () {
|
|
|
166
170
|
themePreferences,
|
|
167
171
|
results,
|
|
168
172
|
_args4 = arguments;
|
|
169
|
-
return _regeneratorRuntime.wrap(function _callee4$(_context4) {
|
|
173
|
+
return _regeneratorRuntime().wrap(function _callee4$(_context4) {
|
|
170
174
|
while (1) {
|
|
171
175
|
switch (_context4.prev = _context4.next) {
|
|
172
176
|
case 0:
|
|
@@ -182,9 +186,9 @@ export var getThemeStyles = /*#__PURE__*/function () {
|
|
|
182
186
|
}
|
|
183
187
|
_context4.next = 6;
|
|
184
188
|
return Promise.all(themePreferences.map( /*#__PURE__*/function () {
|
|
185
|
-
var _ref8 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee3(themeId) {
|
|
189
|
+
var _ref8 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee3(themeId) {
|
|
186
190
|
var css;
|
|
187
|
-
return _regeneratorRuntime.wrap(function _callee3$(_context3) {
|
|
191
|
+
return _regeneratorRuntime().wrap(function _callee3$(_context3) {
|
|
188
192
|
while (1) {
|
|
189
193
|
switch (_context3.prev = _context3.next) {
|
|
190
194
|
case 0:
|
package/dist/esm/theme-config.js
CHANGED
|
@@ -28,6 +28,24 @@ export var themeColorModes = ['light', 'dark', 'auto'];
|
|
|
28
28
|
* These ids must be kebab case
|
|
29
29
|
*/
|
|
30
30
|
export var themeIds = ['light', 'dark', 'legacy-light', 'legacy-dark', 'spacing', 'typography', 'shape'];
|
|
31
|
+
|
|
32
|
+
/**
|
|
33
|
+
* Theme to use a base. This will create the theme as
|
|
34
|
+
* an extension with all token values marked as optional
|
|
35
|
+
* to allow tokens to be overridden as required.
|
|
36
|
+
*/
|
|
37
|
+
|
|
38
|
+
/**
|
|
39
|
+
* Palettes: The set of base tokens a given theme may be populated with.
|
|
40
|
+
* For example: legacy light & dark themes use the "legacyPalette" containing colors from our
|
|
41
|
+
* previous color set.
|
|
42
|
+
*/
|
|
43
|
+
|
|
44
|
+
/**
|
|
45
|
+
* ThemeConfig: the source of truth for all theme meta-data.
|
|
46
|
+
* This object should be used whenever interfacing with themes.
|
|
47
|
+
*/
|
|
48
|
+
|
|
31
49
|
var themeConfig = {
|
|
32
50
|
'atlassian-light': {
|
|
33
51
|
id: 'light',
|
|
@@ -1,11 +1,12 @@
|
|
|
1
|
+
import _typeof from "@babel/runtime/helpers/typeof";
|
|
1
2
|
import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
|
|
2
|
-
import _regeneratorRuntime from "@babel/runtime/regenerator";
|
|
3
|
+
function _regeneratorRuntime() { "use strict"; /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */ _regeneratorRuntime = function _regeneratorRuntime() { return exports; }; var exports = {}, Op = Object.prototype, hasOwn = Op.hasOwnProperty, defineProperty = Object.defineProperty || function (obj, key, desc) { obj[key] = desc.value; }, $Symbol = "function" == typeof Symbol ? Symbol : {}, iteratorSymbol = $Symbol.iterator || "@@iterator", asyncIteratorSymbol = $Symbol.asyncIterator || "@@asyncIterator", toStringTagSymbol = $Symbol.toStringTag || "@@toStringTag"; function define(obj, key, value) { return Object.defineProperty(obj, key, { value: value, enumerable: !0, configurable: !0, writable: !0 }), obj[key]; } try { define({}, ""); } catch (err) { define = function define(obj, key, value) { return obj[key] = value; }; } function wrap(innerFn, outerFn, self, tryLocsList) { var protoGenerator = outerFn && outerFn.prototype instanceof Generator ? outerFn : Generator, generator = Object.create(protoGenerator.prototype), context = new Context(tryLocsList || []); return defineProperty(generator, "_invoke", { value: makeInvokeMethod(innerFn, self, context) }), generator; } function tryCatch(fn, obj, arg) { try { return { type: "normal", arg: fn.call(obj, arg) }; } catch (err) { return { type: "throw", arg: err }; } } exports.wrap = wrap; var ContinueSentinel = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} var IteratorPrototype = {}; define(IteratorPrototype, iteratorSymbol, function () { return this; }); var getProto = Object.getPrototypeOf, NativeIteratorPrototype = getProto && getProto(getProto(values([]))); NativeIteratorPrototype && NativeIteratorPrototype !== Op && hasOwn.call(NativeIteratorPrototype, iteratorSymbol) && (IteratorPrototype = NativeIteratorPrototype); var Gp = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(IteratorPrototype); function defineIteratorMethods(prototype) { ["next", "throw", "return"].forEach(function (method) { define(prototype, method, function (arg) { return this._invoke(method, arg); }); }); } function AsyncIterator(generator, PromiseImpl) { function invoke(method, arg, resolve, reject) { var record = tryCatch(generator[method], generator, arg); if ("throw" !== record.type) { var result = record.arg, value = result.value; return value && "object" == _typeof(value) && hasOwn.call(value, "__await") ? PromiseImpl.resolve(value.__await).then(function (value) { invoke("next", value, resolve, reject); }, function (err) { invoke("throw", err, resolve, reject); }) : PromiseImpl.resolve(value).then(function (unwrapped) { result.value = unwrapped, resolve(result); }, function (error) { return invoke("throw", error, resolve, reject); }); } reject(record.arg); } var previousPromise; defineProperty(this, "_invoke", { value: function value(method, arg) { function callInvokeWithMethodAndArg() { return new PromiseImpl(function (resolve, reject) { invoke(method, arg, resolve, reject); }); } return previousPromise = previousPromise ? previousPromise.then(callInvokeWithMethodAndArg, callInvokeWithMethodAndArg) : callInvokeWithMethodAndArg(); } }); } function makeInvokeMethod(innerFn, self, context) { var state = "suspendedStart"; return function (method, arg) { if ("executing" === state) throw new Error("Generator is already running"); if ("completed" === state) { if ("throw" === method) throw arg; return doneResult(); } for (context.method = method, context.arg = arg;;) { var delegate = context.delegate; if (delegate) { var delegateResult = maybeInvokeDelegate(delegate, context); if (delegateResult) { if (delegateResult === ContinueSentinel) continue; return delegateResult; } } if ("next" === context.method) context.sent = context._sent = context.arg;else if ("throw" === context.method) { if ("suspendedStart" === state) throw state = "completed", context.arg; context.dispatchException(context.arg); } else "return" === context.method && context.abrupt("return", context.arg); state = "executing"; var record = tryCatch(innerFn, self, context); if ("normal" === record.type) { if (state = context.done ? "completed" : "suspendedYield", record.arg === ContinueSentinel) continue; return { value: record.arg, done: context.done }; } "throw" === record.type && (state = "completed", context.method = "throw", context.arg = record.arg); } }; } function maybeInvokeDelegate(delegate, context) { var methodName = context.method, method = delegate.iterator[methodName]; if (undefined === method) return context.delegate = null, "throw" === methodName && delegate.iterator.return && (context.method = "return", context.arg = undefined, maybeInvokeDelegate(delegate, context), "throw" === context.method) || "return" !== methodName && (context.method = "throw", context.arg = new TypeError("The iterator does not provide a '" + methodName + "' method")), ContinueSentinel; var record = tryCatch(method, delegate.iterator, context.arg); if ("throw" === record.type) return context.method = "throw", context.arg = record.arg, context.delegate = null, ContinueSentinel; var info = record.arg; return info ? info.done ? (context[delegate.resultName] = info.value, context.next = delegate.nextLoc, "return" !== context.method && (context.method = "next", context.arg = undefined), context.delegate = null, ContinueSentinel) : info : (context.method = "throw", context.arg = new TypeError("iterator result is not an object"), context.delegate = null, ContinueSentinel); } function pushTryEntry(locs) { var entry = { tryLoc: locs[0] }; 1 in locs && (entry.catchLoc = locs[1]), 2 in locs && (entry.finallyLoc = locs[2], entry.afterLoc = locs[3]), this.tryEntries.push(entry); } function resetTryEntry(entry) { var record = entry.completion || {}; record.type = "normal", delete record.arg, entry.completion = record; } function Context(tryLocsList) { this.tryEntries = [{ tryLoc: "root" }], tryLocsList.forEach(pushTryEntry, this), this.reset(!0); } function values(iterable) { if (iterable) { var iteratorMethod = iterable[iteratorSymbol]; if (iteratorMethod) return iteratorMethod.call(iterable); if ("function" == typeof iterable.next) return iterable; if (!isNaN(iterable.length)) { var i = -1, next = function next() { for (; ++i < iterable.length;) { if (hasOwn.call(iterable, i)) return next.value = iterable[i], next.done = !1, next; } return next.value = undefined, next.done = !0, next; }; return next.next = next; } } return { next: doneResult }; } function doneResult() { return { value: undefined, done: !0 }; } return GeneratorFunction.prototype = GeneratorFunctionPrototype, defineProperty(Gp, "constructor", { value: GeneratorFunctionPrototype, configurable: !0 }), defineProperty(GeneratorFunctionPrototype, "constructor", { value: GeneratorFunction, configurable: !0 }), GeneratorFunction.displayName = define(GeneratorFunctionPrototype, toStringTagSymbol, "GeneratorFunction"), exports.isGeneratorFunction = function (genFun) { var ctor = "function" == typeof genFun && genFun.constructor; return !!ctor && (ctor === GeneratorFunction || "GeneratorFunction" === (ctor.displayName || ctor.name)); }, exports.mark = function (genFun) { return Object.setPrototypeOf ? Object.setPrototypeOf(genFun, GeneratorFunctionPrototype) : (genFun.__proto__ = GeneratorFunctionPrototype, define(genFun, toStringTagSymbol, "GeneratorFunction")), genFun.prototype = Object.create(Gp), genFun; }, exports.awrap = function (arg) { return { __await: arg }; }, defineIteratorMethods(AsyncIterator.prototype), define(AsyncIterator.prototype, asyncIteratorSymbol, function () { return this; }), exports.AsyncIterator = AsyncIterator, exports.async = function (innerFn, outerFn, self, tryLocsList, PromiseImpl) { void 0 === PromiseImpl && (PromiseImpl = Promise); var iter = new AsyncIterator(wrap(innerFn, outerFn, self, tryLocsList), PromiseImpl); return exports.isGeneratorFunction(outerFn) ? iter : iter.next().then(function (result) { return result.done ? result.value : iter.next(); }); }, defineIteratorMethods(Gp), define(Gp, toStringTagSymbol, "Generator"), define(Gp, iteratorSymbol, function () { return this; }), define(Gp, "toString", function () { return "[object Generator]"; }), exports.keys = function (val) { var object = Object(val), keys = []; for (var key in object) { keys.push(key); } return keys.reverse(), function next() { for (; keys.length;) { var key = keys.pop(); if (key in object) return next.value = key, next.done = !1, next; } return next.done = !0, next; }; }, exports.values = values, Context.prototype = { constructor: Context, reset: function reset(skipTempReset) { if (this.prev = 0, this.next = 0, this.sent = this._sent = undefined, this.done = !1, this.delegate = null, this.method = "next", this.arg = undefined, this.tryEntries.forEach(resetTryEntry), !skipTempReset) for (var name in this) { "t" === name.charAt(0) && hasOwn.call(this, name) && !isNaN(+name.slice(1)) && (this[name] = undefined); } }, stop: function stop() { this.done = !0; var rootRecord = this.tryEntries[0].completion; if ("throw" === rootRecord.type) throw rootRecord.arg; return this.rval; }, dispatchException: function dispatchException(exception) { if (this.done) throw exception; var context = this; function handle(loc, caught) { return record.type = "throw", record.arg = exception, context.next = loc, caught && (context.method = "next", context.arg = undefined), !!caught; } for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i], record = entry.completion; if ("root" === entry.tryLoc) return handle("end"); if (entry.tryLoc <= this.prev) { var hasCatch = hasOwn.call(entry, "catchLoc"), hasFinally = hasOwn.call(entry, "finallyLoc"); if (hasCatch && hasFinally) { if (this.prev < entry.catchLoc) return handle(entry.catchLoc, !0); if (this.prev < entry.finallyLoc) return handle(entry.finallyLoc); } else if (hasCatch) { if (this.prev < entry.catchLoc) return handle(entry.catchLoc, !0); } else { if (!hasFinally) throw new Error("try statement without catch or finally"); if (this.prev < entry.finallyLoc) return handle(entry.finallyLoc); } } } }, abrupt: function abrupt(type, arg) { for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i]; if (entry.tryLoc <= this.prev && hasOwn.call(entry, "finallyLoc") && this.prev < entry.finallyLoc) { var finallyEntry = entry; break; } } finallyEntry && ("break" === type || "continue" === type) && finallyEntry.tryLoc <= arg && arg <= finallyEntry.finallyLoc && (finallyEntry = null); var record = finallyEntry ? finallyEntry.completion : {}; return record.type = type, record.arg = arg, finallyEntry ? (this.method = "next", this.next = finallyEntry.finallyLoc, ContinueSentinel) : this.complete(record); }, complete: function complete(record, afterLoc) { if ("throw" === record.type) throw record.arg; return "break" === record.type || "continue" === record.type ? this.next = record.arg : "return" === record.type ? (this.rval = this.arg = record.arg, this.method = "return", this.next = "end") : "normal" === record.type && afterLoc && (this.next = afterLoc), ContinueSentinel; }, finish: function finish(finallyLoc) { for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i]; if (entry.finallyLoc === finallyLoc) return this.complete(entry.completion, entry.afterLoc), resetTryEntry(entry), ContinueSentinel; } }, catch: function _catch(tryLoc) { for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i]; if (entry.tryLoc === tryLoc) { var record = entry.completion; if ("throw" === record.type) { var thrown = record.arg; resetTryEntry(entry); } return thrown; } } throw new Error("illegal catch attempt"); }, delegateYield: function delegateYield(iterable, resultName, nextLoc) { return this.delegate = { iterator: values(iterable), resultName: resultName, nextLoc: nextLoc }, "next" === this.method && (this.arg = undefined), ContinueSentinel; } }, exports; }
|
|
3
4
|
import themeImportMap from '../artifacts/theme-import-map';
|
|
4
5
|
import { THEME_DATA_ATTRIBUTE } from '../constants';
|
|
5
6
|
export var loadAndAppendThemeCss = /*#__PURE__*/function () {
|
|
6
|
-
var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(themeId) {
|
|
7
|
+
var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(themeId) {
|
|
7
8
|
var themeCss, style;
|
|
8
|
-
return _regeneratorRuntime.wrap(function _callee$(_context) {
|
|
9
|
+
return _regeneratorRuntime().wrap(function _callee$(_context) {
|
|
9
10
|
while (1) {
|
|
10
11
|
switch (_context.prev = _context.next) {
|
|
11
12
|
case 0:
|
|
@@ -35,9 +36,9 @@ export var loadAndAppendThemeCss = /*#__PURE__*/function () {
|
|
|
35
36
|
};
|
|
36
37
|
}();
|
|
37
38
|
export var loadThemeCss = /*#__PURE__*/function () {
|
|
38
|
-
var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2(themeId) {
|
|
39
|
+
var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2(themeId) {
|
|
39
40
|
var _yield$themeImportMap, themeCss;
|
|
40
|
-
return _regeneratorRuntime.wrap(function _callee2$(_context2) {
|
|
41
|
+
return _regeneratorRuntime().wrap(function _callee2$(_context2) {
|
|
41
42
|
while (1) {
|
|
42
43
|
switch (_context2.prev = _context2.next) {
|
|
43
44
|
case 0:
|
package/dist/esm/version.json
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import {
|
|
2
|
-
export declare const getGlobalTheme: () => Partial<
|
|
1
|
+
import { ActiveThemeState } from './set-global-theme';
|
|
2
|
+
export declare const getGlobalTheme: () => Partial<ActiveThemeState>;
|
|
@@ -7,6 +7,9 @@ export interface ThemeState {
|
|
|
7
7
|
spacing?: ThemeIds;
|
|
8
8
|
typography?: ThemeIds;
|
|
9
9
|
}
|
|
10
|
+
export interface ActiveThemeState extends ThemeState {
|
|
11
|
+
colorMode: Exclude<ThemeColorModes, 'auto'>;
|
|
12
|
+
}
|
|
10
13
|
/**
|
|
11
14
|
* Sets the theme globally at runtime. This updates the `data-theme` and `data-color-mode` attributes on your page's <html> tag.
|
|
12
15
|
*
|
|
@@ -23,7 +23,7 @@ export declare type ThemeKinds = 'color' | 'spacing' | 'typography' | 'shape';
|
|
|
23
23
|
*/
|
|
24
24
|
export declare const themeColorModes: readonly ["light", "dark", "auto"];
|
|
25
25
|
export declare type ThemeColorModes = typeof themeColorModes[number];
|
|
26
|
-
export declare type DataColorModes =
|
|
26
|
+
export declare type DataColorModes = Exclude<ThemeColorModes, 'auto'>;
|
|
27
27
|
/**
|
|
28
28
|
* Theme ids: The value that will be mounted to the DOM as a data attr
|
|
29
29
|
* For example: `data-theme="light:light dark:dark spacing:spacing"
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { ActiveThemeState } from './set-global-theme';
|
|
2
2
|
/**
|
|
3
3
|
* A MutationObserver which watches the `<html>` element for changes to the theme.
|
|
4
4
|
*
|
|
@@ -16,7 +16,7 @@ export declare class ThemeMutationObserver {
|
|
|
16
16
|
private callback;
|
|
17
17
|
observer: MutationObserver | null;
|
|
18
18
|
mediaObserver: any;
|
|
19
|
-
constructor(callback: (theme: Partial<
|
|
19
|
+
constructor(callback: (theme: Partial<ActiveThemeState>) => unknown);
|
|
20
20
|
observe(): void;
|
|
21
21
|
disconnect(): void;
|
|
22
22
|
}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { ActiveThemeState } from './set-global-theme';
|
|
2
2
|
/**
|
|
3
3
|
* A React hook which returns the current themes and color-mode set on `<html>`.
|
|
4
4
|
*
|
|
@@ -12,4 +12,4 @@ import { ThemeState } from './set-global-theme';
|
|
|
12
12
|
* }, [theme.colorMode]);
|
|
13
13
|
* ```
|
|
14
14
|
*/
|
|
15
|
-
export declare const useThemeObserver: () => Partial<
|
|
15
|
+
export declare const useThemeObserver: () => Partial<ActiveThemeState>;
|
package/package.json
CHANGED
package/report.api.md
CHANGED
|
@@ -17,6 +17,12 @@
|
|
|
17
17
|
```ts
|
|
18
18
|
import { UnbindFn } from 'bind-event-listener';
|
|
19
19
|
|
|
20
|
+
// @public (undocumented)
|
|
21
|
+
interface ActiveThemeState extends ThemeState {
|
|
22
|
+
// (undocumented)
|
|
23
|
+
colorMode: Exclude<ThemeColorModes, 'auto'>;
|
|
24
|
+
}
|
|
25
|
+
|
|
20
26
|
// @public
|
|
21
27
|
export type ActiveTokens =
|
|
22
28
|
| 'color.background.accent.blue.bolder'
|
|
@@ -825,7 +831,7 @@ type ExperimentalTokenState = 'experimental';
|
|
|
825
831
|
type ExtensionThemeId = ThemeIds;
|
|
826
832
|
|
|
827
833
|
// @public (undocumented)
|
|
828
|
-
export const getGlobalTheme: () => Partial<
|
|
834
|
+
export const getGlobalTheme: () => Partial<ActiveThemeState>;
|
|
829
835
|
|
|
830
836
|
// @public
|
|
831
837
|
export const getSSRAutoScript: (
|
|
@@ -1295,7 +1301,7 @@ type ThemeKinds = 'color' | 'shape' | 'spacing' | 'typography';
|
|
|
1295
1301
|
|
|
1296
1302
|
// @public
|
|
1297
1303
|
export class ThemeMutationObserver {
|
|
1298
|
-
constructor(callback: (theme: Partial<
|
|
1304
|
+
constructor(callback: (theme: Partial<ActiveThemeState>) => unknown);
|
|
1299
1305
|
// (undocumented)
|
|
1300
1306
|
disconnect(): void;
|
|
1301
1307
|
// (undocumented)
|
|
@@ -1712,7 +1718,7 @@ type TokenState =
|
|
|
1712
1718
|
| ExperimentalTokenState;
|
|
1713
1719
|
|
|
1714
1720
|
// @public
|
|
1715
|
-
export const useThemeObserver: () => Partial<
|
|
1721
|
+
export const useThemeObserver: () => Partial<ActiveThemeState>;
|
|
1716
1722
|
|
|
1717
1723
|
// (No @packageDocumentation comment for this package)
|
|
1718
1724
|
```
|
package/tmp/api-report-tmp.d.ts
CHANGED
|
@@ -6,6 +6,12 @@
|
|
|
6
6
|
|
|
7
7
|
import { UnbindFn } from 'bind-event-listener';
|
|
8
8
|
|
|
9
|
+
// @public (undocumented)
|
|
10
|
+
interface ActiveThemeState extends ThemeState {
|
|
11
|
+
// (undocumented)
|
|
12
|
+
colorMode: Exclude<ThemeColorModes, 'auto'>;
|
|
13
|
+
}
|
|
14
|
+
|
|
9
15
|
// @public
|
|
10
16
|
export type ActiveTokens = 'color.background.accent.blue.bolder' | 'color.background.accent.blue.subtle' | 'color.background.accent.blue.subtler' | 'color.background.accent.blue.subtlest' | 'color.background.accent.gray.bolder' | 'color.background.accent.gray.subtle' | 'color.background.accent.gray.subtler' | 'color.background.accent.gray.subtlest' | 'color.background.accent.green.bolder' | 'color.background.accent.green.subtle' | 'color.background.accent.green.subtler' | 'color.background.accent.green.subtlest' | 'color.background.accent.magenta.bolder' | 'color.background.accent.magenta.subtle' | 'color.background.accent.magenta.subtler' | 'color.background.accent.magenta.subtlest' | 'color.background.accent.orange.bolder' | 'color.background.accent.orange.subtle' | 'color.background.accent.orange.subtler' | 'color.background.accent.orange.subtlest' | 'color.background.accent.purple.bolder' | 'color.background.accent.purple.subtle' | 'color.background.accent.purple.subtler' | 'color.background.accent.purple.subtlest' | 'color.background.accent.red.bolder' | 'color.background.accent.red.subtle' | 'color.background.accent.red.subtler' | 'color.background.accent.red.subtlest' | 'color.background.accent.teal.bolder' | 'color.background.accent.teal.subtle' | 'color.background.accent.teal.subtler' | 'color.background.accent.teal.subtlest' | 'color.background.accent.yellow.bolder' | 'color.background.accent.yellow.subtle' | 'color.background.accent.yellow.subtler' | 'color.background.accent.yellow.subtlest' | 'color.background.brand.bold' | 'color.background.brand.bold.hovered' | 'color.background.brand.bold.pressed' | 'color.background.danger' | 'color.background.danger.bold' | 'color.background.danger.bold.hovered' | 'color.background.danger.bold.pressed' | 'color.background.danger.hovered' | 'color.background.danger.pressed' | 'color.background.disabled' | 'color.background.discovery' | 'color.background.discovery.bold' | 'color.background.discovery.bold.hovered' | 'color.background.discovery.bold.pressed' | 'color.background.discovery.hovered' | 'color.background.discovery.pressed' | 'color.background.information' | 'color.background.information.bold' | 'color.background.information.bold.hovered' | 'color.background.information.bold.pressed' | 'color.background.information.hovered' | 'color.background.information.pressed' | 'color.background.input' | 'color.background.input.hovered' | 'color.background.input.pressed' | 'color.background.inverse.subtle' | 'color.background.inverse.subtle.hovered' | 'color.background.inverse.subtle.pressed' | 'color.background.neutral' | 'color.background.neutral.bold' | 'color.background.neutral.bold.hovered' | 'color.background.neutral.bold.pressed' | 'color.background.neutral.hovered' | 'color.background.neutral.pressed' | 'color.background.neutral.subtle' | 'color.background.neutral.subtle.hovered' | 'color.background.neutral.subtle.pressed' | 'color.background.selected' | 'color.background.selected.bold' | 'color.background.selected.bold.hovered' | 'color.background.selected.bold.pressed' | 'color.background.selected.hovered' | 'color.background.selected.pressed' | 'color.background.success' | 'color.background.success.bold' | 'color.background.success.bold.hovered' | 'color.background.success.bold.pressed' | 'color.background.success.hovered' | 'color.background.success.pressed' | 'color.background.warning' | 'color.background.warning.bold' | 'color.background.warning.bold.hovered' | 'color.background.warning.bold.pressed' | 'color.background.warning.hovered' | 'color.background.warning.pressed' | 'color.blanket' | 'color.blanket.danger' | 'color.blanket.selected' | 'color.border' | 'color.border.accent.blue' | 'color.border.accent.gray' | 'color.border.accent.green' | 'color.border.accent.magenta' | 'color.border.accent.orange' | 'color.border.accent.purple' | 'color.border.accent.red' | 'color.border.accent.teal' | 'color.border.accent.yellow' | 'color.border.bold' | 'color.border.brand' | 'color.border.danger' | 'color.border.disabled' | 'color.border.discovery' | 'color.border.focused' | 'color.border.information' | 'color.border.input' | 'color.border.inverse' | 'color.border.selected' | 'color.border.success' | 'color.border.warning' | 'color.chart.blue.bold' | 'color.chart.blue.bold.hovered' | 'color.chart.blue.bolder' | 'color.chart.blue.bolder.hovered' | 'color.chart.blue.boldest' | 'color.chart.blue.boldest.hovered' | 'color.chart.brand' | 'color.chart.brand.hovered' | 'color.chart.categorical.1' | 'color.chart.categorical.1.hovered' | 'color.chart.categorical.2' | 'color.chart.categorical.2.hovered' | 'color.chart.categorical.3' | 'color.chart.categorical.3.hovered' | 'color.chart.categorical.4' | 'color.chart.categorical.4.hovered' | 'color.chart.categorical.5' | 'color.chart.categorical.5.hovered' | 'color.chart.categorical.6' | 'color.chart.categorical.6.hovered' | 'color.chart.categorical.7' | 'color.chart.categorical.7.hovered' | 'color.chart.categorical.8' | 'color.chart.categorical.8.hovered' | 'color.chart.danger' | 'color.chart.danger.bold' | 'color.chart.danger.bold.hovered' | 'color.chart.danger.hovered' | 'color.chart.discovery' | 'color.chart.discovery.bold' | 'color.chart.discovery.bold.hovered' | 'color.chart.discovery.hovered' | 'color.chart.gray.bold' | 'color.chart.gray.bold.hovered' | 'color.chart.gray.bolder' | 'color.chart.gray.bolder.hovered' | 'color.chart.gray.boldest' | 'color.chart.gray.boldest.hovered' | 'color.chart.green.bold' | 'color.chart.green.bold.hovered' | 'color.chart.green.bolder' | 'color.chart.green.bolder.hovered' | 'color.chart.green.boldest' | 'color.chart.green.boldest.hovered' | 'color.chart.information' | 'color.chart.information.bold' | 'color.chart.information.bold.hovered' | 'color.chart.information.hovered' | 'color.chart.magenta.bold' | 'color.chart.magenta.bold.hovered' | 'color.chart.magenta.bolder' | 'color.chart.magenta.bolder.hovered' | 'color.chart.magenta.boldest' | 'color.chart.magenta.boldest.hovered' | 'color.chart.neutral' | 'color.chart.neutral.hovered' | 'color.chart.orange.bold' | 'color.chart.orange.bold.hovered' | 'color.chart.orange.bolder' | 'color.chart.orange.bolder.hovered' | 'color.chart.orange.boldest' | 'color.chart.orange.boldest.hovered' | 'color.chart.purple.bold' | 'color.chart.purple.bold.hovered' | 'color.chart.purple.bolder' | 'color.chart.purple.bolder.hovered' | 'color.chart.purple.boldest' | 'color.chart.purple.boldest.hovered' | 'color.chart.red.bold' | 'color.chart.red.bold.hovered' | 'color.chart.red.bolder' | 'color.chart.red.bolder.hovered' | 'color.chart.red.boldest' | 'color.chart.red.boldest.hovered' | 'color.chart.success' | 'color.chart.success.bold' | 'color.chart.success.bold.hovered' | 'color.chart.success.hovered' | 'color.chart.teal.bold' | 'color.chart.teal.bold.hovered' | 'color.chart.teal.bolder' | 'color.chart.teal.bolder.hovered' | 'color.chart.teal.boldest' | 'color.chart.teal.boldest.hovered' | 'color.chart.warning' | 'color.chart.warning.bold' | 'color.chart.warning.bold.hovered' | 'color.chart.warning.hovered' | 'color.chart.yellow.bold' | 'color.chart.yellow.bold.hovered' | 'color.chart.yellow.bolder' | 'color.chart.yellow.bolder.hovered' | 'color.chart.yellow.boldest' | 'color.chart.yellow.boldest.hovered' | 'color.icon' | 'color.icon.accent.blue' | 'color.icon.accent.gray' | 'color.icon.accent.green' | 'color.icon.accent.magenta' | 'color.icon.accent.orange' | 'color.icon.accent.purple' | 'color.icon.accent.red' | 'color.icon.accent.teal' | 'color.icon.accent.yellow' | 'color.icon.brand' | 'color.icon.danger' | 'color.icon.disabled' | 'color.icon.discovery' | 'color.icon.information' | 'color.icon.inverse' | 'color.icon.selected' | 'color.icon.subtle' | 'color.icon.success' | 'color.icon.warning' | 'color.icon.warning.inverse' | 'color.interaction.hovered' | 'color.interaction.pressed' | 'color.link' | 'color.link.pressed' | 'color.skeleton' | 'color.skeleton.subtle' | 'color.text' | 'color.text.accent.blue' | 'color.text.accent.blue.bolder' | 'color.text.accent.gray' | 'color.text.accent.gray.bolder' | 'color.text.accent.green' | 'color.text.accent.green.bolder' | 'color.text.accent.magenta' | 'color.text.accent.magenta.bolder' | 'color.text.accent.orange' | 'color.text.accent.orange.bolder' | 'color.text.accent.purple' | 'color.text.accent.purple.bolder' | 'color.text.accent.red' | 'color.text.accent.red.bolder' | 'color.text.accent.teal' | 'color.text.accent.teal.bolder' | 'color.text.accent.yellow' | 'color.text.accent.yellow.bolder' | 'color.text.brand' | 'color.text.danger' | 'color.text.disabled' | 'color.text.discovery' | 'color.text.information' | 'color.text.inverse' | 'color.text.selected' | 'color.text.subtle' | 'color.text.subtlest' | 'color.text.success' | 'color.text.warning' | 'color.text.warning.inverse' | 'elevation.shadow.overflow' | 'elevation.shadow.overflow.perimeter' | 'elevation.shadow.overflow.spread' | 'elevation.shadow.overlay' | 'elevation.shadow.raised' | 'elevation.surface' | 'elevation.surface.hovered' | 'elevation.surface.overlay' | 'elevation.surface.overlay.hovered' | 'elevation.surface.overlay.pressed' | 'elevation.surface.pressed' | 'elevation.surface.raised' | 'elevation.surface.raised.hovered' | 'elevation.surface.raised.pressed' | 'elevation.surface.sunken' | 'font.family.monospace' | 'font.family.sans' | 'font.lineHeight.100' | 'font.lineHeight.200' | 'font.lineHeight.300' | 'font.lineHeight.400' | 'font.lineHeight.500' | 'font.lineHeight.600' | 'font.size.050' | 'font.size.075' | 'font.size.100' | 'font.size.200' | 'font.size.300' | 'font.size.400' | 'font.size.500' | 'font.size.600' | 'font.weight.bold' | 'font.weight.medium' | 'font.weight.regular' | 'font.weight.semibold' | 'opacity.disabled' | 'opacity.loading' | 'space.0' | 'space.025' | 'space.050' | 'space.075' | 'space.100' | 'space.1000' | 'space.150' | 'space.200' | 'space.250' | 'space.300' | 'space.400' | 'space.500' | 'space.600' | 'space.800' | 'utility.UNSAFE.transparent';
|
|
11
17
|
|
|
@@ -489,7 +495,7 @@ type ExperimentalTokenState = 'experimental';
|
|
|
489
495
|
type ExtensionThemeId = ThemeIds;
|
|
490
496
|
|
|
491
497
|
// @public (undocumented)
|
|
492
|
-
export const getGlobalTheme: () => Partial<
|
|
498
|
+
export const getGlobalTheme: () => Partial<ActiveThemeState>;
|
|
493
499
|
|
|
494
500
|
// @public
|
|
495
501
|
export const getSSRAutoScript: (colorMode: ThemeState['colorMode']) => string | undefined;
|
|
@@ -585,7 +591,7 @@ type ThemeKinds = 'color' | 'shape' | 'spacing' | 'typography';
|
|
|
585
591
|
|
|
586
592
|
// @public
|
|
587
593
|
export class ThemeMutationObserver {
|
|
588
|
-
constructor(callback: (theme: Partial<
|
|
594
|
+
constructor(callback: (theme: Partial<ActiveThemeState>) => unknown);
|
|
589
595
|
// (undocumented)
|
|
590
596
|
disconnect(): void;
|
|
591
597
|
// (undocumented)
|
|
@@ -988,7 +994,7 @@ type Tokens_2 = typeof tokens;
|
|
|
988
994
|
type TokenState = ActiveTokenState | DeletedTokenState | DeprecatedTokenState | ExperimentalTokenState;
|
|
989
995
|
|
|
990
996
|
// @public
|
|
991
|
-
export const useThemeObserver: () => Partial<
|
|
997
|
+
export const useThemeObserver: () => Partial<ActiveThemeState>;
|
|
992
998
|
|
|
993
999
|
// (No @packageDocumentation comment for this package)
|
|
994
1000
|
|