@ngrok/mantle 0.80.0 → 0.81.1

package/dist/bar-chart.d.ts

@@ -0,0 +1,492 @@
+import { _ as SeriesColor, a as LegendPrimitiveProps, c as XAxisPrimitiveProps, d as BarTexture, f as ChartDatum, i as GridPrimitiveProps, l as YAxisPrimitiveProps, n as ChartRootBaseProps, o as ReferenceLinePrimitiveProps, p as ChartDatumEvent, r as CopyButtonPrimitiveProps, s as TooltipPrimitiveProps, t as ChartAccessibilityProps, u as BarOrientation } from "./chart-1cVjAcj8.js";
+//#region src/components/bar-chart/bar-chart.d.ts
+/**
+ * Props for {@link BarChart.Root}. Bars encode value by length from a shared
+ * zero baseline, so the y domain minimum is fixed at `0` — a truncated-bar
+ * axis is unrepresentable.
+ */
+type BarChartRootProps<TDatum extends ChartDatum = ChartDatum> = Omit<ChartRootBaseProps, "yDomain"> & ChartAccessibilityProps & {
+  /** Rows of data; each `BarChart.Bar` reads one numeric key per row. */
+  data: readonly TDatum[];
+  /** The key of each row's category (x) value. */
+  xKey: Extract<keyof TDatum, string>;
+  /** Override the automatic y maximum. The minimum is always the zero baseline. */
+  yDomain?: [0, number | "auto"];
+  /**
+   * The direction the bars point — this names the bars, not an axis.
+   * `"vertical"` (default) bars stand up from a bottom baseline with
+   * categories along the x axis; `"horizontal"` bars run rightward from a
+   * left baseline with categories down the y axis — better for long category
+   * labels or many categories. The value axis, baseline, reference lines, and
+   * `"perpendicular"` texture all flip to match.
+   */
+  orientation?: BarOrientation;
+};
+/**
+ * Props for {@link BarChart.Bar}.
+ */
+type BarChartBarProps = {
+  /** The row key this series reads its numeric values from. */
+  dataKey: string;
+  /** Display name for the legend, tooltip, and data table. Defaults to `dataKey`. */
+  label?: string;
+  /**
+   * One of the validated chart tokens (`"chart-1"`…`"chart-8"`, `"chart-other"`)
+   * or any CSS color as an escape hatch. Defaults to the next sticky slot in
+   * mount order. Static colors (raw hex) do not adapt across themes; custom
+   * palettes must be validated for colorblind-safe adjacency and surface
+   * contrast, and a series that carries good/bad meaning should wear the
+   * semantic status colors, never a categorical slot.
+   */
+  color?: SeriesColor;
+  /**
+   * The fill texture the series wears, on canvas and on its legend key:
+   * `"solid"` (default), diagonal hatch lines at 45° (`"hatch"`), the 135°
+   * mirror (`"hatch-reverse"`), both (`"crosshatch"`), rungs perpendicular
+   * to the bar's length (`"perpendicular"`), or an offset dot grid
+   * (`"dots"`). Texture is a redundant identity encoding alongside color —
+   * tone-on-tone ink from the series' own fill — so grouped and stacked
+   * series stay distinguishable without color vision, in grayscale print,
+   * and under forced colors. Keep it opt-in and purposeful, never
+   * decorative: on a multi-series chart, leave the first series solid and
+   * texture the rest.
+   */
+  texture?: BarTexture;
+};
+/**
+ * Props for {@link BarChart.Grid}.
+ */
+type BarChartGridProps = GridPrimitiveProps;
+/**
+ * Props for {@link BarChart.XAxis}. The tick formatter receives the row's
+ * category value.
+ */
+type BarChartXAxisProps = XAxisPrimitiveProps;
+/**
+ * Props for {@link BarChart.YAxis}.
+ */
+type BarChartYAxisProps = YAxisPrimitiveProps;
+/**
+ * Props for {@link BarChart.ReferenceLine}.
+ */
+type BarChartReferenceLineProps = ReferenceLinePrimitiveProps;
+/**
+ * Props for {@link BarChart.Tooltip}.
+ */
+type BarChartTooltipProps = TooltipPrimitiveProps;
+/**
+ * Props for {@link BarChart.Legend}.
+ */
+type BarChartLegendProps = LegendPrimitiveProps;
+/**
+ * Props for {@link BarChart.CopyButton}.
+ */
+type BarChartCopyButtonProps = CopyButtonPrimitiveProps;
+/**
+ * The root of a bar chart: owns the data, the scales, the canvas renderer,
+ * and the entire interaction contract (per-category hover with a lifted band
+ * and tooltip, keyboard stepping with polite announcements, an sr-only data
+ * table, Enter/Space + click activation). Compose the chrome and series parts
+ * as children.
+ *
+ * @see https://mantle.ngrok.com/components/charts/bar-chart#barchartroot
+ *
+ * @example
+ * ```tsx
+ * const data = [
+ *   { month: "January", desktop: 186, mobile: 80 },
+ *   { month: "February", desktop: 305, mobile: 200 },
+ *   { month: "March", desktop: 237, mobile: 120 },
+ * ];
+ *
+ * <BarChart.Root data={data} xKey="month" aria-label="Visitors by month">
+ *   <BarChart.Grid />
+ *   <BarChart.XAxis />
+ *   <BarChart.YAxis />
+ *   <BarChart.Bar dataKey="desktop" label="Desktop" />
+ *   <BarChart.Bar dataKey="mobile" label="Mobile" />
+ *   <BarChart.Legend />
+ * </BarChart.Root>
+ * ```
+ */
+declare const Root: <TDatum extends ChartDatum = ChartDatum>(props: BarChartRootProps<TDatum>) => import("react").JSX.Element;
+/**
+ * One bar series. Renders nothing itself — it registers the series with the
+ * chart, which paints it on canvas. Compose one `Bar` per series; with
+ * `stacked` on the Root, bars stack in composition order from the baseline up.
+ * `texture` adds a diagonal-hatch fill as a redundant identity encoding
+ * alongside color, worn by the bars and the series' legend key alike.
+ *
+ * @see https://mantle.ngrok.com/components/charts/bar-chart#barchartbar
+ *
+ * @example
+ * ```tsx
+ * <BarChart.Root data={data} xKey="month" aria-label="Visitors by month">
+ *   <BarChart.Grid />
+ *   <BarChart.XAxis />
+ *   <BarChart.YAxis />
+ *   <BarChart.Bar dataKey="desktop" label="Desktop" />
+ *   <BarChart.Bar dataKey="mobile" label="Mobile" />
+ *   <BarChart.Legend />
+ * </BarChart.Root>
+ * ```
+ */
+declare const Bar: (props: BarChartBarProps) => null;
+/**
+ * Hairline value gridlines behind the bars (renderless; painted on canvas).
+ * The default runs perpendicular to the bars — horizontal lines for vertical
+ * bars, vertical lines for horizontal bars; pass `lines` to force a direction.
+ * Omit the part to omit the grid.
+ *
+ * @see https://mantle.ngrok.com/components/charts/bar-chart#barchartgrid
+ *
+ * @example
+ * ```tsx
+ * <BarChart.Root data={data} xKey="month" aria-label="Visitors by month">
+ *   <BarChart.Grid />
+ *   <BarChart.XAxis />
+ *   <BarChart.YAxis />
+ *   <BarChart.Bar dataKey="desktop" label="Desktop" />
+ *   <BarChart.Legend />
+ * </BarChart.Root>
+ * ```
+ */
+declare const Grid: (props: BarChartGridProps) => null;
+/**
+ * Category labels for the bars (renderless; painted on canvas): along the
+ * bottom for vertical bars, down the left gutter for horizontal bars. Labels
+ * that would collide are skipped, never rotated.
+ *
+ * @see https://mantle.ngrok.com/components/charts/bar-chart#barchartxaxis
+ *
+ * @example
+ * ```tsx
+ * <BarChart.Root data={data} xKey="month" aria-label="Visitors by month">
+ *   <BarChart.Grid />
+ *   <BarChart.XAxis tickFormat={(month) => String(month).slice(0, 3)} />
+ *   <BarChart.YAxis />
+ *   <BarChart.Bar dataKey="desktop" label="Desktop" />
+ *   <BarChart.Legend />
+ * </BarChart.Root>
+ * ```
+ */
+declare const XAxis: (props: BarChartXAxisProps) => null;
+/**
+ * Value tick labels (renderless; painted on canvas): along the left for
+ * vertical bars, across the bottom for horizontal bars. Ticks land on clean
+ * thousands-separated numbers.
+ *
+ * @see https://mantle.ngrok.com/components/charts/bar-chart#barchartyaxis
+ *
+ * @example
+ * ```tsx
+ * <BarChart.Root data={data} xKey="month" aria-label="Visitors by month">
+ *   <BarChart.Grid />
+ *   <BarChart.XAxis />
+ *   <BarChart.YAxis tickFormat={(value) => `${value / 1000}k`} />
+ *   <BarChart.Bar dataKey="desktop" label="Desktop" />
+ *   <BarChart.Legend />
+ * </BarChart.Root>
+ * ```
+ */
+declare const YAxis: (props: BarChartYAxisProps) => null;
+/**
+ * A dashed marker at the value `y` — an SLO threshold, a budget, a limit
+ * (renderless; painted on canvas). It crosses the value axis: a horizontal
+ * line for vertical bars, a vertical line for horizontal bars.
+ *
+ * @see https://mantle.ngrok.com/components/charts/bar-chart#barchartreferenceline
+ *
+ * @example
+ * ```tsx
+ * <BarChart.Root data={data} xKey="month" aria-label="Visitors by month">
+ *   <BarChart.Grid />
+ *   <BarChart.XAxis />
+ *   <BarChart.YAxis />
+ *   <BarChart.Bar dataKey="desktop" label="Desktop" />
+ *   <BarChart.ReferenceLine y={250} label="Capacity" />
+ *   <BarChart.Legend />
+ * </BarChart.Root>
+ * ```
+ */
+declare const ReferenceLine: (props: BarChartReferenceLineProps) => null;
+/**
+ * Customizes the hover/keyboard tooltip readout. The tooltip itself is part
+ * of `BarChart.Root`'s interaction contract and renders whether or not this
+ * part is composed — compose it to format the label or values, append a
+ * footer, or replace the content entirely via the render-prop `children`.
+ *
+ * @see https://mantle.ngrok.com/components/charts/bar-chart#barcharttooltip
+ *
+ * @example
+ * ```tsx
+ * <BarChart.Root data={data} xKey="month" aria-label="Visitors by month">
+ *   <BarChart.Grid />
+ *   <BarChart.XAxis />
+ *   <BarChart.YAxis />
+ *   <BarChart.Bar dataKey="desktop" label="Desktop" />
+ *   <BarChart.Tooltip valueFormat={(value) => `${value} visits`} footer="Click to view logs" />
+ *   <BarChart.Legend />
+ * </BarChart.Root>
+ * ```
+ */
+declare const Tooltip: (props: BarChartTooltipProps) => null;
+/**
+ * The legend: series names keyed by color swatches, rendered as real DOM in
+ * flow below the plot. Always compose it on multi-series charts — identity
+ * must never rely on color-matching alone. It renders nothing for a single
+ * series (the chart's title already names it).
+ *
+ * @see https://mantle.ngrok.com/components/charts/bar-chart#barchartlegend
+ *
+ * @example
+ * ```tsx
+ * <BarChart.Root data={data} xKey="month" aria-label="Visitors by month">
+ *   <BarChart.Grid />
+ *   <BarChart.XAxis />
+ *   <BarChart.YAxis />
+ *   <BarChart.Bar dataKey="desktop" label="Desktop" />
+ *   <BarChart.Bar dataKey="mobile" label="Mobile" />
+ *   <BarChart.Legend />
+ * </BarChart.Root>
+ * ```
+ */
+declare const Legend: (props: BarChartLegendProps) => import("react").JSX.Element;
+/**
+ * A button that copies the chart's current data to the clipboard as a
+ * markdown table (ISO dates, plain numbers, one column per series) —
+ * pasteable into Slack, issues, docs, spreadsheets, and LLM chats. Renders
+ * in flow where composed (alongside `Legend`, below the plot); `Root` is
+ * relatively positioned, so `className` can dock it over a corner instead
+ * (e.g. `absolute right-0 top-0`).
+ *
+ * @see https://mantle.ngrok.com/components/charts/bar-chart#barchartcopybutton
+ *
+ * @example
+ * ```tsx
+ * <BarChart.Root data={data} xKey="month" aria-label="Visitors by month">
+ *   <BarChart.Bar dataKey="desktop" label="Desktop" />
+ *   <BarChart.Bar dataKey="mobile" label="Mobile" />
+ *   <BarChart.Legend />
+ *   <BarChart.CopyButton />
+ * </BarChart.Root>
+ * ```
+ */
+declare const CopyButton: (props: BarChartCopyButtonProps) => import("react").JSX.Element;
+/**
+ * A canvas-rendered bar chart for comparing values across categories, with
+ * grouped and stacked variants. Series colors come from the theme's validated
+ * `--color-chart-*` tokens; bars keep a fixed slot color for the chart's
+ * lifetime even as other series are filtered in and out. Interaction —
+ * per-category tooltip, keyboard stepping, aria-live announcements, and an
+ * sr-only data table — ships with `Root` unconditionally.
+ *
+ * @see https://mantle.ngrok.com/components/charts/bar-chart
+ *
+ * @example
+ * Composition:
+ * ```
+ * BarChart.Root
+ * ├── BarChart.Grid
+ * ├── BarChart.XAxis
+ * ├── BarChart.YAxis
+ * ├── BarChart.Bar (one per series)
+ * ├── BarChart.ReferenceLine
+ * ├── BarChart.Tooltip
+ * ├── BarChart.Legend
+ * └── BarChart.CopyButton
+ * ```
+ *
+ * @example
+ * ```tsx
+ * const data = [
+ *   { month: "January", desktop: 186, mobile: 80 },
+ *   { month: "February", desktop: 305, mobile: 200 },
+ *   { month: "March", desktop: 237, mobile: 120 },
+ * ];
+ *
+ * <BarChart.Root data={data} xKey="month" aria-label="Visitors by month">
+ *   <BarChart.Grid />
+ *   <BarChart.XAxis />
+ *   <BarChart.YAxis />
+ *   <BarChart.Bar dataKey="desktop" label="Desktop" />
+ *   <BarChart.Bar dataKey="mobile" label="Mobile" />
+ *   <BarChart.Tooltip />
+ *   <BarChart.Legend />
+ * </BarChart.Root>
+ * ```
+ */
+declare const BarChart: {
+  /**
+   * The root of a bar chart: owns the data, the scales, the canvas renderer,
+   * and the entire interaction contract.
+   *
+   * @see https://mantle.ngrok.com/components/charts/bar-chart#barchartroot
+   *
+   * @example
+   * ```tsx
+   * <BarChart.Root data={data} xKey="month" aria-label="Visitors by month">
+   *   <BarChart.Grid />
+   *   <BarChart.XAxis />
+   *   <BarChart.YAxis />
+   *   <BarChart.Bar dataKey="desktop" label="Desktop" />
+   *   <BarChart.Bar dataKey="mobile" label="Mobile" />
+   *   <BarChart.Tooltip />
+   *   <BarChart.Legend />
+   * </BarChart.Root>
+   * ```
+   */
+  readonly Root: typeof Root;
+  /**
+   * One bar series; registers with the chart and paints on canvas.
+   *
+   * @see https://mantle.ngrok.com/components/charts/bar-chart#barchartbar
+   *
+   * @example
+   * ```tsx
+   * <BarChart.Root data={data} xKey="month" aria-label="Visitors by month">
+   *   <BarChart.Grid />
+   *   <BarChart.XAxis />
+   *   <BarChart.YAxis />
+   *   <BarChart.Bar dataKey="desktop" label="Desktop" />
+   *   <BarChart.Bar dataKey="mobile" label="Mobile" />
+   *   <BarChart.Tooltip />
+   *   <BarChart.Legend />
+   * </BarChart.Root>
+   * ```
+   */
+  readonly Bar: typeof Bar;
+  /**
+   * Hairline gridlines behind the bars.
+   *
+   * @see https://mantle.ngrok.com/components/charts/bar-chart#barchartgrid
+   *
+   * @example
+   * ```tsx
+   * <BarChart.Root data={data} xKey="month" aria-label="Visitors by month">
+   *   <BarChart.Grid />
+   *   <BarChart.XAxis />
+   *   <BarChart.YAxis />
+   *   <BarChart.Bar dataKey="desktop" label="Desktop" />
+   *   <BarChart.Bar dataKey="mobile" label="Mobile" />
+   *   <BarChart.Tooltip />
+   *   <BarChart.Legend />
+   * </BarChart.Root>
+   * ```
+   */
+  readonly Grid: typeof Grid;
+  /**
+   * Category labels along the bottom of the plot.
+   *
+   * @see https://mantle.ngrok.com/components/charts/bar-chart#barchartxaxis
+   *
+   * @example
+   * ```tsx
+   * <BarChart.Root data={data} xKey="month" aria-label="Visitors by month">
+   *   <BarChart.Grid />
+   *   <BarChart.XAxis tickFormat={(month) => String(month).slice(0, 3)} />
+   *   <BarChart.YAxis />
+   *   <BarChart.Bar dataKey="desktop" label="Desktop" />
+   *   <BarChart.Bar dataKey="mobile" label="Mobile" />
+   *   <BarChart.Tooltip />
+   *   <BarChart.Legend />
+   * </BarChart.Root>
+   * ```
+   */
+  readonly XAxis: typeof XAxis;
+  /**
+   * Value tick labels along the left of the plot.
+   *
+   * @see https://mantle.ngrok.com/components/charts/bar-chart#barchartyaxis
+   *
+   * @example
+   * ```tsx
+   * <BarChart.Root data={data} xKey="month" aria-label="Visitors by month">
+   *   <BarChart.Grid />
+   *   <BarChart.XAxis />
+   *   <BarChart.YAxis tickFormat={(value) => `${value / 1000}k`} />
+   *   <BarChart.Bar dataKey="desktop" label="Desktop" />
+   *   <BarChart.Bar dataKey="mobile" label="Mobile" />
+   *   <BarChart.Tooltip />
+   *   <BarChart.Legend />
+   * </BarChart.Root>
+   * ```
+   */
+  readonly YAxis: typeof YAxis;
+  /**
+   * A dashed horizontal marker at a y value (threshold, budget, limit).
+   *
+   * @see https://mantle.ngrok.com/components/charts/bar-chart#barchartreferenceline
+   *
+   * @example
+   * ```tsx
+   * <BarChart.Root data={data} xKey="month" aria-label="Visitors by month">
+   *   <BarChart.Grid />
+   *   <BarChart.XAxis />
+   *   <BarChart.YAxis />
+   *   <BarChart.Bar dataKey="desktop" label="Desktop" />
+   *   <BarChart.ReferenceLine y={250} label="Capacity" />
+   *   <BarChart.Tooltip />
+   *   <BarChart.Legend />
+   * </BarChart.Root>
+   * ```
+   */
+  readonly ReferenceLine: typeof ReferenceLine;
+  /**
+   * Customizes the always-on hover/keyboard tooltip readout.
+   *
+   * @see https://mantle.ngrok.com/components/charts/bar-chart#barcharttooltip
+   *
+   * @example
+   * ```tsx
+   * <BarChart.Root data={data} xKey="month" aria-label="Visitors by month">
+   *   <BarChart.Grid />
+   *   <BarChart.XAxis />
+   *   <BarChart.YAxis />
+   *   <BarChart.Bar dataKey="desktop" label="Desktop" />
+   *   <BarChart.Bar dataKey="mobile" label="Mobile" />
+   *   <BarChart.Tooltip valueFormat={(value) => `${value} visits`} />
+   *   <BarChart.Legend />
+   * </BarChart.Root>
+   * ```
+   */
+  readonly Tooltip: typeof Tooltip;
+  /**
+   * The legend; always compose it on multi-series charts. Renders nothing for
+   * a single series.
+   *
+   * @see https://mantle.ngrok.com/components/charts/bar-chart#barchartlegend
+   *
+   * @example
+   * ```tsx
+   * <BarChart.Root data={data} xKey="month" aria-label="Visitors by month">
+   *   <BarChart.Grid />
+   *   <BarChart.XAxis />
+   *   <BarChart.YAxis />
+   *   <BarChart.Bar dataKey="desktop" label="Desktop" />
+   *   <BarChart.Bar dataKey="mobile" label="Mobile" />
+   *   <BarChart.Tooltip />
+   *   <BarChart.Legend />
+   * </BarChart.Root>
+   * ```
+   */
+  readonly Legend: typeof Legend;
+  /**
+   * Copies the chart's current data to the clipboard as a markdown table.
+   *
+   * @see https://mantle.ngrok.com/components/charts/bar-chart#barchartcopybutton
+   *
+   * @example
+   * ```tsx
+   * <BarChart.Root data={data} xKey="month" aria-label="Visitors by month">
+   *   <BarChart.Bar dataKey="desktop" label="Desktop" />
+   *   <BarChart.Bar dataKey="mobile" label="Mobile" />
+   *   <BarChart.Legend />
+   *   <BarChart.CopyButton />
+   * </BarChart.Root>
+   * ```
+   */
+  readonly CopyButton: typeof CopyButton;
+};
+//#endregion
+export { BarChart, type BarChartBarProps, type BarChartCopyButtonProps, type BarChartGridProps, type BarChartLegendProps, type BarChartReferenceLineProps, type BarChartRootProps, type BarChartTooltipProps, type BarChartXAxisProps, type BarChartYAxisProps, type ChartDatumEvent };

