@diagrammo/dgmo 0.88.0 → 0.89.0

package/dist/chart-meta.js

@@ -1,7 +1,7 @@
 import {
   normalizePertSourceForShare,
   resolveOrgImports
-} from "./chunk-FPXMCGS5.js";
+} from "./chunk-SLQT3JP3.js";
 import {
   decodeDiagramUrl,
   decodeViewState,
@@ -10,22 +10,26 @@ import {
 } from "./chunk-RE27AX7O.js";
 import {
   parseDgmoChartType
-} from "./chunk-AQIBKTPG.js";
+} from "./chunk-K5XT7NHD.js";
 import {
   parseRaci
 } from "./chunk-3RYBTEF5.js";
-import "./chunk-UNNJCSSQ.js";
-import "./chunk-3TYUXC7D.js";
+import "./chunk-JVZ7KFAX.js";
+import "./chunk-2SKMEL7V.js";
 import "./chunk-7WGCQE2E.js";
 import "./chunk-EQW6HOP4.js";
 import "./chunk-DAOFNU6J.js";
-import "./chunk-VPASQOR3.js";
+import {
+  getAvailablePalettes,
+  getPalette
+} from "./chunk-NIUO2TNR.js";
+import "./chunk-LFKSHDVI.js";
 import "./chunk-C3Z4DX3V.js";
 import "./chunk-JRUEIRJB.js";
 import "./chunk-7TF3QOOD.js";
 import "./chunk-AYOVY75O.js";
 import "./chunk-NXMESY4J.js";
-import "./chunk-A4XPI4YN.js";
+import "./chunk-MFW6P7WH.js";
 import "./chunk-WPL5PFXE.js";
 import "./chunk-J64NZ6NF.js";
 import "./chunk-O753JUEZ.js";
@@ -44,13 +48,9 @@ import {
   parseFirstLine
 } from "./chunk-44GP7PD5.js";
 import "./chunk-5NU7NII2.js";
-import {
-  getAvailablePalettes,
-  getPalette
-} from "./chunk-IDJGV6VM.js";
 import {
   hexToHSLString
-} from "./chunk-7HWY4QAJ.js";
+} from "./chunk-L24LESXF.js";
 import "./chunk-2M4IGSCY.js";
 import "./chunk-BYU54C3S.js";
 import "./chunk-5WRI5ZAA.js";

package/dist/{chart-types-Db_EGf1o.d.ts → chart-types-Bf8C5QQW.d.ts}

@@ -4,7 +4,7 @@ import { P as PaletteConfig } from './tag-groups-fgxWTyyB.js';
 declare function isValidHex(value: string): boolean;
 /**
  * Register a palette. Called at module initialization.
- * Validates that all 19 color fields per mode are present and valid hex.
+ * Validates that all 23 color fields per mode are present and valid hex.
  * Throws on malformed palettes to catch errors at startup, not at render time.
  */
 declare function registerPalette(palette: PaletteConfig): void;

package/dist/{charts-d3-3BZRSZV6.js → charts-d3-KEQSUWKP.js}

@@ -2,24 +2,24 @@ import {
   D3_DATA_CHART_TYPES,
   renderDataChartD3,
   supportsD3DataChart
-} from "./chunk-H2GEIFUF.js";
+} from "./chunk-3AQJNY65.js";
 import "./chunk-KMU65FYM.js";
 import "./chunk-EPDBWATV.js";
 import "./chunk-7UDAIP6W.js";
 import "./chunk-2CW5ZTNH.js";
-import "./chunk-RE6TVIAV.js";
-import "./chunk-QFIXL3OK.js";
-import "./chunk-3DOQOXXI.js";
-import "./chunk-LD2JSKU3.js";
+import "./chunk-UKJLPA7R.js";
+import "./chunk-SEKNYIMO.js";
+import "./chunk-CNUN5GO6.js";
+import "./chunk-OOCVGX4W.js";
 import "./chunk-VLC6WNRD.js";
-import "./chunk-FM3WAVB6.js";
+import "./chunk-NS7L7YKH.js";
 import "./chunk-ICLB27PZ.js";
-import "./chunk-RH2PROYG.js";
-import "./chunk-KAO7JL4I.js";
+import "./chunk-NIUO2TNR.js";
 import "./chunk-L5AFONQU.js";
 import "./chunk-44GP7PD5.js";
