@gunkin/uiify 0.0.24-alpha → 0.0.26-alpha

package/dist/components/candle-chart/CandleChart.js

@@ -1,6 +1,25 @@
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { composeEventHandlers } from "@gunkin/uiify/core/compose-event-handlers";
 import { useRenderElement } from "@gunkin/uiify/core/render";
 import { formatLabel } from "@gunkin/uiify/core/format-label";
+import { mergeRepeatedSlotProps } from "../../core/slot-props.js";
+import { assignRef } from "../../hooks/utils/assign-ref.js";
+function getIndexedPartProps(props, index) {
+  const { byItemIndex, ...common } = props ?? {};
+  return mergeRepeatedSlotProps(common, byItemIndex?.[index]);
+}
+function withGeneratedStyle(props, generatedStyle) {
+  return { ...props, style: { ...generatedStyle, ...props.style } };
+}
+function forwardCandleRef(ref) {
+  return (element) => {
+    const cleanup = assignRef(ref, element);
+    if (typeof cleanup === "function") return cleanup;
+    if (ref && typeof ref !== "function" && element !== null) {
+      return () => assignRef(ref, null);
+    }
+  };
+}
 const DEFAULT_CANDLE_CHART_LABELS = {
   chart: "Candlestick chart",
   candle: "Candle {time}",
@@ -139,9 +158,13 @@ function CandleChartCandle({
   cursorY,
   onCandleClick,
   onCandlePointerLeave,
-  onCandlePointerMove
+  onCandlePointerMove,
+  slotProps
 }) {
   const geometry = geometryFor(candle, x, slot, min, max);
+  const candleSlotProps = getIndexedPartProps(slotProps?.candle, index);
+  const { ref: candleRef, ...candleProps } = candleSlotProps;
+  const candleHitSlotProps = getIndexedPartProps(slotProps?.candleHit, index);
   const handleKeyDown = (event) => {
     if (event.key !== "Enter" && event.key !== " ") return;
     event.preventDefault();
@@ -155,7 +178,12 @@ function CandleChartCandle({
       "data-direction": geometry.direction,
       "data-crosshair-active": interactive && isActive ? "" : void 0,
       "data-time": String(candle.time),
-      style: candleStyle(geometry, isActive ? cursorY : void 0),
+      ...candleProps,
+      ...candleRef ? { ref: forwardCandleRef(candleRef) } : {},
+      style: {
+        ...candleStyle(geometry, isActive ? cursorY : void 0),
+        ...candleSlotProps.style
+      },
       children: interactive ? /* @__PURE__ */ jsx(
         "button",
         {
@@ -163,10 +191,17 @@ function CandleChartCandle({
           type: "button",
           "aria-label": hitLabel,
           "aria-pressed": isSelected,
-          onClick: () => onCandleClick?.(index),
-          onKeyDown: handleKeyDown,
-          onPointerLeave: onCandlePointerLeave,
-          onPointerMove: (event) => onCandlePointerMove?.({ index, offsetY: event.nativeEvent.offsetY })
+          ...candleHitSlotProps,
+          onClick: composeEventHandlers(candleHitSlotProps.onClick, () => onCandleClick?.(index)),
+          onKeyDown: composeEventHandlers(candleHitSlotProps.onKeyDown, handleKeyDown),
+          onPointerLeave: composeEventHandlers(
+            candleHitSlotProps.onPointerLeave,
+            () => onCandlePointerLeave?.()
+          ),
+          onPointerMove: composeEventHandlers(
+            candleHitSlotProps.onPointerMove,
+            (event) => onCandlePointerMove?.({ index, offsetY: event.nativeEvent.offsetY })
+          )
         }
       ) : null
     }
@@ -180,7 +215,6 @@ function CandleChart(props) {
     data,
     xAxis,
     yAxis,
-    "aria-label": ariaLabel,
     labels,
     activeCandleIndex,
     cursorY,
@@ -190,6 +224,7 @@ function CandleChart(props) {
     onCandlePointerLeave,
     onCandlePointerMove,
     selectedCandleIndex,
+    slotProps,
     candleLayer,
     announceReadout = true,
     slotCount = data.length,
@@ -198,87 +233,100 @@ function CandleChart(props) {
   } = props;
   const accessibleLabels = { ...DEFAULT_CANDLE_CHART_LABELS, ...labels };
   const { min, max } = getPriceBounds(data);
-  const label = ariaLabel ?? accessibleLabels.chart;
+  const label = consumerProps["aria-label"] ?? accessibleLabels.chart;
   const monthLabels = axisLabelsFor(xAxis, monthLabelsFor(data, locale));
   const priceLabels = axisLabelsFor(yAxis, priceLabelsFor(min, max, locale));
   const readoutIndex = activeCandleIndex ?? selectedCandleIndex ?? (data.length > 0 ? data.length - 1 : void 0);
   const readoutCandle = readoutIndex === void 0 ? void 0 : data[readoutIndex];
   const crosshairCandle = activeCandleIndex === void 0 ? void 0 : data[activeCandleIndex];
-  const candles = candleLayer ?? /* @__PURE__ */ jsx("ol", { "data-part": "candles", "aria-label": `${label} ${accessibleLabels.candles}`, children: data.map((candle, index) => /* @__PURE__ */ jsx(
-    CandleChartCandle,
+  const candles = candleLayer ?? /* @__PURE__ */ jsx(
+    "ol",
     {
-      as: "li",
-      candle,
-      hitLabel: formatLabel(accessibleLabels.candle, { time: String(candle.time) }, locale),
-      index,
-      x: index / data.length * 100,
-      slot: 100 / data.length,
-      min,
-      max,
-      interactive,
-      isActive: activeCandleIndex === index,
-      isSelected: selectedCandleIndex === index,
-      cursorY,
-      onCandleClick,
-      onCandlePointerLeave,
-      onCandlePointerMove
-    },
-    `${candle.time}-${index}`
-  )) });
+      "data-part": "candles",
+      "aria-label": `${label} ${accessibleLabels.candles}`,
+      ...slotProps?.candles,
+      children: data.map((candle, index) => /* @__PURE__ */ jsx(
+        CandleChartCandle,
+        {
+          as: "li",
+          candle,
+          hitLabel: formatLabel(accessibleLabels.candle, { time: String(candle.time) }, locale),
+          index,
+          x: index / data.length * 100,
+          slot: 100 / data.length,
+          min,
+          max,
+          interactive,
+          isActive: activeCandleIndex === index,
+          isSelected: selectedCandleIndex === index,
+          cursorY,
+          onCandleClick,
+          onCandlePointerLeave,
+          onCandlePointerMove,
+          slotProps
+        },
+        `${candle.time}-${index}`
+      ))
+    }
+  );
   return useRenderElement({
     as,
     defaultTag: "figure",
     props: {
-      ...consumerProps,
       "aria-label": label,
       "data-uiify-candle-chart": "",
       "data-interactive": interactive ? "" : void 0,
+      ...consumerProps,
       children: /* @__PURE__ */ jsxs(Fragment, { children: [
-        /* @__PURE__ */ jsx("figcaption", { children: label }),
-        interactive && readoutCandle ? /* @__PURE__ */ jsxs("div", { "data-part": "readout", "aria-live": announceReadout ? "polite" : "off", children: [
-          /* @__PURE__ */ jsx("span", { "data-part": "readout-time", children: String(readoutCandle.time) }),
-          /* @__PURE__ */ jsxs("span", { children: [
-            "O ",
-            readoutCandle.open
-          ] }),
-          /* @__PURE__ */ jsxs("span", { children: [
-            "H ",
-            readoutCandle.high
-          ] }),
-          /* @__PURE__ */ jsxs("span", { children: [
-            "L ",
-            readoutCandle.low
-          ] }),
-          /* @__PURE__ */ jsxs("span", { children: [
-            "C ",
-            readoutCandle.close
-          ] })
-        ] }) : null,
-        /* @__PURE__ */ jsxs("div", { "data-part": "plot", "aria-hidden": interactive ? void 0 : true, children: [
-          /* @__PURE__ */ jsx("div", { "data-part": "scroll-viewport", children: /* @__PURE__ */ jsxs("div", { "data-part": "canvas", children: [
-            /* @__PURE__ */ jsxs("div", { "data-part": "viewport", children: [
+        /* @__PURE__ */ jsx("figcaption", { ...slotProps?.caption, children: label }),
+        interactive && readoutCandle ? /* @__PURE__ */ jsxs(
+          "div",
+          {
+            "data-part": "readout",
+            "aria-live": announceReadout ? "polite" : "off",
+            ...slotProps?.readout,
+            children: [
+              /* @__PURE__ */ jsx("span", { "data-part": "readout-time", ...slotProps?.readoutTime, children: String(readoutCandle.time) }),
+              /* @__PURE__ */ jsx("span", { ...slotProps?.readoutOpen, children: `O ${readoutCandle.open}` }),
+              /* @__PURE__ */ jsx("span", { ...slotProps?.readoutHigh, children: `H ${readoutCandle.high}` }),
+              /* @__PURE__ */ jsx("span", { ...slotProps?.readoutLow, children: `L ${readoutCandle.low}` }),
+              /* @__PURE__ */ jsx("span", { ...slotProps?.readoutClose, children: `C ${readoutCandle.close}` })
+            ]
+          }
+        ) : null,
+        /* @__PURE__ */ jsxs("div", { "data-part": "plot", "aria-hidden": interactive ? void 0 : true, ...slotProps?.plot, children: [
+          /* @__PURE__ */ jsx("div", { "data-part": "scroll-viewport", ...slotProps?.scrollViewport, children: /* @__PURE__ */ jsxs("div", { "data-part": "canvas", ...slotProps?.canvas, children: [
+            /* @__PURE__ */ jsxs("div", { "data-part": "viewport", ...slotProps?.viewport, children: [
               candles,
               interactive && crosshairCandle && activeCandleIndex !== void 0 ? /* @__PURE__ */ jsx(
                 "div",
                 {
                   "data-part": "crosshair",
                   "aria-hidden": "true",
-                  style: crosshairStyle(slotOffset + activeCandleIndex, slotCount, cursorY),
-                  children: /* @__PURE__ */ jsx("span", { "data-part": "crosshair-marker", children: "+" })
+                  ...slotProps?.crosshair,
+                  style: {
+                    ...crosshairStyle(slotOffset + activeCandleIndex, slotCount, cursorY),
+                    ...slotProps?.crosshair?.style
+                  },
+                  children: /* @__PURE__ */ jsx("span", { "data-part": "crosshair-marker", ...slotProps?.crosshairMarker, children: "+" })
                 }
               ) : null
             ] }),
-            /* @__PURE__ */ jsx("div", { "data-part": "time-viewport", children: /* @__PURE__ */ jsxs(
+            /* @__PURE__ */ jsx("div", { "data-part": "time-viewport", ...slotProps?.timeViewport, children: /* @__PURE__ */ jsxs(
               "ol",
               {
                 "data-part": "time-axis",
                 "data-axis": "time",
                 "aria-label": `${label} ${accessibleLabels.months}`,
+                ...slotProps?.timeAxis,
                 children: [
                   monthLabels.map((axisLabel, index) => /* @__PURE__ */ jsx(
                     "li",
                     {
-                      style: axisStyle("x", axisLabel.position),
+                      ...withGeneratedStyle(
+                        getIndexedPartProps(slotProps?.timeAxisLabel, index),
+                        axisStyle("x", axisLabel.position)
+                      ),
                       children: axisLabel.label
                     },
                     `${axisLabel.position}-${index}`
@@ -287,7 +335,11 @@ function CandleChart(props) {
                     "li",
                     {
                       "data-part": "crosshair-time",
-                      style: crosshairStyle(slotOffset + activeCandleIndex, slotCount, void 0),
+                      ...slotProps?.crosshairTime,
+                      style: {
+                        ...crosshairStyle(slotOffset + activeCandleIndex, slotCount, void 0),
+                        ...slotProps?.crosshairTime?.style
+                      },
                       children: String(crosshairCandle.time)
                     }
                   ) : null
@@ -301,36 +353,70 @@ function CandleChart(props) {
               "data-part": "price-axis",
               "data-axis": "price",
               "aria-label": `${label} ${accessibleLabels.prices}`,
+              ...slotProps?.priceAxis,
               children: [
                 priceLabels.map((axisLabel, index) => /* @__PURE__ */ jsx(
                   "li",
                   {
-                    style: axisStyle("y", axisLabel.position),
+                    ...withGeneratedStyle(
+                      getIndexedPartProps(slotProps?.priceAxisLabel, index),
+                      axisStyle("y", axisLabel.position)
+                    ),
                     children: axisLabel.label
                   },
                   `${axisLabel.position}-${index}`
                 )),
-                interactive && crosshairCandle && activeCandleIndex !== void 0 ? /* @__PURE__ */ jsx("li", { "data-part": "crosshair-price", style: cursorStyle(cursorY), children: crosshairCandle.close }) : null
+                interactive && crosshairCandle && activeCandleIndex !== void 0 ? /* @__PURE__ */ jsx(
+                  "li",
+                  {
+                    "data-part": "crosshair-price",
+                    ...slotProps?.crosshairPrice,
+                    style: { ...cursorStyle(cursorY), ...slotProps?.crosshairPrice?.style },
+                    children: crosshairCandle.close
+                  }
+                ) : null
               ]
             }
           )
         ] }),
-        /* @__PURE__ */ jsxs("table", { "data-part": "data", "aria-label": `${label} ${accessibleLabels.data}`, children: [
-          /* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsxs("tr", { children: [
-            /* @__PURE__ */ jsx("th", { scope: "col", children: accessibleLabels.time }),
-            /* @__PURE__ */ jsx("th", { scope: "col", children: accessibleLabels.open }),
-            /* @__PURE__ */ jsx("th", { scope: "col", children: accessibleLabels.high }),
-            /* @__PURE__ */ jsx("th", { scope: "col", children: accessibleLabels.low }),
-            /* @__PURE__ */ jsx("th", { scope: "col", children: accessibleLabels.close })
-          ] }) }),
-          /* @__PURE__ */ jsx("tbody", { children: data.map((candle, index) => /* @__PURE__ */ jsxs("tr", { children: [
-            /* @__PURE__ */ jsx("th", { scope: "row", children: String(candle.time) }),
-            /* @__PURE__ */ jsx("td", { children: candle.open }),
-            /* @__PURE__ */ jsx("td", { children: candle.high }),
-            /* @__PURE__ */ jsx("td", { children: candle.low }),
-            /* @__PURE__ */ jsx("td", { children: candle.close })
-          ] }, `${candle.time}-${index}`)) })
-        ] })
+        /* @__PURE__ */ jsxs(
+          "table",
+          {
+            "data-part": "data",
+            "aria-label": `${label} ${accessibleLabels.data}`,
+            ...slotProps?.dataTable,
+            children: [
+              /* @__PURE__ */ jsx("thead", { ...slotProps?.dataTableHead, children: /* @__PURE__ */ jsxs("tr", { ...slotProps?.dataTableHeaderRow, children: [
+                /* @__PURE__ */ jsx("th", { scope: "col", ...slotProps?.dataTableTimeHeader, children: accessibleLabels.time }),
+                /* @__PURE__ */ jsx("th", { scope: "col", ...slotProps?.dataTableOpenHeader, children: accessibleLabels.open }),
+                /* @__PURE__ */ jsx("th", { scope: "col", ...slotProps?.dataTableHighHeader, children: accessibleLabels.high }),
+                /* @__PURE__ */ jsx("th", { scope: "col", ...slotProps?.dataTableLowHeader, children: accessibleLabels.low }),
+                /* @__PURE__ */ jsx("th", { scope: "col", ...slotProps?.dataTableCloseHeader, children: accessibleLabels.close })
+              ] }) }),
+              /* @__PURE__ */ jsx("tbody", { ...slotProps?.dataTableBody, children: data.map((candle, index) => /* @__PURE__ */ jsxs(
+                "tr",
+                {
+                  ...getIndexedPartProps(slotProps?.dataTableRow, slotOffset + index),
+                  children: [
+                    /* @__PURE__ */ jsx(
+                      "th",
+                      {
+                        scope: "row",
+                        ...getIndexedPartProps(slotProps?.dataTableTimeCell, slotOffset + index),
+                        children: String(candle.time)
+                      }
+                    ),
+                    /* @__PURE__ */ jsx("td", { ...getIndexedPartProps(slotProps?.dataTableOpenCell, slotOffset + index), children: candle.open }),
+                    /* @__PURE__ */ jsx("td", { ...getIndexedPartProps(slotProps?.dataTableHighCell, slotOffset + index), children: candle.high }),
+                    /* @__PURE__ */ jsx("td", { ...getIndexedPartProps(slotProps?.dataTableLowCell, slotOffset + index), children: candle.low }),
+                    /* @__PURE__ */ jsx("td", { ...getIndexedPartProps(slotProps?.dataTableCloseCell, slotOffset + index), children: candle.close })
+                  ]
+                },
+                `${candle.time}-${index}`
+              )) })
+            ]
+          }
+        )
       ] })
     },
     render,

package/dist/components/candle-chart/CandleChart.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/candle-chart/CandleChart.tsx"],"sourcesContent":["import type {\n  CSSProperties,\n  ElementType,\n  KeyboardEvent,\n  PointerEvent,\n  ReactElement,\n  ReactNode,\n} from \"react\";\nimport { useRenderElement } from \"@gunkin/uiify/core/render\";\nimport { formatLabel } from \"@gunkin/uiify/core/format-label\";\nimport type {\n  CandleChartAxisLabel,\n  CandleChartCandleProps,\n  CandleChartData,\n  CandleChartProps,\n  CandleChartViewProps,\n} from \"./types.js\";\n\nconst DEFAULT_CANDLE_CHART_LABELS = {\n  chart: \"Candlestick chart\",\n  candle: \"Candle {time}\",\n  candles: \"candles\",\n  months: \"months\",\n  prices: \"prices\",\n  data: \"data\",\n  time: \"Time\",\n  open: \"Open\",\n  high: \"High\",\n  low: \"Low\",\n  close: \"Close\",\n} as const;\n\ninterface CandleStyle extends CSSProperties {\n  \"--candle-body-height\": string;\n  \"--candle-body-top\": string;\n  \"--candle-slot\": string;\n  \"--candle-wick-height\": string;\n  \"--candle-wick-top\": string;\n  \"--candle-x\": string;\n  \"--candle-cursor-y\"?: string;\n}\n\ninterface CrosshairStyle extends CSSProperties {\n  \"--candle-crosshair-x\": string;\n  \"--candle-cursor-y\"?: string;\n}\n\ninterface CursorStyle extends CSSProperties {\n  \"--candle-cursor-y\"?: string;\n}\n\ninterface AxisStyle extends CSSProperties {\n  \"--candle-axis-x\"?: string;\n  \"--candle-axis-y\"?: string;\n}\n\ntype CandleDirection = \"down\" | \"flat\" | \"up\";\n\ninterface CandleGeometry {\n  readonly bodyHeight: string;\n  readonly bodyTop: string;\n  readonly direction: CandleDirection;\n  readonly slot: string;\n  readonly wickHeight: string;\n  readonly wickTop: string;\n  readonly x: string;\n}\n\nfunction percent(value: number): string {\n  const rounded = Math.round(value * 10000) / 10000;\n  return `${rounded}%`;\n}\n\nfunction valueToPercent(value: number, min: number, range: number): number {\n  if (range === 0) return 50;\n  return Math.min(100, Math.max(0, ((min + range - value) / range) * 100));\n}\n\nfunction directionFor(candle: CandleChartData): CandleDirection {\n  if (candle.close > candle.open) return \"up\";\n  if (candle.close < candle.open) return \"down\";\n  return \"flat\";\n}\n\nexport function getPriceBounds(data: readonly CandleChartData[]): { max: number; min: number } {\n  let min = Number.POSITIVE_INFINITY;\n  let max = Number.NEGATIVE_INFINITY;\n\n  for (const candle of data) {\n    min = Math.min(min, candle.low);\n    max = Math.max(max, candle.high);\n  }\n\n  if (data.length === 0) return { max: 1, min: 0 };\n  return { max, min };\n}\n\ninterface AxisLabel {\n  readonly label: ReactNode;\n  readonly position: number;\n}\n\nfunction monthKey(time: string | number): string {\n  const date = new Date(time);\n  if (Number.isNaN(date.getTime())) return String(time);\n  return `${date.getUTCFullYear()}-${date.getUTCMonth()}`;\n}\n\nfunction monthLabel(time: string | number, locale: string): string {\n  const date = new Date(time);\n  if (Number.isNaN(date.getTime())) return String(time);\n  return new Intl.DateTimeFormat(locale, {\n    month: \"short\",\n    timeZone: \"UTC\",\n    year: \"2-digit\",\n  }).format(date);\n}\n\nfunction monthLabelsFor(data: readonly CandleChartData[], locale: string): AxisLabel[] {\n  const labels: AxisLabel[] = [];\n  const seen = new Set<string>();\n\n  data.forEach((candle, index) => {\n    const key = monthKey(candle.time);\n    if (seen.has(key)) return;\n    seen.add(key);\n    labels.push({\n      label: monthLabel(candle.time, locale),\n      position: (index / Math.max(data.length, 1)) * 100,\n    });\n  });\n\n  return labels;\n}\n\nfunction priceLabelsFor(min: number, max: number, locale: string): AxisLabel[] {\n  const tickCount = 6;\n  const range = max - min;\n\n  return Array.from({ length: tickCount }, (_, index) => {\n    const ratio = index / (tickCount - 1);\n    const value = max - range * ratio;\n    return {\n      label: new Intl.NumberFormat(locale, { maximumFractionDigits: 2 }).format(value),\n      position: ratio * 100,\n    };\n  });\n}\n\nfunction geometryFor(\n  candle: CandleChartData,\n  x: number,\n  slot: number,\n  min: number,\n  max: number,\n): CandleGeometry {\n  const range = max - min;\n  const open = valueToPercent(candle.open, min, range);\n  const close = valueToPercent(candle.close, min, range);\n  const high = valueToPercent(candle.high, min, range);\n  const low = valueToPercent(candle.low, min, range);\n\n  return {\n    bodyHeight: percent(Math.abs(close - open)),\n    bodyTop: percent(Math.min(open, close)),\n    direction: directionFor(candle),\n    slot: percent(slot),\n    wickHeight: percent(Math.max(0, low - high)),\n    wickTop: percent(high),\n    x: percent(x),\n  };\n}\n\nfunction candleStyle(geometry: CandleGeometry, cursorY: number | undefined): CandleStyle {\n  return {\n    \"--candle-body-height\": geometry.bodyHeight,\n    \"--candle-body-top\": geometry.bodyTop,\n    \"--candle-slot\": geometry.slot,\n    \"--candle-wick-height\": geometry.wickHeight,\n    \"--candle-wick-top\": geometry.wickTop,\n    \"--candle-x\": geometry.x,\n    ...(cursorY === undefined ? {} : { \"--candle-cursor-y\": `${Math.max(0, cursorY)}px` }),\n  };\n}\n\nfunction crosshairStyle(index: number, count: number, cursorY: number | undefined): CrosshairStyle {\n  return {\n    \"--candle-crosshair-x\": percent(((index + 0.5) / Math.max(count, 1)) * 100),\n    ...(cursorY === undefined ? {} : { \"--candle-cursor-y\": `${Math.max(0, cursorY)}px` }),\n  };\n}\n\nfunction cursorStyle(cursorY: number | undefined): CursorStyle {\n  return cursorY === undefined ? {} : { \"--candle-cursor-y\": `${Math.max(0, cursorY)}px` };\n}\n\nfunction clampAxisPosition(position: number): number {\n  return Math.min(100, Math.max(0, position));\n}\n\nfunction axisStyle(axis: \"x\" | \"y\", position: number): AxisStyle {\n  const value = percent(clampAxisPosition(position));\n  if (axis === \"x\") return { \"--candle-axis-x\": value };\n  return { \"--candle-axis-y\": value };\n}\n\nfunction axisLabelsFor(\n  overrides: readonly CandleChartAxisLabel[] | undefined,\n  fallback: readonly AxisLabel[],\n): readonly AxisLabel[] {\n  return overrides ?? fallback;\n}\n\n/** One candle glyph with its optional hit target; shared by the static list and virtual rows. */\nexport function CandleChartCandle({\n  as: Tag,\n  candle,\n  hitLabel,\n  index,\n  x,\n  slot,\n  min,\n  max,\n  interactive,\n  isActive,\n  isSelected,\n  cursorY,\n  onCandleClick,\n  onCandlePointerLeave,\n  onCandlePointerMove,\n}: CandleChartCandleProps): ReactElement {\n  const geometry = geometryFor(candle, x, slot, min, max);\n  const handleKeyDown = (event: KeyboardEvent<HTMLButtonElement>) => {\n    if (event.key !== \"Enter\" && event.key !== \" \") return;\n    event.preventDefault();\n    onCandleClick?.(index);\n  };\n\n  return (\n    <Tag\n      aria-hidden={interactive ? undefined : true}\n      data-part=\"candle\"\n      data-direction={geometry.direction}\n      data-crosshair-active={interactive && isActive ? \"\" : undefined}\n      data-time={String(candle.time)}\n      style={candleStyle(geometry, isActive ? cursorY : undefined)}\n    >\n      {interactive ? (\n        <button\n          data-part=\"candle-hit\"\n          type=\"button\"\n          aria-label={hitLabel}\n          aria-pressed={isSelected}\n          onClick={() => onCandleClick?.(index)}\n          onKeyDown={handleKeyDown}\n          onPointerLeave={onCandlePointerLeave}\n          onPointerMove={(event: PointerEvent<HTMLButtonElement>) =>\n            onCandlePointerMove?.({ index, offsetY: event.nativeEvent.offsetY })\n          }\n        />\n      ) : null}\n    </Tag>\n  );\n}\nCandleChartCandle.displayName = \"CandleChartCandle\";\n\nexport function CandleChart<TAs extends ElementType = \"figure\">(\n  props: CandleChartProps<TAs>,\n): ReactElement | null {\n  const {\n    as,\n    render,\n    data,\n    xAxis,\n    yAxis,\n    \"aria-label\": ariaLabel,\n    labels,\n    activeCandleIndex,\n    cursorY,\n    interactive = false,\n    locale = \"en-US\",\n    onCandleClick,\n    onCandlePointerLeave,\n    onCandlePointerMove,\n    selectedCandleIndex,\n    candleLayer,\n    announceReadout = true,\n    slotCount = data.length,\n    slotOffset = 0,\n    ...consumerProps\n  } = props as CandleChartProps<\"figure\"> & CandleChartViewProps;\n  const accessibleLabels = { ...DEFAULT_CANDLE_CHART_LABELS, ...labels };\n  const { min, max } = getPriceBounds(data);\n  const label = ariaLabel ?? accessibleLabels.chart;\n  const monthLabels = axisLabelsFor(xAxis, monthLabelsFor(data, locale));\n  const priceLabels = axisLabelsFor(yAxis, priceLabelsFor(min, max, locale));\n  const readoutIndex =\n    activeCandleIndex ?? selectedCandleIndex ?? (data.length > 0 ? data.length - 1 : undefined);\n  const readoutCandle = readoutIndex === undefined ? undefined : data[readoutIndex];\n  const crosshairCandle = activeCandleIndex === undefined ? undefined : data[activeCandleIndex];\n  const candles = candleLayer ?? (\n    <ol data-part=\"candles\" aria-label={`${label} ${accessibleLabels.candles}`}>\n      {data.map((candle, index) => (\n        <CandleChartCandle\n          key={`${candle.time}-${index}`}\n          as=\"li\"\n          candle={candle}\n          hitLabel={formatLabel(accessibleLabels.candle, { time: String(candle.time) }, locale)}\n          index={index}\n          x={(index / data.length) * 100}\n          slot={100 / data.length}\n          min={min}\n          max={max}\n          interactive={interactive}\n          isActive={activeCandleIndex === index}\n          isSelected={selectedCandleIndex === index}\n          cursorY={cursorY}\n          onCandleClick={onCandleClick}\n          onCandlePointerLeave={onCandlePointerLeave}\n          onCandlePointerMove={onCandlePointerMove}\n        />\n      ))}\n    </ol>\n  );\n\n  return useRenderElement({\n    as,\n    defaultTag: \"figure\",\n    props: {\n      ...consumerProps,\n      \"aria-label\": label,\n      \"data-uiify-candle-chart\": \"\",\n      \"data-interactive\": interactive ? \"\" : undefined,\n      children: (\n        <>\n          <figcaption>{label}</figcaption>\n          {interactive && readoutCandle ? (\n            <div data-part=\"readout\" aria-live={announceReadout ? \"polite\" : \"off\"}>\n              <span data-part=\"readout-time\">{String(readoutCandle.time)}</span>\n              <span>O {readoutCandle.open}</span>\n              <span>H {readoutCandle.high}</span>\n              <span>L {readoutCandle.low}</span>\n              <span>C {readoutCandle.close}</span>\n            </div>\n          ) : null}\n          <div data-part=\"plot\" aria-hidden={interactive ? undefined : true}>\n            <div data-part=\"scroll-viewport\">\n              <div data-part=\"canvas\">\n                <div data-part=\"viewport\">\n                  {candles}\n                  {interactive && crosshairCandle && activeCandleIndex !== undefined ? (\n                    <div\n                      data-part=\"crosshair\"\n                      aria-hidden=\"true\"\n                      style={crosshairStyle(slotOffset + activeCandleIndex, slotCount, cursorY)}\n                    >\n                      <span data-part=\"crosshair-marker\">+</span>\n                    </div>\n                  ) : null}\n                </div>\n                <div data-part=\"time-viewport\">\n                  <ol\n                    data-part=\"time-axis\"\n                    data-axis=\"time\"\n                    aria-label={`${label} ${accessibleLabels.months}`}\n                  >\n                    {monthLabels.map((axisLabel, index) => (\n                      <li\n                        key={`${axisLabel.position}-${index}`}\n                        style={axisStyle(\"x\", axisLabel.position)}\n                      >\n                        {axisLabel.label}\n                      </li>\n                    ))}\n                    {interactive && crosshairCandle && activeCandleIndex !== undefined ? (\n                      <li\n                        data-part=\"crosshair-time\"\n                        style={crosshairStyle(slotOffset + activeCandleIndex, slotCount, undefined)}\n                      >\n                        {String(crosshairCandle.time)}\n                      </li>\n                    ) : null}\n                  </ol>\n                </div>\n              </div>\n            </div>\n            <ol\n              data-part=\"price-axis\"\n              data-axis=\"price\"\n              aria-label={`${label} ${accessibleLabels.prices}`}\n            >\n              {priceLabels.map((axisLabel, index) => (\n                <li\n                  key={`${axisLabel.position}-${index}`}\n                  style={axisStyle(\"y\", axisLabel.position)}\n                >\n                  {axisLabel.label}\n                </li>\n              ))}\n              {interactive && crosshairCandle && activeCandleIndex !== undefined ? (\n                <li data-part=\"crosshair-price\" style={cursorStyle(cursorY)}>\n                  {crosshairCandle.close}\n                </li>\n              ) : null}\n            </ol>\n          </div>\n          <table data-part=\"data\" aria-label={`${label} ${accessibleLabels.data}`}>\n            <thead>\n              <tr>\n                <th scope=\"col\">{accessibleLabels.time}</th>\n                <th scope=\"col\">{accessibleLabels.open}</th>\n                <th scope=\"col\">{accessibleLabels.high}</th>\n                <th scope=\"col\">{accessibleLabels.low}</th>\n                <th scope=\"col\">{accessibleLabels.close}</th>\n              </tr>\n            </thead>\n            <tbody>\n              {data.map((candle, index) => (\n                <tr key={`${candle.time}-${index}`}>\n                  <th scope=\"row\">{String(candle.time)}</th>\n                  <td>{candle.open}</td>\n                  <td>{candle.high}</td>\n                  <td>{candle.low}</td>\n                  <td>{candle.close}</td>\n                </tr>\n              ))}\n            </tbody>\n          </table>\n        </>\n      ),\n    },\n    render,\n    state: {},\n  });\n}\nCandleChart.displayName = \"CandleChart\";\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../../src/components/candle-chart/CandleChart.tsx"],"sourcesContent":["import type {\n  CSSProperties,\n  ElementType,\n  KeyboardEvent,\n  PointerEvent,\n  ReactElement,\n  ReactNode,\n  Ref,\n} from \"react\";\nimport { composeEventHandlers } from \"@gunkin/uiify/core/compose-event-handlers\";\nimport { useRenderElement } from \"@gunkin/uiify/core/render\";\nimport { formatLabel } from \"@gunkin/uiify/core/format-label\";\nimport { mergeRepeatedSlotProps } from \"../../core/slot-props.js\";\nimport { assignRef } from \"../../hooks/utils/assign-ref.js\";\nimport type {\n  CandleChartAxisLabel,\n  CandleChartCandleProps,\n  CandleChartData,\n  CandleChartProps,\n  CandleChartViewProps,\n} from \"./types.js\";\n\nfunction getIndexedPartProps<T extends object>(\n  props: (T & { readonly byItemIndex?: Readonly<Record<number, T>> }) | undefined,\n  index: number,\n): T {\n  const { byItemIndex, ...common } = props ?? {};\n  return mergeRepeatedSlotProps(common as T, byItemIndex?.[index]);\n}\n\nfunction withGeneratedStyle<T extends { readonly style?: object | undefined }>(\n  props: T,\n  generatedStyle: object,\n): T {\n  return { ...props, style: { ...generatedStyle, ...props.style } };\n}\n\nfunction forwardCandleRef(ref: Ref<HTMLElement> | undefined) {\n  return (element: HTMLLIElement | HTMLDivElement | null): void | (() => void) => {\n    const cleanup = assignRef(ref, element);\n    if (typeof cleanup === \"function\") return cleanup;\n    if (ref && typeof ref !== \"function\" && element !== null) {\n      return () => assignRef(ref, null);\n    }\n  };\n}\n\nconst DEFAULT_CANDLE_CHART_LABELS = {\n  chart: \"Candlestick chart\",\n  candle: \"Candle {time}\",\n  candles: \"candles\",\n  months: \"months\",\n  prices: \"prices\",\n  data: \"data\",\n  time: \"Time\",\n  open: \"Open\",\n  high: \"High\",\n  low: \"Low\",\n  close: \"Close\",\n} as const;\n\ninterface CandleStyle extends CSSProperties {\n  \"--candle-body-height\": string;\n  \"--candle-body-top\": string;\n  \"--candle-slot\": string;\n  \"--candle-wick-height\": string;\n  \"--candle-wick-top\": string;\n  \"--candle-x\": string;\n  \"--candle-cursor-y\"?: string;\n}\n\ninterface CrosshairStyle extends CSSProperties {\n  \"--candle-crosshair-x\": string;\n  \"--candle-cursor-y\"?: string;\n}\n\ninterface CursorStyle extends CSSProperties {\n  \"--candle-cursor-y\"?: string;\n}\n\ninterface AxisStyle extends CSSProperties {\n  \"--candle-axis-x\"?: string;\n  \"--candle-axis-y\"?: string;\n}\n\ntype CandleDirection = \"down\" | \"flat\" | \"up\";\n\ninterface CandleGeometry {\n  readonly bodyHeight: string;\n  readonly bodyTop: string;\n  readonly direction: CandleDirection;\n  readonly slot: string;\n  readonly wickHeight: string;\n  readonly wickTop: string;\n  readonly x: string;\n}\n\nfunction percent(value: number): string {\n  const rounded = Math.round(value * 10000) / 10000;\n  return `${rounded}%`;\n}\n\nfunction valueToPercent(value: number, min: number, range: number): number {\n  if (range === 0) return 50;\n  return Math.min(100, Math.max(0, ((min + range - value) / range) * 100));\n}\n\nfunction directionFor(candle: CandleChartData): CandleDirection {\n  if (candle.close > candle.open) return \"up\";\n  if (candle.close < candle.open) return \"down\";\n  return \"flat\";\n}\n\nexport function getPriceBounds(data: readonly CandleChartData[]): { max: number; min: number } {\n  let min = Number.POSITIVE_INFINITY;\n  let max = Number.NEGATIVE_INFINITY;\n\n  for (const candle of data) {\n    min = Math.min(min, candle.low);\n    max = Math.max(max, candle.high);\n  }\n\n  if (data.length === 0) return { max: 1, min: 0 };\n  return { max, min };\n}\n\ninterface AxisLabel {\n  readonly label: ReactNode;\n  readonly position: number;\n}\n\nfunction monthKey(time: string | number): string {\n  const date = new Date(time);\n  if (Number.isNaN(date.getTime())) return String(time);\n  return `${date.getUTCFullYear()}-${date.getUTCMonth()}`;\n}\n\nfunction monthLabel(time: string | number, locale: string): string {\n  const date = new Date(time);\n  if (Number.isNaN(date.getTime())) return String(time);\n  return new Intl.DateTimeFormat(locale, {\n    month: \"short\",\n    timeZone: \"UTC\",\n    year: \"2-digit\",\n  }).format(date);\n}\n\nfunction monthLabelsFor(data: readonly CandleChartData[], locale: string): AxisLabel[] {\n  const labels: AxisLabel[] = [];\n  const seen = new Set<string>();\n\n  data.forEach((candle, index) => {\n    const key = monthKey(candle.time);\n    if (seen.has(key)) return;\n    seen.add(key);\n    labels.push({\n      label: monthLabel(candle.time, locale),\n      position: (index / Math.max(data.length, 1)) * 100,\n    });\n  });\n\n  return labels;\n}\n\nfunction priceLabelsFor(min: number, max: number, locale: string): AxisLabel[] {\n  const tickCount = 6;\n  const range = max - min;\n\n  return Array.from({ length: tickCount }, (_, index) => {\n    const ratio = index / (tickCount - 1);\n    const value = max - range * ratio;\n    return {\n      label: new Intl.NumberFormat(locale, { maximumFractionDigits: 2 }).format(value),\n      position: ratio * 100,\n    };\n  });\n}\n\nfunction geometryFor(\n  candle: CandleChartData,\n  x: number,\n  slot: number,\n  min: number,\n  max: number,\n): CandleGeometry {\n  const range = max - min;\n  const open = valueToPercent(candle.open, min, range);\n  const close = valueToPercent(candle.close, min, range);\n  const high = valueToPercent(candle.high, min, range);\n  const low = valueToPercent(candle.low, min, range);\n\n  return {\n    bodyHeight: percent(Math.abs(close - open)),\n    bodyTop: percent(Math.min(open, close)),\n    direction: directionFor(candle),\n    slot: percent(slot),\n    wickHeight: percent(Math.max(0, low - high)),\n    wickTop: percent(high),\n    x: percent(x),\n  };\n}\n\nfunction candleStyle(geometry: CandleGeometry, cursorY: number | undefined): CandleStyle {\n  return {\n    \"--candle-body-height\": geometry.bodyHeight,\n    \"--candle-body-top\": geometry.bodyTop,\n    \"--candle-slot\": geometry.slot,\n    \"--candle-wick-height\": geometry.wickHeight,\n    \"--candle-wick-top\": geometry.wickTop,\n    \"--candle-x\": geometry.x,\n    ...(cursorY === undefined ? {} : { \"--candle-cursor-y\": `${Math.max(0, cursorY)}px` }),\n  };\n}\n\nfunction crosshairStyle(index: number, count: number, cursorY: number | undefined): CrosshairStyle {\n  return {\n    \"--candle-crosshair-x\": percent(((index + 0.5) / Math.max(count, 1)) * 100),\n    ...(cursorY === undefined ? {} : { \"--candle-cursor-y\": `${Math.max(0, cursorY)}px` }),\n  };\n}\n\nfunction cursorStyle(cursorY: number | undefined): CursorStyle {\n  return cursorY === undefined ? {} : { \"--candle-cursor-y\": `${Math.max(0, cursorY)}px` };\n}\n\nfunction clampAxisPosition(position: number): number {\n  return Math.min(100, Math.max(0, position));\n}\n\nfunction axisStyle(axis: \"x\" | \"y\", position: number): AxisStyle {\n  const value = percent(clampAxisPosition(position));\n  if (axis === \"x\") return { \"--candle-axis-x\": value };\n  return { \"--candle-axis-y\": value };\n}\n\nfunction axisLabelsFor(\n  overrides: readonly CandleChartAxisLabel[] | undefined,\n  fallback: readonly AxisLabel[],\n): readonly AxisLabel[] {\n  return overrides ?? fallback;\n}\n\n/** One candle glyph with its optional hit target; shared by the static list and virtual rows. */\nexport function CandleChartCandle({\n  as: Tag,\n  candle,\n  hitLabel,\n  index,\n  x,\n  slot,\n  min,\n  max,\n  interactive,\n  isActive,\n  isSelected,\n  cursorY,\n  onCandleClick,\n  onCandlePointerLeave,\n  onCandlePointerMove,\n  slotProps,\n}: CandleChartCandleProps): ReactElement {\n  const geometry = geometryFor(candle, x, slot, min, max);\n  const candleSlotProps = getIndexedPartProps(slotProps?.candle, index);\n  const { ref: candleRef, ...candleProps } = candleSlotProps;\n  const candleHitSlotProps = getIndexedPartProps(slotProps?.candleHit, index);\n  const handleKeyDown = (event: KeyboardEvent<HTMLButtonElement>) => {\n    if (event.key !== \"Enter\" && event.key !== \" \") return;\n    event.preventDefault();\n    onCandleClick?.(index);\n  };\n\n  return (\n    <Tag\n      aria-hidden={interactive ? undefined : true}\n      data-part=\"candle\"\n      data-direction={geometry.direction}\n      data-crosshair-active={interactive && isActive ? \"\" : undefined}\n      data-time={String(candle.time)}\n      {...candleProps}\n      {...(candleRef ? { ref: forwardCandleRef(candleRef) } : {})}\n      style={{\n        ...candleStyle(geometry, isActive ? cursorY : undefined),\n        ...candleSlotProps.style,\n      }}\n    >\n      {interactive ? (\n        <button\n          data-part=\"candle-hit\"\n          type=\"button\"\n          aria-label={hitLabel}\n          aria-pressed={isSelected}\n          {...candleHitSlotProps}\n          onClick={composeEventHandlers(candleHitSlotProps.onClick, () => onCandleClick?.(index))}\n          onKeyDown={composeEventHandlers(candleHitSlotProps.onKeyDown, handleKeyDown)}\n          onPointerLeave={composeEventHandlers(candleHitSlotProps.onPointerLeave, () =>\n            onCandlePointerLeave?.(),\n          )}\n          onPointerMove={composeEventHandlers(\n            candleHitSlotProps.onPointerMove,\n            (event: PointerEvent<HTMLButtonElement>) =>\n              onCandlePointerMove?.({ index, offsetY: event.nativeEvent.offsetY }),\n          )}\n        />\n      ) : null}\n    </Tag>\n  );\n}\nCandleChartCandle.displayName = \"CandleChartCandle\";\n\nexport function CandleChart<TAs extends ElementType = \"figure\">(\n  props: CandleChartProps<TAs>,\n): ReactElement | null {\n  const {\n    as,\n    render,\n    data,\n    xAxis,\n    yAxis,\n    labels,\n    activeCandleIndex,\n    cursorY,\n    interactive = false,\n    locale = \"en-US\",\n    onCandleClick,\n    onCandlePointerLeave,\n    onCandlePointerMove,\n    selectedCandleIndex,\n    slotProps,\n    candleLayer,\n    announceReadout = true,\n    slotCount = data.length,\n    slotOffset = 0,\n    ...consumerProps\n  } = props as CandleChartProps<\"figure\"> & CandleChartViewProps;\n  const accessibleLabels = { ...DEFAULT_CANDLE_CHART_LABELS, ...labels };\n  const { min, max } = getPriceBounds(data);\n  const label = consumerProps[\"aria-label\"] ?? accessibleLabels.chart;\n  const monthLabels = axisLabelsFor(xAxis, monthLabelsFor(data, locale));\n  const priceLabels = axisLabelsFor(yAxis, priceLabelsFor(min, max, locale));\n  const readoutIndex =\n    activeCandleIndex ?? selectedCandleIndex ?? (data.length > 0 ? data.length - 1 : undefined);\n  const readoutCandle = readoutIndex === undefined ? undefined : data[readoutIndex];\n  const crosshairCandle = activeCandleIndex === undefined ? undefined : data[activeCandleIndex];\n  const candles = candleLayer ?? (\n    <ol\n      data-part=\"candles\"\n      aria-label={`${label} ${accessibleLabels.candles}`}\n      {...slotProps?.candles}\n    >\n      {data.map((candle, index) => (\n        <CandleChartCandle\n          key={`${candle.time}-${index}`}\n          as=\"li\"\n          candle={candle}\n          hitLabel={formatLabel(accessibleLabels.candle, { time: String(candle.time) }, locale)}\n          index={index}\n          x={(index / data.length) * 100}\n          slot={100 / data.length}\n          min={min}\n          max={max}\n          interactive={interactive}\n          isActive={activeCandleIndex === index}\n          isSelected={selectedCandleIndex === index}\n          cursorY={cursorY}\n          onCandleClick={onCandleClick}\n          onCandlePointerLeave={onCandlePointerLeave}\n          onCandlePointerMove={onCandlePointerMove}\n          slotProps={slotProps}\n        />\n      ))}\n    </ol>\n  );\n\n  return useRenderElement({\n    as,\n    defaultTag: \"figure\",\n    props: {\n      \"aria-label\": label,\n      \"data-uiify-candle-chart\": \"\",\n      \"data-interactive\": interactive ? \"\" : undefined,\n      ...consumerProps,\n      children: (\n        <>\n          <figcaption {...slotProps?.caption}>{label}</figcaption>\n          {interactive && readoutCandle ? (\n            <div\n              data-part=\"readout\"\n              aria-live={announceReadout ? \"polite\" : \"off\"}\n              {...slotProps?.readout}\n            >\n              <span data-part=\"readout-time\" {...slotProps?.readoutTime}>\n                {String(readoutCandle.time)}\n              </span>\n              <span {...slotProps?.readoutOpen}>{`O ${readoutCandle.open}`}</span>\n              <span {...slotProps?.readoutHigh}>{`H ${readoutCandle.high}`}</span>\n              <span {...slotProps?.readoutLow}>{`L ${readoutCandle.low}`}</span>\n              <span {...slotProps?.readoutClose}>{`C ${readoutCandle.close}`}</span>\n            </div>\n          ) : null}\n          <div data-part=\"plot\" aria-hidden={interactive ? undefined : true} {...slotProps?.plot}>\n            <div data-part=\"scroll-viewport\" {...slotProps?.scrollViewport}>\n              <div data-part=\"canvas\" {...slotProps?.canvas}>\n                <div data-part=\"viewport\" {...slotProps?.viewport}>\n                  {candles}\n                  {interactive && crosshairCandle && activeCandleIndex !== undefined ? (\n                    <div\n                      data-part=\"crosshair\"\n                      aria-hidden=\"true\"\n                      {...slotProps?.crosshair}\n                      style={{\n                        ...crosshairStyle(slotOffset + activeCandleIndex, slotCount, cursorY),\n                        ...slotProps?.crosshair?.style,\n                      }}\n                    >\n                      <span data-part=\"crosshair-marker\" {...slotProps?.crosshairMarker}>\n                        +\n                      </span>\n                    </div>\n                  ) : null}\n                </div>\n                <div data-part=\"time-viewport\" {...slotProps?.timeViewport}>\n                  <ol\n                    data-part=\"time-axis\"\n                    data-axis=\"time\"\n                    aria-label={`${label} ${accessibleLabels.months}`}\n                    {...slotProps?.timeAxis}\n                  >\n                    {monthLabels.map((axisLabel, index) => (\n                      <li\n                        key={`${axisLabel.position}-${index}`}\n                        {...withGeneratedStyle(\n                          getIndexedPartProps(slotProps?.timeAxisLabel, index),\n                          axisStyle(\"x\", axisLabel.position),\n                        )}\n                      >\n                        {axisLabel.label}\n                      </li>\n                    ))}\n                    {interactive && crosshairCandle && activeCandleIndex !== undefined ? (\n                      <li\n                        data-part=\"crosshair-time\"\n                        {...slotProps?.crosshairTime}\n                        style={{\n                          ...crosshairStyle(slotOffset + activeCandleIndex, slotCount, undefined),\n                          ...slotProps?.crosshairTime?.style,\n                        }}\n                      >\n                        {String(crosshairCandle.time)}\n                      </li>\n                    ) : null}\n                  </ol>\n                </div>\n              </div>\n            </div>\n            <ol\n              data-part=\"price-axis\"\n              data-axis=\"price\"\n              aria-label={`${label} ${accessibleLabels.prices}`}\n              {...slotProps?.priceAxis}\n            >\n              {priceLabels.map((axisLabel, index) => (\n                <li\n                  key={`${axisLabel.position}-${index}`}\n                  {...withGeneratedStyle(\n                    getIndexedPartProps(slotProps?.priceAxisLabel, index),\n                    axisStyle(\"y\", axisLabel.position),\n                  )}\n                >\n                  {axisLabel.label}\n                </li>\n              ))}\n              {interactive && crosshairCandle && activeCandleIndex !== undefined ? (\n                <li\n                  data-part=\"crosshair-price\"\n                  {...slotProps?.crosshairPrice}\n                  style={{ ...cursorStyle(cursorY), ...slotProps?.crosshairPrice?.style }}\n                >\n                  {crosshairCandle.close}\n                </li>\n              ) : null}\n            </ol>\n          </div>\n          <table\n            data-part=\"data\"\n            aria-label={`${label} ${accessibleLabels.data}`}\n            {...slotProps?.dataTable}\n          >\n            <thead {...slotProps?.dataTableHead}>\n              <tr {...slotProps?.dataTableHeaderRow}>\n                <th scope=\"col\" {...slotProps?.dataTableTimeHeader}>\n                  {accessibleLabels.time}\n                </th>\n                <th scope=\"col\" {...slotProps?.dataTableOpenHeader}>\n                  {accessibleLabels.open}\n                </th>\n                <th scope=\"col\" {...slotProps?.dataTableHighHeader}>\n                  {accessibleLabels.high}\n                </th>\n                <th scope=\"col\" {...slotProps?.dataTableLowHeader}>\n                  {accessibleLabels.low}\n                </th>\n                <th scope=\"col\" {...slotProps?.dataTableCloseHeader}>\n                  {accessibleLabels.close}\n                </th>\n              </tr>\n            </thead>\n            <tbody {...slotProps?.dataTableBody}>\n              {data.map((candle, index) => (\n                <tr\n                  key={`${candle.time}-${index}`}\n                  {...getIndexedPartProps(slotProps?.dataTableRow, slotOffset + index)}\n                >\n                  <th\n                    scope=\"row\"\n                    {...getIndexedPartProps(slotProps?.dataTableTimeCell, slotOffset + index)}\n                  >\n                    {String(candle.time)}\n                  </th>\n                  <td {...getIndexedPartProps(slotProps?.dataTableOpenCell, slotOffset + index)}>\n                    {candle.open}\n                  </td>\n                  <td {...getIndexedPartProps(slotProps?.dataTableHighCell, slotOffset + index)}>\n                    {candle.high}\n                  </td>\n                  <td {...getIndexedPartProps(slotProps?.dataTableLowCell, slotOffset + index)}>\n                    {candle.low}\n                  </td>\n                  <td {...getIndexedPartProps(slotProps?.dataTableCloseCell, slotOffset + index)}>\n                    {candle.close}\n                  </td>\n                </tr>\n              ))}\n            </tbody>\n          </table>\n        </>\n      ),\n    },\n    render,\n    state: {},\n  });\n}\nCandleChart.displayName = \"CandleChart\";\n"],"mappings":"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","names":[]}

package/dist/components/candle-chart/client/CandleChartClient.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CandleChartClient.d.ts","sourceRoot":"","sources":["../../../../src/components/candle-chart/client/CandleChartClient.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAiB,WAAW,EAAE,YAAY,EAAO,MAAM,OAAO,CAAC;AAG3E,OAAO,KAAK,EACV,sBAAsB,EAKvB,MAAM,aAAa,CAAC;AA+BrB,wBAAgB,iBAAiB,CAAC,GAAG,SAAS,WAAW,GAAG,QAAQ,EAClE,KAAK,EAAE,sBAAsB,CAAC,GAAG,CAAC,GACjC,YAAY,GAAG,IAAI,CAsJrB;yBAxJe,iBAAiB"}
+{"version":3,"file":"CandleChartClient.d.ts","sourceRoot":"","sources":["../../../../src/components/candle-chart/client/CandleChartClient.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAiB,WAAW,EAAE,YAAY,EAAO,MAAM,OAAO,CAAC;AAG3E,OAAO,KAAK,EACV,sBAAsB,EAKvB,MAAM,aAAa,CAAC;AA+BrB,wBAAgB,iBAAiB,CAAC,GAAG,SAAS,WAAW,GAAG,QAAQ,EAClE,KAAK,EAAE,sBAAsB,CAAC,GAAG,CAAC,GACjC,YAAY,GAAG,IAAI,CAmKrB;yBArKe,iBAAiB"}

package/dist/components/candle-chart/client/CandleChartClient.js

@@ -24,6 +24,7 @@ function CandleChartClient(props) {
     onCandleClick: consumerOnCandleClick,
     onCandlePointerLeave: consumerOnCandlePointerLeave,
     onCandlePointerMove: consumerOnCandlePointerMove,
+    slotProps,
     ...consumerProps
   } = props;
   const live = visibleCount !== void 0 && visibleCount > 0;
@@ -41,9 +42,10 @@ function CandleChartClient(props) {
     visibleCount,
     itemWidth: viewport.itemWidth,
     figureHeight: figureSize?.height,
-    scrollVariable: "--candle-scroll-x"
+    scrollVariable: "--candle-scroll-x",
+    consumerStyle
   });
-  useScrollbarReserve(liveWindow.chartRef, "--candle-scrollbar-size");
+  useScrollbarReserve(liveWindow.chartRef, "--candle-scrollbar-size", consumerStyle);
   const [cursor, setCursor] = useState(null);
   const [selectedCandleIndex, setSelectedCandleIndex] = useState();
   const chartRef = useMergedRefs(viewport.ref, consumerRef, liveWindow.chartRef);
@@ -70,8 +72,8 @@ function CandleChartClient(props) {
     [data, live]
   );
   const style = {
-    ...consumerStyle,
-    "--candle-scale": String(viewport.scale)
+    "--candle-scale": String(viewport.scale),
+    ...consumerStyle
   };
   if (!live) {
     const chartProps2 = {
@@ -85,6 +87,7 @@ function CandleChartClient(props) {
       onCandleClick: handleCandleClick,
       onCandlePointerLeave: handleCandlePointerLeave,
       onCandlePointerMove: handleCandlePointerMove,
+      ...slotProps ? { slotProps } : {},
       ref: chartRef,
       selectedCandleIndex,
       style
@@ -95,6 +98,7 @@ function CandleChartClient(props) {
   const slice = data.slice(sliceStart, sliceEnd);
   const { min, max } = getPriceBounds(slice);
   const toSliceIndex = (index) => index !== void 0 && index >= sliceStart && index < sliceEnd ? index - sliceStart : void 0;
+  const { ref: liveScrollportRef, ...liveScrollportProps } = slotProps?.liveScrollport ?? {};
   const candleLayer = /* @__PURE__ */ jsx(
     VirtualScroll,
     {
@@ -125,16 +129,24 @@ function CandleChartClient(props) {
             cursorY: isActive ? cursor?.offsetY : void 0,
             onCandleClick: handleCandleClick,
             onCandlePointerLeave: handleCandlePointerLeave,
-            onCandlePointerMove: handleCandlePointerMove
+            onCandlePointerMove: handleCandlePointerMove,
+            slotProps
           }
         );
+      },
+      ...liveScrollportProps,
+      ...liveScrollportRef ? { ref: liveScrollportRef } : {},
+      slotProps: {
+        ...slotProps?.liveSpacer ? { spacer: slotProps.liveSpacer } : {},
+        ...slotProps?.liveCandleRow ? { row: slotProps.liveCandleRow } : {}
       }
     }
   );
   const liveStyle = {
     ...style,
     "--candle-content-size": `${contentSize}px`,
-    "--candle-plot-height": `${plotHeight}px`
+    "--candle-plot-height": `${plotHeight}px`,
+    ...consumerStyle
   };
   const chartProps = {
     ...consumerProps,
@@ -146,6 +158,7 @@ function CandleChartClient(props) {
     candleLayer,
     cursorY: cursor?.offsetY,
     interactive: true,
+    ...slotProps ? { slotProps } : {},
     ref: chartRef,
     selectedCandleIndex: toSliceIndex(selectedCandleIndex),
     slotCount: data.length,

package/dist/components/candle-chart/client/CandleChartClient.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/candle-chart/client/CandleChartClient.tsx"],"sourcesContent":["\"use client\";\n\nimport { useCallback, useMemo, useState } from \"react\";\nimport type { CSSProperties, ElementType, ReactElement, Ref } from \"react\";\nimport { formatLabel } from \"@gunkin/uiify/core/format-label\";\nimport { CandleChart, CandleChartCandle, getPriceBounds } from \"../CandleChart.js\";\nimport type {\n  CandleChartClientProps,\n  CandleChartData,\n  CandleChartPointerPosition,\n  CandleChartProps,\n  CandleChartViewProps,\n} from \"../types.js\";\nimport { VirtualScroll } from \"../../virtual-scroll/VirtualScroll.js\";\nimport {\n  liveTimeAxis,\n  useLiveChartWindow,\n} from \"../../internal/live-chart/use-live-chart-window.js\";\nimport { useScrollbarReserve } from \"../../internal/chart-scrollbar/use-scrollbar-reserve.js\";\nimport { useChartViewport } from \"../../../hooks/use-chart-viewport.js\";\nimport { useMergedRefs } from \"../../../hooks/use-merged-refs.js\";\nimport { useResizeObserver } from \"../../../hooks/use-resize-observer.js\";\n\ninterface InteractiveCandleStyle extends CSSProperties {\n  \"--candle-scale\": string;\n  \"--candle-content-size\"?: string;\n  \"--candle-plot-height\"?: string;\n}\n\ninterface CursorState extends CandleChartPointerPosition {}\n\ninterface LiveCandle {\n  readonly id: string;\n  readonly candle: CandleChartData;\n}\n\n/**\n * `[data-part=\"plot\"]`'s fixed price-axis column (4.5rem) plus its grid gap\n * (0.75rem) — see candle-chart.css. `useChartViewport` measures the whole\n * `<figure>`, but candles only ever get the width left over after this\n * column, so it must be subtracted before sizing `minItemWidth`.\n */\nconst Y_AXIS_COLUMN_WIDTH = 72 + 12;\nexport function CandleChartClient<TAs extends ElementType = \"figure\">(\n  props: CandleChartClientProps<TAs>,\n): ReactElement | null {\n  const {\n    data,\n    visibleCount,\n    xAxis,\n    labels,\n    ref: consumerRef,\n    style: consumerStyle,\n    onCandleClick: consumerOnCandleClick,\n    onCandlePointerLeave: consumerOnCandlePointerLeave,\n    onCandlePointerMove: consumerOnCandlePointerMove,\n    ...consumerProps\n  } = props as CandleChartClientProps<\"figure\"> & {\n    ref?: Ref<HTMLElement>;\n    style?: CSSProperties;\n  };\n  const live = visibleCount !== undefined && visibleCount > 0;\n  const viewport = useChartViewport(\n    live\n      ? {\n          enabled: false,\n          initialScale: 1,\n          itemCount: visibleCount,\n          measuredWidthOffset: Y_AXIS_COLUMN_WIDTH,\n        }\n      : { itemCount: data.length, measuredWidthOffset: Y_AXIS_COLUMN_WIDTH, minItemWidth: 24 },\n  );\n  const figureSize = useResizeObserver(viewport.ref);\n  const liveWindow = useLiveChartWindow({\n    count: data.length,\n    visibleCount,\n    itemWidth: viewport.itemWidth,\n    figureHeight: figureSize?.height,\n    scrollVariable: \"--candle-scroll-x\",\n  });\n  useScrollbarReserve(liveWindow.chartRef, \"--candle-scrollbar-size\");\n  // Cursor and selection hold absolute indices so they survive scrolling and appends.\n  const [cursor, setCursor] = useState<CursorState | null>(null);\n  const [selectedCandleIndex, setSelectedCandleIndex] = useState<number | undefined>();\n  const chartRef = useMergedRefs<HTMLElement>(viewport.ref, consumerRef, liveWindow.chartRef);\n  const handleCandleClick = useCallback(\n    (index: number) => {\n      setSelectedCandleIndex(index);\n      consumerOnCandleClick?.(index);\n    },\n    [consumerOnCandleClick],\n  );\n  const handleCandlePointerLeave = useCallback(() => {\n    setCursor(null);\n    consumerOnCandlePointerLeave?.();\n  }, [consumerOnCandlePointerLeave]);\n  const handleCandlePointerMove = useCallback(\n    (position: CandleChartPointerPosition) => {\n      setCursor(position);\n      consumerOnCandlePointerMove?.(position);\n    },\n    [consumerOnCandlePointerMove],\n  );\n  const liveItems = useMemo<readonly LiveCandle[]>(\n    () => (live ? data.map((candle, index) => ({ id: String(index), candle })) : []),\n    [data, live],\n  );\n  const style: InteractiveCandleStyle = {\n    ...consumerStyle,\n    \"--candle-scale\": String(viewport.scale),\n  };\n\n  if (!live) {\n    const chartProps = {\n      ...consumerProps,\n      ...(xAxis ? { xAxis } : {}),\n      data,\n      labels,\n      activeCandleIndex: cursor?.index,\n      cursorY: cursor?.offsetY,\n      interactive: true,\n      onCandleClick: handleCandleClick,\n      onCandlePointerLeave: handleCandlePointerLeave,\n      onCandlePointerMove: handleCandlePointerMove,\n      ref: chartRef,\n      selectedCandleIndex,\n      style,\n    } as CandleChartProps<\"figure\">;\n    return <CandleChart {...chartProps} />;\n  }\n\n  const { sliceStart, sliceEnd, contentSize, plotHeight } = liveWindow;\n  const slice = data.slice(sliceStart, sliceEnd);\n  const { min, max } = getPriceBounds(slice);\n  const toSliceIndex = (index: number | undefined): number | undefined =>\n    index !== undefined && index >= sliceStart && index < sliceEnd ? index - sliceStart : undefined;\n  const candleLayer = (\n    <VirtualScroll\n      height={plotHeight}\n      items={liveItems}\n      orientation=\"horizontal\"\n      overscan={2}\n      rowHeight={viewport.itemWidth}\n      scrollRef={liveWindow.scrollRef}\n      onRangeChange={liveWindow.onRangeChange}\n      renderRow={({ candle }, index) => {\n        // Overscan candles stay inert, so focus never scrolls hidden candles into view.\n        const inSlice = index >= sliceStart && index < sliceEnd;\n        const isActive = cursor?.index === index;\n        return (\n          <CandleChartCandle\n            as=\"div\"\n            candle={candle}\n            hitLabel={formatLabel(labels?.candle ?? \"Candle {time}\", { time: String(candle.time) })}\n            index={index}\n            x={0}\n            slot={100}\n            min={min}\n            max={max}\n            interactive={inSlice}\n            isActive={isActive}\n            isSelected={selectedCandleIndex === index}\n            cursorY={isActive ? cursor?.offsetY : undefined}\n            onCandleClick={handleCandleClick}\n            onCandlePointerLeave={handleCandlePointerLeave}\n            onCandlePointerMove={handleCandlePointerMove}\n          />\n        );\n      }}\n    />\n  );\n\n  const liveStyle: InteractiveCandleStyle = {\n    ...style,\n    \"--candle-content-size\": `${contentSize}px`,\n    \"--candle-plot-height\": `${plotHeight}px`,\n  };\n  const chartProps = {\n    ...consumerProps,\n    data: slice,\n    labels,\n    xAxis: xAxis ?? liveTimeAxis(data, sliceStart, sliceEnd, visibleCount),\n    activeCandleIndex: toSliceIndex(cursor?.index),\n    announceReadout: false,\n    candleLayer,\n    cursorY: cursor?.offsetY,\n    interactive: true,\n    ref: chartRef,\n    selectedCandleIndex: toSliceIndex(selectedCandleIndex),\n    slotCount: data.length,\n    slotOffset: sliceStart,\n    style: liveStyle,\n  } as CandleChartProps<\"figure\"> & CandleChartViewProps;\n\n  return <CandleChart {...chartProps} />;\n}\nCandleChartClient.displayName = \"CandleChartClient\";\n"],"mappings":"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","names":["chartProps"]}
+{"version":3,"sources":["../../../../src/components/candle-chart/client/CandleChartClient.tsx"],"sourcesContent":["\"use client\";\n\nimport { useCallback, useMemo, useState } from \"react\";\nimport type { CSSProperties, ElementType, ReactElement, Ref } from \"react\";\nimport { formatLabel } from \"@gunkin/uiify/core/format-label\";\nimport { CandleChart, CandleChartCandle, getPriceBounds } from \"../CandleChart.js\";\nimport type {\n  CandleChartClientProps,\n  CandleChartData,\n  CandleChartPointerPosition,\n  CandleChartProps,\n  CandleChartViewProps,\n} from \"../types.js\";\nimport { VirtualScroll } from \"../../virtual-scroll/VirtualScroll.js\";\nimport {\n  liveTimeAxis,\n  useLiveChartWindow,\n} from \"../../internal/live-chart/use-live-chart-window.js\";\nimport { useScrollbarReserve } from \"../../internal/chart-scrollbar/use-scrollbar-reserve.js\";\nimport { useChartViewport } from \"../../../hooks/use-chart-viewport.js\";\nimport { useMergedRefs } from \"../../../hooks/use-merged-refs.js\";\nimport { useResizeObserver } from \"../../../hooks/use-resize-observer.js\";\n\ninterface InteractiveCandleStyle extends CSSProperties {\n  \"--candle-scale\": string;\n  \"--candle-content-size\"?: string;\n  \"--candle-plot-height\"?: string;\n}\n\ninterface CursorState extends CandleChartPointerPosition {}\n\ninterface LiveCandle {\n  readonly id: string;\n  readonly candle: CandleChartData;\n}\n\n/**\n * `[data-part=\"plot\"]`'s fixed price-axis column (4.5rem) plus its grid gap\n * (0.75rem) — see candle-chart.css. `useChartViewport` measures the whole\n * `<figure>`, but candles only ever get the width left over after this\n * column, so it must be subtracted before sizing `minItemWidth`.\n */\nconst Y_AXIS_COLUMN_WIDTH = 72 + 12;\nexport function CandleChartClient<TAs extends ElementType = \"figure\">(\n  props: CandleChartClientProps<TAs>,\n): ReactElement | null {\n  const {\n    data,\n    visibleCount,\n    xAxis,\n    labels,\n    ref: consumerRef,\n    style: consumerStyle,\n    onCandleClick: consumerOnCandleClick,\n    onCandlePointerLeave: consumerOnCandlePointerLeave,\n    onCandlePointerMove: consumerOnCandlePointerMove,\n    slotProps,\n    ...consumerProps\n  } = props as CandleChartClientProps<\"figure\"> & {\n    ref?: Ref<HTMLElement>;\n    style?: CSSProperties;\n  };\n  const live = visibleCount !== undefined && visibleCount > 0;\n  const viewport = useChartViewport(\n    live\n      ? {\n          enabled: false,\n          initialScale: 1,\n          itemCount: visibleCount,\n          measuredWidthOffset: Y_AXIS_COLUMN_WIDTH,\n        }\n      : { itemCount: data.length, measuredWidthOffset: Y_AXIS_COLUMN_WIDTH, minItemWidth: 24 },\n  );\n  const figureSize = useResizeObserver(viewport.ref);\n  const liveWindow = useLiveChartWindow({\n    count: data.length,\n    visibleCount,\n    itemWidth: viewport.itemWidth,\n    figureHeight: figureSize?.height,\n    scrollVariable: \"--candle-scroll-x\",\n    consumerStyle,\n  });\n  useScrollbarReserve(liveWindow.chartRef, \"--candle-scrollbar-size\", consumerStyle);\n  // Cursor and selection hold absolute indices so they survive scrolling and appends.\n  const [cursor, setCursor] = useState<CursorState | null>(null);\n  const [selectedCandleIndex, setSelectedCandleIndex] = useState<number | undefined>();\n  const chartRef = useMergedRefs<HTMLElement>(viewport.ref, consumerRef, liveWindow.chartRef);\n  const handleCandleClick = useCallback(\n    (index: number) => {\n      setSelectedCandleIndex(index);\n      consumerOnCandleClick?.(index);\n    },\n    [consumerOnCandleClick],\n  );\n  const handleCandlePointerLeave = useCallback(() => {\n    setCursor(null);\n    consumerOnCandlePointerLeave?.();\n  }, [consumerOnCandlePointerLeave]);\n  const handleCandlePointerMove = useCallback(\n    (position: CandleChartPointerPosition) => {\n      setCursor(position);\n      consumerOnCandlePointerMove?.(position);\n    },\n    [consumerOnCandlePointerMove],\n  );\n  const liveItems = useMemo<readonly LiveCandle[]>(\n    () => (live ? data.map((candle, index) => ({ id: String(index), candle })) : []),\n    [data, live],\n  );\n  const style: InteractiveCandleStyle = {\n    \"--candle-scale\": String(viewport.scale),\n    ...consumerStyle,\n  };\n\n  if (!live) {\n    const chartProps = {\n      ...consumerProps,\n      ...(xAxis ? { xAxis } : {}),\n      data,\n      labels,\n      activeCandleIndex: cursor?.index,\n      cursorY: cursor?.offsetY,\n      interactive: true,\n      onCandleClick: handleCandleClick,\n      onCandlePointerLeave: handleCandlePointerLeave,\n      onCandlePointerMove: handleCandlePointerMove,\n      ...(slotProps ? { slotProps } : {}),\n      ref: chartRef,\n      selectedCandleIndex,\n      style,\n    } as CandleChartProps<\"figure\">;\n    return <CandleChart {...chartProps} />;\n  }\n\n  const { sliceStart, sliceEnd, contentSize, plotHeight } = liveWindow;\n  const slice = data.slice(sliceStart, sliceEnd);\n  const { min, max } = getPriceBounds(slice);\n  const toSliceIndex = (index: number | undefined): number | undefined =>\n    index !== undefined && index >= sliceStart && index < sliceEnd ? index - sliceStart : undefined;\n  const { ref: liveScrollportRef, ...liveScrollportProps } = slotProps?.liveScrollport ?? {};\n  const candleLayer = (\n    <VirtualScroll\n      height={plotHeight}\n      items={liveItems}\n      orientation=\"horizontal\"\n      overscan={2}\n      rowHeight={viewport.itemWidth}\n      scrollRef={liveWindow.scrollRef}\n      onRangeChange={liveWindow.onRangeChange}\n      renderRow={({ candle }, index) => {\n        // Overscan candles stay inert, so focus never scrolls hidden candles into view.\n        const inSlice = index >= sliceStart && index < sliceEnd;\n        const isActive = cursor?.index === index;\n        return (\n          <CandleChartCandle\n            as=\"div\"\n            candle={candle}\n            hitLabel={formatLabel(labels?.candle ?? \"Candle {time}\", { time: String(candle.time) })}\n            index={index}\n            x={0}\n            slot={100}\n            min={min}\n            max={max}\n            interactive={inSlice}\n            isActive={isActive}\n            isSelected={selectedCandleIndex === index}\n            cursorY={isActive ? cursor?.offsetY : undefined}\n            onCandleClick={handleCandleClick}\n            onCandlePointerLeave={handleCandlePointerLeave}\n            onCandlePointerMove={handleCandlePointerMove}\n            slotProps={slotProps}\n          />\n        );\n      }}\n      {...liveScrollportProps}\n      {...(liveScrollportRef ? { ref: liveScrollportRef } : {})}\n      slotProps={{\n        ...(slotProps?.liveSpacer ? { spacer: slotProps.liveSpacer } : {}),\n        ...(slotProps?.liveCandleRow ? { row: slotProps.liveCandleRow } : {}),\n      }}\n    />\n  );\n\n  const liveStyle: InteractiveCandleStyle = {\n    ...style,\n    \"--candle-content-size\": `${contentSize}px`,\n    \"--candle-plot-height\": `${plotHeight}px`,\n    ...consumerStyle,\n  };\n  const chartProps = {\n    ...consumerProps,\n    data: slice,\n    labels,\n    xAxis: xAxis ?? liveTimeAxis(data, sliceStart, sliceEnd, visibleCount),\n    activeCandleIndex: toSliceIndex(cursor?.index),\n    announceReadout: false,\n    candleLayer,\n    cursorY: cursor?.offsetY,\n    interactive: true,\n    ...(slotProps ? { slotProps } : {}),\n    ref: chartRef,\n    selectedCandleIndex: toSliceIndex(selectedCandleIndex),\n    slotCount: data.length,\n    slotOffset: sliceStart,\n    style: liveStyle,\n  } as CandleChartProps<\"figure\"> & CandleChartViewProps;\n\n  return <CandleChart {...chartProps} />;\n}\nCandleChartClient.displayName = \"CandleChartClient\";\n"],"mappings":"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","names":["chartProps"]}

package/dist/components/candle-chart/client/index.d.ts

@@ -1,3 +1,3 @@
 export { CandleChartClient } from "./CandleChartClient.js";
-export type { CandleChartClientOwnProps, CandleChartClientProps } from "../types.js";
+export type { CandleChartClientOwnProps, CandleChartClientProps, CandleChartSlotProps, } from "../types.js";
 //# sourceMappingURL=index.d.ts.map

package/dist/components/candle-chart/client/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/candle-chart/client/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AAC3D,YAAY,EAAE,yBAAyB,EAAE,sBAAsB,EAAE,MAAM,aAAa,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/candle-chart/client/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AAC3D,YAAY,EACV,yBAAyB,EACzB,sBAAsB,EACtB,oBAAoB,GACrB,MAAM,aAAa,CAAC"}