package/dist/bar-chart.js

@@ -0,0 +1 @@
+import{a as e,c as t,i as n,l as r,n as i,o as a,r as o,s,t as c}from"./chart-Do2qkrxl.js";import{jsx as l}from"react/jsx-runtime";const u={Root:e=>l(o,{kind:`bar`,componentName:`BarChart`,slotName:`bar-chart`,...e}),Bar:e=>a(`BarChart.Bar`,`bar`,e),Grid:e=>n(`BarChart.Grid`,e),XAxis:e=>t(`BarChart.XAxis`,e),YAxis:e=>r(`BarChart.YAxis`,e),ReferenceLine:t=>e(`BarChart.ReferenceLine`,t),Tooltip:e=>s(`BarChart.Tooltip`,e),Legend:e=>l(i,{partName:`BarChart.Legend`,slotName:`bar-chart`,...e}),CopyButton:e=>l(c,{partName:`BarChart.CopyButton`,slotName:`bar-chart`,...e})};export{u as BarChart};

package/dist/breadcrumb.d.ts

@@ -29,10 +29,7 @@ import { ComponentProps, ReactNode } from "react";
  * </Breadcrumb.Root>
  * ```
  */
-declare const Root: {
-  ({ asChild, children, "data-slot": dataSlot, ref, ...props }: ComponentProps<"nav"> & WithAsChild & WithDataSlot): import("react").JSX.Element;
-  displayName: string;
-};
+declare const Root: ({ asChild, children, "data-slot": dataSlot, ref, ...props }: ComponentProps<"nav"> & WithAsChild & WithDataSlot) => import("react").JSX.Element;
 /**
  * The ordered list of crumbs. Renders an `<ol>` — an **ordered** list, because
  * the order of the items is the hierarchy, from the root to the current page.
@@ -59,10 +56,7 @@ declare const Root: {
  * </Breadcrumb.Root>
  * ```
  */
