@grafana/k6-test-builder 0.4.0 → 0.4.1-alpha.1

package/dist/index.d.ts

@@ -338,8 +338,9 @@ interface TestBuilderStandaloneProps {
     readonlyScriptScenarios?: boolean;
     apmConfigs?: APMConfig[];
     hasCloudAPM?: boolean;
+    disableAPM?: boolean;
 }
-export function TestBuilder({ loading, saving, k6Test, hasCloudExecution, availableLoadZones, DocsLinkComponent, onViewChange, StagesVirtualizationComponent, ScriptEditorComponent, TestBuilderIconComponent, readonlyScriptScenarios, apmConfigs, hasCloudAPM, }: TestBuilderStandaloneProps): JSX.Element;
+export function TestBuilder({ loading, saving, k6Test, hasCloudExecution, availableLoadZones, DocsLinkComponent, onViewChange, StagesVirtualizationComponent, ScriptEditorComponent, TestBuilderIconComponent, readonlyScriptScenarios, apmConfigs, hasCloudAPM, disableAPM, }: TestBuilderStandaloneProps): JSX.Element;
 interface TestMetaInformationProps {
     className?: string;
 }

package/dist/index.js

@@ -1183,7 +1183,8 @@ const $b0053bc75d27f892$var$defaultContext = {
     readonlyScriptScenarios: true,
     TestBuilderIconComponent: (0, $924f96bd0d5c630d$export$cc0ae9a5c96bcd6f),
     apmConfigs: [],
-    hasCloudAPM: false
+    hasCloudAPM: false,
+    disableAPM: false
 };
 const $b0053bc75d27f892$export$50a363b00a71216b = /*#__PURE__*/ (0, $gkIgo$react.createContext)($b0053bc75d27f892$var$defaultContext);
 const $b0053bc75d27f892$export$b224d382e54e6ba1 = $b0053bc75d27f892$export$50a363b00a71216b.Provider;
