@@ -93,18 +93,13 @@ describe("rotation pipeline", () => {
       },
     }) as LabelObject;
 
-  it("does not set rotate for N", () => {
-    const opts = buildBwipOptions(baseCode128("N"), 1, 8);
-    expect(opts?.rotate).toBeUndefined();
-  });
-
-  it("forwards R and I unchanged to bwip-js", () => {
-    expect(buildBwipOptions(baseCode128("R"), 1, 8)?.rotate).toBe("R");
-    expect(buildBwipOptions(baseCode128("I"), 1, 8)?.rotate).toBe("I");
-  });
-
-  it("translates ZPL B to bwip L (270° CW)", () => {
-    expect(buildBwipOptions(baseCode128("B"), 1, 8)?.rotate).toBe("L");
+  it("never sets a bwip rotate option (Konva handles visual rotation)", () => {
+    // bwip-js always renders upright now; the renderer wraps the
+    // bitmap in an inner rotated Group via rotatedGroupTransform. A
+    // rotate option in opts would double-rotate the result.
+    for (const rot of ["N", "R", "I", "B"] as const) {
+      expect(buildBwipOptions(baseCode128(rot), 1, 8)?.rotate).toBeUndefined();
+    }
   });
 
   it("resolves UPC/EAN supplement bcid by content length", () => {
@@ -132,14 +127,12 @@ describe("rotation pipeline", () => {
   });
 
   it("swaps display W and H for quarter rotations", () => {
-    // Pretend bwip produced an unrotated 200x100 bitmap.
-    const fakeCanvas = { width: 200, height: 100 } as HTMLCanvasElement;
-    const upright = getDisplaySize(baseCode128("N"), fakeCanvas, 1, 8);
-    // For R/B, bwip's bitmap is post-rotation (100x200). Pass that and check
-    // the upright dimensions are recovered then re-swapped to visible.
-    const rotatedCanvas = { width: 100, height: 200 } as HTMLCanvasElement;
-    const rotR = getDisplaySize(baseCode128("R"), rotatedCanvas, 1, 8);
-    const rotB = getDisplaySize(baseCode128("B"), rotatedCanvas, 1, 8);
+    // bwip-js always produces an upright bitmap now; getDisplaySize
+    // swaps W/H itself for R/B to report the rotated screen footprint.
+    const uprightCanvas = { width: 200, height: 100 } as HTMLCanvasElement;
+    const upright = getDisplaySize(baseCode128("N"), uprightCanvas, 1, 8);
+    const rotR = getDisplaySize(baseCode128("R"), uprightCanvas, 1, 8);
+    const rotB = getDisplaySize(baseCode128("B"), uprightCanvas, 1, 8);
     expect(rotR.w).toBe(upright.h);
     expect(rotR.h).toBe(upright.w);
     expect(rotB.w).toBe(upright.h);
 
@@ -289,12 +289,8 @@ export function buildBwipOptions(
   const bcid = BCID[obj.type];
   if (!bcid) return null;
 
-  // bwip-js takes the same N/R/I/B letters ZPL does for symbol orientation;
-  // emitting it post-build means the produced bitmap is already rotated and
-  // its dimensions are the post-rotation extents — no Konva-side rotation math
-  // needed.
-  const rotation = objectRotation(obj.props);
-
+  // bwip always renders upright; visual rotation is handled in the
+  // Konva renderer via an inner rotated Group (rotatedGroupTransform).
   // Declared without an initializer because every reachable case
   // assigns before `break` and the `default` arm returns early — the
   // previous `= null` initializer is what ESLint 10's
@@ -352,8 +348,9 @@ export function buildBwipOptions(
       // HRI digits sit ABOVE the bars per Zebra firmware. Rendered
       // as a separate Konva Text overlay (same pattern as logmars)
       // so all four rotations land at the firmware-correct anchor
-      // via getRotatedTextAnchor; bwip's own includetext would
-      // bake the text into the bitmap and rotate with it.
+      // via the inner rotated Group in BarcodeObject; bwip's own
+      // includetext would bake the text into the bitmap and rotate
+      // with it.
       const text = p.content || "00000";
       const variantBcid = text.length === 2 ? "ean2" : "ean5";
       opts = {
@@ -539,16 +536,10 @@ export function buildBwipOptions(
       return null;
   }
 
-  if (rotation !== "N") {
-    // ZPL uses N/R/I/B (B = 270° CW). bwip-js uses N/R/I/L (L = 90° CCW =
-    // 270° CW). The other three letters mean the same thing in both.
-    opts.rotate = rotation === "B" ? "L" : rotation;
-    // HRI text is handled as a Konva overlay in BarcodeObject (same as for
-    // upright barcodes). Using bwip's includetext would embed text into the
-    // bitmap at bwip's internal scale, making the bitmap taller/wider than the
-    // bar-only dimensions that getDisplaySize computes — causing the KImage to
-    // stretch the bitmap incorrectly and appear blurry/distorted.
-  }
+  // Visual rotation is Konva's job (wraps the KImage in a rotated Group
+  // via rotatedGroupTransform). Asking bwip to rotate would produce
+  // bitmaps in mismatched orientations across types — keep them all
+  // upright so the renderer can rotate them uniformly.
   return opts;
 }
 
@@ -573,6 +564,18 @@ export interface BarcodeDisplaySize {
   barH: number;
   barLeftPx: number;
   barTopPx: number;
+  /** Upright (rotation=N) view of the same layout. Renderers that draw
+   *  inside an inner rotated Group consume this so their geometry stays
+   *  rotation-independent — the inner group's transform handles the
+   *  visual rotation. Always present alongside the rotated fields. */
+  upright: {
+    w: number;
+    h: number;
+    barW: number;
+    barH: number;
+    barLeftPx: number;
+    barTopPx: number;
+  };
   /** Sub-rect of the bwip-js canvas to render (in source pixel coords).
    *  Lets the renderer skip bwip's internal padding, e.g. the
    *  paddingheight pad on GS1 DataBar that would otherwise leave the
@@ -581,60 +584,6 @@ export interface BarcodeDisplaySize {
   bitmapCrop?: { x: number; y: number; width: number; height: number };
 }
 
-/** Anchor coordinates for a Konva Text node that is rotated alongside a
- *  1D barcode. Exactly one field is meaningful per rotation: `sideX` for
- *  R / B, `topY` for I. The other is set to 0 and ignored by the caller. */
-export interface RotatedTextAnchor {
-  sideX: number;
-  topY: number;
-}
-
-/**
- * Where to place the rotated HRI text node so it sits `textGap` dots away
- * from the bars on the firmware-correct side.
- *
- * Naive sideX = -textGap / w + textGap anchors against the bbox edge,
- * which double-counts the firmware text zone (EAN/UPC: 13 dots, logmars:
- * 20 dots). Anchoring against the bar sub-rectangle (`barLeftPx`/`bw` for
- * R/B, `barTopPx`/`bh` for I) keeps the gap at exactly `textGap`
- * regardless of which side the text zone sits on.
- *
- * Konva rotates around the node origin, so the anchor accounts for the
- * text glyph extending in the rotation-opposite direction. For R (CW 90)
- * with text on the right, the glyph extends LEFT of `sideX` by
- * `textFontSize`, so we offset by +textFontSize. Mirror for B (CCW 90)
- * and I (180).
- */
-export function getRotatedTextAnchor(
-  rotation: "R" | "B" | "I",
-  isTextAbove: boolean,
-  dim: Pick<BarcodeDisplaySize, "barLeftPx" | "barTopPx" | "barW" | "barH">,
-  textGap: number,
-  textFontSize: number,
-): RotatedTextAnchor {
-  const { barLeftPx: btX, barTopPx: btY, barW: bw, barH: bh } = dim;
-  if (rotation === "R") {
-    return {
-      sideX: isTextAbove ? btX + bw + textGap + textFontSize : btX - textGap,
-      topY: 0,
-    };
-  }
-  if (rotation === "B") {
-    return {
-      sideX: isTextAbove ? btX - textGap - textFontSize : btX + bw + textGap,
-      topY: 0,
-    };
-  }
-  // I (180°): text glyph extends UP from the origin, so a text-below-in-
-  // upright glyph (now top after flip) anchors at btY - textGap; a
-  // text-above-in-upright glyph (now bottom) anchors at btY + bh +
-  // textGap + textFontSize.
-  return {
-    sideX: 0,
-    topY: isTextAbove ? btY + bh + textGap + textFontSize : btY - textGap,
-  };
-}
-
 /** Firmware-reserved text-zone height in dots, keyed by symbology. The
  *  zone sits below the bars in upright orientation; rotation maps it to
  *  another side of the bbox in getDisplaySize. Types not listed have no
@@ -656,19 +605,18 @@ export function getDisplaySize(
   if (!canvas) {
     return {
       w: 0, h: 0, barW: 0, barH: 0, barLeftPx: 0, barTopPx: 0,
+      upright: { w: 0, h: 0, barW: 0, barH: 0, barLeftPx: 0, barTopPx: 0 },
     };
   }
 
-  // For 90°/270° rotations, bwip-js produces a bitmap whose width and height
-  // are swapped relative to the upright form. Compute size as if upright (the
-  // existing per-symbology formulas all assume that), then swap at the end.
+  // bwip-js now always renders upright (the BarcodeObject renderer
+  // handles visual rotation via a rotated Konva Group), so the canvas
+  // dimensions are the upright dimensions directly.
   const rotation = objectRotation(obj.props);
   const isQuarter = rotation === "R" || rotation === "B";
-  const cw = isQuarter ? canvas.height : canvas.width;
-  const ch = isQuarter ? canvas.width : canvas.height;
-  const upright = getUprightDisplaySize(obj, cw, ch, scale, dpmm);
+  const upright = getUprightDisplaySize(obj, canvas.width, canvas.height, scale, dpmm);
 
-  // Bbox after rotation.
+  // Bbox after rotation: R/B swap upright w/h; N/I keep them.
   const w = isQuarter ? upright.h : upright.w;
   const h = isQuarter ? upright.w : upright.h;
 
@@ -725,39 +673,41 @@ export function getDisplaySize(
   }
 
   // GS1 DataBar opts include `paddingheight: N`, which adds whitespace
-  // rows on top and bottom of the bwip canvas. Without cropping them out,
-  // the bitmap drawn at displayH leaves the bars proportionally shorter
-  // than the spec-correct height. Zebra firmware fills the full reserved
-  // height with bars; mirror that by cropping the source bitmap to the
-  // bar-only rows.
-  //
-  // Rotation flips which axis the padding sits on. For N / I the padding
-  // is on top/bottom of the bitmap as bwip produced it; for R / B (bwip
-  // rotated 90° CW / CCW respectively) the same rows end up on the
-  // left/right edges, so the crop must run along the x-axis instead.
+  // rows on top and bottom of the upright bwip canvas. Without cropping
+  // them out, the bitmap drawn at displayH leaves the bars
+  // proportionally shorter than the spec-correct height. Zebra firmware
+  // fills the full reserved height with bars; mirror that by cropping
+  // the source bitmap to the bar-only rows. Always y-axis now because
+  // bwip renders upright.
   let bitmapCrop: BarcodeDisplaySize["bitmapCrop"];
   if (obj.type === "gs1databar") {
     const bwipSc = get1DBwipScale(obj.props.moduleWidth, scale, dpmm);
     const padPx = GS1_DATABAR_PADDING_ROWS * bwipSc;
-    const axisDim = isQuarter ? canvas.width : canvas.height;
-    if (axisDim > 2 * padPx) {
-      bitmapCrop = isQuarter
-        ? {
-            x: padPx,
-            y: 0,
-            width: canvas.width - 2 * padPx,
-            height: canvas.height,
-          }
-        : {
-            x: 0,
-            y: padPx,
-            width: canvas.width,
-            height: canvas.height - 2 * padPx,
-          };
+    if (canvas.height > 2 * padPx) {
+      bitmapCrop = {
+        x: 0,
+        y: padPx,
+        width: canvas.width,
+        height: canvas.height - 2 * padPx,
+      };
     }
   }
 
-  return { w, h, barW, barH, barLeftPx, barTopPx, bitmapCrop };
+  // Upright view (rotation=N) of the same layout. Text zone sits above
+  // the bars when isTextAbove (logmars), otherwise implicitly below
+  // (barTopPx=0, barH = h - textZonePx). Bars span the full width.
+  // The inner-rotated-Group renderer pattern consumes this so its
+  // geometry stays rotation-independent.
+  const uprightView = {
+    w: upright.w,
+    h: upright.h,
+    barLeftPx: 0,
+    barTopPx: isTextAbove && textZonePx > 0 ? textZonePx : 0,
+    barW: upright.w,
+    barH: textZonePx > 0 ? upright.h - textZonePx : upright.h,
+  };
+
+  return { w, h, barW, barH, barLeftPx, barTopPx, upright: uprightView, bitmapCrop };
 }
 
 function getUprightDisplaySize(
 
@@ -0,0 +1,109 @@
+import { Text } from "react-konva";
+import type { ReactNode } from "react";
+import type { EanUpcType } from "./bwipHelpers";
+
+/** Visual gap in display px between the UPC-E bar end and the floated
+ *  check digit. Chosen by eye to match the Labelary render — the digit
+ *  sits just past the quiet-zone boundary, not flush against the bars. */
+const UPCE_TRAIL_DIGIT_GAP_PX = 2;
+
+/** Result of building the EAN/UPC digit overlay: the Konva text nodes
+ *  plus the clip-expansion needed on the parent Group so floated
+ *  sys/trail digits stay visible. `clipLeft`/`clipRight` are dots
+ *  beyond the bar's upright x-range (0..barW) the parent must reserve;
+ *  consumers without clipping can ignore them. */
+export interface EanUpcDigitOverlay {
+  nodes: ReactNode[];
+  clipLeft: number;
+  clipRight: number;
+}
+
+interface BuildArgs {
+  type: EanUpcType;
+  displayText: string;
+  layout: { xLeft: number; xRight: number; halfWidth: number };
+  /** Upright bar width in display px — used as the right anchor for
+   *  the UPC-E trail digit (sits 2px past the bar end). */
+  uprightBarW: number;
+  /** Upright bar height in display px — text Y = uprightBarH + textGap. */
+  uprightBarH: number;
+  textGap: number;
+  textFontSize: number;
+}
+
+/** Build the digit-by-digit HRI overlay for EAN-13 / EAN-8 / UPC-A /
+ *  UPC-E in upright coords. Single source of truth shared by the
+ *  upright printInterp branch and the rotated inner-Group branch in
+ *  BarcodeObject — both produce identical digit positions, only the
+ *  parent wrapper differs (upright clips the bbox; rotated wraps in a
+ *  rotatedGroupTransform Group). */
+export function buildEanUpcDigitOverlay(args: BuildArgs): EanUpcDigitOverlay {
+  const { type, displayText, layout, uprightBarW, uprightBarH, textGap, textFontSize } = args;
+  const ldW = textFontSize * 1.2;
+  const textY = Math.max(uprightBarH, 1) + textGap;
+  const { xLeft, xRight, halfWidth: halfW } = layout;
+
+  const tStyle = {
+    y: textY,
+    fontSize: textFontSize,
+    fontFamily: "'Courier New', monospace" as const,
+    fontStyle: "bold" as const,
+    wrap: "none" as const,
+    fill: "#000000",
+    listening: false,
+  };
+
+  const main = (key: string, x: number, width: number, text: string) =>
+    <Text key={key} x={x} width={Math.max(width, 1)} text={text} align="center" {...tStyle} />;
+  const sys = (text: string) =>
+    <Text key="sys" x={-ldW} width={ldW} text={text} align="center" {...tStyle} />;
+  const trail = (text: string) =>
+    <Text key="trail" x={uprightBarW + UPCE_TRAIL_DIGIT_GAP_PX} width={ldW} text={text} align="left" {...tStyle} />;
+
+  switch (type) {
+    case "ean13":
+      return {
+        clipLeft: ldW,
+        clipRight: 0,
+        nodes: [
+          sys(displayText[0] ?? ""),
+          main("left", xLeft, halfW, displayText.slice(1, 7)),
+          main("right", xRight, halfW, displayText.slice(7, 13)),
+        ],
+      };
+    case "ean8":
+      return {
+        clipLeft: 0,
+        clipRight: 0,
+        nodes: [
+          main("left", xLeft, halfW, displayText.slice(0, 4)),
+          main("right", xRight, halfW, displayText.slice(4, 8)),
+        ],
+      };
+    case "upca":
+      // UPC-A HRI: number system (1) | 5 manuf | 5 product | check (1).
+      // System digit floats left of the bars, check digit floats right —
+      // matches Zebra's ^BU default (checkDigit=Y) which the generator
+      // now emits.
+      return {
+        clipLeft: ldW,
+        clipRight: ldW,
+        nodes: [
+          sys(displayText[0] ?? ""),
+          main("left", xLeft, halfW, displayText.slice(1, 6)),
+          main("right", xRight, halfW, displayText.slice(6, 11)),
+          trail(displayText[11] ?? ""),
+        ],
+      };
+    case "upce":
+      return {
+        clipLeft: ldW,
+        clipRight: ldW,
+        nodes: [
+          sys(displayText[0] ?? "0"),
+          main("mid", xLeft, halfW, displayText.slice(1, 7)),
+          trail(displayText[7] ?? ""),
+        ],
+      };
+  }
+}