@floegence/floe-webapp-core 0.44.2 → 0.46.0

package/dist/components/workbench/WorkbenchFilterBar.js

@@ -1,73 +1,73 @@
-import { insert as b, createComponent as d, effect as A, setAttribute as S, memo as Z, className as Xe, template as Y, addEventListener as fe, Portal as $e, setStyleProperty as Ye, use as Ae, delegateEvents as Fe } from "solid-js/web";
-import { createSignal as ee, onCleanup as q, createEffect as z, createMemo as W, Show as K, For as te, Index as Be } from "solid-js";
-import { Motion as F } from "../../node_modules/.pnpm/solid-motionone@1.0.4_solid-js@1.9.11/node_modules/solid-motionone/dist/index.js";
-import { easing as B, duration as R } from "../../utils/animations.js";
-import { Plus as Re } from "../icons/index.js";
-import { startHotInteraction as pe } from "../../utils/hotInteraction.js";
-import { startPointerSession as He } from "../ui/pointerSession.js";
-import { clientToCanvasWorld as We } from "../ui/canvasGeometry.js";
-import { isBarItemContextMenuKey as Ke, keyboardBarItemContextMenuRequest as Ne } from "../layout/barItemContextMenu.js";
-import { createWorkbenchWidgetFrame as Ve } from "./workbenchHelpers.js";
-import { getWidgetEntry as Ge } from "./widgets/widgetRegistry.js";
-import { WORKBENCH_EDGE_AUTO_PAN_FRAME_SELECTOR as _e, frameFromElement as Ee, createWorkbenchEdgeAutoPanController as Ue } from "./workbenchEdgeAutoPan.js";
-import { DockLayoutDashboard as qe, DockLayers as ze, DockRegion as je, DockText as Je, DockMessageSquare as Qe } from "../icons/DockIcons.js";
-var Ze = /* @__PURE__ */ Y("<button type=button class=workbench-dock__item>"), et = /* @__PURE__ */ Y('<button type=button class="workbench-dock__item workbench-dock__action">'), tt = /* @__PURE__ */ Y('<div class=workbench-dock__mode-popover role=menu aria-label="Canvas mode">'), nt = /* @__PURE__ */ Y("<span class=workbench-dock__external-placeholder aria-hidden=true>"), ot = /* @__PURE__ */ Y('<div data-floe-canvas-interactive=true><div class=workbench-dock__mode-switcher><button type=button class="workbench-dock__item workbench-dock__mode-trigger"aria-label="Switch canvas mode"aria-haspopup=menu></button></div><span class=workbench-dock__divider aria-hidden=true>'), rt = /* @__PURE__ */ Y("<button type=button class=workbench-dock__mode-option role=menuitemradio><span class=workbench-dock__mode-option-icon></span><span class=workbench-dock__mode-option-copy><span class=workbench-dock__mode-option-label></span><span class=workbench-dock__mode-option-description>"), it = /* @__PURE__ */ Y("<div class=workbench-dock-ghost aria-hidden=true><div class=workbench-dock-ghost__halo></div><div class=workbench-dock-ghost__card><div class=workbench-dock-ghost__icon></div><div class=workbench-dock-ghost__copy><div class=workbench-dock-ghost__title></div><div class=workbench-dock-ghost__hint><span>");
-const me = 5, at = 1e3, lt = ".workbench-dock", ne = [{
+import { insert as m, createComponent as l, effect as W, setAttribute as I, memo as A, className as Ke, template as T, addEventListener as Ce, Portal as We, setStyleProperty as Ne, use as Ve, delegateEvents as Ge } from "solid-js/web";
+import { createSignal as le, onCleanup as ee, createEffect as te, createMemo as R, Show as X, For as ne, Index as Ue } from "solid-js";
+import { Motion as N } from "../../node_modules/.pnpm/solid-motionone@1.0.4_solid-js@1.9.11/node_modules/solid-motionone/dist/index.js";
+import { easing as V, duration as G } from "../../utils/animations.js";
+import { Plus as qe } from "../icons/index.js";
+import { startHotInteraction as ze } from "../../utils/hotInteraction.js";
+import { startPointerSession as je } from "../ui/pointerSession.js";
+import { clientToCanvasWorld as Je } from "../ui/canvasGeometry.js";
+import { isBarItemContextMenuKey as Qe, keyboardBarItemContextMenuRequest as Ze } from "../layout/barItemContextMenu.js";
+import { createWorkbenchWidgetFrame as pe } from "./workbenchHelpers.js";
+import { getWidgetEntry as et } from "./widgets/widgetRegistry.js";
+import { WORKBENCH_EDGE_AUTO_PAN_FRAME_SELECTOR as Le, frameFromElement as Ie, createWorkbenchEdgeAutoPanController as tt } from "./workbenchEdgeAutoPan.js";
+import { DockLayoutDashboard as nt, DockLayers as ot, DockRegion as rt, DockText as it, DockMessageSquare as at } from "../icons/DockIcons.js";
+var ct = /* @__PURE__ */ T("<button type=button class=workbench-dock__item>"), lt = /* @__PURE__ */ T("<span class=workbench-dock__badge aria-hidden=true>"), dt = /* @__PURE__ */ T('<button type=button class="workbench-dock__item workbench-dock__action">'), st = /* @__PURE__ */ T("<span class=workbench-dock__external-placeholder aria-hidden=true>"), ut = /* @__PURE__ */ T('<div class=workbench-dock__mode-popover role=menu aria-label="Canvas mode">'), gt = /* @__PURE__ */ T("<span class=workbench-dock__divider aria-hidden=true>"), vt = /* @__PURE__ */ T('<div data-floe-canvas-interactive=true><div class=workbench-dock__mode-switcher><button type=button class="workbench-dock__item workbench-dock__mode-trigger"aria-label="Switch canvas mode"aria-haspopup=menu></button></div><span class=workbench-dock__divider aria-hidden=true>'), ft = /* @__PURE__ */ T("<button type=button class=workbench-dock__mode-option role=menuitemradio><span class=workbench-dock__mode-option-icon></span><span class=workbench-dock__mode-option-copy><span class=workbench-dock__mode-option-label></span><span class=workbench-dock__mode-option-description>"), kt = /* @__PURE__ */ T("<div class=workbench-dock-ghost aria-hidden=true><div class=workbench-dock-ghost__halo></div><div class=workbench-dock-ghost__card><div class=workbench-dock-ghost__icon></div><div class=workbench-dock-ghost__copy><div class=workbench-dock-ghost__title></div><div class=workbench-dock-ghost__hint><span>");
+const Pe = 5, ht = 1e3, mt = ".workbench-dock", de = [{
   mode: "work",
   label: "Work Mode",
   description: "Operate windows and sticky notes",
-  icon: qe
+  icon: nt
 }, {
   mode: "background",
   label: "Composition Mode",
   description: "Arrange regions and canvas text",
-  icon: ze
-}], ct = [{
+  icon: ot
+}], bt = [{
   tool: "sticky-note",
   label: "Sticky",
-  icon: Qe
-}], st = [{
+  icon: at
+}], wt = [{
   tool: "background-region",
   label: "Region",
-  icon: je
+  icon: rt
 }, {
   tool: "text",
   label: "Text",
-  icon: Je
+  icon: it
 }];
-function dt(e) {
-  const i = e?.closest(".workbench-surface")?.querySelector(_e);
-  return i instanceof HTMLElement ? Ee(i) : null;
+function _t(e) {
+  const i = e?.closest(".workbench-surface")?.querySelector(Le);
+  return i instanceof HTMLElement ? Ie(i) : null;
 }
-function oe(e, u, i) {
-  return e >= i.left && e <= i.right && u >= i.top && u <= i.bottom;
+function ue(e, v, i) {
+  return e >= i.left && e <= i.right && v >= i.top && v <= i.bottom;
 }
-function ut(e, u, i) {
-  return i ? oe(e, u, i) : !1;
+function Dt(e, v, i) {
+  return i ? ue(e, v, i) : !1;
 }
-function he(e, u, i) {
-  return Math.min(i, Math.max(u, e));
+function xe(e, v, i) {
+  return Math.min(i, Math.max(v, e));
 }
-function gt(e, u, i, l, c) {
+function Et(e, v, i, c, d) {
   if (!e) return !1;
-  if (oe(u, i, e) || oe(l, c, e))
+  if (ue(v, i, e) || ue(c, d, e))
     return !0;
-  const s = l - u, r = c - i;
-  let a = 0, D = 1;
-  const k = (_, C) => {
-    if (_ === 0) return C >= 0;
-    const f = C / _;
-    return _ < 0 ? f > D ? !1 : (f > a && (a = f), !0) : f < a ? !1 : (f < D && (D = f), !0);
+  const s = c - v, x = d - i;
+  let w = 0, D = 1;
+  const o = (a, E) => {
+    if (a === 0) return E >= 0;
+    const f = E / a;
+    return a < 0 ? f > D ? !1 : (f > w && (w = f), !0) : f < w ? !1 : (f < D && (D = f), !0);
   };
-  return k(-s, u - e.left) && k(s, e.right - u) && k(-r, i - e.top) && k(r, e.bottom - i);
+  return o(-s, v - e.left) && o(s, e.right - v) && o(-x, i - e.top) && o(x, e.bottom - i);
 }
-function we(e, u, i) {
+function Me(e, v, i) {
   if (!i || typeof document.elementFromPoint != "function") return !1;
-  const l = document.elementFromPoint(e, u);
-  return l instanceof Element && l.closest(lt) === i;
+  const c = document.elementFromPoint(e, v);
+  return c instanceof Element && c.closest(mt) === i;
 }
-function be(e) {
-  const u = () => e.hoverOffset === -1 ? {
+function se(e) {
+  const v = () => e.hoverOffset === -1 ? {
     scale: 1.26,
     y: -6,
     x: 0
@@ -83,40 +83,56 @@ function be(e) {
     scale: 1,
     y: 0,
     x: 0
-  }, i = () => e.hoverOffset === -1, l = (r) => {
-    r.button === 0 && e.onDragBegin(r, e.kind, e.id, e.label, e.icon, r.currentTarget, e.canvasPlacement, null);
-  }, c = (r) => {
-    e.onContextMenu && (r.preventDefault(), r.stopPropagation(), e.onContextMenu({
-      trigger: r.currentTarget,
-      clientX: r.clientX,
-      clientY: r.clientY,
+  }, i = () => e.hoverOffset === -1, c = (o) => {
+    o.button === 0 && e.onDragBegin(o, e.kind, e.id, e.label, e.icon, o.currentTarget, e.canvasPlacement, null);
+  }, d = (o) => {
+    e.onContextMenu && (o.preventDefault(), o.stopPropagation(), e.onContextMenu({
+      trigger: o.currentTarget,
+      clientX: o.clientX,
+      clientY: o.clientY,
       source: "pointer"
     }));
-  }, s = (r) => {
-    !e.onContextMenu || !Ke(r) || (r.preventDefault(), r.stopPropagation(), e.onContextMenu(Ne(r.currentTarget)));
+  }, s = (o) => {
+    !e.onContextMenu || !Qe(o) || (o.preventDefault(), o.stopPropagation(), e.onContextMenu(Ze(o.currentTarget)));
+  }, x = (o) => {
+    o.detail === 0 && e.onKeyboardActivate(o.currentTarget);
+  }, w = () => {
+    const o = e.presentation;
+    return o ? o.count === 0 ? `${e.label} +` : o.active && o.currentIndex !== null ? `${e.label} ${o.currentIndex + 1}/${o.count}` : o.count > 1 ? `${e.label} ${o.count}` : e.label : e.label;
+  }, D = () => {
+    const o = e.presentation?.count;
+    return o === 0 ? "+" : o !== void 0 && o > 1 ? String(o) : null;
   };
   return (() => {
-    var r = Ze();
-    return r.$$keydown = s, r.$$contextmenu = c, r.$$pointerdown = l, r.addEventListener("pointerleave", () => e.onLeave()), r.addEventListener("pointerenter", () => e.onEnter()), b(r, d(F.span, {
+    var o = ct();
+    return o.$$keydown = s, o.$$contextmenu = d, o.$$click = x, o.$$pointerdown = c, o.addEventListener("pointerleave", () => e.onLeave()), o.addEventListener("pointerenter", () => e.onEnter()), m(o, l(N.span, {
       class: "workbench-dock__tile",
       get animate() {
-        return u();
+        return v();
       },
       get transition() {
         return {
-          duration: R.fast,
-          easing: B.easeOut
+          duration: G.fast,
+          easing: V.easeOut
         };
       },
       get children() {
-        return (() => {
+        return [A(() => (() => {
           const a = e.icon;
-          return d(a, {
+          return l(a, {
             class: "workbench-dock__icon"
           });
-        })();
+        })()), l(X, {
+          get when() {
+            return D();
+          },
+          children: (a) => (() => {
+            var E = lt();
+            return m(E, a), E;
+          })()
+        })];
       }
-    }), null), b(r, d(F.span, {
+    }), null), m(o, l(N.span, {
       class: "workbench-dock__tooltip",
       get animate() {
         return {
@@ -126,16 +142,16 @@ function be(e) {
       },
       get transition() {
         return {
-          duration: R.fast,
-          easing: B.easeOut
+          duration: G.fast,
+          easing: V.easeOut
         };
       },
       get children() {
-        return e.label;
+        return A(() => e.activationMode === "focus-cycle")() ? w() : e.label;
       }
-    }), null), A((a) => {
-      var D = e.kind === "host" ? e.id : void 0, k = !!e.active, _ = !!(e.filterable && !e.visible), C = !!i(), f = !!e.isDragging, I = e.filterable ? `${e.label} — click to solo, drag to canvas to create` : `${e.label} — drag to canvas to create`, X = e.active, N = e.onContextMenu ? "menu" : void 0;
-      return D !== a.e && S(r, "data-workbench-dock-item", a.e = D), k !== a.t && r.classList.toggle("is-active", a.t = k), _ !== a.a && r.classList.toggle("is-filter-muted", a.a = _), C !== a.o && r.classList.toggle("is-hovered", a.o = C), f !== a.i && r.classList.toggle("is-source-dragging", a.i = f), I !== a.n && S(r, "aria-label", a.n = I), X !== a.s && S(r, "aria-pressed", a.s = X), N !== a.h && S(r, "aria-haspopup", a.h = N), a;
+    }), null), W((a) => {
+      var E = e.kind === "host" ? e.id : void 0, f = e.kind === "widget" || e.kind === "tool" ? e.id : void 0, M = !!e.active, Y = !!(e.filterable && !e.visible), j = !!i(), F = !!e.isDragging, J = e.activationMode === "focus-cycle" && e.presentation ? w() : e.filterable ? `${e.label} — click to solo, drag to canvas to create` : `${e.label} — drag to canvas to create`, B = e.activationMode === "focus-cycle" ? e.presentation?.active : e.active, H = e.onContextMenu ? "menu" : void 0;
+      return E !== a.e && I(o, "data-workbench-dock-item", a.e = E), f !== a.t && I(o, "data-workbench-dock-component", a.t = f), M !== a.a && o.classList.toggle("is-active", a.a = M), Y !== a.o && o.classList.toggle("is-filter-muted", a.o = Y), j !== a.i && o.classList.toggle("is-hovered", a.i = j), F !== a.n && o.classList.toggle("is-source-dragging", a.n = F), J !== a.s && I(o, "aria-label", a.s = J), B !== a.h && I(o, "aria-pressed", a.h = B), H !== a.r && I(o, "aria-haspopup", a.r = H), a;
     }, {
       e: void 0,
       t: void 0,
@@ -144,130 +160,144 @@ function be(e) {
       i: void 0,
       n: void 0,
       s: void 0,
-      h: void 0
-    }), r;
+      h: void 0,
+      r: void 0
+    }), o;
   })();
 }
-function vt(e) {
-  const u = () => e.hoverOffset === -1, i = () => ({
+function Ct(e) {
+  const v = () => e.hoverOffset === -1, i = () => ({
     scale: 1,
     y: 0,
     x: 0
-  }), l = e.action.icon;
+  }), c = e.action.icon;
   return (() => {
-    var c = et();
-    return c.$$click = (s) => e.action.onActivate(s.currentTarget), c.addEventListener("dragstart", (s) => s.preventDefault()), fe(c, "pointerleave", e.onLeave), fe(c, "pointerenter", e.onEnter), S(c, "draggable", !1), b(c, d(F.span, {
+    var d = dt();
+    return d.$$click = (s) => e.onActivate(s.currentTarget), d.addEventListener("dragstart", (s) => s.preventDefault()), Ce(d, "pointerleave", e.onLeave), Ce(d, "pointerenter", e.onEnter), I(d, "draggable", !1), m(d, l(N.span, {
       class: "workbench-dock__tile",
       get animate() {
         return i();
       },
       get transition() {
         return {
-          duration: R.fast,
-          easing: B.easeOut
+          duration: G.fast,
+          easing: V.easeOut
         };
       },
       get children() {
-        return d(l, {
+        return l(c, {
           class: "workbench-dock__icon"
         });
       }
-    }), null), b(c, d(F.span, {
+    }), null), m(d, l(N.span, {
       class: "workbench-dock__tooltip",
       get animate() {
         return {
-          opacity: u() ? 1 : 0,
-          y: u() ? -6 : 0
+          opacity: v() ? 1 : 0,
+          y: v() ? -6 : 0
         };
       },
       get transition() {
         return {
-          duration: R.fast,
-          easing: B.easeOut
+          duration: G.fast,
+          easing: V.easeOut
         };
       },
       get children() {
         return e.action.label;
       }
-    }), null), A((s) => {
-      var r = e.action.id, a = !!e.action.active, D = !!u(), k = e.action.label, _ = e.action.active;
-      return r !== s.e && S(c, "data-workbench-dock-action", s.e = r), a !== s.t && c.classList.toggle("is-active", s.t = a), D !== s.a && c.classList.toggle("is-hovered", s.a = D), k !== s.o && S(c, "aria-label", s.o = k), _ !== s.i && S(c, "aria-pressed", s.i = _), s;
+    }), null), W((s) => {
+      var x = e.action.id, w = !!e.action.active, D = !!v(), o = e.action.label, a = e.action.active;
+      return x !== s.e && I(d, "data-workbench-dock-action", s.e = x), w !== s.t && d.classList.toggle("is-active", s.t = w), D !== s.a && d.classList.toggle("is-hovered", s.a = D), o !== s.o && I(d, "aria-label", s.o = o), a !== s.i && I(d, "aria-pressed", s.i = a), s;
     }, {
       e: void 0,
       t: void 0,
       a: void 0,
       o: void 0,
       i: void 0
-    }), c;
+    }), d;
   })();
 }
-function St(e) {
-  const [u, i] = ee(null), [l, c] = ee(null), [s, r] = ee(!1);
-  let a, D, k, _, C = null;
-  q(() => {
-    _?.stop(), D?.stop({
+function Bt(e) {
+  const [v, i] = le(null), [c, d] = le(null), [s, x] = le(!1);
+  let w, D, o, a, E = null;
+  const f = () => e.activationMode === "focus-cycle" ? "focus-cycle" : "solo-filter";
+  ee(() => {
+    a?.stop(), D?.stop({
       reason: "manual_stop",
       commit: !1
-    }), D = void 0, k?.clear(), k = void 0, l()?.stopInteraction(), e.onDragPreviewChange?.(null), e.registerExternalDockDragController?.(null);
-  }), z(() => {
-    e.onDragPreviewChange?.(l()?.preview ?? null);
-  }), z(() => {
+    }), D = void 0, o?.clear(), o = void 0, c()?.stopInteraction(), e.onDragPreviewChange?.(null), e.registerExternalDockDragController?.(null);
+  }), te(() => {
+    e.onDragPreviewChange?.(c()?.preview ?? null);
+  }), te(() => {
     const t = (n) => {
-      n.key !== "Escape" || !l() || (n.preventDefault(), D?.stop({
+      n.key !== "Escape" || !c() || (n.preventDefault(), D?.stop({
         reason: "manual_stop",
         commit: !1
       }));
     };
-    window.addEventListener("keydown", t, !0), q(() => window.removeEventListener("keydown", t, !0));
-  }), z(() => {
+    window.addEventListener("keydown", t, !0), ee(() => window.removeEventListener("keydown", t, !0));
+  }), te(() => {
     if (!s() || typeof window > "u") return;
-    const t = (m) => {
-      a && m.target instanceof Node && a.contains(m.target) || r(!1);
-    }, n = (m) => {
-      m.key === "Escape" && r(!1);
+    const t = (k) => {
+      w && k.target instanceof Node && w.contains(k.target) || x(!1);
+    }, n = (k) => {
+      k.key === "Escape" && x(!1);
     };
-    window.addEventListener("pointerdown", t, !0), window.addEventListener("keydown", n, !0), q(() => {
+    window.addEventListener("pointerdown", t, !0), window.addEventListener("keydown", n, !0), ee(() => {
       window.removeEventListener("pointerdown", t, !0), window.removeEventListener("keydown", n, !0);
     });
   });
-  const f = (t) => {
-    const n = u();
-    return n === null || n <= V().length ? 0 : n === t ? -1 : n === t + 1 ? -2 : n === t - 1 ? 1 : 0;
-  }, I = () => {
-    _?.stop(), _ = void 0, C = null;
-  }, X = () => {
-    !e.viewport || !e.onViewportCommit || (C = e.viewport, _?.stop(), _ = Ue({
+  const M = (t) => {
+    const n = v();
+    return n === null || n <= U().length ? 0 : n === t ? -1 : n === t + 1 ? -2 : n === t - 1 ? 1 : 0;
+  }, Y = () => {
+    a?.stop(), a = void 0, E = null;
+  }, j = () => {
+    !e.viewport || !e.onViewportCommit || (E = e.viewport, a?.stop(), a = tt({
       readFrame: () => {
-        const n = a?.closest(".workbench-surface")?.querySelector(_e);
-        return n instanceof HTMLElement ? Ee(n) : null;
+        const n = w?.closest(".workbench-surface")?.querySelector(Le);
+        return n instanceof HTMLElement ? Ie(n) : null;
       },
-      readViewport: () => C ?? e.viewport ?? null,
+      readViewport: () => E ?? e.viewport ?? null,
       commitViewport: (t) => {
-        C = t, e.onViewportCommit?.(t);
+        E = t, e.onViewportCommit?.(t);
       },
       onPanStart: () => e.onViewportInteractionStart?.("pan"),
       shouldPan: () => {
-        const t = l();
-        return !!(t?.moved && t.hasEnteredCanvas && !we(t.clientX, t.clientY, a));
+        const t = c();
+        return !!(t?.moved && t.hasEnteredCanvas && !Me(t.clientX, t.clientY, w));
       }
     }));
-  }, N = (t) => {
-    const n = l();
-    if (!n) return;
-    const m = !n.moved, P = C ?? e.viewport;
-    if (n.stopInteraction(), I(), c(null), D = void 0, n.kind === "external" && n.moved && k?.expire(), m) {
-      if (n.kind === "external" || !(n.trigger instanceof HTMLButtonElement)) return;
-      if (n.kind === "host") {
-        e.dockItems?.find((o) => o.id === n.id)?.onActivate?.(n.trigger);
+  }, F = (t, n, k, C) => {
+    if (e.onDockActivation?.({
+      kind: t,
+      id: String(n)
+    }), t === "external") return;
+    if (t === "host") {
+      e.dockItems?.find((r) => r.id === n)?.onActivate?.(C);
+      return;
+    }
+    const L = {
+      kind: t,
+      id: n,
+      label: k,
+      trigger: C
+    };
+    if (!e.onItemClick?.(L)) {
+      if (f() === "focus-cycle") {
+        e.onFocusCycleItem?.(L);
         return;
       }
-      if (e.onItemClick?.({
-        kind: n.kind,
-        id: n.id,
-        label: n.label,
-        trigger: n.trigger
-      })) return;
-      T() !== "background" && e.onSoloFilter(String(n.id), ce());
+      y() !== "background" && e.onSoloFilter(String(n), ke());
+    }
+  }, J = (t) => {
+    const n = c();
+    if (!n) return;
+    const k = !n.moved, C = E ?? e.viewport;
+    if (n.stopInteraction(), Y(), d(null), D = void 0, n.kind === "external" && n.moved && o?.expire(), k) {
+      if (n.kind === "external" || !(n.trigger instanceof HTMLButtonElement)) return;
+      F(n.kind, n.id, n.label, n.trigger);
       return;
     }
     if (t && n.overDock && n.dockDrop) {
@@ -275,29 +305,29 @@ function St(e) {
       return;
     }
     if (t && n.overCanvas && n.canvasPlacement) {
-      const x = n.canvasFrame && P ? We(n.canvasFrame, P, {
+      const L = n.canvasFrame && C ? Je(n.canvasFrame, C, {
         clientX: n.clientX,
         clientY: n.clientY
-      }) : null, o = n.canvasFrame ? {
+      }) : null, r = n.canvasFrame ? {
         dropAllowed: n.overCanvas,
         canvasFrame: n.canvasFrame,
-        ...x ? {
-          worldPoint: x
+        ...L ? {
+          worldPoint: L
         } : {}
       } : void 0;
-      n.canvasPlacement.onDrop(n.clientX, n.clientY, o);
+      n.canvasPlacement.onDrop(n.clientX, n.clientY, r);
     }
-  }, j = (t, n, m, P, x, o, E, w) => {
+  }, B = (t, n, k, C, L, r, _, b, u = "before-components") => {
     t.preventDefault(), D?.stop({
       reason: "manual_stop",
       commit: !1
-    }), X();
-    const v = dt(a);
-    c({
+    }), j();
+    const P = _t(w);
+    d({
       kind: n,
-      id: m,
-      label: P,
-      icon: x,
+      id: k,
+      label: C,
+      icon: L,
       pointerId: t.pointerId,
       startClientX: t.clientX,
       startClientY: t.clientY,
@@ -306,106 +336,107 @@ function St(e) {
       moved: !1,
       overCanvas: !1,
       hasEnteredCanvas: !1,
-      canvasFrame: v,
+      canvasFrame: P,
       preview: null,
-      canvasPlacement: E,
-      dockDrop: w,
-      stopInteraction: pe({
+      canvasPlacement: _,
+      dockDrop: b,
+      dockPlacement: u,
+      stopInteraction: ze({
         kind: "drag",
         cursor: "grabbing"
       }),
-      trigger: o,
+      trigger: r,
       overDock: !1
     });
-    const L = (g) => {
-      let y = !1;
-      c((h) => {
+    const O = (g) => {
+      let $ = !1;
+      d((h) => {
         if (!h || h.pointerId !== g.pointerId) return h;
-        const $ = g.clientX - h.startClientX, G = g.clientY - h.startClientY, O = h.moved || Math.abs($) > me || Math.abs(G) > me;
-        if (h.kind === "external" && O && !h.moved) {
-          let p;
-          const H = () => {
-            p !== void 0 && window.clearTimeout(p), h.trigger.removeEventListener("click", ge, !0), window.removeEventListener("pointerdown", ve, !0), k?.clear === H && (k = void 0);
-          }, ge = (ke) => {
-            ke.preventDefault(), ke.stopImmediatePropagation(), H();
-          }, ve = () => H(), Oe = () => {
-            p !== void 0 && window.clearTimeout(p), p = window.setTimeout(H, at);
+        const Q = g.clientX - h.startClientX, Z = g.clientY - h.startClientY, K = h.moved || Math.abs(Q) > Pe || Math.abs(Z) > Pe;
+        if (h.kind === "external" && K && !h.moved) {
+          let q;
+          const z = () => {
+            q !== void 0 && window.clearTimeout(q), h.trigger.removeEventListener("click", _e, !0), window.removeEventListener("pointerdown", De, !0), o?.clear === z && (o = void 0);
+          }, _e = (Ee) => {
+            Ee.preventDefault(), Ee.stopImmediatePropagation(), z();
+          }, De = () => z(), He = () => {
+            q !== void 0 && window.clearTimeout(q), q = window.setTimeout(z, ht);
           };
-          h.trigger.addEventListener("click", ge, !0), window.addEventListener("pointerdown", ve, !0), k = {
-            clear: H,
-            expire: Oe
+          h.trigger.addEventListener("click", _e, !0), window.addEventListener("pointerdown", De, !0), o = {
+            clear: z,
+            expire: He
           };
         }
-        const U = we(g.clientX, g.clientY, a), M = h.canvasFrame, se = O && ut(g.clientX, g.clientY, M), de = se && !U, Ie = O && !U && gt(M, h.clientX, h.clientY, g.clientX, g.clientY), ue = h.hasEnteredCanvas || se || Ie;
-        y = O && ue && !U;
-        const Te = M ? he(g.clientX, M.left, M.right) : g.clientX, ye = M ? he(g.clientY, M.top, M.bottom) : g.clientY;
+        const p = Me(g.clientX, g.clientY, w), S = h.canvasFrame, me = K && Dt(g.clientX, g.clientY, S), be = me && !p, Fe = K && !p && Et(S, h.clientX, h.clientY, g.clientX, g.clientY), we = h.hasEnteredCanvas || me || Fe;
+        $ = K && we && !p;
+        const Be = S ? xe(g.clientX, S.left, S.right) : g.clientX, Re = S ? xe(g.clientY, S.top, S.bottom) : g.clientY;
         return {
           ...h,
           clientX: g.clientX,
           clientY: g.clientY,
-          moved: O,
-          overDock: U,
-          overCanvas: de,
-          hasEnteredCanvas: ue,
-          preview: O && M && h.canvasPlacement?.preview ? {
+          moved: K,
+          overDock: p,
+          overCanvas: be,
+          hasEnteredCanvas: we,
+          preview: K && S && h.canvasPlacement?.preview ? {
             kind: h.canvasPlacement.preview.kind,
             id: h.canvasPlacement.preview.id,
             label: h.label,
-            clientX: Te,
-            clientY: ye,
-            dropAllowed: de,
-            canvasFrame: M
+            clientX: Be,
+            clientY: Re,
+            dropAllowed: be,
+            canvasFrame: S
           } : null
         };
-      }), y && _?.updatePointer(g.clientX, g.clientY);
+      }), $ && a?.updatePointer(g.clientX, g.clientY);
     };
-    D = He({
+    D = je({
       pointerEvent: t,
       captureEl: t.currentTarget,
-      onMove: L,
+      onMove: O,
       onEnd: ({
         commit: g,
-        snapshot: y
+        snapshot: $
       }) => {
-        L({
-          pointerId: y.pointerId,
-          clientX: y.latestClientX,
-          clientY: y.latestClientY
-        }), N(g);
+        O({
+          pointerId: $.pointerId,
+          clientX: $.latestClientX,
+          clientY: $.latestClientY
+        }), J(g);
       }
     });
-  }, re = (t) => t ? {
+  }, H = (t) => t ? {
     preview: {
       kind: "widget",
       id: t.widgetType
     },
-    onDrop: (n, m, P) => {
-      if (!P?.worldPoint) return;
-      const x = Ge(t.widgetType, e.widgetDefinitions);
+    onDrop: (n, k, C) => {
+      if (!C?.worldPoint) return;
+      const L = et(t.widgetType, e.widgetDefinitions);
       t.onDrop({
         widgetType: t.widgetType,
-        centerWorld: P.worldPoint,
-        frame: Ve(x, {
+        centerWorld: C.worldPoint,
+        frame: pe(L, {
           anchor: "center",
-          worldX: P.worldPoint.worldX,
-          worldY: P.worldPoint.worldY
+          worldX: C.worldPoint.worldX,
+          worldY: C.worldPoint.worldY
         })
       });
     }
-  } : null, De = (t, n) => {
-    t.button !== 0 || !(t.currentTarget instanceof HTMLElement) || (k?.clear(), k = void 0, j(t, "external", n.id, n.label, n.icon, t.currentTarget, re(n.canvasPlacement), n.onDropToDock ?? null));
+  } : null, ye = (t, n) => {
+    t.button !== 0 || !(t.currentTarget instanceof HTMLElement) || (o?.clear(), o = void 0, B(t, "external", n.id, n.label, n.icon, t.currentTarget, H(n.canvasPlacement), n.onDropToDock ?? null, n.dockPlacement ?? "before-components"));
   };
-  z(() => {
+  te(() => {
     e.registerExternalDockDragController?.({
-      begin: De
-    }), q(() => e.registerExternalDockDragController?.(null));
+      begin: ye
+    }), ee(() => e.registerExternalDockDragController?.(null));
   });
-  const Ce = () => l()?.kind === "widget" ? l().id : null, Pe = () => l()?.kind === "tool" ? l().id : null, Le = () => l()?.kind === "external" ? l()?.icon : void 0, T = () => e.mode === "background" || e.mode === "annotation" ? "background" : "work", ie = W(() => ne.find((t) => t.mode === T()) ?? ne[0]), ae = W(() => T() === "background" ? st.map((t) => ({
+  const Se = () => c()?.kind === "widget" ? c().id : null, Te = () => c()?.kind === "tool" ? c().id : null, Oe = () => c()?.kind === "external" ? c()?.icon : void 0, y = () => e.mode === "background" || e.mode === "annotation" ? "background" : "work", ge = R(() => de.find((t) => t.mode === y()) ?? de[0]), oe = R(() => y() === "background" ? wt.map((t) => ({
     id: t.tool,
     kind: "tool",
     label: t.label,
     icon: t.icon
-  })) : [...ct.map((t) => ({
+  })) : [...bt.map((t) => ({
     id: t.tool,
     kind: "tool",
     label: t.label,
@@ -415,262 +446,352 @@ function St(e) {
     kind: "widget",
     label: t.label,
     icon: t.icon
-  }))]), le = W(() => T() === "background" ? [] : [...e.dockItems ?? []]), V = W(() => T() === "background" ? [] : [...e.dockActions ?? []]), ce = W(() => ae().map((t) => String(t.id))), J = () => T() !== "background", xe = (t) => !J() || e.filters[t] !== !1, Me = (t) => {
-    if (!J())
+  }))]), ve = R(() => y() === "background" ? [] : [...e.dockItems ?? []]), re = R(() => ve().filter((t) => t.dockPlacement !== "after-components")), fe = R(() => ve().filter((t) => t.dockPlacement === "after-components")), U = R(() => y() === "background" ? [] : [...e.dockActions ?? []]), ke = R(() => oe().map((t) => String(t.id))), ie = () => y() !== "background", $e = (t) => !ie() || e.filters[t] !== !1, Ae = (t) => {
+    if (!ie())
       return !1;
-    const n = ce();
-    return n.length > 1 && n.every((m) => e.filters[m] !== !1 == (m === t));
-  }, Q = () => u() === 0, Se = () => ({
+    const n = ke();
+    return n.length > 1 && n.every((k) => e.filters[k] !== !1 == (k === t));
+  }, Xe = (t, n) => f() === "focus-cycle" ? e.resolveItemPresentation?.({
+    kind: t,
+    id: n
+  }) : void 0, ae = () => v() === 0, Ye = () => ({
     scale: 1,
     y: 0,
     x: 0
-  });
+  }), ce = (t) => {
+    const n = c();
+    return !!(n?.kind === "external" && n.moved && n.dockPlacement === t);
+  }, he = () => (() => {
+    var t = st();
+    return m(t, l(X, {
+      get when() {
+        return Oe();
+      },
+      children: (n) => {
+        const k = n();
+        return l(k, {
+          class: "workbench-dock__icon"
+        });
+      }
+    })), W(() => t.classList.toggle("is-drop-allowed", !!c()?.overDock)), t;
+  })();
   return [(() => {
-    var t = ot(), n = t.firstChild, m = n.firstChild, P = n.nextSibling;
+    var t = vt(), n = t.firstChild, k = n.firstChild, C = n.nextSibling;
     t.addEventListener("pointerleave", () => i(null));
-    var x = a;
-    return typeof x == "function" ? Ae(x, t) : a = t, m.$$click = () => r((o) => !o), m.addEventListener("pointerleave", () => i((o) => o === 0 ? null : o)), m.addEventListener("pointerenter", () => i(0)), b(m, d(F.span, {
+    var L = w;
+    return typeof L == "function" ? Ve(L, t) : w = t, k.$$click = () => {
+      e.onDockActivation?.({
+        kind: "mode",
+        id: y()
+      }), x((r) => !r);
+    }, k.addEventListener("pointerleave", () => i((r) => r === 0 ? null : r)), k.addEventListener("pointerenter", () => i(0)), m(k, l(N.span, {
       class: "workbench-dock__tile",
       get animate() {
-        return Se();
+        return Ye();
       },
       get transition() {
         return {
-          duration: R.fast,
-          easing: B.easeOut
+          duration: G.fast,
+          easing: V.easeOut
         };
       },
       get children() {
         return (() => {
-          const o = ie().icon;
-          return d(o, {
+          const r = ge().icon;
+          return l(r, {
             class: "workbench-dock__icon"
           });
         })();
       }
-    }), null), b(m, d(F.span, {
+    }), null), m(k, l(N.span, {
       class: "workbench-dock__tooltip",
       get animate() {
         return {
-          opacity: Q() && !s() ? 1 : 0,
-          y: Q() && !s() ? -6 : 0
+          opacity: ae() && !s() ? 1 : 0,
+          y: ae() && !s() ? -6 : 0
         };
       },
       get transition() {
         return {
-          duration: R.fast,
-          easing: B.easeOut
+          duration: G.fast,
+          easing: V.easeOut
         };
       },
       get children() {
-        return ie().label;
+        return ge().label;
       }
-    }), null), b(n, d(K, {
+    }), null), m(n, l(X, {
       get when() {
         return s();
       },
       get children() {
-        var o = tt();
-        return b(o, d(te, {
-          each: ne,
-          children: (E) => {
-            const w = E.icon;
+        var r = ut();
+        return m(r, l(ne, {
+          each: de,
+          children: (_) => {
+            const b = _.icon;
             return (() => {
-              var v = rt(), L = v.firstChild, g = L.nextSibling, y = g.firstChild, h = y.nextSibling;
-              return v.$$click = () => {
-                e.onSelectMode?.(E.mode), r(!1);
-              }, b(L, d(w, {
+              var u = ft(), P = u.firstChild, O = P.nextSibling, g = O.firstChild, $ = g.nextSibling;
+              return u.$$click = () => {
+                e.onDockActivation?.({
+                  kind: "mode",
+                  id: _.mode
+                }), e.onSelectMode?.(_.mode), x(!1);
+              }, m(P, l(b, {
                 class: "workbench-dock__mode-icon"
-              })), b(y, () => E.label), b(h, () => E.description), A(($) => {
-                var G = T() === E.mode, O = T() === E.mode;
-                return G !== $.e && v.classList.toggle("is-active", $.e = G), O !== $.t && S(v, "aria-checked", $.t = O), $;
+              })), m(g, () => _.label), m($, () => _.description), W((h) => {
+                var Q = y() === _.mode, Z = y() === _.mode;
+                return Q !== h.e && u.classList.toggle("is-active", h.e = Q), Z !== h.t && I(u, "aria-checked", h.t = Z), h;
               }, {
                 e: void 0,
                 t: void 0
-              }), v;
+              }), u;
             })();
           }
-        })), o;
+        })), r;
       }
-    }), null), b(t, d(Be, {
+    }), null), m(t, l(Ue, {
       get each() {
-        return V();
+        return U();
       },
-      children: (o, E) => {
-        const w = () => E + 1;
-        return d(vt, {
+      children: (r, _) => {
+        const b = () => _ + 1;
+        return l(Ct, {
           get action() {
-            return o();
+            return r();
           },
           get hoverOffset() {
-            return f(w());
+            return M(b());
           },
-          onEnter: () => i(w()),
-          onLeave: () => i((v) => v === w() ? null : v)
+          onEnter: () => i(b()),
+          onLeave: () => i((u) => u === b() ? null : u),
+          onActivate: (u) => {
+            e.onDockActivation?.({
+              kind: "action",
+              id: r().id
+            }), r().onActivate(u);
+          }
         });
       }
-    }), P), b(t, d(K, {
+    }), C), m(t, l(X, {
       get when() {
-        return !!(l()?.kind === "external" && l()?.moved);
+        return ce("before-components");
       },
       get children() {
-        var o = nt();
-        return b(o, d(K, {
-          get when() {
-            return Le();
-          },
-          children: (E) => {
-            const w = E();
-            return d(w, {
-              class: "workbench-dock__icon"
-            });
-          }
-        })), A(() => o.classList.toggle("is-drop-allowed", !!l()?.overDock)), o;
+        return l(he, {});
       }
-    }), P), b(t, d(te, {
+    }), C), m(t, l(ne, {
       get each() {
-        return le();
+        return re();
       },
-      children: (o, E) => {
-        const w = () => E() + V().length + 1;
-        return d(be, {
+      children: (r, _) => {
+        const b = () => _() + U().length + 1;
+        return l(se, {
           get id() {
-            return o.id;
+            return r.id;
           },
           kind: "host",
           get label() {
-            return o.label;
+            return r.label;
           },
           get icon() {
-            return o.icon;
+            return r.icon;
           },
           get active() {
-            return !!o.active;
+            return !!r.active;
           },
           visible: !0,
           filterable: !1,
+          get activationMode() {
+            return f();
+          },
           get hoverOffset() {
-            return f(w());
+            return M(b());
           },
           get isDragging() {
-            return Z(() => l()?.kind === "host")() && l()?.id === o.id;
+            return A(() => c()?.kind === "host")() && c()?.id === r.id;
           },
           get canvasPlacement() {
-            return re(o.canvasPlacement);
+            return H(r.canvasPlacement);
           },
           get onContextMenu() {
-            return o.onContextMenu;
+            return r.onContextMenu;
           },
-          onEnter: () => i(w()),
-          onLeave: () => i((v) => v === w() ? null : v),
-          onDragBegin: j
+          onKeyboardActivate: (u) => F("host", r.id, r.label, u),
+          onEnter: () => i(b()),
+          onLeave: () => i((u) => u === b() ? null : u),
+          onDragBegin: B
         });
       }
-    }), P), b(t, d(te, {
+    }), C), m(t, l(ne, {
       get each() {
-        return ae();
+        return oe();
       },
-      children: (o, E) => {
-        const w = () => E() + V().length + le().length + 1;
-        return d(be, {
+      children: (r, _) => {
+        const b = () => _() + U().length + re().length + 1, u = () => Xe(r.kind, r.id);
+        return l(se, {
           get id() {
-            return String(o.id);
+            return String(r.id);
           },
           get kind() {
-            return o.kind;
+            return r.kind;
           },
           get label() {
-            return o.label;
+            return r.label;
           },
           get icon() {
-            return o.icon;
+            return r.icon;
           },
           get active() {
-            return Me(String(o.id));
+            return u()?.active ?? Ae(String(r.id));
           },
           get visible() {
-            return xe(String(o.id));
+            return A(() => f() === "focus-cycle")() ? !0 : $e(String(r.id));
           },
           get filterable() {
-            return J();
+            return A(() => f() === "solo-filter")() && ie();
+          },
+          get activationMode() {
+            return f();
+          },
+          get presentation() {
+            return u();
           },
           get hoverOffset() {
-            return f(w());
+            return M(b());
           },
           get isDragging() {
-            return Z(() => o.kind === "widget")() ? Ce() === o.id : Pe() === o.id;
+            return A(() => r.kind === "widget")() ? Se() === r.id : Te() === r.id;
           },
           get canvasPlacement() {
-            return Z(() => o.kind === "widget")() ? {
+            return A(() => r.kind === "widget")() ? {
               preview: {
                 kind: "widget",
-                id: o.id
+                id: r.id
               },
-              onDrop: (v, L, g) => e.onCreateAt?.(o.id, v, L, g)
+              onDrop: (P, O, g) => e.onCreateAt?.(r.id, P, O, g)
             } : {
               preview: {
                 kind: "tool",
-                id: o.id
+                id: r.id
               },
-              onDrop: (v, L, g) => e.onCreateToolAt?.(o.id, v, L, g)
+              onDrop: (P, O, g) => e.onCreateToolAt?.(r.id, P, O, g)
             };
           },
-          onEnter: () => i(w()),
-          onLeave: () => i((v) => v === w() ? null : v),
-          onDragBegin: j
+          onEnter: () => i(b()),
+          onLeave: () => i((P) => P === b() ? null : P),
+          onKeyboardActivate: (P) => F(r.kind, r.id, r.label, P),
+          onDragBegin: B
+        });
+      }
+    }), null), m(t, l(X, {
+      get when() {
+        return fe().length > 0 || ce("after-components");
+      },
+      get children() {
+        return gt();
+      }
+    }), null), m(t, l(ne, {
+      get each() {
+        return fe();
+      },
+      children: (r, _) => {
+        const b = () => _() + U().length + re().length + oe().length + 1;
+        return l(se, {
+          get id() {
+            return r.id;
+          },
+          kind: "host",
+          get label() {
+            return r.label;
+          },
+          get icon() {
+            return r.icon;
+          },
+          get active() {
+            return !!r.active;
+          },
+          visible: !0,
+          filterable: !1,
+          get activationMode() {
+            return f();
+          },
+          get hoverOffset() {
+            return M(b());
+          },
+          get isDragging() {
+            return A(() => c()?.kind === "host")() && c()?.id === r.id;
+          },
+          get canvasPlacement() {
+            return H(r.canvasPlacement);
+          },
+          get onContextMenu() {
+            return r.onContextMenu;
+          },
+          onKeyboardActivate: (u) => F("host", r.id, r.label, u),
+          onEnter: () => i(b()),
+          onLeave: () => i((u) => u === b() ? null : u),
+          onDragBegin: B
         });
       }
-    }), null), A((o) => {
-      var E = `workbench-dock workbench-dock-material${l()?.kind === "external" && l()?.moved ? " is-external-drop-target" : ""}${l()?.kind === "external" && l()?.overDock ? " is-external-drop-allowed" : ""}`, w = T() === "background", v = !!(Q() || s()), L = s();
-      return E !== o.e && Xe(t, o.e = E), w !== o.t && m.classList.toggle("is-active", o.t = w), v !== o.a && m.classList.toggle("is-hovered", o.a = v), L !== o.o && S(m, "aria-expanded", o.o = L), o;
+    }), null), m(t, l(X, {
+      get when() {
+        return ce("after-components");
+      },
+      get children() {
+        return l(he, {});
+      }
+    }), null), W((r) => {
+      var _ = `workbench-dock workbench-dock-material${c()?.kind === "external" && c()?.moved ? " is-external-drop-target" : ""}${c()?.kind === "external" && c()?.overDock ? " is-external-drop-allowed" : ""}`, b = y() === "background", u = !!(ae() || s()), P = s();
+      return _ !== r.e && Ke(t, r.e = _), b !== r.t && k.classList.toggle("is-active", r.t = b), u !== r.a && k.classList.toggle("is-hovered", r.a = u), P !== r.o && I(k, "aria-expanded", r.o = P), r;
     }, {
       e: void 0,
       t: void 0,
       a: void 0,
       o: void 0
     }), t;
-  })(), d(K, {
+  })(), l(X, {
     get when() {
-      return !!(l()?.moved && !l()?.preview);
+      return !!(c()?.moved && !c()?.preview);
     },
     get children() {
-      return d(kt, {
-        state: l
+      return l(Pt, {
+        state: c
       });
     }
   })];
 }
-function kt(e) {
-  const u = () => {
-    const c = e.state();
-    return c ? `translate3d(${c.clientX + 14}px, ${c.clientY - 56}px, 0)` : "translate3d(0px, 0px, 0)";
-  }, i = () => e.state()?.label ?? "", l = () => e.state()?.icon;
-  return d($e, {
+function Pt(e) {
+  const v = () => {
+    const d = e.state();
+    return d ? `translate3d(${d.clientX + 14}px, ${d.clientY - 56}px, 0)` : "translate3d(0px, 0px, 0)";
+  }, i = () => e.state()?.label ?? "", c = () => e.state()?.icon;
+  return l(We, {
     get children() {
-      var c = it(), s = c.firstChild, r = s.nextSibling, a = r.firstChild, D = a.nextSibling, k = D.firstChild, _ = k.nextSibling, C = _.firstChild;
-      return b(a, d(K, {
+      var d = kt(), s = d.firstChild, x = s.nextSibling, w = x.firstChild, D = w.nextSibling, o = D.firstChild, a = o.nextSibling, E = a.firstChild;
+      return m(w, l(X, {
         get when() {
-          return l();
+          return c();
         },
         children: (f) => {
-          const I = f();
-          return d(I, {
+          const M = f();
+          return l(M, {
             class: "w-4 h-4"
           });
         }
-      })), b(k, i), b(_, d(Re, {
+      })), m(o, i), m(a, l(qe, {
         class: "w-3 h-3"
-      }), C), b(C, () => e.state()?.kind === "external" ? "Pin to Dock" : "Drag onto canvas"), A((f) => {
-        var I = !!(e.state()?.kind === "external" && e.state()?.overDock), X = u();
-        return I !== f.e && c.classList.toggle("is-over-dock", f.e = I), X !== f.t && Ye(c, "transform", f.t = X), f;
+      }), E), m(E, () => e.state()?.kind === "external" ? "Pin to Dock" : "Drag onto canvas"), W((f) => {
+        var M = !!(e.state()?.kind === "external" && e.state()?.overDock), Y = v();
+        return M !== f.e && d.classList.toggle("is-over-dock", f.e = M), Y !== f.t && Ne(d, "transform", f.t = Y), f;
       }, {
         e: void 0,
         t: void 0
-      }), c;
+      }), d;
     }
   });
 }
-Fe(["pointerdown", "contextmenu", "keydown", "click"]);
+Ge(["pointerdown", "click", "contextmenu", "keydown"]);
 export {
-  St as WorkbenchDock
+  Bt as WorkbenchDock
 };