-import "./chunk-IDJGV6VM.js";
-import "./chunk-7HWY4QAJ.js";
+import "./chunk-I6GGMCTV.js";
+import "./chunk-KAO7JL4I.js";
+import "./chunk-L24LESXF.js";
 import "./chunk-2M4IGSCY.js";
 import "./chunk-BYU54C3S.js";
 import "./chunk-5WRI5ZAA.js";

package/dist/{chunk-LJFXC3IP.js → chunk-2GM7N5TV.js}

@@ -18,7 +18,7 @@ import {
 } from "./chunk-XCKNFFKM.js";
 import {
   layoutInlineHeader
-} from "./chunk-3DOQOXXI.js";
+} from "./chunk-CNUN5GO6.js";
 import {
   TITLE_FONT_SIZE,
   TITLE_FONT_WEIGHT,
@@ -26,20 +26,14 @@ import {
 } from "./chunk-VLC6WNRD.js";
 import {
   renderIntegratedLegend
-} from "./chunk-LHL6HDUL.js";
+} from "./chunk-7SX4IY6T.js";
 import {
   getLegendExtent,
   getMaxLegendReservedHeight
-} from "./chunk-FM3WAVB6.js";
+} from "./chunk-NS7L7YKH.js";
 import {
   FONT_FAMILY
 } from "./chunk-ICLB27PZ.js";
-import {
-  LEGEND_GROUP_GAP
-} from "./chunk-RH2PROYG.js";
-import {
-  measureText
-} from "./chunk-KAO7JL4I.js";
 import {
   UNTAGGED_TAG_COLOR,
   resolveTagColor,
@@ -50,12 +44,18 @@ import {
   legendInlineRequested,
   legendSuppressed
 } from "./chunk-44GP7PD5.js";
+import {
+  LEGEND_GROUP_GAP
+} from "./chunk-I6GGMCTV.js";
+import {
+  measureText
+} from "./chunk-KAO7JL4I.js";
 import {
   contrastText,
   mix,
   shapeFill,
   themeBaseBg
-} from "./chunk-7HWY4QAJ.js";
+} from "./chunk-L24LESXF.js";
 import {
   resolveColor
 } from "./chunk-2M4IGSCY.js";

package/dist/{chunk-H2GEIFUF.js → chunk-3AQJNY65.js}

@@ -25,10 +25,10 @@ import {
   initD3Chart,
   renderChartTitle,
   resolveExportPalette
-} from "./chunk-RE6TVIAV.js";
+} from "./chunk-UKJLPA7R.js";
 import {
   layoutInlineHeader
-} from "./chunk-3DOQOXXI.js";
+} from "./chunk-CNUN5GO6.js";
 import {
   TITLE_FONT_SIZE,
   TITLE_FONT_WEIGHT,
@@ -37,23 +37,23 @@ import {
 } from "./chunk-VLC6WNRD.js";
 import {
   computeLegendLayout
-} from "./chunk-FM3WAVB6.js";
+} from "./chunk-NS7L7YKH.js";
 import {
   FONT_FAMILY
 } from "./chunk-ICLB27PZ.js";
+import {
+  tagAttrKey
+} from "./chunk-L5AFONQU.js";
 import {
   LEGEND_DOT_R,
   LEGEND_ENTRY_FONT_SIZE,
   LEGEND_HEIGHT,
   LEGEND_PILL_FONT_SIZE,
   legendChromeColors
-} from "./chunk-RH2PROYG.js";
+} from "./chunk-I6GGMCTV.js";
 import {
   measureText
 } from "./chunk-KAO7JL4I.js";
-import {
-  tagAttrKey
-} from "./chunk-L5AFONQU.js";
 import {
   contrastText,
   getSegmentColors,
@@ -63,7 +63,7 @@ import {
   mix,
   shapeFill,
   themeBaseBg
-} from "./chunk-7HWY4QAJ.js";
+} from "./chunk-L24LESXF.js";
 
 // src/charts-d3/natural-size.ts
 var UNCOUNTED_WIDTH = 720;

package/dist/{chunk-WXPBP4IT.js → chunk-44FTCIRI.js}

@@ -11,7 +11,7 @@ import {
 } from "./chunk-ABP5BUD6.js";
 import {
   layoutInlineHeader
-} from "./chunk-3DOQOXXI.js";
+} from "./chunk-CNUN5GO6.js";
 import {
   TITLE_FONT_SIZE,
   TITLE_FONT_WEIGHT,
@@ -19,31 +19,31 @@ import {
 } from "./chunk-VLC6WNRD.js";
 import {
   renderIntegratedLegend
-} from "./chunk-LHL6HDUL.js";
+} from "./chunk-7SX4IY6T.js";
 import {
   getLegendExtent,
   getMaxLegendReservedHeight
-} from "./chunk-FM3WAVB6.js";
+} from "./chunk-NS7L7YKH.js";
 import {
   FONT_FAMILY
 } from "./chunk-ICLB27PZ.js";
