croact-ruler - npm Package Compare versions

Comparing version 0.16.1 to 0.17.0

dist/ruler.cjs.js

@@ -7,3 +7,3 @@ /*
 repository: https://github.com/daybrush/ruler/blob/master/packages/croact-ruler
-version: 0.16.1
+version: 0.17.0
 */
@@ -22,3 +22,3 @@ 'use strict';
 repository: https://github.com/daybrush/ruler/blob/master/packages/react-ruler
-version: 0.17.1
+version: 0.18.0
 */
@@ -103,3 +103,3 @@ /******************************************************************************
     var context = canvas.getContext("2d", {
-      alpha: false
+      alpha: true
     });
@@ -202,3 +202,6 @@ this.canvasContext = context;
         _g = _a.selectedRangesTextOffset,
-        selectedRangesTextOffset = _g === void 0 ? [0, 0] : _g;
+        selectedRangesTextOffset = _g === void 0 ? [0, 0] : _g,
+        _h = _a.markColor,
+        markColor = _h === void 0 ? "#ff5" : _h,
+        marks = _a.marks;
 
@@ -393,9 +396,9 @@ var rulerScale = this._getRulerScale();
 
-        var _h = isHorizontal ? [pos + lineOffset[0], origin + lineOffset[1]] : [origin + lineOffset[0], pos + lineOffset[1]],
-            x1 = _h[0],
-            y1 = _h[1];
+        var _j = isHorizontal ? [pos + lineOffset[0], origin + lineOffset[1]] : [origin + lineOffset[0], pos + lineOffset[1]],
+            x1 = _j[0],
+            y1 = _j[1];
 
-        var _j = isHorizontal ? [x1, y1 + lineSize] : [x1 + lineSize, y1],
-            x2 = _j[0],
-            y2 = _j[1];
+        var _k = isHorizontal ? [x1, y1 + lineSize] : [x1 + lineSize, y1],
+            x2 = _k[0],
+            y2 = _k[1];
 
@@ -407,2 +410,25 @@ context.moveTo(x1 + lineOffset[0], y1 + lineOffset[1]);
 
+    context.stroke();
+    context.beginPath(); // Render marks
+
+    context.strokeStyle = markColor;
+    context.lineWidth = 1;
+    (marks || []).forEach(function (value) {
+      var pos = (-scrollPos + value) * nextZoom;
+
+      if (pos < 0 || pos >= size || value < range[0] || value > range[1]) {
+        return;
+      }
+
+      var _a = isHorizontal ? [pos + lineOffset[0], lineOffset[1]] : [lineOffset[0], pos + lineOffset[1]],
+          x1 = _a[0],
+          y1 = _a[1];
+
+      var _b = isHorizontal ? [x1, y1 + containerSize] : [x1 + containerSize, y1],
+          x2 = _b[0],
+          y2 = _b[1];
+
+      context.moveTo(x1 + lineOffset[0], y1 + lineOffset[1]);
+      context.lineTo(x2 + lineOffset[0], y2 + lineOffset[1]);
+    });
     context.stroke(); // Render Labels
@@ -537,3 +563,5 @@
     selectedBackgroundColor: "#555555",
-    defaultScrollPos: 0
+    defaultScrollPos: 0,
+    markColor: "#f55",
+    marks: []
   };
@@ -543,3 +571,3 @@ return Ruler;
 
-var PROPERTIES = ["type", "width", "height", "unit", "zoom", "direction", "textAlign", "font", "segment", "mainLineSize", "longLineSize", "shortLineSize", "lineOffset", "textOffset", "negativeRuler", "range", "scrollPos", "defaultScrollPos", "style", "backgroundColor", "rangeBackgroundColor", "lineColor", "textColor", "textBackgroundColor", "textFormat", "warpSelf", "selectedBackgroundColor", "selectedRanges", "defaultPixelScale", "useResizeObserver", "selectedRangesText", "selectedRangesTextColor", "selectedRangesTextOffset"];
+var PROPERTIES = ["type", "width", "height", "unit", "zoom", "direction", "textAlign", "font", "segment", "mainLineSize", "longLineSize", "shortLineSize", "lineOffset", "textOffset", "negativeRuler", "range", "scrollPos", "defaultScrollPos", "style", "backgroundColor", "rangeBackgroundColor", "lineColor", "textColor", "textBackgroundColor", "textFormat", "warpSelf", "selectedBackgroundColor", "selectedRanges", "defaultPixelScale", "useResizeObserver", "selectedRangesText", "selectedRangesTextColor", "selectedRangesTextOffset", "marks", "markColor"];
 var METHODS = ["scroll", "resize", "getScrollPos"];
@@ -546,0 +574,0 @@

dist/ruler.esm.js

@@ -7,3 +7,3 @@ /*
 repository: https://github.com/daybrush/ruler/blob/master/packages/croact-ruler
-version: 0.16.1
+version: 0.17.0
 */
@@ -20,3 +20,3 @@ import { createElement, PureComponent } from 'croact';
 repository: https://github.com/daybrush/ruler/blob/master/packages/react-ruler
-version: 0.17.1
+version: 0.18.0
 */
