npm - @storybook/addon-docs - Versions diffs - 10.5.0-alpha.9 → 10.5.0-beta.0 - Mend

@storybook/addon-docs 10.5.0-alpha.9 → 10.5.0-beta.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (14) hide show

package/dist/_browser-chunks/{Color-AVMI7ZZZ.js → Color-6AOWCN3U.js} RENAMED Viewed

@@ -1029,7 +1029,8 @@ var Wrapper = styled.div({
   presetColors,
   maxPresetColors,
   startOpen = !1,
-  argType
+  argType,
+  required
 }) => {
   let debouncedOnChange = useCallback(debounce(onChange, 200), [onChange]), { value, realValue, updateValue, color, colorSpace, cycleColorSpace } = useColorInput(
     initialValue,
@@ -1043,6 +1044,7 @@ var Wrapper = styled.div({
       onChange: (e2) => updateValue(e2.target.value),
       onFocus: (e2) => e2.target.select(),
       readOnly,
+      "aria-required": required || void 0,
       placeholder: "Choose color..."
     }
   ), React.createElement(

package/dist/_node-chunks/{chunk-V5BW74Q5.js → chunk-6COZ6RQD.js} RENAMED Viewed

@@ -1,10 +1,10 @@
-import CJS_COMPAT_NODE_URL_62gi7e79md7 from 'node:url';
-import CJS_COMPAT_NODE_PATH_62gi7e79md7 from 'node:path';
-import CJS_COMPAT_NODE_MODULE_62gi7e79md7 from "node:module";
+import CJS_COMPAT_NODE_URL_6kmgb85uu0i from 'node:url';
+import CJS_COMPAT_NODE_PATH_6kmgb85uu0i from 'node:path';
+import CJS_COMPAT_NODE_MODULE_6kmgb85uu0i from "node:module";
-var __filename = CJS_COMPAT_NODE_URL_62gi7e79md7.fileURLToPath(import.meta.url);
-var __dirname = CJS_COMPAT_NODE_PATH_62gi7e79md7.dirname(__filename);
-var require = CJS_COMPAT_NODE_MODULE_62gi7e79md7.createRequire(import.meta.url);
+var __filename = CJS_COMPAT_NODE_URL_6kmgb85uu0i.fileURLToPath(import.meta.url);
+var __dirname = CJS_COMPAT_NODE_PATH_6kmgb85uu0i.dirname(__filename);
+var require = CJS_COMPAT_NODE_MODULE_6kmgb85uu0i.createRequire(import.meta.url);
 // ------------------------------------------------------------
 // end of CJS compatibility banner, injected by Storybook's esbuild configuration
@@ -12,17 +12,17 @@ var require = CJS_COMPAT_NODE_MODULE_62gi7e79md7.createRequire(import.meta.url);
 import {
   esm_default,
   stringify
-} from "./chunk-URSDNTC6.js";
+} from "./chunk-G6HS65QC.js";
 import {
   visit
-} from "./chunk-E7HXF55G.js";
+} from "./chunk-AIK622WF.js";
 import {
   __commonJS,
   __esm,
   __export,
   __toCommonJS,
   __toESM
-} from "./chunk-UXKGP3JV.js";
+} from "./chunk-N5QKP6IS.js";
 // ../../../node_modules/acorn-jsx/xhtml.js
 var require_xhtml = __commonJS({

package/dist/_node-chunks/{chunk-E7HXF55G.js → chunk-AIK622WF.js} RENAMED Viewed

@@ -1,10 +1,10 @@
-import CJS_COMPAT_NODE_URL_62gi7e79md7 from 'node:url';
-import CJS_COMPAT_NODE_PATH_62gi7e79md7 from 'node:path';
-import CJS_COMPAT_NODE_MODULE_62gi7e79md7 from "node:module";
+import CJS_COMPAT_NODE_URL_6kmgb85uu0i from 'node:url';
+import CJS_COMPAT_NODE_PATH_6kmgb85uu0i from 'node:path';
+import CJS_COMPAT_NODE_MODULE_6kmgb85uu0i from "node:module";
-var __filename = CJS_COMPAT_NODE_URL_62gi7e79md7.fileURLToPath(import.meta.url);
-var __dirname = CJS_COMPAT_NODE_PATH_62gi7e79md7.dirname(__filename);
-var require = CJS_COMPAT_NODE_MODULE_62gi7e79md7.createRequire(import.meta.url);
+var __filename = CJS_COMPAT_NODE_URL_6kmgb85uu0i.fileURLToPath(import.meta.url);
+var __dirname = CJS_COMPAT_NODE_PATH_6kmgb85uu0i.dirname(__filename);
+var require = CJS_COMPAT_NODE_MODULE_6kmgb85uu0i.createRequire(import.meta.url);
 // ------------------------------------------------------------
 // end of CJS compatibility banner, injected by Storybook's esbuild configuration

package/dist/_node-chunks/{chunk-URSDNTC6.js → chunk-G6HS65QC.js} RENAMED Viewed

@@ -1,10 +1,10 @@
-import CJS_COMPAT_NODE_URL_62gi7e79md7 from 'node:url';
-import CJS_COMPAT_NODE_PATH_62gi7e79md7 from 'node:path';
-import CJS_COMPAT_NODE_MODULE_62gi7e79md7 from "node:module";
+import CJS_COMPAT_NODE_URL_6kmgb85uu0i from 'node:url';
+import CJS_COMPAT_NODE_PATH_6kmgb85uu0i from 'node:path';
+import CJS_COMPAT_NODE_MODULE_6kmgb85uu0i from "node:module";
-var __filename = CJS_COMPAT_NODE_URL_62gi7e79md7.fileURLToPath(import.meta.url);
-var __dirname = CJS_COMPAT_NODE_PATH_62gi7e79md7.dirname(__filename);
-var require = CJS_COMPAT_NODE_MODULE_62gi7e79md7.createRequire(import.meta.url);
+var __filename = CJS_COMPAT_NODE_URL_6kmgb85uu0i.fileURLToPath(import.meta.url);
+var __dirname = CJS_COMPAT_NODE_PATH_6kmgb85uu0i.dirname(__filename);
+var require = CJS_COMPAT_NODE_MODULE_6kmgb85uu0i.createRequire(import.meta.url);
 // ------------------------------------------------------------
 // end of CJS compatibility banner, injected by Storybook's esbuild configuration

package/dist/_node-chunks/{chunk-UXKGP3JV.js → chunk-N5QKP6IS.js} RENAMED Viewed

@@ -1,10 +1,10 @@
-import CJS_COMPAT_NODE_URL_62gi7e79md7 from 'node:url';
-import CJS_COMPAT_NODE_PATH_62gi7e79md7 from 'node:path';
-import CJS_COMPAT_NODE_MODULE_62gi7e79md7 from "node:module";
+import CJS_COMPAT_NODE_URL_6kmgb85uu0i from 'node:url';
+import CJS_COMPAT_NODE_PATH_6kmgb85uu0i from 'node:path';
+import CJS_COMPAT_NODE_MODULE_6kmgb85uu0i from "node:module";
-var __filename = CJS_COMPAT_NODE_URL_62gi7e79md7.fileURLToPath(import.meta.url);
-var __dirname = CJS_COMPAT_NODE_PATH_62gi7e79md7.dirname(__filename);
-var require = CJS_COMPAT_NODE_MODULE_62gi7e79md7.createRequire(import.meta.url);
+var __filename = CJS_COMPAT_NODE_URL_6kmgb85uu0i.fileURLToPath(import.meta.url);
+var __dirname = CJS_COMPAT_NODE_PATH_6kmgb85uu0i.dirname(__filename);
+var require = CJS_COMPAT_NODE_MODULE_6kmgb85uu0i.createRequire(import.meta.url);
 // ------------------------------------------------------------
 // end of CJS compatibility banner, injected by Storybook's esbuild configuration

package/dist/_node-chunks/{mdx-plugin-Y733C4JM.js → mdx-plugin-HJBCBRQH.js} RENAMED Viewed

@@ -1,23 +1,23 @@
-import CJS_COMPAT_NODE_URL_62gi7e79md7 from 'node:url';
-import CJS_COMPAT_NODE_PATH_62gi7e79md7 from 'node:path';
-import CJS_COMPAT_NODE_MODULE_62gi7e79md7 from "node:module";
+import CJS_COMPAT_NODE_URL_6kmgb85uu0i from 'node:url';
+import CJS_COMPAT_NODE_PATH_6kmgb85uu0i from 'node:path';
+import CJS_COMPAT_NODE_MODULE_6kmgb85uu0i from "node:module";
-var __filename = CJS_COMPAT_NODE_URL_62gi7e79md7.fileURLToPath(import.meta.url);
-var __dirname = CJS_COMPAT_NODE_PATH_62gi7e79md7.dirname(__filename);
-var require = CJS_COMPAT_NODE_MODULE_62gi7e79md7.createRequire(import.meta.url);
+var __filename = CJS_COMPAT_NODE_URL_6kmgb85uu0i.fileURLToPath(import.meta.url);
+var __dirname = CJS_COMPAT_NODE_PATH_6kmgb85uu0i.dirname(__filename);
+var require = CJS_COMPAT_NODE_MODULE_6kmgb85uu0i.createRequire(import.meta.url);
 // ------------------------------------------------------------
 // end of CJS compatibility banner, injected by Storybook's esbuild configuration
 // ------------------------------------------------------------
 import {
   compile
-} from "./chunk-V5BW74Q5.js";
-import "./chunk-URSDNTC6.js";
-import "./chunk-E7HXF55G.js";
+} from "./chunk-6COZ6RQD.js";
+import "./chunk-G6HS65QC.js";
+import "./chunk-AIK622WF.js";
 import {
   __commonJS,
   __toESM
-} from "./chunk-UXKGP3JV.js";
+} from "./chunk-N5QKP6IS.js";
 // ../../../node_modules/@rollup/pluginutils/node_modules/picomatch/lib/constants.js
 var require_constants = __commonJS({
@@ -1153,7 +1153,7 @@ var hasStringIsWellFormed = "isWellFormed" in String.prototype;
 // src/mdx-plugin.ts
 async function mdxPlugin(options) {
-  let include = /\.mdx$/, filter = createFilter(include), { presets } = options, mdxPluginOptions = (await presets.apply("options", {}))?.mdxPluginOptions, rehypeSlug = (await import("./rehype-slug-4727ZT4J.js")).default, rehypeExternalLinks = (await import("./rehype-external-links-KRDD3ZWL.js")).default;
+  let include = /\.mdx$/, filter = createFilter(include), { presets } = options, mdxPluginOptions = (await presets.apply("options", {}))?.mdxPluginOptions, rehypeSlug = (await import("./rehype-slug-BYEJJO5R.js")).default, rehypeExternalLinks = (await import("./rehype-external-links-ZN3EPMI5.js")).default;
   return {
     name: "storybook:mdx-plugin",
     enforce: "pre",

package/dist/_node-chunks/{rehype-external-links-KRDD3ZWL.js → rehype-external-links-ZN3EPMI5.js} RENAMED Viewed

@@ -1,10 +1,10 @@
-import CJS_COMPAT_NODE_URL_62gi7e79md7 from 'node:url';
-import CJS_COMPAT_NODE_PATH_62gi7e79md7 from 'node:path';
-import CJS_COMPAT_NODE_MODULE_62gi7e79md7 from "node:module";
+import CJS_COMPAT_NODE_URL_6kmgb85uu0i from 'node:url';
+import CJS_COMPAT_NODE_PATH_6kmgb85uu0i from 'node:path';
+import CJS_COMPAT_NODE_MODULE_6kmgb85uu0i from "node:module";
-var __filename = CJS_COMPAT_NODE_URL_62gi7e79md7.fileURLToPath(import.meta.url);
-var __dirname = CJS_COMPAT_NODE_PATH_62gi7e79md7.dirname(__filename);
-var require = CJS_COMPAT_NODE_MODULE_62gi7e79md7.createRequire(import.meta.url);
+var __filename = CJS_COMPAT_NODE_URL_6kmgb85uu0i.fileURLToPath(import.meta.url);
+var __dirname = CJS_COMPAT_NODE_PATH_6kmgb85uu0i.dirname(__filename);
+var require = CJS_COMPAT_NODE_MODULE_6kmgb85uu0i.createRequire(import.meta.url);
 // ------------------------------------------------------------
 // end of CJS compatibility banner, injected by Storybook's esbuild configuration
@@ -12,11 +12,11 @@ var require = CJS_COMPAT_NODE_MODULE_62gi7e79md7.createRequire(import.meta.url);
 import {
   esm_default,
   parse
-} from "./chunk-URSDNTC6.js";
+} from "./chunk-G6HS65QC.js";
 import {
   visit
-} from "./chunk-E7HXF55G.js";
-import "./chunk-UXKGP3JV.js";
+} from "./chunk-AIK622WF.js";
+import "./chunk-N5QKP6IS.js";
 // ../../../node_modules/hast-util-is-element/lib/index.js
 var convertElement = (

package/dist/_node-chunks/{rehype-slug-4727ZT4J.js → rehype-slug-BYEJJO5R.js} RENAMED Viewed

@@ -1,18 +1,18 @@
-import CJS_COMPAT_NODE_URL_62gi7e79md7 from 'node:url';
-import CJS_COMPAT_NODE_PATH_62gi7e79md7 from 'node:path';
-import CJS_COMPAT_NODE_MODULE_62gi7e79md7 from "node:module";
+import CJS_COMPAT_NODE_URL_6kmgb85uu0i from 'node:url';
+import CJS_COMPAT_NODE_PATH_6kmgb85uu0i from 'node:path';
+import CJS_COMPAT_NODE_MODULE_6kmgb85uu0i from "node:module";
-var __filename = CJS_COMPAT_NODE_URL_62gi7e79md7.fileURLToPath(import.meta.url);
-var __dirname = CJS_COMPAT_NODE_PATH_62gi7e79md7.dirname(__filename);
-var require = CJS_COMPAT_NODE_MODULE_62gi7e79md7.createRequire(import.meta.url);
+var __filename = CJS_COMPAT_NODE_URL_6kmgb85uu0i.fileURLToPath(import.meta.url);
+var __dirname = CJS_COMPAT_NODE_PATH_6kmgb85uu0i.dirname(__filename);
+var require = CJS_COMPAT_NODE_MODULE_6kmgb85uu0i.createRequire(import.meta.url);
 // ------------------------------------------------------------
 // end of CJS compatibility banner, injected by Storybook's esbuild configuration
 // ------------------------------------------------------------
 import {
   visit
-} from "./chunk-E7HXF55G.js";
-import "./chunk-UXKGP3JV.js";
+} from "./chunk-AIK622WF.js";
+import "./chunk-N5QKP6IS.js";
 // ../../../node_modules/github-slugger/regex.js
 var regex = /[\0-\x1F!-,\.\/:-@\[-\^`\{-\xA9\xAB-\xB4\xB6-\xB9\xBB-\xBF\xD7\xF7\u02C2-\u02C5\u02D2-\u02DF\u02E5-\u02EB\u02ED\u02EF-\u02FF\u0375\u0378\u0379\u037E\u0380-\u0385\u0387\u038B\u038D\u03A2\u03F6\u0482\u0530\u0557\u0558\u055A-\u055F\u0589-\u0590\u05BE\u05C0\u05C3\u05C6\u05C8-\u05CF\u05EB-\u05EE\u05F3-\u060F\u061B-\u061F\u066A-\u066D\u06D4\u06DD\u06DE\u06E9\u06FD\u06FE\u0700-\u070F\u074B\u074C\u07B2-\u07BF\u07F6-\u07F9\u07FB\u07FC\u07FE\u07FF\u082E-\u083F\u085C-\u085F\u086B-\u089F\u08B5\u08C8-\u08D2\u08E2\u0964\u0965\u0970\u0984\u098D\u098E\u0991\u0992\u09A9\u09B1\u09B3-\u09B5\u09BA\u09BB\u09C5\u09C6\u09C9\u09CA\u09CF-\u09D6\u09D8-\u09DB\u09DE\u09E4\u09E5\u09F2-\u09FB\u09FD\u09FF\u0A00\u0A04\u0A0B-\u0A0E\u0A11\u0A12\u0A29\u0A31\u0A34\u0A37\u0A3A\u0A3B\u0A3D\u0A43-\u0A46\u0A49\u0A4A\u0A4E-\u0A50\u0A52-\u0A58\u0A5D\u0A5F-\u0A65\u0A76-\u0A80\u0A84\u0A8E\u0A92\u0AA9\u0AB1\u0AB4\u0ABA\u0ABB\u0AC6\u0ACA\u0ACE\u0ACF\u0AD1-\u0ADF\u0AE4\u0AE5\u0AF0-\u0AF8\u0B00\u0B04\u0B0D\u0B0E\u0B11\u0B12\u0B29\u0B31\u0B34\u0B3A\u0B3B\u0B45\u0B46\u0B49\u0B4A\u0B4E-\u0B54\u0B58-\u0B5B\u0B5E\u0B64\u0B65\u0B70\u0B72-\u0B81\u0B84\u0B8B-\u0B8D\u0B91\u0B96-\u0B98\u0B9B\u0B9D\u0BA0-\u0BA2\u0BA5-\u0BA7\u0BAB-\u0BAD\u0BBA-\u0BBD\u0BC3-\u0BC5\u0BC9\u0BCE\u0BCF\u0BD1-\u0BD6\u0BD8-\u0BE5\u0BF0-\u0BFF\u0C0D\u0C11\u0C29\u0C3A-\u0C3C\u0C45\u0C49\u0C4E-\u0C54\u0C57\u0C5B-\u0C5F\u0C64\u0C65\u0C70-\u0C7F\u0C84\u0C8D\u0C91\u0CA9\u0CB4\u0CBA\u0CBB\u0CC5\u0CC9\u0CCE-\u0CD4\u0CD7-\u0CDD\u0CDF\u0CE4\u0CE5\u0CF0\u0CF3-\u0CFF\u0D0D\u0D11\u0D45\u0D49\u0D4F-\u0D53\u0D58-\u0D5E\u0D64\u0D65\u0D70-\u0D79\u0D80\u0D84\u0D97-\u0D99\u0DB2\u0DBC\u0DBE\u0DBF\u0DC7-\u0DC9\u0DCB-\u0DCE\u0DD5\u0DD7\u0DE0-\u0DE5\u0DF0\u0DF1\u0DF4-\u0E00\u0E3B-\u0E3F\u0E4F\u0E5A-\u0E80\u0E83\u0E85\u0E8B\u0EA4\u0EA6\u0EBE\u0EBF\u0EC5\u0EC7\u0ECE\u0ECF\u0EDA\u0EDB\u0EE0-\u0EFF\u0F01-\u0F17\u0F1A-\u0F1F\u0F2A-\u0F34\u0F36\u0F38\u0F3A-\u0F3D\u0F48\u0F6D-\u0F70\u0F85\u0F98\u0FBD-\u0FC5\u0FC7-\u0FFF\u104A-\u104F\u109E\u109F\u10C6\u10C8-\u10CC\u10CE\u10CF\u10FB\u1249\u124E\u124F\u1257\u1259\u125E\u125F\u1289\u128E\u128F\u12B1\u12B6\u12B7\u12BF\u12C1\u12C6\u12C7\u12D7\u1311\u1316\u1317\u135B\u135C\u1360-\u137F\u1390-\u139F\u13F6\u13F7\u13FE-\u1400\u166D\u166E\u1680\u169B-\u169F\u16EB-\u16ED\u16F9-\u16FF\u170D\u1715-\u171F\u1735-\u173F\u1754-\u175F\u176D\u1771\u1774-\u177F\u17D4-\u17D6\u17D8-\u17DB\u17DE\u17DF\u17EA-\u180A\u180E\u180F\u181A-\u181F\u1879-\u187F\u18AB-\u18AF\u18F6-\u18FF\u191F\u192C-\u192F\u193C-\u1945\u196E\u196F\u1975-\u197F\u19AC-\u19AF\u19CA-\u19CF\u19DA-\u19FF\u1A1C-\u1A1F\u1A5F\u1A7D\u1A7E\u1A8A-\u1A8F\u1A9A-\u1AA6\u1AA8-\u1AAF\u1AC1-\u1AFF\u1B4C-\u1B4F\u1B5A-\u1B6A\u1B74-\u1B7F\u1BF4-\u1BFF\u1C38-\u1C3F\u1C4A-\u1C4C\u1C7E\u1C7F\u1C89-\u1C8F\u1CBB\u1CBC\u1CC0-\u1CCF\u1CD3\u1CFB-\u1CFF\u1DFA\u1F16\u1F17\u1F1E\u1F1F\u1F46\u1F47\u1F4E\u1F4F\u1F58\u1F5A\u1F5C\u1F5E\u1F7E\u1F7F\u1FB5\u1FBD\u1FBF-\u1FC1\u1FC5\u1FCD-\u1FCF\u1FD4\u1FD5\u1FDC-\u1FDF\u1FED-\u1FF1\u1FF5\u1FFD-\u203E\u2041-\u2053\u2055-\u2070\u2072-\u207E\u2080-\u208F\u209D-\u20CF\u20F1-\u2101\u2103-\u2106\u2108\u2109\u2114\u2116-\u2118\u211E-\u2123\u2125\u2127\u2129\u212E\u213A\u213B\u2140-\u2144\u214A-\u214D\u214F-\u215F\u2189-\u24B5\u24EA-\u2BFF\u2C2F\u2C5F\u2CE5-\u2CEA\u2CF4-\u2CFF\u2D26\u2D28-\u2D2C\u2D2E\u2D2F\u2D68-\u2D6E\u2D70-\u2D7E\u2D97-\u2D9F\u2DA7\u2DAF\u2DB7\u2DBF\u2DC7\u2DCF\u2DD7\u2DDF\u2E00-\u2E2E\u2E30-\u3004\u3008-\u3020\u3030\u3036\u3037\u303D-\u3040\u3097\u3098\u309B\u309C\u30A0\u30FB\u3100-\u3104\u3130\u318F-\u319F\u31C0-\u31EF\u3200-\u33FF\u4DC0-\u4DFF\u9FFD-\u9FFF\uA48D-\uA4CF\uA4FE\uA4FF\uA60D-\uA60F\uA62C-\uA63F\uA673\uA67E\uA6F2-\uA716\uA720\uA721\uA789\uA78A\uA7C0\uA7C1\uA7CB-\uA7F4\uA828-\uA82B\uA82D-\uA83F\uA874-\uA87F\uA8C6-\uA8CF\uA8DA-\uA8DF\uA8F8-\uA8FA\uA8FC\uA92E\uA92F\uA954-\uA95F\uA97D-\uA97F\uA9C1-\uA9CE\uA9DA-\uA9DF\uA9FF\uAA37-\uAA3F\uAA4E\uAA4F\uAA5A-\uAA5F\uAA77-\uAA79\uAAC3-\uAADA\uAADE\uAADF\uAAF0\uAAF1\uAAF7-\uAB00\uAB07\uAB08\uAB0F\uAB10\uAB17-\uAB1F\uAB27\uAB2F\uAB5B\uAB6A-\uAB6F\uABEB\uABEE\uABEF\uABFA-\uABFF\uD7A4-\uD7AF\uD7C7-\uD7CA\uD7FC-\uD7FF\uE000-\uF8FF\uFA6E\uFA6F\uFADA-\uFAFF\uFB07-\uFB12\uFB18-\uFB1C\uFB29\uFB37\uFB3D\uFB3F\uFB42\uFB45\uFBB2-\uFBD2\uFD3E-\uFD4F\uFD90\uFD91\uFDC8-\uFDEF\uFDFC-\uFDFF\uFE10-\uFE1F\uFE30-\uFE32\uFE35-\uFE4C\uFE50-\uFE6F\uFE75\uFEFD-\uFF0F\uFF1A-\uFF20\uFF3B-\uFF3E\uFF40\uFF5B-\uFF65\uFFBF-\uFFC1\uFFC8\uFFC9\uFFD0\uFFD1\uFFD8\uFFD9\uFFDD-\uFFFF]|\uD800[\uDC0C\uDC27\uDC3B\uDC3E\uDC4E\uDC4F\uDC5E-\uDC7F\uDCFB-\uDD3F\uDD75-\uDDFC\uDDFE-\uDE7F\uDE9D-\uDE9F\uDED1-\uDEDF\uDEE1-\uDEFF\uDF20-\uDF2C\uDF4B-\uDF4F\uDF7B-\uDF7F\uDF9E\uDF9F\uDFC4-\uDFC7\uDFD0\uDFD6-\uDFFF]|\uD801[\uDC9E\uDC9F\uDCAA-\uDCAF\uDCD4-\uDCD7\uDCFC-\uDCFF\uDD28-\uDD2F\uDD64-\uDDFF\uDF37-\uDF3F\uDF56-\uDF5F\uDF68-\uDFFF]|\uD802[\uDC06\uDC07\uDC09\uDC36\uDC39-\uDC3B\uDC3D\uDC3E\uDC56-\uDC5F\uDC77-\uDC7F\uDC9F-\uDCDF\uDCF3\uDCF6-\uDCFF\uDD16-\uDD1F\uDD3A-\uDD7F\uDDB8-\uDDBD\uDDC0-\uDDFF\uDE04\uDE07-\uDE0B\uDE14\uDE18\uDE36\uDE37\uDE3B-\uDE3E\uDE40-\uDE5F\uDE7D-\uDE7F\uDE9D-\uDEBF\uDEC8\uDEE7-\uDEFF\uDF36-\uDF3F\uDF56-\uDF5F\uDF73-\uDF7F\uDF92-\uDFFF]|\uD803[\uDC49-\uDC7F\uDCB3-\uDCBF\uDCF3-\uDCFF\uDD28-\uDD2F\uDD3A-\uDE7F\uDEAA\uDEAD-\uDEAF\uDEB2-\uDEFF\uDF1D-\uDF26\uDF28-\uDF2F\uDF51-\uDFAF\uDFC5-\uDFDF\uDFF7-\uDFFF]|\uD804[\uDC47-\uDC65\uDC70-\uDC7E\uDCBB-\uDCCF\uDCE9-\uDCEF\uDCFA-\uDCFF\uDD35\uDD40-\uDD43\uDD48-\uDD4F\uDD74\uDD75\uDD77-\uDD7F\uDDC5-\uDDC8\uDDCD\uDDDB\uDDDD-\uDDFF\uDE12\uDE38-\uDE3D\uDE3F-\uDE7F\uDE87\uDE89\uDE8E\uDE9E\uDEA9-\uDEAF\uDEEB-\uDEEF\uDEFA-\uDEFF\uDF04\uDF0D\uDF0E\uDF11\uDF12\uDF29\uDF31\uDF34\uDF3A\uDF45\uDF46\uDF49\uDF4A\uDF4E\uDF4F\uDF51-\uDF56\uDF58-\uDF5C\uDF64\uDF65\uDF6D-\uDF6F\uDF75-\uDFFF]|\uD805[\uDC4B-\uDC4F\uDC5A-\uDC5D\uDC62-\uDC7F\uDCC6\uDCC8-\uDCCF\uDCDA-\uDD7F\uDDB6\uDDB7\uDDC1-\uDDD7\uDDDE-\uDDFF\uDE41-\uDE43\uDE45-\uDE4F\uDE5A-\uDE7F\uDEB9-\uDEBF\uDECA-\uDEFF\uDF1B\uDF1C\uDF2C-\uDF2F\uDF3A-\uDFFF]|\uD806[\uDC3B-\uDC9F\uDCEA-\uDCFE\uDD07\uDD08\uDD0A\uDD0B\uDD14\uDD17\uDD36\uDD39\uDD3A\uDD44-\uDD4F\uDD5A-\uDD9F\uDDA8\uDDA9\uDDD8\uDDD9\uDDE2\uDDE5-\uDDFF\uDE3F-\uDE46\uDE48-\uDE4F\uDE9A-\uDE9C\uDE9E-\uDEBF\uDEF9-\uDFFF]|\uD807[\uDC09\uDC37\uDC41-\uDC4F\uDC5A-\uDC71\uDC90\uDC91\uDCA8\uDCB7-\uDCFF\uDD07\uDD0A\uDD37-\uDD39\uDD3B\uDD3E\uDD48-\uDD4F\uDD5A-\uDD5F\uDD66\uDD69\uDD8F\uDD92\uDD99-\uDD9F\uDDAA-\uDEDF\uDEF7-\uDFAF\uDFB1-\uDFFF]|\uD808[\uDF9A-\uDFFF]|\uD809[\uDC6F-\uDC7F\uDD44-\uDFFF]|[\uD80A\uD80B\uD80E-\uD810\uD812-\uD819\uD824-\uD82B\uD82D\uD82E\uD830-\uD833\uD837\uD839\uD83D\uD83F\uD87B-\uD87D\uD87F\uD885-\uDB3F\uDB41-\uDBFF][\uDC00-\uDFFF]|\uD80D[\uDC2F-\uDFFF]|\uD811[\uDE47-\uDFFF]|\uD81A[\uDE39-\uDE3F\uDE5F\uDE6A-\uDECF\uDEEE\uDEEF\uDEF5-\uDEFF\uDF37-\uDF3F\uDF44-\uDF4F\uDF5A-\uDF62\uDF78-\uDF7C\uDF90-\uDFFF]|\uD81B[\uDC00-\uDE3F\uDE80-\uDEFF\uDF4B-\uDF4E\uDF88-\uDF8E\uDFA0-\uDFDF\uDFE2\uDFE5-\uDFEF\uDFF2-\uDFFF]|\uD821[\uDFF8-\uDFFF]|\uD823[\uDCD6-\uDCFF\uDD09-\uDFFF]|\uD82C[\uDD1F-\uDD4F\uDD53-\uDD63\uDD68-\uDD6F\uDEFC-\uDFFF]|\uD82F[\uDC6B-\uDC6F\uDC7D-\uDC7F\uDC89-\uDC8F\uDC9A-\uDC9C\uDC9F-\uDFFF]|\uD834[\uDC00-\uDD64\uDD6A-\uDD6C\uDD73-\uDD7A\uDD83\uDD84\uDD8C-\uDDA9\uDDAE-\uDE41\uDE45-\uDFFF]|\uD835[\uDC55\uDC9D\uDCA0\uDCA1\uDCA3\uDCA4\uDCA7\uDCA8\uDCAD\uDCBA\uDCBC\uDCC4\uDD06\uDD0B\uDD0C\uDD15\uDD1D\uDD3A\uDD3F\uDD45\uDD47-\uDD49\uDD51\uDEA6\uDEA7\uDEC1\uDEDB\uDEFB\uDF15\uDF35\uDF4F\uDF6F\uDF89\uDFA9\uDFC3\uDFCC\uDFCD]|\uD836[\uDC00-\uDDFF\uDE37-\uDE3A\uDE6D-\uDE74\uDE76-\uDE83\uDE85-\uDE9A\uDEA0\uDEB0-\uDFFF]|\uD838[\uDC07\uDC19\uDC1A\uDC22\uDC25\uDC2B-\uDCFF\uDD2D-\uDD2F\uDD3E\uDD3F\uDD4A-\uDD4D\uDD4F-\uDEBF\uDEFA-\uDFFF]|\uD83A[\uDCC5-\uDCCF\uDCD7-\uDCFF\uDD4C-\uDD4F\uDD5A-\uDFFF]|\uD83B[\uDC00-\uDDFF\uDE04\uDE20\uDE23\uDE25\uDE26\uDE28\uDE33\uDE38\uDE3A\uDE3C-\uDE41\uDE43-\uDE46\uDE48\uDE4A\uDE4C\uDE50\uDE53\uDE55\uDE56\uDE58\uDE5A\uDE5C\uDE5E\uDE60\uDE63\uDE65\uDE66\uDE6B\uDE73\uDE78\uDE7D\uDE7F\uDE8A\uDE9C-\uDEA0\uDEA4\uDEAA\uDEBC-\uDFFF]|\uD83C[\uDC00-\uDD2F\uDD4A-\uDD4F\uDD6A-\uDD6F\uDD8A-\uDFFF]|\uD83E[\uDC00-\uDFEF\uDFFA-\uDFFF]|\uD869[\uDEDE-\uDEFF]|\uD86D[\uDF35-\uDF3F]|\uD86E[\uDC1E\uDC1F]|\uD873[\uDEA2-\uDEAF]|\uD87A[\uDFE1-\uDFFF]|\uD87E[\uDE1E-\uDFFF]|\uD884[\uDF4B-\uDFFF]|\uDB40[\uDC00-\uDCFF\uDDF0-\uDFFF]/g;

package/dist/blocks.d.ts CHANGED Viewed

@@ -58,6 +58,7 @@ interface ArgsTableOptionProps {
     sort?: SortType;
     storyId?: string;
     controlsId?: string;
+    docsLang?: string;
 }
 interface ArgsTableDataProps {
     rows: ArgTypes$1;
@@ -959,6 +960,8 @@ interface ControlProps<T> {
     value?: T;
     defaultValue?: T;
     argType?: ArgType;
+    /** Whether the underlying arg is required; surfaced as `aria-required` on the control's input. */
+    required?: boolean;
     onChange: (value?: T) => T | void;
     onFocus?: (evt: any) => void;
     onBlur?: (evt: any) => void;

package/dist/blocks.js CHANGED Viewed

@@ -14,7 +14,7 @@ import {
 import "./_browser-chunks/chunk-UAWMPV5J.js";
 // src/blocks/components/ArgsTable/ArgsTable.tsx
-import React23, { useCallback as useCallback6, useEffect as useEffect8, useRef as useRef5, useState as useState11 } from "react";
+import React23, { useCallback as useCallback6, useEffect as useEffect8, useRef as useRef5, useState as useState10 } from "react";
 import { once } from "storybook/internal/client-logger";
 import { Button as Button5, Link as Link3, ResetWrapper } from "storybook/internal/components";
 import { includeConditionalArg } from "storybook/internal/csf";
@@ -189,7 +189,7 @@ var CASE_SPLIT_PATTERN = new RegExp("\\p{Lu}?\\p{Ll}+|[0-9]+|\\p{Lu}+(?!\\p{Ll})
 import { styled as styled18 } from "storybook/theming";
 // src/blocks/components/ArgsTable/ArgRow.tsx
-import React19, { useState as useState8 } from "react";
+import React19 from "react";
 import { codeCommon as codeCommon3 } from "storybook/internal/components";
 // ../../../node_modules/markdown-to-jsx/dist/index.modern.js
@@ -569,7 +569,7 @@ var index_modern_default = (n2) => {
 };
 // src/blocks/components/ArgsTable/ArgRow.tsx
-import { styled as styled14 } from "storybook/theming";
+import { srOnlyStyles as srOnlyStyles2, srOnlyUnsetStyles, styled as styled14 } from "storybook/theming";
 // src/blocks/components/ArgsTable/ArgControl.tsx
 import React16, { useCallback as useCallback5, useEffect as useEffect6, useState as useState6 } from "react";
@@ -668,7 +668,8 @@ var getBooleanControlStyles = (theme) => ({
   onChange,
   onBlur,
   onFocus,
-  argType
+  argType,
+  required
 }) => {
   let onSetFalse = useCallback(() => onChange(!1), [onChange]), readonly = !!argType?.table?.readonly;
   if (value === void 0)
@@ -694,6 +695,7 @@ var getBooleanControlStyles = (theme) => ({
       checked: parsedValue,
       role: "switch",
       disabled: readonly,
+      "aria-required": required || void 0,
       name,
       onBlur,
       onFocus
@@ -747,7 +749,8 @@ var parseDate = (value) => {
   onChange,
   onFocus,
   onBlur,
-  argType
+  argType,
+  required
 }) => {
   let [valid, setValid] = useState(!0), dateRef = useRef(), timeRef = useRef(), readonly = !!argType?.table?.readonly;
   useEffect(() => {
@@ -777,6 +780,7 @@ var parseDate = (value) => {
       id: `${controlId}-date`,
       name: `${controlId}-date`,
       readOnly: readonly,
+      "aria-required": required || void 0,
       onChange: onDateChange,
       onFocus,
       onBlur
@@ -790,6 +794,7 @@ var parseDate = (value) => {
       ref: timeRef,
       onChange: onTimeChange,
       readOnly: readonly,
+      "aria-required": required || void 0,
       onFocus,
       onBlur
     }
@@ -818,7 +823,8 @@ var Wrapper = styled3.label({
   step,
   onBlur,
   onFocus,
-  argType
+  argType,
+  required
 }) => {
   let [inputValue, setInputValue] = useState2(typeof value == "number" ? value : ""), [forceVisible, setForceVisible] = useState2(!1), [parseError, setParseError] = useState2(null), readonly = !!argType?.table?.readonly, handleChange = useCallback2(
     (event) => {
@@ -863,6 +869,7 @@ var Wrapper = styled3.label({
       value: inputValue,
       valid: parseError ? "error" : void 0,
       autoFocus: forceVisible,
+      "aria-required": required || void 0,
       readOnly: readonly,
       name,
       min,
@@ -929,7 +936,8 @@ var Wrapper2 = styled4.fieldset(
   value,
   onChange,
   isInline,
-  argType
+  argType,
+  required
 }) => {
   if (!options)
     return logger.warn(`Checkbox with no options: ${name}`), React4.createElement(React4.Fragment, null, "-");
@@ -941,7 +949,7 @@ var Wrapper2 = styled4.fieldset(
     setSelected(selectedKeys(value || [], options));
   }, [value]);
   let controlId = getControlId(name, storyId, controlsId);
-  return React4.createElement(Wrapper2, { $isInline: isInline }, React4.createElement("legend", { className: "sb-sr-only" }, name), Object.keys(options).map((key, index) => {
+  return React4.createElement(Wrapper2, { $isInline: isInline }, React4.createElement("legend", { className: "sb-sr-only" }, name, required ? " (required)" : ""), Object.keys(options).map((key, index) => {
     let id = `${controlId}-${index}`;
     return React4.createElement(Label2, { key: id, htmlFor: id, $readOnly: readonly }, React4.createElement(
       "input",
@@ -1002,12 +1010,13 @@ var Wrapper3 = styled5.fieldset(
   value,
   onChange,
   isInline,
-  argType
+  argType,
+  required
 }) => {
   if (!options)
     return logger2.warn(`Radio with no options: ${name}`), React5.createElement(React5.Fragment, null, "-");
   let selection = selectedKey(value, options), controlId = getControlId(name, storyId, controlsId), readonly = !!argType?.table?.readonly;
-  return React5.createElement(Wrapper3, { isInline }, React5.createElement("legend", { className: "sb-sr-only" }, name), Object.keys(options).map((key, index) => {
+  return React5.createElement(Wrapper3, { isInline }, React5.createElement("legend", { className: "sb-sr-only" }, name, required ? " (required)" : ""), Object.keys(options).map((key, index) => {
     let id = `${controlId}-${index}`;
     return React5.createElement(Label3, { key: id, htmlFor: id, $readOnly: readonly }, React5.createElement(
       "input",
@@ -1107,12 +1116,24 @@ var styleResets = {
   value,
   options,
   onChange,
-  argType
+  argType,
+  required
 }) => {
   let handleChange = (e2) => {
     onChange(options[e2.currentTarget.value]);
   }, selection = selectedKey(value, options) || NO_SELECTION, controlId = getControlId(name, storyId, controlsId), readonly = !!argType?.table?.readonly;
-  return React6.createElement(SelectWrapper, null, React6.createElement(ChevronSmallDownIcon, null), React6.createElement("label", { htmlFor: controlId, className: "sb-sr-only" }, name), React6.createElement(OptionsSelect, { disabled: readonly, id: controlId, value: selection, onChange: handleChange }, React6.createElement("option", { disabled: selection === NO_SELECTION, key: "no-selection" }, NO_SELECTION), Object.keys(options).map((key) => React6.createElement("option", { key, value: key }, key))));
+  return React6.createElement(SelectWrapper, null, React6.createElement(ChevronSmallDownIcon, null), React6.createElement("label", { htmlFor: controlId, className: "sb-sr-only" }, name), React6.createElement(
+    OptionsSelect,
+    {
+      disabled: readonly,
+      id: controlId,
+      value: selection,
+      onChange: handleChange,
+      "aria-required": required || void 0
+    },
+    React6.createElement("option", { disabled: selection === NO_SELECTION, key: "no-selection" }, NO_SELECTION),
+    Object.keys(options).map((key) => React6.createElement("option", { key, value: key }, key))
+  ));
 }, MultiSelect = ({
   name,
   storyId,
@@ -1120,7 +1141,8 @@ var styleResets = {
   value,
   options,
   onChange,
-  argType
+  argType,
+  required
 }) => {
   let handleChange = (e2) => {
     let selection2 = Array.from(e2.currentTarget.options).filter((option) => option.selected).map((option) => option.value);
@@ -1133,7 +1155,8 @@ var styleResets = {
       id: controlId,
       multiple: !0,
       value: selection,
-      onChange: handleChange
+      onChange: handleChange,
+      "aria-required": required || void 0
     },
     Object.keys(options).map((key) => React6.createElement("option", { key, value: key }, key))
   ));
@@ -2431,7 +2454,8 @@ var { window: globalWindow } = globalThis, Wrapper4 = styled8.div(({ theme }) =>
   controlsId,
   value,
   onChange,
-  argType
+  argType,
+  required
 }) => {
   let data = useMemo(() => value && cloneDeep(value), [value]), hasData = data != null, [showRaw, setShowRaw] = useState4(!hasData), hadDataRef = useRef3(hasData), [parseError, setParseError] = useState4(null), readonly = !!argType?.table?.readonly, updateRaw = useCallback3(
     (raw) => {
@@ -2477,7 +2501,8 @@ var { window: globalWindow } = globalThis, Wrapper4 = styled8.div(({ theme }) =>
       placeholder: "Edit JSON string...",
       autoFocus: forceVisible,
       valid: parseError ? "error" : void 0,
-      readOnly: readonly
+      readOnly: readonly,
+      "aria-required": required || void 0
     }
   )), isObjectOrArray = Array.isArray(value) || typeof value == "object" && value?.constructor === Object;
   return React11.createElement(Wrapper4, null, isObjectOrArray && React11.createElement(
@@ -2643,7 +2668,8 @@ var RangeControl = ({
   step = 1,
   onBlur,
   onFocus,
-  argType
+  argType,
+  required
 }) => {
   let handleChange = (event) => {
     onChange(parse2(event.target.value));
@@ -2655,6 +2681,7 @@ var RangeControl = ({
       type: "range",
       disabled: readonly,
       onChange: handleChange,
+      "aria-required": required || void 0,
       name,
       min,
       max,
@@ -2685,7 +2712,8 @@ var Wrapper5 = styled10.label({
   onFocus,
   onBlur,
   maxLength,
-  argType
+  argType,
+  required
 }) => {
   let handleChange = (event) => {
     onChange(event.target.value);
@@ -2716,6 +2744,7 @@ var Wrapper5 = styled10.label({
       size: "flex",
       placeholder: "Edit string...",
       autoFocus: forceVisible,
+      "aria-required": required || void 0,
       valid: isValid ? void 0 : "error",
       name,
       value: isValid ? value : "",
@@ -2744,7 +2773,8 @@ var FilesControl = ({
   controlsId,
   accept = "image/*",
   value,
-  argType
+  argType,
+  required
 }) => {
   let inputElement = useRef4(null), readonly = argType?.control?.readOnly;
   function handleFileChange(e2) {
@@ -2768,13 +2798,14 @@ var FilesControl = ({
       disabled: readonly,
       onChange: handleFileChange,
       accept,
+      "aria-required": required || void 0,
       size: "flex"
     }
   ));
 };
 // src/blocks/controls/index.tsx
-var LazyColorControl = lazy(() => import("./_browser-chunks/Color-AVMI7ZZZ.js")), ColorControl = (props) => React15.createElement(Suspense, { fallback: React15.createElement("div", null) }, React15.createElement(LazyColorControl, { ...props }));
+var LazyColorControl = lazy(() => import("./_browser-chunks/Color-6AOWCN3U.js")), ColorControl = (props) => React15.createElement(Suspense, { fallback: React15.createElement("div", null) }, React15.createElement(LazyColorControl, { ...props }));
 // src/blocks/components/ArgsTable/ArgControl.tsx
 var Controls2 = {
@@ -2797,7 +2828,7 @@ var Controls2 = {
   row,
   arg,
   updateArgs,
-  isHovered,
+  isRequired,
   storyId,
   controlsId
 }) => {
@@ -2809,9 +2840,8 @@ var Controls2 = {
     (argVal) => (setBoxedValue({ value: argVal }), updateArgs({ [key]: argVal }), argVal),
     [updateArgs, key]
   ), onBlur = useCallback5(() => setFocused(!1), []), onFocus = useCallback5(() => setFocused(!0), []);
-  if (!control || control.disable) {
-    let canBeSetup = control?.disable !== !0 && row?.type?.name !== "function";
-    return isHovered && canBeSetup ? React16.createElement(
+  if (!control || control.disable)
+    return control?.disable !== !0 && row?.type?.name !== "function" ? React16.createElement(React16.Fragment, null, React16.createElement("span", { className: "sbdocs sbdocs-argcontrol-setup" }, React16.createElement(
       Link,
       {
         href: "https://storybook.js.org/docs/essentials/controls?ref=ui",
@@ -2819,14 +2849,14 @@ var Controls2 = {
         withArrow: !0
       },
       "Setup controls"
-    ) : React16.createElement(NoControl, null);
-  }
+    )), React16.createElement("span", { className: "sbdocs sbdocs-argcontrol-placeholder" }, React16.createElement(NoControl, null))) : React16.createElement(NoControl, null);
   let props = {
     name: key,
     storyId,
     controlsId,
     argType: row,
     value: boxedValue.value,
+    required: isRequired,
     onChange,
     onBlur,
     onFocus
@@ -3054,13 +3084,25 @@ var Name = styled14.span({ fontWeight: "bold" }), Required = styled14.span(({ th
   marginBottom: 12
 })), StyledTd = styled14.td(({ expandable }) => ({
   paddingLeft: expandable ? "40px !important" : "20px !important"
-})), toSummary = (value) => value && { summary: typeof value == "string" ? value : value.name }, ArgRow = (props) => {
-  let [isHovered, setIsHovered] = useState8(!1), { row, updateArgs, compact: compact2, expandable, initialExpandedArgs } = props, { name, description } = row, table = row.table || {}, type = table.type || toSummary(row.type), defaultValue = table.defaultValue || row.defaultValue, required = row.type?.required, hasDescription = description != null && description !== "";
-  return React19.createElement("tr", { onMouseEnter: () => setIsHovered(!0), onMouseLeave: () => setIsHovered(!1) }, React19.createElement(StyledTd, { expandable: expandable ?? !1 }, React19.createElement(Name, null, name), required ? React19.createElement(Required, { title: "Required" }, "*") : null), compact2 ? null : React19.createElement("td", null, hasDescription && React19.createElement(Description, null, React19.createElement(index_modern_default, null, description)), table.jsDocTags != null ? React19.createElement(React19.Fragment, null, React19.createElement(TypeWithJsDoc, { hasDescription }, React19.createElement(ArgValue, { value: type, initialExpandedArgs })), React19.createElement(ArgJsDoc, { tags: table.jsDocTags })) : React19.createElement(Type, { hasDescription }, React19.createElement(ArgValue, { value: type, initialExpandedArgs }))), compact2 ? null : React19.createElement("td", null, React19.createElement(ArgValue, { value: defaultValue, initialExpandedArgs })), updateArgs ? React19.createElement("td", null, React19.createElement(ArgControl, { ...props, isHovered })) : null);
+})), StyledTr = styled14.tr({
+  "span.sbdocs-argcontrol-setup": {
+    ...srOnlyStyles2
+  },
+  "&:hover, &:focus-within": {
+    "span.sbdocs-argcontrol-setup": {
+      ...srOnlyUnsetStyles
+    },
+    "span.sbdocs-argcontrol-placeholder": {
+      ...srOnlyStyles2
+    }
+  }
+}), toSummary = (value) => value && { summary: typeof value == "string" ? value : value.name }, ArgRow = (props) => {
+  let { row, updateArgs, compact: compact2, expandable, initialExpandedArgs, docsLang } = props, { name, description } = row, table = row.table || {}, type = table.type || toSummary(row.type), defaultValue = table.defaultValue || row.defaultValue, required = row.type?.required, hasDescription = description != null && description !== "";
+  return React19.createElement(StyledTr, null, React19.createElement(StyledTd, { expandable: expandable ?? !1 }, React19.createElement(Name, null, name), required ? React19.createElement(Required, { "aria-hidden": !0, title: "Required" }, "*") : null), compact2 ? null : React19.createElement("td", null, hasDescription && React19.createElement(Description, { lang: docsLang }, React19.createElement(index_modern_default, null, description)), table.jsDocTags != null ? React19.createElement(React19.Fragment, null, React19.createElement(TypeWithJsDoc, { hasDescription }, React19.createElement(ArgValue, { value: type, initialExpandedArgs })), React19.createElement(ArgJsDoc, { tags: table.jsDocTags })) : React19.createElement(Type, { hasDescription }, React19.createElement(ArgValue, { value: type, initialExpandedArgs }))), compact2 ? null : React19.createElement("td", null, React19.createElement(ArgValue, { value: defaultValue, initialExpandedArgs })), updateArgs ? React19.createElement("td", null, React19.createElement(ArgControl, { ...props, isRequired: !!required })) : null);
 };
 // src/blocks/components/ArgsTable/Empty.tsx
-import React20, { useEffect as useEffect7, useState as useState9 } from "react";
+import React20, { useEffect as useEffect7, useState as useState8 } from "react";
 import { EmptyTabContent, Link as Link2 } from "storybook/internal/components";
 import { DocumentIcon } from "@storybook/icons";
 import { styled as styled15 } from "storybook/theming";
@@ -3080,7 +3122,7 @@ var Wrapper6 = styled15.div(({ inAddonPanel, theme }) => ({
   fontSize: theme.typography.size.s2 - 1,
   gap: 25
 })), Empty = ({ inAddonPanel }) => {
-  let [isLoading, setIsLoading] = useState9(!0);
+  let [isLoading, setIsLoading] = useState8(!0);
   return useEffect7(() => {
     let load = setTimeout(() => {
       setIsLoading(!1);
@@ -3106,7 +3148,7 @@ var Wrapper6 = styled15.div(({ inAddonPanel, theme }) => ({
 };
 // src/blocks/components/ArgsTable/SectionRow.tsx
-import React21, { useState as useState10 } from "react";
+import React21, { useState as useState9 } from "react";
 import { ChevronDownIcon as ChevronDownIcon2, ChevronRightIcon } from "@storybook/icons";
 import { styled as styled16 } from "storybook/theming";
 var ExpanderIconDown = styled16(ChevronDownIcon2)(({ theme }) => ({
@@ -3151,7 +3193,7 @@ var ExpanderIconDown = styled16(ChevronDownIcon2)(({ theme }) => ({
   background: theme.background.app
 })), StyledTd2 = styled16.td({
   position: "relative"
-}), StyledTr = styled16.tr(({ theme }) => ({
+}), StyledTr2 = styled16.tr(({ theme }) => ({
   "&:hover > td": {
     backgroundColor: `${curriedLighten$1(5e-3, theme.background.app)} !important`,
     boxShadow: `${theme.color.mediumlight} 0 - 1px 0 0 inset`,
@@ -3180,8 +3222,8 @@ var ExpanderIconDown = styled16(ChevronDownIcon2)(({ theme }) => ({
   initialExpanded = !0,
   colSpan = 3
 }) => {
-  let [expanded, setExpanded] = useState10(initialExpanded), Level = level === "subsection" ? Subsection : Section, itemCount = children?.length || 0, caption = level === "subsection" ? `${itemCount} item${itemCount !== 1 ? "s" : ""}` : "", helperText = `${expanded ? "Hide" : "Show"} ${level === "subsection" ? itemCount : label} item${itemCount !== 1 ? "s" : ""}`;
-  return React21.createElement(React21.Fragment, null, React21.createElement(StyledTr, { title: helperText }, React21.createElement(Level, { colSpan: 1 }, React21.createElement(ClickIntercept, { onClick: (e2) => setExpanded(!expanded), tabIndex: 0 }, helperText), React21.createElement(FlexWrapper, null, expanded ? React21.createElement(ExpanderIconDown, null) : React21.createElement(ExpanderIconRight, null), label)), React21.createElement(StyledTd2, { colSpan: colSpan - 1 }, React21.createElement(
+  let [expanded, setExpanded] = useState9(initialExpanded), Level = level === "subsection" ? Subsection : Section, itemCount = children?.length || 0, caption = level === "subsection" ? `${itemCount} item${itemCount !== 1 ? "s" : ""}` : "", helperText = `${expanded ? "Hide" : "Show"} ${level === "subsection" ? itemCount : label} item${itemCount !== 1 ? "s" : ""}`;
+  return React21.createElement(React21.Fragment, null, React21.createElement(StyledTr2, { title: helperText }, React21.createElement(Level, { colSpan: 1 }, React21.createElement(ClickIntercept, { onClick: (e2) => setExpanded(!expanded), tabIndex: 0 }, helperText), React21.createElement(FlexWrapper, null, expanded ? React21.createElement(ExpanderIconDown, null) : React21.createElement(ExpanderIconRight, null), label)), React21.createElement(StyledTd2, { colSpan: colSpan - 1 }, React21.createElement(
     ClickIntercept,
     {
       onClick: (e2) => setExpanded(!expanded),
@@ -3441,8 +3483,9 @@ var sortFns = {
     sort = "none",
     isLoading,
     storyId,
-    controlsId
-  } = props, { rows, args, globals } = "rows" in props ? props : { rows: void 0, args: void 0, globals: void 0 }, isResettingRef = useRef5(!1), [isResetting, setIsResetting] = useState11(!1);
+    controlsId,
+    docsLang
+  } = props, { rows, args, globals } = "rows" in props ? props : { rows: void 0, args: void 0, globals: void 0 }, isResettingRef = useRef5(!1), [isResetting, setIsResetting] = useState10(!1);
   useEffect8(() => {
     isResettingRef.current = !1, setIsResetting(!1);
   }, [args]);
@@ -3481,7 +3524,8 @@ var sortFns = {
       padding: "small",
       onClick: handleResetClick,
       disabled: isResetting,
-      ariaLabel: isResetting ? "Resetting controls..." : "Reset controls"
+      ariaLabel: isResetting ? "Resetting controls..." : "Reset controls",
+      lang: "en"
     },
     React23.createElement(UndoIcon, null)
   )), React23.createElement(
@@ -3490,10 +3534,20 @@ var sortFns = {
       compact: compact2,
       inAddonPanel,
       inTabPanel,
-      className: "docblock-argstable sb-unstyled"
+      className: "docblock-argstable sb-unstyled",
+      lang: "en"
     },
     React23.createElement("thead", { className: "docblock-argstable-head" }, React23.createElement("tr", null, React23.createElement("th", null, React23.createElement("span", null, "Name")), compact2 ? null : React23.createElement("th", null, React23.createElement("span", null, "Description")), compact2 ? null : React23.createElement("th", null, React23.createElement("span", null, "Default")), updateArgs ? React23.createElement("th", null, React23.createElement("span", null, "Control")) : null)),
-    React23.createElement("tbody", { className: "docblock-argstable-body" }, groups.ungrouped.map((row) => React23.createElement(ArgRow, { key: row.key, row, arg: args && args[row.key], ...common })), Object.entries(groups.ungroupedSubsections).map(([subcategory, subsection]) => React23.createElement(
+    React23.createElement("tbody", { className: "docblock-argstable-body" }, groups.ungrouped.map((row) => React23.createElement(
+      ArgRow,
+      {
+        key: row.key,
+        row,
+        arg: args && args[row.key],
+        docsLang,
+        ...common
+      }
+    )), Object.entries(groups.ungroupedSubsections).map(([subcategory, subsection]) => React23.createElement(
       SectionRow,
       {
         key: subcategory,
@@ -3925,10 +3979,10 @@ var toGlobalSelector = (element) => `& :where(${element}:not(.sb-anchor, .sb-uns
   boxSizing: "border-box",
   gap: "3rem",
   [`@media (min-width: ${breakpoint}px)`]: {}
-})), DocsPageWrapper = ({ children, toc }) => React24.createElement(DocsWrapper, { className: "sbdocs sbdocs-wrapper" }, toc, React24.createElement(DocsContent, { className: "sbdocs sbdocs-content" }, children));
+})), DocsPageWrapper = ({ children, toc, lang = "en" }) => React24.createElement(DocsWrapper, { className: "sbdocs sbdocs-wrapper" }, toc, React24.createElement(DocsContent, { className: "sbdocs sbdocs-content", lang }, children));
 // src/blocks/components/Preview.tsx
