@splunk/themes 0.21.0 → 0.23.0

package/prisma/base.js

@@ -4,21 +4,16 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
-
 var _dataViz = _interopRequireDefault(require("./dataViz"));
-
 var _light = _interopRequireDefault(require("./light"));
-
 var _dark = _interopRequireDefault(require("./dark"));
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
-
-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; }
-
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
+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); }
+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; }
+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; }
+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; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
+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); }
 // eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types
 function createPrismaBase(_ref) {
   var colorScheme = _ref.colorScheme;
@@ -26,48 +21,48 @@ function createPrismaBase(_ref) {
     light: _light["default"],
     dark: _dark["default"]
   }[colorScheme];
+
   /**
    * ## Misc. colors
    *
    * @colorSet verbose
    */
-
   var usageColors = {
     focusColor: colorSchemeVars.interactiveColorPrimary,
     transparent: 'transparent',
     linkColor: colorSchemeVars.interactiveColorPrimary
   };
+
   /**
    * ## Interactive state shadows
    *
    * @shadowSet
    *
    */
-
   var shadows = {
     hoverShadow: "0 0 0 2px ".concat(colorSchemeVars.backgroundColorPage, ", 0 0 0 5px ").concat(colorSchemeVars.interactiveColorOverlayHover),
     focusShadow: "0 0 0 2px ".concat(colorSchemeVars.backgroundColorPage, ", 0 0 0 5px ").concat(usageColors.focusColor),
     focusShadowInset: "inset 0 0 0 3px ".concat(usageColors.focusColor)
   };
+
   /**
    * ## Borders
    *
    * @borderSet
    *
    */
-
   var borders = {
     activeBorder: "double ".concat(colorSchemeVars.interactiveColorBorderActive),
     borderColor: "".concat(colorSchemeVars.neutral200),
     borderColorWeak: "".concat(colorSchemeVars.neutral100),
     borderColorStrong: "".concat(colorSchemeVars.neutral300)
   };
+
   /**
    * ## Backgrounds
    *
    * @colorSet verbose
    */
-
   var backgrounds = {
     draggableBackground: "radial-gradient(circle at 1px 1px, ".concat(colorSchemeVars.contentColorMuted, ", ").concat(colorSchemeVars.contentColorMuted, " 1px, transparent 1px) 0 0 / 4px 6px")
   };
@@ -77,13 +72,13 @@ function createPrismaBase(_ref) {
    *
    * @valueSet
    */
-
   var fontFamily = {
     sansFontFamily: sansFontFamily,
     serifFontFamily: "Georgia, 'Times New Roman', Times, serif",
     monoFontFamily: "'Splunk Platform Mono', 'Roboto Mono', Consolas, 'Droid Sans Mono', Monaco, 'Courier New', Courier, monospace",
     fontFamily: sansFontFamily
   };
+
   /**
    * ## Font weights
    *
@@ -91,7 +86,6 @@ function createPrismaBase(_ref) {
    *
    * @valueSet
    */
-
   var fontWeights = {
     fontWeightLight: 300,
     fontWeightNormal: 400,
@@ -100,13 +94,13 @@ function createPrismaBase(_ref) {
     fontWeightHeavy: 800,
     fontWeightExtraBold: 900
   };
+
   /**
    * ## Layers
    * If a variable does not suit your purpose, set a value relatively, such as zindexModal +1.
    *
    * @valueSet
    */
-
   var zindexes = {
     zindexLayer: 1000,
     zindexFixedNavbar: 1030,
@@ -117,6 +111,5 @@ function createPrismaBase(_ref) {
   };
   return _objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread({}, fontFamily), fontWeights), usageColors), _dataViz["default"]), shadows), borders), backgrounds), zindexes);
 }
-
 var _default = createPrismaBase;
 exports["default"] = _default;

package/prisma/comfortable.js

@@ -4,7 +4,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
-
 /**
  * ## Measures
  * Spacing is used for margin on any element or padding on containers, but can be used for other

package/prisma/compact.js

@@ -4,7 +4,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
-
 /**
  * ## Measures
  * Spacing is used for margin on any element or padding on containers, but can be used for other

package/prisma/dark.js

@@ -4,19 +4,21 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
-
-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; }
-
+var _tinycolor = _interopRequireDefault(require("tinycolor2"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
+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); }
+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; }
+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; }
+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; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
+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); }
 /**
  * ## Background colors
  * Background colors should be used only for backgrounds of higher level sections & containers of a UI.
  *
  * @colorSet verbose
  */
