@splunk/themes 1.4.0 → 1.5.0

package/CHANGELOG.md

@@ -1,5 +1,19 @@
 Change Log
 ============
+
+1.5.0 - February 10, 2026
+----------
+New Features:
+* New `lineLengthMinimum` token (SUI-8622).
+
+Deprecations:
+* `draggableBackground` has been deprecated (SUI-8623).
+
+1.4.1 - December 3, 2025
+----------
+Bug Fixes:
+* `backgroundColorSection` in Enterprise dark theme updated to improve visual contrast between `neutralColor` and to reduce its overall brightness (SUI-7879).
+
 1.4.0  - November 4, 2025
 ----------
 New Features:

package/design-tokens/colors.js

@@ -16,7 +16,7 @@ function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e
  * Action colors are used **exclusively** for styling Buttons borders and backgrounds.
  * They define interaction states for primary, secondary, subtle, and destructive buttons.
  *
- * @categoryColor
+ * @category color
  */
 var actionColors = {
   /**
@@ -134,85 +134,85 @@ var actionColors = {
   /**
    * Default text color for Primary Buttons.
    *
-   * @categoryFont
+   * @previewType font
    */
   actionColorContentPrimary: '',
   /**
    * Disabled text color for Primary Buttons.
    *
-   * @categoryFont
+   * @previewType font
    */
   actionColorContentPrimaryDisabled: '',
   /**
    * Default text color for Secondary Buttons.
    *
-   * @categoryFont
+   * @previewType font
    */
   actionColorContentSecondary: '',
   /**
    * Disabled text color for Secondary Buttons.
    *
-   * @categoryFont
+   * @previewType font
    */
   actionColorContentSecondaryDisabled: '',
   /**
    * Active text color for Subtle Buttons.
    *
-   * @categoryFont
+   * @previewType font
    */
   actionColorContentSubtleActive: '',
   /**
    * Hover text color for Subtle Buttons.
    *
-   * @categoryFont
+   * @previewType font
    */
   actionColorContentSubtleHover: '',
   /**
    * Default text color for Standalone Buttons.
    *
-   * @categoryFont
+   * @previewType font
    */
   actionColorContentStandalone: '',
   /**
    * Active (pressed) text color for Standalone Buttons.
    *
-   * @categoryFont
+   * @previewType font
    */
   actionColorContentStandaloneActive: '',
   /**
    * Disabled text color for Standalone Buttons.
    *
-   * @categoryFont
+   * @previewType font
    */
   actionColorContentStandaloneDisabled: '',
   /**
    * Hover text color for Standalone Buttons.
    *
-   * @categoryFont
+   * @previewType font
    */
   actionColorContentStandaloneHover: '',
   /**
    * Default text color for Destructive Buttons.
    *
-   * @categoryFont
+   * @previewType font
    */
   actionColorContentDestructive: '',
   /**
    * Disabled text color for Destructive Buttons.
    *
-   * @categoryFont
+   * @previewType font
    */
   actionColorContentDestructiveDisabled: '',
   /**
    * Default text color for Destructive Secondary Buttons.
    *
-   * @categoryFont
+   * @previewType font
    */
   actionColorContentDestructiveSecondary: '',
   /**
    * Disabled text color for Destructive Secondary Buttons.
    *
-   * @categoryFont
+   * @previewType font
    */
   actionColorContentDestructiveSecondaryDisabled: ''
 };
