@acronis-platform/ui-react 0.58.0 → 0.61.0

package/dist/components/ui/confidence-cone/confidence-cone.js.map

@@ -1 +1 @@
-{"version":3,"file":"confidence-cone.js","sources":["../../../../src/components/ui/confidence-cone/confidence-cone.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport {\n  Area,\n  CartesianGrid,\n  ComposedChart,\n  Line,\n  ReferenceArea,\n  ReferenceLine,\n  XAxis,\n  YAxis,\n} from 'recharts';\n\nimport { cn } from '@/lib/utils';\nimport {\n  ChartContainer,\n  ChartLegend,\n  ChartLegendContent,\n  ChartTooltip,\n  ChartTooltipContent,\n  type ChartConfig,\n  type ChartLegendContentProps,\n  type ChartTooltipContentProps,\n} from '../chart';\n\n// A forecast confidence-cone: a solid line over the known/actual period, a\n// dashed line over the forecast period, and a shaded band (the \"cone\") between\n// a lower and upper bound that typically widens with the horizon — visualizing\n// growing uncertainty. Built on the shared Chart primitives; no new tokens\n// (series colors are caller-supplied via `config`). The whole metric renders in\n// one hue — actual and forecast differ by line style, not color — so the cone\n// band and the forecast line both reuse the actual series' color.\n\n// The band is a synthetic `[lower, upper]` range field per row that a recharts\n// <Area> shades; kept out of the tooltip/legend (see the filters below).\nconst BAND_KEY = '__cone';\n\n/**\n * Drop the synthetic cone-band range series from a recharts tooltip/legend\n * payload, keeping the real actual/forecast series (and their order). Applied to\n * both the default tooltip and any caller-supplied `tooltipContent`, so the\n * `__cone` band never surfaces regardless of which path renders.\n */\nexport function dropConeBand<T extends { dataKey?: unknown }>(\n  payload: readonly T[] | undefined\n): T[] | undefined {\n  return payload?.filter((item) => item.dataKey !== BAND_KEY);\n}\n\n/**\n * Wrap a caller-supplied `tooltipContent` so the synthetic cone band is stripped\n * from the payload before it renders, while preserving recharts' own mount\n * semantics — a function is mounted via `createElement` (its own component\n * identity + hook state), an element via `cloneElement`. This mirrors what the\n * pass-through charts get by handing `content` straight to recharts, so a\n * function-form tooltip keeps its state across re-renders here too. The returned\n * component is a stable content type (memoize it on `tooltipContent`).\n */\ntype TooltipContentType = NonNullable<\n  React.ComponentProps<typeof ChartTooltip>['content']\n>;\ntype TooltipContentFn = Extract<TooltipContentType, (...args: never[]) => unknown>;\ntype TooltipRenderProps = Parameters<TooltipContentFn>[0];\n\nexport function createConeTooltip(tooltipContent: TooltipContentType) {\n  return function ConeTooltip(props: TooltipRenderProps) {\n    const merged = {\n      ...props,\n      payload: dropConeBand(props.payload),\n    } as TooltipRenderProps;\n    return typeof tooltipContent === 'function'\n      ? React.createElement(\n          tooltipContent as React.FunctionComponent<TooltipRenderProps>,\n          merged\n        )\n      : React.cloneElement(tooltipContent, merged);\n  };\n}\n\nexport interface ConfidenceConeProps\n  extends Omit<React.ComponentProps<'div'>, 'children'> {\n  /**\n   * Row-per-point data — the shared x dimension plus the actual / forecast /\n   * bound fields. Rows are naturally sparse (a point has either an actual or a\n   * forecast + bounds), so missing fields are allowed. Avoid a field named\n   * `__cone` — it's reserved for the internal prediction-band series.\n   */\n  data: ReadonlyArray<Record<string, string | number | null | undefined>>;\n  /**\n   * Per-series map of `label` / `color` for the actual + forecast lines\n   * (imported from the shared `Chart` primitives). Colors are caller-supplied —\n   * reference an existing semantic `--ui-*` token; there is no chart palette tier\n   * yet. The cone band and the forecast line both reuse the actual series'\n   * color — actual and forecast differ by line style, not hue.\n   */\n  config: ChartConfig;\n  /** Category / time axis key (the shared dimension across rows). */\n  xKey: string;\n  /** Field for the known/actual values — drawn as a solid line with a filled area. */\n  actualKey: string;\n  /** Field for the projected values — drawn as a dashed line. */\n  forecastKey: string;\n  /** Field for the cone's lower bound. */\n  lowerKey: string;\n  /** Field for the cone's upper bound. */\n  upperKey: string;\n  /** Title rendered beneath the horizontal (X) axis. */\n  xAxisLabel?: string;\n  /** Title rendered beside the vertical (Y) axis (rotated). */\n  yAxisLabel?: string;\n  /** Unit suffix appended to Y-axis tick values (recharts `unit`; the X axis is categorical). */\n  yUnit?: string;\n  /** Stroke width of the actual + forecast lines. */\n  strokeWidth?: number;\n  /**\n   * Set off the forecast period from the actuals with a dashed divider at the\n   * hand-off point (the first row with a forecast value) and a subtle shaded\n   * band over the forecast region.\n   */\n  showForecastRegion?: boolean;\n  showGrid?: boolean;\n  showTooltip?: boolean;\n  showLegend?: boolean;\n  /**\n   * Replace the default tooltip. Pass a configured `ChartTooltipContent`\n   * (imported from this library) — e.g. with a `formatter` / `labelFormatter` —\n   * to customize the tooltip without composing recharts yourself. The synthetic\n   * cone band is filtered out of the payload before your tooltip sees it, so a\n   * `__cone` item never reaches your formatter. Ignored when `showTooltip` is\n   * false.\n   */\n  tooltipContent?: React.ComponentProps<typeof ChartTooltip>['content'];\n}\n\nconst ConfidenceCone = React.forwardRef<HTMLDivElement, ConfidenceConeProps>(\n  (\n    {\n      className,\n      config,\n      data,\n      xKey,\n      actualKey,\n      forecastKey,\n      lowerKey,\n      upperKey,\n      xAxisLabel,\n      yAxisLabel,\n      yUnit,\n      strokeWidth = 2,\n      showForecastRegion = true,\n      showGrid = true,\n      showTooltip = true,\n      showLegend = true,\n      tooltipContent,\n      ...props\n    },\n    ref\n  ) => {\n    // Memoized so recharts sees a stable content type across renders — a fresh\n    // wrapper each render would remount the caller's tooltip and reset its state.\n    const customTooltip = React.useMemo(\n      () => (tooltipContent ? createConeTooltip(tooltipContent) : undefined),\n      [tooltipContent]\n    );\n\n    const xAxisTitle = xAxisLabel\n      ? { value: xAxisLabel, position: 'insideBottom' as const, offset: 0 }\n      : undefined;\n    const yAxisTitle = yAxisLabel\n      ? {\n          value: yAxisLabel,\n          angle: -90,\n          position: 'insideLeft' as const,\n          style: { textAnchor: 'middle' as const },\n        }\n      : undefined;\n\n    // Augment each row with the `[lower, upper]` band tuple the Area shades.\n    // Rows missing a numeric bound are left un-coned (the band breaks there).\n    const chartData = data.map((row) => {\n      const lower = row[lowerKey];\n      const upper = row[upperKey];\n      return {\n        ...row,\n        [BAND_KEY]:\n          typeof lower === 'number' && typeof upper === 'number'\n            ? [lower, upper]\n            : undefined,\n      };\n    });\n\n    // The forecast begins at the first row carrying a forecast value; set that\n    // region off from the actuals with a shaded band + a divider at the hand-off.\n    const forecastStart = showForecastRegion\n      ? data.find((row) => typeof row[forecastKey] === 'number')?.[xKey]\n      : undefined;\n    const lastX = data[data.length - 1]?.[xKey];\n\n    return (\n      <div ref={ref} className={cn(className)} {...props}>\n        <ChartContainer\n          config={config}\n          className=\"size-full [&_.recharts-label]:fill-foreground\"\n        >\n          <ComposedChart data={chartData as readonly unknown[]}>\n            {showGrid && <CartesianGrid vertical={false} />}\n            <XAxis\n              dataKey={xKey}\n              type=\"category\"\n              tickLine={false}\n              axisLine={false}\n              tickMargin={8}\n              height={xAxisLabel ? 48 : undefined}\n              label={xAxisTitle}\n            />\n            <YAxis\n              type=\"number\"\n              tickLine={false}\n              axisLine={false}\n              unit={yUnit}\n              width={yAxisLabel ? 72 : undefined}\n              label={yAxisTitle}\n            />\n            {/* Set the forecast region off from the actuals (behind everything). */}\n            {forecastStart != null && lastX != null && (\n              <ReferenceArea\n                x1={forecastStart}\n                x2={lastX}\n                fill=\"var(--ui-background-surface-secondary)\"\n                fillOpacity={0.5}\n                ifOverflow=\"extendDomain\"\n              />\n            )}\n            {forecastStart != null && (\n              <ReferenceLine\n                x={forecastStart}\n                stroke=\"var(--ui-border-on-surface-border)\"\n                strokeDasharray=\"4 4\"\n              />\n            )}\n            {showTooltip &&\n              (customTooltip ? (\n                // Strips the synthetic band before the caller's tooltip sees it\n                // — the `__cone` series feeds the Area, not the tooltip.\n                <ChartTooltip content={customTooltip} />\n              ) : (\n                <ChartTooltip\n                  content={(tp) => (\n                    <ChartTooltipContent\n                      active={tp.active}\n                      label={tp.label}\n                      // The synthetic band feeds the Area, not the tooltip.\n                      payload={\n                        dropConeBand(\n                          tp.payload\n                        ) as ChartTooltipContentProps['payload']\n                      }\n                    />\n                  )}\n                />\n              ))}\n            {showLegend && (\n              <ChartLegend\n                content={(lp) => (\n                  <ChartLegendContent\n                    verticalAlign={lp.verticalAlign}\n                    payload={\n                      dropConeBand(\n                        lp.payload\n                      ) as ChartLegendContentProps['payload']\n                    }\n                  />\n                )}\n              />\n            )}\n            {/* The cone renders first so the lines draw on top. One color for the\n                whole metric — actual and forecast differ by line style, not hue —\n                so the cone + forecast line reuse the actual series' color. */}\n            <Area\n              dataKey={BAND_KEY}\n              type=\"monotone\"\n              stroke=\"none\"\n              fill={`var(--color-${actualKey})`}\n              fillOpacity={0.15}\n              connectNulls={false}\n              dot={false}\n              activeDot={false}\n              isAnimationActive={false}\n              legendType=\"none\"\n              tooltipType=\"none\"\n            />\n            <Area\n              dataKey={actualKey}\n              type=\"monotone\"\n              stroke={`var(--color-${actualKey})`}\n              strokeWidth={strokeWidth}\n              fill={`var(--color-${actualKey})`}\n              fillOpacity={0.15}\n              dot={false}\n              activeDot={false}\n              connectNulls\n              isAnimationActive={false}\n            />\n            <Line\n              dataKey={forecastKey}\n              type=\"monotone\"\n              stroke={`var(--color-${actualKey})`}\n              strokeWidth={strokeWidth}\n              strokeDasharray=\"5 5\"\n              dot={false}\n              connectNulls\n              isAnimationActive={false}\n            />\n          </ComposedChart>\n        </ChartContainer>\n      </div>\n    );\n  }\n);\nConfidenceCone.displayName = 'ConfidenceCone';\n\nexport { ConfidenceCone };\n"],"names":["BAND_KEY","dropConeBand","payload","item","createConeTooltip","tooltipContent","props","merged","React","ConfidenceCone","className","config","data","xKey","actualKey","forecastKey","lowerKey","upperKey","xAxisLabel","yAxisLabel","yUnit","strokeWidth","showForecastRegion","showGrid","showTooltip","showLegend","ref","customTooltip","xAxisTitle","yAxisTitle","chartData","row","lower","upper","forecastStart","_a","lastX","_b","jsx","cn","ChartContainer","jsxs","ComposedChart","CartesianGrid","XAxis","YAxis","ReferenceArea","ReferenceLine","ChartTooltip","tp","ChartTooltipContent","ChartLegend","lp","ChartLegendContent","Area","Line"],"mappings":"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"}
+{"version":3,"file":"confidence-cone.js","sources":["../../../../src/components/ui/confidence-cone/confidence-cone.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport {\n  Area,\n  CartesianGrid,\n  ComposedChart,\n  Line,\n  ReferenceArea,\n  ReferenceLine,\n  Text,\n  XAxis,\n  YAxis,\n} from 'recharts';\n\nimport { cn } from '@/lib/utils';\nimport {\n  ChartContainer,\n  ChartLegend,\n  ChartLegendContent,\n  ChartTooltip,\n  ChartTooltipContent,\n  resolveAxisDomain,\n  resolveAnimation,\n  resolveRotatedTickAnchor,\n  resolveXAxisHeight,\n  resolveXAxisTitle,\n  resolveYAxisTitle,\n  CHART_LABEL_FONT_SIZE,\n  type ChartConfig,\n  type ChartLegendContentProps,\n  type ChartTooltipContentProps,\n  type CartesianChartProps,\n  type ChartAnimationProps,\n} from '../chart';\n\n// A forecast confidence-cone: a solid line over the known/actual period, a\n// dashed line over the forecast period, and a shaded band (the \"cone\") between\n// a lower and upper bound that typically widens with the horizon — visualizing\n// growing uncertainty. Built on the shared Chart primitives; no new tokens\n// (series colors are caller-supplied via `config`). The whole metric renders in\n// one hue — actual and forecast differ by line style, not color — so the cone\n// band and the forecast line both reuse the actual series' color.\n\n// Each series' band is a synthetic `[lower, upper]` range field per row that a\n// recharts <Area> shades; kept out of the tooltip/legend (see the filters\n// below). One band per series, so the key carries the series' actual key — the\n// whole `__cone` prefix is reserved.\nconst BAND_PREFIX = '__cone';\nconst bandKeyFor = (actualKey: string) => `${BAND_PREFIX}:${actualKey}`;\n\n/**\n * Drop every synthetic cone-band range series from a recharts tooltip/legend\n * payload, keeping the real actual/forecast series (and their order). Applied to\n * both the default tooltip and any caller-supplied `tooltipContent`, so no band\n * surfaces regardless of which path renders or how many series are plotted.\n */\nexport function dropConeBand<T extends { dataKey?: unknown }>(\n  payload: readonly T[] | undefined\n): T[] | undefined {\n  return payload?.filter(\n    (item) =>\n      !(typeof item.dataKey === 'string' && item.dataKey.startsWith(BAND_PREFIX))\n  );\n}\n\n/**\n * Reduce a legend payload to the metrics the chart plots — one entry per series.\n * A series' actual, forecast and cone are three recharts series painting a\n * single metric in a single hue, so the legend names each metric once, with its\n * actual series' swatch, instead of listing line styles as separate series.\n */\nexport function keepMetricSeries<T extends { dataKey?: unknown }>(\n  payload: readonly T[] | undefined,\n  actualKeys: readonly string[]\n): T[] | undefined {\n  return payload?.filter(\n    (item) => typeof item.dataKey === 'string' && actualKeys.includes(item.dataKey)\n  );\n}\n\n/**\n * Wrap a caller-supplied `tooltipContent` so the synthetic cone band is stripped\n * from the payload before it renders, while preserving recharts' own mount\n * semantics — a function is mounted via `createElement` (its own component\n * identity + hook state), an element via `cloneElement`. This mirrors what the\n * pass-through charts get by handing `content` straight to recharts, so a\n * function-form tooltip keeps its state across re-renders here too. The returned\n * component is a stable content type (memoize it on `tooltipContent`).\n */\ntype TooltipContentType = NonNullable<\n  React.ComponentProps<typeof ChartTooltip>['content']\n>;\ntype TooltipContentFn = Extract<TooltipContentType, (...args: never[]) => unknown>;\ntype TooltipRenderProps = Parameters<TooltipContentFn>[0];\n\nexport function createConeTooltip(tooltipContent: TooltipContentType) {\n  return function ConeTooltip(props: TooltipRenderProps) {\n    const merged = {\n      ...props,\n      payload: dropConeBand(props.payload),\n    } as TooltipRenderProps;\n    return typeof tooltipContent === 'function'\n      ? React.createElement(\n          tooltipContent as React.FunctionComponent<TooltipRenderProps>,\n          merged\n        )\n      : React.cloneElement(tooltipContent, merged);\n  };\n}\n\n/**\n * One plotted metric: its actual / forecast columns and, optionally, the two\n * bound columns that shade its cone. Omit `lowerKey`/`upperKey` for a band-less\n * metric — a solid line handing off to a bare dashed projection.\n */\nexport interface ConfidenceConeSeries {\n  /** Field for the known/actual values — drawn as a solid line with a filled area. */\n  actualKey: string;\n  /** Field for the projected values — drawn as a dashed line. */\n  forecastKey: string;\n  /** Field for the cone's lower bound. Omit (with `upperKey`) for no cone. */\n  lowerKey?: string;\n  /** Field for the cone's upper bound. Omit (with `lowerKey`) for no cone. */\n  upperKey?: string;\n}\n\n/**\n * The x values of the projected period — every row carrying a forecast value for\n * at least one series, in data order. The first is the hand-off point (where the\n * shaded region and divider start); the whole set drives the forecast tick\n * styling, matched by value so tick `interval` can't skew it the way a tick\n * index would. Exported for unit tests; not part of the package's public API.\n */\nexport function forecastPeriodX(\n  data: ReadonlyArray<Record<string, string | number | null | undefined>>,\n  series: readonly ConfidenceConeSeries[],\n  xKey: string\n): Array<string | number | null | undefined> {\n  return data\n    .filter((row) => series.some(({ forecastKey }) => typeof row[forecastKey] === 'number'))\n    .map((row) => row[xKey]);\n}\n\n/**\n * Build the X-axis tick renderer that sets the projected columns apart: italic,\n * in the metric's hue. Styled inline rather than through the `fill` attribute\n * recharts hands every tick, so the accent survives the class-based tick color\n * a chart theme may apply. A custom tick owns its own text, so the caller's\n * `xTickFormatter` is applied here — recharts only applies it to default ticks.\n * Exported for unit tests; not part of the package's public API.\n */\nexport function createForecastTick(\n  forecastX: ReadonlySet<string | number | null | undefined>,\n  color: string,\n  tickFormatter?: CartesianChartProps['xTickFormatter']\n) {\n  return function ForecastTick({\n    payload,\n    index,\n    ...tickProps\n  }: {\n    payload?: { value?: string | number };\n    index?: number;\n  }) {\n    const value = payload?.value;\n    return (\n      <Text\n        {...tickProps}\n        style={\n          value != null && forecastX.has(value)\n            ? { fontStyle: 'italic', fill: color }\n            : undefined\n        }\n      >\n        {tickFormatter && value != null ? tickFormatter(value, index) : value}\n      </Text>\n    );\n  };\n}\n\n/** A dashed horizontal threshold on the value axis. */\nexport interface ConfidenceConeReferenceLine {\n  /** Position on the value (Y) axis. */\n  value: number;\n  /** Optional caption rendered at the line's right end. */\n  label?: string;\n}\n\n/**\n * Every prop except the one-form-or-the-other requirement `ConfidenceConeProps`\n * layers on below. Exported so the stories can type their `Meta` on a single\n * object shape — Storybook can't split a union's required args between `meta.args`\n * and a story's. Not re-exported from `index.ts`; not part of the public API.\n */\nexport interface ConfidenceConeBaseProps\n  extends Omit<React.ComponentProps<'div'>, 'children'>,\n    CartesianChartProps,\n    ChartAnimationProps {\n  /**\n   * Row-per-point data — the shared x dimension plus each series' actual /\n   * forecast / bound fields. Rows are naturally sparse (a point has either an\n   * actual or a forecast + bounds), so missing fields are allowed. Avoid fields\n   * starting with `__cone` — that prefix is reserved for the internal\n   * prediction-band series.\n   */\n  data: ReadonlyArray<Record<string, string | number | null | undefined>>;\n  /**\n   * Per-series map of `label` / `color` for the actual + forecast lines\n   * (imported from the shared `Chart` primitives). Colors are caller-supplied —\n   * reference an existing semantic `--ui-*` token; there is no chart palette tier\n   * yet. Each metric renders in one hue: its cone band and forecast line both\n   * reuse its actual series' color — actual and forecast differ by line style,\n   * not hue.\n   */\n  config: ChartConfig;\n  /** Category / time axis key (the shared dimension across rows). */\n  xKey: string;\n  /**\n   * Plot several metrics against one shared axis — each with its own actual /\n   * forecast / bound fields and its own hue (from `config[actualKey]`). Takes\n   * precedence over the single-series `actualKey`/`forecastKey`/`lowerKey`/\n   * `upperKey` shorthand below; pass one form or the other, not both. One of the\n   * two forms is required.\n   */\n  series?: readonly ConfidenceConeSeries[];\n  /**\n   * Single-series shorthand — field for the known/actual values, drawn as a\n   * solid line with a filled area. Required (with `forecastKey`) unless `series`\n   * is set, which supersedes it.\n   */\n  actualKey?: string;\n  /**\n   * Single-series shorthand — field for the projected values, drawn as a dashed\n   * line. Required (with `actualKey`) unless `series` is set, which supersedes\n   * it.\n   */\n  forecastKey?: string;\n  /** Field for the cone's lower bound. Omit (with `upperKey`) for no cone. */\n  lowerKey?: string;\n  /** Field for the cone's upper bound. Omit (with `lowerKey`) for no cone. */\n  upperKey?: string;\n  /**\n   * How the known/actual period is drawn: a filled `area` under the line (the\n   * default), or a bare `line` — for a chart where the cone is the only shaded\n   * region, or where several metrics' fills would muddy each other.\n   */\n  actualType?: 'area' | 'line';\n  /** Stroke width of the actual + forecast lines. */\n  strokeWidth?: number;\n  /**\n   * Mark each data point: a filled dot on the observed values, a hollow one on\n   * the projection — so a point reads as measured or predicted at a glance.\n   */\n  showDots?: boolean;\n  /**\n   * Italicize the X-axis ticks over the forecast period and paint them in the\n   * first series' hue, so the projected columns read as projected even when the\n   * shaded region is off.\n   */\n  styleForecastTicks?: boolean;\n  /**\n   * One or more dashed horizontal thresholds on the value axis — e.g. a target\n   * or a capacity limit. Pass a single object or an array to draw several.\n   */\n  referenceLine?: ConfidenceConeReferenceLine | ConfidenceConeReferenceLine[];\n  /**\n   * Set off the forecast period from the actuals with a dashed divider at the\n   * hand-off point (the first row with a forecast value) and a subtle shaded\n   * band over the forecast region.\n   */\n  showForecastRegion?: boolean;\n  showLegend?: boolean;\n}\n\n/**\n * Which columns to plot has to be spelled out one way or the other: the `series`\n * array, or the flat `actualKey` + `forecastKey` shorthand. Expressed as a union\n * so a chart with neither is a compile error rather than a silent plot of axes\n * and nothing else. Both forms together stay legal — `series` wins (see\n * `plotted`), which is what the multi-series stories rely on to clear the args\n * table.\n */\nexport type ConfidenceConeProps = ConfidenceConeBaseProps &\n  (\n    | { series: readonly ConfidenceConeSeries[] }\n    | { actualKey: string; forecastKey: string }\n  );\n\nconst ConfidenceCone = React.forwardRef<HTMLDivElement, ConfidenceConeProps>(\n  (\n    {\n      className,\n      config,\n      data,\n      xKey,\n      series,\n      actualKey,\n      forecastKey,\n      lowerKey,\n      upperKey,\n      xAxisLabel,\n      yAxisLabel,\n      yUnit,\n      actualType = 'area',\n      strokeWidth = 2,\n      showDots = false,\n      styleForecastTicks = false,\n      referenceLine,\n      showForecastRegion = true,\n      showGrid = true,\n      showTooltip = true,\n      showLegend = true,\n      showXAxis = true,\n      showYAxis = true,\n      xTickFormatter,\n      yTickFormatter,\n      xAxisAngle,\n      xAxisInterval,\n      yAxisTickCount,\n      yAxisDomain,\n      gridDashed,\n      gridHorizontal,\n      gridVertical,\n      tooltipContent,\n      animate,\n      animationDuration,\n      animationBegin,\n      animationEasing,\n      ...props\n    },\n    ref\n  ) => {\n    // The flat *Key props are the single-series shorthand for `series`.\n    const plotted = React.useMemo<readonly ConfidenceConeSeries[]>(() => {\n      if (series?.length) return series;\n      if (!actualKey || !forecastKey) return [];\n      return [{ actualKey, forecastKey, lowerKey, upperKey }];\n    }, [series, actualKey, forecastKey, lowerKey, upperKey]);\n\n    const animation = resolveAnimation({\n      animate,\n      animationDuration,\n      animationBegin,\n      animationEasing,\n    });\n    // Memoized so recharts sees a stable content type across renders — a fresh\n    // wrapper each render would remount the caller's tooltip and reset its state.\n    const customTooltip = React.useMemo(\n      () => (tooltipContent ? createConeTooltip(tooltipContent) : undefined),\n      [tooltipContent]\n    );\n\n    const xAxisTitle = resolveXAxisTitle(xAxisLabel);\n    const yAxisTitle = resolveYAxisTitle(yAxisLabel);\n\n    const yDomain = resolveAxisDomain(yAxisDomain);\n\n    // One hue per metric. Each cone and forecast line already paints with its own\n    // series' actual color; re-pointing that series' forecast key's `--color-*`\n    // at it too means nothing downstream — a custom tooltip, a caller's\n    // `var(--color-<forecastKey>)` — can reintroduce a second color.\n    const seriesConfig = React.useMemo(() => {\n      let next: ChartConfig | undefined;\n      for (const { actualKey: aKey, forecastKey: fKey } of plotted) {\n        const actual = config[aKey];\n        const forecast = config[fKey];\n        if (!actual || !forecast) continue;\n        next ??= { ...config };\n        next[fKey] = {\n          label: forecast.label,\n          icon: forecast.icon,\n          ...(actual.theme ? { theme: actual.theme } : { color: actual.color }),\n        };\n      }\n      return next ?? config;\n    }, [config, plotted]);\n\n    const xAxisHeight = resolveXAxisHeight(xAxisLabel, xAxisAngle);\n\n    // Augment each row with one `[lower, upper]` band tuple per coned series for\n    // its Area to shade. Rows missing a numeric bound are left un-coned (the\n    // band breaks there); a series without bounds gets no band at all.\n    const chartData = data.map((row) => {\n      const next: Record<string, unknown> = { ...row };\n      for (const { actualKey: aKey, lowerKey: lKey, upperKey: uKey } of plotted) {\n        if (!lKey || !uKey) continue;\n        const lower = row[lKey];\n        const upper = row[uKey];\n        next[bandKeyFor(aKey)] =\n          typeof lower === 'number' && typeof upper === 'number'\n            ? [lower, upper]\n            : undefined;\n      }\n      return next;\n    });\n\n    const forecastX = forecastPeriodX(data, plotted, xKey);\n    // Set the projected period off from the actuals with a shaded band + a\n    // divider at the hand-off.\n    const forecastStart = showForecastRegion ? forecastX[0] : undefined;\n    const lastX = data[data.length - 1]?.[xKey];\n\n    const renderForecastTick = createForecastTick(\n      new Set(forecastX),\n      `var(--color-${plotted[0]?.actualKey})`,\n      xTickFormatter\n    );\n\n    const referenceLines = referenceLine\n      ? Array.isArray(referenceLine)\n        ? referenceLine\n        : [referenceLine]\n      : [];\n\n    // Everything from here to the `return` is lifted out of the returned tree\n    // only to keep it readable as a flat list of chart children. Nothing in\n    // recharts forces the `render*` helpers to be plain functions: axes and\n    // series register themselves with the chart's store, and `<Cell>` is the\n    // only child still looked up by element type — a component wrapper renders\n    // fine (see AreaChart's `AreaFillGradients`). They stay functions because\n    // they are declared inside the render body, where a component would get a\n    // fresh element type on every render and remount its subtree.\n\n    const renderAxes = () => (\n      <>\n        <XAxis\n          dataKey={xKey}\n          type=\"category\"\n          hide={!showXAxis}\n          tickLine={false}\n          axisLine={false}\n          tickMargin={8}\n          tickFormatter={xTickFormatter}\n          tick={styleForecastTicks ? renderForecastTick : undefined}\n          angle={xAxisAngle}\n          interval={xAxisInterval}\n          textAnchor={resolveRotatedTickAnchor(xAxisAngle)}\n          height={xAxisHeight}\n          label={xAxisTitle}\n        />\n        <YAxis\n          type=\"number\"\n          hide={!showYAxis}\n          tickLine={false}\n          axisLine={false}\n          unit={yUnit}\n          tickFormatter={yTickFormatter}\n          tickCount={yAxisTickCount}\n          domain={yDomain}\n          width={yAxisLabel ? 72 : undefined}\n          label={yAxisTitle}\n        />\n      </>\n    );\n\n    // Set the forecast region off from the actuals (behind everything).\n    const renderForecastRegion = () => (\n      <>\n        {forecastStart != null && lastX != null && (\n          <ReferenceArea\n            x1={forecastStart}\n            x2={lastX}\n            fill=\"var(--ui-background-surface-secondary)\"\n            fillOpacity={0.5}\n            ifOverflow=\"extendDomain\"\n          />\n        )}\n        {forecastStart != null && (\n          <ReferenceLine\n            x={forecastStart}\n            stroke=\"var(--ui-border-on-surface-border)\"\n            strokeDasharray=\"4 4\"\n          />\n        )}\n      </>\n    );\n\n    const renderThreshold = (\n      threshold: ConfidenceConeReferenceLine,\n      index: number\n    ) => (\n      <ReferenceLine\n        key={`${threshold.label ?? 'threshold'}-${index}`}\n        y={threshold.value}\n        stroke=\"var(--ui-text-on-surface-secondary)\"\n        strokeDasharray=\"4 4\"\n        // extendDomain so a threshold beyond the data max stays visible.\n        ifOverflow=\"extendDomain\"\n        label={\n          threshold.label\n            ? {\n                value: threshold.label,\n                position: 'insideTopRight',\n                fill: 'var(--ui-text-on-surface-secondary)',\n                fontSize: CHART_LABEL_FONT_SIZE,\n              }\n            : undefined\n        }\n      />\n    );\n\n    const renderTooltip = () =>\n      customTooltip ? (\n        // Strips the synthetic band before the caller's tooltip sees it — the\n        // `__cone` series feeds the Area, not the tooltip.\n        <ChartTooltip content={customTooltip} />\n      ) : (\n        <ChartTooltip\n          content={(tp) => (\n            <ChartTooltipContent\n              active={tp.active}\n              label={tp.label}\n              // The synthetic band feeds the Area, not the tooltip.\n              payload={\n                dropConeBand(tp.payload) as ChartTooltipContentProps['payload']\n              }\n            />\n          )}\n        />\n      );\n\n    const renderLegend = () => (\n      <ChartLegend\n        content={(lp) => (\n          <ChartLegendContent\n            verticalAlign={lp.verticalAlign}\n            payload={\n              keepMetricSeries(\n                lp.payload,\n                plotted.map((s) => s.actualKey)\n              ) as ChartLegendContentProps['payload']\n            }\n          />\n        )}\n      />\n    );\n\n    // One color per metric — actual and forecast differ by line style, not hue\n    // — so a cone reuses its series' actual color.\n    const renderConeBand = ({\n      actualKey: aKey,\n      lowerKey: lKey,\n      upperKey: uKey,\n    }: ConfidenceConeSeries) =>\n      lKey && uKey ? (\n        <Area\n          key={bandKeyFor(aKey)}\n          // The band paints in the same hue, at the same opacity, as the\n          // actual series' own area, so nothing on the rendered path tells\n          // the two apart. recharts forwards `data-*` onto the path it\n          // draws; the tests select the band through this.\n          data-slot=\"confidence-cone-band\"\n          dataKey={bandKeyFor(aKey)}\n          type=\"monotone\"\n          stroke=\"none\"\n          fill={`var(--color-${aKey})`}\n          fillOpacity={0.15}\n          connectNulls={false}\n          dot={false}\n          activeDot={false}\n          {...animation}\n          legendType=\"none\"\n          tooltipType=\"none\"\n        />\n      ) : null;\n\n    const renderActualMark = ({ actualKey: aKey }: ConfidenceConeSeries) => {\n      // An area and a line take the same props here; only the region under the\n      // curve (and the mark recharts draws) differ. A `Line` gets no fill at\n      // all — `fillOpacity: 0` would also erase its dots.\n      const ActualMark = actualType === 'line' ? Line : Area;\n      const areaFill =\n        actualType === 'line'\n          ? undefined\n          : { fill: `var(--color-${aKey})`, fillOpacity: 0.15 };\n      // Observed points read as measured: LineChart's dot geometry (r 3, 2px\n      // ring) filled with the metric hue. The ring is that same hue, so the\n      // mark is solid — and wide enough against the 2px line not to read as a\n      // mere thickening of it. `fillOpacity: 1` is load-bearing: recharts\n      // merges the parent mark's own presentation props into every dot it\n      // draws, so an `<Area>`'s 0.15 would otherwise wash the dot out to a halo.\n      const dot = showDots\n        ? {\n            r: 3,\n            fill: `var(--color-${aKey})`,\n            fillOpacity: 1,\n            stroke: `var(--color-${aKey})`,\n            strokeWidth: 2,\n          }\n        : false;\n      return (\n        <ActualMark\n          key={aKey}\n          dataKey={aKey}\n          type=\"monotone\"\n          stroke={`var(--color-${aKey})`}\n          strokeWidth={strokeWidth}\n          {...areaFill}\n          dot={dot}\n          activeDot={showDots ? { r: 5 } : false}\n          connectNulls\n          {...animation}\n          // The legend names the metric once, so it carries the swatch that\n          // stands for the whole series rather than the actual line's style.\n          legendType=\"rect\"\n        />\n      );\n    };\n\n    const renderForecastLine = ({\n      actualKey: aKey,\n      forecastKey: fKey,\n    }: ConfidenceConeSeries) => {\n      // Projected points read as predicted: the same LineChart dot, inverted —\n      // the metric's hue as the ring, the surface color as the fill, so the\n      // dashed line doesn't show through the middle. (LineChart leaves the fill\n      // to recharts, whose `Line` defaults it to `#fff`; the token is that same\n      // white in the light theme and also holds up in the dark one.)\n      // `strokeDasharray: 'none'` is load-bearing: recharts merges the parent\n      // mark's presentation props into every dot, so this line's `5 5` would\n      // otherwise break each dot's ring into two arcs.\n      const dot = showDots\n        ? {\n            r: 3,\n            fill: 'var(--ui-background-surface-primary)',\n            stroke: `var(--color-${aKey})`,\n            strokeWidth: 2,\n            strokeDasharray: 'none',\n          }\n        : false;\n      return (\n        <Line\n          key={fKey}\n          dataKey={fKey}\n          type=\"monotone\"\n          stroke={`var(--color-${aKey})`}\n          strokeWidth={strokeWidth}\n          strokeDasharray=\"5 5\"\n          dot={dot}\n          // Paired with `dot` the way every other chart does it — left unset,\n          // the projection would keep recharts' default active dot while the\n          // actuals had none (and a different radius when on).\n          activeDot={showDots ? { r: 5 } : false}\n          connectNulls\n          {...animation}\n        />\n      );\n    };\n\n    return (\n      <div ref={ref} className={cn(className)} {...props}>\n        <ChartContainer\n          config={seriesConfig}\n          className=\"size-full [&_.recharts-label]:fill-foreground\"\n        >\n          <ComposedChart data={chartData as readonly unknown[]}>\n            {showGrid && (\n              <CartesianGrid\n                horizontal={gridHorizontal ?? true}\n                vertical={gridVertical ?? false}\n                strokeDasharray={gridDashed ? '3 3' : undefined}\n              />\n            )}\n            {renderAxes()}\n            {renderForecastRegion()}\n            {referenceLines.map(renderThreshold)}\n            {showTooltip && renderTooltip()}\n            {showLegend && renderLegend()}\n            {/* Every cone renders before any line, so the lines draw on top of\n                all of them. */}\n            {plotted.map(renderConeBand)}\n            {plotted.map(renderActualMark)}\n            {plotted.map(renderForecastLine)}\n          </ComposedChart>\n        </ChartContainer>\n      </div>\n    );\n  }\n);\nConfidenceCone.displayName = 'ConfidenceCone';\n\nexport { ConfidenceCone };\n"],"names":["BAND_PREFIX","bandKeyFor","actualKey","dropConeBand","payload","item","keepMetricSeries","actualKeys","createConeTooltip","tooltipContent","props","merged","React","forecastPeriodX","data","series","xKey","row","forecastKey","createForecastTick","forecastX","color","tickFormatter","index","tickProps","value","jsx","Text","ConfidenceCone","className","config","lowerKey","upperKey","xAxisLabel","yAxisLabel","yUnit","actualType","strokeWidth","showDots","styleForecastTicks","referenceLine","showForecastRegion","showGrid","showTooltip","showLegend","showXAxis","showYAxis","xTickFormatter","yTickFormatter","xAxisAngle","xAxisInterval","yAxisTickCount","yAxisDomain","gridDashed","gridHorizontal","gridVertical","animate","animationDuration","animationBegin","animationEasing","ref","plotted","animation","resolveAnimation","customTooltip","xAxisTitle","resolveXAxisTitle","yAxisTitle","resolveYAxisTitle","yDomain","resolveAxisDomain","seriesConfig","next","aKey","fKey","actual","forecast","xAxisHeight","resolveXAxisHeight","chartData","lKey","uKey","lower","upper","forecastStart","lastX","_a","renderForecastTick","_b","referenceLines","renderAxes","jsxs","Fragment","XAxis","resolveRotatedTickAnchor","YAxis","renderForecastRegion","ReferenceArea","ReferenceLine","renderThreshold","threshold","CHART_LABEL_FONT_SIZE","renderTooltip","ChartTooltip","tp","ChartTooltipContent","renderLegend","ChartLegend","lp","ChartLegendContent","s","renderConeBand","Area","renderActualMark","ActualMark","Line","areaFill","dot","renderForecastLine","cn","ChartContainer","ComposedChart","CartesianGrid"],"mappings":"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"}