-declare const List: {
-  ({ asChild, children, className, "data-slot": dataSlot, ref, ...props }: ComponentProps<"ol"> & WithAsChild & WithDataSlot): import("react").JSX.Element;
-  displayName: string;
-};
+declare const List: ({ asChild, children, className, "data-slot": dataSlot, ref, ...props }: ComponentProps<"ol"> & WithAsChild & WithDataSlot) => import("react").JSX.Element;
 /**
  * A single crumb. Renders an `<li>` (`role="listitem"`) that lays out its
  * content — a `Breadcrumb.Link` or `Breadcrumb.Page` — inline.
@@ -88,10 +82,7 @@ declare const List: {
  * </Breadcrumb.Root>
  * ```
  */
-declare const Item: {
-  ({ asChild, children, className, "data-slot": dataSlot, ref, ...props }: ComponentProps<"li"> & WithAsChild & WithDataSlot): import("react").JSX.Element;
-  displayName: string;
-};
+declare const Item: ({ asChild, children, className, "data-slot": dataSlot, ref, ...props }: ComponentProps<"li"> & WithAsChild & WithDataSlot) => import("react").JSX.Element;
 /**
  * A link to an ancestor page in the hierarchy. Renders an `<a>` by default;
  * the component is router-agnostic — use `asChild` to compose the styling
@@ -126,10 +117,7 @@ declare const Item: {
  * </Breadcrumb.Link>
  * ```
  */
