@gunkin/uiify 0.0.24-alpha → 0.0.26-alpha

package/dist/components/internal/live-chart/types.d.ts

@@ -1,4 +1,4 @@
-import type { ReactNode, RefObject } from "react";
+import type { CSSProperties, ReactNode, RefObject } from "react";
 import type { VirtualScrollHandle, VirtualScrollRangeChange } from "../../virtual-scroll/types.js";
 export interface LiveChartAxisLabel {
     readonly label: ReactNode;
@@ -16,6 +16,8 @@ export interface UseLiveChartWindowOptions {
     readonly figureHeight: number | undefined;
     /** Custom property that receives the scroll offset, e.g. `--candle-scroll-x`. */
     readonly scrollVariable: `--${string}`;
+    /** Native root styles override the computed scroll custom property, including removal. */
+    readonly consumerStyle?: CSSProperties | undefined;
 }
 export interface UseLiveChartWindowResult {
     readonly live: boolean;

package/dist/components/internal/live-chart/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/internal/live-chart/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAClD,OAAO,KAAK,EAAE,mBAAmB,EAAE,wBAAwB,EAAE,MAAM,+BAA+B,CAAC;AAEnG,MAAM,WAAW,kBAAkB;IACjC,QAAQ,CAAC,KAAK,EAAE,SAAS,CAAC;IAC1B,iFAAiF;IACjF,QAAQ,CAAC,QAAQ,EAAE,MAAM,CAAC;CAC3B;AAED,MAAM,WAAW,yBAAyB;IACxC,8DAA8D;IAC9D,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB,4EAA4E;IAC5E,QAAQ,CAAC,YAAY,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1C,sDAAsD;IACtD,QAAQ,CAAC,SAAS,EAAE,MAAM,CAAC;IAC3B,mEAAmE;IACnE,QAAQ,CAAC,YAAY,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1C,iFAAiF;IACjF,QAAQ,CAAC,cAAc,EAAE,KAAK,MAAM,EAAE,CAAC;CACxC;AAED,MAAM,WAAW,wBAAwB;IACvC,QAAQ,CAAC,IAAI,EAAE,OAAO,CAAC;IACvB,qDAAqD;IACrD,QAAQ,CAAC,SAAS,EAAE,SAAS,CAAC,mBAAmB,GAAG,IAAI,CAAC,CAAC;IAC1D,wFAAwF;IACxF,QAAQ,CAAC,QAAQ,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IACjD,yDAAyD;IACzD,QAAQ,CAAC,aAAa,EAAE,CAAC,KAAK,EAAE,wBAAwB,KAAK,IAAI,CAAC;IAClE,wFAAwF;IACxF,QAAQ,CAAC,UAAU,EAAE,MAAM,CAAC;IAC5B,QAAQ,CAAC,QAAQ,EAAE,MAAM,CAAC;IAC1B,8CAA8C;IAC9C,QAAQ,CAAC,WAAW,EAAE,MAAM,CAAC;IAC7B,sDAAsD;IACtD,QAAQ,CAAC,UAAU,EAAE,MAAM,CAAC;CAC7B"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/internal/live-chart/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACjE,OAAO,KAAK,EAAE,mBAAmB,EAAE,wBAAwB,EAAE,MAAM,+BAA+B,CAAC;AAEnG,MAAM,WAAW,kBAAkB;IACjC,QAAQ,CAAC,KAAK,EAAE,SAAS,CAAC;IAC1B,iFAAiF;IACjF,QAAQ,CAAC,QAAQ,EAAE,MAAM,CAAC;CAC3B;AAED,MAAM,WAAW,yBAAyB;IACxC,8DAA8D;IAC9D,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB,4EAA4E;IAC5E,QAAQ,CAAC,YAAY,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1C,sDAAsD;IACtD,QAAQ,CAAC,SAAS,EAAE,MAAM,CAAC;IAC3B,mEAAmE;IACnE,QAAQ,CAAC,YAAY,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1C,iFAAiF;IACjF,QAAQ,CAAC,cAAc,EAAE,KAAK,MAAM,EAAE,CAAC;IACvC,0FAA0F;IAC1F,QAAQ,CAAC,aAAa,CAAC,EAAE,aAAa,GAAG,SAAS,CAAC;CACpD;AAED,MAAM,WAAW,wBAAwB;IACvC,QAAQ,CAAC,IAAI,EAAE,OAAO,CAAC;IACvB,qDAAqD;IACrD,QAAQ,CAAC,SAAS,EAAE,SAAS,CAAC,mBAAmB,GAAG,IAAI,CAAC,CAAC;IAC1D,wFAAwF;IACxF,QAAQ,CAAC,QAAQ,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IACjD,yDAAyD;IACzD,QAAQ,CAAC,aAAa,EAAE,CAAC,KAAK,EAAE,wBAAwB,KAAK,IAAI,CAAC;IAClE,wFAAwF;IACxF,QAAQ,CAAC,UAAU,EAAE,MAAM,CAAC;IAC5B,QAAQ,CAAC,QAAQ,EAAE,MAAM,CAAC;IAC1B,8CAA8C;IAC9C,QAAQ,CAAC,WAAW,EAAE,MAAM,CAAC;IAC7B,sDAAsD;IACtD,QAAQ,CAAC,UAAU,EAAE,MAAM,CAAC;CAC7B"}

package/dist/components/internal/live-chart/use-live-chart-window.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use-live-chart-window.d.ts","sourceRoot":"","sources":["../../../../src/components/internal/live-chart/use-live-chart-window.ts"],"names":[],"mappings":"AAKA,OAAO,KAAK,EACV,kBAAkB,EAClB,yBAAyB,EACzB,wBAAwB,EACzB,MAAM,YAAY,CAAC;AAQpB;;;;GAIG;AACH,wBAAgB,YAAY,CAC1B,IAAI,EAAE,SAAS;IAAE,QAAQ,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,CAAA;CAAE,EAAE,EACnD,KAAK,EAAE,MAAM,EACb,GAAG,EAAE,MAAM,EACX,YAAY,EAAE,MAAM,GACnB,kBAAkB,EAAE,CAYtB;AAED;;;;;;GAMG;AACH,wBAAgB,kBAAkB,CAAC,OAAO,EAAE,yBAAyB,GAAG,wBAAwB,CAqE/F"}
+{"version":3,"file":"use-live-chart-window.d.ts","sourceRoot":"","sources":["../../../../src/components/internal/live-chart/use-live-chart-window.ts"],"names":[],"mappings":"AAMA,OAAO,KAAK,EACV,kBAAkB,EAClB,yBAAyB,EACzB,wBAAwB,EACzB,MAAM,YAAY,CAAC;AAQpB;;;;GAIG;AACH,wBAAgB,YAAY,CAC1B,IAAI,EAAE,SAAS;IAAE,QAAQ,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,CAAA;CAAE,EAAE,EACnD,KAAK,EAAE,MAAM,EACb,GAAG,EAAE,MAAM,EACX,YAAY,EAAE,MAAM,GACnB,kBAAkB,EAAE,CAYtB;AAiBD;;;;;;GAMG;AACH,wBAAgB,kBAAkB,CAAC,OAAO,EAAE,yBAAyB,GAAG,wBAAwB,CA4E/F"}

package/dist/components/internal/live-chart/use-live-chart-window.js

@@ -17,8 +17,24 @@ function liveTimeAxis(data, start, end, visibleCount) {
   }
   return labels;
 }