+import {
+  resolveTagColor,
+  tagAttrKey
+} from "./chunk-L5AFONQU.js";
 import {
   LEGEND_GROUP_GAP
-} from "./chunk-RH2PROYG.js";
+} from "./chunk-I6GGMCTV.js";
 import {
   measureText
 } from "./chunk-KAO7JL4I.js";
-import {
-  resolveTagColor,
-  tagAttrKey
-} from "./chunk-L5AFONQU.js";
 import {
   contrastText,
   getSeriesColors,
   mix,
   shapeFill,
   themeBaseBg
-} from "./chunk-7HWY4QAJ.js";
+} from "./chunk-L24LESXF.js";
 import {
   resolveColor
 } from "./chunk-2M4IGSCY.js";

package/dist/{chunk-WZ23JJ7U.js → chunk-4AJKOUBO.js}

@@ -4,7 +4,7 @@ import {
   layoutC4Containers,
   layoutC4Context,
   layoutC4Deployment
-} from "./chunk-DAX42XVH.js";
+} from "./chunk-LYLNMN77.js";
 import {
   appendArrowheadMarkers,
   appendReverseArrowheadMarkers
@@ -28,27 +28,20 @@ import {
 } from "./chunk-XCKNFFKM.js";
 import {
   serializeSvg
-} from "./chunk-LD2JSKU3.js";
+} from "./chunk-OOCVGX4W.js";
 import {
   TITLE_FONT_SIZE,
   TITLE_FONT_WEIGHT
 } from "./chunk-VLC6WNRD.js";
 import {
   renderIntegratedLegend
-} from "./chunk-LHL6HDUL.js";
+} from "./chunk-7SX4IY6T.js";
 import {
   FONT_FAMILY
 } from "./chunk-ICLB27PZ.js";
 import {
   parseC4
 } from "./chunk-GSYZZFI5.js";
-import {
-  LEGEND_HEIGHT
-} from "./chunk-RH2PROYG.js";
-import {
-  measureText,
-  wrapTextToWidth
-} from "./chunk-KAO7JL4I.js";
 import {
   preprocessDescriptionLine
 } from "./chunk-IYULMRBE.js";
@@ -59,12 +52,19 @@ import {
 import {
   fillModeFromOptions
 } from "./chunk-44GP7PD5.js";
+import {
+  LEGEND_HEIGHT
+} from "./chunk-I6GGMCTV.js";
+import {
+  measureText,
+  wrapTextToWidth
+} from "./chunk-KAO7JL4I.js";
 import {
   contrastText,
   groupFill,
   mix,
   shapeFill
-} from "./chunk-7HWY4QAJ.js";
+} from "./chunk-L24LESXF.js";
 
 // src/c4/renderer.ts
 import * as d3Selection from "d3-selection";

package/dist/{chunk-YK4N6TBN.js → chunk-4R6OMKXB.js}

@@ -12,27 +12,27 @@ import {
 } from "./chunk-VLC6WNRD.js";
 import {
   renderIntegratedLegend
-} from "./chunk-LHL6HDUL.js";
+} from "./chunk-7SX4IY6T.js";
 import {
   getMaxLegendReservedHeight
-} from "./chunk-FM3WAVB6.js";
+} from "./chunk-NS7L7YKH.js";
 import {
   FONT_FAMILY
 } from "./chunk-ICLB27PZ.js";
+import {
+  fillModeFromOptions,
+  legendSuppressed
+} from "./chunk-44GP7PD5.js";
 import {
   measureText,
   truncateText,
   wrapTextToWidth
 } from "./chunk-KAO7JL4I.js";
-import {
-  fillModeFromOptions,
-  legendSuppressed
-} from "./chunk-44GP7PD5.js";
 import {
   contrastText,
   mix,
   shapeFill
-} from "./chunk-7HWY4QAJ.js";
+} from "./chunk-L24LESXF.js";
 
 // src/tech-radar/renderer.ts
 import * as d3Selection2 from "d3-selection";

package/dist/{chunk-HEYGGSNQ.js → chunk-5LE2CTLS.js}