-declare const Link: {
-  ({ asChild, children, className, "data-slot": dataSlot, ref, ...props }: ComponentProps<"a"> & WithAsChild & WithDataSlot): import("react").JSX.Element;
-  displayName: string;
-};
+declare const Link: ({ asChild, children, className, "data-slot": dataSlot, ref, ...props }: ComponentProps<"a"> & WithAsChild & WithDataSlot) => import("react").JSX.Element;
 /**
  * The current page — the last crumb in the trail. Renders a `<span>` (not a
  * link; the user is already here) with `aria-current="page"`. The ARIA is the
@@ -157,10 +145,7 @@ declare const Link: {
  * </Breadcrumb.Root>
  * ```
  */
-declare const Page: {
-  ({ asChild, children, className, "data-slot": dataSlot, ref, ...props }: ComponentProps<"span"> & WithAsChild & WithDataSlot): import("react").JSX.Element;
-  displayName: string;
-};
+declare const Page: ({ asChild, children, className, "data-slot": dataSlot, ref, ...props }: ComponentProps<"span"> & WithAsChild & WithDataSlot) => import("react").JSX.Element;
 /**
  * The props for `Breadcrumb.Separator`. When `asChild` is set, `children` is
  * required: the child element is what gets rendered, so an `asChild` separator
@@ -204,10 +189,7 @@ type BreadcrumbSeparatorProps = Omit<ComponentProps<"li">, "children"> & ({
  * </Breadcrumb.Root>
  * ```
  */
