storybook 9.0.13 → 9.0.14

package/dist/common/index.js

@@ -1105,7 +1105,7 @@ var gQ = m(($W, oQ) => {
 });
 
 // ../node_modules/picomatch/lib/constants.js
-var Ti = m((_3, SQ) => {
+var Ti = m((_4, SQ) => {
   "use strict";
   var QR = v("path"), qe = "\\\\/", wQ = `[^${qe}]`, It = "\\.", fR = "\\+", dR = "\\?", Fn = "\\/", pR = "(?=.)", mQ = "[^/]", za = `(?:${Fn}\
 |$)`, yQ = `(?:^|${Fn})`, Wa = `${It}{1,2}${za}`, wR = `(?!${It})`, mR = `(?!${yQ}${Wa})`, yR = `(?!${It}{0,1}${za})`, DR = `(?!${Wa})`, SR = `\
@@ -1316,7 +1316,7 @@ var Hi = m((se) => {
 });
 
 // ../node_modules/picomatch/lib/scan.js
-var vQ = m((J3, RQ) => {
+var vQ = m((J4, RQ) => {
   "use strict";
   var KQ = Hi(), {
     CHAR_ASTERISK: Va,
@@ -1506,7 +1506,7 @@ var vQ = m((J3, RQ) => {
 });
 
 // ../node_modules/picomatch/lib/parse.js
-var YQ = m((T3, xQ) => {
+var YQ = m((T4, xQ) => {
   "use strict";
   var kn = Ti(), le = Hi(), {
     MAX_LENGTH: bn,
@@ -1972,7 +1972,7 @@ slash", value: "/", output: "" });
 });
 
 // ../node_modules/picomatch/lib/picomatch.js
-var UQ = m((j3, PQ) => {
+var UQ = m((j4, PQ) => {
   "use strict";
   var qR = v("path"), zR = vQ(), tC = YQ(), rC = Hi(), WR = Ti(), VR = /* @__PURE__ */ s((t) => t && typeof t == "object" && !Array.isArray(
   t), "isObject"), bA = /* @__PURE__ */ s((t, A, e = !1) => {
@@ -2046,7 +2046,7 @@ ion" && i.onIgnore(D), D.isMatch = !1, Q ? D : !1) : (typeof i.onMatch == "funct
 });
 
 // ../node_modules/picomatch/index.js
-var Nn = m((z3, _Q) => {
+var Nn = m((z4, _Q) => {
   "use strict";
   _Q.exports = UQ();
 });
@@ -18599,49 +18599,49 @@ var CK = ue(() => {
 
 // src/common/versions.ts
 var nt = {
-  "@storybook/addon-a11y": "9.0.13",
-  "@storybook/addon-docs": "9.0.13",
-  "@storybook/addon-jest": "9.0.13",
-  "@storybook/addon-links": "9.0.13",
-  "@storybook/addon-onboarding": "9.0.13",
-  "storybook-addon-pseudo-states": "9.0.13",
-  "@storybook/addon-themes": "9.0.13",
-  "@storybook/addon-vitest": "9.0.13",
-  "@storybook/builder-vite": "9.0.13",
-  "@storybook/builder-webpack5": "9.0.13",
-  storybook: "9.0.13",
-  "@storybook/angular": "9.0.13",
-  "@storybook/ember": "9.0.13",
-  "@storybook/html-vite": "9.0.13",
-  "@storybook/nextjs": "9.0.13",
-  "@storybook/nextjs-vite": "9.0.13",
-  "@storybook/preact-vite": "9.0.13",
-  "@storybook/react-native-web-vite": "9.0.13",
-  "@storybook/react-vite": "9.0.13",
-  "@storybook/react-webpack5": "9.0.13",
-  "@storybook/server-webpack5": "9.0.13",
-  "@storybook/svelte-vite": "9.0.13",
-  "@storybook/sveltekit": "9.0.13",
-  "@storybook/vue3-vite": "9.0.13",
-  "@storybook/web-components-vite": "9.0.13",
-  sb: "9.0.13",
-  "@storybook/cli": "9.0.13",
-  "@storybook/codemod": "9.0.13",
-  "@storybook/core-webpack": "9.0.13",
-  "create-storybook": "9.0.13",
-  "@storybook/csf-plugin": "9.0.13",
-  "eslint-plugin-storybook": "9.0.13",
-  "@storybook/react-dom-shim": "9.0.13",
-  "@storybook/preset-create-react-app": "9.0.13",
-  "@storybook/preset-react-webpack": "9.0.13",
-  "@storybook/preset-server-webpack": "9.0.13",
-  "@storybook/html": "9.0.13",
-  "@storybook/preact": "9.0.13",
-  "@storybook/react": "9.0.13",
-  "@storybook/server": "9.0.13",
-  "@storybook/svelte": "9.0.13",
-  "@storybook/vue3": "9.0.13",
-  "@storybook/web-components": "9.0.13"
+  "@storybook/addon-a11y": "9.0.14",
+  "@storybook/addon-docs": "9.0.14",
+  "@storybook/addon-jest": "9.0.14",
+  "@storybook/addon-links": "9.0.14",
+  "@storybook/addon-onboarding": "9.0.14",
+  "storybook-addon-pseudo-states": "9.0.14",
+  "@storybook/addon-themes": "9.0.14",
+  "@storybook/addon-vitest": "9.0.14",
+  "@storybook/builder-vite": "9.0.14",
+  "@storybook/builder-webpack5": "9.0.14",
+  storybook: "9.0.14",
+  "@storybook/angular": "9.0.14",
+  "@storybook/ember": "9.0.14",
+  "@storybook/html-vite": "9.0.14",
+  "@storybook/nextjs": "9.0.14",
+  "@storybook/nextjs-vite": "9.0.14",
+  "@storybook/preact-vite": "9.0.14",
+  "@storybook/react-native-web-vite": "9.0.14",
+  "@storybook/react-vite": "9.0.14",
+  "@storybook/react-webpack5": "9.0.14",
+  "@storybook/server-webpack5": "9.0.14",
+  "@storybook/svelte-vite": "9.0.14",
+  "@storybook/sveltekit": "9.0.14",
+  "@storybook/vue3-vite": "9.0.14",
+  "@storybook/web-components-vite": "9.0.14",
+  sb: "9.0.14",
+  "@storybook/cli": "9.0.14",
+  "@storybook/codemod": "9.0.14",
+  "@storybook/core-webpack": "9.0.14",
+  "create-storybook": "9.0.14",
+  "@storybook/csf-plugin": "9.0.14",
+  "eslint-plugin-storybook": "9.0.14",
+  "@storybook/react-dom-shim": "9.0.14",
+  "@storybook/preset-create-react-app": "9.0.14",
+  "@storybook/preset-react-webpack": "9.0.14",
+  "@storybook/preset-server-webpack": "9.0.14",
+  "@storybook/html": "9.0.14",
+  "@storybook/preact": "9.0.14",
+  "@storybook/react": "9.0.14",
+  "@storybook/server": "9.0.14",
+  "@storybook/svelte": "9.0.14",
+  "@storybook/vue3": "9.0.14",
+  "@storybook/web-components": "9.0.14"
 };
 
 // src/common/presets.ts
@@ -23587,7 +23587,7 @@ var Vs = class {
     s(this, "FileSystemCache");
   }
   constructor(A = {}) {
-    this.prefix = (A.ns || A.prefix || "") + "-", this.hash_alg = A.hash_alg || "md5", this.cache_dir = A.basePath || Mi(Zk(), qk(15).toString(
+    this.prefix = (A.ns || A.prefix || "") + "-", this.hash_alg = A.hash_alg || "sha256", this.cache_dir = A.basePath || Mi(Zk(), qk(15).toString(
     "base64").replace(/\//g, "-")), this.ttl = A.ttl || 0, kE(this.hash_alg), Hg(this.cache_dir, { recursive: !0 });
   }
   generateHash(A) {
@@ -26014,7 +26014,7 @@ function IQ({ nodeEnv: t, buildTarget: A } = {}) {
 s(IQ, "getEnvironment");
 
 // src/common/utils/envs.ts
-function o3(t = {}) {
+function o4(t = {}) {
   let A = t.production ? "production" : "development", e = {
     // eslint-disable-next-line @typescript-eslint/dot-notation
     NODE_ENV: process.env.NODE_ENV || A,
@@ -26038,8 +26038,8 @@ function o3(t = {}) {
     raw: o
   };
 }
-s(o3, "loadEnvs");
-var g3 = /* @__PURE__ */ s((t) => Object.entries(t).reduce((A, [e, r]) => (A[e] = JSON.stringify(r), A), {}), "stringifyEnvs"), a3 = /* @__PURE__ */ s(
+s(o4, "loadEnvs");
+var g4 = /* @__PURE__ */ s((t) => Object.entries(t).reduce((A, [e, r]) => (A[e] = JSON.stringify(r), A), {}), "stringifyEnvs"), a4 = /* @__PURE__ */ s(
 (t) => Object.entries(t).reduce((e, [r, i]) => (e[`process.env.${r}`] = JSON.stringify(i), e), {}), "stringifyProcessEnvs");
 
 // src/common/utils/common-glob-options.ts
@@ -26079,14 +26079,14 @@ var lQ = {
 };
 
 // src/common/utils/get-builder-options.ts
-async function E3(t) {
+async function E4(t) {
   let A = await t.presets.apply("framework", {}, t);
   if (typeof A != "string" && A?.options?.builder)
     return A.options.builder;
   let { builder: e } = await t.presets.apply("core", {}, t);
   return typeof e != "string" && e?.options ? e.options : {};
 }
-s(E3, "getBuilderOptions");
+s(E4, "getBuilderOptions");
 
 // src/common/utils/get-framework-name.ts
 var uQ = cA(ot(), 1);
@@ -26116,16 +26116,16 @@ var QQ = /* @__PURE__ */ s((t) => {
 }, "extractProperFrameworkName");
 
 // src/common/utils/get-renderer-name.ts
-async function F3(t) {
+async function F4(t) {
   let A = await t.presets.apply("core", {}, t);
   return !A || !A.renderer ? BQ(t) : A.renderer;
 }
-s(F3, "getRendererName");
-async function k3(t) {
+s(F4, "getRendererName");
+async function k4(t) {
   let A = QQ(t), e = xr[A];
   return e ? lQ[e] : null;
 }
-s(k3, "extractProperRendererNameFromFramework");
+s(k4, "extractProperRendererNameFromFramework");
 
 // src/common/utils/get-storybook-refs.ts
 import { readFile as fQ } from "node:fs/promises";
@@ -26185,7 +26185,7 @@ var ER = /* @__PURE__ */ s(async (t) => {
   let A = t.replace(/[A-Z]/g, (e) => ` ${e}`).replace(/[-_][A-Z]/gi, (e) => ` ${e.toUpperCase()}`).replace(/-/g, " ").replace(/_/g, " ");
   return `${A.substring(0, 1).toUpperCase()}${A.substring(1)}`.trim();
 }, "toTitle");
-async function Y3(t) {
+async function Y4(t) {
   if (t.test)
     return {};
   let A = await t.presets.apply("refs", await ER(t));
@@ -26207,7 +26207,7 @@ async function Y3(t) {
     })
   ), A;
 }
-s(Y3, "getRefs");
+s(Y4, "getRefs");
 
 // src/common/utils/glob-to-regexp.ts
 var GQ = cA(Nn(), 1);
@@ -26226,7 +26226,7 @@ function JQ(t) {
 s(JQ, "globToRegexp");
 
 // src/common/utils/interpolate.ts
-var X3 = /* @__PURE__ */ s((t, A) => Object.entries(A).reduce((e, [r, i]) => {
+var X4 = /* @__PURE__ */ s((t, A) => Object.entries(A).reduce((e, [r, i]) => {
   let n = i.replace(/\\/g, "/").replace(/\$/g, "$$$");
   return e.replace(new RegExp(`{{${r}}}`, "g"), n);
 }, t), "interpolate");
@@ -26238,7 +26238,7 @@ import {
   MainFileESMOnlyImportError as $R,
   MainFileEvaluationError as A0
 } from "storybook/internal/server-errors";
-async function s4({
+async function s3({
   configDir: t = ".storybook",
   noCache: A = !1,
   cwd: e
@@ -26271,13 +26271,13 @@ async function s4({
     });
   }
 }
-s(s4, "loadMainConfig");
+s(s3, "loadMainConfig");
 
 // src/common/utils/load-manager-or-addons-file.ts
 var TQ = cA(ot(), 1);
 import { resolve as iC } from "node:path";
 import { logger as e0 } from "storybook/internal/node-logger";
-function c4({ configDir: t }) {
+function c3({ configDir: t }) {
   let A = pr(iC(t, "addons")), e = pr(iC(t, "manager"));
   if ((A || e) && e0.info("=> Loading custom manager config"), A && e)
     throw new Error(TQ.dedent`
@@ -26287,12 +26287,12 @@ function c4({ configDir: t }) {
     )})`);
   return e || A;
 }
-s(c4, "loadManagerOrAddonsFile");
+s(c3, "loadManagerOrAddonsFile");
 
 // src/common/utils/load-preview-or-config-file.ts
 var HQ = cA(ot(), 1);
 import { resolve as sC } from "node:path";
-function u4({ configDir: t }) {
+function u3({ configDir: t }) {
   let A = pr(sC(t, "config")), e = pr(sC(t, "preview"));
   if (A && e)
     throw new Error(HQ.dedent`
@@ -26302,12 +26302,12 @@ function u4({ configDir: t }) {
     )})`);
   return e || A;
 }
-s(u4, "loadPreviewOrConfigFile");
+s(u3, "loadPreviewOrConfigFile");
 
 // src/common/utils/log.ts
 var nr = cA(Ui(), 1);
 import { logger as Mn } from "storybook/internal/node-logger";
-var d4 = /* @__PURE__ */ s((t) => (process.stdout.write(nr.default.cyan(" \u2022 ") + t), (A, e) => {
+var d3 = /* @__PURE__ */ s((t) => (process.stdout.write(nr.default.cyan(" \u2022 ") + t), (A, e) => {
   if (A) {
     if (process.stdout.write(`. ${nr.default.red("\u2716")}
 `), Mn.error(`
