@splunk/themes 1.4.0 → 1.5.0

package/design-tokens/deprecated.js

@@ -10,319 +10,509 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 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); }
+/*
+@splunk/eslint-plugin-splunk-ui/design-token-deprecatedrule auto-fixes tokens
+where the deprecation message is exactly "Use `replacementToken`".
+*/
+
 /**
  * #### Deprecated tokens
  *
- * @categoryValue
+ * @category color
+ * @previewType none
  */
 var deprecated = {
+  /** @deprecated */
   contentColorInfo: '',
+  /** @deprecated */
   contentColorWarning: '',
+  /** @deprecated */
   contentColorPositive: '',
+  /** @deprecated */
   contentColorNegativeStrong: '',
   /**
-   * Use a more specific token based on the semantic use case:
-   * [`interactiveColorAccent`](#interactiveColorAccent), [`contentColorAccent`](#contentColorAccent), or [`focusColor`](#focusColor).
+   * @deprecated  Use a more specific token based on the semantic use case: [`interactiveColorAccent`](#interactiveColorAccent), [`contentColorAccent`](#contentColorAccent), or [`focusColor`](#focusColor).
    */
   interactiveColorPrimary: '',
   /**
-   * Use `statusColorNormal`, `accentColor`, or ...
+   * @deprecated Use `statusColorNormal`, `accentColor`, or ...
    */
   accentColorPositive: '',
+  /** @deprecated */
   accentColorWarning: '',
+  /** @deprecated */
   accentColorAlert: '',
+  /** @deprecated */
   accentColorNegative: '',
   /**
-   * Use `contentColorDefault`
+   * @deprecated Use `contentColorDefault`
    */
   textColor: '',
   /**
-   * Use `contentColorMuted`
+   * @deprecated Use `contentColorMuted`
    */
   textGray: '',
   /**
-   * Use [`contentColorLink`](#contentColorLink) instead.
+   * @deprecated Use [`contentColorLink`](#contentColorLink) instead.
    */
   linkColor: '',
   /**
-   * `Link` hover interaction should use `text-decoration: underline`, color should not change
+   * @deprecated `Link` hover interaction should use `text-decoration: underline`, color should not change
    */
   linkColorHover: '',
   /**
-   * Use `borderColorWeak`
+   * @deprecated Use `borderColorWeak`
    */
   borderLightColor: '',
   /**
-   * Use `contentColorDisabled`
+   * @deprecated Use `contentColorDisabled`
    */
   textDisabledColor: '',
   /**
-   * Use `spacingXSmall`
+   * @deprecated Use `spacingXSmall`
+   * @category dimension
+   * @previewType spacing
    */
   spacingQuarter: '',
   /**
-   * Use `spacingSmall`
+   * @deprecated Use `spacingSmall`
+   * @category dimension
+   * @previewType spacing
    */
   spacingHalf: '',
   /**
-   * Use `spacingLarge`
+   * @deprecated Use `spacingLarge`
+   * @category dimension
+   * @previewType spacing
    */
   spacing: '',
   /**
-   * Use `backgroundColorPage`
+   * @deprecated Use `backgroundColorPage`
    */
   backgroundColor: '',
   /**
-   * Set border using CSS and [borderColor](#borderColor).
+   * @category border
+   * @deprecated Set border using CSS and [borderColor](#borderColor).
    */
   border: '',
   /**
-   * Set border using CSS and [borderColorStrong](#borderColorStrong).
+   * @category border
+   * @deprecated Set border using CSS and [borderColorStrong](#borderColorStrong).
    */
   borderDark: '',
   /**
-   * Set border using CSS and [borderColorWeak](#borderColorWeak).
+   * @category border
+   * @deprecated Set border using CSS and [borderColorWeak](#borderColorWeak).
    */
   borderLight: '',
   /**
-   * Use `interactiveColorBorderActive` for Data Entry components or `actionColorBorderSecondaryActive` for Buttons.
+   * @deprecated Use `interactiveColorBorderActive` for Data Entry components or `actionColorBorderSecondaryActive` for Buttons.
    */
   borderActiveColor: '',
   /**
-   * Use `interactiveColorOverlayHover` for Data Entry components or `actionColorBackgroundSecondaryHover` for Buttons.
+   * @deprecated Use `interactiveColorOverlayHover` for Data Entry components or `actionColorBackgroundSecondaryHover` for Buttons.
    */
   backgroundColorHover: '',
   /**
-   * Don't use hover shadows - see notes on backgroundColorHover for hover affordances.
+   * @category shadow
+   * @deprecated Don't use hover shadows - see notes on backgroundColorHover for hover affordances.
    */
   hoverShadow: '',
   /**
-   *  Use `notificationColorInfo` or `severityColorInfo`
+   * @deprecated Use `notificationColorInfo` or `severityColorInfo`
    */
   statusColorInfo: '',
   /**
-   *  Use `notificationColorInfoWeak`
+   * @deprecated Use `notificationColorInfoWeak`
    */
   statusColorInfoWeak: '',
   /**
-   *  Use `notificationColorInfoStrong`
+   * @deprecated Use `notificationColorInfoStrong`
    */
   statusColorInfoStrong: '',
   /**
-   * Use `notificationColorPositive` or `severityColorNormal`
+   * @deprecated Use `notificationColorPositive` or `severityColorNormal`
    */
   statusColorNormal: '',
   /**
-   * Use `notificationColorPositiveWeak`
+   * @deprecated Use `notificationColorPositiveWeak`
    */
   statusColorNormalWeak: '',
   /**
-   * Use `notificationColorPositiveStrong`
+   * @deprecated Use `notificationColorPositiveStrong`
    */
   statusColorNormalStrong: '',
   /**
-   * Use `notificationColorCaution` or `severityColorNotice`
+   * @deprecated Use `notificationColorCaution` or `severityColorNotice`
    */
   statusColorLow: '',
   /**
-   * Use `notificationColorCautionWeak`
+   * @deprecated Use `notificationColorCautionWeak`
    */
   statusColorLowWeak: '',
   /**
-   * Use `notificationColorCautionStrong`
+   * @deprecated Use `notificationColorCautionStrong`
    */
   statusColorLowStrong: '',
   /**
-   * Use `severityColorWarning`
+   * @deprecated Use `severityColorWarning`
    */
   statusColorMedium: '',
+  /** @deprecated */
   statusColorMediumWeak: '',
+  /** @deprecated */
   statusColorMediumStrong: '',
   /**
-   * Use `notificationColorNegative` or `severityColorAlert`
+   * @deprecated Use `notificationColorNegative` or `severityColorAlert`
    */
   statusColorHigh: '',
   /**
-   * Use `notificationColorNegativeWeak`
+   * @deprecated Use `notificationColorNegativeWeak`
    */
   statusColorHighWeak: '',
   /**
-   * Use `notificationColorNegativeStrong`
+   * @deprecated Use `notificationColorNegativeStrong`
    */
   statusColorHighStrong: '',
   /**
-   * Default color for critical alerts or urgent messages.
+   * @deprecated Default color for critical alerts or urgent messages.
    */
   statusColorCritical: '',
   /**
-   * Weaker, less prominent critical color, does not pass 3:1 graphical or 4.5:1 text contrast.
+   * @deprecated Weaker, less prominent critical color, does not pass 3:1 graphical or 4.5:1 text contrast.
    */
   statusColorCriticalWeak: '',
   /**
-   * Brighter, more prominent critical color.
+   * @deprecated Brighter, more prominent critical color.
    */
   statusColorCriticalStrong: '',
+  /** @deprecated */
   brandColorL50: '',
+  /** @deprecated */
   brandColorL40: '',
+  /** @deprecated */
   brandColorL30: '',
+  /** @deprecated */
   brandColorL20: '',
+  /** @deprecated */
   brandColorL10: '',
+  /** @deprecated */
   brandColor: '',
+  /** @deprecated */
   brandColorD10: '',
+  /** @deprecated */
   brandColorD20: '',
+  /** @deprecated */
   brandColorD30: '',
+  /** @deprecated */
   brandColorD40: '',
+  /** @deprecated */
   brandColorD50: '',
+  /** @deprecated */
   gray98: '',
+  /** @deprecated */
   gray96: '',
+  /** @deprecated */
   gray92: '',
+  /** @deprecated */
   gray80: '',
+  /** @deprecated */
   gray60: '',
+  /** @deprecated */
   gray45: '',
+  /** @deprecated */
   gray30: '',
+  /** @deprecated */
   gray25: '',
+  /** @deprecated */
   gray22: '',
+  /** @deprecated */
   gray20: '',
+  /** @deprecated */
   accentColorL50: '',
+  /** @deprecated */
   accentColorL40: '',
+  /** @deprecated */
   accentColorL30: '',
+  /** @deprecated */
   accentColorL20: '',
+  /** @deprecated */
   accentColorL10: '',
+  /** @deprecated */
   accentColor: '',
+  /** @deprecated */
   accentColorD10: '',
+  /** @deprecated */
   accentColorD20: '',
+  /** @deprecated */
   accentColorD30: '',
+  /** @deprecated */
   accentColorD40: '',
+  /** @deprecated */
   accentColorD50: '',
+  /** @deprecated */
   errorColorL50: '',
+  /** @deprecated */
   errorColorL40: '',
+  /** @deprecated */
   errorColorL30: '',
+  /** @deprecated */
   errorColorL20: '',
+  /** @deprecated */
   errorColorL10: '',
+  /** @deprecated */
   errorColor: '',
+  /** @deprecated */
   errorColorD10: '',
+  /** @deprecated */
   errorColorD20: '',
+  /** @deprecated */
   errorColorD30: '',
+  /** @deprecated */
   errorColorD40: '',
+  /** @deprecated */
   errorColorD50: '',
+  /** @deprecated */
   alertColorL50: '',
+  /** @deprecated */
   alertColorL40: '',
+  /** @deprecated */
   alertColorL30: '',
+  /** @deprecated */
   alertColorL20: '',
+  /** @deprecated */
   alertColorL10: '',
+  /** @deprecated */
   alertColor: '',
+  /** @deprecated */
   alertColorD10: '',
+  /** @deprecated */
   alertColorD20: '',
+  /** @deprecated */
   alertColorD30: '',
+  /** @deprecated */
   alertColorD40: '',
+  /** @deprecated */
   alertColorD50: '',
+  /** @deprecated */
   warningColorL50: '',
+  /** @deprecated */
   warningColorL40: '',
+  /** @deprecated */
   warningColorL30: '',
+  /** @deprecated */
   warningColorL20: '',
+  /** @deprecated */
   warningColorL10: '',
+  /** @deprecated */
   warningColor: '',
+  /** @deprecated */
   warningColorD10: '',
+  /** @deprecated */
   warningColorD20: '',
+  /** @deprecated */
   warningColorD30: '',
+  /** @deprecated */
   warningColorD40: '',
+  /** @deprecated */
   warningColorD50: '',
+  /** @deprecated */
   successColorL50: '',
+  /** @deprecated */
   successColorL40: '',
+  /** @deprecated */
   successColorL30: '',
+  /** @deprecated */
   successColorL20: '',
+  /** @deprecated */
   successColorL10: '',
+  /** @deprecated */
   successColor: '',
+  /** @deprecated */
   successColorD10: '',
+  /** @deprecated */
   successColorD20: '',
+  /** @deprecated */
   successColorD30: '',
+  /** @deprecated */
   successColorD40: '',
+  /** @deprecated */
   successColorD50: '',
+  /** @deprecated */
   infoColorL50: '',
+  /** @deprecated */
   infoColorL40: '',
+  /** @deprecated */
   infoColorL30: '',
+  /** @deprecated */
   infoColorL20: '',
+  /** @deprecated */
   infoColorL10: '',
+  /** @deprecated */
   infoColor: '',
+  /** @deprecated */
   infoColorD10: '',
+  /** @deprecated */
   infoColorD20: '',
+  /** @deprecated */
   infoColorD30: '',
+  /** @deprecated */
   infoColorD40: '',
+  /** @deprecated */
   infoColorD50: '',
+  /** @deprecated */
   diverging1ColorA: '',
+  /** @deprecated */
   diverging1ColorB: '',
+  /** @deprecated */
   diverging2ColorA: '',
+  /** @deprecated */
   diverging2ColorB: '',
+  /** @deprecated */
   diverging3ColorA: '',
+  /** @deprecated */
   diverging3ColorB: '',
+  /** @deprecated */
   diverging4ColorA: '',
+  /** @deprecated */
   diverging4ColorB: '',
+  /** @deprecated */
   diverging5ColorA: '',
+  /** @deprecated */
   diverging5ColorB: '',
+  /** @deprecated */
   cat1Color: '',
+  /** @deprecated */
   cat1ColorL: '',
+  /** @deprecated */
   cat2Color: '',
+  /** @deprecated */
   cat2ColorL: '',
+  /** @deprecated */
   cat3Color: '',
+  /** @deprecated */
   cat3ColorL: '',
+  /** @deprecated */
   cat4Color: '',
+  /** @deprecated */
   cat4ColorL: '',
+  /** @deprecated */
   cat5Color: '',
+  /** @deprecated */
   cat5ColorL: '',
+  /** @deprecated */
   cat6Color: '',
+  /** @deprecated */
   cat6ColorL: '',
+  /** @deprecated */
   cat7Color: '',
+  /** @deprecated */
   cat7ColorL: '',
+  /** @deprecated */
   cat8Color: '',
+  /** @deprecated */
   cat8ColorL: '',
+  /** @deprecated */
   cat9Color: '',
+  /** @deprecated */
   cat9ColorL: '',
+  /** @deprecated */
   cat10Color: '',
+  /** @deprecated */
   cat10ColorL: '',
+  /** @deprecated */
   cat11Color: '',
+  /** @deprecated */
   cat11ColorL: '',
+  /** @deprecated */
   cat12Color: '',
+  /** @deprecated */
   cat12ColorL: '',
+  /** @deprecated */
   cat13Color: '',
+  /** @deprecated */
   cat13ColorL: '',
+  /** @deprecated */
   cat14Color: '',
+  /** @deprecated */
   cat14ColorL: '',
+  /** @deprecated */
   cat15Color: '',
+  /** @deprecated */
   cat15ColorL: '',
+  /** @deprecated */
   cat16Color: '',
+  /** @deprecated */
   cat16ColorL: '',
+  /** @deprecated */
   cat17Color: '',
+  /** @deprecated */
   cat17ColorL: '',
+  /** @deprecated */
   cat18Color: '',
+  /** @deprecated */
   cat18ColorL: '',
+  /** @deprecated */
   cat19Color: '',
+  /** @deprecated */
   cat19ColorL: '',
+  /** @deprecated */
   cat20Color: '',
+  /** @deprecated */
   cat20ColorL: '',
+  /** @deprecated */
   cat21Color: '',
+  /** @deprecated */
   cat21ColorL: '',
+  /** @deprecated */
   cat22Color: '',
+  /** @deprecated */
   cat22ColorL: '',
+  /** @deprecated */
   cat23Color: '',
+  /** @deprecated */
   cat23ColorL: '',
+  /** @deprecated */
   cat24Color: '',
+  /** @deprecated */
   cat24ColorL: '',
+  /** @deprecated */
   cat25Color: '',
+  /** @deprecated */
   cat25ColorL: '',
+  /** @deprecated */
   cat26Color: '',
+  /** @deprecated */
   cat26ColorL: '',
+  /** @deprecated */
   cat27Color: '',
+  /** @deprecated */
   cat27ColorL: '',
+  /** @deprecated */
   cat28Color: '',
+  /** @deprecated */
   cat28ColorL: '',
+  /** @deprecated */
   cat29Color: '',
+  /** @deprecated */
   cat29ColorL: '',
+  /** @deprecated */
   cat30Color: '',
+  /** @deprecated */
   cat30ColorL: '',
+  /** @deprecated */
   syntaxBlueLight: '',
+  /** @deprecated */
   syntaxGreenLight: '',
+  /** @deprecated */
   syntaxPurpleLight: '',
-  syntaxRedLight: ''
+  /** @deprecated */
+  syntaxRedLight: '',
+  /**
+   * @deprecated
+   * @category gradient
+   */
+  draggableBackground: ''
 };
 var _default = _objectSpread({}, deprecated);
 exports["default"] = _default;

