@splunk/themes 0.24.0 → 0.25.0

package/CHANGELOG.md

@@ -1,6 +1,11 @@
 Change Log
 ============
 
+0.25.0 - June 4, 2025
+----------
+New Features:
+* `@splunk/themes/storybook-addon-splunk-themes` now supports disabling 'both' option via `disableDualTheme` story param (SUI-7702).
+
 0.24.0 - May 6, 2025
 ----------
 Bug Fixes:

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@splunk/themes",
-  "version": "0.24.0",
+  "version": "0.25.0",
   "description": "Theme variables and mixins for the Splunk design language",
   "main": "./index.js",
   "types": "./types/index.d.ts",

package/storybook-addon-splunk-themes/SplunkThemesTool.js

@@ -37,22 +37,32 @@ var SplunkThemesTool = /*#__PURE__*/(0, _react.memo)(function () {
     globals = _useGlobals2[0],
     updateGlobals = _useGlobals2[1];
   var params = (0, _managerApi.useParameter)(_constants.PARAM_KEY, {});
+  var disableDualTheme = (0, _managerApi.useParameter)(_constants.DISABLE_DUAL_THEME_KEY, false);
   var globalsTheme = globals[_constants.PARAM_KEY] || undefined;
   var currentTheme = (0, _util.normalizeThemeOptions)(params, globalsTheme);
   var updateTheme = (0, _react.useCallback)(function (newTheme) {
     var mergedTheme = (0, _util.getMergedTheme)(globalsTheme, newTheme);
     updateGlobals(_defineProperty({}, _constants.PARAM_KEY, mergedTheme));
   }, [globalsTheme, updateGlobals]);
+  (0, _react.useEffect)(function () {
+    if (disableDualTheme) {
+      // eslint-disable-next-line no-console
+      console.warn("This story has 'disableDualTheme' set to 'true', so 'both' option will not show in theme dropdown.");
+    }
+  }, [disableDualTheme]);
   return /*#__PURE__*/_react["default"].createElement(_components.WithTooltip, {
     placement: "top",
     trigger: "click",
     tooltip: function tooltip() {
       return Object.keys(_themeOptions.themeOptions).map(function (themeOptionKey) {
         var themeOptionValues = _themeOptions.themeOptions[themeOptionKey];
+
+        // if story is passing disableDualTheme: true, don't display 'both' option in theme picker
+        var dualThemeOptions = disableDualTheme ? [] : ['both'];
         return /*#__PURE__*/_react["default"].createElement(_react.Fragment, {
           key: themeOptionKey
         }, /*#__PURE__*/_react["default"].createElement(_themes.TooltipSectionTitle, null, themeOptionValues.name), /*#__PURE__*/_react["default"].createElement(_components.TooltipLinkList, {
-          links: [].concat(_toConsumableArray(themeOptionValues.values), ['both']).map(function (themeValue) {
+          links: [].concat(_toConsumableArray(themeOptionValues.values), dualThemeOptions).map(function (themeValue) {
             var active = currentTheme[themeOptionKey] === themeValue;
             return {
               active: active,

package/storybook-addon-splunk-themes/constants.js

@@ -3,11 +3,13 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.CHANGED = exports.SET = exports.CONFIGURE = exports.UPDATE = exports.PARAM_KEY = exports.ADDON_ID = void 0;
+exports.CHANGED = exports.SET = exports.CONFIGURE = exports.UPDATE = exports.DISABLE_DUAL_THEME_KEY = exports.PARAM_KEY = exports.ADDON_ID = void 0;
 var ADDON_ID = '@splunk/themes';
 exports.ADDON_ID = ADDON_ID;
 var PARAM_KEY = 'splunkThemes';
 exports.PARAM_KEY = PARAM_KEY;
+var DISABLE_DUAL_THEME_KEY = 'disableDualTheme';
+exports.DISABLE_DUAL_THEME_KEY = DISABLE_DUAL_THEME_KEY;
 var UPDATE = "".concat(ADDON_ID, "/update");
 exports.UPDATE = UPDATE;
 var CONFIGURE = "".concat(ADDON_ID, "/configure");

package/storybook-addon-splunk-themes/withSplunkTheme.js

@@ -87,7 +87,7 @@ var WithSplunkTheme = function WithSplunkTheme(Story, context) {
     return true;
   }));
   var themeProviderProps = _objectSpread({}, cleanedThemeProviderProps);
-  if (dualThemeOption != null && currentTheme[dualThemeOption] === 'both') {
+  if (!parameters.disableDualTheme && dualThemeOption != null && currentTheme[dualThemeOption] === 'both') {
     return /*#__PURE__*/_react["default"].createElement(DualStory, {
       context: context,
       themeOption: dualThemeOption,

package/types/storybook-addon-splunk-themes/constants.d.ts

@@ -1,5 +1,6 @@
 export declare const ADDON_ID = "@splunk/themes";
 export declare const PARAM_KEY = "splunkThemes";
+export declare const DISABLE_DUAL_THEME_KEY = "disableDualTheme";
 export declare const UPDATE: string;
 export declare const CONFIGURE: string;
 export declare const SET: string;