@trdrs/quickcharts 5.6.0 → 5.6.1

package/CHANGELOG.md

@@ -2,6 +2,10 @@
 
 ## Unreleased
 
+## 5.6.1
+
+The currency and unit box spans its price scale, as wide as the scale less four pixels on each side, so it stays inside a scale of any width, and words too long for it end in an ellipsis.
+
 ## 5.6.0
 
 The currency and unit box holds its words in a 24px row inside its outline, at the row's start, 3px in from each end on a radius of 3. With `scaleUnitMenu` the row ends in a 7 by 5 caret and lights under the pointer, and `ScaleUnitMenuRequest.expanded(open)` lets the host say its menu stands open, which keeps the row lit and turns the caret up. The auto-scale and logarithmic buttons stand 4px apart, the pair centred on the scale.

package/dist/feature-manifest.json

@@ -1,5 +1,5 @@
 {
-  "version": "5.6.0",
+  "version": "5.6.1",
   "styles": [
     {
       "id": "candles",

package/dist/index.js

@@ -20449,7 +20449,7 @@ function mountScaleControls(deps) {
   stopPointer(modes);
   const door = deps.openUnitMenu;
   const unit = door ? h("button", { type: "button", class: "qc-scale-unit", "data-role": "scale-unit", "aria-haspopup": "menu", "aria-expanded": "false" }) : h("div", { class: "qc-scale-unit", "data-role": "scale-unit" });
-  const unitText = h("span", {});
+  const unitText = h("span", { class: "qc-scale-unit-text" });
   unit.append(h("span", { class: "qc-scale-unit-row" }, unitText, door ? deps.icons.glyph(ICONS.scaleUnitArrow, { size: 7, height: 5, className: "qc-scale-unit-arrow" }) : null));
   if (door) {
     stopPointer(unit);
@@ -20579,8 +20579,8 @@ function mountScaleControls(deps) {
     unit.dataset.qcVisibility = visibility;
     unit.hidden = text2 === "" || visibility === "never" || visibility === "hover" && !overScale && !overControls;
     unit.style.top = `${Math.round(box2.top + UNIT_BOX.inset)}px`;
-    unit.style.left = box2.side === "right" ? `${Math.round(box2.left + UNIT_BOX.inset)}px` : "";
-    unit.style.right = box2.side === "left" ? `${Math.round(deps.gestures.clientWidth - box2.left - box2.width + UNIT_BOX.inset)}px` : "";
+    unit.style.left = `${Math.round(box2.left + UNIT_BOX.inset)}px`;
+    unit.style.width = `${Math.max(0, Math.round(box2.width - UNIT_BOX.inset * 2))}px`;
   };
   const within = (event) => {
     const box2 = deps.box();