@adrienhobbs/candlekit 0.2.2 → 0.2.3

package/dist/index.js

@@ -346,6 +346,12 @@ function ChartComponent({
         vertLines: { color: "#1e293b" },
         horzLines: { color: "#1e293b" }
       },
+      // Render axis ticks + crosshair in the viewer's LOCAL timezone (lightweight-
+      // charts otherwise renders numeric times as UTC, which mismatches any
+      // local-time table/labels alongside the chart).
+      localization: {
+        timeFormatter: localCrosshairTimeFormatter
+      },
       width: chartContainerRef.current.clientWidth,
       // Auto-fill the container's height unless an explicit `height` is given.
       // Fall back to 600 only when the container hasn't been laid out yet (a
@@ -354,7 +360,8 @@ function ChartComponent({
       timeScale: {
         timeVisible: true,
         secondsVisible: true,
-        borderColor: "#334155"
+        borderColor: "#334155",
+        tickMarkFormatter: localTickMarkFormatter
       },
       rightPriceScale: {
         borderColor: "#334155"
@@ -1007,6 +1014,31 @@ function getLineStyle(style) {
       return LineStyle.Solid;
   }
 }
+var pad2 = (n) => String(n).padStart(2, "0");
+function localTickMarkFormatter(time, tickMarkType) {
+  const d = new Date(time * 1e3);
+  switch (tickMarkType) {
+    case 0:
+      return String(d.getFullYear());
+    case 1:
+      return d.toLocaleString(void 0, { month: "short" });
+    case 2:
+      return d.toLocaleString(void 0, { month: "short", day: "numeric" });
+    case 4:
+      return `${pad2(d.getHours())}:${pad2(d.getMinutes())}:${pad2(d.getSeconds())}`;
+    default:
+      return `${pad2(d.getHours())}:${pad2(d.getMinutes())}`;
+  }
+}
+function localCrosshairTimeFormatter(time) {
+  return new Date(time * 1e3).toLocaleString(void 0, {
+    month: "short",
+    day: "2-digit",
+    hour: "2-digit",
+    minute: "2-digit",
+    hour12: false
+  });
+}
 var IndicatorCategory = /* @__PURE__ */ ((IndicatorCategory2) => {
   IndicatorCategory2["TREND"] = "Trend";
   IndicatorCategory2["MOMENTUM"] = "Momentum";