@@ -6346,8 +6347,9 @@ function $b2fd5f170ac8255b$export$ac3bdfe4cb17f64e() {
     const [addMenuOpen, setAddMenuOpen] = (0, $gkIgo$react.useState)(false);
     const addTestBuilderScenarioCallback = ()=>dispatch((0, $fb13d3d78074f465$export$e63b78a5d78eb26d)());
     const addScriptScenarioCallback = ()=>dispatch((0, $fb13d3d78074f465$export$3e6af8cfc9e91c92)());
-    const { openImportModal: openImportModal , readonlyScriptScenarios: readonlyScriptScenarios  } = (0, $b0053bc75d27f892$export$8bcb3cb1ba0d67a7)();
+    const { openImportModal: openImportModal , readonlyScriptScenarios: readonlyScriptScenarios , disableAPM: disableAPM  } = (0, $b0053bc75d27f892$export$8bcb3cb1ba0d67a7)();
     const importDisabled = true;
+    const theme = (0, $gkIgo$materialuicore.useTheme)();
     return /*#__PURE__*/ (0, $gkIgo$reactjsxruntime.jsxs)((0, $e2d64263ec61c60c$export$28a60763829263d0), {
         "data-collapsed": collapsed,
         children: [
@@ -6357,7 +6359,9 @@ function $b2fd5f170ac8255b$export$ac3bdfe4cb17f64e() {
                 children: [
                     /*#__PURE__*/ (0, $gkIgo$reactjsxruntime.jsx)((0, $ae7d4d517776e816$export$915338482336f0c0), {
                         name: "loadZones",
-                        icon: /*#__PURE__*/ (0, $gkIgo$reactjsxruntime.jsx)((0, $7ad7daf7434429fa$export$cadbb3a6d7f856e2), {}),
+                        icon: /*#__PURE__*/ (0, $gkIgo$reactjsxruntime.jsx)((0, $7ad7daf7434429fa$export$cadbb3a6d7f856e2), {
+                            backgroundColor: theme.palette.background.paper
+                        }),
                         countSelector: (0, $cd701400f17d4ede$export$27b31363b86bfe20),
                         children: "Load zones"
                     }),
@@ -6367,7 +6371,7 @@ function $b2fd5f170ac8255b$export$ac3bdfe4cb17f64e() {
                         countSelector: (0, $c9e43998974bca59$export$70d38424a240dd9d),
                         children: "Thresholds"
                     }),
-                    /*#__PURE__*/ (0, $gkIgo$reactjsxruntime.jsx)((0, $ae7d4d517776e816$export$915338482336f0c0), {
+                    !disableAPM && /*#__PURE__*/ (0, $gkIgo$reactjsxruntime.jsx)((0, $ae7d4d517776e816$export$915338482336f0c0), {
                         name: "apm",
                         icon: /*#__PURE__*/ (0, $gkIgo$reactjsxruntime.jsx)((0, $8f59082554601909$export$e2a67d15baecf98e), {}),
                         countSelector: (0, $d227aedde8f44b50$export$db1f15b05cdd9ed0),
@@ -6408,12 +6412,6 @@ function $b2fd5f170ac8255b$export$ac3bdfe4cb17f64e() {
                         ]
                     }),
                     /*#__PURE__*/ (0, $gkIgo$reactjsxruntime.jsx)((0, $bac2ea1f1a1f3a68$export$cf18ca8ecaaac04b), {}),
-                    importDisabled && /*#__PURE__*/ (0, $gkIgo$reactjsxruntime.jsx)((0, $bac2ea1f1a1f3a68$export$51485461e6c971ae), {
-                        component: "button",
-                        color: "textDisabled",
-                        disabled: true,
-                        children: "Import"
-                    }),
                     !importDisabled && /*#__PURE__*/ (0, $gkIgo$reactjsxruntime.jsx)((0, $gkIgo$materialuicore.Tooltip), {
                         title: "Click to import HAR file",
                         arrow: true,
@@ -14425,7 +14423,7 @@ function $00b916e228a936f5$export$f290710bbb710efa({ loading: loading , saving:
         k6_load_zone_id: "amazon:us:ashburn",
         city: "Ashburn"
     }
-] , DocsLinkComponent: DocsLinkComponent = (0, $cd402c1b3ca4b836$export$e816d7af81d48a79) , onViewChange: onViewChange , StagesVirtualizationComponent: StagesVirtualizationComponent , ScriptEditorComponent: ScriptEditorComponent = (0, $ab0bf6ee71c94953$export$32efa5142ae8aa01) , TestBuilderIconComponent: TestBuilderIconComponent = (0, $924f96bd0d5c630d$export$cc0ae9a5c96bcd6f) , readonlyScriptScenarios: readonlyScriptScenarios = true , apmConfigs: apmConfigs = [] , hasCloudAPM: hasCloudAPM = false  }) {
+] , DocsLinkComponent: DocsLinkComponent = (0, $cd402c1b3ca4b836$export$e816d7af81d48a79) , onViewChange: onViewChange , StagesVirtualizationComponent: StagesVirtualizationComponent , ScriptEditorComponent: ScriptEditorComponent = (0, $ab0bf6ee71c94953$export$32efa5142ae8aa01) , TestBuilderIconComponent: TestBuilderIconComponent = (0, $924f96bd0d5c630d$export$cc0ae9a5c96bcd6f) , readonlyScriptScenarios: readonlyScriptScenarios = false , apmConfigs: apmConfigs = [] , hasCloudAPM: hasCloudAPM = false , disableAPM: disableAPM = false  }) {
     // create test builder context
     const context = {
         k6Test: k6Test,
@@ -14438,7 +14436,8 @@ function $00b916e228a936f5$export$f290710bbb710efa({ loading: loading , saving:
         TestBuilderIconComponent: TestBuilderIconComponent,
         readonlyScriptScenarios: readonlyScriptScenarios,
         apmConfigs: apmConfigs,
-        hasCloudAPM: hasCloudAPM
+        hasCloudAPM: hasCloudAPM,
+        disableAPM: disableAPM
     };
     return /*#__PURE__*/ (0, $gkIgo$reactjsxruntime.jsx)((0, $1ae39e1e435a2397$export$9bb8a8c9de09825e), {
         children: /*#__PURE__*/ (0, $gkIgo$reactjsxruntime.jsx)((0, $b0053bc75d27f892$export$b224d382e54e6ba1), {
@@ -15097,7 +15096,9 @@ const $52b9d7eb1cd2746c$export$e59fbfa5ffe25cdd = {
     },
     option: {
         '& > [class*="MuiIconButton-root"]': {
-            marginRight: "8px"
+            marginRight: "8px",
+            padding: 0,
+            paddingLeft: "10px"
         }
     },
     inputRoot: {
@@ -15349,7 +15350,9 @@ const $7c36156baf9739dc$export$bca14c5b3b88a9c9 = {
         }
     },
     keyValueInputVariant: "standard",
-    spacing: 10 // theme.spacing(2) = 20
+    spacing: 10,
+    // theme.spacing(2) = 20
+    outerBackgroundColor: "#f9f8fc"
 };
 const $7c36156baf9739dc$export$164de7ab8df77ef0 = (0, $gkIgo$materialuicore.createTheme)((0, $gkIgo$lodashes.merge)($7c36156baf9739dc$var$themePalette, $7c36156baf9739dc$export$bca14c5b3b88a9c9));
 
@@ -15395,8 +15398,8 @@ const $62ab0070dd5eb8e6$export$44518b3b0aec31d = (theme)=>{
         palette: {
             type: theme.colors.mode,
             background: {
-                paper: theme.colors.background.primary,
-                default: theme.colors.background.canvas,
+                paper: theme.colors.background.secondary,
+                default: theme.colors.background.primary,
                 secondary: theme.colors.background.secondary
             },
             primary: {
@@ -15572,6 +15575,9 @@ const $62ab0070dd5eb8e6$export$44518b3b0aec31d = (theme)=>{
                 paper: {
                     background: theme.colors.background.canvas
                 },
+                popupIndicator: {
+                    color: theme.colors.text.primary
+                },
                 inputRoot: {
                     height: "auto",
                     '&[class*="MuiOutlinedInput-root"]': {
@@ -15626,7 +15632,8 @@ const $62ab0070dd5eb8e6$export$44518b3b0aec31d = (theme)=>{
                     }
                 }
             }
-        }
+        },
+        outerBackgroundColor: theme.colors.background.primary // Storybook wrapper background
     };
 };
 

package/dist/module.js

@@ -7,7 +7,7 @@ import $b7VBt$materialuicoreLink from "@material-ui/core/Link";
 import $b7VBt$materialuicoreSelect from "@material-ui/core/Select";
 import $b7VBt$materialuicoreTextField from "@material-ui/core/TextField";
 import $b7VBt$materialuicoreMenuItem from "@material-ui/core/MenuItem";
-import {ListSubheader as $b7VBt$ListSubheader, Button as $b7VBt$Button, Tooltip as $b7VBt$Tooltip, alpha as $b7VBt$alpha1, ClickAwayListener as $b7VBt$ClickAwayListener, Grow as $b7VBt$Grow, Paper as $b7VBt$Paper, Popper as $b7VBt$Popper, Switch as $b7VBt$Switch, darken as $b7VBt$darken, TextField as $b7VBt$TextField, InputAdornment as $b7VBt$InputAdornment, Checkbox as $b7VBt$Checkbox, FormLabel as $b7VBt$FormLabel, FormControl as $b7VBt$FormControl, RadioGroup as $b7VBt$RadioGroup, FormControlLabel as $b7VBt$FormControlLabel, Radio as $b7VBt$Radio, Dialog as $b7VBt$Dialog, DialogTitle as $b7VBt$DialogTitle, DialogContent as $b7VBt$DialogContent, DialogContentText as $b7VBt$DialogContentText, DialogActions as $b7VBt$DialogActions, Chip as $b7VBt$Chip, Fade as $b7VBt$Fade, useTheme as $b7VBt$useTheme1, createTheme as $b7VBt$createTheme, createGenerateClassName as $b7VBt$createGenerateClassName, NoSsr as $b7VBt$NoSsr, ThemeProvider as $b7VBt$ThemeProvider, StylesProvider as $b7VBt$StylesProvider} from "@material-ui/core";
+import {ListSubheader as $b7VBt$ListSubheader, Button as $b7VBt$Button, Tooltip as $b7VBt$Tooltip, useTheme as $b7VBt$useTheme, alpha as $b7VBt$alpha1, ClickAwayListener as $b7VBt$ClickAwayListener, Grow as $b7VBt$Grow, Paper as $b7VBt$Paper, Popper as $b7VBt$Popper, Switch as $b7VBt$Switch, darken as $b7VBt$darken, TextField as $b7VBt$TextField, InputAdornment as $b7VBt$InputAdornment, Checkbox as $b7VBt$Checkbox, FormLabel as $b7VBt$FormLabel, FormControl as $b7VBt$FormControl, RadioGroup as $b7VBt$RadioGroup, FormControlLabel as $b7VBt$FormControlLabel, Radio as $b7VBt$Radio, Dialog as $b7VBt$Dialog, DialogTitle as $b7VBt$DialogTitle, DialogContent as $b7VBt$DialogContent, DialogContentText as $b7VBt$DialogContentText, DialogActions as $b7VBt$DialogActions, Chip as $b7VBt$Chip, Fade as $b7VBt$Fade, createTheme as $b7VBt$createTheme, createGenerateClassName as $b7VBt$createGenerateClassName, NoSsr as $b7VBt$NoSsr, ThemeProvider as $b7VBt$ThemeProvider, StylesProvider as $b7VBt$StylesProvider} from "@material-ui/core";
 import {useDispatch as $b7VBt$useDispatch, useSelector as $b7VBt$useSelector, Provider as $b7VBt$Provider} from "react-redux";
 import {createSlice as $b7VBt$createSlice, nanoid as $b7VBt$nanoid, createSelector as $b7VBt$createSelector, createEntityAdapter as $b7VBt$createEntityAdapter, current as $b7VBt$current, createAsyncThunk as $b7VBt$createAsyncThunk, configureStore as $b7VBt$configureStore, createListenerMiddleware as $b7VBt$createListenerMiddleware, isAnyOf as $b7VBt$isAnyOf} from "@reduxjs/toolkit";
 import {isFinite as $b7VBt$isFinite, isNumber as $b7VBt$isNumber, cloneDeep as $b7VBt$cloneDeep, isEqual as $b7VBt$isEqual, get as $b7VBt$get, merge as $b7VBt$merge} from "lodash-es";
@@ -17,7 +17,7 @@ import $b7VBt$prettieresmstandalonemjs from "prettier/esm/standalone.mjs";
 import $b7VBt$prettieresmparserbabelmjs from "prettier/esm/parser-babel.mjs";
 import {Scrollbars as $b7VBt$Scrollbars} from "react-custom-scrollbars";
 import {ReactSortable as $b7VBt$ReactSortable} from "react-sortablejs";
-import {lighten as $b7VBt$lighten, useTheme as $b7VBt$useTheme} from "@material-ui/core/styles";
+import {lighten as $b7VBt$lighten, useTheme as $b7VBt$useTheme1} from "@material-ui/core/styles";
 import $b7VBt$materialuilabAutocomplete from "@material-ui/lab/Autocomplete";
 import {createFilterOptions as $b7VBt$createFilterOptions, Autocomplete as $b7VBt$Autocomplete} from "@material-ui/lab";
 
@@ -1162,7 +1162,8 @@ const $4cf6d05a57acd1d1$var$defaultContext = {
     readonlyScriptScenarios: true,
     TestBuilderIconComponent: (0, $a80b21e889559c22$export$cc0ae9a5c96bcd6f),
     apmConfigs: [],
-    hasCloudAPM: false
+    hasCloudAPM: false,
+    disableAPM: false
 };
 const $4cf6d05a57acd1d1$export$50a363b00a71216b = /*#__PURE__*/ (0, $b7VBt$createContext)($4cf6d05a57acd1d1$var$defaultContext);
 const $4cf6d05a57acd1d1$export$b224d382e54e6ba1 = $4cf6d05a57acd1d1$export$50a363b00a71216b.Provider;
@@ -6325,8 +6326,9 @@ function $d9fe84fff8953a15$export$ac3bdfe4cb17f64e() {
     const [addMenuOpen, setAddMenuOpen] = (0, $b7VBt$useState)(false);
     const addTestBuilderScenarioCallback = ()=>dispatch((0, $406997178a55b94e$export$e63b78a5d78eb26d)());
     const addScriptScenarioCallback = ()=>dispatch((0, $406997178a55b94e$export$3e6af8cfc9e91c92)());
-    const { openImportModal: openImportModal , readonlyScriptScenarios: readonlyScriptScenarios  } = (0, $4cf6d05a57acd1d1$export$8bcb3cb1ba0d67a7)();
+    const { openImportModal: openImportModal , readonlyScriptScenarios: readonlyScriptScenarios , disableAPM: disableAPM  } = (0, $4cf6d05a57acd1d1$export$8bcb3cb1ba0d67a7)();
     const importDisabled = true;
+    const theme = (0, $b7VBt$useTheme)();
     return /*#__PURE__*/ (0, $b7VBt$jsxs)((0, $50455a9661ca457e$export$28a60763829263d0), {
         "data-collapsed": collapsed,
         children: [
@@ -6336,7 +6338,9 @@ function $d9fe84fff8953a15$export$ac3bdfe4cb17f64e() {
                 children: [
                     /*#__PURE__*/ (0, $b7VBt$jsx)((0, $b2828942c0be4e42$export$915338482336f0c0), {
                         name: "loadZones",
-                        icon: /*#__PURE__*/ (0, $b7VBt$jsx)((0, $7de9df6ba69a273b$export$cadbb3a6d7f856e2), {}),
+                        icon: /*#__PURE__*/ (0, $b7VBt$jsx)((0, $7de9df6ba69a273b$export$cadbb3a6d7f856e2), {
+                            backgroundColor: theme.palette.background.paper
+                        }),
                         countSelector: (0, $27ada388e04e2c5d$export$27b31363b86bfe20),
                         children: "Load zones"
                     }),
@@ -6346,7 +6350,7 @@ function $d9fe84fff8953a15$export$ac3bdfe4cb17f64e() {
                         countSelector: (0, $0a7407e072b791ee$export$70d38424a240dd9d),
                         children: "Thresholds"
                     }),
-                    /*#__PURE__*/ (0, $b7VBt$jsx)((0, $b2828942c0be4e42$export$915338482336f0c0), {
+                    !disableAPM && /*#__PURE__*/ (0, $b7VBt$jsx)((0, $b2828942c0be4e42$export$915338482336f0c0), {
                         name: "apm",
                         icon: /*#__PURE__*/ (0, $b7VBt$jsx)((0, $3a5549cb3a52940d$export$e2a67d15baecf98e), {}),
                         countSelector: (0, $f5336de97253fdb0$export$db1f15b05cdd9ed0),
@@ -6387,12 +6391,6 @@ function $d9fe84fff8953a15$export$ac3bdfe4cb17f64e() {
                         ]
                     }),
                     /*#__PURE__*/ (0, $b7VBt$jsx)((0, $570fb69e6168c397$export$cf18ca8ecaaac04b), {}),
-                    importDisabled && /*#__PURE__*/ (0, $b7VBt$jsx)((0, $570fb69e6168c397$export$51485461e6c971ae), {
-                        component: "button",
-                        color: "textDisabled",
-                        disabled: true,
-                        children: "Import"
-                    }),
                     !importDisabled && /*#__PURE__*/ (0, $b7VBt$jsx)((0, $b7VBt$Tooltip), {
                         title: "Click to import HAR file",
                         arrow: true,
@@ -9467,7 +9465,7 @@ function $cc97beb4c07e5f13$export$f1497c8ea6b28f42() {
 
 
 const $791a660a9528967f$export$909904bdb4cb4458 = ({ value: value = "" , suggestions: suggestions = [] , placeholder: placeholder = "" , onChange: onChange , onBlur: onBlur  })=>{
-    const theme = (0, $b7VBt$useTheme)();
+    const theme = (0, $b7VBt$useTheme1)();
     const [currentValue, setCurrentValue] = (0, $b7VBt$useState)(value);
     (0, $b7VBt$useEffect)(()=>setCurrentValue(value), [
         value
@@ -13716,7 +13714,7 @@ function $57f5dd5ab9a21f69$export$1b8c1f86070440b9({ fill: fill = "#fff"  }) {
     });
 }
 const $57f5dd5ab9a21f69$export$494e9da397d5363d = ()=>{
-    const theme = (0, $b7VBt$useTheme1)();
+    const theme = (0, $b7VBt$useTheme)();
     if (theme && theme.palette && theme.palette.type === "dark") return /*#__PURE__*/ (0, $b7VBt$jsx)($57f5dd5ab9a21f69$export$1b8c1f86070440b9, {
         fill: theme.palette.text.primary
     });
@@ -14404,7 +14402,7 @@ function $045b658c7184976c$export$f290710bbb710efa({ loading: loading , saving:
         k6_load_zone_id: "amazon:us:ashburn",
         city: "Ashburn"
     }
-] , DocsLinkComponent: DocsLinkComponent = (0, $a2bbc3b49e805484$export$e816d7af81d48a79) , onViewChange: onViewChange , StagesVirtualizationComponent: StagesVirtualizationComponent , ScriptEditorComponent: ScriptEditorComponent = (0, $b60f5acc8283b9c9$export$32efa5142ae8aa01) , TestBuilderIconComponent: TestBuilderIconComponent = (0, $a80b21e889559c22$export$cc0ae9a5c96bcd6f) , readonlyScriptScenarios: readonlyScriptScenarios = true , apmConfigs: apmConfigs = [] , hasCloudAPM: hasCloudAPM = false  }) {
+] , DocsLinkComponent: DocsLinkComponent = (0, $a2bbc3b49e805484$export$e816d7af81d48a79) , onViewChange: onViewChange , StagesVirtualizationComponent: StagesVirtualizationComponent , ScriptEditorComponent: ScriptEditorComponent = (0, $b60f5acc8283b9c9$export$32efa5142ae8aa01) , TestBuilderIconComponent: TestBuilderIconComponent = (0, $a80b21e889559c22$export$cc0ae9a5c96bcd6f) , readonlyScriptScenarios: readonlyScriptScenarios = false , apmConfigs: apmConfigs = [] , hasCloudAPM: hasCloudAPM = false , disableAPM: disableAPM = false  }) {
     // create test builder context
     const context = {
         k6Test: k6Test,
@@ -14417,7 +14415,8 @@ function $045b658c7184976c$export$f290710bbb710efa({ loading: loading , saving:
         TestBuilderIconComponent: TestBuilderIconComponent,
         readonlyScriptScenarios: readonlyScriptScenarios,
         apmConfigs: apmConfigs,
-        hasCloudAPM: hasCloudAPM
+        hasCloudAPM: hasCloudAPM,
+        disableAPM: disableAPM
     };
     return /*#__PURE__*/ (0, $b7VBt$jsx)((0, $59eb99f127c45ea7$export$9bb8a8c9de09825e), {
         children: /*#__PURE__*/ (0, $b7VBt$jsx)((0, $4cf6d05a57acd1d1$export$b224d382e54e6ba1), {
@@ -15076,7 +15075,9 @@ const $5e43c31f4d2ea205$export$e59fbfa5ffe25cdd = {
     },
     option: {
         '& > [class*="MuiIconButton-root"]': {
-            marginRight: "8px"
+            marginRight: "8px",
+            padding: 0,
+            paddingLeft: "10px"
         }
     },
     inputRoot: {
@@ -15328,7 +15329,9 @@ const $54e6cc9f054c3662$export$bca14c5b3b88a9c9 = {
         }
     },
     keyValueInputVariant: "standard",
-    spacing: 10 // theme.spacing(2) = 20
+    spacing: 10,
+    // theme.spacing(2) = 20
+    outerBackgroundColor: "#f9f8fc"
 };
 const $54e6cc9f054c3662$export$164de7ab8df77ef0 = (0, $b7VBt$createTheme)((0, $b7VBt$merge)($54e6cc9f054c3662$var$themePalette, $54e6cc9f054c3662$export$bca14c5b3b88a9c9));
 
@@ -15374,8 +15377,8 @@ const $1eed075243b73743$export$44518b3b0aec31d = (theme)=>{
         palette: {
             type: theme.colors.mode,
             background: {
-                paper: theme.colors.background.primary,
-                default: theme.colors.background.canvas,
+                paper: theme.colors.background.secondary,
+                default: theme.colors.background.primary,
                 secondary: theme.colors.background.secondary
             },
             primary: {
@@ -15551,6 +15554,9 @@ const $1eed075243b73743$export$44518b3b0aec31d = (theme)=>{
                 paper: {
                     background: theme.colors.background.canvas
                 },
+                popupIndicator: {
+                    color: theme.colors.text.primary
+                },
                 inputRoot: {
                     height: "auto",
                     '&[class*="MuiOutlinedInput-root"]': {
@@ -15605,7 +15611,8 @@ const $1eed075243b73743$export$44518b3b0aec31d = (theme)=>{
                     }
                 }
             }
-        }
+        },
+        outerBackgroundColor: theme.colors.background.primary // Storybook wrapper background
     };
 };
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@grafana/k6-test-builder",
-  "version": "0.4.0",
+  "version": "0.4.1-alpha.1",
   "license": "AGPL-3.0",
   "main": "dist/index.js",
   "module": "dist/module.js",