-import React30, { Children, useCallback as useCallback7, useContext as useContext2, useMemo as useMemo3, useState as useState14 } from "react";
+import React30, { Children, useCallback as useCallback7, useContext as useContext2, useMemo as useMemo3, useState as useState13 } from "react";
 import { logger as logger4 } from "storybook/internal/client-logger";
 import { Bar, Button as Button7, ToggleButton as ToggleButton2, Zoom } from "storybook/internal/components";
 import { CopyIcon, MarkupIcon } from "@storybook/icons";
@@ -4258,13 +4312,13 @@ import React26, { useContext } from "react";
 import { InvalidBlockOfPropError } from "storybook/internal/preview-errors";
 // src/blocks/blocks/useStory.ts
-import { useEffect as useEffect9, useState as useState12 } from "react";
+import { useEffect as useEffect9, useState as useState11 } from "react";
 function useStory(storyId, context) {
   let stories = useStories([storyId], context);
   return stories && stories[0];
 }
 function useStories(storyIds, context) {
-  let [storiesById, setStories] = useState12({});
+  let [storiesById, setStories] = useState11({});
   return useEffect9(() => {
     Promise.all(
       storyIds.map(async (storyId) => {
@@ -4348,7 +4402,7 @@ var getBlockBackgroundStyle = (theme) => ({
 });
 // src/blocks/components/Story.tsx
-import React28, { useEffect as useEffect10, useRef as useRef6, useState as useState13 } from "react";
+import React28, { useEffect as useEffect10, useRef as useRef6, useState as useState12 } from "react";
 import { ErrorFormatter, Loader } from "storybook/internal/components";
 import { styled as styled20 } from "storybook/theming";
@@ -4407,7 +4461,7 @@ var ZoomContext = createContext2({
 // src/blocks/components/Story.tsx
 var storyBlockIdFromId = ({ story, primary }) => `story--${story.id}${primary ? "--primary" : ""}`, InlineStory = (props) => {
-  let storyRef = useRef6(), [showLoader, setShowLoader] = useState13(!0), [error, setError] = useState13(), { story, height, autoplay, forceInitialArgs, renderStoryToElement } = props;
+  let storyRef = useRef6(), [showLoader, setShowLoader] = useState12(!0), [error, setError] = useState12(), { story, height, autoplay, forceInitialArgs, renderStoryToElement } = props;
   return useEffect10(() => {
     if (!(story && storyRef.current))
       return () => {
@@ -4428,7 +4482,15 @@ var storyBlockIdFromId = ({ story, primary }) => `story--${story.id}${primary ?
     };
   }, [autoplay, renderStoryToElement, story]), error ? React28.createElement("pre", null, React28.createElement(ErrorFormatter, { error })) : React28.createElement(React28.Fragment, null, height ? React28.createElement("style", null, `#${storyBlockIdFromId(
     props
-  )} { min-height: ${height}; transform: translateZ(0); overflow: auto }`) : null, showLoader && React28.createElement(StorySkeleton, null), React28.createElement("div", { ref: storyRef, id: `${storyBlockIdFromId(props)}-inner`, "data-name": story.name }));
+  )} { min-height: ${height}; transform: translateZ(0); overflow: auto }`) : null, showLoader && React28.createElement(StorySkeleton, null), React28.createElement(
+    "div",
+    {
+      ref: storyRef,
+      id: `${storyBlockIdFromId(props)}-inner`,
+      "data-name": story.name,
+      lang: story.parameters?.htmlLang || "en"
+    }
+  ));
 }, IFrameStory = ({ story, height = "500px" }) => React28.createElement("div", { style: { width: "100%", height } }, React28.createElement(ZoomContext.Consumer, null, ({ scale }) => React28.createElement(
   IFrame,
   {
@@ -4482,63 +4544,72 @@ var AbsoluteBar = styled21(SharedToolbar)({
   resetZoom,
   onReloadStory,
   ...rest
-}) => React29.createElement(AbsoluteBar, { innerStyle: { gap: 4, paddingInline: 7, justifyContent: "space-between" }, ...rest }, React29.createElement(Wrapper7, { key: "left" }, isLoading ? [1, 2, 3].map((key) => React29.createElement(IconPlaceholder, { key })) : React29.createElement(React29.Fragment, null, onReloadStory && React29.createElement(
-  Button6,
+}) => React29.createElement(
+  AbsoluteBar,
   {
-    padding: "small",
-    variant: "ghost",
-    key: "reload",
-    onClick: onReloadStory,
-    ariaLabel: "Reload story"
+    innerStyle: { gap: 4, paddingInline: 7, justifyContent: "space-between" },
+    lang: "en",
+    ...rest
   },
-  React29.createElement(SyncIcon, null)
-), React29.createElement(
-  Button6,
-  {
-    padding: "small",
-    variant: "ghost",
-    key: "zoomin",
-    onClick: (e2) => {
-      e2.preventDefault(), zoom(0.8);
+  React29.createElement(Wrapper7, { key: "left" }, isLoading ? [1, 2, 3].map((key) => React29.createElement(IconPlaceholder, { key })) : React29.createElement(React29.Fragment, null, onReloadStory && React29.createElement(
+    Button6,
+    {
+      padding: "small",
+      variant: "ghost",
+      key: "reload",
+      onClick: onReloadStory,
+      ariaLabel: "Reload story"
     },
-    ariaLabel: "Zoom in"
-  },
-  React29.createElement(ZoomIcon, null)
-), React29.createElement(
-  Button6,
-  {
-    padding: "small",
-    variant: "ghost",
-    key: "zoomout",
-    onClick: (e2) => {
-      e2.preventDefault(), zoom(1.25);
+    React29.createElement(SyncIcon, null)
+  ), React29.createElement(
+    Button6,
+    {
+      padding: "small",
+      variant: "ghost",
+      key: "zoomin",
+      onClick: (e2) => {
+        e2.preventDefault(), zoom(0.8);
+      },
+      ariaLabel: "Zoom in"
     },
-    ariaLabel: "Zoom out"
-  },
-  React29.createElement(ZoomOutIcon, null)
-), React29.createElement(
-  Button6,
-  {
-    padding: "small",
-    variant: "ghost",
-    key: "zoomreset",
-    onClick: (e2) => {
-      e2.preventDefault(), resetZoom();
+    React29.createElement(ZoomIcon, null)
+  ), React29.createElement(
+    Button6,
+    {
+      padding: "small",
+      variant: "ghost",
+      key: "zoomout",
+      onClick: (e2) => {
+        e2.preventDefault(), zoom(1.25);
+      },
+      ariaLabel: "Zoom out"
     },
-    ariaLabel: "Reset zoom"
-  },
-  React29.createElement(ZoomResetIcon, null)
-))), isLoading ? React29.createElement(Wrapper7, { key: "right" }, React29.createElement(IconPlaceholder, null)) : storyId && React29.createElement(Wrapper7, { key: "right" }, React29.createElement(
-  Button6,
-  {
-    asChild: !0,
-    padding: "small",
-    variant: "ghost",
-    key: "opener",
-    ariaLabel: "Open canvas in new tab"
-  },
-  React29.createElement("a", { href: getStoryHref(storyId), target: "_blank", rel: "noopener noreferrer" }, React29.createElement(ShareAltIcon, null))
-)));
+    React29.createElement(ZoomOutIcon, null)
+  ), React29.createElement(
+    Button6,
+    {
+      padding: "small",
+      variant: "ghost",
+      key: "zoomreset",
+      onClick: (e2) => {
+        e2.preventDefault(), resetZoom();
+      },
+      ariaLabel: "Reset zoom"
+    },
+    React29.createElement(ZoomResetIcon, null)
+  ))),
+  isLoading ? React29.createElement(Wrapper7, { key: "right" }, React29.createElement(IconPlaceholder, null)) : storyId && React29.createElement(Wrapper7, { key: "right" }, React29.createElement(
+    Button6,
+    {
+      asChild: !0,
+      padding: "small",
+      variant: "ghost",
+      key: "opener",
+      ariaLabel: "Open canvas in new tab"
+    },
+    React29.createElement("a", { href: getStoryHref(storyId), target: "_blank", rel: "noopener noreferrer" }, React29.createElement(ShareAltIcon, null))
+  ))
+);
 // src/blocks/components/Preview.tsx
 var ChildrenContainer = styled22.div(
@@ -4627,7 +4698,7 @@ var PositionedToolbar = styled22(Toolbar)({
   onReloadStory,
   ...props
 }) => {
-  let [expanded, setExpanded] = useState14(isExpanded), [copied, setCopied] = useState14(null), [scale, setScale] = useState14(1), additionalActionItems = useMemo3(
+  let [expanded, setExpanded] = useState13(isExpanded), [copied, setCopied] = useState13(null), [scale, setScale] = useState13(1), additionalActionItems = useMemo3(
     () => additionalActions ? [...additionalActions] : [],
     [additionalActions]
   ), sourceId = $bdb11010cef70236$export$f680877a34711e37(), previewClasses = [className].concat(["sbdocs", "sbdocs-preview", "sb-unstyled"]), context = useContext2(DocsContext), copyToClipboard = useCallback7(async (text) => {
@@ -4675,6 +4746,7 @@ var PositionedToolbar = styled22(Toolbar)({
   ), (withSource || additionalActionItems.length > 0) && React30.createElement(ActionBar, { className: "sbdocs sbdocs-preview-actions", innerStyle: { paddingInline: 0 } }, hasSourceError && React30.createElement(
     Button7,
     {
+      lang: "en",
       ariaLabel: !1,
       disabled: !0,
       variant: "ghost",
@@ -4685,6 +4757,7 @@ var PositionedToolbar = styled22(Toolbar)({
   ), hasValidSource && React30.createElement(React30.Fragment, null, React30.createElement(
     ToggleButton2,
     {
+      lang: "en",
       ariaLabel: !1,
       pressed: expanded,
       "aria-expanded": expanded,
@@ -4696,7 +4769,7 @@ var PositionedToolbar = styled22(Toolbar)({
     React30.createElement(MarkupIcon, null),
     " ",
     expanded ? "Hide code" : "Show code"
-  ), React30.createElement(Button7, { ariaLabel: !1, variant: "ghost", onClick: handleCopyCode }, React30.createElement(CopyIcon, null), " ", copied ?? "Copy code")), additionalActionItems.map(
+  ), React30.createElement(Button7, { lang: "en", ariaLabel: !1, variant: "ghost", onClick: handleCopyCode }, React30.createElement(CopyIcon, null), " ", copied ?? "Copy code")), additionalActionItems.map(
     ({ title, ariaLabel, className: className2, onClick, disabled }, index) => React30.createElement(
       Button7,
       {
@@ -4728,7 +4801,7 @@ var StyledTabsView = styled23(TabsView)({
   if (entries.length === 1)
     return React31.createElement(ArgsTable, { ...entries[0][1], ...props });
   let tabsFromEntries = entries.map(([label, table], index) => {
-    let argsTableProps = index === 0 ? props : { sort: props.sort };
+    let argsTableProps = index === 0 ? props : { sort: props.sort, docsLang: props.docsLang };
     return {
       id: `prop_table_div_${label}`,
       title: label,
@@ -5513,7 +5586,16 @@ var Aside = styled27.aside(() => ({
   color: theme.color.defaultText,
   textTransform: "uppercase",
   marginBottom: 10
-})), Title2 = ({ headingId, title }) => typeof title == "string" || !title ? React35.createElement(Heading, { as: "h2", id: headingId, className: title ? "" : "sb-sr-only" }, title || "Table of contents") : React35.createElement("div", { id: headingId }, title), TableOfContents = ({
+})), Title2 = ({ headingId, title }) => typeof title == "string" || !title ? React35.createElement(
+  Heading,
+  {
+    as: "h2",
+    id: headingId,
+    className: title ? "" : "sb-sr-only",
+    lang: title ? void 0 : "en"
+  },
+  title || "Table of contents"
+) : React35.createElement("div", { id: headingId }, title), TableOfContents = ({
   title,
   disable,
   headingSelector,
@@ -5576,9 +5658,9 @@ import { useCallback as useCallback8, useRef as useRef7 } from "react";
 import { seedQueryState } from "storybook/open-service";
 // src/blocks/blocks/useSyncExternalStoreShim.ts
-import { useEffect as useEffect12, useLayoutEffect, useState as useState15 } from "react";
+import { useEffect as useEffect12, useLayoutEffect, useState as useState14 } from "react";
 function useSyncExternalStoreShim(subscribe, getSnapshot) {
-  let value = getSnapshot(), [{ inst }, forceUpdate] = useState15({ inst: { value, getSnapshot } });
+  let value = getSnapshot(), [{ inst }, forceUpdate] = useState14({ inst: { value, getSnapshot } });
   return useLayoutEffect(() => {
     inst.value = value, inst.getSnapshot = getSnapshot, didSnapshotChange(inst) && forceUpdate({ inst });
   }, [subscribe, value, getSnapshot]), useEffect12(() => (didSnapshotChange(inst) && forceUpdate({ inst }), subscribe(() => {
@@ -5736,11 +5818,12 @@ function renderArgTypesTables({
   subcomponentRows,
   include,
   exclude,
-  sort
+  sort,
+  docsLang
 }) {
   let filteredMainRows = filterArgTypes(mainRows, include, exclude);
   if (Object.keys(subcomponentRows).length === 0)
-    return React37.createElement(ArgsTable, { rows: filteredMainRows, sort });
+    return React37.createElement(ArgsTable, { rows: filteredMainRows, sort, docsLang });
   let tabs = {
     [mainName]: { rows: filteredMainRows, sort },
     ...Object.fromEntries(
@@ -5753,7 +5836,7 @@ function renderArgTypesTables({
       ])
     )
   };
-  return React37.createElement(TabbedArgsTable, { tabs, sort });
+  return React37.createElement(TabbedArgsTable, { tabs, sort, docsLang });
 }
 var LegacyArgTypes = (props) => {
   let { argTypes, parameters, component, subcomponents, filterProps } = useResolveArgTypes(props);
@@ -5761,6 +5844,7 @@ var LegacyArgTypes = (props) => {
     mainName: getComponentName(component),
     mainRows: argTypes,
     subcomponentRows: extractSubcomponentArgTypes(subcomponents, parameters),
+    docsLang: parameters?.docs?.lang,
     ...filterProps
   }) : null;
 }, DocgenServiceArgTypes = (props) => {
@@ -5775,6 +5859,7 @@ var LegacyArgTypes = (props) => {
     mainName: getComponentName(component) ?? serviceRows.serviceComponentName,
     mainRows: serviceRows.mainRows,
     subcomponentRows: serviceRows.subcomponentRows,
+    docsLang: parameters?.docs?.lang,
     ...filterProps
   }) : null;
 }, ArgTypesImpl = (props) => globalThis.FEATURES?.experimentalDocgenServer ? React37.createElement(DocgenServiceArgTypes, { ...props }) : React37.createElement(LegacyArgTypes, { ...props }), ArgTypes = withMdxComponentOverride("ArgTypes", ArgTypesImpl);
@@ -5790,7 +5875,7 @@ import { SourceType } from "storybook/internal/docs-tools";
 import { InvalidBlockOfPropError as InvalidBlockOfPropError3 } from "storybook/internal/preview-errors";
 // src/blocks/blocks/SourceContainer.tsx
-import React38, { createContext as createContext3, useEffect as useEffect13, useState as useState16 } from "react";
+import React38, { createContext as createContext3, useEffect as useEffect13, useState as useState15 } from "react";
 import { SNIPPET_RENDERED } from "storybook/internal/docs-tools";
 // ../../../node_modules/telejson/dist/chunk-EAFQLD22.mjs
@@ -6821,7 +6906,7 @@ var SourceContext = createContext3({ sources: {} }), UNKNOWN_ARGS_HASH = "--unkn
   children,
   channel
 }) => {
-  let [sources, setSources] = useState16({});
+  let [sources, setSources] = useState15({});
   return useEffect13(() => {
     let handleSnippetRendered = (idOrEvent, inputSource = null, inputFormat = !1) => {
       let {
@@ -6870,9 +6955,9 @@ function useServiceStorySnippet(storyId) {
 }
 // src/blocks/blocks/useTransformCode.tsx
-import { useEffect as useEffect14, useState as useState17 } from "react";
+import { useEffect as useEffect14, useState as useState16 } from "react";
 function useTransformCode(source, transform, storyContext) {
-  let [transformedCode, setTransformedCode] = useState17("Transforming..."), transformed = transform ? transform?.(source, storyContext) : source;
+  let [transformedCode, setTransformedCode] = useState16("Transforming..."), transformed = transform ? transform?.(source, storyContext) : source;
   return useEffect14(() => {
     async function getTransformedCode() {
       let transformResult = await transformed;
@@ -6983,7 +7068,7 @@ import React41, { useContext as useContext8 } from "react";
 import { filterArgTypes as filterArgTypes2 } from "storybook/preview-api";
 // src/blocks/blocks/useArgs.ts
-import { useCallback as useCallback11, useEffect as useEffect15, useState as useState18 } from "react";
+import { useCallback as useCallback11, useEffect as useEffect15, useState as useState17 } from "react";
 import {
   RESET_STORY_ARGS,
   STORY_ARGS_UPDATED,
@@ -6995,7 +7080,7 @@ var useArgs = (story, context) => {
     throw new Error("No result when story was defined");
   return result;
 }, useArgsIfDefined = (story, context) => {
-  let storyContext = story ? context.getStoryContext(story) : { args: {} }, { id: storyId } = story || { id: "none" }, [args, setArgs] = useState18(storyContext.args);
+  let storyContext = story ? context.getStoryContext(story) : { args: {} }, { id: storyId } = story || { id: "none" }, [args, setArgs] = useState17(storyContext.args);
   useEffect15(() => {
     let onArgsUpdated = (changed) => {
       changed.storyId === storyId && setArgs(changed.args);
@@ -7013,10 +7098,10 @@ var useArgs = (story, context) => {
 };
 // src/blocks/blocks/useGlobals.ts
-import { useEffect as useEffect16, useState as useState19 } from "react";
+import { useEffect as useEffect16, useState as useState18 } from "react";
 import { GLOBALS_UPDATED } from "storybook/internal/core-events";
 var useGlobals = (story, context) => {
-  let storyContext = context.getStoryContext(story), [globals, setGlobals] = useState19(storyContext.globals);
+  let storyContext = context.getStoryContext(story), [globals, setGlobals] = useState18(storyContext.globals);
   return useEffect16(() => {
     let onGlobalsUpdated = (changed) => {
       setGlobals(changed.globals);
@@ -7058,7 +7143,8 @@ var ControlsTables = ({
   args,
   globals,
   updateArgs,
-  resetArgs
+  resetArgs,
+  docsLang
 }) => {
   let filteredMainRows = filterArgTypes2(mainRows, include, exclude);
   if (Object.keys(subcomponentRows).length === 0)
@@ -7072,7 +7158,8 @@ var ControlsTables = ({
         args,
         globals,
         updateArgs,
-        resetArgs
+        resetArgs,
+        docsLang
       }
     ) : null;
   let tabs = {
@@ -7097,7 +7184,8 @@ var ControlsTables = ({
       updateArgs,
       resetArgs,
       storyId,
-      controlsId
+      controlsId,
+      docsLang
     }
   );
 }, LegacyControls = ({ story, context, ...props }) => {
@@ -7110,7 +7198,8 @@ var ControlsTables = ({
       subcomponentRows: extractSubcomponentArgTypes(subcomponents, parameters),
       ...filterProps,
       storyId: story.id,
-      ...interactiveState
+      ...interactiveState,
+      docsLang: parameters?.docs?.lang
     }
   ) : null;
 }, DocgenServiceControls = ({ story, context, ...props }) => {
@@ -7129,7 +7218,8 @@ var ControlsTables = ({
       subcomponentRows: serviceRows.subcomponentRows,
       ...filterProps,
       storyId: story.id,
-      ...interactiveState
+      ...interactiveState,
+      docsLang: parameters?.docs?.lang
     }
   ) : null;
 }, ControlsImpl = (props) => {
@@ -7362,32 +7452,38 @@ var DescriptionType = /* @__PURE__ */ ((DescriptionType2) => (DescriptionType2.I
         `Unrecognized module type resolved from 'useOf', got: ${resolvedOf.type}`
       );
   }
-}, DescriptionBody = ({ resolvedOf, serviceComponentDescription, storyDocsDescription }) => {
+}, DescriptionBody = ({ resolvedOf, serviceComponentDescription, lang, storyDocsDescription }) => {
   let markdown = getDescriptionFromResolvedOf(
     resolvedOf,
     serviceComponentDescription,
     storyDocsDescription
   );
-  return markdown ? React44.createElement(Markdown, null, markdown) : null;
-}, DescriptionStoryWithServices = ({
-  resolvedOf
-}) => {
-  let storyDocsDescription = useServiceStoryDoc(resolvedOf.story.id).data?.description;
-  return React44.createElement(DescriptionBody, { resolvedOf, storyDocsDescription });
+  return markdown ? React44.createElement(Markdown, { lang }, markdown) : null;
+}, DescriptionStoryWithServices = ({ resolvedOf }) => {
+  let storyDocsDescription = useServiceStoryDoc(resolvedOf.story.id).data?.description, lang = resolvedOf.story.parameters.docs?.lang || "en";
+  return React44.createElement(
+    DescriptionBody,
+    {
+      resolvedOf,
+      storyDocsDescription,
+      lang
+    }
+  );
 }, DescriptionComponentWithServices = ({ resolvedOf, componentId }) => {
-  let serviceComponentDescription = useServiceDocgen(componentId).data?.description || void 0;
+  let serviceComponentDescription = useServiceDocgen(componentId).data?.description || void 0, lang = resolvedOf.type === "meta" ? resolvedOf.preparedMeta.parameters.docs?.lang || "en" : resolvedOf.projectAnnotations.parameters?.docs?.lang || "en";
   return React44.createElement(
     DescriptionBody,
     {
       resolvedOf,
-      serviceComponentDescription
+      serviceComponentDescription,
+      lang
     }
   );
 }, DescriptionImpl = (props) => {
-  let { of } = props;
+  let { of } = props, context = useContext10(DocsContext);
   if ("of" in props && of === void 0)
     throw new InvalidBlockOfPropError5();
-  let resolvedOf = useOf(of || "meta"), context = useContext10(DocsContext);
+  let resolvedOf = useOf(of || "meta");
   if (globalThis.FEATURES?.experimentalDocgenServer) {
     if (resolvedOf.type === "story")
       return React44.createElement(DescriptionStoryWithServices, { resolvedOf });
@@ -7395,7 +7491,8 @@ var DescriptionType = /* @__PURE__ */ ((DescriptionType2) => (DescriptionType2.I
     if (componentId)
       return React44.createElement(DescriptionComponentWithServices, { resolvedOf, componentId });
   }
-  return React44.createElement(DescriptionBody, { resolvedOf });
+  let lang = (resolvedOf.type === "story" ? resolvedOf.story.parameters : resolvedOf.type === "meta" ? resolvedOf.preparedMeta.parameters : resolvedOf.projectAnnotations.parameters)?.docs?.lang || "en";
+  return React44.createElement(DescriptionBody, { resolvedOf, lang });
 }, Description2 = withMdxComponentOverride("Description", DescriptionImpl);
 // src/blocks/blocks/Docs.tsx
@@ -7403,7 +7500,7 @@ import React54 from "react";
 // src/blocks/blocks/DocsContainer.tsx
 import React45, { useEffect as useEffect17, useMemo as useMemo5 } from "react";
-import { ThemeProvider, ensure as ensureTheme } from "storybook/theming";
+import { ensure as ensureTheme, ThemeProvider } from "storybook/theming";
 // src/blocks/blocks/DocsSluggerContext.ts
 import { createContext as createContext4 } from "react";
@@ -7463,11 +7560,12 @@ var { document: document3, window: globalWindow3 } = globalThis, DocsContainer =
   theme,
   children
 }) => {
-  let slugger = useMemo5(() => createDocsSlugger(), []), toc;
+  let slugger = useMemo5(() => createDocsSlugger(), []), toc, lang;
   try {
-    toc = context.resolveOf("meta", ["meta"]).preparedMeta.parameters?.docs?.toc;
+    let metaParameters = context.resolveOf("meta", ["meta"]).preparedMeta.parameters;
+    toc = metaParameters?.docs?.toc, lang = metaParameters?.docs?.lang || "en";
   } catch {
-    toc = context?.projectAnnotations?.parameters?.docs?.toc;
+    toc = context?.projectAnnotations?.parameters?.docs?.toc, lang = context?.projectAnnotations?.parameters?.docs?.lang || "en";
   }
   return useEffect17(() => {
     let url;
@@ -7483,6 +7581,7 @@ var { document: document3, window: globalWindow3 } = globalThis, DocsContainer =
   }), React45.createElement(DocsSluggerContext.Provider, { value: slugger }, React45.createElement(DocsContext.Provider, { value: context }, React45.createElement(SourceContainer, { channel: context.channel }, React45.createElement(ThemeProvider, { theme: ensureTheme(theme) }, React45.createElement(
     DocsPageWrapper,
     {
+      lang,
       toc: toc ? React45.createElement(
         TableOfContents,
         {

package/dist/index.d.ts CHANGED Viewed

@@ -241,6 +241,16 @@ interface DocsParameters {
          * @see https://storybook.js.org/docs/api/doc-blocks/doc-block-subtitle
          */
         subtitle?: string;
+        /**
+         * The BCP-47 language tag applied to Storybook-rendered docs prose (descriptions, titles,
+         * ArgTypes description cells, free MDX prose).
+         *
+         * Storybook's own chrome stays English regardless. Inherited project → meta (page-level) or
+         * project → meta → story (per-story prose).
+         *
+         * @default 'en'
+         */
+        lang?: string;
         /**
          * Override the default theme
          *

package/dist/mdx-loader.js CHANGED Viewed

@@ -1,20 +1,20 @@
-import CJS_COMPAT_NODE_URL_62gi7e79md7 from 'node:url';
-import CJS_COMPAT_NODE_PATH_62gi7e79md7 from 'node:path';
-import CJS_COMPAT_NODE_MODULE_62gi7e79md7 from "node:module";
+import CJS_COMPAT_NODE_URL_6kmgb85uu0i from 'node:url';
+import CJS_COMPAT_NODE_PATH_6kmgb85uu0i from 'node:path';
+import CJS_COMPAT_NODE_MODULE_6kmgb85uu0i from "node:module";
-var __filename = CJS_COMPAT_NODE_URL_62gi7e79md7.fileURLToPath(import.meta.url);
-var __dirname = CJS_COMPAT_NODE_PATH_62gi7e79md7.dirname(__filename);
-var require = CJS_COMPAT_NODE_MODULE_62gi7e79md7.createRequire(import.meta.url);
+var __filename = CJS_COMPAT_NODE_URL_6kmgb85uu0i.fileURLToPath(import.meta.url);
+var __dirname = CJS_COMPAT_NODE_PATH_6kmgb85uu0i.dirname(__filename);
+var require = CJS_COMPAT_NODE_MODULE_6kmgb85uu0i.createRequire(import.meta.url);
 // ------------------------------------------------------------
 // end of CJS compatibility banner, injected by Storybook's esbuild configuration
 // ------------------------------------------------------------
 import {
   compile
-} from "./_node-chunks/chunk-V5BW74Q5.js";
-import "./_node-chunks/chunk-URSDNTC6.js";
-import "./_node-chunks/chunk-E7HXF55G.js";
-import "./_node-chunks/chunk-UXKGP3JV.js";
+} from "./_node-chunks/chunk-6COZ6RQD.js";
+import "./_node-chunks/chunk-G6HS65QC.js";
+import "./_node-chunks/chunk-AIK622WF.js";
+import "./_node-chunks/chunk-N5QKP6IS.js";
 // src/mdx-loader.ts
 var DEFAULT_RENDERER = `

package/dist/preset.js CHANGED Viewed

@@ -1,15 +1,15 @@
-import CJS_COMPAT_NODE_URL_62gi7e79md7 from 'node:url';
-import CJS_COMPAT_NODE_PATH_62gi7e79md7 from 'node:path';
-import CJS_COMPAT_NODE_MODULE_62gi7e79md7 from "node:module";
+import CJS_COMPAT_NODE_URL_6kmgb85uu0i from 'node:url';
+import CJS_COMPAT_NODE_PATH_6kmgb85uu0i from 'node:path';
+import CJS_COMPAT_NODE_MODULE_6kmgb85uu0i from "node:module";
-var __filename = CJS_COMPAT_NODE_URL_62gi7e79md7.fileURLToPath(import.meta.url);
-var __dirname = CJS_COMPAT_NODE_PATH_62gi7e79md7.dirname(__filename);
-var require = CJS_COMPAT_NODE_MODULE_62gi7e79md7.createRequire(import.meta.url);
+var __filename = CJS_COMPAT_NODE_URL_6kmgb85uu0i.fileURLToPath(import.meta.url);
+var __dirname = CJS_COMPAT_NODE_PATH_6kmgb85uu0i.dirname(__filename);
+var require = CJS_COMPAT_NODE_MODULE_6kmgb85uu0i.createRequire(import.meta.url);
 // ------------------------------------------------------------
 // end of CJS compatibility banner, injected by Storybook's esbuild configuration
 // ------------------------------------------------------------
-import "./_node-chunks/chunk-UXKGP3JV.js";
+import "./_node-chunks/chunk-N5QKP6IS.js";
 // src/preset.ts
 import { isAbsolute as isAbsolute2 } from "node:path";
@@ -713,16 +713,6 @@ function registerMdxService({
   });
 }
-// src/docgen.ts
-var experimental_docgenProvider = async (nextDocgen) => async (input) => {
-  let downstream = await nextDocgen(input);
-  if (downstream)
-    return {
-      ...downstream,
-      description: downstream.description ? `${downstream.description} (docs enabled)` : "docs enabled"
-    };
-};
 // src/preset.ts
 var getResolvedReact = async (options) => {
   let resolvedReact2 = await options.presets.apply("resolvedReact", {});
@@ -738,7 +728,7 @@ var getResolvedReact = async (options) => {
   };
 };
 async function webpack(webpackConfig = {}, options) {
-  let { module = {} } = webpackConfig, { csfPluginOptions = {}, mdxPluginOptions = {} } = options, enrichCsf = await options.presets.apply("experimental_enrichCsf"), rehypeSlug = (await import("./_node-chunks/rehype-slug-4727ZT4J.js")).default, rehypeExternalLinks = (await import("./_node-chunks/rehype-external-links-KRDD3ZWL.js")).default, mdxLoaderOptions = await options.presets.apply("mdxLoaderOptions", {
+  let { module = {} } = webpackConfig, { csfPluginOptions = {}, mdxPluginOptions = {} } = options, enrichCsf = await options.presets.apply("experimental_enrichCsf"), rehypeSlug = (await import("./_node-chunks/rehype-slug-BYEJJO5R.js")).default, rehypeExternalLinks = (await import("./_node-chunks/rehype-external-links-ZN3EPMI5.js")).default, mdxLoaderOptions = await options.presets.apply("mdxLoaderOptions", {
     ...mdxPluginOptions,
     mdxCompileOptions: {
       providerImportSource: fileURLToPath2(
@@ -816,7 +806,7 @@ var docs = (input = {}, options) => {
 }, addons = [
   import.meta.resolve("@storybook/react-dom-shim/preset")
 ], viteFinal = async (config, options) => {
-  let { plugins = [] } = config, { mdxPlugin } = await import("./_node-chunks/mdx-plugin-Y733C4JM.js"), { react, reactDom, mdx } = await getResolvedReact(options), packageDeduplicationPlugin = {
+  let { plugins = [] } = config, { mdxPlugin } = await import("./_node-chunks/mdx-plugin-HJBCBRQH.js"), { react, reactDom, mdx } = await getResolvedReact(options), packageDeduplicationPlugin = {
     name: "storybook:package-deduplication",
     enforce: "pre",
     config: () => ({
@@ -859,7 +849,6 @@ var docs = (input = {}, options) => {
 export {
   addons,
   docsX as docs,
-  experimental_docgenProvider,
   manifests as experimental_manifests,
   optimizeViteDeps,
   resolvedReact,

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-docs",
-  "version": "10.5.0-alpha.9",
+  "version": "10.5.0-beta.0",
   "description": "Storybook Docs: Document UI components automatically with stories and MDX",
   "keywords": [
     "docs",
@@ -87,9 +87,9 @@
   ],
   "dependencies": {
     "@mdx-js/react": "^3.0.0",
-    "@storybook/csf-plugin": "10.5.0-alpha.9",
+    "@storybook/csf-plugin": "10.5.0-beta.0",
     "@storybook/icons": "^2.0.2",
-    "@storybook/react-dom-shim": "10.5.0-alpha.9",
+    "@storybook/react-dom-shim": "10.5.0-beta.0",
     "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
     "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
     "ts-dedent": "^2.0.0"
@@ -117,7 +117,7 @@
   },
   "peerDependencies": {
     "@types/react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
-    "storybook": "^10.5.0-alpha.9"
+    "storybook": "^10.5.0-beta.0"
   },
   "peerDependenciesMeta": {
     "@types/react": {