package/dist/components/ui/dialog/dialog.js

@@ -10,12 +10,12 @@ import { Loading as U } from "../loading/loading.js";
 import { InputText as Y } from "../input-text/input-text.js";
 import { Button as y } from "../button/button.js";
 const q = E(
-  "fixed left-1/2 top-1/2 z-50 flex w-full min-w-[var(--ui-dialog-container-width-min)] -translate-x-1/2 -translate-y-1/2 flex-col overflow-hidden rounded-[var(--ui-dialog-container-border-radius)] bg-[var(--ui-dialog-container-color)] text-foreground shadow-lg duration-200 data-[open]:animate-in data-[open]:fade-in-0 data-[open]:zoom-in-95 data-[closed]:animate-out data-[closed]:fade-out-0 data-[closed]:zoom-out-95",
+  "fixed left-1/2 top-1/2 z-50 flex max-h-[calc(100dvh-96px)] w-full min-w-[var(--ui-dialog-container-width-min)] -translate-x-1/2 -translate-y-1/2 flex-col overflow-hidden rounded-[var(--ui-dialog-container-border-radius)] bg-[var(--ui-dialog-container-color)] text-foreground shadow-lg duration-200 data-[open]:animate-in data-[open]:fade-in-0 data-[open]:zoom-in-95 data-[closed]:animate-out data-[closed]:fade-out-0 data-[closed]:zoom-out-95",
   {
     variants: {
       size: {
-        sm: "max-w-[var(--ui-dialog-container-size-sm)]",
-        large: "max-w-[832px]"
+        sm: "max-w-[min(var(--ui-dialog-container-size-sm),calc(100dvw-96px))]",
+        large: "max-w-[min(832px,calc(100dvw-96px))]"
       }
     },
     defaultVariants: {
@@ -25,7 +25,7 @@ const q = E(
 ), J = i.Root;
 i.Trigger;
 i.Portal;
-const x = i.Close, C = n.forwardRef(({ className: e, ...a }, r) => /* @__PURE__ */ o(
+const x = i.Close, w = n.forwardRef(({ className: e, ...a }, r) => /* @__PURE__ */ o(
   i.Backdrop,
   {
     ref: r,
@@ -36,33 +36,33 @@ const x = i.Close, C = n.forwardRef(({ className: e, ...a }, r) => /* @__PURE__
     ...a
   }
 ));
-C.displayName = "DialogOverlay";
-const w = n.forwardRef(
+w.displayName = "DialogOverlay";
+const C = n.forwardRef(
   ({
     className: e,
     children: a,
     size: r,
     portal: d = !0,
     portalContainer: s,
-    keepMounted: g,
-    ...p
-  }, u) => {
-    const b = H(), f = s ?? b, m = /* @__PURE__ */ c(D, { children: [
-      /* @__PURE__ */ o(C, {}),
+    keepMounted: p,
+    ...g
+  }, m) => {
+    const b = H(), f = s ?? b, u = /* @__PURE__ */ c(D, { children: [
+      /* @__PURE__ */ o(w, {}),
       /* @__PURE__ */ o(
         i.Popup,
         {
-          ref: u,
+          ref: m,
           className: l(q({ size: r }), e),
-          ...p,
+          ...g,
           children: a
         }
       )
     ] });
-    return d ? /* @__PURE__ */ o(i.Portal, { container: f, keepMounted: g, children: m }) : m;
+    return d ? /* @__PURE__ */ o(i.Portal, { container: f, keepMounted: p, children: u }) : u;
   }
 );
-w.displayName = "DialogContent";
+C.displayName = "DialogContent";
 const K = n.forwardRef(({ className: e, ...a }, r) => /* @__PURE__ */ o(
   "div",
   {
@@ -127,7 +127,7 @@ const N = n.forwardRef(({ className: e, closeLabel: a = "Close", ...r }, d) => /
 ));
 N.displayName = "DialogCloseButton";
 function X({ title: e, closeLabel: a }) {
-  return /* @__PURE__ */ c("div", { className: "flex h-[var(--ui-dialog-header-height)] items-center gap-[var(--ui-dialog-header-gap)] border-b-[length:var(--ui-dialog-header-border-width)] border-[var(--ui-dialog-header-border-color)] bg-[var(--ui-dialog-header-color)] px-[var(--ui-dialog-header-padding-x)]", children: [
+  return /* @__PURE__ */ c("div", { className: "flex h-[var(--ui-dialog-header-height)] shrink-0 items-center gap-[var(--ui-dialog-header-gap)] border-b-[length:var(--ui-dialog-header-border-width)] border-[var(--ui-dialog-header-border-color)] bg-[var(--ui-dialog-header-color)] px-[var(--ui-dialog-header-padding-x)]", children: [
     /* @__PURE__ */ o(v, { children: e }),
     /* @__PURE__ */ o(N, { closeLabel: a })
   ] });
@@ -137,7 +137,7 @@ function Z({ children: e, inert: a }) {
     "div",
     {
       inert: a,
-      className: "flex min-h-[var(--ui-dialog-body-height-min)] flex-col justify-center gap-[var(--ui-dialog-body-gap)] px-4 py-[var(--ui-dialog-body-padding-y)]",
+      className: "flex min-h-[var(--ui-dialog-body-height-min)] flex-col justify-center-safe gap-[var(--ui-dialog-body-gap)] overflow-y-auto px-4 py-[var(--ui-dialog-body-padding-y)]",
       children: typeof e == "string" ? /* @__PURE__ */ o("p", { className: "text-sm leading-6 text-foreground", children: e }) : e
     }
   );
@@ -235,30 +235,30 @@ const ae = {
     loadingLabel: r,
     hasHeader: d = !0,
     hasFooter: s = !0,
-    children: g,
-    title: p,
-    objectName: u,
+    children: p,
+    title: g,
+    objectName: m,
     objectNameLabel: b,
     secondaryLabel: f,
-    primaryLabel: m,
+    primaryLabel: u,
     onPrimaryAction: L,
     footer: R,
     closeLabel: T,
     size: V,
-    portal: z,
-    portalContainer: k,
+    portal: k,
+    portalContainer: z,
     keepMounted: A,
     className: B,
     ...j
   }, S) => {
-    const t = ae[e], F = typeof t.title == "function" ? t.title(u) : t.title, O = typeof t.body == "function" ? t.body(u, b) : t.body, I = g ?? O, h = p ?? F, G = f ?? t.secondaryLabel, P = m ?? t.primaryLabel;
+    const t = ae[e], F = typeof t.title == "function" ? t.title(m) : t.title, O = typeof t.body == "function" ? t.body(m, b) : t.body, I = p ?? O, h = g ?? F, G = f ?? t.secondaryLabel, P = u ?? t.primaryLabel;
     return /* @__PURE__ */ o(J, { ...j, children: /* @__PURE__ */ c(
-      w,
+      C,
       {
         ref: S,
         size: V ?? (e === "wide" ? "large" : "sm"),
-        portal: z,
-        portalContainer: k,
+        portal: k,
+        portalContainer: z,
         keepMounted: A,
         className: B,
         "aria-busy": a || void 0,
@@ -301,11 +301,11 @@ export {
   Q as DialogBodyRoot,
   x as DialogClose,
   N as DialogCloseButton,
-  w as DialogContent,
+  C as DialogContent,
   W as DialogDescription,
   M as DialogFooterRoot,
   K as DialogHeaderRoot,
-  C as DialogOverlay,
+  w as DialogOverlay,
   J as DialogRoot,
   v as DialogTitle,
   q as dialogContentVariants

package/dist/components/ui/dialog/dialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"dialog.js","sources":["../../../../src/components/ui/dialog/dialog.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Dialog as DialogPrimitive } from '@base-ui/react/dialog';\nimport { TimesIcon } from '@acronis-platform/icons-react/stroke-mono';\nimport { cva, type VariantProps } from 'class-variance-authority';\n\nimport { cn } from '@/lib/utils';\nimport { usePortalContainer } from '@/lib/portal-container';\n\nimport { Button } from '../button';\nimport { DialogFooterDefault } from '../dialog-footer-default';\nimport { InputText } from '../input-text';\nimport { Loading } from '../loading';\n\n// Initial version ported from `@acronis-platform/shadcn-uikit`'s `dialog`\n// (packages/ui-legacy/src/components/ui/dialog.tsx). A modal overlay built on\n// the Base UI Dialog primitive (keyboard, focus trap, scroll lock, ARIA come\n// from Base UI). A `--ui-dialog-*` / `--ui-button-icon-*` token tier covers the\n// container + close button (reconciled against the Figma \"DialogDefault\" node,\n// 6343:58898); the composable DialogRoot / DialogHeaderRoot / DialogFooterRoot\n// / DialogBodyRoot parts below are internal-only (no public export, no Figma\n// node of their own) and keep the prior semantic-token approach — not to be\n// confused with the recipe-local `DialogHeader`/`DialogBody` further down,\n// which back the public `Dialog` and are reconciled against Figma:\n//   • overlay  -> var(--ui-background-backdrop-screen)   (legacy `bg-black/80`)\n//   • popup    -> var(--ui-dialog-container-color) / var(--ui-dialog-container-border-radius)\n//   • header / footer -> bg-background = --ui-background-surface-primary (white\n//     bars over the muted body), divided by border-border\n//   • title    -> text-foreground / description -> text-muted-foreground\n//   • close    -> var(--ui-button-icon-global-icon-color-*) (idle/hover/active\n//     share one blue in the default brand), bg via\n//     var(--ui-button-icon-global-container-color-*), focus ring var(--ui-focus-primary)\n// Enter/exit animations use `tw-animate-css` (imported in styles/index.css),\n// keyed to Base UI's data-[open] / data-[closed] state attributes — overlay\n// fades, popup fades + zooms. `size` has two values: `sm` (512px, the Figma\n// default, backed by `--ui-dialog-container-size-sm`) and `large` (832px) — the\n// latter predates the Figma node and has no token; it's kept as a plain\n// arbitrary value solely for backward compatibility with existing call sites\n// that need a wider popup (see the `Large` story).\n//\n// Dialog's composable primitive parts (this file) are internal-only — not\n// re-exported from the package root — except `DialogClose`, which stays\n// public: it's required by the `wide` variant's documented custom-`footer`\n// escape hatch (see the `footer` prop and dialog.mdx). The public `Dialog`\n// component below is the sole sanctioned entry point; it's built on these\n// parts internally. (In Figma the matching component set is named\n// \"DialogDefault\"; the code-facing name stays `Dialog` — see dialog.figma.tsx.)\n\nconst dialogContentVariants = cva(\n  'fixed left-1/2 top-1/2 z-50 flex w-full min-w-[var(--ui-dialog-container-width-min)] -translate-x-1/2 -translate-y-1/2 flex-col overflow-hidden rounded-[var(--ui-dialog-container-border-radius)] bg-[var(--ui-dialog-container-color)] text-foreground shadow-lg duration-200 data-[open]:animate-in data-[open]:fade-in-0 data-[open]:zoom-in-95 data-[closed]:animate-out data-[closed]:fade-out-0 data-[closed]:zoom-out-95',\n  {\n    variants: {\n      size: {\n        sm: 'max-w-[var(--ui-dialog-container-size-sm)]',\n        large: 'max-w-[832px]',\n      },\n    },\n    defaultVariants: {\n      size: 'sm',\n    },\n  }\n);\n\nconst DialogRoot = DialogPrimitive.Root;\n\nconst DialogTrigger = DialogPrimitive.Trigger;\n\nconst DialogPortal = DialogPrimitive.Portal;\n\nconst DialogClose = DialogPrimitive.Close;\n\nconst DialogOverlay = React.forwardRef<\n  React.ElementRef<typeof DialogPrimitive.Backdrop>,\n  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Backdrop>\n>(({ className, ...props }, ref) => (\n  <DialogPrimitive.Backdrop\n    ref={ref}\n    className={cn(\n      'fixed inset-0 z-50 bg-[var(--ui-background-backdrop-screen)] duration-200 data-[open]:animate-in data-[open]:fade-in-0 data-[closed]:animate-out data-[closed]:fade-out-0',\n      className\n    )}\n    {...props}\n  />\n));\nDialogOverlay.displayName = 'DialogOverlay';\n\nexport interface DialogContentProps\n  extends React.ComponentPropsWithoutRef<typeof DialogPrimitive.Popup>,\n    VariantProps<typeof dialogContentVariants> {\n  /**\n   * Popup max-width. `sm` (512px, default) is the Figma-defined size; `large`\n   * (832px) is a backward-compatibility size with no design token (see the\n   * `Large` story).\n   */\n  size?: VariantProps<typeof dialogContentVariants>['size'];\n  /**\n   * Render the content inside a portal (default `true`). Base UI requires the\n   * Popup to sit in a Portal for correct stacking; set `false` for inline usage\n   * (e.g. when the caller supplies its own `DialogPortal`, or in tests).\n   */\n  portal?: boolean;\n  /**\n   * Portal container. Pass a shadow-root mount for isolated-style previews\n   * (the docs demos do this via `useShadowMount`).\n   */\n  portalContainer?: DialogPrimitive.Portal.Props['container'];\n  /** Keep the content mounted while closed (Base UI `Portal` prop). */\n  keepMounted?: DialogPrimitive.Portal.Props['keepMounted'];\n}\n\nconst DialogContent = React.forwardRef<\n  React.ElementRef<typeof DialogPrimitive.Popup>,\n  DialogContentProps\n>(\n  (\n    {\n      className,\n      children,\n      size,\n      portal = true,\n      portalContainer,\n      keepMounted,\n      ...props\n    },\n    ref\n  ) => {\n    const ctxContainer = usePortalContainer();\n    const resolvedContainer = portalContainer ?? ctxContainer;\n\n    const popup = (\n      <>\n        <DialogOverlay />\n        <DialogPrimitive.Popup\n          ref={ref}\n          className={cn(dialogContentVariants({ size }), className)}\n          {...props}\n        >\n          {children}\n        </DialogPrimitive.Popup>\n      </>\n    );\n\n    return portal ? (\n      <DialogPrimitive.Portal container={resolvedContainer} keepMounted={keepMounted}>\n        {popup}\n      </DialogPrimitive.Portal>\n    ) : (\n      popup\n    );\n  }\n);\nDialogContent.displayName = 'DialogContent';\n\nconst DialogHeaderRoot = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn(\n      'flex h-16 items-center gap-4 border-b border-border bg-background px-5 py-4',\n      className\n    )}\n    {...props}\n  />\n));\nDialogHeaderRoot.displayName = 'DialogHeaderRoot';\n\nconst DialogFooterRoot = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn(\n      'flex h-16 items-center justify-end gap-4 border-t border-border bg-background px-6 py-4',\n      className\n    )}\n    {...props}\n  />\n));\nDialogFooterRoot.displayName = 'DialogFooterRoot';\n\nconst DialogBodyRoot = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div ref={ref} className={cn('flex-1 overflow-auto p-6', className)} {...props} />\n));\nDialogBodyRoot.displayName = 'DialogBodyRoot';\n\nconst DialogTitle = React.forwardRef<\n  React.ElementRef<typeof DialogPrimitive.Title>,\n  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Title>\n>(({ className, ...props }, ref) => (\n  <DialogPrimitive.Title\n    ref={ref}\n    className={cn(\n      'flex-1 text-2xl font-normal leading-8 text-foreground',\n      className\n    )}\n    {...props}\n  />\n));\nDialogTitle.displayName = 'DialogTitle';\n\nconst DialogDescription = React.forwardRef<\n  React.ElementRef<typeof DialogPrimitive.Description>,\n  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Description>\n>(({ className, ...props }, ref) => (\n  <DialogPrimitive.Description\n    ref={ref}\n    className={cn('text-sm text-muted-foreground', className)}\n    {...props}\n  />\n));\nDialogDescription.displayName = 'DialogDescription';\n\nexport interface DialogCloseButtonProps\n  extends React.ComponentPropsWithoutRef<typeof DialogPrimitive.Close> {\n  /** Accessible name for screen readers. Defaults to `'Close'`. */\n  closeLabel?: string;\n}\n\nconst DialogCloseButton = React.forwardRef<\n  React.ElementRef<typeof DialogPrimitive.Close>,\n  DialogCloseButtonProps\n>(({ className, closeLabel = 'Close', ...props }, ref) => (\n  <DialogPrimitive.Close\n    ref={ref}\n    className={cn(\n      'cursor-pointer rounded p-1 text-[var(--ui-button-icon-global-icon-color-idle)] transition-colors hover:bg-[var(--ui-button-icon-global-container-color-hover)] hover:text-[var(--ui-button-icon-global-icon-color-hover)] active:bg-[var(--ui-button-icon-global-container-color-active)] active:text-[var(--ui-button-icon-global-icon-color-active)] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ui-focus-primary)] disabled:pointer-events-none disabled:cursor-default disabled:text-[var(--ui-button-icon-global-icon-color-disabled)]',\n      className\n    )}\n    {...props}\n  >\n    <TimesIcon size={24} />\n    <span className=\"sr-only\">{closeLabel}</span>\n  </DialogPrimitive.Close>\n));\nDialogCloseButton.displayName = 'DialogCloseButton';\n\n// The recipe-specific header: title + close button, reconciled against the\n// Figma \"DialogHeader\" node (4220:3516) via the `--ui-dialog-header-*` tier.\n// Local to this file (not exported) — distinct from the generic, unstyled\n// `DialogHeaderRoot` composable primitive above.\ninterface DialogHeaderProps {\n  title: string;\n  closeLabel?: string;\n}\n\nfunction DialogHeader({ title, closeLabel }: DialogHeaderProps) {\n  return (\n    <div className=\"flex h-[var(--ui-dialog-header-height)] items-center gap-[var(--ui-dialog-header-gap)] border-b-[length:var(--ui-dialog-header-border-width)] border-[var(--ui-dialog-header-border-color)] bg-[var(--ui-dialog-header-color)] px-[var(--ui-dialog-header-padding-x)]\">\n      <DialogTitle>{title}</DialogTitle>\n      <DialogCloseButton closeLabel={closeLabel} />\n    </div>\n  );\n}\n\n// The recipe-specific body: the variant's canned copy (or the `children`\n// override), reconciled against the Figma DialogDefault node via the\n// `--ui-dialog-body-*` tier. Local to this file — distinct from the generic\n// `DialogBodyRoot` composable primitive above.\ninterface DialogBodyProps {\n  children: React.ReactNode;\n  /** Makes the body unfocusable/unclickable while the loading overlay is shown. */\n  inert?: boolean;\n}\n\nfunction DialogBody({ children, inert }: DialogBodyProps) {\n  return (\n    <div\n      inert={inert}\n      className=\"flex min-h-[var(--ui-dialog-body-height-min)] flex-col justify-center gap-[var(--ui-dialog-body-gap)] px-4 py-[var(--ui-dialog-body-padding-y)]\"\n    >\n      {typeof children === 'string' ? (\n        <p className=\"text-sm leading-6 text-foreground\">{children}</p>\n      ) : (\n        children\n      )}\n    </div>\n  );\n}\n\n// The recipe-specific footer actions: a secondary (dismiss) button plus a\n// primary action, the latter either closing the dialog itself (`read-only`'s\n// \"Done\") or firing `onPrimaryAction` and leaving the close to the caller.\n// Local to this file — distinct from the generic `DialogFooterRoot`.\ninterface DialogFooterActionsProps {\n  secondaryLabel?: string;\n  primaryLabel: string;\n  primaryVariant: 'default' | 'destructive';\n  primaryCloses?: boolean;\n  onPrimaryAction?: () => void;\n}\n\nfunction DialogFooterActions({\n  secondaryLabel,\n  primaryLabel,\n  primaryVariant,\n  primaryCloses,\n  onPrimaryAction,\n}: DialogFooterActionsProps) {\n  return (\n    <>\n      {secondaryLabel && (\n        <DialogClose render={<Button variant=\"secondary\">{secondaryLabel}</Button>} />\n      )}\n      {primaryCloses ? (\n        <DialogClose\n          onClick={onPrimaryAction}\n          render={<Button variant={primaryVariant}>{primaryLabel}</Button>}\n        />\n      ) : (\n        <Button variant={primaryVariant} onClick={onPrimaryAction}>\n          {primaryLabel}\n        </Button>\n      )}\n    </>\n  );\n}\n\n// A higher-level \"recipe\" built on top of the Dialog primitive parts above\n// (DialogRoot + DialogContent give the portal, backdrop, focus trap, scroll\n// lock and open state; DialogTitle wires the accessible name; DialogCloseButton\n// / DialogClose give the dismiss controls). It bakes in the seven Figma\n// \"DialogDefault\" use-cases (node 6343:58898) plus one legacy `wide` escape\n// hatch kept for backward compatibility: each `variant` picks a canned title,\n// body copy and footer buttons; `children` overrides only the body slot;\n// `title` overrides only the title; `footer` overrides only the footer's\n// action content (the free-form escape hatch `wide` relies on); `hasLoading`\n// drops a spinner overlay over the body + footer. `hasHeader`/`hasFooter`\n// (both default `true`) hide the header/footer chrome entirely — a\n// ui-react-only extension beyond the Figma DialogDefault contract, which\n// always shows both; the title stays rendered off-screen when the header is\n// hidden so the dialog keeps an accessible name.\n//\n// Colors resolve to shipped semantic tokens via the bridged Tailwind names the\n// Dialog family already uses (text-foreground, the backdrop + focus tokens\n// inside DialogContent / DialogCloseButton) and the Button / InputText token\n// tiers — nothing is hand-authored. The loading scrim renders `Loading`'s\n// `onSurfaceSecondary` variant (`--ui-loading-element-container-color-secondary`),\n// matching the design's translucent surface fill.\n//\n// Header + footer geometry/color resolve to the `--ui-dialog-header-*` /\n// `--ui-footer-*` tiers, reconciled against the DialogDefault Figma node.\n\nexport type DialogVariant =\n  | 'default'\n  | 'rename'\n  | 'save changes'\n  | 'reset password'\n  | 'discard changes'\n  | 'accept'\n  | 'read-only'\n  | 'wide';\n\ninterface DialogVariantContent {\n  /**\n   * The variant's canned title. A function receives `objectName` (falls back\n   * to its own placeholder default when omitted) for variants whose title\n   * embeds the acted-on object's name.\n   */\n  title: string | ((objectName?: string) => string);\n  /**\n   * Same `objectName` interpolation as `title`, for body copy/fields that\n   * embed it. The `rename` variant's field also receives `objectNameLabel`\n   * for its accessible name.\n   */\n  body:\n    | React.ReactNode\n    | ((objectName?: string, objectNameLabel?: string) => React.ReactNode);\n  /** Secondary (dismiss) button label. Omitted when the variant has none. */\n  secondaryLabel?: string;\n  primaryLabel: string;\n  primaryVariant: 'default' | 'destructive';\n  /** Whether the primary button dismisses the dialog (e.g. read-only \"Done\"). */\n  primaryCloses?: boolean;\n}\n\nconst DIALOG_VARIANT_CONTENT: Record<DialogVariant, DialogVariantContent> = {\n  default: {\n    title: 'Dialog title',\n    body: 'Drop any content into this slot.',\n    secondaryLabel: 'Cancel',\n    primaryLabel: 'Label',\n    primaryVariant: 'default',\n  },\n  rename: {\n    title: (objectName = 'object name') => `Rename ${objectName}`,\n    // `objectName` prefills the field with the real current name; the field's\n    // accessible name (`objectNameLabel`) is separate — it's the label, not the value.\n    body: (objectName = 'Current name', objectNameLabel = 'Object name') => (\n      <InputText aria-label={objectNameLabel} defaultValue={objectName} />\n    ),\n    secondaryLabel: 'Cancel',\n    primaryLabel: 'Rename',\n    primaryVariant: 'default',\n  },\n  'save changes': {\n    title: 'Save changes',\n    body: 'You have unsaved changes. Do you want to save them before leaving?',\n    secondaryLabel: 'Go back',\n    primaryLabel: 'Save',\n    primaryVariant: 'default',\n  },\n  'reset password': {\n    title: 'Reset password',\n    body: 'Further instructions will be sent to your email address.',\n    secondaryLabel: 'Cancel',\n    primaryLabel: 'Reset',\n    primaryVariant: 'default',\n  },\n  'discard changes': {\n    title: 'Discard changes',\n    body: (objectName = 'Object name') => (\n      <p className=\"text-sm leading-6 text-foreground\">\n        Are you sure you want to discard the unsaved changes to{' '}\n        <strong className=\"font-semibold\">{objectName}</strong>?\n      </p>\n    ),\n    secondaryLabel: 'Go back',\n    primaryLabel: 'Confirm',\n    primaryVariant: 'destructive',\n  },\n  accept: {\n    title: (objectName = 'object name') => `Accept ${objectName}`,\n    body: 'Click Accept to confirm that you have read, understood, and agree to the terms and conditions below.',\n    secondaryLabel: 'Cancel',\n    primaryLabel: 'Accept',\n    primaryVariant: 'default',\n  },\n  'read-only': {\n    title: 'License agreement',\n    body: 'This is a read-only dialog used to view legal documents such as the License Agreement, EULA updates, Terms of Service, and other legal documents.',\n    primaryLabel: 'Done',\n    primaryVariant: 'default',\n    primaryCloses: true,\n  },\n  // No Figma preset — a legacy, free-form escape hatch (see the `footer` prop\n  // and the `Large` story). This fallback title/body/footer only renders if\n  // the caller supplies neither `footer` nor `title`/`children` — every real\n  // `wide` call site overrides them.\n  wide: {\n    title: 'Dialog title',\n    body: 'Drop any content into this slot.',\n    secondaryLabel: 'Cancel',\n    primaryLabel: 'Confirm',\n    primaryVariant: 'default',\n  },\n};\n\ntype DialogRootProps = React.ComponentPropsWithoutRef<typeof DialogRoot>;\n\nexport interface DialogProps extends Omit<DialogRootProps, 'children'> {\n  /**\n   * Selects the canned title / body / footer preset. Defaults to `'default'`.\n   * `'wide'` is a legacy escape hatch (no canned preset) kept for backward\n   * compatibility — pair it with `size=\"large\"` and the `footer` prop.\n   */\n  variant?: DialogVariant;\n  /**\n   * Show a spinner overlay across the body + footer, and make both `inert`\n   * (unfocusable, unclickable, hidden from assistive tech) so a keyboard user\n   * can't activate the visually obscured footer buttons while busy.\n   */\n  hasLoading?: boolean;\n  /**\n   * Overrides the loading overlay's accessible label. Defaults to `Loading`'s\n   * own default (`'Data is loading…'`). Ignored when `hasLoading` is `false`.\n   */\n  loadingLabel?: string;\n  /**\n   * Show the header (title + close button). Defaults to `true`. When `false`,\n   * the title is still rendered off-screen so the dialog keeps an accessible\n   * name — only the visible bar and close button are omitted. Beyond the\n   * strict Figma contract (all seven `DialogDefault` variants always show the\n   * header); a ui-react-only extension, like `wide`/`size=\"large\"`.\n   */\n  hasHeader?: boolean;\n  /**\n   * Show the footer (action buttons). Defaults to `true`. Beyond the strict\n   * Figma contract (all seven `DialogDefault` variants always show the\n   * footer); a ui-react-only extension, like `wide`/`size=\"large\"`. When\n   * `false`, `footer` (and the canned footer it would otherwise replace) is\n   * not rendered either.\n   */\n  hasFooter?: boolean;\n  /** Overrides the variant's default body content. */\n  children?: React.ReactNode;\n  /** Overrides the variant's default title. */\n  title?: string;\n  /**\n   * The real name of the object being acted on (e.g. a file or resource\n   * name). Interpolated into the `rename`/`discard changes`/`accept`\n   * variants' canned title/body in place of the generic placeholder text;\n   * ignored by variants that don't reference an object name.\n   */\n  objectName?: string;\n  /**\n   * Overrides the accessible name of the `rename` variant's text field\n   * (default `'Object name'`). Ignored by every other variant.\n   */\n  objectNameLabel?: string;\n  /**\n   * Overrides the variant's default secondary (dismiss) button label. Passing\n   * this for a variant with no secondary button by default (e.g. `read-only`)\n   * also makes the button appear. Ignored when `footer` is provided.\n   */\n  secondaryLabel?: string;\n  /** Overrides the variant's default primary button label. Ignored when `footer` is provided. */\n  primaryLabel?: string;\n  /**\n   * Fires when the primary footer button is clicked. The dialog does not\n   * close automatically afterwards — pair this with `open`/`onOpenChange` to\n   * close it once the action completes. Ignored when `footer` is provided\n   * (wire behavior onto your own buttons there instead).\n   */\n  onPrimaryAction?: () => void;\n  /**\n   * Replaces the footer's action content entirely with free-form buttons —\n   * the escape hatch the `wide` variant is meant to be paired with, for\n   * legacy call sites that don't fit one of the seven canned presets. Ignored\n   * (along with the canned footer) when `hasFooter` is `false`.\n   */\n  footer?: React.ReactNode;\n  /** Overrides the close button's accessible name. Defaults to `'Close'`. */\n  closeLabel?: string;\n  /**\n   * Popup max-width (forwarded to `DialogContent`). Defaults to `'sm'`, or to\n   * `'large'` when `variant` is `'wide'`.\n   */\n  size?: DialogContentProps['size'];\n  /** Render inside a portal (forwarded to `DialogContent`). Defaults to `true`. */\n  portal?: boolean;\n  /** Portal container (forwarded to `DialogContent`). */\n  portalContainer?: DialogContentProps['portalContainer'];\n  /** Keep the content mounted while closed (forwarded to `DialogContent`). */\n  keepMounted?: DialogContentProps['keepMounted'];\n  /** Extra classes merged onto the popup container. */\n  className?: string;\n}\n\nconst Dialog = React.forwardRef<HTMLDivElement, DialogProps>(\n  (\n    {\n      variant = 'default',\n      hasLoading = false,\n      loadingLabel,\n      hasHeader = true,\n      hasFooter = true,\n      children,\n      title,\n      objectName,\n      objectNameLabel,\n      secondaryLabel,\n      primaryLabel,\n      onPrimaryAction,\n      footer,\n      closeLabel,\n      size,\n      portal,\n      portalContainer,\n      keepMounted,\n      className,\n      ...rootProps\n    },\n    ref\n  ) => {\n    const content = DIALOG_VARIANT_CONTENT[variant];\n    const resolvedTitle =\n      typeof content.title === 'function' ? content.title(objectName) : content.title;\n    const resolvedBody =\n      typeof content.body === 'function'\n        ? content.body(objectName, objectNameLabel)\n        : content.body;\n    const bodyContent = children ?? resolvedBody;\n    const titleText = title ?? resolvedTitle;\n    const secondaryLabelText = secondaryLabel ?? content.secondaryLabel;\n    const primaryLabelText = primaryLabel ?? content.primaryLabel;\n    const resolvedSize = size ?? (variant === 'wide' ? 'large' : 'sm');\n\n    return (\n      <DialogRoot {...rootProps}>\n        <DialogContent\n          ref={ref}\n          size={resolvedSize}\n          portal={portal}\n          portalContainer={portalContainer}\n          keepMounted={keepMounted}\n          className={className}\n          aria-busy={hasLoading || undefined}\n        >\n          {hasHeader ? (\n            <DialogHeader title={titleText} closeLabel={closeLabel} />\n          ) : (\n            // Header hidden, but the dialog still needs an accessible name.\n            <DialogTitle className=\"sr-only\">{titleText}</DialogTitle>\n          )}\n\n          <DialogBody inert={hasLoading}>{bodyContent}</DialogBody>\n\n          {hasFooter && (\n            <DialogFooterDefault inert={hasLoading}>\n              {footer ?? (\n                <DialogFooterActions\n                  secondaryLabel={secondaryLabelText}\n                  primaryLabel={primaryLabelText}\n                  primaryVariant={content.primaryVariant}\n                  primaryCloses={content.primaryCloses}\n                  onPrimaryAction={onPrimaryAction}\n                />\n              )}\n            </DialogFooterDefault>\n          )}\n\n          {hasLoading && (\n            <Loading\n              variant=\"onSurfaceSecondary\"\n              hasLabel={false}\n              label={loadingLabel}\n              className={cn(\n                'absolute inset-x-0 bottom-0 rounded-none',\n                hasHeader ? 'top-[var(--ui-dialog-header-height)]' : 'top-0'\n              )}\n            />\n          )}\n        </DialogContent>\n      </DialogRoot>\n    );\n  }\n);\nDialog.displayName = 'Dialog';\n\nexport {\n  DialogRoot,\n  DialogPortal,\n  DialogOverlay,\n  DialogClose,\n  DialogCloseButton,\n  DialogTrigger,\n  DialogContent,\n  DialogHeaderRoot,\n  DialogFooterRoot,\n  DialogTitle,\n  DialogBodyRoot,\n  DialogDescription,\n  dialogContentVariants,\n  Dialog,\n};\n"],"names":["dialogContentVariants","cva","DialogRoot","DialogPrimitive","DialogClose","DialogOverlay","React","className","props","ref","jsx","cn","DialogContent","children","size","portal","portalContainer","keepMounted","ctxContainer","usePortalContainer","resolvedContainer","popup","jsxs","Fragment","DialogHeaderRoot","DialogFooterRoot","DialogBodyRoot","DialogTitle","DialogDescription","DialogCloseButton","closeLabel","TimesIcon","DialogHeader","title","DialogBody","inert","DialogFooterActions","secondaryLabel","primaryLabel","primaryVariant","primaryCloses","onPrimaryAction","Button","DIALOG_VARIANT_CONTENT","objectName","objectNameLabel","InputText","Dialog","variant","hasLoading","loadingLabel","hasHeader","hasFooter","footer","rootProps","content","resolvedTitle","resolvedBody","bodyContent","titleText","secondaryLabelText","primaryLabelText","DialogFooterDefault","Loading"],"mappings":"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"}
+{"version":3,"file":"dialog.js","sources":["../../../../src/components/ui/dialog/dialog.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Dialog as DialogPrimitive } from '@base-ui/react/dialog';\nimport { TimesIcon } from '@acronis-platform/icons-react/stroke-mono';\nimport { cva, type VariantProps } from 'class-variance-authority';\n\nimport { cn } from '@/lib/utils';\nimport { usePortalContainer } from '@/lib/portal-container';\n\nimport { Button } from '../button';\nimport { DialogFooterDefault } from '../dialog-footer-default';\nimport { InputText } from '../input-text';\nimport { Loading } from '../loading';\n\n// Initial version ported from `@acronis-platform/shadcn-uikit`'s `dialog`\n// (packages/ui-legacy/src/components/ui/dialog.tsx). A modal overlay built on\n// the Base UI Dialog primitive (keyboard, focus trap, scroll lock, ARIA come\n// from Base UI). A `--ui-dialog-*` / `--ui-button-icon-*` token tier covers the\n// container + close button (reconciled against the Figma \"DialogDefault\" node,\n// 6343:58898); the composable DialogRoot / DialogHeaderRoot / DialogFooterRoot\n// / DialogBodyRoot parts below are internal-only (no public export, no Figma\n// node of their own) and keep the prior semantic-token approach — not to be\n// confused with the recipe-local `DialogHeader`/`DialogBody` further down,\n// which back the public `Dialog` and are reconciled against Figma:\n//   • overlay  -> var(--ui-background-backdrop-screen)   (legacy `bg-black/80`)\n//   • popup    -> var(--ui-dialog-container-color) / var(--ui-dialog-container-border-radius)\n//   • header / footer -> bg-background = --ui-background-surface-primary (white\n//     bars over the muted body), divided by border-border\n//   • title    -> text-foreground / description -> text-muted-foreground\n//   • close    -> var(--ui-button-icon-global-icon-color-*) (idle/hover/active\n//     share one blue in the default brand), bg via\n//     var(--ui-button-icon-global-container-color-*), focus ring var(--ui-focus-primary)\n// Enter/exit animations use `tw-animate-css` (imported in styles/index.css),\n// keyed to Base UI's data-[open] / data-[closed] state attributes — overlay\n// fades, popup fades + zooms. `size` has two values: `sm` (512px, the Figma\n// default, backed by `--ui-dialog-container-size-sm`) and `large` (832px) — the\n// latter predates the Figma node and has no token; it's kept as a plain\n// arbitrary value solely for backward compatibility with existing call sites\n// that need a wider popup (see the `Large` story).\n//\n// Dialog's composable primitive parts (this file) are internal-only — not\n// re-exported from the package root — except `DialogClose`, which stays\n// public: it's required by the `wide` variant's documented custom-`footer`\n// escape hatch (see the `footer` prop and dialog.mdx). The public `Dialog`\n// component below is the sole sanctioned entry point; it's built on these\n// parts internally. (In Figma the matching component set is named\n// \"DialogDefault\"; the code-facing name stays `Dialog` — see dialog.figma.tsx.)\n\n// Figma's \"DialogWelcome\" frame (variant=carousel, node 6353:6164) wraps its\n// popup preview in a `p-[48px]` ancestor — the minimum margin the popup must\n// keep from the viewport edge on any screen size. `max-w`/`max-h` (not\n// padding, since the popup itself is centered via `fixed` + transform)\n// enforce it here so every consumer keeps that margin, not just the frame\n// that surfaced it.\nconst dialogContentVariants = cva(\n  'fixed left-1/2 top-1/2 z-50 flex max-h-[calc(100dvh-96px)] w-full min-w-[var(--ui-dialog-container-width-min)] -translate-x-1/2 -translate-y-1/2 flex-col overflow-hidden rounded-[var(--ui-dialog-container-border-radius)] bg-[var(--ui-dialog-container-color)] text-foreground shadow-lg duration-200 data-[open]:animate-in data-[open]:fade-in-0 data-[open]:zoom-in-95 data-[closed]:animate-out data-[closed]:fade-out-0 data-[closed]:zoom-out-95',\n  {\n    variants: {\n      size: {\n        sm: 'max-w-[min(var(--ui-dialog-container-size-sm),calc(100dvw-96px))]',\n        large: 'max-w-[min(832px,calc(100dvw-96px))]',\n      },\n    },\n    defaultVariants: {\n      size: 'sm',\n    },\n  }\n);\n\nconst DialogRoot = DialogPrimitive.Root;\n\nconst DialogTrigger = DialogPrimitive.Trigger;\n\nconst DialogPortal = DialogPrimitive.Portal;\n\nconst DialogClose = DialogPrimitive.Close;\n\nconst DialogOverlay = React.forwardRef<\n  React.ElementRef<typeof DialogPrimitive.Backdrop>,\n  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Backdrop>\n>(({ className, ...props }, ref) => (\n  <DialogPrimitive.Backdrop\n    ref={ref}\n    className={cn(\n      'fixed inset-0 z-50 bg-[var(--ui-background-backdrop-screen)] duration-200 data-[open]:animate-in data-[open]:fade-in-0 data-[closed]:animate-out data-[closed]:fade-out-0',\n      className\n    )}\n    {...props}\n  />\n));\nDialogOverlay.displayName = 'DialogOverlay';\n\nexport interface DialogContentProps\n  extends React.ComponentPropsWithoutRef<typeof DialogPrimitive.Popup>,\n    VariantProps<typeof dialogContentVariants> {\n  /**\n   * Popup max-width. `sm` (512px, default) is the Figma-defined size; `large`\n   * (832px) is a backward-compatibility size with no design token (see the\n   * `Large` story).\n   */\n  size?: VariantProps<typeof dialogContentVariants>['size'];\n  /**\n   * Render the content inside a portal (default `true`). Base UI requires the\n   * Popup to sit in a Portal for correct stacking; set `false` for inline usage\n   * (e.g. when the caller supplies its own `DialogPortal`, or in tests).\n   */\n  portal?: boolean;\n  /**\n   * Portal container. Pass a shadow-root mount for isolated-style previews\n   * (the docs demos do this via `useShadowMount`).\n   */\n  portalContainer?: DialogPrimitive.Portal.Props['container'];\n  /** Keep the content mounted while closed (Base UI `Portal` prop). */\n  keepMounted?: DialogPrimitive.Portal.Props['keepMounted'];\n}\n\nconst DialogContent = React.forwardRef<\n  React.ElementRef<typeof DialogPrimitive.Popup>,\n  DialogContentProps\n>(\n  (\n    {\n      className,\n      children,\n      size,\n      portal = true,\n      portalContainer,\n      keepMounted,\n      ...props\n    },\n    ref\n  ) => {\n    const ctxContainer = usePortalContainer();\n    const resolvedContainer = portalContainer ?? ctxContainer;\n\n    const popup = (\n      <>\n        <DialogOverlay />\n        <DialogPrimitive.Popup\n          ref={ref}\n          className={cn(dialogContentVariants({ size }), className)}\n          {...props}\n        >\n          {children}\n        </DialogPrimitive.Popup>\n      </>\n    );\n\n    return portal ? (\n      <DialogPrimitive.Portal container={resolvedContainer} keepMounted={keepMounted}>\n        {popup}\n      </DialogPrimitive.Portal>\n    ) : (\n      popup\n    );\n  }\n);\nDialogContent.displayName = 'DialogContent';\n\nconst DialogHeaderRoot = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn(\n      'flex h-16 items-center gap-4 border-b border-border bg-background px-5 py-4',\n      className\n    )}\n    {...props}\n  />\n));\nDialogHeaderRoot.displayName = 'DialogHeaderRoot';\n\nconst DialogFooterRoot = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn(\n      'flex h-16 items-center justify-end gap-4 border-t border-border bg-background px-6 py-4',\n      className\n    )}\n    {...props}\n  />\n));\nDialogFooterRoot.displayName = 'DialogFooterRoot';\n\nconst DialogBodyRoot = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div ref={ref} className={cn('flex-1 overflow-auto p-6', className)} {...props} />\n));\nDialogBodyRoot.displayName = 'DialogBodyRoot';\n\nconst DialogTitle = React.forwardRef<\n  React.ElementRef<typeof DialogPrimitive.Title>,\n  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Title>\n>(({ className, ...props }, ref) => (\n  <DialogPrimitive.Title\n    ref={ref}\n    className={cn(\n      'flex-1 text-2xl font-normal leading-8 text-foreground',\n      className\n    )}\n    {...props}\n  />\n));\nDialogTitle.displayName = 'DialogTitle';\n\nconst DialogDescription = React.forwardRef<\n  React.ElementRef<typeof DialogPrimitive.Description>,\n  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Description>\n>(({ className, ...props }, ref) => (\n  <DialogPrimitive.Description\n    ref={ref}\n    className={cn('text-sm text-muted-foreground', className)}\n    {...props}\n  />\n));\nDialogDescription.displayName = 'DialogDescription';\n\nexport interface DialogCloseButtonProps\n  extends React.ComponentPropsWithoutRef<typeof DialogPrimitive.Close> {\n  /** Accessible name for screen readers. Defaults to `'Close'`. */\n  closeLabel?: string;\n}\n\nconst DialogCloseButton = React.forwardRef<\n  React.ElementRef<typeof DialogPrimitive.Close>,\n  DialogCloseButtonProps\n>(({ className, closeLabel = 'Close', ...props }, ref) => (\n  <DialogPrimitive.Close\n    ref={ref}\n    className={cn(\n      'cursor-pointer rounded p-1 text-[var(--ui-button-icon-global-icon-color-idle)] transition-colors hover:bg-[var(--ui-button-icon-global-container-color-hover)] hover:text-[var(--ui-button-icon-global-icon-color-hover)] active:bg-[var(--ui-button-icon-global-container-color-active)] active:text-[var(--ui-button-icon-global-icon-color-active)] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ui-focus-primary)] disabled:pointer-events-none disabled:cursor-default disabled:text-[var(--ui-button-icon-global-icon-color-disabled)]',\n      className\n    )}\n    {...props}\n  >\n    <TimesIcon size={24} />\n    <span className=\"sr-only\">{closeLabel}</span>\n  </DialogPrimitive.Close>\n));\nDialogCloseButton.displayName = 'DialogCloseButton';\n\n// The recipe-specific header: title + close button, reconciled against the\n// Figma \"DialogHeader\" node (4220:3516) via the `--ui-dialog-header-*` tier.\n// Local to this file (not exported) — distinct from the generic, unstyled\n// `DialogHeaderRoot` composable primitive above.\ninterface DialogHeaderProps {\n  title: string;\n  closeLabel?: string;\n}\n\nfunction DialogHeader({ title, closeLabel }: DialogHeaderProps) {\n  return (\n    <div className=\"flex h-[var(--ui-dialog-header-height)] shrink-0 items-center gap-[var(--ui-dialog-header-gap)] border-b-[length:var(--ui-dialog-header-border-width)] border-[var(--ui-dialog-header-border-color)] bg-[var(--ui-dialog-header-color)] px-[var(--ui-dialog-header-padding-x)]\">\n      <DialogTitle>{title}</DialogTitle>\n      <DialogCloseButton closeLabel={closeLabel} />\n    </div>\n  );\n}\n\n// The recipe-specific body: the variant's canned copy (or the `children`\n// override), reconciled against the Figma DialogDefault node via the\n// `--ui-dialog-body-*` tier. Local to this file — distinct from the generic\n// `DialogBodyRoot` composable primitive above.\ninterface DialogBodyProps {\n  children: React.ReactNode;\n  /** Makes the body unfocusable/unclickable while the loading overlay is shown. */\n  inert?: boolean;\n}\n\nfunction DialogBody({ children, inert }: DialogBodyProps) {\n  return (\n    <div\n      inert={inert}\n      className=\"flex min-h-[var(--ui-dialog-body-height-min)] flex-col justify-center-safe gap-[var(--ui-dialog-body-gap)] overflow-y-auto px-4 py-[var(--ui-dialog-body-padding-y)]\"\n    >\n      {typeof children === 'string' ? (\n        <p className=\"text-sm leading-6 text-foreground\">{children}</p>\n      ) : (\n        children\n      )}\n    </div>\n  );\n}\n\n// The recipe-specific footer actions: a secondary (dismiss) button plus a\n// primary action, the latter either closing the dialog itself (`read-only`'s\n// \"Done\") or firing `onPrimaryAction` and leaving the close to the caller.\n// Local to this file — distinct from the generic `DialogFooterRoot`.\ninterface DialogFooterActionsProps {\n  secondaryLabel?: string;\n  primaryLabel: string;\n  primaryVariant: 'default' | 'destructive';\n  primaryCloses?: boolean;\n  onPrimaryAction?: () => void;\n}\n\nfunction DialogFooterActions({\n  secondaryLabel,\n  primaryLabel,\n  primaryVariant,\n  primaryCloses,\n  onPrimaryAction,\n}: DialogFooterActionsProps) {\n  return (\n    <>\n      {secondaryLabel && (\n        <DialogClose render={<Button variant=\"secondary\">{secondaryLabel}</Button>} />\n      )}\n      {primaryCloses ? (\n        <DialogClose\n          onClick={onPrimaryAction}\n          render={<Button variant={primaryVariant}>{primaryLabel}</Button>}\n        />\n      ) : (\n        <Button variant={primaryVariant} onClick={onPrimaryAction}>\n          {primaryLabel}\n        </Button>\n      )}\n    </>\n  );\n}\n\n// A higher-level \"recipe\" built on top of the Dialog primitive parts above\n// (DialogRoot + DialogContent give the portal, backdrop, focus trap, scroll\n// lock and open state; DialogTitle wires the accessible name; DialogCloseButton\n// / DialogClose give the dismiss controls). It bakes in the seven Figma\n// \"DialogDefault\" use-cases (node 6343:58898) plus one legacy `wide` escape\n// hatch kept for backward compatibility: each `variant` picks a canned title,\n// body copy and footer buttons; `children` overrides only the body slot;\n// `title` overrides only the title; `footer` overrides only the footer's\n// action content (the free-form escape hatch `wide` relies on); `hasLoading`\n// drops a spinner overlay over the body + footer. `hasHeader`/`hasFooter`\n// (both default `true`) hide the header/footer chrome entirely — a\n// ui-react-only extension beyond the Figma DialogDefault contract, which\n// always shows both; the title stays rendered off-screen when the header is\n// hidden so the dialog keeps an accessible name.\n//\n// Colors resolve to shipped semantic tokens via the bridged Tailwind names the\n// Dialog family already uses (text-foreground, the backdrop + focus tokens\n// inside DialogContent / DialogCloseButton) and the Button / InputText token\n// tiers — nothing is hand-authored. The loading scrim renders `Loading`'s\n// `onSurfaceSecondary` variant (`--ui-loading-element-container-color-secondary`),\n// matching the design's translucent surface fill.\n//\n// Header + footer geometry/color resolve to the `--ui-dialog-header-*` /\n// `--ui-footer-*` tiers, reconciled against the DialogDefault Figma node.\n\nexport type DialogVariant =\n  | 'default'\n  | 'rename'\n  | 'save changes'\n  | 'reset password'\n  | 'discard changes'\n  | 'accept'\n  | 'read-only'\n  | 'wide';\n\ninterface DialogVariantContent {\n  /**\n   * The variant's canned title. A function receives `objectName` (falls back\n   * to its own placeholder default when omitted) for variants whose title\n   * embeds the acted-on object's name.\n   */\n  title: string | ((objectName?: string) => string);\n  /**\n   * Same `objectName` interpolation as `title`, for body copy/fields that\n   * embed it. The `rename` variant's field also receives `objectNameLabel`\n   * for its accessible name.\n   */\n  body:\n    | React.ReactNode\n    | ((objectName?: string, objectNameLabel?: string) => React.ReactNode);\n  /** Secondary (dismiss) button label. Omitted when the variant has none. */\n  secondaryLabel?: string;\n  primaryLabel: string;\n  primaryVariant: 'default' | 'destructive';\n  /** Whether the primary button dismisses the dialog (e.g. read-only \"Done\"). */\n  primaryCloses?: boolean;\n}\n\nconst DIALOG_VARIANT_CONTENT: Record<DialogVariant, DialogVariantContent> = {\n  default: {\n    title: 'Dialog title',\n    body: 'Drop any content into this slot.',\n    secondaryLabel: 'Cancel',\n    primaryLabel: 'Label',\n    primaryVariant: 'default',\n  },\n  rename: {\n    title: (objectName = 'object name') => `Rename ${objectName}`,\n    // `objectName` prefills the field with the real current name; the field's\n    // accessible name (`objectNameLabel`) is separate — it's the label, not the value.\n    body: (objectName = 'Current name', objectNameLabel = 'Object name') => (\n      <InputText aria-label={objectNameLabel} defaultValue={objectName} />\n    ),\n    secondaryLabel: 'Cancel',\n    primaryLabel: 'Rename',\n    primaryVariant: 'default',\n  },\n  'save changes': {\n    title: 'Save changes',\n    body: 'You have unsaved changes. Do you want to save them before leaving?',\n    secondaryLabel: 'Go back',\n    primaryLabel: 'Save',\n    primaryVariant: 'default',\n  },\n  'reset password': {\n    title: 'Reset password',\n    body: 'Further instructions will be sent to your email address.',\n    secondaryLabel: 'Cancel',\n    primaryLabel: 'Reset',\n    primaryVariant: 'default',\n  },\n  'discard changes': {\n    title: 'Discard changes',\n    body: (objectName = 'Object name') => (\n      <p className=\"text-sm leading-6 text-foreground\">\n        Are you sure you want to discard the unsaved changes to{' '}\n        <strong className=\"font-semibold\">{objectName}</strong>?\n      </p>\n    ),\n    secondaryLabel: 'Go back',\n    primaryLabel: 'Confirm',\n    primaryVariant: 'destructive',\n  },\n  accept: {\n    title: (objectName = 'object name') => `Accept ${objectName}`,\n    body: 'Click Accept to confirm that you have read, understood, and agree to the terms and conditions below.',\n    secondaryLabel: 'Cancel',\n    primaryLabel: 'Accept',\n    primaryVariant: 'default',\n  },\n  'read-only': {\n    title: 'License agreement',\n    body: 'This is a read-only dialog used to view legal documents such as the License Agreement, EULA updates, Terms of Service, and other legal documents.',\n    primaryLabel: 'Done',\n    primaryVariant: 'default',\n    primaryCloses: true,\n  },\n  // No Figma preset — a legacy, free-form escape hatch (see the `footer` prop\n  // and the `Large` story). This fallback title/body/footer only renders if\n  // the caller supplies neither `footer` nor `title`/`children` — every real\n  // `wide` call site overrides them.\n  wide: {\n    title: 'Dialog title',\n    body: 'Drop any content into this slot.',\n    secondaryLabel: 'Cancel',\n    primaryLabel: 'Confirm',\n    primaryVariant: 'default',\n  },\n};\n\ntype DialogRootProps = React.ComponentPropsWithoutRef<typeof DialogRoot>;\n\nexport interface DialogProps extends Omit<DialogRootProps, 'children'> {\n  /**\n   * Selects the canned title / body / footer preset. Defaults to `'default'`.\n   * `'wide'` is a legacy escape hatch (no canned preset) kept for backward\n   * compatibility — pair it with `size=\"large\"` and the `footer` prop.\n   */\n  variant?: DialogVariant;\n  /**\n   * Show a spinner overlay across the body + footer, and make both `inert`\n   * (unfocusable, unclickable, hidden from assistive tech) so a keyboard user\n   * can't activate the visually obscured footer buttons while busy.\n   */\n  hasLoading?: boolean;\n  /**\n   * Overrides the loading overlay's accessible label. Defaults to `Loading`'s\n   * own default (`'Data is loading…'`). Ignored when `hasLoading` is `false`.\n   */\n  loadingLabel?: string;\n  /**\n   * Show the header (title + close button). Defaults to `true`. When `false`,\n   * the title is still rendered off-screen so the dialog keeps an accessible\n   * name — only the visible bar and close button are omitted. Beyond the\n   * strict Figma contract (all seven `DialogDefault` variants always show the\n   * header); a ui-react-only extension, like `wide`/`size=\"large\"`.\n   */\n  hasHeader?: boolean;\n  /**\n   * Show the footer (action buttons). Defaults to `true`. Beyond the strict\n   * Figma contract (all seven `DialogDefault` variants always show the\n   * footer); a ui-react-only extension, like `wide`/`size=\"large\"`. When\n   * `false`, `footer` (and the canned footer it would otherwise replace) is\n   * not rendered either.\n   */\n  hasFooter?: boolean;\n  /** Overrides the variant's default body content. */\n  children?: React.ReactNode;\n  /** Overrides the variant's default title. */\n  title?: string;\n  /**\n   * The real name of the object being acted on (e.g. a file or resource\n   * name). Interpolated into the `rename`/`discard changes`/`accept`\n   * variants' canned title/body in place of the generic placeholder text;\n   * ignored by variants that don't reference an object name.\n   */\n  objectName?: string;\n  /**\n   * Overrides the accessible name of the `rename` variant's text field\n   * (default `'Object name'`). Ignored by every other variant.\n   */\n  objectNameLabel?: string;\n  /**\n   * Overrides the variant's default secondary (dismiss) button label. Passing\n   * this for a variant with no secondary button by default (e.g. `read-only`)\n   * also makes the button appear. Ignored when `footer` is provided.\n   */\n  secondaryLabel?: string;\n  /** Overrides the variant's default primary button label. Ignored when `footer` is provided. */\n  primaryLabel?: string;\n  /**\n   * Fires when the primary footer button is clicked. The dialog does not\n   * close automatically afterwards — pair this with `open`/`onOpenChange` to\n   * close it once the action completes. Ignored when `footer` is provided\n   * (wire behavior onto your own buttons there instead).\n   */\n  onPrimaryAction?: () => void;\n  /**\n   * Replaces the footer's action content entirely with free-form buttons —\n   * the escape hatch the `wide` variant is meant to be paired with, for\n   * legacy call sites that don't fit one of the seven canned presets. Ignored\n   * (along with the canned footer) when `hasFooter` is `false`.\n   */\n  footer?: React.ReactNode;\n  /** Overrides the close button's accessible name. Defaults to `'Close'`. */\n  closeLabel?: string;\n  /**\n   * Popup max-width (forwarded to `DialogContent`). Defaults to `'sm'`, or to\n   * `'large'` when `variant` is `'wide'`.\n   */\n  size?: DialogContentProps['size'];\n  /** Render inside a portal (forwarded to `DialogContent`). Defaults to `true`. */\n  portal?: boolean;\n  /** Portal container (forwarded to `DialogContent`). */\n  portalContainer?: DialogContentProps['portalContainer'];\n  /** Keep the content mounted while closed (forwarded to `DialogContent`). */\n  keepMounted?: DialogContentProps['keepMounted'];\n  /** Extra classes merged onto the popup container. */\n  className?: string;\n}\n\nconst Dialog = React.forwardRef<HTMLDivElement, DialogProps>(\n  (\n    {\n      variant = 'default',\n      hasLoading = false,\n      loadingLabel,\n      hasHeader = true,\n      hasFooter = true,\n      children,\n      title,\n      objectName,\n      objectNameLabel,\n      secondaryLabel,\n      primaryLabel,\n      onPrimaryAction,\n      footer,\n      closeLabel,\n      size,\n      portal,\n      portalContainer,\n      keepMounted,\n      className,\n      ...rootProps\n    },\n    ref\n  ) => {\n    const content = DIALOG_VARIANT_CONTENT[variant];\n    const resolvedTitle =\n      typeof content.title === 'function' ? content.title(objectName) : content.title;\n    const resolvedBody =\n      typeof content.body === 'function'\n        ? content.body(objectName, objectNameLabel)\n        : content.body;\n    const bodyContent = children ?? resolvedBody;\n    const titleText = title ?? resolvedTitle;\n    const secondaryLabelText = secondaryLabel ?? content.secondaryLabel;\n    const primaryLabelText = primaryLabel ?? content.primaryLabel;\n    const resolvedSize = size ?? (variant === 'wide' ? 'large' : 'sm');\n\n    return (\n      <DialogRoot {...rootProps}>\n        <DialogContent\n          ref={ref}\n          size={resolvedSize}\n          portal={portal}\n          portalContainer={portalContainer}\n          keepMounted={keepMounted}\n          className={className}\n          aria-busy={hasLoading || undefined}\n        >\n          {hasHeader ? (\n            <DialogHeader title={titleText} closeLabel={closeLabel} />\n          ) : (\n            // Header hidden, but the dialog still needs an accessible name.\n            <DialogTitle className=\"sr-only\">{titleText}</DialogTitle>\n          )}\n\n          <DialogBody inert={hasLoading}>{bodyContent}</DialogBody>\n\n          {hasFooter && (\n            <DialogFooterDefault inert={hasLoading}>\n              {footer ?? (\n                <DialogFooterActions\n                  secondaryLabel={secondaryLabelText}\n                  primaryLabel={primaryLabelText}\n                  primaryVariant={content.primaryVariant}\n                  primaryCloses={content.primaryCloses}\n                  onPrimaryAction={onPrimaryAction}\n                />\n              )}\n            </DialogFooterDefault>\n          )}\n\n          {hasLoading && (\n            <Loading\n              variant=\"onSurfaceSecondary\"\n              hasLabel={false}\n              label={loadingLabel}\n              className={cn(\n                'absolute inset-x-0 bottom-0 rounded-none',\n                hasHeader ? 'top-[var(--ui-dialog-header-height)]' : 'top-0'\n              )}\n            />\n          )}\n        </DialogContent>\n      </DialogRoot>\n    );\n  }\n);\nDialog.displayName = 'Dialog';\n\nexport {\n  DialogRoot,\n  DialogPortal,\n  DialogOverlay,\n  DialogClose,\n  DialogCloseButton,\n  DialogTrigger,\n  DialogContent,\n  DialogHeaderRoot,\n  DialogFooterRoot,\n  DialogTitle,\n  DialogBodyRoot,\n  DialogDescription,\n  dialogContentVariants,\n  Dialog,\n};\n"],"names":["dialogContentVariants","cva","DialogRoot","DialogPrimitive","DialogClose","DialogOverlay","React","className","props","ref","jsx","cn","DialogContent","children","size","portal","portalContainer","keepMounted","ctxContainer","usePortalContainer","resolvedContainer","popup","jsxs","Fragment","DialogHeaderRoot","DialogFooterRoot","DialogBodyRoot","DialogTitle","DialogDescription","DialogCloseButton","closeLabel","TimesIcon","DialogHeader","title","DialogBody","inert","DialogFooterActions","secondaryLabel","primaryLabel","primaryVariant","primaryCloses","onPrimaryAction","Button","DIALOG_VARIANT_CONTENT","objectName","objectNameLabel","InputText","Dialog","variant","hasLoading","loadingLabel","hasHeader","hasFooter","footer","rootProps","content","resolvedTitle","resolvedBody","bodyContent","titleText","secondaryLabelText","primaryLabelText","DialogFooterDefault","Loading"],"mappings":"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"}

package/dist/components/ui/dialog-footer-carousel/dialog-footer-carousel.js

@@ -0,0 +1,57 @@
+import { jsx as o } from "react/jsx-runtime";
+import * as u from "react";
+import { cn as x } from "../../../lib/utils.js";
+import { CarouselDialog as A } from "../carousel-dialog/carousel-dialog.js";
+const h = {
+  start: "first",
+  middle: "middle",
+  end: "last"
+}, v = u.forwardRef(
+  ({
+    className: r,
+    variant: a = "start",
+    slideCount: e,
+    selectedIndex: t,
+    onSelectIndex: i,
+    onBack: l,
+    onNext: s,
+    onPrimaryAction: m,
+    backLabel: f,
+    nextLabel: d,
+    primaryLabel: n,
+    goToSlideLabel: c,
+    ...g
+  }, p) => /* @__PURE__ */ o(
+    "div",
+    {
+      ref: p,
+      className: x(
+        "flex h-[var(--ui-footer-global-height)] shrink-0 items-center bg-[var(--ui-footer-carousel-color)] px-[var(--ui-footer-global-padding-x)]",
+        r
+      ),
+      ...g,
+      children: /* @__PURE__ */ o(
+        A,
+        {
+          className: "min-w-0 flex-1",
+          variant: h[a],
+          slideCount: e,
+          selectedIndex: t,
+          onSelectIndex: i,
+          onBack: l,
+          onNext: s,
+          onPrimaryAction: m,
+          backLabel: f,
+          nextLabel: d,
+          primaryLabel: n,
+          goToSlideLabel: c
+        }
+      )
+    }
+  )
+);
+v.displayName = "DialogFooterCarousel";
+export {
+  v as DialogFooterCarousel
+};
+//# sourceMappingURL=dialog-footer-carousel.js.map

package/dist/components/ui/dialog-footer-carousel/dialog-footer-carousel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dialog-footer-carousel.js","sources":["../../../../src/components/ui/dialog-footer-carousel/dialog-footer-carousel.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { cn } from '@/lib/utils';\n\nimport { CarouselDialog, type CarouselDialogProps } from '../carousel-dialog';\n\n// Ports Figma's \"DialogFooterCarousel\" component (node 6353:5864, variants\n// start/middle/end), the footer bar that hosts `CarouselDialog`. Geometry and\n// background resolve to the `--ui-footer-*` tier already shipped for\n// `DialogFooterDefault` — this is the same footer chrome, just filled with the\n// carousel row instead of end-aligned actions.\n\nexport type DialogFooterCarouselVariant = 'start' | 'middle' | 'end';\n\nexport interface DialogFooterCarouselProps\n  extends Omit<React.HTMLAttributes<HTMLDivElement>, 'children'>,\n    Pick<\n      CarouselDialogProps,\n      | 'slideCount'\n      | 'selectedIndex'\n      | 'onSelectIndex'\n      | 'onBack'\n      | 'onNext'\n      | 'onPrimaryAction'\n      | 'backLabel'\n      | 'nextLabel'\n      | 'primaryLabel'\n      | 'goToSlideLabel'\n    > {\n  /** Which slide position this renders for. Defaults to `'start'`. */\n  variant?: DialogFooterCarouselVariant;\n}\n\nconst VARIANT_TO_CAROUSEL_DIALOG_VARIANT: Record<\n  DialogFooterCarouselVariant,\n  CarouselDialogProps['variant']\n> = {\n  start: 'first',\n  middle: 'middle',\n  end: 'last',\n};\n\nconst DialogFooterCarousel = React.forwardRef<\n  HTMLDivElement,\n  DialogFooterCarouselProps\n>(\n  (\n    {\n      className,\n      variant = 'start',\n      slideCount,\n      selectedIndex,\n      onSelectIndex,\n      onBack,\n      onNext,\n      onPrimaryAction,\n      backLabel,\n      nextLabel,\n      primaryLabel,\n      goToSlideLabel,\n      ...props\n    },\n    ref\n  ) => {\n    return (\n      <div\n        ref={ref}\n        className={cn(\n          'flex h-[var(--ui-footer-global-height)] shrink-0 items-center bg-[var(--ui-footer-carousel-color)] px-[var(--ui-footer-global-padding-x)]',\n          className\n        )}\n        {...props}\n      >\n        <CarouselDialog\n          className=\"min-w-0 flex-1\"\n          variant={VARIANT_TO_CAROUSEL_DIALOG_VARIANT[variant]}\n          slideCount={slideCount}\n          selectedIndex={selectedIndex}\n          onSelectIndex={onSelectIndex}\n          onBack={onBack}\n          onNext={onNext}\n          onPrimaryAction={onPrimaryAction}\n          backLabel={backLabel}\n          nextLabel={nextLabel}\n          primaryLabel={primaryLabel}\n          goToSlideLabel={goToSlideLabel}\n        />\n      </div>\n    );\n  }\n);\nDialogFooterCarousel.displayName = 'DialogFooterCarousel';\n\nexport { DialogFooterCarousel };\n"],"names":["VARIANT_TO_CAROUSEL_DIALOG_VARIANT","DialogFooterCarousel","React","className","variant","slideCount","selectedIndex","onSelectIndex","onBack","onNext","onPrimaryAction","backLabel","nextLabel","primaryLabel","goToSlideLabel","props","ref","jsx","cn","CarouselDialog"],"mappings":";;;;AAiCA,MAAMA,IAGF;AAAA,EACF,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,KAAK;AACP,GAEMC,IAAuBC,EAAM;AAAA,EAIjC,CACE;AAAA,IACE,WAAAC;AAAA,IACA,SAAAC,IAAU;AAAA,IACV,YAAAC;AAAA,IACA,eAAAC;AAAA,IACA,eAAAC;AAAA,IACA,QAAAC;AAAA,IACA,QAAAC;AAAA,IACA,iBAAAC;AAAA,IACA,WAAAC;AAAA,IACA,WAAAC;AAAA,IACA,cAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,GAELC,MAGE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAAD;AAAA,MACA,WAAWE;AAAA,QACT;AAAA,QACAf;AAAA,MAAA;AAAA,MAED,GAAGY;AAAA,MAEJ,UAAA,gBAAAE;AAAA,QAACE;AAAA,QAAA;AAAA,UACC,WAAU;AAAA,UACV,SAASnB,EAAmCI,CAAO;AAAA,UACnD,YAAAC;AAAA,UACA,eAAAC;AAAA,UACA,eAAAC;AAAA,UACA,QAAAC;AAAA,UACA,QAAAC;AAAA,UACA,iBAAAC;AAAA,UACA,WAAAC;AAAA,UACA,WAAAC;AAAA,UACA,cAAAC;AAAA,UACA,gBAAAC;AAAA,QAAA;AAAA,MAAA;AAAA,IACF;AAAA,EAAA;AAIR;AACAb,EAAqB,cAAc;"}

package/dist/components/ui/dialog-footer-default/dialog-footer-default.js

@@ -7,7 +7,7 @@ const m = f.forwardRef(
     {
       ref: i,
       className: s(
-        "flex h-[var(--ui-footer-global-height)] items-center gap-[var(--ui-footer-global-gap)] border-t-[length:var(--ui-footer-default-border-width)] border-solid border-[color:var(--ui-footer-default-border-color)] bg-[var(--ui-footer-default-color)] px-[var(--ui-footer-global-padding-x)]",
+        "flex h-[var(--ui-footer-global-height)] shrink-0 items-center gap-[var(--ui-footer-global-gap)] border-t-[length:var(--ui-footer-default-border-width)] border-solid border-[color:var(--ui-footer-default-border-color)] bg-[var(--ui-footer-default-color)] px-[var(--ui-footer-global-padding-x)]",
         !(o !== void 0 || r !== void 0) && "justify-end",
         t
       ),

package/dist/components/ui/dialog-footer-default/dialog-footer-default.js.map

@@ -1 +1 @@
-{"version":3,"file":"dialog-footer-default.js","sources":["../../../../src/components/ui/dialog-footer-default/dialog-footer-default.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { cn } from '@/lib/utils';\n\n// A bottom action bar (panel/dialog/sheet footer), themed by the `--ui-footer-*`\n// tier. The Figma component's `variant` (default / withDescription / withLink) is\n// structural, not a separate prop — it follows from which optional slot is\n// passed, mirroring how `Breadcrumb`'s \"current page\" is a different part\n// rather than a duplicated state prop. `description` and `link` are mutually\n// exclusive; when neither is given, actions sit flush to the end.\nexport interface DialogFooterDefaultProps extends Omit<\n  React.HTMLAttributes<HTMLDivElement>,\n  'children'\n> {\n  /** Truncated description text next to the actions. Mutually exclusive with `link`. */\n  description?: string;\n  /** A `Link` (or similar) element next to the actions. Mutually exclusive with `description`. */\n  link?: React.ReactNode;\n  /** End-aligned actions — typically a secondary and a primary `Button`. */\n  children?: React.ReactNode;\n}\n\nconst DialogFooterDefault = React.forwardRef<HTMLDivElement, DialogFooterDefaultProps>(\n  ({ className, description, link, children, ...props }, ref) => {\n    const hasStart = description !== undefined || link !== undefined;\n    return (\n      <div\n        ref={ref}\n        className={cn(\n          'flex h-[var(--ui-footer-global-height)] items-center gap-[var(--ui-footer-global-gap)] border-t-[length:var(--ui-footer-default-border-width)] border-solid border-[color:var(--ui-footer-default-border-color)] bg-[var(--ui-footer-default-color)] px-[var(--ui-footer-global-padding-x)]',\n          !hasStart && 'justify-end',\n          className\n        )}\n        {...props}\n      >\n        {description !== undefined ? (\n          <p className=\"min-w-0 flex-1 truncate text-sm leading-6 text-foreground\">\n            {description}\n          </p>\n        ) : (\n          link !== undefined && (\n            <div className=\"flex h-8 min-w-0 flex-1 items-center\">{link}</div>\n          )\n        )}\n        {children}\n      </div>\n    );\n  }\n);\nDialogFooterDefault.displayName = 'DialogFooterDefault';\n\nexport { DialogFooterDefault };\n"],"names":["DialogFooterDefault","React","className","description","link","children","props","ref","jsxs","cn","jsx"],"mappings":";;;AAsBA,MAAMA,IAAsBC,EAAM;AAAA,EAChC,CAAC,EAAE,WAAAC,GAAW,aAAAC,GAAa,MAAAC,GAAM,UAAAC,GAAU,GAAGC,EAAA,GAASC,MAGnD,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAAD;AAAA,MACA,WAAWE;AAAA,QACT;AAAA,QACA,EANWN,MAAgB,UAAaC,MAAS,WAMpC;AAAA,QACbF;AAAA,MAAA;AAAA,MAED,GAAGI;AAAA,MAEH,UAAA;AAAA,QAAAH,MAAgB,SACf,gBAAAO,EAAC,KAAA,EAAE,WAAU,6DACV,UAAAP,EAAA,CACH,IAEAC,MAAS,UACP,gBAAAM,EAAC,OAAA,EAAI,WAAU,wCAAwC,UAAAN,GAAK;AAAA,QAG/DC;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAIT;AACAL,EAAoB,cAAc;"}
+{"version":3,"file":"dialog-footer-default.js","sources":["../../../../src/components/ui/dialog-footer-default/dialog-footer-default.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { cn } from '@/lib/utils';\n\n// A bottom action bar (panel/dialog/sheet footer), themed by the `--ui-footer-*`\n// tier. The Figma component's `variant` (default / withDescription / withLink) is\n// structural, not a separate prop — it follows from which optional slot is\n// passed, mirroring how `Breadcrumb`'s \"current page\" is a different part\n// rather than a duplicated state prop. `description` and `link` are mutually\n// exclusive; when neither is given, actions sit flush to the end.\nexport interface DialogFooterDefaultProps extends Omit<\n  React.HTMLAttributes<HTMLDivElement>,\n  'children'\n> {\n  /** Truncated description text next to the actions. Mutually exclusive with `link`. */\n  description?: string;\n  /** A `Link` (or similar) element next to the actions. Mutually exclusive with `description`. */\n  link?: React.ReactNode;\n  /** End-aligned actions — typically a secondary and a primary `Button`. */\n  children?: React.ReactNode;\n}\n\nconst DialogFooterDefault = React.forwardRef<HTMLDivElement, DialogFooterDefaultProps>(\n  ({ className, description, link, children, ...props }, ref) => {\n    const hasStart = description !== undefined || link !== undefined;\n    return (\n      <div\n        ref={ref}\n        className={cn(\n          'flex h-[var(--ui-footer-global-height)] shrink-0 items-center gap-[var(--ui-footer-global-gap)] border-t-[length:var(--ui-footer-default-border-width)] border-solid border-[color:var(--ui-footer-default-border-color)] bg-[var(--ui-footer-default-color)] px-[var(--ui-footer-global-padding-x)]',\n          !hasStart && 'justify-end',\n          className\n        )}\n        {...props}\n      >\n        {description !== undefined ? (\n          <p className=\"min-w-0 flex-1 truncate text-sm leading-6 text-foreground\">\n            {description}\n          </p>\n        ) : (\n          link !== undefined && (\n            <div className=\"flex h-8 min-w-0 flex-1 items-center\">{link}</div>\n          )\n        )}\n        {children}\n      </div>\n    );\n  }\n);\nDialogFooterDefault.displayName = 'DialogFooterDefault';\n\nexport { DialogFooterDefault };\n"],"names":["DialogFooterDefault","React","className","description","link","children","props","ref","jsxs","cn","jsx"],"mappings":";;;AAsBA,MAAMA,IAAsBC,EAAM;AAAA,EAChC,CAAC,EAAE,WAAAC,GAAW,aAAAC,GAAa,MAAAC,GAAM,UAAAC,GAAU,GAAGC,EAAA,GAASC,MAGnD,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAAD;AAAA,MACA,WAAWE;AAAA,QACT;AAAA,QACA,EANWN,MAAgB,UAAaC,MAAS,WAMpC;AAAA,QACbF;AAAA,MAAA;AAAA,MAED,GAAGI;AAAA,MAEH,UAAA;AAAA,QAAAH,MAAgB,SACf,gBAAAO,EAAC,KAAA,EAAE,WAAU,6DACV,UAAAP,EAAA,CACH,IAEAC,MAAS,UACP,gBAAAM,EAAC,OAAA,EAAI,WAAU,wCAAwC,UAAAN,GAAK;AAAA,QAG/DC;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAIT;AACAL,EAAoB,cAAc;"}