+function writeScrollVariable(chart, scrollVariable, offset, consumerStyle) {
+  const style = {
+    [scrollVariable]: `${offset}px`,
+    ...consumerStyle
+  };
+  const value = style[scrollVariable];
+  if (value === void 0) chart.style.removeProperty(scrollVariable);
+  else chart.style.setProperty(scrollVariable, String(value));
+}
 function useLiveChartWindow(options) {
-  const { count, visibleCount = 0, itemWidth, figureHeight, scrollVariable } = options;
+  const {
+    count,
+    visibleCount = 0,
+    itemWidth,
+    figureHeight,
+    scrollVariable,
+    consumerStyle
+  } = options;
   const live = visibleCount > 0;
   const scrollRef = useRef(null);
   const chartRef = useRef(null);
@@ -26,8 +42,8 @@ function useLiveChartWindow(options) {
   const [following, setFollowing] = useState(true);
   const contentSize = count * itemWidth;
   const viewportWidth = itemWidth * visibleCount;
-  const layoutRef = useRef({ contentSize, itemWidth, viewportWidth });
-  layoutRef.current = { contentSize, itemWidth, viewportWidth };
+  const layoutRef = useRef({ contentSize, itemWidth, viewportWidth, consumerStyle });
+  layoutRef.current = { contentSize, itemWidth, viewportWidth, consumerStyle };
   useEffect(() => {
     if (!live) return;
     const element = scrollRef.current?.element;
@@ -35,8 +51,8 @@ function useLiveChartWindow(options) {
     if (!element || !chart) return;
     const onScroll = () => {
       const offset = element.scrollLeft;
-      chart.style.setProperty(scrollVariable, `${offset}px`);
       const layout = layoutRef.current;
+      writeScrollVariable(chart, scrollVariable, offset, layout.consumerStyle);
       setFollowing(
         offset + layout.viewportWidth >= layout.contentSize - Math.max(1, layout.itemWidth)
       );
@@ -51,7 +67,7 @@ function useLiveChartWindow(options) {
     if (!element || !chart) return;
     const end = Math.max(0, contentSize - viewportWidth);
     element.scrollLeft = end;
-    chart.style.setProperty(scrollVariable, `${end}px`);
+    writeScrollVariable(chart, scrollVariable, end, layoutRef.current.consumerStyle);
   }, [live, following, contentSize, viewportWidth, scrollVariable]);
   const tail = following || !visibleRange;
   const sliceStart = tail ? Math.max(0, count - visibleCount) : Math.min(visibleRange.startIndex, Math.max(0, count - 1));

package/dist/components/internal/live-chart/use-live-chart-window.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/internal/live-chart/use-live-chart-window.ts"],"sourcesContent":["\"use client\";\n\nimport { useEffect, useRef, useState } from \"react\";\nimport { useIsomorphicLayoutEffect } from \"../../../hooks/use-isomorphic-layout-effect.js\";\nimport type { VirtualScrollHandle, VirtualScrollRangeChange } from \"../../virtual-scroll/types.js\";\nimport type {\n  LiveChartAxisLabel,\n  UseLiveChartWindowOptions,\n  UseLiveChartWindowResult,\n} from \"./types.js\";\n\n/** The plot's 1.5rem time-axis row below the item viewport (candle-chart.css, line-chart.css). */\nconst TIME_AXIS_ROW_HEIGHT = 24;\n/** The item viewport's 18rem minimum block size, used until the figure is measured. */\nconst MIN_PLOT_HEIGHT = 288;\nconst LIVE_TIME_TICKS = 4;\n\n/**\n * Time ticks pinned to absolute item indices and positioned at slot centers\n * across the whole scrolled content, so labels scroll with their items. Only\n * ticks near the visible slice are returned.\n */\nexport function liveTimeAxis(\n  data: readonly { readonly time: string | number }[],\n  start: number,\n  end: number,\n  visibleCount: number,\n): LiveChartAxisLabel[] {\n  const step = Math.max(1, Math.ceil(visibleCount / LIVE_TIME_TICKS));\n  const labels: LiveChartAxisLabel[] = [];\n  const first = Math.max(0, Math.floor(start / step) - 1) * step;\n  const last = Math.min(data.length, end + step);\n  for (let index = first; index < last; index += step) {\n    labels.push({\n      label: String(data[index]?.time),\n      position: ((index + 0.5) / data.length) * 100,\n    });\n  }\n  return labels;\n}\n\n/**\n * Live chart window over a horizontal VirtualScroll: follows appends while the\n * reader is at the newest item, leaves a scrolled-back reader in place, and\n * reports the visible slice. The chart pins the scroll position itself rather\n * than using VirtualScroll's `anchor`, and publishes the offset as a CSS\n * variable so axes and crosshairs scroll without re-rendering.\n */\nexport function useLiveChartWindow(options: UseLiveChartWindowOptions): UseLiveChartWindowResult {\n  const { count, visibleCount = 0, itemWidth, figureHeight, scrollVariable } = options;\n  const live = visibleCount > 0;\n  const scrollRef = useRef<VirtualScrollHandle>(null);\n  const chartRef = useRef<HTMLElement | null>(null);\n  const [visibleRange, setVisibleRange] = useState<VirtualScrollRangeChange | null>(null);\n  // True while the reader sits at the newest item; appends then keep it in view.\n  const [following, setFollowing] = useState(true);\n  const contentSize = count * itemWidth;\n  const viewportWidth = itemWidth * visibleCount;\n  const layoutRef = useRef({ contentSize, itemWidth, viewportWidth });\n  layoutRef.current = { contentSize, itemWidth, viewportWidth };\n\n  // Publish the scroll offset (a CSS variable, so scrolling re-renders nothing)\n  // and track whether the reader is at the end.\n  useEffect(() => {\n    if (!live) return;\n    const element = scrollRef.current?.element;\n    const chart = chartRef.current;\n    if (!element || !chart) return;\n    const onScroll = (): void => {\n      const offset = element.scrollLeft; // banned-read-ok: scroll position drives the axis offset.\n      chart.style.setProperty(scrollVariable, `${offset}px`);\n      const layout = layoutRef.current;\n      // Within one item of the end counts: an item appended while the reader\n      // scrolls there moves the end by exactly one item width.\n      setFollowing(\n        offset + layout.viewportWidth >= layout.contentSize - Math.max(1, layout.itemWidth),\n      );\n    };\n    element.addEventListener(\"scroll\", onScroll, { passive: true });\n    return () => element.removeEventListener(\"scroll\", onScroll);\n  }, [live, scrollVariable]);\n\n  // Keep the newest item in view while following: on appends, resizes, and once measured.\n  useIsomorphicLayoutEffect(() => {\n    if (!live || !following) return;\n    const element = scrollRef.current?.element;\n    const chart = chartRef.current;\n    if (!element || !chart) return;\n    const end = Math.max(0, contentSize - viewportWidth);\n    element.scrollLeft = end; // banned-read-ok: pin the newest item before paint.\n    chart.style.setProperty(scrollVariable, `${end}px`);\n  }, [live, following, contentSize, viewportWidth, scrollVariable]);\n\n  // While following, the slice is the tail, so an append rescales in the same\n  // commit that adds the item.\n  const tail = following || !visibleRange;\n  const sliceStart = tail\n    ? Math.max(0, count - visibleCount)\n    : Math.min(visibleRange.startIndex, Math.max(0, count - 1));\n  const sliceEnd = tail\n    ? count\n    : Math.min(count, Math.max(sliceStart + 1, visibleRange.endIndex + 1));\n  const plotHeight =\n    figureHeight === undefined\n      ? MIN_PLOT_HEIGHT\n      : Math.max(MIN_PLOT_HEIGHT, figureHeight - TIME_AXIS_ROW_HEIGHT);\n\n  return {\n    live,\n    scrollRef,\n    chartRef,\n    onRangeChange: setVisibleRange,\n    sliceStart,\n    sliceEnd,\n    contentSize,\n    plotHeight,\n  };\n}\n"],"mappings":";AAEA,SAAS,WAAW,QAAQ,gBAAgB;AAC5C,SAAS,iCAAiC;AAS1C,MAAM,uBAAuB;AAE7B,MAAM,kBAAkB;AACxB,MAAM,kBAAkB;AAOjB,SAAS,aACd,MACA,OACA,KACA,cACsB;AACtB,QAAM,OAAO,KAAK,IAAI,GAAG,KAAK,KAAK,eAAe,eAAe,CAAC;AAClE,QAAM,SAA+B,CAAC;AACtC,QAAM,QAAQ,KAAK,IAAI,GAAG,KAAK,MAAM,QAAQ,IAAI,IAAI,CAAC,IAAI;AAC1D,QAAM,OAAO,KAAK,IAAI,KAAK,QAAQ,MAAM,IAAI;AAC7C,WAAS,QAAQ,OAAO,QAAQ,MAAM,SAAS,MAAM;AACnD,WAAO,KAAK;AAAA,MACV,OAAO,OAAO,KAAK,KAAK,GAAG,IAAI;AAAA,MAC/B,WAAY,QAAQ,OAAO,KAAK,SAAU;AAAA,IAC5C,CAAC;AAAA,EACH;AACA,SAAO;AACT;AASO,SAAS,mBAAmB,SAA8D;AAC/F,QAAM,EAAE,OAAO,eAAe,GAAG,WAAW,cAAc,eAAe,IAAI;AAC7E,QAAM,OAAO,eAAe;AAC5B,QAAM,YAAY,OAA4B,IAAI;AAClD,QAAM,WAAW,OAA2B,IAAI;AAChD,QAAM,CAAC,cAAc,eAAe,IAAI,SAA0C,IAAI;AAEtF,QAAM,CAAC,WAAW,YAAY,IAAI,SAAS,IAAI;AAC/C,QAAM,cAAc,QAAQ;AAC5B,QAAM,gBAAgB,YAAY;AAClC,QAAM,YAAY,OAAO,EAAE,aAAa,WAAW,cAAc,CAAC;AAClE,YAAU,UAAU,EAAE,aAAa,WAAW,cAAc;AAI5D,YAAU,MAAM;AACd,QAAI,CAAC,KAAM;AACX,UAAM,UAAU,UAAU,SAAS;AACnC,UAAM,QAAQ,SAAS;AACvB,QAAI,CAAC,WAAW,CAAC,MAAO;AACxB,UAAM,WAAW,MAAY;AAC3B,YAAM,SAAS,QAAQ;AACvB,YAAM,MAAM,YAAY,gBAAgB,GAAG,MAAM,IAAI;AACrD,YAAM,SAAS,UAAU;AAGzB;AAAA,QACE,SAAS,OAAO,iBAAiB,OAAO,cAAc,KAAK,IAAI,GAAG,OAAO,SAAS;AAAA,MACpF;AAAA,IACF;AACA,YAAQ,iBAAiB,UAAU,UAAU,EAAE,SAAS,KAAK,CAAC;AAC9D,WAAO,MAAM,QAAQ,oBAAoB,UAAU,QAAQ;AAAA,EAC7D,GAAG,CAAC,MAAM,cAAc,CAAC;AAGzB,4BAA0B,MAAM;AAC9B,QAAI,CAAC,QAAQ,CAAC,UAAW;AACzB,UAAM,UAAU,UAAU,SAAS;AACnC,UAAM,QAAQ,SAAS;AACvB,QAAI,CAAC,WAAW,CAAC,MAAO;AACxB,UAAM,MAAM,KAAK,IAAI,GAAG,cAAc,aAAa;AACnD,YAAQ,aAAa;AACrB,UAAM,MAAM,YAAY,gBAAgB,GAAG,GAAG,IAAI;AAAA,EACpD,GAAG,CAAC,MAAM,WAAW,aAAa,eAAe,cAAc,CAAC;AAIhE,QAAM,OAAO,aAAa,CAAC;AAC3B,QAAM,aAAa,OACf,KAAK,IAAI,GAAG,QAAQ,YAAY,IAChC,KAAK,IAAI,aAAa,YAAY,KAAK,IAAI,GAAG,QAAQ,CAAC,CAAC;AAC5D,QAAM,WAAW,OACb,QACA,KAAK,IAAI,OAAO,KAAK,IAAI,aAAa,GAAG,aAAa,WAAW,CAAC,CAAC;AACvE,QAAM,aACJ,iBAAiB,SACb,kBACA,KAAK,IAAI,iBAAiB,eAAe,oBAAoB;AAEnE,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA,eAAe;AAAA,IACf;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;","names":[]}
+{"version":3,"sources":["../../../../src/components/internal/live-chart/use-live-chart-window.ts"],"sourcesContent":["\"use client\";\n\nimport type { CSSProperties } from \"react\";\nimport { useEffect, useRef, useState } from \"react\";\nimport { useIsomorphicLayoutEffect } from \"../../../hooks/use-isomorphic-layout-effect.js\";\nimport type { VirtualScrollHandle, VirtualScrollRangeChange } from \"../../virtual-scroll/types.js\";\nimport type {\n  LiveChartAxisLabel,\n  UseLiveChartWindowOptions,\n  UseLiveChartWindowResult,\n} from \"./types.js\";\n\n/** The plot's 1.5rem time-axis row below the item viewport (candle-chart.css, line-chart.css). */\nconst TIME_AXIS_ROW_HEIGHT = 24;\n/** The item viewport's 18rem minimum block size, used until the figure is measured. */\nconst MIN_PLOT_HEIGHT = 288;\nconst LIVE_TIME_TICKS = 4;\n\n/**\n * Time ticks pinned to absolute item indices and positioned at slot centers\n * across the whole scrolled content, so labels scroll with their items. Only\n * ticks near the visible slice are returned.\n */\nexport function liveTimeAxis(\n  data: readonly { readonly time: string | number }[],\n  start: number,\n  end: number,\n  visibleCount: number,\n): LiveChartAxisLabel[] {\n  const step = Math.max(1, Math.ceil(visibleCount / LIVE_TIME_TICKS));\n  const labels: LiveChartAxisLabel[] = [];\n  const first = Math.max(0, Math.floor(start / step) - 1) * step;\n  const last = Math.min(data.length, end + step);\n  for (let index = first; index < last; index += step) {\n    labels.push({\n      label: String(data[index]?.time),\n      position: ((index + 0.5) / data.length) * 100,\n    });\n  }\n  return labels;\n}\n\nfunction writeScrollVariable(\n  chart: HTMLElement,\n  scrollVariable: `--${string}`,\n  offset: number,\n  consumerStyle: CSSProperties | undefined,\n): void {\n  const style: CSSProperties & Record<`--${string}`, string | number | undefined> = {\n    [scrollVariable]: `${offset}px`,\n    ...consumerStyle,\n  };\n  const value = style[scrollVariable];\n  if (value === undefined) chart.style.removeProperty(scrollVariable);\n  else chart.style.setProperty(scrollVariable, String(value));\n}\n\n/**\n * Live chart window over a horizontal VirtualScroll: follows appends while the\n * reader is at the newest item, leaves a scrolled-back reader in place, and\n * reports the visible slice. The chart pins the scroll position itself rather\n * than using VirtualScroll's `anchor`, and publishes the offset as a CSS\n * variable so axes and crosshairs scroll without re-rendering.\n */\nexport function useLiveChartWindow(options: UseLiveChartWindowOptions): UseLiveChartWindowResult {\n  const {\n    count,\n    visibleCount = 0,\n    itemWidth,\n    figureHeight,\n    scrollVariable,\n    consumerStyle,\n  } = options;\n  const live = visibleCount > 0;\n  const scrollRef = useRef<VirtualScrollHandle>(null);\n  const chartRef = useRef<HTMLElement | null>(null);\n  const [visibleRange, setVisibleRange] = useState<VirtualScrollRangeChange | null>(null);\n  // True while the reader sits at the newest item; appends then keep it in view.\n  const [following, setFollowing] = useState(true);\n  const contentSize = count * itemWidth;\n  const viewportWidth = itemWidth * visibleCount;\n  const layoutRef = useRef({ contentSize, itemWidth, viewportWidth, consumerStyle });\n  layoutRef.current = { contentSize, itemWidth, viewportWidth, consumerStyle };\n\n  // Publish the scroll offset (a CSS variable, so scrolling re-renders nothing)\n  // and track whether the reader is at the end.\n  useEffect(() => {\n    if (!live) return;\n    const element = scrollRef.current?.element;\n    const chart = chartRef.current;\n    if (!element || !chart) return;\n    const onScroll = (): void => {\n      const offset = element.scrollLeft; // banned-read-ok: scroll position drives the axis offset.\n      const layout = layoutRef.current;\n      writeScrollVariable(chart, scrollVariable, offset, layout.consumerStyle);\n      // Within one item of the end counts: an item appended while the reader\n      // scrolls there moves the end by exactly one item width.\n      setFollowing(\n        offset + layout.viewportWidth >= layout.contentSize - Math.max(1, layout.itemWidth),\n      );\n    };\n    element.addEventListener(\"scroll\", onScroll, { passive: true });\n    return () => element.removeEventListener(\"scroll\", onScroll);\n  }, [live, scrollVariable]);\n\n  // Keep the newest item in view while following: on appends, resizes, and once measured.\n  useIsomorphicLayoutEffect(() => {\n    if (!live || !following) return;\n    const element = scrollRef.current?.element;\n    const chart = chartRef.current;\n    if (!element || !chart) return;\n    const end = Math.max(0, contentSize - viewportWidth);\n    element.scrollLeft = end; // banned-read-ok: pin the newest item before paint.\n    writeScrollVariable(chart, scrollVariable, end, layoutRef.current.consumerStyle);\n  }, [live, following, contentSize, viewportWidth, scrollVariable]);\n\n  // While following, the slice is the tail, so an append rescales in the same\n  // commit that adds the item.\n  const tail = following || !visibleRange;\n  const sliceStart = tail\n    ? Math.max(0, count - visibleCount)\n    : Math.min(visibleRange.startIndex, Math.max(0, count - 1));\n  const sliceEnd = tail\n    ? count\n    : Math.min(count, Math.max(sliceStart + 1, visibleRange.endIndex + 1));\n  const plotHeight =\n    figureHeight === undefined\n      ? MIN_PLOT_HEIGHT\n      : Math.max(MIN_PLOT_HEIGHT, figureHeight - TIME_AXIS_ROW_HEIGHT);\n\n  return {\n    live,\n    scrollRef,\n    chartRef,\n    onRangeChange: setVisibleRange,\n    sliceStart,\n    sliceEnd,\n    contentSize,\n    plotHeight,\n  };\n}\n"],"mappings":";AAGA,SAAS,WAAW,QAAQ,gBAAgB;AAC5C,SAAS,iCAAiC;AAS1C,MAAM,uBAAuB;AAE7B,MAAM,kBAAkB;AACxB,MAAM,kBAAkB;AAOjB,SAAS,aACd,MACA,OACA,KACA,cACsB;AACtB,QAAM,OAAO,KAAK,IAAI,GAAG,KAAK,KAAK,eAAe,eAAe,CAAC;AAClE,QAAM,SAA+B,CAAC;AACtC,QAAM,QAAQ,KAAK,IAAI,GAAG,KAAK,MAAM,QAAQ,IAAI,IAAI,CAAC,IAAI;AAC1D,QAAM,OAAO,KAAK,IAAI,KAAK,QAAQ,MAAM,IAAI;AAC7C,WAAS,QAAQ,OAAO,QAAQ,MAAM,SAAS,MAAM;AACnD,WAAO,KAAK;AAAA,MACV,OAAO,OAAO,KAAK,KAAK,GAAG,IAAI;AAAA,MAC/B,WAAY,QAAQ,OAAO,KAAK,SAAU;AAAA,IAC5C,CAAC;AAAA,EACH;AACA,SAAO;AACT;AAEA,SAAS,oBACP,OACA,gBACA,QACA,eACM;AACN,QAAM,QAA4E;AAAA,IAChF,CAAC,cAAc,GAAG,GAAG,MAAM;AAAA,IAC3B,GAAG;AAAA,EACL;AACA,QAAM,QAAQ,MAAM,cAAc;AAClC,MAAI,UAAU,OAAW,OAAM,MAAM,eAAe,cAAc;AAAA,MAC7D,OAAM,MAAM,YAAY,gBAAgB,OAAO,KAAK,CAAC;AAC5D;AASO,SAAS,mBAAmB,SAA8D;AAC/F,QAAM;AAAA,IACJ;AAAA,IACA,eAAe;AAAA,IACf;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AACJ,QAAM,OAAO,eAAe;AAC5B,QAAM,YAAY,OAA4B,IAAI;AAClD,QAAM,WAAW,OAA2B,IAAI;AAChD,QAAM,CAAC,cAAc,eAAe,IAAI,SAA0C,IAAI;AAEtF,QAAM,CAAC,WAAW,YAAY,IAAI,SAAS,IAAI;AAC/C,QAAM,cAAc,QAAQ;AAC5B,QAAM,gBAAgB,YAAY;AAClC,QAAM,YAAY,OAAO,EAAE,aAAa,WAAW,eAAe,cAAc,CAAC;AACjF,YAAU,UAAU,EAAE,aAAa,WAAW,eAAe,cAAc;AAI3E,YAAU,MAAM;AACd,QAAI,CAAC,KAAM;AACX,UAAM,UAAU,UAAU,SAAS;AACnC,UAAM,QAAQ,SAAS;AACvB,QAAI,CAAC,WAAW,CAAC,MAAO;AACxB,UAAM,WAAW,MAAY;AAC3B,YAAM,SAAS,QAAQ;AACvB,YAAM,SAAS,UAAU;AACzB,0BAAoB,OAAO,gBAAgB,QAAQ,OAAO,aAAa;AAGvE;AAAA,QACE,SAAS,OAAO,iBAAiB,OAAO,cAAc,KAAK,IAAI,GAAG,OAAO,SAAS;AAAA,MACpF;AAAA,IACF;AACA,YAAQ,iBAAiB,UAAU,UAAU,EAAE,SAAS,KAAK,CAAC;AAC9D,WAAO,MAAM,QAAQ,oBAAoB,UAAU,QAAQ;AAAA,EAC7D,GAAG,CAAC,MAAM,cAAc,CAAC;AAGzB,4BAA0B,MAAM;AAC9B,QAAI,CAAC,QAAQ,CAAC,UAAW;AACzB,UAAM,UAAU,UAAU,SAAS;AACnC,UAAM,QAAQ,SAAS;AACvB,QAAI,CAAC,WAAW,CAAC,MAAO;AACxB,UAAM,MAAM,KAAK,IAAI,GAAG,cAAc,aAAa;AACnD,YAAQ,aAAa;AACrB,wBAAoB,OAAO,gBAAgB,KAAK,UAAU,QAAQ,aAAa;AAAA,EACjF,GAAG,CAAC,MAAM,WAAW,aAAa,eAAe,cAAc,CAAC;AAIhE,QAAM,OAAO,aAAa,CAAC;AAC3B,QAAM,aAAa,OACf,KAAK,IAAI,GAAG,QAAQ,YAAY,IAChC,KAAK,IAAI,aAAa,YAAY,KAAK,IAAI,GAAG,QAAQ,CAAC,CAAC;AAC5D,QAAM,WAAW,OACb,QACA,KAAK,IAAI,OAAO,KAAK,IAAI,aAAa,GAAG,aAAa,WAAW,CAAC,CAAC;AACvE,QAAM,aACJ,iBAAiB,SACb,kBACA,KAAK,IAAI,iBAAiB,eAAe,oBAAoB;AAEnE,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA,eAAe;AAAA,IACf;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;","names":[]}

package/dist/components/internal/menu/menu-parts.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"menu-parts.d.ts","sourceRoot":"","sources":["../../../../src/components/internal/menu/menu-parts.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,YAAY,EAAa,MAAM,OAAO,CAAC;AAElE,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,kBAAkB,EAAE,MAAM,YAAY,CAAC;AAsCrF,wBAAgB,SAAS,CAAC,GAAG,SAAS,WAAW,GAAG,KAAK,EACvD,KAAK,EAAE,cAAc,CAAC,GAAG,CAAC,GACzB,YAAY,GAAG,IAAI,CAErB;AAED,wBAAgB,SAAS,CAAC,GAAG,SAAS,WAAW,GAAG,KAAK,EACvD,KAAK,EAAE,cAAc,CAAC,GAAG,CAAC,GACzB,YAAY,GAAG,IAAI,CAErB;AAED,wBAAgB,aAAa,CAAC,GAAG,SAAS,WAAW,GAAG,KAAK,EAC3D,KAAK,EAAE,kBAAkB,CAAC,GAAG,CAAC,GAC7B,YAAY,GAAG,IAAI,CAErB"}
+{"version":3,"file":"menu-parts.d.ts","sourceRoot":"","sources":["../../../../src/components/internal/menu/menu-parts.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,YAAY,EAAa,MAAM,OAAO,CAAC;AAGlE,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,kBAAkB,EAAE,MAAM,YAAY,CAAC;AAkCrF,wBAAgB,SAAS,CAAC,GAAG,SAAS,WAAW,GAAG,KAAK,EACvD,KAAK,EAAE,cAAc,CAAC,GAAG,CAAC,GACzB,YAAY,GAAG,IAAI,CAErB;AACD,wBAAgB,SAAS,CAAC,GAAG,SAAS,WAAW,GAAG,KAAK,EACvD,KAAK,EAAE,cAAc,CAAC,GAAG,CAAC,GACzB,YAAY,GAAG,IAAI,CAErB;AACD,wBAAgB,aAAa,CAAC,GAAG,SAAS,WAAW,GAAG,KAAK,EAC3D,KAAK,EAAE,kBAAkB,CAAC,GAAG,CAAC,GAC7B,YAAY,GAAG,IAAI,CAErB"}

package/dist/components/internal/menu/menu-parts.js

@@ -6,11 +6,11 @@ function useMenuPart(props, options) {
     defaultTag: options.defaultTag,
     render,
     props: {
-      ...consumerProps,
       ...className ? { className } : {},
-      children,
       role: options.role,
-      "data-part": options.part
+      "data-part": options.part,
+      ...consumerProps,
+      children
     },
     state: {}
   });

package/dist/components/internal/menu/menu-parts.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/internal/menu/menu-parts.tsx"],"sourcesContent":["import type { ElementType, ReactElement, ReactNode } from \"react\";\nimport { useRenderElement } from \"@gunkin/uiify/core/render\";\nimport type { MenuGroupProps, MenuLabelProps, MenuSeparatorProps } from \"./types.js\";\n\ninterface MenuPartOptions {\n  readonly defaultTag: ElementType;\n  readonly part: string;\n  readonly role: string;\n}\n\ninterface MenuPartValues {\n  readonly as?: ElementType | undefined;\n  readonly children?: ReactNode;\n  readonly className?: string;\n  readonly render?:\n    | ((props: Record<string, unknown>, state: Record<string, never>) => ReactElement | null)\n    | undefined;\n  readonly [key: string]: unknown;\n}\n\nfunction useMenuPart<TAs extends ElementType>(\n  props: MenuGroupProps<TAs> | MenuLabelProps<TAs> | MenuSeparatorProps<TAs>,\n  options: MenuPartOptions,\n): ReactElement | null {\n  const { as, render, children, className, ...consumerProps } = props as MenuPartValues;\n  return useRenderElement({\n    as,\n    defaultTag: options.defaultTag,\n    render,\n    props: {\n      ...consumerProps,\n      ...(className ? { className } : {}),\n      children,\n      role: options.role,\n      \"data-part\": options.part,\n    },\n    state: {},\n  });\n}\n\nexport function MenuGroup<TAs extends ElementType = \"div\">(\n  props: MenuGroupProps<TAs>,\n): ReactElement | null {\n  return useMenuPart(props, { defaultTag: \"div\", part: \"group\", role: \"group\" });\n}\n\nexport function MenuLabel<TAs extends ElementType = \"div\">(\n  props: MenuLabelProps<TAs>,\n): ReactElement | null {\n  return useMenuPart(props, { defaultTag: \"div\", part: \"label\", role: \"presentation\" });\n}\n\nexport function MenuSeparator<TAs extends ElementType = \"div\">(\n  props: MenuSeparatorProps<TAs>,\n): ReactElement | null {\n  return useMenuPart(props, { defaultTag: \"div\", part: \"separator\", role: \"separator\" });\n}\n"],"mappings":"AACA,SAAS,wBAAwB;AAmBjC,SAAS,YACP,OACA,SACqB;AACrB,QAAM,EAAE,IAAI,QAAQ,UAAU,WAAW,GAAG,cAAc,IAAI;AAC9D,SAAO,iBAAiB;AAAA,IACtB;AAAA,IACA,YAAY,QAAQ;AAAA,IACpB;AAAA,IACA,OAAO;AAAA,MACL,GAAG;AAAA,MACH,GAAI,YAAY,EAAE,UAAU,IAAI,CAAC;AAAA,MACjC;AAAA,MACA,MAAM,QAAQ;AAAA,MACd,aAAa,QAAQ;AAAA,IACvB;AAAA,IACA,OAAO,CAAC;AAAA,EACV,CAAC;AACH;AAEO,SAAS,UACd,OACqB;AACrB,SAAO,YAAY,OAAO,EAAE,YAAY,OAAO,MAAM,SAAS,MAAM,QAAQ,CAAC;AAC/E;AAEO,SAAS,UACd,OACqB;AACrB,SAAO,YAAY,OAAO,EAAE,YAAY,OAAO,MAAM,SAAS,MAAM,eAAe,CAAC;AACtF;AAEO,SAAS,cACd,OACqB;AACrB,SAAO,YAAY,OAAO,EAAE,YAAY,OAAO,MAAM,aAAa,MAAM,YAAY,CAAC;AACvF;","names":[]}
+{"version":3,"sources":["../../../../src/components/internal/menu/menu-parts.tsx"],"sourcesContent":["import type { ElementType, ReactElement, ReactNode } from \"react\";\nimport { useRenderElement } from \"@gunkin/uiify/core/render\";\nimport type { PartName } from \"../../../core/part-names.js\";\nimport type { MenuGroupProps, MenuLabelProps, MenuSeparatorProps } from \"./types.js\";\ninterface MenuPartOptions {\n  readonly defaultTag: ElementType;\n  readonly part: PartName;\n  readonly role: string;\n}\ninterface MenuPartValues {\n  readonly as?: ElementType | undefined;\n  readonly children?: ReactNode;\n  readonly className?: string;\n  readonly render?:\n    | ((props: Record<string, unknown>, state: Record<string, never>) => ReactElement | null)\n    | undefined;\n  readonly [key: string]: unknown;\n}\nfunction useMenuPart<TAs extends ElementType>(\n  props: MenuGroupProps<TAs> | MenuLabelProps<TAs> | MenuSeparatorProps<TAs>,\n  options: MenuPartOptions,\n): ReactElement | null {\n  const { as, render, children, className, ...consumerProps } = props as MenuPartValues;\n  return useRenderElement({\n    as,\n    defaultTag: options.defaultTag,\n    render,\n    props: {\n      ...(className ? { className } : {}),\n      role: options.role,\n      \"data-part\": options.part,\n      ...consumerProps,\n      children,\n    },\n    state: {},\n  });\n}\nexport function MenuGroup<TAs extends ElementType = \"div\">(\n  props: MenuGroupProps<TAs>,\n): ReactElement | null {\n  return useMenuPart(props, { defaultTag: \"div\", part: \"group\", role: \"group\" });\n}\nexport function MenuLabel<TAs extends ElementType = \"div\">(\n  props: MenuLabelProps<TAs>,\n): ReactElement | null {\n  return useMenuPart(props, { defaultTag: \"div\", part: \"label\", role: \"presentation\" });\n}\nexport function MenuSeparator<TAs extends ElementType = \"div\">(\n  props: MenuSeparatorProps<TAs>,\n): ReactElement | null {\n  return useMenuPart(props, { defaultTag: \"div\", part: \"separator\", role: \"separator\" });\n}\n"],"mappings":"AACA,SAAS,wBAAwB;AAiBjC,SAAS,YACP,OACA,SACqB;AACrB,QAAM,EAAE,IAAI,QAAQ,UAAU,WAAW,GAAG,cAAc,IAAI;AAC9D,SAAO,iBAAiB;AAAA,IACtB;AAAA,IACA,YAAY,QAAQ;AAAA,IACpB;AAAA,IACA,OAAO;AAAA,MACL,GAAI,YAAY,EAAE,UAAU,IAAI,CAAC;AAAA,MACjC,MAAM,QAAQ;AAAA,MACd,aAAa,QAAQ;AAAA,MACrB,GAAG;AAAA,MACH;AAAA,IACF;AAAA,IACA,OAAO,CAAC;AAAA,EACV,CAAC;AACH;AACO,SAAS,UACd,OACqB;AACrB,SAAO,YAAY,OAAO,EAAE,YAAY,OAAO,MAAM,SAAS,MAAM,QAAQ,CAAC;AAC/E;AACO,SAAS,UACd,OACqB;AACrB,SAAO,YAAY,OAAO,EAAE,YAAY,OAAO,MAAM,SAAS,MAAM,eAAe,CAAC;AACtF;AACO,SAAS,cACd,OACqB;AACrB,SAAO,YAAY,OAAO,EAAE,YAAY,OAAO,MAAM,aAAa,MAAM,YAAY,CAAC;AACvF;","names":[]}

package/dist/components/internal/menu/types.d.ts

@@ -22,6 +22,7 @@ export interface MenuSelectEvent {
 export interface UseMenuSurfaceOptions {
     readonly align?: AnchorAlign;
     readonly defaultOpen?: boolean;
+    readonly id?: string;
     /** `"auto"` for click-dismissable surfaces, `"manual"` when the compound drives dismissal. */
     readonly mode: "auto" | "manual";
     readonly onOpenChange?: PopoverChangeHandler;

package/dist/components/internal/menu/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/internal/menu/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,oBAAoB,EACpB,WAAW,EACX,cAAc,EACd,SAAS,EACT,SAAS,EACV,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,oCAAoC,CAAC;AAClF,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,4BAA4B,CAAC;AACvE,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,2BAA2B,CAAC;AAEjE,MAAM,WAAW,gBAAgB;IAC/B,QAAQ,CAAC,QAAQ,CAAC,EAAE,SAAS,CAAC;IAC9B,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;CAC7B;AAED,MAAM,MAAM,cAAc,CAAC,GAAG,SAAS,WAAW,GAAG,KAAK,IAAI,eAAe,CAC3E,GAAG,EACH,gBAAgB,EAChB,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,EACrB,WAAW,CACZ,CAAC;AAEF,MAAM,MAAM,cAAc,CAAC,GAAG,SAAS,WAAW,GAAG,KAAK,IAAI,eAAe,CAC3E,GAAG,EACH,gBAAgB,EAChB,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,EACrB,WAAW,CACZ,CAAC;AAEF,MAAM,MAAM,kBAAkB,CAAC,GAAG,SAAS,WAAW,GAAG,KAAK,IAAI,eAAe,CAC/E,GAAG,EACH,IAAI,CAAC,gBAAgB,EAAE,UAAU,CAAC,EAClC,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,EACrB,WAAW,CACZ,CAAC;AAEF;;;;;GAKG;AACH,MAAM,WAAW,eAAe;IAC9B,QAAQ,CAAC,gBAAgB,EAAE,OAAO,CAAC;IACnC,cAAc,IAAI,IAAI,CAAC;CACxB;AAED,MAAM,WAAW,qBAAqB;IACpC,QAAQ,CAAC,KAAK,CAAC,EAAE,WAAW,CAAC;IAC7B,QAAQ,CAAC,WAAW,CAAC,EAAE,OAAO,CAAC;IAC/B,8FAA8F;IAC9F,QAAQ,CAAC,IAAI,EAAE,MAAM,GAAG,QAAQ,CAAC;IACjC,QAAQ,CAAC,YAAY,CAAC,EAAE,oBAAoB,CAAC;IAC7C,QAAQ,CAAC,IAAI,CAAC,EAAE,OAAO,CAAC;IACxB,QAAQ,CAAC,IAAI,CAAC,EAAE,UAAU,CAAC;CAC5B;AAED,MAAM,WAAW,oBAAoB;IACnC,QAAQ,CAAC,WAAW,EAAE,cAAc,CAAC,WAAW,CAAC,CAAC;IAClD,QAAQ,CAAC,KAAK,EAAE,MAAM,IAAI,CAAC;IAC3B,QAAQ,CAAC,UAAU,EAAE,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;IACtD,2DAA2D;IAC3D,QAAQ,CAAC,YAAY,EAAE,MAAM,IAAI,CAAC;IAClC,QAAQ,CAAC,IAAI,EAAE,OAAO,CAAC;IACvB,QAAQ,CAAC,WAAW,EAAE,MAAM,IAAI,CAAC;IACjC,2EAA2E;IAC3E,QAAQ,CAAC,UAAU,EAAE,CAAC,IAAI,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IAC9C,QAAQ,CAAC,UAAU,EAAE,cAAc,CAAC,WAAW,CAAC,CAAC;IACjD,QAAQ,CAAC,QAAQ,EAAE,CAAC,OAAO,EAAE,WAAW,GAAG,IAAI,KAAK,IAAI,CAAC;IACzD,QAAQ,CAAC,eAAe,EAAE,cAAc,CAAC,WAAW,CAAC,CAAC;IACtD,QAAQ,CAAC,iBAAiB,EAAE,CAAC,OAAO,EAAE,WAAW,GAAG,IAAI,KAAK,IAAI,CAAC;IAClE,QAAQ,CAAC,YAAY,EAAE,oBAAoB,CAAC,iBAAiB,CAAC,CAAC;IAC/D,QAAQ,CAAC,UAAU,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;CACpD"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/internal/menu/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,oBAAoB,EACpB,WAAW,EACX,cAAc,EACd,SAAS,EACT,SAAS,EACV,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,oCAAoC,CAAC;AAClF,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,4BAA4B,CAAC;AACvE,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,2BAA2B,CAAC;AAEjE,MAAM,WAAW,gBAAgB;IAC/B,QAAQ,CAAC,QAAQ,CAAC,EAAE,SAAS,CAAC;IAC9B,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;CAC7B;AAED,MAAM,MAAM,cAAc,CAAC,GAAG,SAAS,WAAW,GAAG,KAAK,IAAI,eAAe,CAC3E,GAAG,EACH,gBAAgB,EAChB,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,EACrB,WAAW,CACZ,CAAC;AAEF,MAAM,MAAM,cAAc,CAAC,GAAG,SAAS,WAAW,GAAG,KAAK,IAAI,eAAe,CAC3E,GAAG,EACH,gBAAgB,EAChB,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,EACrB,WAAW,CACZ,CAAC;AAEF,MAAM,MAAM,kBAAkB,CAAC,GAAG,SAAS,WAAW,GAAG,KAAK,IAAI,eAAe,CAC/E,GAAG,EACH,IAAI,CAAC,gBAAgB,EAAE,UAAU,CAAC,EAClC,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,EACrB,WAAW,CACZ,CAAC;AAEF;;;;;GAKG;AACH,MAAM,WAAW,eAAe;IAC9B,QAAQ,CAAC,gBAAgB,EAAE,OAAO,CAAC;IACnC,cAAc,IAAI,IAAI,CAAC;CACxB;AAED,MAAM,WAAW,qBAAqB;IACpC,QAAQ,CAAC,KAAK,CAAC,EAAE,WAAW,CAAC;IAC7B,QAAQ,CAAC,WAAW,CAAC,EAAE,OAAO,CAAC;IAC/B,QAAQ,CAAC,EAAE,CAAC,EAAE,MAAM,CAAC;IACrB,8FAA8F;IAC9F,QAAQ,CAAC,IAAI,EAAE,MAAM,GAAG,QAAQ,CAAC;IACjC,QAAQ,CAAC,YAAY,CAAC,EAAE,oBAAoB,CAAC;IAC7C,QAAQ,CAAC,IAAI,CAAC,EAAE,OAAO,CAAC;IACxB,QAAQ,CAAC,IAAI,CAAC,EAAE,UAAU,CAAC;CAC5B;AAED,MAAM,WAAW,oBAAoB;IACnC,QAAQ,CAAC,WAAW,EAAE,cAAc,CAAC,WAAW,CAAC,CAAC;IAClD,QAAQ,CAAC,KAAK,EAAE,MAAM,IAAI,CAAC;IAC3B,QAAQ,CAAC,UAAU,EAAE,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;IACtD,2DAA2D;IAC3D,QAAQ,CAAC,YAAY,EAAE,MAAM,IAAI,CAAC;IAClC,QAAQ,CAAC,IAAI,EAAE,OAAO,CAAC;IACvB,QAAQ,CAAC,WAAW,EAAE,MAAM,IAAI,CAAC;IACjC,2EAA2E;IAC3E,QAAQ,CAAC,UAAU,EAAE,CAAC,IAAI,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IAC9C,QAAQ,CAAC,UAAU,EAAE,cAAc,CAAC,WAAW,CAAC,CAAC;IACjD,QAAQ,CAAC,QAAQ,EAAE,CAAC,OAAO,EAAE,WAAW,GAAG,IAAI,KAAK,IAAI,CAAC;IACzD,QAAQ,CAAC,eAAe,EAAE,cAAc,CAAC,WAAW,CAAC,CAAC;IACtD,QAAQ,CAAC,iBAAiB,EAAE,CAAC,OAAO,EAAE,WAAW,GAAG,IAAI,KAAK,IAAI,CAAC;IAClE,QAAQ,CAAC,YAAY,EAAE,oBAAoB,CAAC,iBAAiB,CAAC,CAAC;IAC/D,QAAQ,CAAC,UAAU,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;CACpD"}

package/dist/components/internal/menu/use-menu-surface.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use-menu-surface.d.ts","sourceRoot":"","sources":["../../../../src/components/internal/menu/use-menu-surface.ts"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,qBAAqB,EAAE,oBAAoB,EAAE,MAAM,YAAY,CAAC;AAE9E;;;;;;;;GAQG;AACH,wBAAgB,cAAc,CAAC,OAAO,EAAE,qBAAqB,GAAG,oBAAoB,CAkDnF"}
+{"version":3,"file":"use-menu-surface.d.ts","sourceRoot":"","sources":["../../../../src/components/internal/menu/use-menu-surface.ts"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,qBAAqB,EAAE,oBAAoB,EAAE,MAAM,YAAY,CAAC;AAE9E;;;;;;;;GAQG;AACH,wBAAgB,cAAc,CAAC,OAAO,EAAE,qBAAqB,GAAG,oBAAoB,CAmDnF"}

package/dist/components/internal/menu/use-menu-surface.js

@@ -5,10 +5,11 @@ import { usePopover } from "@gunkin/uiify/core/popover";
 import { useIsomorphicLayoutEffect } from "@gunkin/uiify/hooks";
 import { focusMenuItem } from "./focus-menu-item.js";
 function useMenuSurface(options) {
-  const { align, defaultOpen, mode, onOpenChange, open, side } = options;
+  const { align, defaultOpen, id, mode, onOpenChange, open, side } = options;
   const triggerRef = useRef(null);
   const contentRef = useRef(null);
   const popover = usePopover({
+    ...id !== void 0 ? { id } : {},
     mode,
     ...defaultOpen !== void 0 ? { defaultOpen } : {},
     ...open !== void 0 ? { open } : {},

package/dist/components/internal/menu/use-menu-surface.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/internal/menu/use-menu-surface.ts"],"sourcesContent":["\"use client\";\n\nimport { useCallback, useRef } from \"react\";\nimport { useAnchorPosition } from \"@gunkin/uiify/core/anchor-position\";\nimport { usePopover } from \"@gunkin/uiify/core/popover\";\nimport { useIsomorphicLayoutEffect } from \"@gunkin/uiify/hooks\";\nimport { focusMenuItem } from \"./focus-menu-item.js\";\nimport type { UseMenuSurfaceOptions, UseMenuSurfaceReturn } from \"./types.js\";\n\n/**\n * Shared body of DropdownMenu and ContextMenu's per-menu state: a popover\n * surface anchored to its invoker, with focus management for opening into the\n * item list and returning to the trigger.\n *\n * `anchorRef`/`positionerRef` are deliberately not part of the return value —\n * `useAnchorPosition` returns no-op refs for both (see core/use-anchor-position.ts),\n * so the menu compounds were merging them into their DOM ref for nothing.\n */\nexport function useMenuSurface(options: UseMenuSurfaceOptions): UseMenuSurfaceReturn {\n  const { align, defaultOpen, mode, onOpenChange, open, side } = options;\n  const triggerRef = useRef<HTMLElement | null>(null);\n  const contentRef = useRef<HTMLDivElement | null>(null);\n  const popover = usePopover({\n    mode,\n    ...(defaultOpen !== undefined ? { defaultOpen } : {}),\n    ...(open !== undefined ? { open } : {}),\n    ...(onOpenChange ? { onOpenChange } : {}),\n  });\n  const anchor = useAnchorPosition({\n    ...(align !== undefined ? { align } : {}),\n    ...(side !== undefined ? { side } : {}),\n  });\n\n  const focusTrigger = useCallback(() => {\n    triggerRef.current?.focus({ preventScroll: true });\n  }, []);\n\n  const setTriggerElement = useCallback((element: HTMLElement | null) => {\n    triggerRef.current = element;\n  }, []);\n\n  useIsomorphicLayoutEffect(() => {\n    if (popover.open) focusMenuItem(contentRef.current);\n  }, [popover.open]);\n\n  const openToItem = useCallback(\n    (last?: boolean) => {\n      if (!popover.open) popover.openPopover();\n      queueMicrotask(() => focusMenuItem(contentRef.current, last !== undefined ? { last } : {}));\n    },\n    [popover],\n  );\n\n  return {\n    anchorProps: anchor.anchorProps,\n    close: popover.close,\n    contentRef,\n    focusTrigger,\n    open: popover.open,\n    openPopover: popover.openPopover,\n    openToItem,\n    popupProps: popover.popupProps,\n    popupRef: popover.popupRef,\n    positionerProps: anchor.positionerProps,\n    setTriggerElement,\n    triggerProps: popover.triggerProps,\n    triggerRef,\n  };\n}\n"],"mappings":";AAEA,SAAS,aAAa,cAAc;AACpC,SAAS,yBAAyB;AAClC,SAAS,kBAAkB;AAC3B,SAAS,iCAAiC;AAC1C,SAAS,qBAAqB;AAYvB,SAAS,eAAe,SAAsD;AACnF,QAAM,EAAE,OAAO,aAAa,MAAM,cAAc,MAAM,KAAK,IAAI;AAC/D,QAAM,aAAa,OAA2B,IAAI;AAClD,QAAM,aAAa,OAA8B,IAAI;AACrD,QAAM,UAAU,WAAW;AAAA,IACzB;AAAA,IACA,GAAI,gBAAgB,SAAY,EAAE,YAAY,IAAI,CAAC;AAAA,IACnD,GAAI,SAAS,SAAY,EAAE,KAAK,IAAI,CAAC;AAAA,IACrC,GAAI,eAAe,EAAE,aAAa,IAAI,CAAC;AAAA,EACzC,CAAC;AACD,QAAM,SAAS,kBAAkB;AAAA,IAC/B,GAAI,UAAU,SAAY,EAAE,MAAM,IAAI,CAAC;AAAA,IACvC,GAAI,SAAS,SAAY,EAAE,KAAK,IAAI,CAAC;AAAA,EACvC,CAAC;AAED,QAAM,eAAe,YAAY,MAAM;AACrC,eAAW,SAAS,MAAM,EAAE,eAAe,KAAK,CAAC;AAAA,EACnD,GAAG,CAAC,CAAC;AAEL,QAAM,oBAAoB,YAAY,CAAC,YAAgC;AACrE,eAAW,UAAU;AAAA,EACvB,GAAG,CAAC,CAAC;AAEL,4BAA0B,MAAM;AAC9B,QAAI,QAAQ,KAAM,eAAc,WAAW,OAAO;AAAA,EACpD,GAAG,CAAC,QAAQ,IAAI,CAAC;AAEjB,QAAM,aAAa;AAAA,IACjB,CAAC,SAAmB;AAClB,UAAI,CAAC,QAAQ,KAAM,SAAQ,YAAY;AACvC,qBAAe,MAAM,cAAc,WAAW,SAAS,SAAS,SAAY,EAAE,KAAK,IAAI,CAAC,CAAC,CAAC;AAAA,IAC5F;AAAA,IACA,CAAC,OAAO;AAAA,EACV;AAEA,SAAO;AAAA,IACL,aAAa,OAAO;AAAA,IACpB,OAAO,QAAQ;AAAA,IACf;AAAA,IACA;AAAA,IACA,MAAM,QAAQ;AAAA,IACd,aAAa,QAAQ;AAAA,IACrB;AAAA,IACA,YAAY,QAAQ;AAAA,IACpB,UAAU,QAAQ;AAAA,IAClB,iBAAiB,OAAO;AAAA,IACxB;AAAA,IACA,cAAc,QAAQ;AAAA,IACtB;AAAA,EACF;AACF;","names":[]}
+{"version":3,"sources":["../../../../src/components/internal/menu/use-menu-surface.ts"],"sourcesContent":["\"use client\";\n\nimport { useCallback, useRef } from \"react\";\nimport { useAnchorPosition } from \"@gunkin/uiify/core/anchor-position\";\nimport { usePopover } from \"@gunkin/uiify/core/popover\";\nimport { useIsomorphicLayoutEffect } from \"@gunkin/uiify/hooks\";\nimport { focusMenuItem } from \"./focus-menu-item.js\";\nimport type { UseMenuSurfaceOptions, UseMenuSurfaceReturn } from \"./types.js\";\n\n/**\n * Shared body of DropdownMenu and ContextMenu's per-menu state: a popover\n * surface anchored to its invoker, with focus management for opening into the\n * item list and returning to the trigger.\n *\n * `anchorRef`/`positionerRef` are deliberately not part of the return value —\n * `useAnchorPosition` returns no-op refs for both (see core/use-anchor-position.ts),\n * so the menu compounds were merging them into their DOM ref for nothing.\n */\nexport function useMenuSurface(options: UseMenuSurfaceOptions): UseMenuSurfaceReturn {\n  const { align, defaultOpen, id, mode, onOpenChange, open, side } = options;\n  const triggerRef = useRef<HTMLElement | null>(null);\n  const contentRef = useRef<HTMLDivElement | null>(null);\n  const popover = usePopover({\n    ...(id !== undefined ? { id } : {}),\n    mode,\n    ...(defaultOpen !== undefined ? { defaultOpen } : {}),\n    ...(open !== undefined ? { open } : {}),\n    ...(onOpenChange ? { onOpenChange } : {}),\n  });\n  const anchor = useAnchorPosition({\n    ...(align !== undefined ? { align } : {}),\n    ...(side !== undefined ? { side } : {}),\n  });\n\n  const focusTrigger = useCallback(() => {\n    triggerRef.current?.focus({ preventScroll: true });\n  }, []);\n\n  const setTriggerElement = useCallback((element: HTMLElement | null) => {\n    triggerRef.current = element;\n  }, []);\n\n  useIsomorphicLayoutEffect(() => {\n    if (popover.open) focusMenuItem(contentRef.current);\n  }, [popover.open]);\n\n  const openToItem = useCallback(\n    (last?: boolean) => {\n      if (!popover.open) popover.openPopover();\n      queueMicrotask(() => focusMenuItem(contentRef.current, last !== undefined ? { last } : {}));\n    },\n    [popover],\n  );\n\n  return {\n    anchorProps: anchor.anchorProps,\n    close: popover.close,\n    contentRef,\n    focusTrigger,\n    open: popover.open,\n    openPopover: popover.openPopover,\n    openToItem,\n    popupProps: popover.popupProps,\n    popupRef: popover.popupRef,\n    positionerProps: anchor.positionerProps,\n    setTriggerElement,\n    triggerProps: popover.triggerProps,\n    triggerRef,\n  };\n}\n"],"mappings":";AAEA,SAAS,aAAa,cAAc;AACpC,SAAS,yBAAyB;AAClC,SAAS,kBAAkB;AAC3B,SAAS,iCAAiC;AAC1C,SAAS,qBAAqB;AAYvB,SAAS,eAAe,SAAsD;AACnF,QAAM,EAAE,OAAO,aAAa,IAAI,MAAM,cAAc,MAAM,KAAK,IAAI;AACnE,QAAM,aAAa,OAA2B,IAAI;AAClD,QAAM,aAAa,OAA8B,IAAI;AACrD,QAAM,UAAU,WAAW;AAAA,IACzB,GAAI,OAAO,SAAY,EAAE,GAAG,IAAI,CAAC;AAAA,IACjC;AAAA,IACA,GAAI,gBAAgB,SAAY,EAAE,YAAY,IAAI,CAAC;AAAA,IACnD,GAAI,SAAS,SAAY,EAAE,KAAK,IAAI,CAAC;AAAA,IACrC,GAAI,eAAe,EAAE,aAAa,IAAI,CAAC;AAAA,EACzC,CAAC;AACD,QAAM,SAAS,kBAAkB;AAAA,IAC/B,GAAI,UAAU,SAAY,EAAE,MAAM,IAAI,CAAC;AAAA,IACvC,GAAI,SAAS,SAAY,EAAE,KAAK,IAAI,CAAC;AAAA,EACvC,CAAC;AAED,QAAM,eAAe,YAAY,MAAM;AACrC,eAAW,SAAS,MAAM,EAAE,eAAe,KAAK,CAAC;AAAA,EACnD,GAAG,CAAC,CAAC;AAEL,QAAM,oBAAoB,YAAY,CAAC,YAAgC;AACrE,eAAW,UAAU;AAAA,EACvB,GAAG,CAAC,CAAC;AAEL,4BAA0B,MAAM;AAC9B,QAAI,QAAQ,KAAM,eAAc,WAAW,OAAO;AAAA,EACpD,GAAG,CAAC,QAAQ,IAAI,CAAC;AAEjB,QAAM,aAAa;AAAA,IACjB,CAAC,SAAmB;AAClB,UAAI,CAAC,QAAQ,KAAM,SAAQ,YAAY;AACvC,qBAAe,MAAM,cAAc,WAAW,SAAS,SAAS,SAAY,EAAE,KAAK,IAAI,CAAC,CAAC,CAAC;AAAA,IAC5F;AAAA,IACA,CAAC,OAAO;AAAA,EACV;AAEA,SAAO;AAAA,IACL,aAAa,OAAO;AAAA,IACpB,OAAO,QAAQ;AAAA,IACf;AAAA,IACA;AAAA,IACA,MAAM,QAAQ;AAAA,IACd,aAAa,QAAQ;AAAA,IACrB;AAAA,IACA,YAAY,QAAQ;AAAA,IACpB,UAAU,QAAQ;AAAA,IAClB,iBAAiB,OAAO;AAAA,IACxB;AAAA,IACA,cAAc,QAAQ;AAAA,IACtB;AAAA,EACF;AACF;","names":[]}

package/dist/components/internal/native-check-control/NativeCheckControl.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"NativeCheckControl.d.ts","sourceRoot":"","sources":["../../../../src/components/internal/native-check-control/NativeCheckControl.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAe,YAAY,EAAE,MAAM,OAAO,CAAC;AACvD,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,YAAY,CAAC;AAE1D,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,uBAAuB,GAAG,YAAY,CAkE/E;yBAlEe,kBAAkB"}
+{"version":3,"file":"NativeCheckControl.d.ts","sourceRoot":"","sources":["../../../../src/components/internal/native-check-control/NativeCheckControl.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAe,YAAY,EAAE,MAAM,OAAO,CAAC;AAIvD,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,YAAY,CAAC;AAE1D,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,uBAAuB,GAAG,YAAY,CAuE/E;yBAvEe,kBAAkB"}

package/dist/components/internal/native-check-control/NativeCheckControl.js

@@ -1,6 +1,9 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useEffect, useRef, useState } from "react";
+import { useMergedRefs } from "@gunkin/uiify/hooks";
+import { composeEventHandlers } from "@gunkin/uiify/core/compose-event-handlers";
+import { mergeRepeatedSlotProps } from "../../../core/slot-props.js";
 function NativeCheckControl(props) {
   const {
     checked,
@@ -11,12 +14,16 @@ function NativeCheckControl(props) {
     name,
     onCheckedChange,
     className,
+    slotProps,
     value,
     "aria-label": ariaLabel
   } = props;
   const isControlled = checked !== void 0;
   const [uncontrolledChecked, setUncontrolledChecked] = useState(defaultChecked ?? false);
   const inputRef = useRef(null);
+  const inputProps = slotProps?.input ?? {};
+  const labelProps = mergeRepeatedSlotProps({ className }, slotProps?.label);
+  const mergedInputRef = useMergedRefs(inputProps.ref, inputRef);
   const checkedValue = isControlled ? checked === true : uncontrolledChecked;
   useEffect(() => {
     if (inputRef.current) inputRef.current.indeterminate = checked === "indeterminate";
@@ -41,14 +48,15 @@ function NativeCheckControl(props) {
       disabled: disabled || void 0,
       id,
       name,
-      onChange: handleChange,
-      ref: inputRef,
       type: "checkbox",
       value,
-      ...label === void 0 ? { "data-uiify-checkbox": "" } : { "data-part": "control" }
+      ...label === void 0 ? { "data-uiify-checkbox": "" } : { "data-part": "control" },
+      ...inputProps,
+      onChange: composeEventHandlers(inputProps.onChange, handleChange),
+      ref: mergedInputRef
     }
   );
-  return label === void 0 ? input : /* @__PURE__ */ jsxs("label", { className, "data-uiify-checkbox": "", id: `${id}-label`, children: [
+  return label === void 0 ? input : /* @__PURE__ */ jsxs("label", { "data-uiify-checkbox": "", id: `${id}-label`, ...labelProps, children: [
     input,
     label
   ] });

package/dist/components/internal/native-check-control/NativeCheckControl.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/internal/native-check-control/NativeCheckControl.tsx"],"sourcesContent":["\"use client\";\n\nimport { useEffect, useRef, useState } from \"react\";\nimport type { ChangeEvent, ReactElement } from \"react\";\nimport type { NativeCheckControlProps } from \"./types.js\";\n\nexport function NativeCheckControl(props: NativeCheckControlProps): ReactElement {\n  const {\n    checked,\n    defaultChecked,\n    disabled = false,\n    id,\n    label,\n    name,\n    onCheckedChange,\n    className,\n    value,\n    \"aria-label\": ariaLabel,\n  } = props;\n  const isControlled = checked !== undefined;\n  const [uncontrolledChecked, setUncontrolledChecked] = useState(defaultChecked ?? false);\n  const inputRef = useRef<HTMLInputElement | null>(null);\n  const checkedValue = isControlled ? checked === true : uncontrolledChecked;\n\n  useEffect(() => {\n    if (inputRef.current) inputRef.current.indeterminate = checked === \"indeterminate\";\n  }, [checked]);\n\n  const handleChange = (event: ChangeEvent<HTMLInputElement>) => {\n    if (checked === \"indeterminate\" && inputRef.current) {\n      inputRef.current.indeterminate = true;\n    }\n    if (!isControlled) setUncontrolledChecked(event.currentTarget.checked);\n    onCheckedChange?.(event.currentTarget.checked);\n  };\n\n  const input = (\n    <input\n      aria-checked={checked === \"indeterminate\" ? \"mixed\" : undefined}\n      aria-label={label === undefined ? ariaLabel : undefined}\n      aria-labelledby={label !== undefined ? `${id}-label` : undefined}\n      checked={isControlled ? checkedValue : undefined}\n      data-disabled={disabled ? \"\" : undefined}\n      data-state={\n        isControlled\n          ? checked === \"indeterminate\"\n            ? \"indeterminate\"\n            : checkedValue\n              ? \"checked\"\n              : \"unchecked\"\n          : undefined\n      }\n      defaultChecked={!isControlled ? defaultChecked : undefined}\n      disabled={disabled || undefined}\n      id={id}\n      name={name}\n      onChange={handleChange}\n      ref={inputRef}\n      type=\"checkbox\"\n      value={value}\n      {...(label === undefined ? { \"data-uiify-checkbox\": \"\" } : { \"data-part\": \"control\" })}\n    />\n  );\n\n  return label === undefined ? (\n    input\n  ) : (\n    <label className={className} data-uiify-checkbox=\"\" id={`${id}-label`}>\n      {input}\n      {label}\n    </label>\n  );\n}\nNativeCheckControl.displayName = \"NativeCheckControl\";\n"],"mappings":";AAqCI,cA8BA,YA9BA;AAnCJ,SAAS,WAAW,QAAQ,gBAAgB;AAIrC,SAAS,mBAAmB,OAA8C;AAC/E,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA,WAAW;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,cAAc;AAAA,EAChB,IAAI;AACJ,QAAM,eAAe,YAAY;AACjC,QAAM,CAAC,qBAAqB,sBAAsB,IAAI,SAAS,kBAAkB,KAAK;AACtF,QAAM,WAAW,OAAgC,IAAI;AACrD,QAAM,eAAe,eAAe,YAAY,OAAO;AAEvD,YAAU,MAAM;AACd,QAAI,SAAS,QAAS,UAAS,QAAQ,gBAAgB,YAAY;AAAA,EACrE,GAAG,CAAC,OAAO,CAAC;AAEZ,QAAM,eAAe,CAAC,UAAyC;AAC7D,QAAI,YAAY,mBAAmB,SAAS,SAAS;AACnD,eAAS,QAAQ,gBAAgB;AAAA,IACnC;AACA,QAAI,CAAC,aAAc,wBAAuB,MAAM,cAAc,OAAO;AACrE,sBAAkB,MAAM,cAAc,OAAO;AAAA,EAC/C;AAEA,QAAM,QACJ;AAAA,IAAC;AAAA;AAAA,MACC,gBAAc,YAAY,kBAAkB,UAAU;AAAA,MACtD,cAAY,UAAU,SAAY,YAAY;AAAA,MAC9C,mBAAiB,UAAU,SAAY,GAAG,EAAE,WAAW;AAAA,MACvD,SAAS,eAAe,eAAe;AAAA,MACvC,iBAAe,WAAW,KAAK;AAAA,MAC/B,cACE,eACI,YAAY,kBACV,kBACA,eACE,YACA,cACJ;AAAA,MAEN,gBAAgB,CAAC,eAAe,iBAAiB;AAAA,MACjD,UAAU,YAAY;AAAA,MACtB;AAAA,MACA;AAAA,MACA,UAAU;AAAA,MACV,KAAK;AAAA,MACL,MAAK;AAAA,MACL;AAAA,MACC,GAAI,UAAU,SAAY,EAAE,uBAAuB,GAAG,IAAI,EAAE,aAAa,UAAU;AAAA;AAAA,EACtF;AAGF,SAAO,UAAU,SACf,QAEA,qBAAC,WAAM,WAAsB,uBAAoB,IAAG,IAAI,GAAG,EAAE,UAC1D;AAAA;AAAA,IACA;AAAA,KACH;AAEJ;AACA,mBAAmB,cAAc;","names":[]}
+{"version":3,"sources":["../../../../src/components/internal/native-check-control/NativeCheckControl.tsx"],"sourcesContent":["\"use client\";\n\nimport { useEffect, useRef, useState } from \"react\";\nimport type { ChangeEvent, ReactElement } from \"react\";\nimport { useMergedRefs } from \"@gunkin/uiify/hooks\";\nimport { composeEventHandlers } from \"@gunkin/uiify/core/compose-event-handlers\";\nimport { mergeRepeatedSlotProps } from \"../../../core/slot-props.js\";\nimport type { NativeCheckControlProps } from \"./types.js\";\n\nexport function NativeCheckControl(props: NativeCheckControlProps): ReactElement {\n  const {\n    checked,\n    defaultChecked,\n    disabled = false,\n    id,\n    label,\n    name,\n    onCheckedChange,\n    className,\n    slotProps,\n    value,\n    \"aria-label\": ariaLabel,\n  } = props;\n  const isControlled = checked !== undefined;\n  const [uncontrolledChecked, setUncontrolledChecked] = useState(defaultChecked ?? false);\n  const inputRef = useRef<HTMLInputElement | null>(null);\n  const inputProps = slotProps?.input ?? {};\n  const labelProps = mergeRepeatedSlotProps({ className }, slotProps?.label);\n  const mergedInputRef = useMergedRefs(inputProps.ref, inputRef);\n  const checkedValue = isControlled ? checked === true : uncontrolledChecked;\n\n  useEffect(() => {\n    if (inputRef.current) inputRef.current.indeterminate = checked === \"indeterminate\";\n  }, [checked]);\n\n  const handleChange = (event: ChangeEvent<HTMLInputElement>) => {\n    if (checked === \"indeterminate\" && inputRef.current) {\n      inputRef.current.indeterminate = true;\n    }\n    if (!isControlled) setUncontrolledChecked(event.currentTarget.checked);\n    onCheckedChange?.(event.currentTarget.checked);\n  };\n\n  const input = (\n    <input\n      aria-checked={checked === \"indeterminate\" ? \"mixed\" : undefined}\n      aria-label={label === undefined ? ariaLabel : undefined}\n      aria-labelledby={label !== undefined ? `${id}-label` : undefined}\n      checked={isControlled ? checkedValue : undefined}\n      data-disabled={disabled ? \"\" : undefined}\n      data-state={\n        isControlled\n          ? checked === \"indeterminate\"\n            ? \"indeterminate\"\n            : checkedValue\n              ? \"checked\"\n              : \"unchecked\"\n          : undefined\n      }\n      defaultChecked={!isControlled ? defaultChecked : undefined}\n      disabled={disabled || undefined}\n      id={id}\n      name={name}\n      type=\"checkbox\"\n      value={value}\n      {...(label === undefined ? { \"data-uiify-checkbox\": \"\" } : { \"data-part\": \"control\" })}\n      {...inputProps}\n      onChange={composeEventHandlers(inputProps.onChange, handleChange)}\n      ref={mergedInputRef}\n    />\n  );\n\n  return label === undefined ? (\n    input\n  ) : (\n    <label data-uiify-checkbox=\"\" id={`${id}-label`} {...labelProps}>\n      {input}\n      {label}\n    </label>\n  );\n}\nNativeCheckControl.displayName = \"NativeCheckControl\";\n"],"mappings":";AA4CI,cA+BA,YA/BA;AA1CJ,SAAS,WAAW,QAAQ,gBAAgB;AAE5C,SAAS,qBAAqB;AAC9B,SAAS,4BAA4B;AACrC,SAAS,8BAA8B;AAGhC,SAAS,mBAAmB,OAA8C;AAC/E,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA,WAAW;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,cAAc;AAAA,EAChB,IAAI;AACJ,QAAM,eAAe,YAAY;AACjC,QAAM,CAAC,qBAAqB,sBAAsB,IAAI,SAAS,kBAAkB,KAAK;AACtF,QAAM,WAAW,OAAgC,IAAI;AACrD,QAAM,aAAa,WAAW,SAAS,CAAC;AACxC,QAAM,aAAa,uBAAuB,EAAE,UAAU,GAAG,WAAW,KAAK;AACzE,QAAM,iBAAiB,cAAc,WAAW,KAAK,QAAQ;AAC7D,QAAM,eAAe,eAAe,YAAY,OAAO;AAEvD,YAAU,MAAM;AACd,QAAI,SAAS,QAAS,UAAS,QAAQ,gBAAgB,YAAY;AAAA,EACrE,GAAG,CAAC,OAAO,CAAC;AAEZ,QAAM,eAAe,CAAC,UAAyC;AAC7D,QAAI,YAAY,mBAAmB,SAAS,SAAS;AACnD,eAAS,QAAQ,gBAAgB;AAAA,IACnC;AACA,QAAI,CAAC,aAAc,wBAAuB,MAAM,cAAc,OAAO;AACrE,sBAAkB,MAAM,cAAc,OAAO;AAAA,EAC/C;AAEA,QAAM,QACJ;AAAA,IAAC;AAAA;AAAA,MACC,gBAAc,YAAY,kBAAkB,UAAU;AAAA,MACtD,cAAY,UAAU,SAAY,YAAY;AAAA,MAC9C,mBAAiB,UAAU,SAAY,GAAG,EAAE,WAAW;AAAA,MACvD,SAAS,eAAe,eAAe;AAAA,MACvC,iBAAe,WAAW,KAAK;AAAA,MAC/B,cACE,eACI,YAAY,kBACV,kBACA,eACE,YACA,cACJ;AAAA,MAEN,gBAAgB,CAAC,eAAe,iBAAiB;AAAA,MACjD,UAAU,YAAY;AAAA,MACtB;AAAA,MACA;AAAA,MACA,MAAK;AAAA,MACL;AAAA,MACC,GAAI,UAAU,SAAY,EAAE,uBAAuB,GAAG,IAAI,EAAE,aAAa,UAAU;AAAA,MACnF,GAAG;AAAA,MACJ,UAAU,qBAAqB,WAAW,UAAU,YAAY;AAAA,MAChE,KAAK;AAAA;AAAA,EACP;AAGF,SAAO,UAAU,SACf,QAEA,qBAAC,WAAM,uBAAoB,IAAG,IAAI,GAAG,EAAE,UAAW,GAAG,YAClD;AAAA;AAAA,IACA;AAAA,KACH;AAEJ;AACA,mBAAmB,cAAc;","names":[]}

package/dist/components/internal/native-check-control/types.d.ts

@@ -1,5 +1,10 @@
 import type { ReactNode } from "react";
+import type { SlotProps } from "../../../core/slot-props.js";
 export type CheckedState = boolean | "indeterminate";
+export interface NativeCheckControlSlotProps {
+    readonly input?: SlotProps<"input">;
+    readonly label?: SlotProps<"label">;
+}
 export interface NativeCheckControlProps {
     readonly id: string;
     readonly label?: ReactNode;
@@ -10,6 +15,7 @@ export interface NativeCheckControlProps {
     readonly value?: string;
     readonly className?: string;
     readonly onCheckedChange?: (checked: boolean) => void;
+    readonly slotProps?: NativeCheckControlSlotProps;
     readonly "aria-label"?: string;
 }
 //# sourceMappingURL=types.d.ts.map

package/dist/components/internal/native-check-control/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/internal/native-check-control/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,MAAM,MAAM,YAAY,GAAG,OAAO,GAAG,eAAe,CAAC;AAErD,MAAM,WAAW,uBAAuB;IACtC,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,KAAK,CAAC,EAAE,SAAS,CAAC;IAC3B,QAAQ,CAAC,OAAO,CAAC,EAAE,YAAY,CAAC;IAChC,QAAQ,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC;IAClC,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAC5B,QAAQ,CAAC,IAAI,CAAC,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,CAAC;IACxB,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;IAC5B,QAAQ,CAAC,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IACtD,QAAQ,CAAC,YAAY,CAAC,EAAE,MAAM,CAAC;CAChC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/internal/native-check-control/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,6BAA6B,CAAC;AAE7D,MAAM,MAAM,YAAY,GAAG,OAAO,GAAG,eAAe,CAAC;AAErD,MAAM,WAAW,2BAA2B;IAC1C,QAAQ,CAAC,KAAK,CAAC,EAAE,SAAS,CAAC,OAAO,CAAC,CAAC;IACpC,QAAQ,CAAC,KAAK,CAAC,EAAE,SAAS,CAAC,OAAO,CAAC,CAAC;CACrC;AAED,MAAM,WAAW,uBAAuB;IACtC,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,KAAK,CAAC,EAAE,SAAS,CAAC;IAC3B,QAAQ,CAAC,OAAO,CAAC,EAAE,YAAY,CAAC;IAChC,QAAQ,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC;IAClC,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAC5B,QAAQ,CAAC,IAAI,CAAC,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,CAAC;IACxB,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;IAC5B,QAAQ,CAAC,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IACtD,QAAQ,CAAC,SAAS,CAAC,EAAE,2BAA2B,CAAC;IACjD,QAAQ,CAAC,YAAY,CAAC,EAAE,MAAM,CAAC;CAChC"}

package/dist/components/line-chart/LineChart.d.ts

@@ -1,7 +1,7 @@
 import type { ElementType, ReactElement } from "react";
 import type { LineChartPointProps, LineChartProps } from "./types.js";
 /** One point and the segment from its predecessor; shared by the static list and virtual rows. */
-export declare function LineChartPoint({ as: Tag, point, previousPoint, index, count, min, max, interactive, isActive, isSelected, cursorY, onPointClick, onPointPointerLeave, onPointPointerMove, }: LineChartPointProps): ReactElement;
+export declare function LineChartPoint({ as: Tag, point, previousPoint, index, count, min, max, interactive, isActive, isSelected, cursorY, onPointClick, onPointPointerLeave, onPointPointerMove, slotProps, }: LineChartPointProps): ReactElement;
 export declare namespace LineChartPoint {
     var displayName: string;
 }

package/dist/components/line-chart/LineChart.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"LineChart.d.ts","sourceRoot":"","sources":["../../../src/components/line-chart/LineChart.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAA+B,YAAY,EAAE,MAAM,OAAO,CAAC;AAepF,OAAO,KAAK,EAAE,mBAAmB,EAAE,cAAc,EAAsB,MAAM,YAAY,CAAC;AAE1F,kGAAkG;AAClG,wBAAgB,cAAc,CAAC,EAC7B,EAAE,EAAE,GAAG,EACP,KAAK,EACL,aAAa,EACb,KAAK,EACL,KAAK,EACL,GAAG,EACH,GAAG,EACH,WAAW,EACX,QAAQ,EACR,UAAU,EACV,OAAO,EACP,YAAY,EACZ,mBAAmB,EACnB,kBAAkB,GACnB,EAAE,mBAAmB,GAAG,YAAY,CAmCpC;yBAlDe,cAAc;;;AAqD9B,wBAAgB,SAAS,CAAC,GAAG,SAAS,WAAW,GAAG,QAAQ,EAC1D,KAAK,EAAE,cAAc,CAAC,GAAG,CAAC,GACzB,YAAY,GAAG,IAAI,CAsJrB;yBAxJe,SAAS"}
+{"version":3,"file":"LineChart.d.ts","sourceRoot":"","sources":["../../../src/components/line-chart/LineChart.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAA+B,YAAY,EAAO,MAAM,OAAO,CAAC;AAkBzF,OAAO,KAAK,EAAE,mBAAmB,EAAE,cAAc,EAAsB,MAAM,YAAY,CAAC;AA2B1F,kGAAkG;AAClG,wBAAgB,cAAc,CAAC,EAC7B,EAAE,EAAE,GAAG,EACP,KAAK,EACL,aAAa,EACb,KAAK,EACL,KAAK,EACL,GAAG,EACH,GAAG,EACH,WAAW,EACX,QAAQ,EACR,UAAU,EACV,OAAO,EACP,YAAY,EACZ,mBAAmB,EACnB,kBAAkB,EAClB,SAAS,GACV,EAAE,mBAAmB,GAAG,YAAY,CAgDpC;yBAhEe,cAAc;;;AAmE9B,wBAAgB,SAAS,CAAC,GAAG,SAAS,WAAW,GAAG,QAAQ,EAC1D,KAAK,EAAE,cAAc,CAAC,GAAG,CAAC,GACzB,YAAY,GAAG,IAAI,CA8MrB;yBAhNe,SAAS"}