storybook 10.1.0-alpha.0 → 10.1.0-alpha.10

package/dist/_browser-chunks/{Color-7ZNS6F6B.js → Color-FQNEU7YS.js}

@@ -977,7 +977,7 @@ var require_color_convert = __commonJS({
 // ../addons/docs/src/blocks/controls/Color.tsx
 var import_color_convert = __toESM(require_color_convert(), 1);
 import React, { useCallback, useEffect, useMemo, useState } from "react";
-import { Form, TooltipNote, WithTooltip } from "storybook/internal/components";
+import { Button, Form, PopoverProvider } from "storybook/internal/components";
 import { MarkupIcon } from "@storybook/icons";
 
 // ../node_modules/es-toolkit/dist/function/debounce.mjs
@@ -1340,19 +1340,7 @@ var He = /* @__PURE__ */ __name(function(r2) {
 import { styled } from "storybook/theming";
 var Wrapper = styled.div({
   position: "relative",
-  maxWidth: 250,
-  '&[aria-readonly="true"]': {
-    opacity: 0.5
-  }
-});
-var PickerTooltip = styled(WithTooltip)({
-  position: "absolute",
-  zIndex: 1,
-  top: 4,
-  left: 4,
-  "[aria-readonly=true] &": {
-    cursor: "not-allowed"
-  }
+  maxWidth: 250
 });
 var TooltipContent = styled.div({
   width: 200,
@@ -1367,9 +1355,6 @@ var TooltipContent = styled.div({
     borderRadius: "0 0 4px 4px"
   }
 });
-var Note = styled(TooltipNote)(({ theme }) => ({
-  fontFamily: theme.typography.fonts.base
-}));
 var Swatches = styled.div({
   display: "grid",
   gridTemplateColumns: "repeat(9, 16px)",
@@ -1378,25 +1363,39 @@ var Swatches = styled.div({
   marginTop: 5,
   width: 200
 });
-var SwatchColor = styled.div(({ theme, active }) => ({
-  width: 16,
-  height: 16,
-  boxShadow: active ? `${theme.appBorderColor} 0 0 0 1px inset, ${theme.textMutedColor}50 0 0 0 4px` : `${theme.appBorderColor} 0 0 0 1px inset`,
-  borderRadius: theme.appBorderRadius
-}));
 var swatchBackground = `url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill-opacity=".05"><path d="M8 0h8v8H8zM0 8h8v8H0z"/></svg>')`;
-var Swatch = /* @__PURE__ */ __name(({ value, style, ...props }) => {
-  const backgroundImage = `linear-gradient(${value}, ${value}), ${swatchBackground}, linear-gradient(#fff, #fff)`;
-  return React.createElement(SwatchColor, { ...props, style: { ...style, backgroundImage } });
-}, "Swatch");
-var Input = styled(Form.Input)(({ theme, readOnly }) => ({
+var SwatchColor = styled(Button)(
+  ({ value, selected, theme }) => ({
+    width: 16,
+    height: 16,
+    boxShadow: selected ? `${theme.appBorderColor} 0 0 0 1px inset, ${theme.textMutedColor}50 0 0 0 4px` : `${theme.appBorderColor} 0 0 0 1px inset`,
+    border: "none",
+    borderRadius: theme.appBorderRadius,
+    "&, &:hover": {
+      background: "unset",
+      backgroundColor: "unset",
+      backgroundImage: `linear-gradient(${value}, ${value}), ${swatchBackground}, linear-gradient(hsl(0 0 100 / .4), hsl(0 0 100 / .4))`
+    }
+  })
+);
+var Input = styled(Form.Input)(({ theme }) => ({
   width: "100%",
   paddingLeft: 30,
   paddingRight: 30,
   boxSizing: "border-box",
-  fontFamily: theme.typography.fonts.base
+  fontFamily: theme.typography.fonts.base,
+  '[aria-readonly="true"] > &': {
+    background: theme.base === "light" ? theme.color.lighter : "transparent"
+  }
 }));
-var ToggleIcon = styled(MarkupIcon)(({ theme }) => ({
+var PopoverTrigger = styled(SwatchColor)(({ disabled }) => ({
+  position: "absolute",
+  top: 4,
+  left: 4,
+  zIndex: 1,
+  cursor: disabled ? "not-allowed" : "pointer"
+}));
+var CycleColorSpaceButton = styled(Button)(({ theme }) => ({
   position: "absolute",
   zIndex: 1,
   top: 6,
@@ -1625,49 +1624,69 @@ var ColorControl = /* @__PURE__ */ __name(({
   );
   const { presets, addPreset } = usePresets(presetColors ?? [], color, colorSpace);
   const Picker = ColorPicker[colorSpace];
-  const readonly = !!argType?.table?.readonly;
-  return React.createElement(Wrapper, { "aria-readonly": readonly }, React.createElement(
-    PickerTooltip,
+  const readOnly = !!argType?.table?.readonly;
+  const controlId = getControlId(name);
+  return React.createElement(Wrapper, null, React.createElement("label", { htmlFor: controlId, className: "sb-sr-only" }, name), React.createElement(
+    Input,
     {
-      startOpen,
-      trigger: readonly ? null : void 0,
-      closeOnOutsideClick: true,
+      id: controlId,
+      value,
+      onChange: (e2) => updateValue(e2.target.value),
+      onFocus: (e2) => e2.target.select(),
+      readOnly,
+      placeholder: "Choose color..."
+    }
+  ), React.createElement(
+    PopoverProvider,
+    {
+      defaultVisible: startOpen,
+      visible: readOnly ? false : void 0,
       onVisibleChange: () => color && addPreset(color),
-      tooltip: React.createElement(TooltipContent, null, React.createElement(
+      popover: React.createElement(TooltipContent, null, React.createElement(
         Picker,
         {
           color: realValue === "transparent" ? "#000000" : realValue,
           ...{ onChange: updateValue, onFocus, onBlur }
         }
       ), presets.length > 0 && React.createElement(Swatches, null, presets.map((preset, index) => React.createElement(
-        WithTooltip,
+        SwatchColor,
         {
           key: `${preset?.value || index}-${index}`,
-          hasChrome: false,
-          tooltip: React.createElement(Note, { note: preset?.keyword || preset?.value || "" })
-        },
-        React.createElement(
-          Swatch,
-          {
-            value: preset?.[colorSpace] || "",
-            active: !!(color && preset && preset[colorSpace] && id(preset[colorSpace] || "") === id(color[colorSpace])),
-            onClick: () => preset && updateValue(preset.value || "")
-          }
-        )
+          variant: "ghost",
+          padding: "small",
+          size: "small",
+          ariaLabel: "Pick this color",
+          tooltip: preset?.keyword || preset?.value || "",
+          value: preset?.value || "",
+          selected: !!(color && preset && preset[colorSpace] && id(preset[colorSpace] || "") === id(color[colorSpace])),
+          onClick: () => preset && updateValue(preset.value || "")
+        }
       ))))
     },
-    React.createElement(Swatch, { value: realValue, style: { margin: 4 } })
-  ), React.createElement(
-    Input,
+    React.createElement(
+      PopoverTrigger,
+      {
+        variant: "ghost",
+        padding: "small",
+        size: "small",
+        ariaLabel: "Open color picker",
+        value: realValue,
+        style: { margin: 4 },
+        disabled: readOnly
+      }
+    )
+  ), value ? React.createElement(
+    CycleColorSpaceButton,
     {
-      id: getControlId(name),
-      value,
-      onChange: (e2) => updateValue(e2.target.value),
-      onFocus: (e2) => e2.target.select(),
-      readOnly: readonly,
-      placeholder: "Choose color..."
-    }
-  ), value ? React.createElement(ToggleIcon, { onClick: cycleColorSpace }) : null);
+      variant: "ghost",
+      padding: "small",
+      size: "small",
+      ariaLabel: "Cycle through color spaces",
+      disabled: readOnly,
+      onClick: readOnly ? void 0 : cycleColorSpace
+    },
+    React.createElement(MarkupIcon, null)
+  ) : null);
 }, "ColorControl");
 var Color_default = ColorControl;
 export {

package/dist/_browser-chunks/{chunk-BOOOPFZF.js → WithTooltip-6NHN2GXF.js}

@@ -139,8 +139,10 @@ var require_warning = __commonJS({
 });
 
 // src/components/components/tooltip/WithTooltip.tsx
-import React8, { useCallback as useCallback4, useEffect as useEffect6, useState as useState5 } from "react";
+var import_memoizerific = __toESM(require_memoizerific(), 1);
+import React7, { useCallback as useCallback4, useEffect as useEffect6, useState as useState5 } from "react";
 import ReactDOM2 from "react-dom";
+import { deprecate } from "storybook/internal/client-logger";
 import { global } from "@storybook/global";
 
 // ../node_modules/react-popper-tooltip/dist/esm/react-popper-tooltip.js
@@ -2077,12 +2079,8 @@ function usePopperTooltip(config, popperOptions) {
 __name(usePopperTooltip, "usePopperTooltip");
 
 // src/components/components/tooltip/WithTooltip.tsx
-import { styled as styled2 } from "storybook/theming";
-
-// src/components/components/tooltip/Tooltip.tsx
-var import_memoizerific = __toESM(require_memoizerific(), 1);
-import React7 from "react";
 import { lighten, styled } from "storybook/theming";
+var { document: document2 } = global;
 var match = (0, import_memoizerific.default)(1e3)(
   (requests, actual, value, fallback = 0) => actual.split("-")[0] === requests ? value : fallback
 );
@@ -2176,14 +2174,11 @@ var Tooltip = React7.forwardRef(
   }
 );
 Tooltip.displayName = "Tooltip";
-
-// src/components/components/tooltip/WithTooltip.tsx
-var { document: document2 } = global;
-var TargetContainer = styled2.div`
+var TargetContainer = styled.div`
   display: inline-block;
   cursor: ${(props) => props.trigger === "hover" || props.trigger?.includes("hover") ? "default" : "pointer"};
 `;
-var TargetSvgContainer = styled2.g`
+var TargetSvgContainer = styled.g`
   cursor: ${(props) => props.trigger === "hover" || props.trigger?.includes("hover") ? "default" : "pointer"};
 `;
 var WithTooltipPure = /* @__PURE__ */ __name(({
@@ -2259,7 +2254,7 @@ var WithTooltipPure = /* @__PURE__ */ __name(({
     }
   );
   const portalTarget = (typeof portalContainer === "string" ? document2.querySelector(portalContainer) : portalContainer) || document2.body;
-  const tooltipComponent = isVisible ? React8.createElement(
+  const tooltipComponent = isVisible ? React7.createElement(
     Tooltip,
     {
       placement: state?.placement,
@@ -2271,7 +2266,7 @@ var WithTooltipPure = /* @__PURE__ */ __name(({
     },
     typeof tooltip === "function" ? tooltip({ onHide: /* @__PURE__ */ __name(() => onVisibleChange(false), "onHide") }) : tooltip
   ) : null;
-  return React8.createElement(React8.Fragment, null, React8.createElement(Container, { trigger, ref: setTriggerRef, ...props }, children), isVisible && ReactDOM2.createPortal(tooltipComponent, portalTarget));
+  return React7.createElement(React7.Fragment, null, React7.createElement(Container, { trigger, ref: setTriggerRef, ...props }, children), isVisible && ReactDOM2.createPortal(tooltipComponent, portalTarget));
 }, "WithTooltipPure");
 var WithToolTipState = /* @__PURE__ */ __name(({
   startOpen = false,
@@ -2326,10 +2321,23 @@ var WithToolTipState = /* @__PURE__ */ __name(({
       });
     };
   });
-  return React8.createElement(WithTooltipPure, { ...rest, visible: tooltipShown, onVisibleChange: onVisibilityChange });
+  return React7.createElement(WithTooltipPure, { ...rest, visible: tooltipShown, onVisibleChange: onVisibilityChange });
 }, "WithToolTipState");
-
+var DeprecatedPure = /* @__PURE__ */ __name((props) => {
+  deprecate(
+    "WithTooltipPure is deprecated and will be removed in Storybook 11. Please use WithTooltip instead."
+  );
+  return React7.createElement(WithTooltipPure, { ...props });
+}, "DeprecatedPure");
+var DeprecatedState = /* @__PURE__ */ __name((props) => {
+  deprecate(
+    "WithToolTipState is deprecated and will be removed in Storybook 11. Please use WithTooltip instead."
+  );
+  return React7.createElement(WithToolTipState, { ...props });
+}, "DeprecatedState");
 export {
-  WithTooltipPure,
-  WithToolTipState
+  Tooltip,
+  DeprecatedState as WithToolTipState,
+  WithToolTipState as WithTooltip,
+  DeprecatedPure as WithTooltipPure
 };

package/dist/_browser-chunks/{chunk-RNE2IUTB.js → chunk-AW46NMGV.js}

@@ -1244,7 +1244,15 @@ var ScrollAreaThumb2 = styled2(Thumb)(({ theme }) => ({
   }
 }));
 var ScrollArea2 = forwardRef4(
-  ({ children, horizontal = false, vertical = false, offset = 2, scrollbarSize = 6, className }, ref) => React11.createElement(ScrollAreaRoot, { scrollbarsize: scrollbarSize, offset, className }, React11.createElement(ScrollAreaViewport2, { ref }, children), horizontal && React11.createElement(
+  ({
+    children,
+    horizontal = false,
+    vertical = false,
+    offset = 2,
+    scrollbarSize = 6,
+    scrollPadding = 0,
+    className
+  }, ref) => React11.createElement(ScrollAreaRoot, { scrollbarsize: scrollbarSize, offset, className }, React11.createElement(ScrollAreaViewport2, { ref, style: { scrollPadding } }, children), horizontal && React11.createElement(
     ScrollAreaScrollbar2,
     {
       orientation: "horizontal",

package/dist/_browser-chunks/{chunk-C4XOKMDU.js → chunk-QMY4G4R2.js}

@@ -1,7 +1,6 @@
 import {
   curriedDarken$1,
   curriedLighten$1,
-  curriedTransparentize$1,
   rgba
 } from "./chunk-OBXWFEPB.js";
 import {
@@ -13,7 +12,7 @@ var color = {
   // Official color palette
   primary: "#FF4785",
   // coral
-  secondary: "#029CFD",
+  secondary: "#006DEB",
   // ocean
   tertiary: "#FAFBFC",
   ancillary: "#22a699",
@@ -26,27 +25,27 @@ var color = {
   ultraviolet: "#2A0481",
   // Monochrome
   lightest: "#FFFFFF",
-  lighter: "#F7FAFC",
-  light: "#EEF3F6",
-  mediumlight: "#ECF4F9",
-  medium: "#D9E8F2",
-  mediumdark: "#73828C",
-  dark: "#5C6870",
-  darker: "#454E54",
-  darkest: "#2E3438",
+  lighter: "#F6F9FC",
+  light: "#EEF2F6",
+  mediumlight: "#ECF2F9",
+  medium: "#D9E5F2",
+  mediumdark: "#737F8C",
+  dark: "#5C6570",
+  darker: "#454C54",
+  darkest: "#2E3338",
   // For borders
-  border: "hsla(203, 50%, 30%, 0.15)",
+  border: "hsla(212, 50%, 30%, 0.15)",
   // Status
   positive: "#66BF3C",
-  negative: "#FF4400",
   warning: "#E69D00",
+  negative: "#FF4400",
   critical: "#FFFFFF",
   // Text
-  defaultText: "#2E3438",
+  defaultText: "#2E3338",
   inverseText: "#FFFFFF",
-  positiveText: "#448028",
-  negativeText: "#D43900",
-  warningText: "#A15C20"
+  positiveText: "#427C27",
+  warningText: "#955B1E",
+  negativeText: "#C23400"
 };
 var background = {
   app: "#F6F9FC",
@@ -54,13 +53,12 @@ var background = {
   content: color.lightest,
   preview: color.lightest,
   gridCellSize: 10,
-  hoverable: curriedTransparentize$1(0.9, color.secondary),
-  // hover state for items in a list
+  hoverable: "#DBECFF",
   // Notification, error, and warning backgrounds
-  positive: "#E1FFD4",
-  negative: "#FEDED2",
-  warning: "#FFF5CF",
-  critical: "#FF4400"
+  positive: "#F1FFEB",
+  warning: "#FFF9EB",
+  negative: "#FFF0EB",
+  critical: "#D13800"
 };
 var typography = {
   fonts: {
@@ -113,11 +111,11 @@ var theme = {
   // Storybook-specific color palette
   colorPrimary: "#FF4785",
   // coral
-  colorSecondary: "#029CFD",
-  // ocean
+  colorSecondary: "#479DFF",
   // UI
-  appBg: "#222425",
-  appContentBg: "#1B1C1D",
+  appBg: "#1B1C1D",
+  appContentBg: "#222325",
+  appHoverBg: "#233952",
   appPreviewBg: color.lightest,
   appBorderColor: "rgba(255,255,255,.1)",
   appBorderRadius: 4,
@@ -125,22 +123,22 @@ var theme = {
   fontBase: typography.fonts.base,
   fontCode: typography.fonts.mono,
   // Text colors
-  textColor: "#C9CDCF",
-  textInverseColor: "#222425",
-  textMutedColor: "#798186",
+  textColor: "#C9CCCF",
+  textInverseColor: "#1B1C1D",
+  textMutedColor: "#95999D",
   // Toolbar default and active colors
-  barTextColor: color.mediumdark,
-  barHoverColor: color.secondary,
-  barSelectedColor: color.secondary,
-  barBg: "#292C2E",
+  barTextColor: "#95999D",
+  barHoverColor: "#70B3FF",
+  barSelectedColor: "#479DFF",
+  barBg: "#222325",
   // Form colors
-  buttonBg: "#222425",
-  buttonBorder: "rgba(255,255,255,.1)",
-  booleanBg: "#222425",
-  booleanSelectedBg: "#2E3438",
+  buttonBg: "#1B1C1D",
+  buttonBorder: "hsl(0 0 100 / 0.1)",
+  booleanBg: "#1B1C1D",
+  booleanSelectedBg: "#292B2E",
   inputBg: "#1B1C1D",
-  inputBorder: "rgba(255,255,255,.1)",
-  inputTextColor: color.lightest,
+  inputBorder: "hsl(0 0 100 / 0.1)",
+  inputTextColor: "#C9CCCF",
   inputBorderRadius: 4
 };
 var dark_default = theme;
@@ -149,13 +147,12 @@ var dark_default = theme;
 var theme2 = {
   base: "light",
   // Storybook-specific color palette
-  colorPrimary: "#FF4785",
-  // coral
-  colorSecondary: "#029CFD",
-  // ocean
+  colorPrimary: color.primary,
+  colorSecondary: color.secondary,
   // UI
   appBg: background.app,
   appContentBg: color.lightest,
+  appHoverBg: "#DBECFF",
   appPreviewBg: color.lightest,
   appBorderColor: color.border,
   appBorderRadius: 4,
@@ -167,9 +164,9 @@ var theme2 = {
   textInverseColor: color.lightest,
   textMutedColor: color.dark,
   // Toolbar default and active colors
-  barTextColor: color.mediumdark,
-  barHoverColor: color.secondary,
-  barSelectedColor: color.secondary,
+  barTextColor: color.dark,
+  barHoverColor: "#005CC7",
+  barSelectedColor: "#0063D6",
   barBg: color.lightest,
   // Form colors
   buttonBg: background.app,
@@ -236,12 +233,15 @@ var getPreferredColorScheme = /* @__PURE__ */ __name(() => {
 }, "getPreferredColorScheme");
 
 // src/theming/create.ts
-var themes = {
+var themesBase = {
   light: light_default,
-  dark: dark_default,
-  normal: light_default
+  dark: dark_default
 };
 var preferredColorScheme = getPreferredColorScheme();
+var themes = {
+  ...themesBase,
+  normal: themesBase[preferredColorScheme]
+};
 var create = /* @__PURE__ */ __name((vars = { base: preferredColorScheme }, rest) => {
   const inherit = {
     ...themes[preferredColorScheme],

package/dist/_browser-chunks/{syntaxhighlighter-DK2ODWXH.js → syntaxhighlighter-RJZASWHL.js}

@@ -1,12 +1,12 @@
-import {
-  _defineProperty,
-  _objectWithoutProperties
-} from "./chunk-L2D73C6Z.js";
 import {
   ActionBar,
   ScrollArea,
   createCopyToClipboardFunction
-} from "./chunk-RNE2IUTB.js";
+} from "./chunk-AW46NMGV.js";
+import {
+  _defineProperty,
+  _objectWithoutProperties
+} from "./chunk-L2D73C6Z.js";
 import "./chunk-VAMFPZY3.js";
 import {
   _extends

package/dist/_node-chunks/{builder-manager-OTO33TIA.js → builder-manager-HA7CYFCK.js}

@@ -1,10 +1,10 @@
-import CJS_COMPAT_NODE_URL_viqf41uklqm from 'node:url';
-import CJS_COMPAT_NODE_PATH_viqf41uklqm from 'node:path';
-import CJS_COMPAT_NODE_MODULE_viqf41uklqm from "node:module";
+import CJS_COMPAT_NODE_URL_8vqew0zn9si from 'node:url';
+import CJS_COMPAT_NODE_PATH_8vqew0zn9si from 'node:path';
+import CJS_COMPAT_NODE_MODULE_8vqew0zn9si from "node:module";
 
-var __filename = CJS_COMPAT_NODE_URL_viqf41uklqm.fileURLToPath(import.meta.url);
-var __dirname = CJS_COMPAT_NODE_PATH_viqf41uklqm.dirname(__filename);
-var require = CJS_COMPAT_NODE_MODULE_viqf41uklqm.createRequire(import.meta.url);
+var __filename = CJS_COMPAT_NODE_URL_8vqew0zn9si.fileURLToPath(import.meta.url);
+var __dirname = CJS_COMPAT_NODE_PATH_8vqew0zn9si.dirname(__filename);
+var require = CJS_COMPAT_NODE_MODULE_8vqew0zn9si.createRequire(import.meta.url);
 
 // ------------------------------------------------------------
 // end of CJS compatibility banner, injected by Storybook's esbuild configuration
@@ -13,21 +13,21 @@ import {
   BROWSER_TARGETS,
   NODE_TARGET,
   SUPPORTED_FEATURES
-} from "./chunk-6M2IPO4E.js";
+} from "./chunk-VPR5IBMG.js";
 import {
   require_build
-} from "./chunk-6C7OBGYG.js";
+} from "./chunk-4ZB555EJ.js";
 import {
   resolveModulePath,
   resolvePackageDir
-} from "./chunk-O3OJUFKU.js";
+} from "./chunk-V7VURIPB.js";
 import {
   join,
   parse
-} from "./chunk-HHTKRAIE.js";
+} from "./chunk-B2DAHWJK.js";
 import {
   slash
-} from "./chunk-L5WAZZY3.js";
+} from "./chunk-3WDAPZYQ.js";
 import {
   __commonJS,
   __esm,
@@ -36,7 +36,7 @@ import {
   __require,
   __toCommonJS,
   __toESM
-} from "./chunk-VL6WDGIU.js";
+} from "./chunk-OOI74AL3.js";
 
 // ../node_modules/tslib/tslib.es6.mjs
 var tslib_es6_exports = {};
@@ -1908,6 +1908,7 @@ var exports_default = {
     "mockChannel",
     "optionOrAltSymbol",
     "shortcutMatchesShortcut",
+    "shortcutToAriaKeyshortcuts",
     "shortcutToHumanString",
     "types",
     "useAddonState",
@@ -1937,6 +1938,7 @@ var exports_default = {
     "css",
     "darken",
     "ensure",
+    "getPreferredColorScheme",
     "ignoreSsrWarning",
     "isPropValid",
     "jsx",
@@ -2047,6 +2049,7 @@ var exports_default = {
   "storybook/internal/client-logger": ["deprecate", "logger", "once", "pretty"],
   "storybook/internal/components": [
     "A",
+    "AbstractToolbar",
     "ActionBar",
     "AddonPanel",
     "Badge",
@@ -2076,40 +2079,57 @@ var exports_default = {
     "ListItem",
     "Loader",
     "Modal",
+    "ModalDecorator",
     "OL",
     "P",
     "Placeholder",
+    "Popover",
+    "PopoverProvider",
     "Pre",
     "ProgressSpinner",
     "ResetWrapper",
     "ScrollArea",
+    "Select",
     "Separator",
     "Spaced",
     "Span",
+    "StatelessTab",
+    "StatelessTabList",
+    "StatelessTabPanel",
+    "StatelessTabsView",
     "StorybookIcon",
     "StorybookLogo",
     "SyntaxHighlighter",
     "TT",
     "TabBar",
     "TabButton",
+    "TabList",
+    "TabPanel",
     "TabWrapper",
     "Table",
     "Tabs",
     "TabsState",
+    "TabsView",
+    "ToggleButton",
+    "Toolbar",
+    "Tooltip",
     "TooltipLinkList",
     "TooltipMessage",
     "TooltipNote",
+    "TooltipProvider",
     "UL",
     "WithTooltip",
     "WithTooltipPure",
     "Zoom",
     "codeCommon",
     "components",
+    "convertToReactAriaPlacement",
     "createCopyToClipboardFunction",
     "getStoryHref",
     "interleaveSeparators",
     "nameSpaceClassNames",
     "resetComponents",
+    "useTabsState",
     "withReset"
   ],
   "storybook/internal/core-events": [

package/dist/_node-chunks/camelcase-QALD4XFE.js

@@ -0,0 +1,18 @@
+import CJS_COMPAT_NODE_URL_8vqew0zn9si from 'node:url';
+import CJS_COMPAT_NODE_PATH_8vqew0zn9si from 'node:path';
+import CJS_COMPAT_NODE_MODULE_8vqew0zn9si from "node:module";
+
+var __filename = CJS_COMPAT_NODE_URL_8vqew0zn9si.fileURLToPath(import.meta.url);
+var __dirname = CJS_COMPAT_NODE_PATH_8vqew0zn9si.dirname(__filename);
+var require = CJS_COMPAT_NODE_MODULE_8vqew0zn9si.createRequire(import.meta.url);
+
+// ------------------------------------------------------------
+// end of CJS compatibility banner, injected by Storybook's esbuild configuration
+// ------------------------------------------------------------
+import {
+  camelCase
+} from "./chunk-Q52PVUSU.js";
+import "./chunk-OOI74AL3.js";
+export {
+  camelCase as default
+};