package/design-tokens/elevation.js

@@ -15,7 +15,7 @@ function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e
  * Used to position elements in the z-axis.
  * If a variable does not suit your purpose, set a value relatively, such as `zindexModal +1`.
  *
- * @categoryValue
+ * @category number
  */
 var zIndexes = {
   zindexLayer: 1000,
@@ -29,7 +29,7 @@ var zIndexes = {
 /**
  * #### Shadows
  *
- * @categoryShadow
+ * @category shadow
  */
 var elevationShadows = {
   embossShadow: ' ',
@@ -37,8 +37,7 @@ var elevationShadows = {
   dragShadow: '',
   modalShadow: '',
   focusShadow: '',
-  focusShadowInset: '',
-  draggableBackground: ''
+  focusShadowInset: ''
 };
 var elevation = _objectSpread(_objectSpread({}, zIndexes), elevationShadows);
 var _default = elevation;

package/design-tokens/spacing-sizing.js

@@ -18,7 +18,8 @@ function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e
  * Just because a spacing token is equal to a pixel value you may need, it does not mean it's appropriate to
  * use the spacing variables.
  *
- * @categorySpacing
+ * @category dimension
+ * @previewType spacing
  */
 var spacing = {
   spacingXSmall: '4px',
@@ -33,7 +34,8 @@ var spacing = {
 /**
  * #### Measures
  *
- * @categoryValue
+ * @category dimension
+ * @previewType spacing
  */
 var measures = {
   borderRadius: '',

package/design-tokens/typography.js

@@ -13,7 +13,7 @@ function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e
 /**
  * #### Font family
  *
- * @categoryFont
+ * @category fontFamily
  */
 var fontFamily = {
   fontFamily: '',
@@ -29,7 +29,7 @@ var fontFamily = {
 /**
  * #### Font weight
  *
- * @categoryFont
+ * @category fontWeight
  */
 var fontWeight = {
   fontWeightLight: 300,
@@ -43,7 +43,8 @@ var fontWeight = {
 /**
  * #### Font size
  *
- * @categoryFont
+ * @category dimension
+ * @previewType font
  */
 var fontSize = {
   fontSizeSmall: '',
@@ -56,14 +57,23 @@ var fontSize = {
 /**
  * #### Font measures
  *
- * @categoryValue
+ * @category number
  */
 var fontMeasures = {
   /**
    * Use to improve readability and [accessibility](https://www.w3.org/WAI/WCAG21/Understanding/visual-presentation.html)
    * in blocks of text by preventing overly long lines.
+   *
+   * @category dimension
+   * @previewType none
    */
   lineLength: '',
+  /**
+   * Minimum line length for optimal readability.
+   * @category dimension
+   * @previewType none
+   */
+  lineLengthMinimum: '',
   /**
    * Default line height.
    */

package/enterprise/dark.js

@@ -148,12 +148,9 @@ var backgroundColors = {
   backgroundColorPage: _light["default"].gray20,
   backgroundColorPopup: _light["default"].gray22,
   backgroundColorScrim: "rgba(0, 0, 0, 0.8)",
-  backgroundColorSection: _light["default"].gray22,
+  backgroundColorSection: '#1E2427',
   backgroundColorSidebar: _light["default"].black
 };
-var backgrounds = {
-  draggableBackground: "url('data:image/png;base64,".concat(dragHandleDark, "') 0 0 / 8px 8px repeat")
-};
 var shadows = {
   focusShadow: "0 0 0 2px ".concat(backgroundColors.backgroundColorPage, ", 0 0 0 5px ").concat(_light["default"].focusColor),
   focusShadowInset: "inset 0 0 0 3px ".concat(_light["default"].focusColor),
@@ -206,8 +203,9 @@ var deprecated = {
   statusColorHighStrong: _light["default"].errorColorL10,
   statusColorCritical: _light["default"].errorColorD10,
   statusColorCriticalWeak: _light["default"].errorColorD20,
-  statusColorCriticalStrong: _light["default"].errorColor
+  statusColorCriticalStrong: _light["default"].errorColor,
+  draggableBackground: "url('data:image/png;base64,".concat(dragHandleDark, "') 0 0 / 8px 8px repeat")
 };
-var theme = _objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread({}, _light["default"]), dark), actionColors), notificationColors), severityColors), backgroundColors), neutralColors), syntaxColors), contentColors), shadows), interactiveColors), deprecated), backgrounds);
+var theme = _objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread({}, _light["default"]), dark), actionColors), notificationColors), severityColors), backgroundColors), neutralColors), syntaxColors), contentColors), shadows), interactiveColors), deprecated);
 var _default = theme;
 exports["default"] = _default;