@splunk/themes 0.22.0 → 0.24.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 +10 -0
- package/SplunkThemeProvider.js +18 -31
- package/enterprise/comfortable.js +0 -1
- package/enterprise/compact.js +0 -1
- package/enterprise/dark.js +10 -17
- package/enterprise/index.js +8 -16
- package/enterprise/light.js +24 -31
- package/enterprise/prismaAliases.js +3 -11
- package/getSettingsFromThemedProps.js +4 -8
- package/getTheme.js +13 -26
- package/index.js +1 -13
- package/mixins/index.js +8 -18
- package/mixins/tests/typography.unit.js +39 -85
- package/mixins/tests/utilityMixins.unit.js +2 -10
- package/mixins/typography.js +21 -52
- package/mixins/utilityMixins.js +11 -34
- package/package.json +20 -10
- package/pick.js +7 -18
- package/pickVariant.js +1 -7
- package/prisma/base.js +13 -20
- package/prisma/comfortable.js +0 -1
- package/prisma/compact.js +0 -1
- package/prisma/dark.js +15 -16
- package/prisma/dataViz.js +38 -49
- package/prisma/index.js +8 -16
- package/prisma/light.js +15 -16
- package/storybook-addon-splunk-themes/SplunkThemesTool.js +20 -42
- package/storybook-addon-splunk-themes/ThemedDocsContainer.js +3 -13
- package/storybook-addon-splunk-themes/index.js +0 -4
- package/storybook-addon-splunk-themes/manager.js +1 -7
- package/storybook-addon-splunk-themes/preview.js +4 -8
- package/storybook-addon-splunk-themes/tests/util.unit.js +0 -1
- package/storybook-addon-splunk-themes/themeOptions.js +0 -1
- package/storybook-addon-splunk-themes/themes.js +4 -15
- package/storybook-addon-splunk-themes/util.js +21 -39
- package/storybook-addon-splunk-themes/withSplunkTheme.js +27 -65
- package/useSplunkTheme.js +14 -22
- package/utils.js +25 -35
- package/variables.js +17 -31
- package/withSplunkTheme.js +26 -36
package/CHANGELOG.md
CHANGED
|
@@ -1,6 +1,16 @@
|
|
|
1
1
|
Change Log
|
|
2
2
|
============
|
|
3
3
|
|
|
4
|
+
0.24.0 - May 6, 2025
|
|
5
|
+
----------
|
|
6
|
+
Bug Fixes:
|
|
7
|
+
* Added `main` and `types` properties to package.json (SUI-7464).
|
|
8
|
+
|
|
9
|
+
0.23.0 - February 5, 2025
|
|
10
|
+
----------
|
|
11
|
+
Bug Fixes:
|
|
12
|
+
* Added peer dependencies needed to incorporate the themes package standalone (SUI-6874).
|
|
13
|
+
|
|
4
14
|
0.22.0 - October 1, 2024
|
|
5
15
|
----------
|
|
6
16
|
New Features:
|
package/SplunkThemeProvider.js
CHANGED
|
@@ -1,32 +1,22 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
function _typeof(
|
|
4
|
-
|
|
3
|
+
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
|
5
4
|
Object.defineProperty(exports, "__esModule", {
|
|
6
5
|
value: true
|
|
7
6
|
});
|
|
8
7
|
exports["default"] = SplunkThemeProvider;
|
|
9
|
-
|
|
10
8
|
var _react = _interopRequireWildcard(require("react"));
|
|
11
|
-
|
|
12
9
|
var _styledComponents = require("styled-components");
|
|
13
|
-
|
|
14
|
-
function
|
|
15
|
-
|
|
16
|
-
function
|
|
17
|
-
|
|
18
|
-
function
|
|
19
|
-
|
|
20
|
-
function
|
|
21
|
-
|
|
22
|
-
function
|
|
23
|
-
|
|
24
|
-
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
25
|
-
|
|
26
|
-
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
|
27
|
-
|
|
28
|
-
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
29
|
-
|
|
10
|
+
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
|
11
|
+
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) { if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } } return n["default"] = e, t && t.set(e, n), n; }
|
|
12
|
+
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) { ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } } return n; }, _extends.apply(null, arguments); }
|
|
13
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
14
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
15
|
+
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
|
|
16
|
+
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
|
|
17
|
+
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
|
18
|
+
function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var s = Object.getOwnPropertySymbols(e); for (r = 0; r < s.length; r++) { o = s[r], t.includes(o) || {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } } return i; }
|
|
19
|
+
function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) { if ({}.hasOwnProperty.call(r, n)) { if (e.includes(n)) continue; t[n] = r[n]; } } return t; }
|
|
30
20
|
/** SplunkThemeProvider defaults to `prisma` `dark` `comfortable`, unless the properties have already been set.
|
|
31
21
|
*
|
|
32
22
|
* For example, here the nested `SplunkThemeProvider` defaults to `enterprise` `light`:
|
|
@@ -42,16 +32,14 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
|
|
|
42
32
|
*/
|
|
43
33
|
function SplunkThemeProvider(_ref) {
|
|
44
34
|
var family = _ref.family,
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
35
|
+
colorScheme = _ref.colorScheme,
|
|
36
|
+
density = _ref.density,
|
|
37
|
+
additionalThemeProperties = _ref.additionalThemeProperties,
|
|
38
|
+
customizeTheme = _ref.customizeTheme,
|
|
39
|
+
otherProps = _objectWithoutProperties(_ref, ["family", "colorScheme", "density", "additionalThemeProperties", "customizeTheme"]);
|
|
51
40
|
var _ref2 = (0, _react.useContext)(_styledComponents.ThemeContext) || {},
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
41
|
+
_ref2$splunkThemeV = _ref2.splunkThemeV1,
|
|
42
|
+
splunkThemeV1 = _ref2$splunkThemeV === void 0 ? {} : _ref2$splunkThemeV;
|
|
55
43
|
var composedTheme = _objectSpread(_objectSpread({}, additionalThemeProperties), {}, {
|
|
56
44
|
splunkThemeV1: {
|
|
57
45
|
family: family || splunkThemeV1.family || 'prisma',
|
|
@@ -60,7 +48,6 @@ function SplunkThemeProvider(_ref) {
|
|
|
60
48
|
customizer: customizeTheme || splunkThemeV1.customizer
|
|
61
49
|
}
|
|
62
50
|
});
|
|
63
|
-
|
|
64
51
|
return /*#__PURE__*/_react["default"].createElement(_styledComponents.ThemeProvider, _extends({
|
|
65
52
|
theme: composedTheme
|
|
66
53
|
}, otherProps));
|
package/enterprise/compact.js
CHANGED
package/enterprise/dark.js
CHANGED
|
@@ -1,22 +1,18 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
+
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
|
3
4
|
Object.defineProperty(exports, "__esModule", {
|
|
4
5
|
value: true
|
|
5
6
|
});
|
|
6
7
|
exports["default"] = void 0;
|
|
7
|
-
|
|
8
8
|
var _light = _interopRequireDefault(require("./light"));
|
|
9
|
-
|
|
10
|
-
function
|
|
11
|
-
|
|
12
|
-
function
|
|
13
|
-
|
|
14
|
-
function
|
|
15
|
-
|
|
16
|
-
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
17
|
-
|
|
9
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
|
|
10
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
11
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
12
|
+
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
|
|
13
|
+
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
|
|
14
|
+
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
|
18
15
|
var dragHandleDark = "iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAA1SURBVHgB7dKhEQAgDAPAhHmwSKZHYtmHVtZVVNTkXS53UeG57yPYazLmrB8o6h8QgPqBOAOboRAPJUGIOAAAAABJRU5ErkJggg=="; // see babel-plugin-base64-png
|
|
19
|
-
|
|
20
16
|
var dark = {
|
|
21
17
|
backgroundColor: _light["default"].gray20,
|
|
22
18
|
backgroundColorHover: _light["default"].gray30,
|
|
@@ -35,13 +31,13 @@ var dark = {
|
|
|
35
31
|
focusShadowInset: "inset 0 0 1px 1px ".concat(_light["default"].gray25, ", inset 0 0 0 3px ").concat(_light["default"].focusColor),
|
|
36
32
|
draggableBackground: "url('data:image/png;base64,".concat(dragHandleDark, "') 0 0 / 8px 8px repeat")
|
|
37
33
|
};
|
|
34
|
+
|
|
38
35
|
/**
|
|
39
36
|
* ## Status colors
|
|
40
37
|
* Status colors are reserved for communicating urgency and severity associated with data objects and to categorize the visual communication of system responses.
|
|
41
38
|
*
|
|
42
39
|
* @colorSet verbose
|
|
43
40
|
*/
|
|
44
|
-
|
|
45
41
|
var statusColors = {
|
|
46
42
|
statusColorInfo: _light["default"].infoColorL10,
|
|
47
43
|
statusColorInfoWeak: _light["default"].infoColor,
|
|
@@ -62,13 +58,13 @@ var statusColors = {
|
|
|
62
58
|
statusColorCriticalWeak: _light["default"].errorColorD30,
|
|
63
59
|
statusColorCriticalStrong: _light["default"].errorColorD10
|
|
64
60
|
};
|
|
61
|
+
|
|
65
62
|
/**
|
|
66
63
|
* ## Syntax colors
|
|
67
64
|
* Syntax colors are used only for code blocks.
|
|
68
65
|
*
|
|
69
66
|
* @colorSet verbose alphabetical
|
|
70
67
|
*/
|
|
71
|
-
|
|
72
68
|
var syntaxColors = {
|
|
73
69
|
syntaxBlue: '#6cd0f0',
|
|
74
70
|
syntaxBrown: '#fccf87',
|
|
@@ -80,20 +76,17 @@ var syntaxColors = {
|
|
|
80
76
|
syntaxRed: '#fa94aa',
|
|
81
77
|
syntaxTeal: '#45d4ba'
|
|
82
78
|
};
|
|
79
|
+
|
|
83
80
|
/**
|
|
84
81
|
* ## Interactive borders
|
|
85
82
|
*
|
|
86
83
|
* @borderSet
|
|
87
84
|
*/
|
|
88
|
-
|
|
89
85
|
var bordersInteractive = {
|
|
90
86
|
activeBorder: "".concat(dark.borderActiveColor, " double")
|
|
91
87
|
};
|
|
92
|
-
|
|
93
88
|
var theme = _objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread({}, _light["default"]), dark), statusColors), syntaxColors), bordersInteractive), {}, {
|
|
94
89
|
borderLightColor: _light["default"].gray60 // @deprecated, SUI-5981
|
|
95
|
-
|
|
96
90
|
});
|
|
97
|
-
|
|
98
91
|
var _default = theme;
|
|
99
92
|
exports["default"] = _default;
|
package/enterprise/index.js
CHANGED
|
@@ -4,28 +4,21 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports["default"] = void 0;
|
|
7
|
-
|
|
8
7
|
var _light = _interopRequireDefault(require("./light"));
|
|
9
|
-
|
|
10
8
|
var _dark = _interopRequireDefault(require("./dark"));
|
|
11
|
-
|
|
12
9
|
var _compact = _interopRequireDefault(require("./compact"));
|
|
13
|
-
|
|
14
10
|
var _comfortable = _interopRequireDefault(require("./comfortable"));
|
|
15
|
-
|
|
16
11
|
var _prismaAliases = _interopRequireDefault(require("./prismaAliases"));
|
|
17
|
-
|
|
18
|
-
function
|
|
19
|
-
|
|
20
|
-
function
|
|
21
|
-
|
|
22
|
-
function
|
|
23
|
-
|
|
24
|
-
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
25
|
-
|
|
12
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
|
|
13
|
+
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
|
14
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
15
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
16
|
+
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
|
|
17
|
+
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
|
|
18
|
+
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
|
26
19
|
function createEnterpriseTheme(_ref) {
|
|
27
20
|
var colorScheme = _ref.colorScheme,
|
|
28
|
-
|
|
21
|
+
density = _ref.density;
|
|
29
22
|
var cs = {
|
|
30
23
|
light: _light["default"],
|
|
31
24
|
dark: _dark["default"]
|
|
@@ -40,6 +33,5 @@ function createEnterpriseTheme(_ref) {
|
|
|
40
33
|
});
|
|
41
34
|
return _objectSpread(_objectSpread(_objectSpread({}, cs), d), pa);
|
|
42
35
|
}
|
|
43
|
-
|
|
44
36
|
var _default = createEnterpriseTheme;
|
|
45
37
|
exports["default"] = _default;
|
package/enterprise/light.js
CHANGED
|
@@ -1,24 +1,21 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
+
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
|
3
4
|
Object.defineProperty(exports, "__esModule", {
|
|
4
5
|
value: true
|
|
5
6
|
});
|
|
6
7
|
exports["default"] = void 0;
|
|
7
|
-
|
|
8
|
-
function
|
|
9
|
-
|
|
10
|
-
function
|
|
11
|
-
|
|
12
|
-
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
13
|
-
|
|
8
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
9
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
10
|
+
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
|
|
11
|
+
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
|
|
12
|
+
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
|
14
13
|
var dragHandle = "iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAA2SURBVHgB7dKhEQAgDAPAhDnxDMAcDIBnT1pZV1FRk3e53EWFc+2P4N3DmLN+oKh/QADqB+IMUKEQD/CeueAAAAAASUVORK5CYII="; // see babel-plugin-base64-pngimport {
|
|
15
|
-
|
|
16
14
|
/**
|
|
17
15
|
* ## Brand colors
|
|
18
16
|
*
|
|
19
17
|
* @colorSet
|
|
20
18
|
*/
|
|
21
|
-
|
|
22
19
|
var brandColors = {
|
|
23
20
|
brandColorL50: '#f5fbf5',
|
|
24
21
|
brandColorL40: '#dff2df',
|
|
@@ -32,12 +29,12 @@ var brandColors = {
|
|
|
32
29
|
brandColorD40: '#307b30',
|
|
33
30
|
brandColorD50: '#286728'
|
|
34
31
|
};
|
|
32
|
+
|
|
35
33
|
/**
|
|
36
34
|
* ## Grayscale colors
|
|
37
35
|
*
|
|
38
36
|
* @colorSet
|
|
39
37
|
*/
|
|
40
|
-
|
|
41
38
|
var grays = {
|
|
42
39
|
white: '#ffffff',
|
|
43
40
|
gray98: '#f7f8fa',
|
|
@@ -52,12 +49,12 @@ var grays = {
|
|
|
52
49
|
gray20: '#171d21',
|
|
53
50
|
black: '#000000'
|
|
54
51
|
};
|
|
52
|
+
|
|
55
53
|
/**
|
|
56
54
|
* ## Accent colors
|
|
57
55
|
*
|
|
58
56
|
* @colorSet
|
|
59
57
|
*/
|
|
60
|
-
|
|
61
58
|
var accentColors = {
|
|
62
59
|
accentColorL50: '#ecf8ff',
|
|
63
60
|
accentColorL40: '#bfe9ff',
|
|
@@ -71,12 +68,12 @@ var accentColors = {
|
|
|
71
68
|
accentColorD40: '#004a71',
|
|
72
69
|
accentColorD50: '#003d5e'
|
|
73
70
|
};
|
|
71
|
+
|
|
74
72
|
/**
|
|
75
73
|
* ## Error Colors
|
|
76
74
|
*
|
|
77
75
|
* @colorSet
|
|
78
76
|
*/
|
|
79
|
-
|
|
80
77
|
var errorColors = {
|
|
81
78
|
errorColorL50: '#fcedec',
|
|
82
79
|
errorColorL40: '#f8dcd9',
|
|
@@ -90,12 +87,12 @@ var errorColors = {
|
|
|
90
87
|
errorColorD40: '#852d24',
|
|
91
88
|
errorColorD50: '#6f261d'
|
|
92
89
|
};
|
|
90
|
+
|
|
93
91
|
/**
|
|
94
92
|
* ## Alert colors
|
|
95
93
|
*
|
|
96
94
|
* @colorSet
|
|
97
95
|
* */
|
|
98
|
-
|
|
99
96
|
var alertColors = {
|
|
100
97
|
alertColorL50: '#fef3ec',
|
|
101
98
|
alertColorL40: '#fde6d9',
|
|
@@ -109,12 +106,12 @@ var alertColors = {
|
|
|
109
106
|
alertColorD40: '#914d1f',
|
|
110
107
|
alertColorD50: '#79401a'
|
|
111
108
|
};
|
|
109
|
+
|
|
112
110
|
/**
|
|
113
111
|
* ## Warning colors
|
|
114
112
|
*
|
|
115
113
|
* @colorSet
|
|
116
114
|
*/
|
|
117
|
-
|
|
118
115
|
var warningColors = {
|
|
119
116
|
warningColorL50: '#fff9eb',
|
|
120
117
|
warningColorL40: '#fef2d7',
|
|
@@ -128,12 +125,12 @@ var warningColors = {
|
|
|
128
125
|
warningColorD40: '#957312',
|
|
129
126
|
warningColorD50: '#7d600f'
|
|
130
127
|
};
|
|
128
|
+
|
|
131
129
|
/**
|
|
132
130
|
* ## Success colors
|
|
133
131
|
*
|
|
134
132
|
* @colorSet
|
|
135
133
|
*/
|
|
136
|
-
|
|
137
134
|
var successColors = {
|
|
138
135
|
successColorL50: '#eef6ee',
|
|
139
136
|
successColorL40: '#ddecdd',
|
|
@@ -147,12 +144,12 @@ var successColors = {
|
|
|
147
144
|
successColorD40: '#2f612e',
|
|
148
145
|
successColorD50: '#275126'
|
|
149
146
|
};
|
|
147
|
+
|
|
150
148
|
/**
|
|
151
149
|
* ## Info colors
|
|
152
150
|
*
|
|
153
151
|
* @colorSet
|
|
154
152
|
*/
|
|
155
|
-
|
|
156
153
|
var infoColors = {
|
|
157
154
|
infoColorL50: '#e5f0f5',
|
|
158
155
|
infoColorL40: '#cce2eb',
|
|
@@ -166,12 +163,12 @@ var infoColors = {
|
|
|
166
163
|
infoColorD40: '#00364d',
|
|
167
164
|
infoColorD50: '#002b3e'
|
|
168
165
|
};
|
|
166
|
+
|
|
169
167
|
/**
|
|
170
168
|
* ## Diverging colors
|
|
171
169
|
*
|
|
172
170
|
* @colorSet alphabetical
|
|
173
171
|
*/
|
|
174
|
-
|
|
175
172
|
var divergingColors = {
|
|
176
173
|
diverging1ColorA: '#006d9c',
|
|
177
174
|
diverging1ColorB: '#ec9960',
|
|
@@ -184,12 +181,12 @@ var divergingColors = {
|
|
|
184
181
|
diverging5ColorA: '#294e70',
|
|
185
182
|
diverging5ColorB: '#b6c75a'
|
|
186
183
|
};
|
|
184
|
+
|
|
187
185
|
/**
|
|
188
186
|
* ## Categorical Colors
|
|
189
187
|
*
|
|
190
188
|
* @colorSet alphabetical
|
|
191
189
|
*/
|
|
192
|
-
|
|
193
190
|
var categoricalColors = {
|
|
194
191
|
cat1Color: '#297ba5',
|
|
195
192
|
cat1ColorL: '#78b9d6',
|
|
@@ -252,12 +249,12 @@ var categoricalColors = {
|
|
|
252
249
|
cat30Color: '#184b81',
|
|
253
250
|
cat30ColorL: '#a4bbe0'
|
|
254
251
|
};
|
|
252
|
+
|
|
255
253
|
/**
|
|
256
254
|
* ## Usage-based colors
|
|
257
255
|
*
|
|
258
256
|
* @colorSet verbose
|
|
259
257
|
*/
|
|
260
|
-
|
|
261
258
|
var usageColors = {
|
|
262
259
|
textColor: grays.gray30,
|
|
263
260
|
textGray: '#6b7785',
|
|
@@ -273,13 +270,13 @@ var usageColors = {
|
|
|
273
270
|
backgroundColor: grays.white,
|
|
274
271
|
transparent: 'transparent'
|
|
275
272
|
};
|
|
273
|
+
|
|
276
274
|
/**
|
|
277
275
|
* ## Status colors
|
|
278
276
|
* Status colors are reserved for communicating urgency and severity associated with data objects and to categorize the visual communication of system responses.
|
|
279
277
|
*
|
|
280
278
|
* @colorSet verbose
|
|
281
279
|
*/
|
|
282
|
-
|
|
283
280
|
var statusColors = {
|
|
284
281
|
statusColorInfo: infoColors.infoColorL10,
|
|
285
282
|
statusColorInfoWeak: infoColors.infoColorL20,
|
|
@@ -300,13 +297,13 @@ var statusColors = {
|
|
|
300
297
|
statusColorCriticalWeak: errorColors.errorColorD30,
|
|
301
298
|
statusColorCriticalStrong: errorColors.errorColorD10
|
|
302
299
|
};
|
|
300
|
+
|
|
303
301
|
/**
|
|
304
302
|
* ## Syntax colors
|
|
305
303
|
* The following colors should only be used for syntax coloring of code.
|
|
306
304
|
*
|
|
307
305
|
* @colorSet verbose alphabetical
|
|
308
306
|
*/
|
|
309
|
-
|
|
310
307
|
var syntaxColors = {
|
|
311
308
|
syntaxBlue: '#006aa3',
|
|
312
309
|
syntaxBlueLight: '#006d9c',
|
|
@@ -322,41 +319,41 @@ var syntaxColors = {
|
|
|
322
319
|
syntaxRedLight: '#af575a',
|
|
323
320
|
syntaxTeal: '#1a7060'
|
|
324
321
|
};
|
|
322
|
+
|
|
325
323
|
/**
|
|
326
324
|
* ## Shadows
|
|
327
325
|
*
|
|
328
326
|
* @shadowSet
|
|
329
327
|
*/
|
|
330
|
-
|
|
331
328
|
var shadows = {
|
|
332
329
|
focusShadow: "0 0 1px 3px ".concat(usageColors.focusColor),
|
|
333
330
|
focusShadowInset: "inset 0 0 1px 1px ".concat(grays.white, ", inset 0 0 0 3px ").concat(usageColors.focusColor),
|
|
334
331
|
overlayShadow: '0 4px 8px rgba(0, 0, 0, 0.2)'
|
|
335
332
|
};
|
|
333
|
+
|
|
336
334
|
/**
|
|
337
335
|
* ## Interactive borders
|
|
338
336
|
*
|
|
339
337
|
* @borderSet
|
|
340
338
|
*/
|
|
341
|
-
|
|
342
339
|
var bordersInteractive = {
|
|
343
340
|
activeBorder: "".concat(usageColors.borderActiveColor, " double")
|
|
344
341
|
};
|
|
342
|
+
|
|
345
343
|
/**
|
|
346
344
|
* ## Backgrounds
|
|
347
345
|
*
|
|
348
346
|
* @colorSet verbose
|
|
349
347
|
*/
|
|
350
|
-
|
|
351
348
|
var backgrounds = {
|
|
352
349
|
draggableBackground: "url('data:image/png;base64,".concat(dragHandle, "') 0 0 / 8px 8px repeat")
|
|
353
350
|
};
|
|
351
|
+
|
|
354
352
|
/**
|
|
355
353
|
* ## Border
|
|
356
354
|
*
|
|
357
355
|
* @valueSet
|
|
358
356
|
*/
|
|
359
|
-
|
|
360
357
|
var borders = {
|
|
361
358
|
border: "1px solid ".concat(usageColors.borderColor)
|
|
362
359
|
};
|
|
@@ -366,13 +363,13 @@ var sansFontFamily = "'Splunk Platform Sans', 'Proxima Nova', Roboto, Droid, 'He
|
|
|
366
363
|
*
|
|
367
364
|
* @valueSet
|
|
368
365
|
*/
|
|
369
|
-
|
|
370
366
|
var fontFamily = {
|
|
371
367
|
sansFontFamily: sansFontFamily,
|
|
372
368
|
serifFontFamily: "Georgia, 'Times New Roman', Times, serif",
|
|
373
369
|
monoFontFamily: "'Splunk Platform Mono', Inconsolata, Consolas, 'Droid Sans Mono', Monaco, 'Courier New', Courier, monospace",
|
|
374
370
|
fontFamily: sansFontFamily
|
|
375
371
|
};
|
|
372
|
+
|
|
376
373
|
/**
|
|
377
374
|
* ## Font weights
|
|
378
375
|
*
|
|
@@ -380,7 +377,6 @@ var fontFamily = {
|
|
|
380
377
|
*
|
|
381
378
|
* @valueSet
|
|
382
379
|
*/
|
|
383
|
-
|
|
384
380
|
var fontWeights = {
|
|
385
381
|
fontWeightLight: 300,
|
|
386
382
|
fontWeightNormal: 400,
|
|
@@ -389,13 +385,13 @@ var fontWeights = {
|
|
|
389
385
|
fontWeightHeavy: 800,
|
|
390
386
|
fontWeightExtraBold: 900
|
|
391
387
|
};
|
|
388
|
+
|
|
392
389
|
/**
|
|
393
390
|
* ## Layers
|
|
394
391
|
* If a variable does not suit your purpose, set a value relatively, such as zindexModal +1.
|
|
395
392
|
*
|
|
396
393
|
* @valueSet
|
|
397
394
|
*/
|
|
398
|
-
|
|
399
395
|
var zindexes = {
|
|
400
396
|
zindexLayer: 1000,
|
|
401
397
|
zindexFixedNavbar: 1030,
|
|
@@ -404,11 +400,8 @@ var zindexes = {
|
|
|
404
400
|
zindexPopover: 1060,
|
|
405
401
|
zindexToastMessages: 2000
|
|
406
402
|
};
|
|
407
|
-
|
|
408
403
|
var theme = _objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread({}, brandColors), grays), accentColors), errorColors), alertColors), warningColors), successColors), infoColors), categoricalColors), divergingColors), statusColors), syntaxColors), fontFamily), fontWeights), usageColors), backgrounds), shadows), bordersInteractive), borders), zindexes), {}, {
|
|
409
404
|
borderLightColor: grays.gray92 // @deprecated SUI-5981
|
|
410
|
-
|
|
411
405
|
});
|
|
412
|
-
|
|
413
406
|
var _default = theme;
|
|
414
407
|
exports["default"] = _default;
|
|
@@ -4,23 +4,16 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports["default"] = void 0;
|
|
7
|
-
|
|
8
7
|
var _tinycolor = _interopRequireDefault(require("tinycolor2"));
|
|
9
|
-
|
|
10
8
|
var _light = _interopRequireDefault(require("./light"));
|
|
11
|
-
|
|
12
9
|
var _dark = _interopRequireDefault(require("./dark"));
|
|
13
|
-
|
|
14
10
|
var _compact = _interopRequireDefault(require("./compact"));
|
|
15
|
-
|
|
16
11
|
var _comfortable = _interopRequireDefault(require("./comfortable"));
|
|
17
|
-
|
|
18
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
19
|
-
|
|
12
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
|
|
20
13
|
// eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types
|
|
21
14
|
function createPrismaAliases(_ref) {
|
|
22
15
|
var colorScheme = _ref.colorScheme,
|
|
23
|
-
|
|
16
|
+
density = _ref.density;
|
|
24
17
|
var cs = {
|
|
25
18
|
light: _light["default"],
|
|
26
19
|
dark: _dark["default"]
|
|
@@ -29,6 +22,7 @@ function createPrismaAliases(_ref) {
|
|
|
29
22
|
compact: _compact["default"],
|
|
30
23
|
comfortable: _comfortable["default"]
|
|
31
24
|
}[density];
|
|
25
|
+
|
|
32
26
|
/**
|
|
33
27
|
* # Prisma Aliases
|
|
34
28
|
* The following aliases for prisma variables are provided for convenience. Just because an alias is provided,
|
|
@@ -55,7 +49,6 @@ function createPrismaAliases(_ref) {
|
|
|
55
49
|
*
|
|
56
50
|
* @valueSet
|
|
57
51
|
*/
|
|
58
|
-
|
|
59
52
|
var prismaAliases = {
|
|
60
53
|
accentColorPositive: cs.successColor,
|
|
61
54
|
accentColorWarning: cs.warningColor,
|
|
@@ -98,6 +91,5 @@ function createPrismaAliases(_ref) {
|
|
|
98
91
|
};
|
|
99
92
|
return prismaAliases;
|
|
100
93
|
}
|
|
101
|
-
|
|
102
94
|
var _default = createPrismaAliases;
|
|
103
95
|
exports["default"] = _default;
|
|
@@ -4,9 +4,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports["default"] = void 0;
|
|
7
|
-
|
|
8
7
|
var _utils = require("./utils");
|
|
9
|
-
|
|
10
8
|
/**
|
|
11
9
|
* The theme settings in `props.theme` are not considered an API to allow support for fallbacks
|
|
12
10
|
* and forward compatibility in future versions of `SplunkThemeProvider`. Use this utility to
|
|
@@ -23,21 +21,19 @@ var _utils = require("./utils");
|
|
|
23
21
|
* @returns {object} An object consisting of `{ family, colorScheme, density }`.
|
|
24
22
|
* @public
|
|
25
23
|
*/
|
|
24
|
+
|
|
26
25
|
function getSettingsFromThemedProps(props) {
|
|
27
26
|
var _props$theme;
|
|
28
|
-
|
|
29
27
|
// props.theme is sometimes null
|
|
30
28
|
var _ref = ((_props$theme = props.theme) === null || _props$theme === void 0 ? void 0 : _props$theme.splunkThemeV1) || {},
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
29
|
+
family = _ref.family,
|
|
30
|
+
colorScheme = _ref.colorScheme,
|
|
31
|
+
density = _ref.density;
|
|
35
32
|
return (0, _utils.addThemeDefaults)({
|
|
36
33
|
family: family,
|
|
37
34
|
colorScheme: colorScheme,
|
|
38
35
|
density: density
|
|
39
36
|
});
|
|
40
37
|
}
|
|
41
|
-
|
|
42
38
|
var _default = getSettingsFromThemedProps;
|
|
43
39
|
exports["default"] = _default;
|