@spaethtech/svelte-ui 0.16.1-dev.76.a0169fa → 0.17.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -789,9 +789,18 @@
789
789
  const near = group === "bottom" ? "border-b" : "border-t";
790
790
  const opp = group === "bottom" ? "border-t" : "border-b";
791
791
  const nudge = group === "bottom" ? 1 : -1;
792
+ // The SEAM edge (facing the strip) of a top-level popout: it overlaps the strip's 1px dock border
793
+ // and its opaque background would cover it, so draw the seam explicitly in the dock-border colour
794
+ // (`--ui-border-color`) — a self-contained, guaranteed match (vs. relying on the strip's border
795
+ // peeking through, which breaks with any overlap). Nested cascades float mid-content → no seam.
796
+ const seam = top
797
+ ? dockRight
798
+ ? "border-r [border-right-color:var(--ui-border-color)]"
799
+ : "border-l [border-left-color:var(--ui-border-color)]"
800
+ : "";
792
801
  const placed = top ? placedById[id] : undefined;
793
802
  const aside = top ? asideRef?.getBoundingClientRect() : undefined;
794
- if (!placed || !aside) return { cls: `${farH} ${near} ${opp}`, nudge };
803
+ if (!placed || !aside) return { cls: `${farH} ${near} ${opp}`, seam, nudge };
795
804
  const h = rowsShown * rowPx;
796
805
  const topFlush = placed.y <= aside.top + 1;
797
806
  const bottomFlush = placed.y + h >= aside.bottom - 1;
@@ -799,6 +808,7 @@
799
808
  const oppFlush = group === "bottom" ? topFlush : bottomFlush;
800
809
  return {
801
810
  cls: `${farH}${nearFlush ? "" : ` ${near}`}${oppFlush ? "" : ` ${opp}`}`,
811
+ seam,
802
812
  nudge: nearFlush ? 0 : nudge,
803
813
  };
804
814
  }
@@ -1083,7 +1093,7 @@
1083
1093
  data-sbm-popout=""
1084
1094
  data-open={isOpen}
1085
1095
  style="width: max-content;{expandedWidth != null ? ` max-width: ${expandedWidth}px;` : ''} max-height: {maxHeight}; --sbm-accent: {accentVar}; --sbm-lbl: inline; --sbm-affix: inline-flex;{bd.nudge ? ` transform: translateY(${bd.nudge}px);` : ''}"
1086
- class="overflow-hidden shadow-lg [background-color:var(--ui-color-background)] [color:var(--ui-color-text)] [border-color:color-mix(in_srgb,var(--ui-color-neutral)_var(--ui-tint-border),transparent)] {bd.cls}"
1096
+ class="overflow-hidden shadow-lg [background-color:var(--ui-color-background)] [color:var(--ui-color-text)] [border-color:color-mix(in_srgb,var(--ui-color-neutral)_var(--ui-tint-border),transparent)] {bd.cls} {bd.seam}"
1087
1097
  onmouseenter={popoutOnHover ? cancelClose : undefined}
1088
1098
  onmouseleave={popoutOnHover ? scheduleClose : undefined}
1089
1099
  onwheel={item.popout
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@spaethtech/svelte-ui",
3
- "version": "0.16.1-dev.76.a0169fa",
3
+ "version": "0.17.0",
4
4
  "repository": {
5
5
  "type": "git",
6
6
  "url": "git+https://github.com/spaethtech/svelte-ui.git"