@@ -101,3 +101,3 @@ /******************************************************************************
     var context = canvas.getContext("2d", {
-      alpha: false
+      alpha: true
     });
@@ -200,3 +200,6 @@ this.canvasContext = context;
         _g = _a.selectedRangesTextOffset,
-        selectedRangesTextOffset = _g === void 0 ? [0, 0] : _g;
+        selectedRangesTextOffset = _g === void 0 ? [0, 0] : _g,
+        _h = _a.markColor,
+        markColor = _h === void 0 ? "#ff5" : _h,
+        marks = _a.marks;
 
@@ -391,9 +394,9 @@ var rulerScale = this._getRulerScale();
 
-        var _h = isHorizontal ? [pos + lineOffset[0], origin + lineOffset[1]] : [origin + lineOffset[0], pos + lineOffset[1]],
-            x1 = _h[0],
-            y1 = _h[1];
+        var _j = isHorizontal ? [pos + lineOffset[0], origin + lineOffset[1]] : [origin + lineOffset[0], pos + lineOffset[1]],
+            x1 = _j[0],
+            y1 = _j[1];
 
-        var _j = isHorizontal ? [x1, y1 + lineSize] : [x1 + lineSize, y1],
-            x2 = _j[0],
-            y2 = _j[1];
+        var _k = isHorizontal ? [x1, y1 + lineSize] : [x1 + lineSize, y1],
+            x2 = _k[0],
+            y2 = _k[1];
 
@@ -405,2 +408,25 @@ context.moveTo(x1 + lineOffset[0], y1 + lineOffset[1]);
 
+    context.stroke();
+    context.beginPath(); // Render marks
+
+    context.strokeStyle = markColor;
+    context.lineWidth = 1;
+    (marks || []).forEach(function (value) {
+      var pos = (-scrollPos + value) * nextZoom;
+
+      if (pos < 0 || pos >= size || value < range[0] || value > range[1]) {
+        return;
+      }
+
+      var _a = isHorizontal ? [pos + lineOffset[0], lineOffset[1]] : [lineOffset[0], pos + lineOffset[1]],
+          x1 = _a[0],
+          y1 = _a[1];
+
+      var _b = isHorizontal ? [x1, y1 + containerSize] : [x1 + containerSize, y1],
+          x2 = _b[0],
+          y2 = _b[1];
+
+      context.moveTo(x1 + lineOffset[0], y1 + lineOffset[1]);
+      context.lineTo(x2 + lineOffset[0], y2 + lineOffset[1]);
+    });
     context.stroke(); // Render Labels
@@ -535,3 +561,5 @@
     selectedBackgroundColor: "#555555",
-    defaultScrollPos: 0
+    defaultScrollPos: 0,
+    markColor: "#f55",
+    marks: []
   };
@@ -541,3 +569,3 @@ return Ruler;
 
-var PROPERTIES = ["type", "width", "height", "unit", "zoom", "direction", "textAlign", "font", "segment", "mainLineSize", "longLineSize", "shortLineSize", "lineOffset", "textOffset", "negativeRuler", "range", "scrollPos", "defaultScrollPos", "style", "backgroundColor", "rangeBackgroundColor", "lineColor", "textColor", "textBackgroundColor", "textFormat", "warpSelf", "selectedBackgroundColor", "selectedRanges", "defaultPixelScale", "useResizeObserver", "selectedRangesText", "selectedRangesTextColor", "selectedRangesTextOffset"];
+var PROPERTIES = ["type", "width", "height", "unit", "zoom", "direction", "textAlign", "font", "segment", "mainLineSize", "longLineSize", "shortLineSize", "lineOffset", "textOffset", "negativeRuler", "range", "scrollPos", "defaultScrollPos", "style", "backgroundColor", "rangeBackgroundColor", "lineColor", "textColor", "textBackgroundColor", "textFormat", "warpSelf", "selectedBackgroundColor", "selectedRanges", "defaultPixelScale", "useResizeObserver", "selectedRangesText", "selectedRangesTextColor", "selectedRangesTextOffset", "marks", "markColor"];
 var METHODS = ["scroll", "resize", "getScrollPos"];
@@ -544,0 +572,0 @@

package.json

 {
     "name": "croact-ruler",
-    "version": "0.16.1",
+    "version": "0.17.0",
     "description": "A React Compat Ruler component that can draw grids and scroll infinitely.",
@@ -46,3 +46,3 @@ "main": "./dist/ruler.cjs.js",
         "@types/react": "^16.9.17",
-        "croact": "^1.0.0",
+        "croact": "^1.0.3",
         "keycon": "^0.3.0",
@@ -60,4 +60,4 @@ "preact": "^10.0.0",
     "dependencies": {
-        "@scena/react-ruler": "~0.17.1"
+        "@scena/react-ruler": "~0.18.0"
     }
 }

No alert changes

Improved metrics

Total package byte prevSize

37017

increased by5.09%

Lines of code

950

increased by5.32%

Dependency changes

• + Added@scena/react-ruler@0.18.0(transitive)

• - Removed@scena/react-ruler@0.17.1(transitive)

• Updated@scena/react-ruler@~0.18.0