-declare const Separator: {
-  ({ asChild, children, className, "data-slot": dataSlot, ref, ...props }: BreadcrumbSeparatorProps & WithDataSlot): import("react").JSX.Element;
-  displayName: string;
-};
+declare const Separator: ({ asChild, children, className, "data-slot": dataSlot, ref, ...props }: BreadcrumbSeparatorProps & WithDataSlot) => import("react").JSX.Element;
 /**
  * Compound component for WAI-ARIA breadcrumb navigation — the path from a
  * root to the current page as an ordered list of links inside a labeled

package/dist/breadcrumb.js

@@ -1 +1 @@
-import{t as e}from"./cx-IiQEAKf5.js";import{t}from"./icon-CGgMKpJg.js";import{n,t as r}from"./slot-CDk0Bb9z.js";import{cloneElement as i,isValidElement as a}from"react";import{jsx as o}from"react/jsx-runtime";import{CaretRightIcon as s}from"@phosphor-icons/react/CaretRight";const c=({asChild:e,children:t,"data-slot":i,ref:a,...s})=>o(e?r:`nav`,{ref:a,"data-slot":n(i,`breadcrumb`),"aria-label":`Breadcrumb`,...s,children:t});c.displayName=`Breadcrumb`;const l=({asChild:t,children:i,className:a,"data-slot":s,ref:c,...l})=>o(t?r:`ol`,{ref:c,"data-slot":n(s,`breadcrumb-list`),className:e(`text-muted flex flex-wrap items-center gap-1.5 text-sm`,a),...l,children:i});l.displayName=`BreadcrumbList`;const u=({asChild:t,children:i,className:a,"data-slot":s,ref:c,...l})=>o(t?r:`li`,{ref:c,"data-slot":n(s,`breadcrumb-item`),className:e(`inline-flex items-center gap-1.5`,a),...l,children:i});u.displayName=`BreadcrumbItem`;const d=({asChild:t,children:i,className:a,"data-slot":s,ref:c,...l})=>o(t?r:`a`,{ref:c,"data-slot":n(s,`breadcrumb-link`),className:e(`hover:text-strong transition-colors`,a),...l,children:i});d.displayName=`BreadcrumbLink`;const f=({asChild:t,children:s,className:c,"data-slot":l,ref:u,...d})=>{let f=t?r:`span`,p=t&&a(s)?i(s,{"aria-current":`page`}):s;return o(f,{ref:u,"data-slot":n(l,`breadcrumb-page`),className:e(`text-strong`,c),...d,"aria-current":`page`,children:p})};f.displayName=`BreadcrumbPage`;const p=({asChild:e,children:c,className:l,"data-slot":u,ref:d,...f})=>{let p=e?r:`li`,m=e&&a(c)?i(c,{role:`presentation`,"aria-hidden":`true`}):c??o(t,{svg:o(s,{}),className:`size-3.5`});return o(p,{ref:d,"data-slot":n(u,`breadcrumb-separator`),className:l,...f,role:`presentation`,"aria-hidden":`true`,children:m})};p.displayName=`BreadcrumbSeparator`;const m={Root:c,List:l,Item:u,Link:d,Page:f,Separator:p};export{m as Breadcrumb};
+import{t as e}from"./cx-IiQEAKf5.js";import{t}from"./icon-lZ48P8Nn.js";import{n,t as r}from"./slot-CDk0Bb9z.js";import{cloneElement as i,isValidElement as a}from"react";import{jsx as o}from"react/jsx-runtime";import{CaretRightIcon as s}from"@phosphor-icons/react/CaretRight";const c={Root:({asChild:e,children:t,"data-slot":i,ref:a,...s})=>o(e?r:`nav`,{ref:a,"data-slot":n(i,`breadcrumb`),"aria-label":`Breadcrumb`,...s,children:t}),List:({asChild:t,children:i,className:a,"data-slot":s,ref:c,...l})=>o(t?r:`ol`,{ref:c,"data-slot":n(s,`breadcrumb-list`),className:e(`text-muted flex flex-wrap items-center gap-1.5 text-sm`,a),...l,children:i}),Item:({asChild:t,children:i,className:a,"data-slot":s,ref:c,...l})=>o(t?r:`li`,{ref:c,"data-slot":n(s,`breadcrumb-item`),className:e(`inline-flex items-center gap-1.5`,a),...l,children:i}),Link:({asChild:t,children:i,className:a,"data-slot":s,ref:c,...l})=>o(t?r:`a`,{ref:c,"data-slot":n(s,`breadcrumb-link`),className:e(`hover:text-strong transition-colors`,a),...l,children:i}),Page:({asChild:t,children:s,className:c,"data-slot":l,ref:u,...d})=>{let f=t?r:`span`,p=t&&a(s)?i(s,{"aria-current":`page`}):s;return o(f,{ref:u,"data-slot":n(l,`breadcrumb-page`),className:e(`text-strong`,c),...d,"aria-current":`page`,children:p})},Separator:({asChild:e,children:c,className:l,"data-slot":u,ref:d,...f})=>{let p=e?r:`li`,m=e&&a(c)?i(c,{role:`presentation`,"aria-hidden":`true`}):c??o(t,{svg:o(s,{}),className:`size-3.5`});return o(p,{ref:d,"data-slot":n(u,`breadcrumb-separator`),className:l,...f,role:`presentation`,"aria-hidden":`true`,children:m})}};export{c as Breadcrumb};

package/dist/button-BAno7KIU.js

@@ -0,0 +1 @@
+import{t as e}from"./cx-IiQEAKf5.js";import{t}from"./icon-lZ48P8Nn.js";import{t as n}from"./slot-CDk0Bb9z.js";import{t as r}from"./booleanish-BfvnW6vy.js";import{t as i}from"./button-DvHMWAPl.js";import{Children as a,cloneElement as o,isValidElement as s}from"react";import c from"tiny-invariant";import{Fragment as l,jsx as u,jsxs as d}from"react/jsx-runtime";import{CircleNotchIcon as f}from"@phosphor-icons/react/CircleNotch";const p=({"aria-disabled":p,appearance:m,asChild:h=!1,children:g,className:_,disabled:v,icon:y,intent:b,isLoading:x=!1,label:S,ref:C,size:w=`md`,type:T,...E})=>{let D=r(p??v??x),O=x?u(f,{className:`animate-spin`}):y,k={"aria-disabled":D,"data-slot":`icon-button`,className:e(i({appearance:m,intent:b,isLoading:x,size:w}),_),"data-appearance":m,"data-disabled":D,"data-icon-button":!0,"data-intent":b,"data-loading":x,"data-size":w,disabled:D,ref:C,...E},A=d(l,{children:[u(`span`,{className:`sr-only`,children:S}),u(t,{svg:O})]});return h?(c(s(g)&&a.only(g),"When using `asChild`, IconButton must be passed a single child as a JSX tag."),u(n,{...k,children:o(g,{},A)})):u(`button`,{...k,type:T??`button`,children:A})};export{p as t};

package/dist/{index-C2jj8U4a.d.ts → button-C-gMbPso.d.ts}

@@ -1,7 +1,7 @@
 import { n as WithAsChild } from "./as-child-D23mGo4f.js";
 import { r as VariantProps } from "./index-DA4ig3gj.js";
-import "./button-BPMwa2jN.js";
-import "./icon-button-C1AfGnQx.js";
+import "./button-DARFK2KJ.js";
+import "./button-C7vAl6lS.js";
 import { ComponentProps } from "react";
 //#region src/components/button/button-group.d.ts
 declare const buttonGroupVariants: (props?: ({

package/dist/{icon-button-C1AfGnQx.d.ts → button-C7vAl6lS.d.ts}

@@ -1,8 +1,8 @@
 import { n as WithAsChild } from "./as-child-D23mGo4f.js";
 import { r as VariantProps } from "./index-DA4ig3gj.js";
-import { t as ButtonIntent } from "./intents-DdSKSj1c.js";
+import { t as ButtonIntent } from "./button-DdSKSj1c.js";
 import { ComponentProps, ReactNode } from "react";
-//#region src/components/button/icon-button.d.ts
+//#region src/components/button/icon-button-variants.d.ts
 /**
  * The visual style of an `IconButton`: how much visual weight it carries,
  * independent of its tone (`intent`). IconButton has no `filled` or `link`
@@ -10,6 +10,17 @@ import { ComponentProps, ReactNode } from "react";
  * link has no text to read as a link.
  */
 type IconButtonAppearance = "ghost" | "outlined";
