@stealthscale/component-disclosure 0.2.3 → 0.2.4

package/dist/pages/menu/menu.js

@@ -0,0 +1,1103 @@
+import { t as __exportAll } from "../../rolldown-runtime-D7D4PA-g.js";
+import { u as recipe } from "../../recipes-95yCB2V3.js";
+import { _t as ContextTrigger, at as Positioner, bt as ArrowTip, ct as ItemText, dt as ItemIndicator, ft as ItemGroup, gt as Indicator, ht as ItemCommand, it as Root, lt as ItemMark, mt as ItemDescription, nt as TriggerItem, ot as OptionItem, pt as ItemGroupLabel, rt as Separator, st as Item, tt as Trigger, ut as ItemLines, vt as Content, yt as Arrow } from "../../shared-Cfsikh3X.js";
+import { c } from "react/compiler-runtime";
+import { useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Portal } from "@stealthscale/component-primitives";
+import { Matrix, Sample, scenesOf, specimen, useWords } from "@stealthscale/specimen";
+import { ArrowDownWideNarrowIcon, ArrowUpNarrowWideIcon, CheckIcon, ChevronDownIcon, ChevronRightIcon, ChevronsUpDownIcon, CopyIcon, EllipsisIcon, EyeOffIcon, FolderInputIcon, PinIcon, PlusIcon, SettingsIcon, TrashIcon } from "lucide-react";
+import { Button, ButtonPropsProvider, IconButton } from "@stealthscale/component-actions";
+//#region src/menu/examples/actions.example.tsx
+var actions_example_exports = /* @__PURE__ */ __exportAll({
+	Actions: () => Actions,
+	source: () => source$5
+});
+const FORMATS = [
+	"csv",
+	"json",
+	"pdf"
+];
+function Actions(props) {
+	const $ = c(56);
+	const { t } = useWords("menu");
+	const [notified, setNotified] = useState(true);
+	let t0;
+	if ($[0] !== t) {
+		t0 = t("actions");
+		$[0] = t;
+		$[1] = t0;
+	} else t0 = $[1];
+	let t1;
+	if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
+		t1 = /* @__PURE__ */ jsx(Indicator, { children: /* @__PURE__ */ jsx(ChevronDownIcon, { size: "1em" }) });
+		$[2] = t1;
+	} else t1 = $[2];
+	let t2;
+	if ($[3] !== t0) {
+		t2 = /* @__PURE__ */ jsxs(Trigger, {
+			as: Button,
+			children: [t0, t1]
+		});
+		$[3] = t0;
+		$[4] = t2;
+	} else t2 = $[4];
+	let t3;
+	if ($[5] !== t) {
+		t3 = t("payout");
+		$[5] = t;
+		$[6] = t3;
+	} else t3 = $[6];
+	let t4;
+	if ($[7] !== t3) {
+		t4 = /* @__PURE__ */ jsx(ItemGroupLabel, {
+			value: "payout",
+			children: t3
+		});
+		$[7] = t3;
+		$[8] = t4;
+	} else t4 = $[8];
+	let t5;
+	if ($[9] !== t) {
+		t5 = t("release");
+		$[9] = t;
+		$[10] = t5;
+	} else t5 = $[10];
+	let t6;
+	if ($[11] !== t5) {
+		t6 = /* @__PURE__ */ jsx(Item, {
+			value: "release",
+			children: t5
+		});
+		$[11] = t5;
+		$[12] = t6;
+	} else t6 = $[12];
+	let t7;
+	if ($[13] !== t) {
+		t7 = t("hold");
+		$[13] = t;
+		$[14] = t7;
+	} else t7 = $[14];
+	let t8;
+	if ($[15] !== t7) {
+		t8 = /* @__PURE__ */ jsx(Item, {
+			value: "hold",
+			children: t7
+		});
+		$[15] = t7;
+		$[16] = t8;
+	} else t8 = $[16];
+	let t9;
+	if ($[17] !== t) {
+		t9 = t("void");
+		$[17] = t;
+		$[18] = t9;
+	} else t9 = $[18];
+	let t10;
+	if ($[19] !== t9) {
+		t10 = /* @__PURE__ */ jsx(Item, {
+			tone: "critical",
+			value: "void",
+			children: t9
+		});
+		$[19] = t9;
+		$[20] = t10;
+	} else t10 = $[20];
+	let t11;
+	if ($[21] !== t10 || $[22] !== t4 || $[23] !== t6 || $[24] !== t8) {
+		t11 = /* @__PURE__ */ jsxs(ItemGroup, {
+			value: "payout",
+			children: [
+				t4,
+				t6,
+				t8,
+				t10
+			]
+		});
+		$[21] = t10;
+		$[22] = t4;
+		$[23] = t6;
+		$[24] = t8;
+		$[25] = t11;
+	} else t11 = $[25];
+	let t12;
+	if ($[26] === Symbol.for("react.memo_cache_sentinel")) {
+		t12 = /* @__PURE__ */ jsx(Separator, {});
+		$[26] = t12;
+	} else t12 = $[26];
+	let t13;
+	if ($[27] !== t) {
+		t13 = t("notify");
+		$[27] = t;
+		$[28] = t13;
+	} else t13 = $[28];
+	let t14;
+	if ($[29] !== t13) {
+		t14 = /* @__PURE__ */ jsx(ItemText, { children: t13 });
+		$[29] = t13;
+		$[30] = t14;
+	} else t14 = $[30];
+	let t15;
+	if ($[31] === Symbol.for("react.memo_cache_sentinel")) {
+		t15 = /* @__PURE__ */ jsx(ItemIndicator, { children: /* @__PURE__ */ jsx(CheckIcon, { size: "1em" }) });
+		$[31] = t15;
+	} else t15 = $[31];
+	let t16;
+	if ($[32] !== notified || $[33] !== t14) {
+		t16 = /* @__PURE__ */ jsxs(OptionItem, {
+			checked: notified,
+			onCheckedChange: setNotified,
+			type: "checkbox",
+			value: "notify",
+			children: [t14, t15]
+		});
+		$[32] = notified;
+		$[33] = t14;
+		$[34] = t16;
+	} else t16 = $[34];
+	let t17;
+	if ($[35] === Symbol.for("react.memo_cache_sentinel")) {
+		t17 = /* @__PURE__ */ jsx(Separator, {});
+		$[35] = t17;
+	} else t17 = $[35];
+	let t18;
+	if ($[36] !== t) {
+		t18 = t("export");
+		$[36] = t;
+		$[37] = t18;
+	} else t18 = $[37];
+	let t19;
+	if ($[38] === Symbol.for("react.memo_cache_sentinel")) {
+		t19 = /* @__PURE__ */ jsx(Indicator, { children: /* @__PURE__ */ jsx(ChevronRightIcon, { size: "1em" }) });
+		$[38] = t19;
+	} else t19 = $[38];
+	let t20;
+	if ($[39] !== t18) {
+		t20 = /* @__PURE__ */ jsxs(TriggerItem, { children: [t18, t19] });
+		$[39] = t18;
+		$[40] = t20;
+	} else t20 = $[40];
+	let t21;
+	if ($[41] !== t) {
+		t21 = FORMATS.map((format) => /* @__PURE__ */ jsx(Item, {
+			value: format,
+			children: t(format)
+		}, format));
+		$[41] = t;
+		$[42] = t21;
+	} else t21 = $[42];
+	let t22;
+	if ($[43] !== t21) {
+		t22 = /* @__PURE__ */ jsx(Portal, { children: /* @__PURE__ */ jsx(Positioner, { children: /* @__PURE__ */ jsx(Content, { children: t21 }) }) });
+		$[43] = t21;
+		$[44] = t22;
+	} else t22 = $[44];
+	let t23;
+	if ($[45] !== t20 || $[46] !== t22) {
+		t23 = /* @__PURE__ */ jsxs(Root, { children: [t20, t22] });
+		$[45] = t20;
+		$[46] = t22;
+		$[47] = t23;
+	} else t23 = $[47];
+	let t24;
+	if ($[48] !== t11 || $[49] !== t16 || $[50] !== t23) {
+		t24 = /* @__PURE__ */ jsx(Portal, { children: /* @__PURE__ */ jsx(Positioner, { children: /* @__PURE__ */ jsxs(Content, { children: [
+			t11,
+			t12,
+			t16,
+			t17,
+			t23
+		] }) }) });
+		$[48] = t11;
+		$[49] = t16;
+		$[50] = t23;
+		$[51] = t24;
+	} else t24 = $[51];
+	let t25;
+	if ($[52] !== props || $[53] !== t2 || $[54] !== t24) {
+		t25 = /* @__PURE__ */ jsxs(Root, {
+			...props,
+			children: [t2, t24]
+		});
+		$[52] = props;
+		$[53] = t2;
+		$[54] = t24;
+		$[55] = t25;
+	} else t25 = $[55];
+	return t25;
+}
+const source$5 = "import { type ReactElement, useState } from \"react\";\n\nimport { CheckIcon, ChevronDownIcon, ChevronRightIcon } from \"lucide-react\";\n\nimport { Button } from \"@stealthscale/component-actions\";\nimport { Portal } from \"@stealthscale/component-primitives\";\nimport { useWords } from \"@stealthscale/specimen\";\n\nimport { Menu } from \"@stealthscale/component-disclosure\";\n\nconst FORMATS = [\"csv\", \"json\", \"pdf\"] as const;\n\nexport function Actions(props: Menu.RootProps): ReactElement {\n  const { t } = useWords(\"menu\");\n  const [notified, setNotified] = useState(true);\n\n  return (\n    <Menu.Root {...props}>\n      <Menu.Trigger as={Button}>\n        {t(\"actions\")}\n        <Menu.Indicator>\n          <ChevronDownIcon size=\"1em\" />\n        </Menu.Indicator>\n      </Menu.Trigger>\n      <Portal>\n        <Menu.Positioner>\n          <Menu.Content>\n            <Menu.ItemGroup value=\"payout\">\n              <Menu.ItemGroupLabel value=\"payout\">{t(\"payout\")}</Menu.ItemGroupLabel>\n              <Menu.Item value=\"release\">{t(\"release\")}</Menu.Item>\n              <Menu.Item value=\"hold\">{t(\"hold\")}</Menu.Item>\n              <Menu.Item tone=\"critical\" value=\"void\">\n                {t(\"void\")}\n              </Menu.Item>\n            </Menu.ItemGroup>\n            <Menu.Separator />\n            <Menu.OptionItem\n              checked={notified}\n              onCheckedChange={setNotified}\n              type=\"checkbox\"\n              value=\"notify\"\n            >\n              <Menu.ItemText>{t(\"notify\")}</Menu.ItemText>\n              <Menu.ItemIndicator>\n                <CheckIcon size=\"1em\" />\n              </Menu.ItemIndicator>\n            </Menu.OptionItem>\n            <Menu.Separator />\n            <Menu.Root>\n              <Menu.TriggerItem>\n                {t(\"export\")}\n                <Menu.Indicator>\n                  <ChevronRightIcon size=\"1em\" />\n                </Menu.Indicator>\n              </Menu.TriggerItem>\n              <Portal>\n                <Menu.Positioner>\n                  <Menu.Content>\n                    {FORMATS.map((format) => (\n                      <Menu.Item key={format} value={format}>\n                        {t(format)}\n                      </Menu.Item>\n                    ))}\n                  </Menu.Content>\n                </Menu.Positioner>\n              </Portal>\n            </Menu.Root>\n          </Menu.Content>\n        </Menu.Positioner>\n      </Portal>\n    </Menu.Root>\n  );\n}\n";
+//#endregion
+//#region src/menu/examples/card.example.tsx
+var card_example_exports = /* @__PURE__ */ __exportAll({
+	Card: () => Card,
+	source: () => source$4
+});
+function Card(props) {
+	const $ = c(55);
+	const { t } = useWords("menu");
+	const [pinned, setPinned] = useState(true);
+	let t0;
+	if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+		t0 = {
+			size: "lg",
+			variant: "subtle"
+		};
+		$[0] = t0;
+	} else t0 = $[0];
+	let t1;
+	if ($[1] !== t) {
+		t1 = t("rightClickCard");
+		$[1] = t;
+		$[2] = t1;
+	} else t1 = $[2];
+	let t2;
+	if ($[3] !== t1) {
+		t2 = /* @__PURE__ */ jsx(ButtonPropsProvider, {
+			value: t0,
+			children: /* @__PURE__ */ jsx(ContextTrigger, {
+				as: Button,
+				children: t1
+			})
+		});
+		$[3] = t1;
+		$[4] = t2;
+	} else t2 = $[4];
+	let t3;
+	if ($[5] === Symbol.for("react.memo_cache_sentinel")) {
+		t3 = /* @__PURE__ */ jsx(CopyIcon, { size: "1em" });
+		$[5] = t3;
+	} else t3 = $[5];
+	let t4;
+	if ($[6] !== t) {
+		t4 = t("copy");
+		$[6] = t;
+		$[7] = t4;
+	} else t4 = $[7];
+	let t5;
+	if ($[8] === Symbol.for("react.memo_cache_sentinel")) {
+		t5 = /* @__PURE__ */ jsx(ItemCommand, { children: "⌘C" });
+		$[8] = t5;
+	} else t5 = $[8];
+	let t6;
+	if ($[9] !== t4) {
+		t6 = /* @__PURE__ */ jsxs(Item, {
+			value: "copy",
+			children: [
+				t3,
+				t4,
+				t5
+			]
+		});
+		$[9] = t4;
+		$[10] = t6;
+	} else t6 = $[10];
+	let t7;
+	if ($[11] === Symbol.for("react.memo_cache_sentinel")) {
+		t7 = /* @__PURE__ */ jsx(PinIcon, { size: "1em" });
+		$[11] = t7;
+	} else t7 = $[11];
+	let t8;
+	if ($[12] !== t) {
+		t8 = t("keepTop");
+		$[12] = t;
+		$[13] = t8;
+	} else t8 = $[13];
+	let t9;
+	if ($[14] !== t8) {
+		t9 = /* @__PURE__ */ jsx(ItemText, { children: t8 });
+		$[14] = t8;
+		$[15] = t9;
+	} else t9 = $[15];
+	let t10;
+	if ($[16] === Symbol.for("react.memo_cache_sentinel")) {
+		t10 = /* @__PURE__ */ jsx(ItemIndicator, { children: /* @__PURE__ */ jsx(CheckIcon, { size: "1em" }) });
+		$[16] = t10;
+	} else t10 = $[16];
+	let t11;
+	if ($[17] !== pinned || $[18] !== t9) {
+		t11 = /* @__PURE__ */ jsxs(OptionItem, {
+			checked: pinned,
+			onCheckedChange: setPinned,
+			type: "checkbox",
+			value: "pin",
+			children: [
+				t7,
+				t9,
+				t10
+			]
+		});
+		$[17] = pinned;
+		$[18] = t9;
+		$[19] = t11;
+	} else t11 = $[19];
+	let t12;
+	if ($[20] === Symbol.for("react.memo_cache_sentinel")) {
+		t12 = /* @__PURE__ */ jsx(FolderInputIcon, { size: "1em" });
+		$[20] = t12;
+	} else t12 = $[20];
+	let t13;
+	if ($[21] !== t) {
+		t13 = t("moveTo");
+		$[21] = t;
+		$[22] = t13;
+	} else t13 = $[22];
+	let t14;
+	if ($[23] === Symbol.for("react.memo_cache_sentinel")) {
+		t14 = /* @__PURE__ */ jsx(Indicator, { children: /* @__PURE__ */ jsx(ChevronRightIcon, { size: "1em" }) });
+		$[23] = t14;
+	} else t14 = $[23];
+	let t15;
+	if ($[24] !== t13) {
+		t15 = /* @__PURE__ */ jsxs(TriggerItem, { children: [
+			t12,
+			t13,
+			t14
+		] });
+		$[24] = t13;
+		$[25] = t15;
+	} else t15 = $[25];
+	let t16;
+	if ($[26] !== t) {
+		t16 = t("archive");
+		$[26] = t;
+		$[27] = t16;
+	} else t16 = $[27];
+	let t17;
+	if ($[28] !== t16) {
+		t17 = /* @__PURE__ */ jsx(Item, {
+			value: "archive",
+			children: t16
+		});
+		$[28] = t16;
+		$[29] = t17;
+	} else t17 = $[29];
+	let t18;
+	if ($[30] !== t) {
+		t18 = t("drafts");
+		$[30] = t;
+		$[31] = t18;
+	} else t18 = $[31];
+	let t19;
+	if ($[32] !== t18) {
+		t19 = /* @__PURE__ */ jsx(Item, {
+			value: "drafts",
+			children: t18
+		});
+		$[32] = t18;
+		$[33] = t19;
+	} else t19 = $[33];
+	let t20;
+	if ($[34] !== t17 || $[35] !== t19) {
+		t20 = /* @__PURE__ */ jsx(Portal, { children: /* @__PURE__ */ jsx(Positioner, { children: /* @__PURE__ */ jsxs(Content, { children: [t17, t19] }) }) });
+		$[34] = t17;
+		$[35] = t19;
+		$[36] = t20;
+	} else t20 = $[36];
+	let t21;
+	if ($[37] !== t15 || $[38] !== t20) {
+		t21 = /* @__PURE__ */ jsxs(Root, { children: [t15, t20] });
+		$[37] = t15;
+		$[38] = t20;
+		$[39] = t21;
+	} else t21 = $[39];
+	let t22;
+	if ($[40] === Symbol.for("react.memo_cache_sentinel")) {
+		t22 = /* @__PURE__ */ jsx(Separator, {});
+		$[40] = t22;
+	} else t22 = $[40];
+	let t23;
+	if ($[41] === Symbol.for("react.memo_cache_sentinel")) {
+		t23 = /* @__PURE__ */ jsx(TrashIcon, { size: "1em" });
+		$[41] = t23;
+	} else t23 = $[41];
+	let t24;
+	if ($[42] !== t) {
+		t24 = t("delete");
+		$[42] = t;
+		$[43] = t24;
+	} else t24 = $[43];
+	let t25;
+	if ($[44] !== t24) {
+		t25 = /* @__PURE__ */ jsxs(Item, {
+			tone: "critical",
+			value: "delete",
+			children: [t23, t24]
+		});
+		$[44] = t24;
+		$[45] = t25;
+	} else t25 = $[45];
+	let t26;
+	if ($[46] !== t11 || $[47] !== t21 || $[48] !== t25 || $[49] !== t6) {
+		t26 = /* @__PURE__ */ jsx(Portal, { children: /* @__PURE__ */ jsx(Positioner, { children: /* @__PURE__ */ jsxs(Content, { children: [
+			t6,
+			t11,
+			t21,
+			t22,
+			t25
+		] }) }) });
+		$[46] = t11;
+		$[47] = t21;
+		$[48] = t25;
+		$[49] = t6;
+		$[50] = t26;
+	} else t26 = $[50];
+	let t27;
+	if ($[51] !== props || $[52] !== t2 || $[53] !== t26) {
+		t27 = /* @__PURE__ */ jsxs(Root, {
+			...props,
+			children: [t2, t26]
+		});
+		$[51] = props;
+		$[52] = t2;
+		$[53] = t26;
+		$[54] = t27;
+	} else t27 = $[54];
+	return t27;
+}
+const source$4 = "import { type ReactElement, useState } from \"react\";\n\nimport {\n  CheckIcon,\n  ChevronRightIcon,\n  CopyIcon,\n  FolderInputIcon,\n  PinIcon,\n  TrashIcon,\n} from \"lucide-react\";\n\nimport { Button, ButtonPropsProvider } from \"@stealthscale/component-actions\";\nimport { Portal } from \"@stealthscale/component-primitives\";\nimport { useWords } from \"@stealthscale/specimen\";\n\nimport { Menu } from \"@stealthscale/component-disclosure\";\n\nexport function Card(props: Menu.RootProps): ReactElement {\n  const { t } = useWords(\"menu\");\n  const [pinned, setPinned] = useState(true);\n\n  return (\n    <Menu.Root {...props}>\n      <ButtonPropsProvider value={{ size: \"lg\", variant: \"subtle\" }}>\n        <Menu.ContextTrigger as={Button}>{t(\"rightClickCard\")}</Menu.ContextTrigger>\n      </ButtonPropsProvider>\n      <Portal>\n        <Menu.Positioner>\n          <Menu.Content>\n            <Menu.Item value=\"copy\">\n              <CopyIcon size=\"1em\" />\n              {t(\"copy\")}\n              <Menu.ItemCommand>⌘C</Menu.ItemCommand>\n            </Menu.Item>\n            <Menu.OptionItem\n              checked={pinned}\n              onCheckedChange={setPinned}\n              type=\"checkbox\"\n              value=\"pin\"\n            >\n              <PinIcon size=\"1em\" />\n              <Menu.ItemText>{t(\"keepTop\")}</Menu.ItemText>\n              <Menu.ItemIndicator>\n                <CheckIcon size=\"1em\" />\n              </Menu.ItemIndicator>\n            </Menu.OptionItem>\n            <Menu.Root>\n              <Menu.TriggerItem>\n                <FolderInputIcon size=\"1em\" />\n                {t(\"moveTo\")}\n                <Menu.Indicator>\n                  <ChevronRightIcon size=\"1em\" />\n                </Menu.Indicator>\n              </Menu.TriggerItem>\n              <Portal>\n                <Menu.Positioner>\n                  <Menu.Content>\n                    <Menu.Item value=\"archive\">{t(\"archive\")}</Menu.Item>\n                    <Menu.Item value=\"drafts\">{t(\"drafts\")}</Menu.Item>\n                  </Menu.Content>\n                </Menu.Positioner>\n              </Portal>\n            </Menu.Root>\n            <Menu.Separator />\n            <Menu.Item tone=\"critical\" value=\"delete\">\n              <TrashIcon size=\"1em\" />\n              {t(\"delete\")}\n            </Menu.Item>\n          </Menu.Content>\n        </Menu.Positioner>\n      </Portal>\n    </Menu.Root>\n  );\n}\n";
+//#endregion
+//#region src/menu/examples/column.example.tsx
+var column_example_exports = /* @__PURE__ */ __exportAll({
+	Column: () => Column,
+	source: () => source$3
+});
+function Column(props) {
+	const $ = c(39);
+	const { t } = useWords("menu");
+	const [wrapped, setWrapped] = useState(false);
+	let t0;
+	if ($[0] !== t) {
+		t0 = t("amount");
+		$[0] = t;
+		$[1] = t0;
+	} else t0 = $[1];
+	let t1;
+	if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
+		t1 = /* @__PURE__ */ jsx(Indicator, { children: /* @__PURE__ */ jsx(ChevronDownIcon, { size: "1em" }) });
+		$[2] = t1;
+	} else t1 = $[2];
+	let t2;
+	if ($[3] !== t0) {
+		t2 = /* @__PURE__ */ jsxs(Trigger, {
+			as: Button,
+			children: [t0, t1]
+		});
+		$[3] = t0;
+		$[4] = t2;
+	} else t2 = $[4];
+	let t3;
+	if ($[5] === Symbol.for("react.memo_cache_sentinel")) {
+		t3 = /* @__PURE__ */ jsx(ArrowUpNarrowWideIcon, { "aria-hidden": true });
+		$[5] = t3;
+	} else t3 = $[5];
+	let t4;
+	if ($[6] !== t) {
+		t4 = t("sortAscending");
+		$[6] = t;
+		$[7] = t4;
+	} else t4 = $[7];
+	let t5;
+	if ($[8] !== t4) {
+		t5 = /* @__PURE__ */ jsxs(Item, {
+			value: "ascending",
+			children: [t3, t4]
+		});
+		$[8] = t4;
+		$[9] = t5;
+	} else t5 = $[9];
+	let t6;
+	if ($[10] === Symbol.for("react.memo_cache_sentinel")) {
+		t6 = /* @__PURE__ */ jsx(ArrowDownWideNarrowIcon, { "aria-hidden": true });
+		$[10] = t6;
+	} else t6 = $[10];
+	let t7;
+	if ($[11] !== t) {
+		t7 = t("sortDescending");
+		$[11] = t;
+		$[12] = t7;
+	} else t7 = $[12];
+	let t8;
+	if ($[13] !== t7) {
+		t8 = /* @__PURE__ */ jsxs(Item, {
+			value: "descending",
+			children: [t6, t7]
+		});
+		$[13] = t7;
+		$[14] = t8;
+	} else t8 = $[14];
+	let t9;
+	if ($[15] === Symbol.for("react.memo_cache_sentinel")) {
+		t9 = /* @__PURE__ */ jsx(Separator, {});
+		$[15] = t9;
+	} else t9 = $[15];
+	let t10;
+	if ($[16] !== t) {
+		t10 = t("wrapText");
+		$[16] = t;
+		$[17] = t10;
+	} else t10 = $[17];
+	let t11;
+	if ($[18] !== t10) {
+		t11 = /* @__PURE__ */ jsx(ItemText, { children: t10 });
+		$[18] = t10;
+		$[19] = t11;
+	} else t11 = $[19];
+	let t12;
+	if ($[20] === Symbol.for("react.memo_cache_sentinel")) {
+		t12 = /* @__PURE__ */ jsx(ItemIndicator, { children: /* @__PURE__ */ jsx(CheckIcon, { size: "1em" }) });
+		$[20] = t12;
+	} else t12 = $[20];
+	let t13;
+	if ($[21] !== t11 || $[22] !== wrapped) {
+		t13 = /* @__PURE__ */ jsxs(OptionItem, {
+			checked: wrapped,
+			onCheckedChange: setWrapped,
+			type: "checkbox",
+			value: "wrap",
+			children: [t11, t12]
+		});
+		$[21] = t11;
+		$[22] = wrapped;
+		$[23] = t13;
+	} else t13 = $[23];
+	let t14;
+	if ($[24] === Symbol.for("react.memo_cache_sentinel")) {
+		t14 = /* @__PURE__ */ jsx(Separator, {});
+		$[24] = t14;
+	} else t14 = $[24];
+	let t15;
+	if ($[25] === Symbol.for("react.memo_cache_sentinel")) {
+		t15 = /* @__PURE__ */ jsx(EyeOffIcon, { "aria-hidden": true });
+		$[25] = t15;
+	} else t15 = $[25];
+	let t16;
+	if ($[26] !== t) {
+		t16 = t("hideColumn");
+		$[26] = t;
+		$[27] = t16;
+	} else t16 = $[27];
+	let t17;
+	if ($[28] !== t16) {
+		t17 = /* @__PURE__ */ jsxs(Item, {
+			value: "hide",
+			children: [t15, t16]
+		});
+		$[28] = t16;
+		$[29] = t17;
+	} else t17 = $[29];
+	let t18;
+	if ($[30] !== t13 || $[31] !== t17 || $[32] !== t5 || $[33] !== t8) {
+		t18 = /* @__PURE__ */ jsx(Portal, { children: /* @__PURE__ */ jsx(Positioner, { children: /* @__PURE__ */ jsxs(Content, { children: [
+			t5,
+			t8,
+			t9,
+			t13,
+			t14,
+			t17
+		] }) }) });
+		$[30] = t13;
+		$[31] = t17;
+		$[32] = t5;
+		$[33] = t8;
+		$[34] = t18;
+	} else t18 = $[34];
+	let t19;
+	if ($[35] !== props || $[36] !== t18 || $[37] !== t2) {
+		t19 = /* @__PURE__ */ jsxs(Root, {
+			...props,
+			children: [t2, t18]
+		});
+		$[35] = props;
+		$[36] = t18;
+		$[37] = t2;
+		$[38] = t19;
+	} else t19 = $[38];
+	return t19;
+}
+const source$3 = "import { type ReactElement, useState } from \"react\";\n\nimport {\n  ArrowDownWideNarrowIcon,\n  ArrowUpNarrowWideIcon,\n  CheckIcon,\n  ChevronDownIcon,\n  EyeOffIcon,\n} from \"lucide-react\";\n\nimport { Button } from \"@stealthscale/component-actions\";\nimport { Portal } from \"@stealthscale/component-primitives\";\nimport { useWords } from \"@stealthscale/specimen\";\n\nimport { Menu } from \"@stealthscale/component-disclosure\";\n\nexport function Column(props: Menu.RootProps): ReactElement {\n  const { t } = useWords(\"menu\");\n  const [wrapped, setWrapped] = useState(false);\n\n  return (\n    <Menu.Root {...props}>\n      <Menu.Trigger as={Button}>\n        {t(\"amount\")}\n        <Menu.Indicator>\n          <ChevronDownIcon size=\"1em\" />\n        </Menu.Indicator>\n      </Menu.Trigger>\n      <Portal>\n        <Menu.Positioner>\n          <Menu.Content>\n            <Menu.Item value=\"ascending\">\n              <ArrowUpNarrowWideIcon aria-hidden />\n              {t(\"sortAscending\")}\n            </Menu.Item>\n            <Menu.Item value=\"descending\">\n              <ArrowDownWideNarrowIcon aria-hidden />\n              {t(\"sortDescending\")}\n            </Menu.Item>\n            <Menu.Separator />\n            <Menu.OptionItem\n              checked={wrapped}\n              onCheckedChange={setWrapped}\n              type=\"checkbox\"\n              value=\"wrap\"\n            >\n              <Menu.ItemText>{t(\"wrapText\")}</Menu.ItemText>\n              <Menu.ItemIndicator>\n                <CheckIcon size=\"1em\" />\n              </Menu.ItemIndicator>\n            </Menu.OptionItem>\n            <Menu.Separator />\n            <Menu.Item value=\"hide\">\n              <EyeOffIcon aria-hidden />\n              {t(\"hideColumn\")}\n            </Menu.Item>\n          </Menu.Content>\n        </Menu.Positioner>\n      </Portal>\n    </Menu.Root>\n  );\n}\n";
+//#endregion
+//#region src/menu/examples/ledgers.example.tsx
+var ledgers_example_exports = /* @__PURE__ */ __exportAll({
+	Ledgers: () => Ledgers,
+	source: () => source$2
+});
+const LEDGERS = Array.from({ length: 24 }, (_, index) => String(index + 1).padStart(2, "0"));
+function Ledgers(props) {
+	const $ = c(13);
+	const { t } = useWords("menu");
+	let t0;
+	if ($[0] !== t) {
+		t0 = t("pickLedger");
+		$[0] = t;
+		$[1] = t0;
+	} else t0 = $[1];
+	let t1;
+	if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
+		t1 = /* @__PURE__ */ jsx(Indicator, { children: /* @__PURE__ */ jsx(ChevronDownIcon, { size: "1em" }) });
+		$[2] = t1;
+	} else t1 = $[2];
+	let t2;
+	if ($[3] !== t0) {
+		t2 = /* @__PURE__ */ jsxs(Trigger, {
+			as: Button,
+			children: [t0, t1]
+		});
+		$[3] = t0;
+		$[4] = t2;
+	} else t2 = $[4];
+	let t3;
+	if ($[5] !== t) {
+		t3 = LEDGERS.map((number) => /* @__PURE__ */ jsx(Item, {
+			value: number,
+			children: t("ledger", { number })
+		}, number));
+		$[5] = t;
+		$[6] = t3;
+	} else t3 = $[6];
+	let t4;
+	if ($[7] !== t3) {
+		t4 = /* @__PURE__ */ jsx(Portal, { children: /* @__PURE__ */ jsx(Positioner, { children: /* @__PURE__ */ jsx(Content, { children: t3 }) }) });
+		$[7] = t3;
+		$[8] = t4;
+	} else t4 = $[8];
+	let t5;
+	if ($[9] !== props || $[10] !== t2 || $[11] !== t4) {
+		t5 = /* @__PURE__ */ jsxs(Root, {
+			...props,
+			children: [t2, t4]
+		});
+		$[9] = props;
+		$[10] = t2;
+		$[11] = t4;
+		$[12] = t5;
+	} else t5 = $[12];
+	return t5;
+}
+const source$2 = "import { type ReactElement } from \"react\";\n\nimport { ChevronDownIcon } from \"lucide-react\";\n\nimport { Button } from \"@stealthscale/component-actions\";\nimport { Portal } from \"@stealthscale/component-primitives\";\nimport { useWords } from \"@stealthscale/specimen\";\n\nimport { Menu } from \"@stealthscale/component-disclosure\";\n\nconst LEDGERS = Array.from({ length: 24 }, (_, index) => String(index + 1).padStart(2, \"0\"));\n\nexport function Ledgers(props: Menu.RootProps): ReactElement {\n  const { t } = useWords(\"menu\");\n\n  return (\n    <Menu.Root {...props}>\n      <Menu.Trigger as={Button}>\n        {t(\"pickLedger\")}\n        <Menu.Indicator>\n          <ChevronDownIcon size=\"1em\" />\n        </Menu.Indicator>\n      </Menu.Trigger>\n      <Portal>\n        <Menu.Positioner>\n          <Menu.Content>\n            {LEDGERS.map((number) => (\n              <Menu.Item key={number} value={number}>\n                {t(\"ledger\", { number })}\n              </Menu.Item>\n            ))}\n          </Menu.Content>\n        </Menu.Positioner>\n      </Portal>\n    </Menu.Root>\n  );\n}\n";
+//#endregion
+//#region src/menu/examples/more.example.tsx
+var more_example_exports = /* @__PURE__ */ __exportAll({
+	More: () => More,
+	source: () => source$1
+});
+function More(props) {
+	const $ = c(33);
+	const { t } = useWords("menu");
+	let t0;
+	if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+		t0 = { variant: "outline" };
+		$[0] = t0;
+	} else t0 = $[0];
+	let t1;
+	if ($[1] !== t) {
+		t1 = t("more");
+		$[1] = t;
+		$[2] = t1;
+	} else t1 = $[2];
+	let t2;
+	if ($[3] === Symbol.for("react.memo_cache_sentinel")) {
+		t2 = /* @__PURE__ */ jsx(EllipsisIcon, {});
+		$[3] = t2;
+	} else t2 = $[3];
+	let t3;
+	if ($[4] !== t1) {
+		t3 = /* @__PURE__ */ jsx(ButtonPropsProvider, {
+			value: t0,
+			children: /* @__PURE__ */ jsx(Trigger, {
+				"aria-label": t1,
+				as: IconButton,
+				children: t2
+			})
+		});
+		$[4] = t1;
+		$[5] = t3;
+	} else t3 = $[5];
+	let t4;
+	if ($[6] === Symbol.for("react.memo_cache_sentinel")) {
+		t4 = /* @__PURE__ */ jsx(Arrow, { children: /* @__PURE__ */ jsx(ArrowTip, {}) });
+		$[6] = t4;
+	} else t4 = $[6];
+	let t5;
+	if ($[7] !== t) {
+		t5 = t("rename");
+		$[7] = t;
+		$[8] = t5;
+	} else t5 = $[8];
+	let t6;
+	if ($[9] !== t5) {
+		t6 = /* @__PURE__ */ jsx(Item, {
+			value: "rename",
+			children: t5
+		});
+		$[9] = t5;
+		$[10] = t6;
+	} else t6 = $[10];
+	let t7;
+	if ($[11] !== t) {
+		t7 = t("duplicate");
+		$[11] = t;
+		$[12] = t7;
+	} else t7 = $[12];
+	let t8;
+	if ($[13] !== t7) {
+		t8 = /* @__PURE__ */ jsx(Item, {
+			value: "duplicate",
+			children: t7
+		});
+		$[13] = t7;
+		$[14] = t8;
+	} else t8 = $[14];
+	let t9;
+	if ($[15] !== t) {
+		t9 = t("archive");
+		$[15] = t;
+		$[16] = t9;
+	} else t9 = $[16];
+	let t10;
+	if ($[17] !== t9) {
+		t10 = /* @__PURE__ */ jsx(Item, {
+			disabled: true,
+			value: "archive",
+			children: t9
+		});
+		$[17] = t9;
+		$[18] = t10;
+	} else t10 = $[18];
+	let t11;
+	if ($[19] === Symbol.for("react.memo_cache_sentinel")) {
+		t11 = /* @__PURE__ */ jsx(Separator, {});
+		$[19] = t11;
+	} else t11 = $[19];
+	let t12;
+	if ($[20] !== t) {
+		t12 = t("delete");
+		$[20] = t;
+		$[21] = t12;
+	} else t12 = $[21];
+	let t13;
+	if ($[22] !== t12) {
+		t13 = /* @__PURE__ */ jsx(Item, {
+			tone: "critical",
+			value: "delete",
+			children: t12
+		});
+		$[22] = t12;
+		$[23] = t13;
+	} else t13 = $[23];
+	let t14;
+	if ($[24] !== t10 || $[25] !== t13 || $[26] !== t6 || $[27] !== t8) {
+		t14 = /* @__PURE__ */ jsx(Portal, { children: /* @__PURE__ */ jsx(Positioner, { children: /* @__PURE__ */ jsxs(Content, { children: [
+			t4,
+			t6,
+			t8,
+			t10,
+			t11,
+			t13
+		] }) }) });
+		$[24] = t10;
+		$[25] = t13;
+		$[26] = t6;
+		$[27] = t8;
+		$[28] = t14;
+	} else t14 = $[28];
+	let t15;
+	if ($[29] !== props || $[30] !== t14 || $[31] !== t3) {
+		t15 = /* @__PURE__ */ jsxs(Root, {
+			...props,
+			children: [t3, t14]
+		});
+		$[29] = props;
+		$[30] = t14;
+		$[31] = t3;
+		$[32] = t15;
+	} else t15 = $[32];
+	return t15;
+}
+const source$1 = "import { type ReactElement } from \"react\";\n\nimport { EllipsisIcon } from \"lucide-react\";\n\nimport { ButtonPropsProvider, IconButton } from \"@stealthscale/component-actions\";\nimport { Portal } from \"@stealthscale/component-primitives\";\nimport { useWords } from \"@stealthscale/specimen\";\n\nimport { Menu } from \"@stealthscale/component-disclosure\";\n\nexport function More(props: Menu.RootProps): ReactElement {\n  const { t } = useWords(\"menu\");\n\n  return (\n    <Menu.Root {...props}>\n      <ButtonPropsProvider value={{ variant: \"outline\" }}>\n        <Menu.Trigger aria-label={t(\"more\")} as={IconButton}>\n          <EllipsisIcon />\n        </Menu.Trigger>\n      </ButtonPropsProvider>\n      <Portal>\n        <Menu.Positioner>\n          <Menu.Content>\n            <Menu.Arrow>\n              <Menu.ArrowTip />\n            </Menu.Arrow>\n            <Menu.Item value=\"rename\">{t(\"rename\")}</Menu.Item>\n            <Menu.Item value=\"duplicate\">{t(\"duplicate\")}</Menu.Item>\n            <Menu.Item disabled value=\"archive\">\n              {t(\"archive\")}\n            </Menu.Item>\n            <Menu.Separator />\n            <Menu.Item tone=\"critical\" value=\"delete\">\n              {t(\"delete\")}\n            </Menu.Item>\n          </Menu.Content>\n        </Menu.Positioner>\n      </Portal>\n    </Menu.Root>\n  );\n}\n";
+//#endregion
+//#region src/menu/examples/workspaces.example.tsx
+var workspaces_example_exports = /* @__PURE__ */ __exportAll({
+	Workspaces: () => Workspaces,
+	source: () => source
+});
+const WORKSPACES = [
+	["acme", "acmePlan"],
+	["globex", "globexPlan"],
+	["initech", "initechPlan"]
+];
+function Workspaces(props) {
+	const $ = c(35);
+	const { t } = useWords("menu");
+	const [current, setCurrent] = useState("acme");
+	let t0;
+	if ($[0] !== t) {
+		t0 = t("switchWorkspace");
+		$[0] = t;
+		$[1] = t0;
+	} else t0 = $[1];
+	let t1;
+	if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
+		t1 = /* @__PURE__ */ jsx(Indicator, { children: /* @__PURE__ */ jsx(ChevronsUpDownIcon, { size: "1em" }) });
+		$[2] = t1;
+	} else t1 = $[2];
+	let t2;
+	if ($[3] !== t0) {
+		t2 = /* @__PURE__ */ jsxs(Trigger, {
+			as: Button,
+			children: [t0, t1]
+		});
+		$[3] = t0;
+		$[4] = t2;
+	} else t2 = $[4];
+	let t3;
+	if ($[5] !== t) {
+		t3 = t("workspaces");
+		$[5] = t;
+		$[6] = t3;
+	} else t3 = $[6];
+	let t4;
+	if ($[7] !== t3) {
+		t4 = /* @__PURE__ */ jsx(ItemGroupLabel, {
+			value: "workspaces",
+			children: t3
+		});
+		$[7] = t3;
+		$[8] = t4;
+	} else t4 = $[8];
+	let t5;
+	if ($[9] !== current || $[10] !== t) {
+		t5 = WORKSPACES.map((t6) => {
+			const [name, plan] = t6;
+			return /* @__PURE__ */ jsxs(OptionItem, {
+				checked: current === name,
+				onCheckedChange: () => {
+					setCurrent(name);
+				},
+				type: "radio",
+				value: name,
+				children: [
+					/* @__PURE__ */ jsx(ItemMark, { children: t(name).slice(0, 1) }),
+					/* @__PURE__ */ jsxs(ItemLines, { children: [/* @__PURE__ */ jsx(ItemText, { children: t(name) }), /* @__PURE__ */ jsx(ItemDescription, { children: t(plan) })] }),
+					/* @__PURE__ */ jsx(ItemIndicator, { children: /* @__PURE__ */ jsx(CheckIcon, { size: "1em" }) })
+				]
+			}, name);
+		});
+		$[9] = current;
+		$[10] = t;
+		$[11] = t5;
+	} else t5 = $[11];
+	let t6;
+	if ($[12] !== t4 || $[13] !== t5) {
+		t6 = /* @__PURE__ */ jsxs(ItemGroup, {
+			value: "workspaces",
+			children: [t4, t5]
+		});
+		$[12] = t4;
+		$[13] = t5;
+		$[14] = t6;
+	} else t6 = $[14];
+	let t7;
+	if ($[15] === Symbol.for("react.memo_cache_sentinel")) {
+		t7 = /* @__PURE__ */ jsx(Separator, {});
+		$[15] = t7;
+	} else t7 = $[15];
+	let t8;
+	if ($[16] === Symbol.for("react.memo_cache_sentinel")) {
+		t8 = /* @__PURE__ */ jsx(ItemMark, { children: /* @__PURE__ */ jsx(PlusIcon, { size: "1em" }) });
+		$[16] = t8;
+	} else t8 = $[16];
+	let t9;
+	if ($[17] !== t) {
+		t9 = t("createWorkspace");
+		$[17] = t;
+		$[18] = t9;
+	} else t9 = $[18];
+	let t10;
+	if ($[19] !== t9) {
+		t10 = /* @__PURE__ */ jsxs(Item, {
+			value: "create",
+			children: [t8, t9]
+		});
+		$[19] = t9;
+		$[20] = t10;
+	} else t10 = $[20];
+	let t11;
+	if ($[21] === Symbol.for("react.memo_cache_sentinel")) {
+		t11 = /* @__PURE__ */ jsx(ItemMark, { children: /* @__PURE__ */ jsx(SettingsIcon, { size: "1em" }) });
+		$[21] = t11;
+	} else t11 = $[21];
+	let t12;
+	if ($[22] !== t) {
+		t12 = t("settings");
+		$[22] = t;
+		$[23] = t12;
+	} else t12 = $[23];
+	let t13;
+	if ($[24] === Symbol.for("react.memo_cache_sentinel")) {
+		t13 = /* @__PURE__ */ jsx(ItemCommand, { children: "⌘," });
+		$[24] = t13;
+	} else t13 = $[24];
+	let t14;
+	if ($[25] !== t12) {
+		t14 = /* @__PURE__ */ jsxs(Item, {
+			value: "settings",
+			children: [
+				t11,
+				t12,
+				t13
+			]
+		});
+		$[25] = t12;
+		$[26] = t14;
+	} else t14 = $[26];
+	let t15;
+	if ($[27] !== t10 || $[28] !== t14 || $[29] !== t6) {
+		t15 = /* @__PURE__ */ jsx(Portal, { children: /* @__PURE__ */ jsx(Positioner, { children: /* @__PURE__ */ jsxs(Content, { children: [
+			t6,
+			t7,
+			t10,
+			t14
+		] }) }) });
+		$[27] = t10;
+		$[28] = t14;
+		$[29] = t6;
+		$[30] = t15;
+	} else t15 = $[30];
+	let t16;
+	if ($[31] !== props || $[32] !== t15 || $[33] !== t2) {
+		t16 = /* @__PURE__ */ jsxs(Root, {
+			...props,
+			children: [t2, t15]
+		});
+		$[31] = props;
+		$[32] = t15;
+		$[33] = t2;
+		$[34] = t16;
+	} else t16 = $[34];
+	return t16;
+}
+const source = "import { type ReactElement, useState } from \"react\";\n\nimport { CheckIcon, ChevronsUpDownIcon, PlusIcon, SettingsIcon } from \"lucide-react\";\n\nimport { Button } from \"@stealthscale/component-actions\";\nimport { Portal } from \"@stealthscale/component-primitives\";\nimport { useWords } from \"@stealthscale/specimen\";\n\nimport { Menu } from \"@stealthscale/component-disclosure\";\n\nconst WORKSPACES = [\n  [\"acme\", \"acmePlan\"],\n  [\"globex\", \"globexPlan\"],\n  [\"initech\", \"initechPlan\"],\n] as const;\n\nexport function Workspaces(props: Menu.RootProps): ReactElement {\n  const { t } = useWords(\"menu\");\n  const [current, setCurrent] = useState<string>(\"acme\");\n\n  return (\n    <Menu.Root {...props}>\n      <Menu.Trigger as={Button}>\n        {t(\"switchWorkspace\")}\n        <Menu.Indicator>\n          <ChevronsUpDownIcon size=\"1em\" />\n        </Menu.Indicator>\n      </Menu.Trigger>\n      <Portal>\n        <Menu.Positioner>\n          <Menu.Content>\n            <Menu.ItemGroup value=\"workspaces\">\n              <Menu.ItemGroupLabel value=\"workspaces\">{t(\"workspaces\")}</Menu.ItemGroupLabel>\n              {WORKSPACES.map(([name, plan]) => (\n                <Menu.OptionItem\n                  checked={current === name}\n                  key={name}\n                  onCheckedChange={() => {\n                    setCurrent(name);\n                  }}\n                  type=\"radio\"\n                  value={name}\n                >\n                  <Menu.ItemMark>{t(name).slice(0, 1)}</Menu.ItemMark>\n                  <Menu.ItemLines>\n                    <Menu.ItemText>{t(name)}</Menu.ItemText>\n                    <Menu.ItemDescription>{t(plan)}</Menu.ItemDescription>\n                  </Menu.ItemLines>\n                  <Menu.ItemIndicator>\n                    <CheckIcon size=\"1em\" />\n                  </Menu.ItemIndicator>\n                </Menu.OptionItem>\n              ))}\n            </Menu.ItemGroup>\n            <Menu.Separator />\n            <Menu.Item value=\"create\">\n              <Menu.ItemMark>\n                <PlusIcon size=\"1em\" />\n              </Menu.ItemMark>\n              {t(\"createWorkspace\")}\n            </Menu.Item>\n            <Menu.Item value=\"settings\">\n              <Menu.ItemMark>\n                <SettingsIcon size=\"1em\" />\n              </Menu.ItemMark>\n              {t(\"settings\")}\n              <Menu.ItemCommand>⌘,</Menu.ItemCommand>\n            </Menu.Item>\n          </Menu.Content>\n        </Menu.Positioner>\n      </Portal>\n    </Menu.Root>\n  );\n}\n";
+//#endregion
+//#region src/menu/menu.specimen.tsx
+/**
+* Catalogue page for the menu.
+*
+* @remarks
+*   `scenesOf` generates the looks, the highlights by sizes and the palettes from the actions
+*   example, and the gutter from the column example, whose rows mix icon rows and plain rows. The
+*   placement, mark, long-list, context-menu, submenu and right-to-left scenes are hand-written,
+*   because each shows a machine option, a part or a behaviour that no axis sets. Every menu
+*   renders closed and portals its panel to the document body, so an opened panel renders over the
+*   page at the size the window allows, and a scene is as tall as its triggers. A single trigger
+*   renders in a `Sample`, which keeps it at its own width. The words are keys under `menu` in
+*   `locales/en/specimen/menu.json`.
+*/
+/**
+* Placements of the placement scene.
+*/
+const PLACEMENTS = [
+	"bottom-start",
+	"bottom",
+	"bottom-end",
+	"top-start",
+	"top",
+	"top-end"
+];
+/**
+* Hand-written scene for six placements, with the arrow on each panel.
+*/
+const placements = {
+	about: "menu.placements.about",
+	draw: () => /* @__PURE__ */ jsx(Matrix, {
+		knob: "placement",
+		of: PLACEMENTS,
+		children: (placement) => /* @__PURE__ */ jsx(More, { positioning: { placement } })
+	}),
+	example: more_example_exports,
+	props: { positioning: { placement: "bottom-start" } },
+	title: "menu.placements.title"
+};
+/**
+* Hand-written scene for rows that lead with a mark and read a name over a description.
+*/
+const marks = {
+	about: "menu.marks.about",
+	draw: () => /* @__PURE__ */ jsx(Sample, { children: /* @__PURE__ */ jsx(Workspaces, {}) }),
+	example: workspaces_example_exports,
+	title: "menu.marks.title"
+};
+/**
+* Hand-written scene for a list longer than the window.
+*/
+const long = {
+	about: "menu.long.about",
+	draw: () => /* @__PURE__ */ jsx(Sample, { children: /* @__PURE__ */ jsx(Ledgers, {}) }),
+	example: ledgers_example_exports,
+	title: "menu.long.title"
+};
+/**
+* Hand-written scene for a menu that opens over a region at the pointer.
+*/
+const over = {
+	about: "menu.over.about",
+	draw: Card,
+	example: card_example_exports,
+	title: "menu.over.title"
+};
+/**
+* Hand-written scene for a submenu opened from a row.
+*/
+const submenus = {
+	about: "menu.submenus.about",
+	draw: () => /* @__PURE__ */ jsx(Sample, { children: /* @__PURE__ */ jsx(Actions, {}) }),
+	example: actions_example_exports,
+	title: "menu.submenus.title"
+};
+/**
+* Hand-written scene for a menu in a right-to-left document.
+*/
+const rtl = {
+	about: "menu.rtl.about",
+	draw: () => /* @__PURE__ */ jsx("div", {
+		dir: "rtl",
+		children: /* @__PURE__ */ jsx(Actions, { dir: "rtl" })
+	}),
+	example: actions_example_exports,
+	props: { dir: "rtl" },
+	title: "menu.rtl.title"
+};
+var menu_specimen_default = specimen({
+	about: "menu.about",
+	id: "components/disclosure/menu",
+	imports: "import { Menu } from \"@stealthscale/component-disclosure\";",
+	scenes: [
+		...scenesOf(recipe, {
+			axes: {
+				highlight: { across: "size" },
+				inset: {
+					draw: (props) => /* @__PURE__ */ jsx(Column, { ...props }),
+					example: column_example_exports
+				}
+			},
+			draw: (props) => /* @__PURE__ */ jsx(Actions, { ...props }),
+			example: actions_example_exports,
+			namespace: "menu",
+			order: [
+				"variant",
+				"highlight",
+				"inset",
+				"palette"
+			]
+		}),
+		placements,
+		marks,
+		long,
+		over,
+		submenus,
+		rtl
+	],
+	title: "menu.title"
+});
+//#endregion
+export { menu_specimen_default as default, long, marks, over, placements, rtl, submenus };