+
 var backgroundColors = {
   backgroundColorPopup: '#27292e',
   backgroundColorSection: '#1a1c20',
@@ -27,6 +29,7 @@ var backgroundColors = {
   backgroundColorDialog: '#1e2024',
   backgroundColorScrim: 'rgba(0, 0, 0, 0.8)'
 };
+
 /**
  * ## Content colors
  * Content colors should be used for text, icons and dividers.
@@ -41,6 +44,7 @@ var contentColors = {
   contentColorInverted: '#000000',
   contentColorMuted: '#909090'
 };
+
 /**
  * ## Interactive colors
  * Interactive colors are specifically chosen for borders and backgrounds of controls and other interactive content.
@@ -63,6 +67,7 @@ var interactiveColors = {
   interactiveColorBackground: '#272a2f',
   interactiveColorBackgroundDisabled: 'rgba(255, 255, 255, 0.15)'
 };
+
 /**
  * ## Neutral colors
  * Neutrals are used for dividers and as backup colors that can sparingly be used for cases, when the other defined colors are not enough.
@@ -79,54 +84,66 @@ var neutralColors = {
   neutral500: '#acacad',
   white: '#ffffff'
 };
-/**
- * ## Accent colors
- * Accent colors aid and categorize the visual communication of the system response.
- *
- * @colorSet verbose
- */
 
-var accentColors = {
-  accentColorPositive: '#85f415',
-  accentColorWarning: '#f49106',
-  accentColorAlert: '#f0581f',
-  accentColorNegative: '#ff4242'
-};
 /**
  * ## Status colors
- * Status colors are reserved for communicating urgency and severity associated with data objects.
+ * Status colors are reserved for communicating urgency and severity associated with data objects and to categorize the visual communication of system responses.
  *
  * @colorSet verbose
  */
-
 var statusColors = {
   statusColorInfo: '#61cafa',
+  statusColorInfoWeak: (0, _tinycolor["default"])('#61cafa').darken(10).toHexString(),
+  statusColorInfoStrong: (0, _tinycolor["default"])('#61cafa').lighten(10).toHexString(),
   statusColorNormal: '#85f415',
+  statusColorNormalWeak: (0, _tinycolor["default"])('#85f415').darken(10).toHexString(),
+  statusColorNormalStrong: (0, _tinycolor["default"])('#85f415').lighten(10).toHexString(),
   statusColorLow: '#2cbda3',
+  statusColorLowWeak: (0, _tinycolor["default"])('#2cbda3').darken(10).toHexString(),
+  statusColorLowStrong: (0, _tinycolor["default"])('#2cbda3').lighten(10).toHexString(),
   statusColorMedium: '#f49106',
+  statusColorMediumWeak: (0, _tinycolor["default"])('#f49106').darken(10).toHexString(),
+  statusColorMediumStrong: (0, _tinycolor["default"])('#f49106').lighten(10).toHexString(),
   statusColorHigh: '#ff4242',
-  statusColorCritical: '#ff3361'
+  statusColorHighWeak: (0, _tinycolor["default"])('#ff4242').darken(10).toHexString(),
+  statusColorHighStrong: (0, _tinycolor["default"])('#ff4242').lighten(10).toHexString(),
+  statusColorCritical: '#ff3361',
+  statusColorCriticalWeak: (0, _tinycolor["default"])('#ff3361').darken(10).toHexString(),
+  statusColorCriticalStrong: (0, _tinycolor["default"])('#ff3361').lighten(10).toHexString()
 };
+
+/**
+ * ## Accent colors
+ * Accent colors aid and categorize the visual communication of the system response.
+ *
+ * @colorSet verbose
+ */
+var accentColors = {
+  accentColorPositive: statusColors.statusColorNormal,
+  accentColorWarning: statusColors.statusColorMedium,
+  accentColorAlert: '#f0581f',
+  accentColorNegative: statusColors.statusColorHigh
+};
+
 /**
  * ## Elevation shadows
  *
  * @shadowSet
  *
  */
-
 var elevationShadows = {
   embossShadow: '0px 1px 5px rgba(0, 0, 0, 0.35), 0px 0px 1px rgba(0, 0, 0, 0.35)',
   overlayShadow: '0px 26px 103px rgba(0, 0, 0, 0.64), 0px 11px 18px rgba(0, 0, 0, 0.32), 0px 3px 6px rgba(0, 0, 0, 0.3)',
   dragShadow: '0px 26px 103px rgba(0, 0, 0, 0.64), 0px 11px 18px rgba(0, 0, 0, 0.32), 0px 3px 6px rgba(0, 0, 0, 0.3)',
   modalShadow: '0px 50px 200px #000000, 0px 29px 66px rgba(0, 0, 0, 0.41), 0px 14px 47px rgba(0, 0, 0, 0.17), 0px 5px 10px rgba(0, 0, 0, 0.15)'
 };
+
 /**
  * ## Syntax colors
  * Syntax colors are used only for code blocks.
  *
  * @colorSet verbose alphabetical
  */
-
 var syntaxColors = {
   syntaxBlue: '#6cd0f0',
   syntaxBrown: '#fccf87',
@@ -138,8 +155,6 @@ var syntaxColors = {
   syntaxRed: '#e9627f',
   syntaxTeal: '#45d4ba'
 };
-
 var theme = _objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread({}, accentColors), statusColors), elevationShadows), backgroundColors), contentColors), neutralColors), interactiveColors), syntaxColors);
-
 var _default = theme;
 exports["default"] = _default;