+/**
+ * Composes the className for an `IconButton` from its variant props. Lives in
+ * its own module (rather than `icon-button.tsx`) so that components which only
+ * need the classes (e.g. `Calendar`'s nav buttons) can import them without
+ * pulling the `IconButton` implementation into their module graph.
+ *
+ * @example
+ * ```tsx
+ * const navButtonClasses = iconButtonVariants({ appearance: "ghost", intent: "neutral", size: "sm" });
+ * ```
+ */
 declare const iconButtonVariants: (props?: ({
   appearance?: "ghost" | "outlined" | null | undefined;
   intent?: "accent" | "danger" | "neutral" | null | undefined;
@@ -17,6 +28,8 @@ declare const iconButtonVariants: (props?: ({
   size?: "lg" | "md" | "sm" | "xl" | "xs" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 type IconButtonVariants = VariantProps<typeof iconButtonVariants>;
+//#endregion
+//#region src/components/button/icon-button.d.ts
 /**
  * The props for the `IconButton` component.
  */
@@ -114,4 +127,4 @@ type IconButtonProps = ComponentProps<"button"> & WithAsChild & Omit<IconButtonV
  */
 declare const IconButton: ({ "aria-disabled": _ariaDisabled, appearance, asChild, children, className, disabled: _disabled, icon: propIcon, intent, isLoading, label, ref, size, type, ...props }: IconButtonProps) => import("react").JSX.Element;
 //#endregion
-export { IconButtonAppearance as n, IconButtonProps as r, IconButton as t };
+export { IconButtonProps as n, IconButtonAppearance as r, IconButton as t };

package/dist/{button-BPMwa2jN.d.ts → button-DARFK2KJ.d.ts}

@@ -1,6 +1,6 @@
 import { n as WithAsChild } from "./as-child-D23mGo4f.js";
 import { r as VariantProps } from "./index-DA4ig3gj.js";
-import { t as ButtonIntent } from "./intents-DdSKSj1c.js";
+import { t as ButtonIntent } from "./button-DdSKSj1c.js";
 import { ComponentProps, ReactNode } from "react";
 //#region src/components/button/button.d.ts
 /**

package/dist/{button-5WsvzIQ6.js → button-DjpEKt2X.js}

@@ -1 +1 @@
-import{t as e}from"./cx-IiQEAKf5.js";import{t}from"./icon-CGgMKpJg.js";import{t as n}from"./slot-CDk0Bb9z.js";import{t as r}from"./booleanish-BfvnW6vy.js";import{t as i}from"./clsx-DUGZgXfJ.js";import{Children as a,cloneElement as o,isValidElement as s}from"react";import c from"tiny-invariant";import{Fragment as l,jsx as u,jsxs as d}from"react/jsx-runtime";import{cva as f}from"class-variance-authority";import{CircleNotchIcon as p}from"@phosphor-icons/react/CircleNotch";const m=f(``,{variants:{appearance:{filled:`bg-filled-accent text-white focus-visible:ring-focus-accent not-disabled:hover:bg-filled-accent-hover border border-transparent text-sm font-medium`,ghost:`text-accent-600 focus-visible:ring-focus-accent not-disabled:hover:bg-accent-500/10 not-disabled:hover:text-accent-700 border border-transparent text-sm font-medium`,outlined:`border-accent-600 bg-form text-accent-600 focus-visible:ring-focus-accent not-disabled:hover:border-accent-700 not-disabled:hover:bg-accent-500/10 not-disabled:hover:text-accent-700 border text-sm font-medium`,link:`text-accent-600 focus-visible:ring-focus-accent not-disabled:hover:underline group/button-link border-transparent`},isLoading:{false:``,true:`opacity-50`},intent:{accent:``,danger:``,neutral:``},size:{xs:``,sm:``,md:``,lg:``,xl:``}},defaultVariants:{isLoading:!1,size:`md`},compoundVariants:[{appearance:[`filled`,`ghost`,`outlined`],size:`xs`,class:`h-6 px-2`},{appearance:[`filled`,`ghost`,`outlined`],size:`sm`,class:`h-7 px-2.5`},{appearance:[`filled`,`ghost`,`outlined`],size:`md`,class:`h-9 px-3`},{appearance:[`filled`,`ghost`,`outlined`],size:`lg`,class:`h-10 px-3.5`},{appearance:[`filled`,`ghost`,`outlined`],size:`xl`,class:`h-12 px-4`},{appearance:`ghost`,intent:`danger`,class:`text-danger-600 focus-visible:ring-focus-danger not-disabled:hover:bg-danger-500/10 not-disabled:hover:text-danger-700 border-transparent`},{appearance:`outlined`,intent:`danger`,class:`border-danger-600 bg-form text-danger-600 focus-visible:ring-focus-danger not-disabled:hover:border-danger-700 not-disabled:hover:bg-danger-500/10 not-disabled:hover:text-danger-700`},{appearance:`filled`,intent:`danger`,class:`bg-filled-danger focus-visible:ring-focus-danger not-disabled:hover:bg-filled-danger-hover border-transparent`},{appearance:`link`,intent:`danger`,class:`text-danger-600 focus-visible:ring-focus-danger`},{appearance:`ghost`,intent:`neutral`,class:`text-strong focus-visible:ring-focus-accent not-disabled:hover:bg-neutral-500/10 not-disabled:hover:text-strong border-transparent`},{appearance:`outlined`,intent:`neutral`,class:`border-form bg-form text-strong focus-visible:border-accent-600 focus-visible:ring-focus-accent not-disabled:hover:border-neutral-400 not-disabled:hover:bg-form-hover not-disabled:hover:text-strong focus-visible:not-disabled:hover:border-accent-600`},{appearance:`filled`,intent:`neutral`,class:`bg-filled-neutral not-disabled:hover:bg-filled-neutral-hover border-transparent focus-visible:border-transparent text-neutral-50`},{appearance:`link`,intent:`neutral`,class:`text-strong focus-visible:ring-focus-accent`}]}),h={xs:`ps-1.5`,sm:`ps-2`,md:`ps-2.5`,lg:`ps-3`,xl:`ps-3.5`},g={xs:`pe-1.5`,sm:`pe-2`,md:`pe-2.5`,lg:`pe-3`,xl:`pe-3.5`},_=({"aria-disabled":f,appearance:_,asChild:v,children:y,className:b,disabled:x,icon:S,iconPlacement:C=`start`,intent:w,isLoading:T=!1,ref:E,size:D=`md`,type:O,...k})=>{let A=r(f??x??T),j=T?u(p,{className:`animate-spin`}):S,M=j&&_!==`link`,N={"aria-disabled":A,"data-slot":`button`,className:e(`inline-flex items-center justify-center gap-1.5 whitespace-nowrap rounded-md`,`focus:outline-hidden focus-visible:ring-4`,`disabled:cursor-default disabled:opacity-50`,`not-disabled:active:scale-97 ease-out transition-transform duration-150`,m({appearance:_,intent:w,isLoading:T,size:D}),_!==`link`&&`font-sans`,M&&C===`start`&&h[D],M&&C===`end`&&g[D],b),"data-appearance":_,"data-disabled":A,"data-intent":w,"data-loading":T,"data-size":_===`link`?void 0:D,disabled:A,ref:E,...k};return v?(c(s(y)&&a.only(y),"When using `asChild`, Button must be passed a single child as a JSX tag."),u(n,{...N,children:o(y,{},d(l,{children:[j&&u(t,{svg:j,className:i(C===`end`&&`order-last`)}),y.props.children]}))})):d(`button`,{...N,type:O??`button`,children:[j&&u(t,{svg:j,className:i(C===`end`&&`order-last`)}),y]})};export{_ as t};
+import{t as e}from"./cx-IiQEAKf5.js";import{t}from"./icon-lZ48P8Nn.js";import{t as n}from"./slot-CDk0Bb9z.js";import{t as r}from"./booleanish-BfvnW6vy.js";import{t as i}from"./clsx-DUGZgXfJ.js";import{Children as a,cloneElement as o,isValidElement as s}from"react";import c from"tiny-invariant";import{Fragment as l,jsx as u,jsxs as d}from"react/jsx-runtime";import{cva as f}from"class-variance-authority";import{CircleNotchIcon as p}from"@phosphor-icons/react/CircleNotch";const m=f(``,{variants:{appearance:{filled:`bg-filled-accent text-white focus-visible:ring-focus-accent not-disabled:hover:bg-filled-accent-hover border border-transparent text-sm font-medium`,ghost:`text-accent-600 focus-visible:ring-focus-accent not-disabled:hover:bg-accent-500/10 not-disabled:hover:text-accent-700 border border-transparent text-sm font-medium`,outlined:`border-accent-600 bg-form text-accent-600 focus-visible:ring-focus-accent not-disabled:hover:border-accent-700 not-disabled:hover:bg-accent-500/10 not-disabled:hover:text-accent-700 border text-sm font-medium`,link:`text-accent-600 focus-visible:ring-focus-accent not-disabled:hover:underline group/button-link border-transparent`},isLoading:{false:``,true:`opacity-50`},intent:{accent:``,danger:``,neutral:``},size:{xs:``,sm:``,md:``,lg:``,xl:``}},defaultVariants:{isLoading:!1,size:`md`},compoundVariants:[{appearance:[`filled`,`ghost`,`outlined`],size:`xs`,class:`h-6 px-2`},{appearance:[`filled`,`ghost`,`outlined`],size:`sm`,class:`h-7 px-2.5`},{appearance:[`filled`,`ghost`,`outlined`],size:`md`,class:`h-9 px-3`},{appearance:[`filled`,`ghost`,`outlined`],size:`lg`,class:`h-10 px-3.5`},{appearance:[`filled`,`ghost`,`outlined`],size:`xl`,class:`h-12 px-4`},{appearance:`ghost`,intent:`danger`,class:`text-danger-600 focus-visible:ring-focus-danger not-disabled:hover:bg-danger-500/10 not-disabled:hover:text-danger-700 border-transparent`},{appearance:`outlined`,intent:`danger`,class:`border-danger-600 bg-form text-danger-600 focus-visible:ring-focus-danger not-disabled:hover:border-danger-700 not-disabled:hover:bg-danger-500/10 not-disabled:hover:text-danger-700`},{appearance:`filled`,intent:`danger`,class:`bg-filled-danger focus-visible:ring-focus-danger not-disabled:hover:bg-filled-danger-hover border-transparent`},{appearance:`link`,intent:`danger`,class:`text-danger-600 focus-visible:ring-focus-danger`},{appearance:`ghost`,intent:`neutral`,class:`text-strong focus-visible:ring-focus-accent not-disabled:hover:bg-neutral-500/10 not-disabled:hover:text-strong border-transparent`},{appearance:`outlined`,intent:`neutral`,class:`border-form bg-form text-strong focus-visible:border-accent-600 focus-visible:ring-focus-accent not-disabled:hover:border-neutral-400 not-disabled:hover:bg-form-hover not-disabled:hover:text-strong focus-visible:not-disabled:hover:border-accent-600`},{appearance:`filled`,intent:`neutral`,class:`bg-filled-neutral not-disabled:hover:bg-filled-neutral-hover border-transparent focus-visible:border-transparent text-neutral-50`},{appearance:`link`,intent:`neutral`,class:`text-strong focus-visible:ring-focus-accent`}]}),h={xs:`ps-1.5`,sm:`ps-2`,md:`ps-2.5`,lg:`ps-3`,xl:`ps-3.5`},g={xs:`pe-1.5`,sm:`pe-2`,md:`pe-2.5`,lg:`pe-3`,xl:`pe-3.5`},_=({"aria-disabled":f,appearance:_,asChild:v,children:y,className:b,disabled:x,icon:S,iconPlacement:C=`start`,intent:w,isLoading:T=!1,ref:E,size:D=`md`,type:O,...k})=>{let A=r(f??x??T),j=T?u(p,{className:`animate-spin`}):S,M=j&&_!==`link`,N={"aria-disabled":A,"data-slot":`button`,className:e(`inline-flex items-center justify-center gap-1.5 whitespace-nowrap rounded-md`,`focus:outline-hidden focus-visible:ring-4`,`disabled:cursor-default disabled:opacity-50`,`not-disabled:active:scale-97 ease-out transition-transform duration-150`,m({appearance:_,intent:w,isLoading:T,size:D}),_!==`link`&&`font-sans`,M&&C===`start`&&h[D],M&&C===`end`&&g[D],b),"data-appearance":_,"data-disabled":A,"data-intent":w,"data-loading":T,"data-size":_===`link`?void 0:D,disabled:A,ref:E,...k};return v?(c(s(y)&&a.only(y),"When using `asChild`, Button must be passed a single child as a JSX tag."),u(n,{...N,children:o(y,{},d(l,{children:[j&&u(t,{svg:j,className:i(C===`end`&&`order-last`)}),y.props.children]}))})):d(`button`,{...N,type:O??`button`,children:[j&&u(t,{svg:j,className:i(C===`end`&&`order-last`)}),y]})};export{_ as t};