@@ -1,6 +1,6 @@
 import {
   buildSwatches
-} from "./chunk-ERNCPKD4.js";
+} from "./chunk-G2KHLANR.js";
 import {
   fixedParts,
   fixedTimeCells,
@@ -21,7 +21,7 @@ import {
   contrastText,
   mix,
   themeBaseBg
-} from "./chunk-7HWY4QAJ.js";
+} from "./chunk-L24LESXF.js";
 import {
   resolveColor
 } from "./chunk-2M4IGSCY.js";

package/dist/{chunk-MVCPO6LI.js → chunk-7C2RAGPT.js}

@@ -13,23 +13,34 @@ import {
 import {
   INLINE_HEADER_PAD,
   layoutInlineHeader
-} from "./chunk-3DOQOXXI.js";
+} from "./chunk-CNUN5GO6.js";
 import {
   TITLE_FONT_SIZE,
   TITLE_FONT_WEIGHT,
   TITLE_Y
 } from "./chunk-VLC6WNRD.js";
 import {
-  renderIntegratedLegend
-} from "./chunk-LHL6HDUL.js";
+  keepSwimlaneToggleFocus,
+  renderIntegratedLegend,
+  wireSwimlaneToggle
+} from "./chunk-7SX4IY6T.js";
 import {
   controlsGroupCapsuleWidth,
   getLegendExtent,
   getMaxLegendReservedHeight
-} from "./chunk-FM3WAVB6.js";
+} from "./chunk-NS7L7YKH.js";
 import {
   FONT_FAMILY
 } from "./chunk-ICLB27PZ.js";
+import {
+  normalizeName
+} from "./chunk-NOTA6TEI.js";
+import {
+  UNTAGGED_TAG_COLOR,
+  resolveActiveTagGroup,
+  resolveTagColor,
+  tagAttrKey
+} from "./chunk-L5AFONQU.js";
 import {
   LEGEND_CAPSULE_PAD,
   LEGEND_DOT_R,
@@ -44,28 +55,19 @@ import {
   LEGEND_PILL_PAD,
   measureLegendText,
   truncateLegendText
-} from "./chunk-RH2PROYG.js";
+} from "./chunk-I6GGMCTV.js";
 import {
   CHAR_WIDTH_RATIO,
   measureText,
   truncateText
 } from "./chunk-KAO7JL4I.js";
-import {
-  normalizeName
-} from "./chunk-NOTA6TEI.js";
-import {
-  UNTAGGED_TAG_COLOR,
-  resolveActiveTagGroup,
-  resolveTagColor,
-  tagAttrKey
-} from "./chunk-L5AFONQU.js";
 import {
   contrastText,
   getEraColors,
   getSeriesColors,
   mix,
   shapeFill
-} from "./chunk-7HWY4QAJ.js";
+} from "./chunk-L24LESXF.js";
 
 // src/gantt/renderer.ts
 import * as d3Scale from "d3-scale";
@@ -131,6 +133,12 @@ function appendTaskIcon(textEl, label, isMilestone, iconColor, textColor) {
   textEl.append("tspan").attr("fill", textColor).text(" " + label);
 }
 function renderGantt(container, resolved, palette, isDark, options, exportDims) {
+  keepSwimlaneToggleFocus(
+    container,
+    () => drawGantt(container, resolved, palette, isDark, options, exportDims)
+  );
+}
+function drawGantt(container, resolved, palette, isDark, options, exportDims) {
   container.innerHTML = "";
   bandClipCounter = 0;
   if (resolved.tasks.length === 0) return;
@@ -1326,15 +1334,17 @@ function renderTagLegend(svg, chartG, tagGroups, activeGroupName, chartLeftMargi
             isSwimlane,
             palette
           );
-          iconEl.append("title").text(`Group by ${groupName}`);
-          iconEl.style("cursor", "pointer").on("click", (event) => {
-            event.stopPropagation();
-            if (onSwimlaneChange) {
-              onSwimlaneChange(
+          wireSwimlaneToggle(
+            iconEl,
+            groupName,
+            isSwimlane,
+            !!onSwimlaneChange,
+            () => {
+              onSwimlaneChange?.(
                 currentSwimlaneGroup?.toLowerCase() === groupName.toLowerCase() ? null : groupName
               );
             }
-          });
+          );
         }
       }
     };

package/dist/{chunk-VJ2KROJ5.js → chunk-7KPHRTND.js}