@@ -225,7 +225,7 @@ var actionColors = {
  * "Overlay" colors are intended to be placed over the default background color, such as `interactiveColorAccent`.
  * If the default background color is not transparent, the `blend` mixin can be used to create a new color that combines the two.
  *
- * @categoryColor
+ * @category color
  */
 var interactiveColors = {
   /**
@@ -292,7 +292,7 @@ var interactiveColors = {
  * Neutral colors should be used sparingly. Prefer to use more semantic tokens for backgrounds and borders.
  * These colors must not be used for content as they will not pass the required contrast ratio (instead, use [Content colors](#Content Colors)).
  *
- * @categoryColor
+ * @category color
  */
 var neutralColors = {
   /**
@@ -337,7 +337,7 @@ var neutralColors = {
  * #### Background colors
  * Use background colors for page backgrounds and containers such as cards, modals, panels or popups.
  *
- * @categoryColor
+ * @category color
  */
 var backgroundColors = {
   /**
@@ -378,7 +378,8 @@ var backgroundColors = {
  * #### Content colors
  * Use content colors to create visual hierarchy, convey status or importance for plain text content.
  *
- * @categoryFont
+ * @category color
+ * @previewType font
  */
 var contentColors = {
   /**
@@ -442,7 +443,7 @@ var contentColors = {
 /**
  * #### UI Colors
  *
- * @categoryColor
+ * @category color
  */
 var uiColors = {
   /**
@@ -459,7 +460,7 @@ var uiColors = {
  *
  * Weak variants do not meet graphical or text contrast and should only be used decoratively.
  *
- * @categoryColor
+ * @category color
  */
 var notificationColors = {
   notificationColorInfoWeak: '',
@@ -482,7 +483,7 @@ var notificationColors = {
  * Use severity colors for icons, indicators, and visual signals to help users quickly scan for criticality, risk, or state without relying only on text.
  * Severity colors should be used to aid identifying the semantic meaning of an element; not used to communicate tone.
  *
- * @categoryColor
+ * @category color
  */
 var severityColors = {
   severityColorCustom: '',
@@ -504,7 +505,8 @@ var severityColors = {
  * Prefer to use the `Code` component rather than these tokens directly as it does this mapping automatically.
  * See [Content Colors](#Content Colors)
  *
- * @categoryFont
+ * @category color
+ * @previewType font
  */
 var syntaxColors = {
   syntaxBlue: '',
@@ -523,7 +525,7 @@ var syntaxColors = {
  *
  * Border color should be used to outline or divide content and UI elements.
  *
- * @categoryColor
+ * @category color
  */
 var borderColors = {
   /**

package/design-tokens/dataViz.js

@@ -13,7 +13,7 @@ function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e
 /**
  * #### Static colors
  *
- * @categoryColor verbose
+ * @category color
  */
 var staticColors = {
   static1: '',
@@ -41,7 +41,7 @@ var staticColors = {
 /**
  * #### Categorical 1D
  *
- * @categoryColor verbose
+ * @category color
  */
 var categorical1D = {
   categorical1D1: '',
@@ -56,7 +56,7 @@ var categorical1D = {
 /**
  * #### Categorical 1L
  *
- * @categoryColor verbose
+ * @category color
  */
 var categorical1L = {
   categorical1L1: '',
@@ -71,7 +71,7 @@ var categorical1L = {
 /**
  * #### Categorical 2D
  *
- * @categoryColor verbose
+ * @category color
  */
 var categorical2D = {
   categorical2D1: '',
@@ -86,7 +86,7 @@ var categorical2D = {
 /**
  * #### Categorical 2L
  *
- * @categoryColor verbose
+ * @category color
  */
 var categorical2L = {
   categorical2L1: '',
@@ -102,7 +102,7 @@ var categorical = _objectSpread(_objectSpread(_objectSpread(_objectSpread({}, ca
 /**
  * #### Divergent 1D
  *
- * @categoryColor verbose
+ * @category color
  */
 var divergent1D = {
   divergent1D1: '',
@@ -117,7 +117,7 @@ var divergent1D = {
 /**
  * #### Divergent 1L
  *
- * @categoryColor verbose
+ * @category color
  */
 var divergent1L = {
   divergent1L1: '',
@@ -132,7 +132,7 @@ var divergent1L = {
 /**
  * #### Divergent 2D
  *
- * @categoryColor verbose
+ * @category color
  */
 var divergent2D = {
   divergent2D1: '',
@@ -147,7 +147,7 @@ var divergent2D = {
 /**
  * #### Divergent 2L
  *
- * @categoryColor verbose
+ * @category color
  */
 var divergent2L = {
   divergent2L1: '',
@@ -162,7 +162,7 @@ var divergent2L = {
 /**
  * #### Divergent 3D
  *
- * @categoryColor verbose
+ * @category color
  */
 var divergent3D = {
   divergent3D1: '',
@@ -177,7 +177,7 @@ var divergent3D = {
 /**
  * #### Divergent 3L
  *
- * @categoryColor verbose
+ * @category color
  */
 var divergent3L = {
   divergent3L1: '',
@@ -192,7 +192,7 @@ var divergent3L = {
 /**
  * #### Divergent 4D
  *
- * @categoryColor verbose
+ * @category color
  */
 var divergent4D = {
   divergent4D1: '',
@@ -207,7 +207,7 @@ var divergent4D = {
 /**
  * #### Divergent 4L
  *
- * @categoryColor verbose
+ * @category color
  */
 var divergent4L = {
   divergent4L1: '',
@@ -223,7 +223,7 @@ var divergent = _objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectS
 /**
  * #### Sequential 1D
  *
- * @categoryColor verbose
+ * @category color
  */
 var sequential1D = {
   sequential1D1: '',
@@ -238,7 +238,7 @@ var sequential1D = {
 /**
  * #### Sequential 1L
  *
- * @categoryColor verbose
+ * @category color
  */
 var sequential1L = {
   sequential1L1: '',
@@ -253,7 +253,7 @@ var sequential1L = {
 /**
  * #### Sequential 2D
  *
- * @categoryColor verbose
+ * @category color
  */
 var sequential2D = {
   sequential2D1: '',
@@ -268,7 +268,7 @@ var sequential2D = {
 /**
  * #### Sequential 2L
  *
- * @categoryColor verbose
+ * @category color
  */
 var sequential2L = {
   sequential2L1: '',
@@ -283,7 +283,7 @@ var sequential2L = {
 /**
  * #### Sequential 3D
  *
- * @categoryColor verbose
+ * @category color
  */
 var sequential3D = {
   sequential3D1: '',
@@ -298,7 +298,7 @@ var sequential3D = {
 /**
  * #### Sequential 3L
  *
- * @categoryColor verbose
+ * @category color
  */
 var sequential3L = {
   sequential3L1: '',
@@ -313,7 +313,7 @@ var sequential3L = {
 /**
  * #### Sequential 4D
  *
- * @categoryColor verbose
+ * @category color
  */
 var sequential4D = {
   sequential4D1: '',
@@ -328,7 +328,7 @@ var sequential4D = {
 /**
  * #### Sequential 4L
  *
- * @categoryColor verbose
+ * @category color
  */
 var sequential4L = {
   sequential4L1: '',
@@ -343,7 +343,7 @@ var sequential4L = {
 /**
  * #### Sequential 5D
  *
- * @categoryColor verbose
+ * @category color
  */
 var sequential5D = {
   sequential5D1: '',
@@ -358,7 +358,7 @@ var sequential5D = {
 /**
  * #### Sequential 5L
  *
- * @categoryColor verbose
+ * @category color
  */
 var sequential5L = {
   sequential5L1: '',
@@ -373,7 +373,7 @@ var sequential5L = {
 /**
  * #### Sequential 6D
  *
- * @categoryColor verbose
+ * @category color
  */
 var sequential6D = {
   sequential6D1: '',
@@ -388,7 +388,7 @@ var sequential6D = {
 /**
  * #### Sequential 6L
  *
- * @categoryColor verbose
+ * @category color
  */
 var sequential6L = {
   sequential6L1: '',
@@ -404,7 +404,7 @@ var sequential = _objectSpread(_objectSpread(_objectSpread(_objectSpread(_object
 /**
  * #### High low 1D
  *
- * @categoryColor verbose
+ * @category color
  */
 var highLow1D = {
   highLow1DHigh: '',
@@ -414,7 +414,7 @@ var highLow1D = {
 /**
  * #### High low 1L
  *
- * @categoryColor verbose
+ * @category color
  */
 var highLow1L = {
   highLow1LHigh: '',
@@ -424,7 +424,7 @@ var highLow1L = {
 /**
  * #### High low 2D
  *
- * @categoryColor verbose
+ * @category color
  */
 var highLow2D = {
   highLow2DHigh: '',
@@ -434,7 +434,7 @@ var highLow2D = {
 /**
  * #### High low 2L
  *
- * @categoryColor verbose
+ * @category color
  */
 var highLow2L = {
   highLow2LHigh: '',
@@ -444,7 +444,7 @@ var highLow2L = {
 /**
  * #### High low 3D
  *
- * @categoryColor verbose
+ * @category color
  */
 var highLow3D = {
   highLow3DHigh: '',
@@ -454,7 +454,7 @@ var highLow3D = {
 /**
  * #### High low 3L
  *
- * @categoryColor verbose
+ * @category color
  */
 var highLow3L = {
   highLow3LHigh: '',
@@ -464,7 +464,7 @@ var highLow3L = {
 /**
  * #### High low 4D
  *
- * @categoryColor verbose
+ * @category color
  */
 var highLow4D = {
   highLow4DHigh: '',
@@ -474,7 +474,7 @@ var highLow4D = {
 /**
  * #### High low 4L
  *
- * @categoryColor verbose
+ * @category color
  */
 var highLow4L = {
   highLow4LHigh: '',