@@ -26323,13 +26323,13 @@ var d4 = /* @__PURE__ */ s((t) => (process.stdout.write(nr.default.cyan(" \u2022
   process.stdout.write(`. ${nr.default.green("\u2713")}
 `);
 }), "commandLog");
-function p4(t) {
+function p3(t) {
   let A = t.split(`
 `).map((e) => `    ${e}`).join(`
 `);
   Mn.log(A);
 }
-s(p4, "paddedLog");
+s(p3, "paddedLog");
 function jQ(t, A) {
   let e = "";
   for (let r = 0; r < A; r += 1)
@@ -26337,7 +26337,7 @@ function jQ(t, A) {
   return e;
 }
 s(jQ, "getChars");
-function w4(t, A) {
+function w3(t, A) {
   let e = 0, i = t.map((n) => (e = n.length > e ? n.length : e, n)).map((n) => {
     let o = e - n.length, g = n + jQ(" ", o);
     return g = jQ(" ", A || 2) + nr.default.inverse(` ${g} `), g;
@@ -26345,14 +26345,14 @@ function w4(t, A) {
 `);
   Mn.log(i);
 }
-s(w4, "codeLog");
+s(w3, "codeLog");
 
 // src/common/utils/log-config.ts
 var qQ = cA(Ui(), 1);
-function D4(t, A) {
+function D3(t, A) {
   console.log(qQ.default.cyan(String(t))), console.dir(A, { depth: null });
 }
-s(D4, "logConfig");
+s(D3, "logConfig");
 
 // src/common/utils/normalize-stories.ts
 var WQ = cA(Nn(), 1);
@@ -26411,7 +26411,7 @@ var Rn = "", o0 = "**/*.@(mdx|stories.@(js|jsx|mjs|ts|tsx))", g0 = /* @__PURE__
     directory: g,
     importPathMatcher: C
   };
-}, "normalizeStoriesEntry"), v4 = /* @__PURE__ */ s((t, A) => {
+}, "normalizeStoriesEntry"), v3 = /* @__PURE__ */ s((t, A) => {
   if (!t || Array.isArray(t) && t.length === 0)
     throw new n0();
   return t.map((e) => C0(e, A));
@@ -26419,18 +26419,18 @@ var Rn = "", o0 = "**/*.@(mdx|stories.@(js|jsx|mjs|ts|tsx))", g0 = /* @__PURE__
 
 // src/common/utils/readTemplate.ts
 import { readFile as c0 } from "node:fs/promises";
-async function P4(t) {
+async function P3(t) {
   return c0(t, {
     encoding: "utf8"
   });
 }
-s(P4, "readTemplate");
+s(P3, "readTemplate");
 
 // src/common/utils/remove.ts
 var VQ = cA(ot(), 1);
 import { readConfig as I0, writeConfig as h0 } from "storybook/internal/csf-tools";
 import { logger as vn } from "storybook/internal/node-logger";
-async function T4(t, A) {
+async function T3(t, A) {
   let { packageManager: e, skipInstall: r } = A, { mainConfigPath: i, configDir: n } = Ga(A.configDir);
   if (typeof n > "u")
     throw new Error(VQ.dedent`
@@ -26451,31 +26451,31 @@ async function T4(t, A) {
     }
   }
 }
-s(T4, "removeAddon");
+s(T3, "removeAddon");
 
 // src/common/utils/symlinks.ts
-function q4() {
+function q3() {
   let { NODE_OPTIONS: t, NODE_PRESERVE_SYMLINKS: A } = process.env;
   return !!A || t?.includes("--preserve-symlinks");
 }
-s(q4, "isPreservingSymlinks");
+s(q3, "isPreservingSymlinks");
 
 // src/common/utils/template.ts
 import { existsSync as XQ, readFileSync as Ln } from "node:fs";
 import { dirname as ZQ, resolve as $Q } from "node:path";
 var Af = /* @__PURE__ */ s((t, A = {}) => Object.entries(A).reduce((e, [r, i]) => e.replace(new RegExp(`%${r}%`, "g"), i), t), "interpolate");
-function Z4(t, A) {
+function Z3(t, A) {
   let e = ZQ(v.resolve("storybook/internal/package.json")), r = Ln(`${e}/assets/server/base-preview-body.html`, "utf8"), i = $Q(t, "preview-\
 body.html"), n = r;
   return XQ(i) && (n = Ln(i, "utf8") + n), Af(n, A);
 }
-s(Z4, "getPreviewBodyTemplate");
-function $4(t, A) {
+s(Z3, "getPreviewBodyTemplate");
+function $3(t, A) {
   let e = ZQ(v.resolve("storybook/internal/package.json")), r = Ln(`${e}/assets/server/base-preview-head.html`, "utf8"), i = $Q(t, "preview-\
 head.html"), n = r;
   return XQ(i) && (n += Ln(i, "utf8")), Af(n, A);
 }
-s($4, "getPreviewHeadTemplate");
+s($3, "getPreviewHeadTemplate");
 
 // src/common/utils/validate-config.ts
 import { join as l0 } from "node:path";
@@ -27845,13 +27845,13 @@ export {
   SW as builderPackages,
   Oj as cache,
   jW as checkAddonOrder,
-  w4 as codeLog,
-  d4 as commandLog,
+  w3 as codeLog,
+  d3 as commandLog,
   hQ as commonGlobOptions,
   jg as createFileSystemCache,
   GW as createLogStream,
   QQ as extractProperFrameworkName,
-  k3 as extractProperRendererNameFromFramework,
+  k4 as extractProperRendererNameFromFramework,
   Gk as filterPresetsConfig,
   Ua as findConfigFile,
   cV as formatFileContent,
@@ -27859,7 +27859,7 @@ export {
   lQ as frameworkToRenderer,
   af as getAddonNames,
   ER as getAutoRefs,
-  E3 as getBuilderOptions,
+  E4 as getBuilderOptions,
   jQ as getChars,
   UW as getCoercedStorybookVersion,
   Ga as getConfigInfo,
@@ -27870,11 +27870,11 @@ export {
   Bl as getInterpretedFileWithExt,
   jB as getPackageDetails,
   jk as getPresets,
-  Z4 as getPreviewBodyTemplate,
-  $4 as getPreviewHeadTemplate,
+  Z3 as getPreviewBodyTemplate,
+  $3 as getPreviewHeadTemplate,
   pA as getProjectRoot,
-  Y3 as getRefs,
-  F3 as getRendererName,
+  Y4 as getRefs,
+  F4 as getRendererName,
   SV as getStoryId,
   b0 as getStoryTitle,
   qB as getStorybookConfiguration,
@@ -27882,28 +27882,28 @@ export {
   Y0 as getSyncedStorybookAddons,
   JQ as globToRegexp,
   dg as interopRequireDefault,
-  X3 as interpolate,
+  X4 as interpolate,
   iW as invalidateProjectRootCache,
   XB as isCorePackage,
-  q4 as isPreservingSymlinks,
+  q3 as isPreservingSymlinks,
   JW as isSatelliteAddon,
   _1 as loadAllPresets,
   BE as loadCustomPresets,
-  o3 as loadEnvs,
-  s4 as loadMainConfig,
-  c4 as loadManagerOrAddonsFile,
+  o4 as loadEnvs,
+  s3 as loadMainConfig,
+  c3 as loadManagerOrAddonsFile,
   Hk as loadPreset,
-  u4 as loadPreviewOrConfigFile,
-  D4 as logConfig,
+  u3 as loadPreviewOrConfigFile,
+  D3 as logConfig,
   GB as nodePathsToArray,
-  v4 as normalizeStories,
+  v3 as normalizeStories,
   C0 as normalizeStoriesEntry,
   JB as normalizeStoryPath,
-  p4 as paddedLog,
+  p3 as paddedLog,
   PW as parseList,
   of as posix,
-  P4 as readTemplate,
-  T4 as removeAddon,
+  P3 as readTemplate,
+  T3 as removeAddon,
   _a as rendererPackages,
   Jk as resolveAddonName,
   VE as resolvePathInStorybookCache,
@@ -27911,8 +27911,8 @@ export {
   KAA as scanAndTransformFiles,
   Ii as serverRequire,
   hi as serverResolve,
-  g3 as stringifyEnvs,
-  a3 as stringifyProcessEnvs,
+  g4 as stringifyEnvs,
+  a4 as stringifyProcessEnvs,
   mE as stripAbsNodeModulesPath,
   _V as syncStorybookAddons,
   JM as temporaryDirectory,

package/dist/components/index.cjs

@@ -22922,12 +22922,14 @@ var Ts = vi.styled.div(
 Ts.displayName = "Side";
 var UI = /* @__PURE__ */ o(({ children: e, className: t, scrollable: r }) => r ? /* @__PURE__ */ Bt.default.createElement(fr, { vertical: !1,
 className: t }, e) : /* @__PURE__ */ Bt.default.createElement("div", { className: t }, e), "UnstyledBar"), wi = (0, vi.styled)(UI)(
-  ({ theme: e, scrollable: t = !0 }) => ({
-    color: e.barTextColor,
+  ({ backgroundColor: e, theme: t, scrollable: r = !0 }) => ({
+    color: t.barTextColor,
     width: "100%",
-    height: 40,
+    minHeight: 40,
     flexShrink: 0,
-    overflow: t ? "auto" : "hidden",
+    scrollbarColor: `${t.barTextColor} ${e || t.barBg}`,
+    scrollbarWidth: "thin",
+    overflow: r ? "auto" : "hidden",
     overflowY: "hidden"
   }),
   ({ theme: e, border: t = !1 }) => t ? {
@@ -22946,9 +22948,9 @@ var GI = vi.styled.div(({ bgColor: e }) => ({
   backgroundColor: e || ""
 })), ao = /* @__PURE__ */ o(({ children: e, backgroundColor: t, className: r, ...n }) => {
   let [a, l] = Bt.Children.toArray(e);
-  return /* @__PURE__ */ Bt.default.createElement(wi, { className: `sb-bar ${r}`, ...n }, /* @__PURE__ */ Bt.default.createElement(GI, { bgColor: t },
-  /* @__PURE__ */ Bt.default.createElement(Ts, { scrollable: n.scrollable, left: !0 }, a), l ? /* @__PURE__ */ Bt.default.createElement(Ts, {
-  right: !0 }, l) : null));
+  return /* @__PURE__ */ Bt.default.createElement(wi, { backgroundColor: t, className: `sb-bar ${r}`, ...n }, /* @__PURE__ */ Bt.default.createElement(
+  GI, { bgColor: t }, /* @__PURE__ */ Bt.default.createElement(Ts, { scrollable: n.scrollable, left: !0 }, a), l ? /* @__PURE__ */ Bt.default.
+  createElement(Ts, { right: !0 }, l) : null));
 }, "FlexBar");
 ao.displayName = "FlexBar";
 

package/dist/components/index.d.ts

@@ -1063,6 +1063,7 @@ interface UnstyledBarProps extends ScrollAreaProps {
     scrollable?: boolean;
 }
 interface BarProps extends UnstyledBarProps {
+    backgroundColor?: string;
     border?: boolean;
 }
 declare const Bar: storybook_theming.StyledComponent<UnstyledBarProps & {

package/dist/components/index.js

@@ -12223,12 +12223,14 @@ var cl = sl.div(
 cl.displayName = "Side";
 var c6 = /* @__PURE__ */ o(({ children: e, className: t, scrollable: r }) => r ? /* @__PURE__ */ Wr.createElement(Rr, { vertical: !1, className: t },
 e) : /* @__PURE__ */ Wr.createElement("div", { className: t }, e), "UnstyledBar"), ul = sl(c6)(
-  ({ theme: e, scrollable: t = !0 }) => ({
-    color: e.barTextColor,
+  ({ backgroundColor: e, theme: t, scrollable: r = !0 }) => ({
+    color: t.barTextColor,
     width: "100%",
-    height: 40,
+    minHeight: 40,
     flexShrink: 0,
-    overflow: t ? "auto" : "hidden",
+    scrollbarColor: `${t.barTextColor} ${e || t.barBg}`,
+    scrollbarWidth: "thin",
+    overflow: r ? "auto" : "hidden",
     overflowY: "hidden"
   }),
   ({ theme: e, border: t = !1 }) => t ? {
@@ -12247,8 +12249,9 @@ var s6 = sl.div(({ bgColor: e }) => ({
   backgroundColor: e || ""
 })), No = /* @__PURE__ */ o(({ children: e, backgroundColor: t, className: r, ...n }) => {
   let [a, i] = l6.toArray(e);
-  return /* @__PURE__ */ Wr.createElement(ul, { className: `sb-bar ${r}`, ...n }, /* @__PURE__ */ Wr.createElement(s6, { bgColor: t }, /* @__PURE__ */ Wr.
-  createElement(cl, { scrollable: n.scrollable, left: !0 }, a), i ? /* @__PURE__ */ Wr.createElement(cl, { right: !0 }, i) : null));
+  return /* @__PURE__ */ Wr.createElement(ul, { backgroundColor: t, className: `sb-bar ${r}`, ...n }, /* @__PURE__ */ Wr.createElement(s6, {
+  bgColor: t }, /* @__PURE__ */ Wr.createElement(cl, { scrollable: n.scrollable, left: !0 }, a), i ? /* @__PURE__ */ Wr.createElement(cl, { right: !0 },
+  i) : null));
 }, "FlexBar");
 No.displayName = "FlexBar";