@@ -1,6 +1,6 @@
 import {
   buildMapProjection
-} from "./chunk-BV6PKJUS.js";
+} from "./chunk-LR6RRDWN.js";
 import {
   TITLE_FONT_SIZE,
   TITLE_Y

package/dist/{chunk-LHL6HDUL.js → chunk-7SX4IY6T.js}

@@ -1,9 +1,12 @@
 import {
   computeLegendLayout
-} from "./chunk-FM3WAVB6.js";
+} from "./chunk-NS7L7YKH.js";
 import {
   FONT_FAMILY
 } from "./chunk-ICLB27PZ.js";
+import {
+  tagAttrKey
+} from "./chunk-L5AFONQU.js";
 import {
   CONTROLS_ICON_PATH,
   LEGEND_DOT_R,
@@ -11,17 +14,15 @@ import {
   LEGEND_ENTRY_FONT_SIZE,
   LEGEND_HEIGHT,
   LEGEND_PILL_FONT_SIZE,
+  LEGEND_PILL_TOGGLE_CLASS,
   LEGEND_TOGGLE_DOT_R,
   LEGEND_TOGGLE_OFF_OPACITY,
   legendChromeColors,
   measureLegendText
-} from "./chunk-RH2PROYG.js";
-import {
-  tagAttrKey
-} from "./chunk-L5AFONQU.js";
+} from "./chunk-I6GGMCTV.js";
 import {
   valueRampStops
-} from "./chunk-7HWY4QAJ.js";
+} from "./chunk-L24LESXF.js";
 
 // src/utils/legend-d3.ts
 function centerText(sel) {
@@ -45,6 +46,7 @@ function renderLegendD3(container, config, state, palette, isDark, callbacks, co
       legendG.attr("data-legend-active", null);
     }
     const { groupBg, pillBorder } = legendChromeColors(palette, isDark);
+    const interactive = config.mode !== "export";
     if (currentLayout.activeCapsule) {
       renderCapsule(
         legendG,
@@ -53,11 +55,12 @@ function renderLegendD3(container, config, state, palette, isDark, callbacks, co
         groupBg,
         pillBorder,
         isDark,
+        interactive,
         callbacks
       );
     }
     for (const pill of currentLayout.pills) {
-      renderPill(legendG, pill, palette, groupBg, callbacks);
+      renderPill(legendG, pill, palette, groupBg, interactive, callbacks);
     }
     if (currentLayout.controlsGroup) {
       renderControlsGroup(
@@ -81,6 +84,7 @@ function renderLegendD3(container, config, state, palette, isDark, callbacks, co
         config.controls
       );
     }
+    if (interactive) restorePillFocus(legendG.node());
   }
   render();
   return {
@@ -99,11 +103,46 @@ function renderLegendD3(container, config, state, palette, isDark, callbacks, co
     }
   };
 }
-function renderCapsule(parent, capsule, palette, groupBg, pillBorder, isDark, callbacks) {
+function wireGroupToggleKeys(target, groupName, isActive) {
+  target.classed(LEGEND_PILL_TOGGLE_CLASS, true).attr("role", "button").attr("tabindex", "0").attr("aria-label", groupName).attr("aria-pressed", isActive ? "true" : "false").on("keydown", (event) => {
+    if (event.key !== "Enter" && event.key !== " ") return;
+    event.preventDefault();
+    event.stopPropagation();
+    const el = event.currentTarget;
+    const view = el.ownerDocument.defaultView;
+    if (!view) return;
+    const host = legendHost(el);
+    pendingPillFocus = host ? { host, label: groupName } : null;
+    el.dispatchEvent(new view.MouseEvent("click", { bubbles: true }));
+  });
+}
+var pendingPillFocus = null;
+function legendHost(el) {
+  let svg = el.ownerSVGElement;
+  while (svg?.ownerSVGElement) svg = svg.ownerSVGElement;
+  return svg?.parentElement ?? null;
+}
+function restorePillFocus(root) {
+  const pending = pendingPillFocus;
+  if (!pending || !root || !pending.host.contains(root)) return;
+  const doc = root.ownerDocument;
+  if (doc.activeElement && doc.activeElement !== doc.body) return;
+  for (const el of root.querySelectorAll(
+    `.${LEGEND_PILL_TOGGLE_CLASS}`
+  )) {
+    if (el.getAttribute("aria-label") === pending.label) {
+      pendingPillFocus = null;
+      el.focus();
+      return;
+    }
+  }
+}
+function renderCapsule(parent, capsule, palette, groupBg, pillBorder, isDark, interactive, callbacks) {
   const g = parent.append("g").attr("transform", `translate(${capsule.x},${capsule.y})`).attr("data-legend-group", tagAttrKey(capsule.groupName)).style("cursor", "pointer");
   g.append("rect").attr("width", capsule.width).attr("height", capsule.height).attr("rx", LEGEND_HEIGHT / 2).attr("fill", groupBg);
   const pill = capsule.pill;
-  g.append("rect").attr("x", pill.x).attr("y", pill.y).attr("width", pill.width).attr("height", pill.height).attr("rx", pill.height / 2).attr("fill", palette.bg);
+  const pillRect = g.append("rect").attr("x", pill.x).attr("y", pill.y).attr("width", pill.width).attr("height", pill.height).attr("rx", pill.height / 2).attr("fill", palette.bg);
+  if (interactive) wireGroupToggleKeys(pillRect, capsule.groupName, true);
   g.append("rect").attr("x", pill.x).attr("y", pill.y).attr("width", pill.width).attr("height", pill.height).attr("rx", pill.height / 2).attr("fill", "none").attr("stroke", pillBorder).attr("stroke-width", 0.75);
   g.append("text").attr("x", pill.x + pill.width / 2).attr("y", LEGEND_HEIGHT / 2).attr("text-anchor", "middle").call(centerText).attr("font-size", LEGEND_PILL_FONT_SIZE).attr("font-weight", "normal").attr("fill", palette.text).attr("pointer-events", "none").attr("font-family", FONT_FAMILY).text(capsule.groupName);
   if (capsule.gradient) {
@@ -140,9 +179,10 @@ function renderCapsule(parent, capsule, palette, groupBg, pillBorder, isDark, ca
     callbacks.onGroupRendered(capsule.groupName, g, true);
   }
 }
-function renderPill(parent, pill, palette, groupBg, callbacks) {
+function renderPill(parent, pill, palette, groupBg, interactive, callbacks) {
   const g = parent.append("g").attr("transform", `translate(${pill.x},${pill.y})`).attr("data-legend-group", tagAttrKey(pill.groupName)).style("cursor", "pointer");
-  g.append("rect").attr("width", pill.width).attr("height", pill.height).attr("rx", pill.height / 2).attr("fill", groupBg);
+  const pillRect = g.append("rect").attr("width", pill.width).attr("height", pill.height).attr("rx", pill.height / 2).attr("fill", groupBg);
+  if (interactive) wireGroupToggleKeys(pillRect, pill.groupName, false);
   g.append("text").attr("x", pill.width / 2).attr("y", pill.height / 2).attr("text-anchor", "middle").call(centerText).attr("font-size", LEGEND_PILL_FONT_SIZE).attr("font-weight", "normal").attr("fill", palette.textMuted).attr("pointer-events", "none").attr("font-family", FONT_FAMILY).text(pill.groupName);
   if (callbacks?.onGroupToggle) {
     const cb = callbacks.onGroupToggle;
@@ -289,8 +329,40 @@ function renderIntegratedLegend(container, opts) {
     opts.width
   );
 }
+var SWIMLANE_TOGGLE_CLASS = "dgmo-swimlane-toggle";
+function wireSwimlaneToggle(iconEl, groupName, isActive, interactive, activate) {
+  const label = `Group by ${groupName}`;
+  iconEl.append("title").text(label);
+  iconEl.style("cursor", "pointer").on("click", (event) => {
+    event.stopPropagation();
+    activate();
+  });
+  if (!interactive) return;
+  iconEl.classed(SWIMLANE_TOGGLE_CLASS, true).attr("role", "button").attr("tabindex", "0").attr("aria-label", label).attr("aria-pressed", isActive ? "true" : "false").on("keydown", (event) => {
+    if (event.key !== "Enter" && event.key !== " ") return;
+    event.preventDefault();
+    event.stopPropagation();
+    activate();
+  });
+}
+function keepSwimlaneToggleFocus(container, render) {
+  const active = container.ownerDocument.activeElement;
+  const label = active && container.contains(active) && active.classList.contains(SWIMLANE_TOGGLE_CLASS) ? active.getAttribute("aria-label") : null;
+  render();
+  if (label === null) return;
+  for (const el of container.querySelectorAll(
+    `.${SWIMLANE_TOGGLE_CLASS}`
+  )) {
+    if (el.getAttribute("aria-label") === label) {
+      el.focus();
+      return;
+    }
+  }
+}
 
 export {
   renderLegendD3,
-  renderIntegratedLegend
+  renderIntegratedLegend,
+  wireSwimlaneToggle,
+  keepSwimlaneToggleFocus
 };