@alfadocs/ui-kit-debug 1.61.0 → 1.62.0

package/dist/_chunks/stat-D2PNJujA.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"stat-D2PNJujA.js","sources":["../../src/components/stat/stat.tsx"],"sourcesContent":["import {\n  forwardRef,\n  useCallback,\n  useId,\n  useMemo,\n  useRef,\n  type HTMLAttributes,\n  type ReactNode,\n} from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { useTranslation } from 'react-i18next';\nimport { useCountUp } from '../../hooks/use-count-up';\n\n/* ------------------------------------------------------------------ */\n/* CVA — stat root                                                      */\n/* ------------------------------------------------------------------ */\n\n// `h-full` lets Stats grow to fill a flex / grid parent's cell, so a\n// row paired with taller cards (BenefitCard, Card, etc.) reads as a\n// matching set instead of mismatched heights. In a non-stretching\n// parent (block flow, inline) it's a no-op — block-size defers to\n// content as before. The flex-col inside still pins label/icon row\n// at the top and the number below, so growing the card adds the\n// extra space below the number instead of inserting it between\n// label and value.\nconst statVariants = cva('ds:flex ds:flex-col ds:h-full', {\n  variants: {\n    variant: {\n      default: 'ds:gap-[var(--spacing-xs)]',\n      outlined: [\n        'ds:gap-[var(--spacing-xs)]',\n        'ds:border ds:border-[color:var(--border)]',\n        'ds:rounded-[var(--radius-md)]',\n        'ds:ps-[var(--spacing-md)] ds:pe-[var(--spacing-md)]',\n        'ds:pt-[var(--spacing-md)] ds:pb-[var(--spacing-md)]',\n      ].join(' '),\n      // White card surface with the shared card shadow + border —\n      // matches `Card variant=\"elevated\"` and `BenefitCard.elevated`\n      // tokens (`--card`, `--card-border`, `--shadow-card`,\n      // `--radius-lg`) so a grid of elevated Stats reads as a set of\n      // shaded panels without nesting a Card around each one. The\n      // border is essential in dark mode: shadow alone on a dark\n      // surface loses contrast and the card boundary disappears.\n      // `--surface-border-width` bumps it to 2px in the accessible themes,\n      // matching Card / BenefitCard's 0.31.5 accessibility uplift.\n      elevated: [\n        'ds:gap-[var(--spacing-xs)]',\n        'ds:bg-[var(--card)]',\n        'ds:text-[var(--card-foreground)]',\n        'ds:[:where(&)]:border-[length:var(--surface-border-width,var(--border-width-sm))] ds:border-[color:var(--card-border)]',\n        'ds:shadow-[var(--shadow-card)]',\n        'ds:rounded-[var(--radius-lg)]',\n        'ds:ps-[var(--spacing-md)] ds:pe-[var(--spacing-md)]',\n        'ds:pt-[var(--spacing-md)] ds:pb-[var(--spacing-md)]',\n        // Forced-colors: UA strips shadow, so render a border as the\n        // separation cue — mirrors Card's forced-colors behaviour.\n        'ds:forced-colors:border ds:forced-colors:border-[CanvasText]',\n      ].join(' '),\n      compact: 'ds:gap-[var(--spacing-none)]',\n    },\n    size: {\n      sm: '',\n      md: '',\n      lg: '',\n    },\n    align: {\n      start: 'ds:items-start ds:text-start',\n      center: 'ds:items-center ds:text-center',\n      end: 'ds:items-end ds:text-end',\n    },\n  },\n  defaultVariants: {\n    variant: 'default',\n    size: 'md',\n    align: 'start',\n  },\n});\n\n/* ------------------------------------------------------------------ */\n/* CVA — value element                                                  */\n/* ------------------------------------------------------------------ */\n\nconst valueVariants = cva('type-metric', {\n  variants: {\n    size: {\n      sm: 'ds:[--type-metric-size:var(--font-size-xl)]',\n      md: 'ds:[--type-metric-size:var(--font-size-3xl)]',\n      lg: 'ds:[--type-metric-size:var(--font-size-5xl)]',\n    },\n    variant: {\n      default: '',\n      outlined: '',\n      elevated: '',\n      compact: '',\n    },\n    // Colour of the headline metric value. Defaults to `--foreground`\n    // (the existing render). `primary` / `accent` are the brand intents\n    // — use for hero / marketing stats where the number IS the visual\n    // marker. `success` / `destructive` / `info` / `warning` map to the\n    // semantic tokens for KPI tiles that want to signal status via the\n    // value colour itself (e.g. revenue green, debt red). The trend\n    // chevron and the label colour are independent of this prop.\n    intent: {\n      foreground: 'ds:text-[var(--foreground)]',\n      primary: 'ds:text-[var(--primary)]',\n      accent: 'ds:text-[var(--accent)]',\n      success: 'ds:text-[var(--success)]',\n      destructive: 'ds:text-[var(--destructive)]',\n      info: 'ds:text-[var(--info)]',\n      warning: 'ds:text-[var(--warning)]',\n    },\n  },\n  compoundVariants: [\n    {\n      variant: 'compact',\n      size: 'sm',\n      className: 'ds:[--type-metric-size:var(--font-size-lg)]',\n    },\n    {\n      variant: 'compact',\n      size: 'md',\n      className: 'ds:[--type-metric-size:var(--font-size-xl)]',\n    },\n    {\n      variant: 'compact',\n      size: 'lg',\n      className: 'ds:[--type-metric-size:var(--font-size-2xl)]',\n    },\n  ],\n  defaultVariants: {\n    size: 'md',\n    variant: 'default',\n    intent: 'foreground',\n  },\n});\n\n/* ------------------------------------------------------------------ */\n/* CVA — trend element                                                  */\n/* ------------------------------------------------------------------ */\n\nconst trendVariants = cva(\n  'ds:inline-flex ds:items-center ds:gap-[var(--spacing-xs)] type-label',\n  {\n    variants: {\n      // Whether the change is good news, not which way it went: with\n      // `trendPolarity=\"lower-is-better\"` a fall is `better`.\n      tone: {\n        better: 'ds:text-[var(--success)]',\n        worse: 'ds:text-[var(--destructive)]',\n        neutral: 'ds:text-[var(--muted-foreground)]',\n      },\n    },\n    defaultVariants: {\n      tone: 'neutral',\n    },\n  },\n);\n\n/* ------------------------------------------------------------------ */\n/* StatTrend (internal — not exported)                                  */\n/* ------------------------------------------------------------------ */\n\n/**\n * Which way is good news for a metric's trend. `neutral` is for a metric\n * where neither direction is good or bad news (a patient mix, a share).\n */\nexport type StatTrendPolarity =\n  | 'higher-is-better'\n  | 'lower-is-better'\n  | 'neutral';\n\ninterface StatTrendProps {\n  trend: 'up' | 'down' | 'flat';\n  delta: number | string;\n  deltaFormat?: 'decimal' | 'percent';\n  locale?: string;\n  polarity?: StatTrendPolarity;\n}\n\nconst ARROW = { up: '↑', down: '↓', flat: '→' } as const;\nconst TREND_KEY = {\n  up: 'stat.trend.up',\n  down: 'stat.trend.down',\n  flat: 'stat.trend.flat',\n} as const;\n\nfunction StatTrend({\n  trend,\n  delta,\n  deltaFormat = 'decimal',\n  locale,\n  polarity = 'higher-is-better',\n}: StatTrendProps) {\n  const { t, i18n } = useTranslation('ui');\n\n  const formattedDelta =\n    typeof delta === 'string'\n      ? delta\n      : new Intl.NumberFormat(locale ?? i18n.language, {\n          style: deltaFormat === 'percent' ? 'percent' : 'decimal',\n        }).format(deltaFormat === 'percent' ? delta / 100 : delta);\n\n  // The arrow follows the number; the colour and the spoken \"better\" or\n  // \"worse\" follow the polarity, so the meaning never rests on colour.\n  const tone =\n    trend === 'flat' || polarity === 'neutral'\n      ? 'neutral'\n      : (trend === 'up') === (polarity === 'higher-is-better')\n        ? 'better'\n        : 'worse';\n\n  return (\n    <span className={trendVariants({ tone })} data-trend-tone={tone}>\n      <span aria-hidden=\"true\">{ARROW[trend]}</span>\n      <span className=\"ds:sr-only\">{t(TREND_KEY[trend])}</span>\n      {formattedDelta}\n      {tone === 'neutral' ? null : (\n        <span className=\"ds:sr-only\">\n          {' '}\n          {t(tone === 'better' ? 'stat.trend.better' : 'stat.trend.worse')}\n        </span>\n      )}\n    </span>\n  );\n}\n\n/* ------------------------------------------------------------------ */\n/* Parse a string value into a numeric target for the count-up         */\n/* ------------------------------------------------------------------ */\n\ntype ParsedValue = {\n  /** Numeric target for the count-up. */\n  target: number;\n  /** Leading sign captured from the input string (e.g. \"+\" / \"-\"). */\n  sign: '' | '+' | '-';\n  /** Trailing shorthand suffix (e.g. \"K\" / \"M\" / \"B\") to re-append. */\n  suffix: string;\n};\n\n/**\n * Strip locale-aware separators, a leading sign, and the K/M/B\n * shorthand suffix from a pre-formatted string so the count-up has a\n * pure numeric target to animate towards. Returns `null` for any input\n * that can't be parsed — the caller short-circuits to static rendering\n * in that case.\n */\nfunction parseStatValue(raw: string, locale: string): ParsedValue | null {\n  const trimmed = raw.trim();\n  if (trimmed === '') return null;\n\n  // Capture leading sign so we can re-attach it every frame. Stat's\n  // marketing usage (\"+500.000\", \"-12\") often relies on it.\n  let sign: '' | '+' | '-' = '';\n  let body = trimmed;\n  if (body.startsWith('+')) {\n    sign = '+';\n    body = body.slice(1).trimStart();\n  } else if (body.startsWith('-') || body.startsWith('−')) {\n    // Hyphen-minus or the typographic minus sign — both treated as -.\n    sign = '-';\n    body = body.slice(1).trimStart();\n  }\n\n  // Trailing K / M / B shorthand (case-insensitive). Re-append verbatim\n  // so \"+1.5K\" renders as \"+1.5K\" at every frame.\n  let suffix = '';\n  const suffixMatch = body.match(/[KMB]$/i);\n  if (suffixMatch) {\n    suffix = suffixMatch[0];\n    body = body.slice(0, -1).trimEnd();\n  }\n\n  // Discover the locale's group + decimal glyphs from a probe value.\n  // formatToParts is the canonical way; we fall back to `.` decimal /\n  // `,` group if Intl can't tell us (no-locale envs).\n  let group = '';\n  let decimal = '.';\n  try {\n    const probe = new Intl.NumberFormat(locale).formatToParts(12345.6);\n    for (const part of probe) {\n      if (part.type === 'group') group = part.value;\n      else if (part.type === 'decimal') decimal = part.value;\n    }\n  } catch {\n    /* swallow — defaults already set */\n  }\n\n  // Heuristic for input strings that look like JS-native decimals\n  // (e.g. `\"1500.25\"`) regardless of the requested locale: if the body\n  // is a clean US-style decimal AND the fraction after the `.` is NOT\n  // a three-digit thousands group in a locale that uses `.` as the\n  // group separator, treat it as a direct numeric literal. This covers\n  // the common case where a caller types `value=\"1500.25\"` and expects\n  // the count-up to land on 1500.25 even though the output locale is\n  // it-IT (which uses `.` for thousands).\n  const usStyleMatch = body.match(/^(\\d+)\\.(\\d+)$/);\n  if (usStyleMatch) {\n    const fractionLen = usStyleMatch[2].length;\n    if (!(fractionLen === 3 && group === '.')) {\n      const direct = Number.parseFloat(body);\n      if (Number.isFinite(direct)) {\n        return { target: direct, sign, suffix };\n      }\n    }\n  }\n\n  // Strip every group separator we discovered, then normalise the\n  // decimal separator to `.` so JS can parseFloat the result.\n  // Note: when the locale's group separator is empty (e.g. some\n  // numbering systems) the replace is a no-op.\n  let normalised = body;\n  if (group !== '') {\n    normalised = normalised.split(group).join('');\n  }\n  if (decimal !== '.') {\n    normalised = normalised.split(decimal).join('.');\n  }\n\n  // Defence-in-depth: strip whitespace plus NBSP (U+00A0) and NARROW\n  // NO-BREAK SPACE (U+202F) that some locales (fr-FR, it-IT) use as\n  // thousand separators. Hex escapes keep this source ASCII-clean.\n  normalised = normalised.replace(/[\\s\\u00A0\\u202F]/g, '');\n\n  const numeric = Number.parseFloat(normalised);\n  if (!Number.isFinite(numeric)) return null;\n\n  return { target: numeric, sign, suffix };\n}\n\n/* ------------------------------------------------------------------ */\n/* StatProps                                                            */\n/* ------------------------------------------------------------------ */\n\nexport interface StatProps\n  extends HTMLAttributes<HTMLDivElement>, VariantProps<typeof statVariants> {\n  /** Metric label rendered above the value. */\n  label: string;\n  /** Numeric or pre-formatted string value. */\n  value: number | string;\n  /** Number formatting style. Omit to use default decimal formatting. */\n  format?: 'decimal' | 'currency' | 'percent';\n  /** ISO 4217 currency code — required when format=\"currency\". */\n  currency?: string;\n  /** BCP 47 locale override. Defaults to the active i18n language. */\n  locale?: string;\n  /** Trend direction. Requires `delta` to render the trend row. */\n  trend?: 'up' | 'down' | 'flat';\n  /** Trend delta magnitude, e.g. 12 for \"↑ 12%\". */\n  delta?: number | string;\n  /**\n   * Which way is good news. `higher-is-better` (default) shows a rise in\n   * the success colour; `lower-is-better` (a no-show or cancellation rate,\n   * a waiting time) shows a fall in it instead. The arrow always points the\n   * way the number moved, and screen readers hear \"better\" or \"worse\".\n   * `neutral` keeps the arrow and delta in the muted colour, and screen\n   * readers hear only the direction (\"Increased by +3.4 pts\").\n   */\n  trendPolarity?: StatTrendPolarity;\n  /** Number formatting style for the delta. Default \"decimal\". */\n  deltaFormat?: 'decimal' | 'percent';\n  /** Optional leading icon rendered at the start of the label row. */\n  icon?: ReactNode;\n  /**\n   * Colour of the headline value. Defaults to `foreground`. Brand\n   * intents (`primary`, `accent`) are for hero / marketing stats where\n   * the number is the visual marker. Semantic intents\n   * (`success`, `destructive`, `info`, `warning`) signal status via\n   * the value colour itself — e.g. revenue green, debt red on KPI\n   * tiles. Trend chevron and label colour are independent.\n   */\n  intent?:\n    | 'foreground'\n    | 'primary'\n    | 'accent'\n    | 'success'\n    | 'destructive'\n    | 'info'\n    | 'warning';\n  /** Renders animated skeleton placeholders instead of content. */\n  loading?: boolean;\n  /**\n   * Animate the numeric value from 0 (or from the captured leading\n   * sign) to the final value when the Stat first scrolls into view.\n   * Default `false`. Marketing surfaces opt in; dashboards leave it\n   * off so live metrics render immediately.\n   */\n  animate?: boolean;\n  /**\n   * When `true`, the count-up re-plays every time the Stat scrolls\n   * out of view and back in. Default `false` — animate once per\n   * element per session, matching the booking-website hero pattern.\n   * Ignored under `prefers-reduced-motion: reduce`.\n   */\n  animateOnEveryView?: boolean;\n  /** Animation duration in milliseconds. Default 1600. */\n  animateDurationMs?: number;\n  /**\n   * BCP 47 locale used for the per-frame count-up formatting. Falls\n   * back to `locale`, then to the active i18n language.\n   */\n  animateLocale?: string;\n  /**\n   * Override the locale's thousand / decimal glyphs for the count-up.\n   * Wins over locale defaults. Pass partial overrides — `decimal`\n   * alone is valid; the unspecified separator stays at the locale\n   * default.\n   */\n  animateSeparators?: {\n    thousand?: string;\n    decimal?: string;\n  };\n}\n\n/* ------------------------------------------------------------------ */\n/* Stat                                                                 */\n/* ------------------------------------------------------------------ */\n\nexport const Stat = forwardRef<HTMLDivElement, StatProps>(\n  (\n    {\n      label,\n      value,\n      format,\n      currency,\n      locale,\n      trend,\n      trendPolarity,\n      delta,\n      deltaFormat = 'decimal',\n      icon,\n      loading = false,\n      animate = false,\n      animateOnEveryView = false,\n      animateDurationMs = 1600,\n      animateLocale,\n      animateSeparators,\n      variant = 'default',\n      size = 'md',\n      align = 'start',\n      intent = 'foreground',\n      className,\n      ...props\n    },\n    ref,\n  ) => {\n    const { i18n } = useTranslation('ui');\n    const labelId = useId();\n    const lang = locale ?? i18n.language;\n\n    /* -------------------------------------------------- */\n    /* Static formatting — the value as it would appear   */\n    /* in the non-animated (or post-animation) state.     */\n    /* -------------------------------------------------- */\n\n    const formatValue = useCallback((): string => {\n      if (typeof value === 'string') return value;\n\n      switch (format) {\n        case 'currency':\n          return new Intl.NumberFormat(lang, {\n            style: 'currency',\n            currency: currency ?? 'USD',\n          }).format(value);\n        case 'percent':\n          return new Intl.NumberFormat(lang, { style: 'percent' }).format(\n            value,\n          );\n        case 'decimal':\n          return new Intl.NumberFormat(lang, { style: 'decimal' }).format(\n            value,\n          );\n        default:\n          return new Intl.NumberFormat(lang).format(value);\n      }\n    }, [value, format, lang, currency]);\n\n    const staticValue = formatValue();\n\n    /* -------------------------------------------------- */\n    /* Parse the value into a numeric target for the      */\n    /* count-up. Numeric values use `value` directly;     */\n    /* string values are stripped of sign / shorthand /   */\n    /* locale separators and re-decorated each frame.     */\n    /* -------------------------------------------------- */\n\n    const animationLocale = animateLocale ?? lang;\n    const hasWarnedRef = useRef<boolean>(false);\n\n    const parsed = useMemo<ParsedValue | null>(() => {\n      if (!animate) return null;\n      if (typeof value === 'number') {\n        // Numeric: target is the number itself; no sign / suffix to\n        // re-attach.\n        return Number.isFinite(value)\n          ? { target: value, sign: '', suffix: '' }\n          : null;\n      }\n      return parseStatValue(value, animationLocale);\n    }, [animate, value, animationLocale]);\n\n    // Dev-mode warning when an animate-flagged Stat has an unparseable\n    // string value. Render static, no throw — one warn per component.\n    if (\n      animate &&\n      typeof value === 'string' &&\n      parsed === null &&\n      import.meta.env.DEV &&\n      !hasWarnedRef.current\n    ) {\n      hasWarnedRef.current = true;\n      console.warn(\n        `Stat: value=\"${value}\" couldn't be parsed for the count-up animation. Rendering static.`,\n      );\n    }\n\n    const shouldAnimate = animate && parsed !== null;\n\n    /* -------------------------------------------------- */\n    /* Wire the hook unconditionally — rules-of-hooks.    */\n    /* When `shouldAnimate` is false the hook still runs  */\n    /* but `to === from` so it's a no-op visually.        */\n    /* -------------------------------------------------- */\n\n    const target = parsed?.target ?? 0;\n    const sign = parsed?.sign ?? '';\n    const suffix = parsed?.suffix ?? '';\n\n    // Wrap the count-up formatter so the captured sign + suffix are\n    // re-applied every frame. The hook hands us the locale-formatted\n    // magnitude; we own the decoration around it.\n    const formatter = useCallback(\n      (n: number) => {\n        // Use the absolute value for the magnitude so the captured\n        // sign is the sole source of the rendered sign. Negative\n        // numbers passed in (e.g. `to: -12`) come through unsigned;\n        // we re-apply via `sign`. Always force `useGrouping: true` so\n        // ICU's locale-default `min2` doesn't suppress the thousand\n        // glyph on 4-digit values like 1.000 (it-IT). The user wrote\n        // a stat value — they want it grouped.\n        const magnitudeNF = (() => {\n          try {\n            return new Intl.NumberFormat(animationLocale, {\n              useGrouping: true,\n            });\n          } catch {\n            return null;\n          }\n        })();\n\n        let magnitudeStr: string;\n        if (magnitudeNF) {\n          if (animateSeparators) {\n            // Hand-build the grouped magnitude so we don't depend on\n            // ICU's locale-by-locale grouping defaults (which differ\n            // between engines and can drop the group at 4-digit\n            // thresholds even with `useGrouping: true`). Locale only\n            // influences sign handling, which we apply separately.\n            const abs = Math.abs(n);\n            const intPart = Math.trunc(abs);\n            const fracPart = abs - intPart;\n            const groupGlyph = animateSeparators.thousand ?? '';\n            const intStr = String(intPart).replace(\n              /\\B(?=(\\d{3})+(?!\\d))/g,\n              groupGlyph,\n            );\n            if (fracPart === 0) {\n              magnitudeStr = intStr;\n            } else {\n              const fracStr = fracPart.toFixed(6).replace(/0+$/, '').slice(2);\n              const decimalGlyph = animateSeparators.decimal ?? '.';\n              magnitudeStr = fracStr ? intStr + decimalGlyph + fracStr : intStr;\n            }\n          } else {\n            magnitudeStr = magnitudeNF.format(Math.abs(n));\n          }\n        } else {\n          magnitudeStr = String(Math.abs(n));\n        }\n\n        // Re-derive the sign every frame: the captured sign wins, but\n        // a negative `to` with no leading sign in the source still\n        // renders with a leading \"-\" so the final formatted output\n        // matches locale conventions.\n        let resolvedSign: string = sign;\n        if (sign === '' && n < 0) resolvedSign = '-';\n\n        return `${resolvedSign}${magnitudeStr}${suffix}`;\n      },\n      [animationLocale, animateSeparators, sign, suffix],\n    );\n\n    const countUp = useCountUp({\n      to: target,\n      from: 0,\n      durationMs: animateDurationMs,\n      startOnVisible: true,\n      retriggerOnReEntry: animateOnEveryView,\n      // `formatter` is the only path we use — it owns both the locale\n      // formatting and the sign/suffix re-application.\n      formatter,\n    });\n\n    /* -------------------------------------------------- */\n    /* Loading state                                       */\n    /* -------------------------------------------------- */\n\n    if (loading) {\n      return (\n        <div\n          ref={ref}\n          role=\"group\"\n          aria-busy=\"true\"\n          aria-label={label}\n          data-component=\"stat\"\n          className={statVariants({ variant, size, align, className })}\n          {...props}\n        >\n          <div className=\"ds:h-[var(--skeleton-label-h)] ds:w-[var(--skeleton-label-w)] ds:animate-pulse ds:rounded-[var(--radius-sm)] ds:bg-[var(--muted)]\" />\n          <div className=\"ds:h-[var(--skeleton-value-h)] ds:w-[var(--skeleton-value-w)] ds:animate-pulse ds:rounded-[var(--radius-sm)] ds:bg-[var(--muted)]\" />\n        </div>\n      );\n    }\n\n    /* -------------------------------------------------- */\n    /* Render                                              */\n    /* -------------------------------------------------- */\n\n    return (\n      <div\n        ref={ref}\n        role=\"group\"\n        aria-labelledby={labelId}\n        data-component=\"stat\"\n        className={statVariants({ variant, size, align, className })}\n        {...props}\n      >\n        <span className=\"ds:inline-flex ds:items-center\">\n          {icon && (\n            <span\n              aria-hidden=\"true\"\n              className={[\n                'ds:me-[var(--spacing-xs)] ds:inline-flex ds:shrink-0',\n                // Accent tint on the leading icon. The icon is decorative\n                // (aria-hidden), so magenta-500's 3.2:1 contrast on white\n                // is acceptable here — the Stat label + value still\n                // carry the accessible name at `--foreground`.\n                'ds:text-[color:var(--accent)]',\n                'ds:forced-colors:text-[CanvasText]',\n              ].join(' ')}\n            >\n              {icon}\n            </span>\n          )}\n          <span\n            id={labelId}\n            className=\"type-label ds:text-[var(--muted-foreground)]\"\n          >\n            {label}\n          </span>\n        </span>\n        {shouldAnimate ? (\n          // The animated number is wrapped in an `aria-live=\"off\"` span\n          // so screen readers don't announce every interpolated frame.\n          // The `role=\"group\"` ancestor (with `aria-labelledby` pointing\n          // at the label) carries the final accessible reading — the\n          // animated frames are decorative only.\n          <span\n            ref={countUp.ref}\n            aria-live=\"off\"\n            className={valueVariants({ size, variant, intent })}\n          >\n            {countUp.value}\n          </span>\n        ) : (\n          <span className={valueVariants({ size, variant, intent })}>\n            {staticValue}\n          </span>\n        )}\n        {trend != null && delta != null && (\n          <StatTrend\n            trend={trend}\n            delta={delta}\n            deltaFormat={deltaFormat}\n            locale={locale}\n            polarity={trendPolarity}\n          />\n        )}\n      </div>\n    );\n  },\n);\n\nStat.displayName = 'Stat';\n"],"names":["statVariants","cva","valueVariants","trendVariants","ARROW","TREND_KEY","StatTrend","trend","delta","deltaFormat","locale","polarity","t","i18n","useTranslation","formattedDelta","tone","jsxs","jsx","parseStatValue","raw","trimmed","sign","body","suffix","suffixMatch","group","decimal","probe","part","usStyleMatch","direct","normalised","numeric","Stat","forwardRef","label","value","format","currency","trendPolarity","icon","loading","animate","animateOnEveryView","animateDurationMs","animateLocale","animateSeparators","variant","size","align","intent","className","props","ref","labelId","useId","lang","staticValue","useCallback","animationLocale","useRef","parsed","useMemo","shouldAnimate","target","formatter","n","magnitudeNF","magnitudeStr","abs","intPart","fracPart","groupGlyph","intStr","fracStr","decimalGlyph","resolvedSign","countUp","useCountUp"],"mappings":"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"}

package/dist/_chunks/{streaming-text-bPDoG7Y3.js → streaming-text-zFViGexf.js}

@@ -1,7 +1,7 @@
 import { jsxs as h, jsx as i } from "react/jsx-runtime";
 import { forwardRef as y, useState as v, useEffect as b, Fragment as f } from "react";
 import { c as x } from "./index-D2ZczOXr.js";
-import { s as g, C } from "./code-block-DiC4bg-o.js";
+import { s as g, C } from "./code-block-vwEv1jEa.js";
 const z = x(
   "type-body ds:block ds:whitespace-pre-wrap ds:break-words",
   {
@@ -127,4 +127,4 @@ j.displayName = "StreamingText";
 export {
   j as S
 };
-//# sourceMappingURL=streaming-text-bPDoG7Y3.js.map
+//# sourceMappingURL=streaming-text-zFViGexf.js.map

package/dist/_chunks/{streaming-text-bPDoG7Y3.js.map → streaming-text-zFViGexf.js.map}

@@ -1 +1 @@
-{"version":3,"file":"streaming-text-bPDoG7Y3.js","sources":["../../src/components/streaming-text/streaming-text.tsx"],"sourcesContent":["import {\n  forwardRef,\n  Fragment,\n  useEffect,\n  useState,\n  type HTMLAttributes,\n  type ReactNode,\n} from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { CodeBlock, splitCodeFences } from '../_shared/code-block';\n\nconst containerVariants = cva(\n  'type-body ds:block ds:whitespace-pre-wrap ds:break-words',\n  {\n    variants: {\n      // Family, weight, tracking, line-height all come from `.type-body` on the base.\n      // Size variants override --type-body-size to shift the ramp step.\n      size: {\n        sm: 'ds:[--type-body-size:var(--font-size-sm)]',\n        md: '',\n        lg: 'ds:[--type-body-size:var(--font-size-lg)]',\n      },\n      density: {\n        default: '',\n        compact: 'ds:[--type-body-size:var(--font-size-sm)] ds:leading-snug',\n      },\n    },\n    defaultVariants: { size: 'md', density: 'default' },\n  },\n);\n\ntype NativeProps = Omit<\n  HTMLAttributes<HTMLSpanElement>,\n  'children' | 'aria-busy' | 'aria-live'\n>;\n\nexport interface StreamingTextProps\n  extends NativeProps, VariantProps<typeof containerVariants> {\n  /** Accumulated plain-text content. Parent appends tokens as they arrive. */\n  content: string;\n  /** While true the blinking cursor is shown and aria-busy is set. */\n  isStreaming: boolean;\n  /** When true, parse a small, safe subset of markdown (bold, inline code, line-breaks).\n   *  No HTML passes through; no dangerouslySetInnerHTML is ever used. */\n  renderMarkdown?: boolean;\n  /** Announce updates more aggressively when the streamed content is primary\n   *  (not wrapped by a higher-level log region). Defaults to 'polite'; never\n   *  set to 'assertive' for streamed output. */\n  ariaLive?: 'polite' | 'off';\n}\n\n/* ------------------------------------------------------------------ */\n/* Safe, dependency-free markdown-ish renderer.                        */\n/* Handles **bold**, `inline code`, and newlines. Anything that looks  */\n/* like HTML stays as text — no dangerouslySetInnerHTML.               */\n/* ------------------------------------------------------------------ */\n\ntype Token =\n  | { type: 'text'; value: string }\n  | { type: 'bold'; value: string }\n  | { type: 'code'; value: string }\n  | { type: 'br' };\n\nfunction tokenize(input: string): Token[] {\n  // Single-pass O(n) scanner. Avoids regex backtracking on `***` triples.\n  const tokens: Token[] = [];\n  const len = input.length;\n  const STAR = 42; // '*'\n  const BACKTICK = 96; // '`'\n  const LF = 10; // '\\n'\n  let textStart = 0;\n  let i = 0;\n\n  const flushText = (end: number) => {\n    if (end > textStart) {\n      tokens.push({ type: 'text', value: input.slice(textStart, end) });\n    }\n  };\n\n  while (i < len) {\n    const c = input.charCodeAt(i);\n\n    if (c === STAR && i + 1 < len && input.charCodeAt(i + 1) === STAR) {\n      // Look for closing `**`; inner content must not contain `*`.\n      let j = i + 2;\n      while (j < len && input.charCodeAt(j) !== STAR) j++;\n      if (j < len - 1 && input.charCodeAt(j + 1) === STAR && j > i + 2) {\n        flushText(i);\n        tokens.push({ type: 'bold', value: input.slice(i + 2, j) });\n        i = j + 2;\n        textStart = i;\n        continue;\n      }\n      i += 2;\n      continue;\n    }\n\n    if (c === BACKTICK) {\n      let j = i + 1;\n      while (j < len && input.charCodeAt(j) !== BACKTICK) j++;\n      if (j < len && j > i + 1) {\n        flushText(i);\n        tokens.push({ type: 'code', value: input.slice(i + 1, j) });\n        i = j + 1;\n        textStart = i;\n        continue;\n      }\n      i += 1;\n      continue;\n    }\n\n    if (c === LF) {\n      flushText(i);\n      tokens.push({ type: 'br' });\n      i += 1;\n      textStart = i;\n      continue;\n    }\n\n    i += 1;\n  }\n\n  flushText(len);\n  return tokens;\n}\n\nfunction renderInline(input: string): ReactNode {\n  return tokenize(input).map((tok, i) => {\n    if (tok.type === 'bold') return <strong key={i}>{tok.value}</strong>;\n    if (tok.type === 'code') {\n      return (\n        <code\n          key={i}\n          dir=\"ltr\"\n          className=\"ds:rounded-[var(--radius-sm)] ds:bg-muted/20 ds:ps-[var(--spacing-xs)] ds:pe-[var(--spacing-xs)] ds:font-[family-name:var(--font-mono)] ds:text-[length:0.95em]\"\n        >\n          {tok.value}\n        </code>\n      );\n    }\n    if (tok.type === 'br') return <br key={i} />;\n    return <Fragment key={i}>{tok.value}</Fragment>;\n  });\n}\n\n/**\n * Render the streamed body: split fenced code blocks out to `<CodeBlock>` and\n * run the inline tokenizer over the surrounding text. Tolerates an open fence\n * (closing ``` not yet streamed) — the prompt renders as a code block live.\n */\nfunction renderTokens(input: string): ReactNode {\n  return splitCodeFences(input).map((seg, i) => {\n    if (seg.type === 'code') {\n      return <CodeBlock key={i} code={seg.value} language={seg.lang} />;\n    }\n    return <Fragment key={i}>{renderInline(seg.value)}</Fragment>;\n  });\n}\n\nexport const StreamingText = forwardRef<HTMLSpanElement, StreamingTextProps>(\n  (\n    {\n      content,\n      isStreaming,\n      renderMarkdown = false,\n      ariaLive = 'polite',\n      size = 'md',\n      density = 'default',\n      className,\n      ...rest\n    },\n    ref,\n  ) => {\n    // Throttle visible content to at most ~10 updates per second so assistive\n    // tech doesn't receive one announcement per token. We keep the full text in\n    // a ref and push it to state on a timer.\n    const [visible, setVisible] = useState<string>(content);\n\n    useEffect(() => {\n      if (!isStreaming) {\n        // Streaming ended — flush immediately.\n        setVisible(content);\n        return;\n      }\n      // Global `setTimeout` works in both Node and browsers — avoid the\n      // `window.` prefix so SSR (Next.js App Router, Remix) doesn't throw.\n      const handle = setTimeout(() => setVisible(content), 100);\n      return () => clearTimeout(handle);\n    }, [content, isStreaming]);\n\n    const body = renderMarkdown ? renderTokens(visible) : visible;\n\n    return (\n      <span\n        ref={ref}\n        aria-live={ariaLive}\n        aria-busy={isStreaming ? true : false}\n        data-component=\"streaming-text\"\n        className={containerVariants({ size, density, className })}\n        {...rest}\n      >\n        {body}\n        {isStreaming ? (\n          <span\n            aria-hidden=\"true\"\n            className={[\n              'ds:inline-block ds:align-baseline',\n              'ds:text-[color:var(--primary)]',\n              'ds:motion-safe:animate-[var(--accessible-off,streaming-cursor-blink_1s_step-end_infinite)]',\n              'ds:motion-reduce:opacity-100',\n              'ds:forced-colors:text-[CanvasText]',\n              'ds:ms-[1px]',\n            ].join(' ')}\n          >\n            {'\\u258D'}\n          </span>\n        ) : null}\n      </span>\n    );\n  },\n);\n\nStreamingText.displayName = 'StreamingText';\n"],"names":["containerVariants","cva","tokenize","input","tokens","len","STAR","BACKTICK","LF","textStart","i","flushText","end","c","j","renderInline","tok","jsx","Fragment","renderTokens","splitCodeFences","seg","CodeBlock","StreamingText","forwardRef","content","isStreaming","renderMarkdown","ariaLive","size","density","className","rest","ref","visible","setVisible","useState","useEffect","handle","body","jsxs"],"mappings":"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"}
+{"version":3,"file":"streaming-text-zFViGexf.js","sources":["../../src/components/streaming-text/streaming-text.tsx"],"sourcesContent":["import {\n  forwardRef,\n  Fragment,\n  useEffect,\n  useState,\n  type HTMLAttributes,\n  type ReactNode,\n} from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { CodeBlock, splitCodeFences } from '../_shared/code-block';\n\nconst containerVariants = cva(\n  'type-body ds:block ds:whitespace-pre-wrap ds:break-words',\n  {\n    variants: {\n      // Family, weight, tracking, line-height all come from `.type-body` on the base.\n      // Size variants override --type-body-size to shift the ramp step.\n      size: {\n        sm: 'ds:[--type-body-size:var(--font-size-sm)]',\n        md: '',\n        lg: 'ds:[--type-body-size:var(--font-size-lg)]',\n      },\n      density: {\n        default: '',\n        compact: 'ds:[--type-body-size:var(--font-size-sm)] ds:leading-snug',\n      },\n    },\n    defaultVariants: { size: 'md', density: 'default' },\n  },\n);\n\ntype NativeProps = Omit<\n  HTMLAttributes<HTMLSpanElement>,\n  'children' | 'aria-busy' | 'aria-live'\n>;\n\nexport interface StreamingTextProps\n  extends NativeProps, VariantProps<typeof containerVariants> {\n  /** Accumulated plain-text content. Parent appends tokens as they arrive. */\n  content: string;\n  /** While true the blinking cursor is shown and aria-busy is set. */\n  isStreaming: boolean;\n  /** When true, parse a small, safe subset of markdown (bold, inline code, line-breaks).\n   *  No HTML passes through; no dangerouslySetInnerHTML is ever used. */\n  renderMarkdown?: boolean;\n  /** Announce updates more aggressively when the streamed content is primary\n   *  (not wrapped by a higher-level log region). Defaults to 'polite'; never\n   *  set to 'assertive' for streamed output. */\n  ariaLive?: 'polite' | 'off';\n}\n\n/* ------------------------------------------------------------------ */\n/* Safe, dependency-free markdown-ish renderer.                        */\n/* Handles **bold**, `inline code`, and newlines. Anything that looks  */\n/* like HTML stays as text — no dangerouslySetInnerHTML.               */\n/* ------------------------------------------------------------------ */\n\ntype Token =\n  | { type: 'text'; value: string }\n  | { type: 'bold'; value: string }\n  | { type: 'code'; value: string }\n  | { type: 'br' };\n\nfunction tokenize(input: string): Token[] {\n  // Single-pass O(n) scanner. Avoids regex backtracking on `***` triples.\n  const tokens: Token[] = [];\n  const len = input.length;\n  const STAR = 42; // '*'\n  const BACKTICK = 96; // '`'\n  const LF = 10; // '\\n'\n  let textStart = 0;\n  let i = 0;\n\n  const flushText = (end: number) => {\n    if (end > textStart) {\n      tokens.push({ type: 'text', value: input.slice(textStart, end) });\n    }\n  };\n\n  while (i < len) {\n    const c = input.charCodeAt(i);\n\n    if (c === STAR && i + 1 < len && input.charCodeAt(i + 1) === STAR) {\n      // Look for closing `**`; inner content must not contain `*`.\n      let j = i + 2;\n      while (j < len && input.charCodeAt(j) !== STAR) j++;\n      if (j < len - 1 && input.charCodeAt(j + 1) === STAR && j > i + 2) {\n        flushText(i);\n        tokens.push({ type: 'bold', value: input.slice(i + 2, j) });\n        i = j + 2;\n        textStart = i;\n        continue;\n      }\n      i += 2;\n      continue;\n    }\n\n    if (c === BACKTICK) {\n      let j = i + 1;\n      while (j < len && input.charCodeAt(j) !== BACKTICK) j++;\n      if (j < len && j > i + 1) {\n        flushText(i);\n        tokens.push({ type: 'code', value: input.slice(i + 1, j) });\n        i = j + 1;\n        textStart = i;\n        continue;\n      }\n      i += 1;\n      continue;\n    }\n\n    if (c === LF) {\n      flushText(i);\n      tokens.push({ type: 'br' });\n      i += 1;\n      textStart = i;\n      continue;\n    }\n\n    i += 1;\n  }\n\n  flushText(len);\n  return tokens;\n}\n\nfunction renderInline(input: string): ReactNode {\n  return tokenize(input).map((tok, i) => {\n    if (tok.type === 'bold') return <strong key={i}>{tok.value}</strong>;\n    if (tok.type === 'code') {\n      return (\n        <code\n          key={i}\n          dir=\"ltr\"\n          className=\"ds:rounded-[var(--radius-sm)] ds:bg-muted/20 ds:ps-[var(--spacing-xs)] ds:pe-[var(--spacing-xs)] ds:font-[family-name:var(--font-mono)] ds:text-[length:0.95em]\"\n        >\n          {tok.value}\n        </code>\n      );\n    }\n    if (tok.type === 'br') return <br key={i} />;\n    return <Fragment key={i}>{tok.value}</Fragment>;\n  });\n}\n\n/**\n * Render the streamed body: split fenced code blocks out to `<CodeBlock>` and\n * run the inline tokenizer over the surrounding text. Tolerates an open fence\n * (closing ``` not yet streamed) — the prompt renders as a code block live.\n */\nfunction renderTokens(input: string): ReactNode {\n  return splitCodeFences(input).map((seg, i) => {\n    if (seg.type === 'code') {\n      return <CodeBlock key={i} code={seg.value} language={seg.lang} />;\n    }\n    return <Fragment key={i}>{renderInline(seg.value)}</Fragment>;\n  });\n}\n\nexport const StreamingText = forwardRef<HTMLSpanElement, StreamingTextProps>(\n  (\n    {\n      content,\n      isStreaming,\n      renderMarkdown = false,\n      ariaLive = 'polite',\n      size = 'md',\n      density = 'default',\n      className,\n      ...rest\n    },\n    ref,\n  ) => {\n    // Throttle visible content to at most ~10 updates per second so assistive\n    // tech doesn't receive one announcement per token. We keep the full text in\n    // a ref and push it to state on a timer.\n    const [visible, setVisible] = useState<string>(content);\n\n    useEffect(() => {\n      if (!isStreaming) {\n        // Streaming ended — flush immediately.\n        setVisible(content);\n        return;\n      }\n      // Global `setTimeout` works in both Node and browsers — avoid the\n      // `window.` prefix so SSR (Next.js App Router, Remix) doesn't throw.\n      const handle = setTimeout(() => setVisible(content), 100);\n      return () => clearTimeout(handle);\n    }, [content, isStreaming]);\n\n    const body = renderMarkdown ? renderTokens(visible) : visible;\n\n    return (\n      <span\n        ref={ref}\n        aria-live={ariaLive}\n        aria-busy={isStreaming ? true : false}\n        data-component=\"streaming-text\"\n        className={containerVariants({ size, density, className })}\n        {...rest}\n      >\n        {body}\n        {isStreaming ? (\n          <span\n            aria-hidden=\"true\"\n            className={[\n              'ds:inline-block ds:align-baseline',\n              'ds:text-[color:var(--primary)]',\n              'ds:motion-safe:animate-[var(--accessible-off,streaming-cursor-blink_1s_step-end_infinite)]',\n              'ds:motion-reduce:opacity-100',\n              'ds:forced-colors:text-[CanvasText]',\n              'ds:ms-[1px]',\n            ].join(' ')}\n          >\n            {'\\u258D'}\n          </span>\n        ) : null}\n      </span>\n    );\n  },\n);\n\nStreamingText.displayName = 'StreamingText';\n"],"names":["containerVariants","cva","tokenize","input","tokens","len","STAR","BACKTICK","LF","textStart","i","flushText","end","c","j","renderInline","tok","jsx","Fragment","renderTokens","splitCodeFences","seg","CodeBlock","StreamingText","forwardRef","content","isStreaming","renderMarkdown","ariaLive","size","density","className","rest","ref","visible","setVisible","useState","useEffect","handle","body","jsxs"],"mappings":"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"}

package/dist/_chunks/{tab-bar-5GppbMGc.js → tab-bar-BEODTG6k.js}

@@ -2,7 +2,7 @@ import { jsx as a, jsxs as d, Fragment as D } from "react/jsx-runtime";
 import { forwardRef as F, Fragment as O } from "react";
 import { c } from "./index-D2ZczOXr.js";
 import { useTranslation as E } from "react-i18next";
-import { B as M } from "./badge-hnBt8o7n.js";
+import { B as M } from "./badge-BUk4RjTS.js";
 import { D as o } from "./dropdown-menu-D1we7oAY.js";
 import { u as P } from "./use-media-query-CcAx5SMM.js";
 import { u as Q, a as q } from "./use-scroll-overflow-UbLrUfBo.js";
@@ -224,4 +224,4 @@ as.displayName = "TabBar";
 export {
   as as T
 };
-//# sourceMappingURL=tab-bar-5GppbMGc.js.map
+//# sourceMappingURL=tab-bar-BEODTG6k.js.map

package/dist/_chunks/{tab-bar-5GppbMGc.js.map → tab-bar-BEODTG6k.js.map}

@@ -1 +1 @@
-{"version":3,"file":"tab-bar-5GppbMGc.js","sources":["../../src/components/tab-bar/tab-bar.tsx"],"sourcesContent":["/**\n * TabBar — a floating-pill bar of page-level navigation tabs.\n *\n * Each tab is an icon + label (+ optional count badge); the active tab is\n * marked with `aria-current=\"page\"` and an `--accent` underline. The bar is a\n * glassy `--card` pill that floats on whatever canvas the consumer provides\n * (the strip area itself is transparent, so it blends with the surrounding\n * surface).\n *\n * Two layouts:\n * - default (`fill` off): content-width tabs that **centre** when they fit and\n *   scroll from the inline-start (`safe center`) when they overflow, with a\n *   gutter preserved at both ends. The label stacks under the icon below `sm`.\n *   Use this when the tab set is open-ended (e.g. a marketplace app's routes).\n * - `fill`: equal-width tabs that fill the bar and always stack the label under\n *   the icon — a fixed, always-visible set that fits any column width without\n *   scrolling (e.g. a patient portal's handful of sections).\n *\n * Tabs render as links when given an `href` (real navigation) or as buttons\n * otherwise (in-app view switching via `onSelect`). Use it as a header (top,\n * default) for section navigation; `position=\"bottom\"` floats it from the\n * bottom edge for a footer.\n *\n * With `collapseToMenu`, the strip folds into a single DropdownMenu whenever the\n * tabs don't fit — below the `sm` breakpoint OR when they overflow their\n * container at any width (a narrow column on a wide screen, e.g. a page squeezed\n * between two sidebars, clips the tabs just the same as a small viewport).\n *\n * SPA / consumer-router links: pass `renderLink` and TabBar hands each `href`\n * tab off to your router's `<Link>` instead of rendering its own `<a>` — the\n * embedded MarketplaceAppShell strip uses this so a tab click is a client-side\n * route change, not a full page navigation. The kit forwards the same\n * `className` + `aria-current` so the accent-underline active styling and the\n * `aria-current=\"page\"` marker survive in both modes. With `renderLink`\n * omitted the output is the plain `<a href>` exactly as before.\n */\nimport { forwardRef, Fragment, type MouseEvent, type ReactNode } from 'react';\nimport { cva } from 'class-variance-authority';\nimport { Check, ChevronDown, ChevronLeft, ChevronRight } from 'lucide-react';\nimport { useTranslation } from 'react-i18next';\n\nimport { Badge } from '../badge';\nimport { DropdownMenu } from '../dropdown-menu';\nimport { useMediaQuery } from '../../hooks/use-media-query';\nimport { useScrollOverflow } from '../../hooks/use-scroll-overflow';\nimport { useOverflowCollapse } from '../../hooks/use-overflow-collapse';\n\nexport interface TabBarItem {\n  /** Stable id; also the value handed to `onSelect` for button tabs. */\n  id: string;\n  /** Pre-translated label — consumers localise their own nav copy. */\n  label: string;\n  /** Optional leading icon (a lucide-react element or equivalent), tinted with `--accent`. */\n  icon?: ReactNode;\n  /** Optional unseen-item count rendered as a pill badge. */\n  badgeCount?: number;\n  /** Mark the tab as the current page (`aria-current='page'` + accent underline). */\n  isActive?: boolean;\n  /** When set, the tab renders as a link to this href; otherwise it's a button. */\n  href?: string;\n  /**\n   * Optional click handler threaded onto the link tab's `<a>` (or, when\n   * `renderLink` is supplied, available to the consumer's router element). Use\n   * it to intercept a same-origin click and route client-side without a full\n   * navigation. Only applies to `href` (link) tabs — button tabs use `onSelect`.\n   */\n  onClick?: (event: MouseEvent<HTMLAnchorElement>) => void;\n}\n\n/**\n * Props the kit hands to `renderLink` for each `href` tab. The consumer returns\n * their router's `<Link to={href}>` carrying the same `className` (the active\n * accent-underline styling) and `aria-current` (`'page'` on the active tab).\n */\nexport interface TabBarRenderLinkProps {\n  /** The tab's destination — feed it to your router's `to` / `href`. */\n  href: string;\n  /** The kit's tab classes (CVA output) — apply verbatim to the link element. */\n  className: string;\n  /** Icon + label + badge — render as the link's children. */\n  children: ReactNode;\n  /** `'page'` on the active tab, otherwise omitted — forward to the link. */\n  'aria-current'?: 'page';\n  /**\n   * The tab's stable `TabBarItem.id`, as the agent / automation DOM hook.\n   * Spread it onto your router link (`{...rest}`) so the tab stays addressable\n   * by `[data-tab-id]` the same way the kit's own `<a>` / `<button>` tabs are —\n   * see PRS §26 §6.\n   */\n  'data-tab-id'?: string;\n  /** Optional per-item click handler (the item's `onClick`), if supplied. */\n  onClick?: (event: MouseEvent<HTMLAnchorElement>) => void;\n}\n\nexport interface TabBarProps {\n  /** The tabs, in order. */\n  items: TabBarItem[];\n  /**\n   * Opaque instance id, emitted on the strip as `data-component-id`. Pass it\n   * when more than one TabBar can be on screen so an agent / automation tool\n   * can scope its `[data-tab-id]` lookup to one bar (PRS §26 §6).\n   */\n  id?: string;\n  /** Accessible name for the `<nav>` landmark. */\n  ariaLabel: string;\n  /** Fires with the tab `id` when a button tab (one without `href`) is chosen. */\n  onSelect?: (id: string) => void;\n  /**\n   * Render an `href` tab via the consumer's router instead of the kit's own\n   * `<a>`. TabBar calls it for each link tab and renders the returned node; the\n   * consumer returns their `<Link to={href}>` carrying the supplied `className`\n   * + `aria-current` so the active accent underline and the `aria-current=\"page\"`\n   * marker are preserved. Use it for SPA navigation (e.g. the MarketplaceAppShell\n   * strip) so a tab click is a client-side route change, not a full page load.\n   * Omit it to render the plain `<a href>` exactly as before. Button tabs (no\n   * `href`) ignore `renderLink` and continue to use `onSelect`.\n   */\n  renderLink?: (props: TabBarRenderLinkProps) => ReactNode;\n  /**\n   * Equal-width tabs that fill the bar and always stack the label under the\n   * icon (for a fixed, always-visible set). Off (default) = content-width tabs\n   * that centre when they fit and scroll when they overflow.\n   */\n  fill?: boolean;\n  /**\n   * Float side. `'top'` (default) gutters from the top edge for a header;\n   * `'bottom'` gutters from the bottom edge for a footer.\n   */\n  position?: 'top' | 'bottom';\n  /**\n   * Collapse the tab strip into a single DropdownMenu whenever the tabs don't\n   * fit — below the `sm` breakpoint (≤640px) OR when they overflow their\n   * container at any viewport width (a narrow column between two sidebars clips\n   * the tabs the same as a small screen). The trigger shows the active tab; the\n   * menu lists them all. Off (default) keeps the content-width / scroll\n   * behaviour at every width, so existing consumers are unaffected. Designed for\n   * button (`onSelect`) tabs; in the collapsed menu an `href` tab navigates with\n   * a full page load, so `renderLink` (SPA routing) and a per-item `onClick`\n   * apply only to the expanded strip.\n   */\n  collapseToMenu?: boolean;\n  /** Extra classes merged onto the outer strip (e.g. sticky/fixed positioning). */\n  className?: string;\n}\n\nfunction formatBadgeCount(count: number): string {\n  return count > 99 ? '99+' : String(count);\n}\n\n/* Transparent strip area — provides the floating gutter on the active side. The\n   default layout also insets the pill horizontally so it reads as a floating\n   strip; `fill` drops that inset so the pill spans the full width and aligns\n   with the consumer's content (e.g. a portal's cards). */\nconst stripVariants = cva('ds:shrink-0', {\n  variants: {\n    position: {\n      top: 'ds:pt-[var(--spacing-md)]',\n      bottom: 'ds:pb-[var(--spacing-md)]',\n    },\n    fill: {\n      false: 'ds:ps-[var(--spacing-md)] ds:pe-[var(--spacing-md)]',\n      true: '',\n    },\n  },\n  defaultVariants: { position: 'top', fill: false },\n});\n\n/* The pill is the glass chrome — the bordered, blurred, rounded surface. The\n   scrollable tab row is a separate inner element (`pillScrollClasses`) so the\n   edge-fade mask touches only the tabs, never the pill's border. It is also the\n   overflow-collapse MEASUREMENT container: it stays mounted in both the scroll\n   and the dropdown render, and (carrying no padding) its `clientWidth` is\n   exactly the width the tab row has to fit. */\nconst pillClasses =\n  'ds:rounded-[var(--radius-lg)] ds:border ds:border-[color:var(--card-border)] ds:bg-[var(--card)]/80 ds:backdrop-blur-md ds:shadow-[var(--shadow-md)]';\n\n/* The inner scroll container. `safe center` centres the tabs when they fit but\n   falls back to start-alignment the moment they overflow, so the row stays fully\n   scrollable end to end. Inline-edge MASK: the leading / trailing edge fades only\n   when tabs are hidden past it (`data-fade-start` / `data-fade-end`), so a clipped\n   tab dissolves into the glass under the accent chevron — alpha-based, so no seam\n   with the translucent pill. Logical via `--tabbar-mask-*` (RTL-mapped); `black`\n   is the mask-opaque sentinel, not a colour. Disabled under reduced motion, the\n   accessible theme, and forced-colors so content is never hidden from those\n   users. `--tabbar-fade-distance` (default `--spacing-lg`) is per-instance. */\nconst pillScrollClasses = [\n  'ds:flex ds:[justify-content:safe_center] ds:overflow-x-auto ds:py-[var(--spacing-xs)]',\n  'ds:[--tabbar-mask-start:black] ds:[--tabbar-mask-end:black]',\n  'ds:ltr:data-[fade-start=true]:[--tabbar-mask-start:transparent]',\n  'ds:ltr:data-[fade-end=true]:[--tabbar-mask-end:transparent]',\n  'ds:rtl:data-[fade-start=true]:[--tabbar-mask-end:transparent]',\n  'ds:rtl:data-[fade-end=true]:[--tabbar-mask-start:transparent]',\n  'ds:[mask-image:var(--accessible-off,linear-gradient(to_right,var(--tabbar-mask-start)_0,black_var(--tabbar-fade-distance,var(--spacing-lg)),black_calc(100%-var(--tabbar-fade-distance,var(--spacing-lg))),var(--tabbar-mask-end)_100%))]',\n  'ds:motion-reduce:[mask-image:none]',\n  'ds:forced-colors:[mask-image:none]',\n].join(' ');\n\n/* The nav's inline padding is the start/end gutter — it scrolls WITH the tabs,\n   so the gutter survives a full scroll. Content width (`shrink-0`) by default so\n   it overflows and scrolls; `w-full` in fill mode so the tabs spread to fit. */\nconst navVariants = cva(\n  'ds:flex ds:items-stretch ds:gap-[var(--spacing-xs)] ds:ps-[var(--spacing-md)] ds:pe-[var(--spacing-md)]',\n  {\n    variants: {\n      fill: { false: 'ds:shrink-0', true: 'ds:w-full' },\n    },\n    defaultVariants: { fill: false },\n  },\n);\n\n/* Each tab is a centred flex box so the icon + label sit centred on both axes.\n   Regular weight; the active state is carried by the accent underline + accent\n   icon, not a heavier weight. */\nconst tabVariants = cva(\n  'ds:group ds:flex ds:items-center ds:justify-center ds:gap-[var(--spacing-xs)] ds:min-h-[var(--min-target-size)] ds:rounded-[var(--radius-sm)] ds:ps-[var(--spacing-sm)] ds:pe-[var(--spacing-sm)] ds:py-[var(--spacing-xs)] ds:whitespace-nowrap ds:cursor-pointer ds:appearance-none ds:border-0 ds:bg-transparent ds:text-[length:var(--font-size-sm)] ds:font-[var(--font-weight-regular)] ds:text-[color:var(--foreground)] ds:no-underline ds:hover:bg-[var(--muted)]/20 ds:transition-colors ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid ds:focus-visible:outline-[var(--ring)] ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)] ds:forced-colors:focus-visible:outline-[CanvasText]',\n  {\n    variants: {\n      fill: {\n        // Responsive: label under the icon below `sm`, beside it at `sm`+.\n        false: 'ds:flex-col ds:sm:flex-row ds:sm:gap-[var(--spacing-sm)]',\n        // Fill the bar, always icon-over-label. No `min-w-0`, so a tab never\n        // shrinks below its label (labels never overlap); if the full set can't\n        // fit, the pill scrolls instead.\n        true: 'ds:flex-1 ds:basis-0 ds:flex-col',\n      },\n    },\n    defaultVariants: { fill: false },\n  },\n);\n\nconst iconClasses =\n  'ds:inline-flex ds:items-center ds:text-[color:var(--accent)] ds:[&>svg]:size-4';\n\n/* The accent underline rides the label text itself (not the whole tab), so it\n   never reaches the icon or badge and never has to propagate through flex. */\nconst labelClasses =\n  'ds:group-aria-[current=page]:underline ds:group-aria-[current=page]:decoration-2 ds:group-aria-[current=page]:decoration-[color:var(--accent)] ds:group-aria-[current=page]:underline-offset-[var(--spacing-xs)]';\n\n/* The mobile collapse trigger — a full-width button styled like a tab, showing\n   the active tab's icon + label with a trailing chevron. */\nconst menuTriggerClasses =\n  'ds:flex ds:w-full ds:items-center ds:gap-[var(--spacing-sm)] ds:min-h-[var(--min-target-size)] ds:rounded-[var(--radius-sm)] ds:ps-[var(--spacing-sm)] ds:pe-[var(--spacing-sm)] ds:py-[var(--spacing-xs)] ds:cursor-pointer ds:appearance-none ds:border-0 ds:bg-transparent ds:text-[length:var(--font-size-sm)] ds:font-[var(--font-weight-regular)] ds:text-[color:var(--foreground)] ds:hover:bg-[var(--muted)]/20 ds:transition-colors ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid ds:focus-visible:outline-[var(--ring)] ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)] ds:forced-colors:focus-visible:outline-[CanvasText]';\n\n/* Scroll affordance — an accent chevron pinned to a scrollable edge of the pill,\n   shown only when there are tabs hidden past that edge. No button chrome: the\n   edge tab fades into the glass via the inner scroll's mask (above); the chevron\n   just points the way and pages the strip on click. A `--min-target-size` hit\n   area keeps it tappable. Block axis spans the pill (`top`/`bottom` px-inset past\n   the border); the inline edge (`start`/`end`) and the chevron flip mirror RTL. */\nconst scrollAffordanceClasses =\n  'ds:absolute ds:top-px ds:bottom-px ds:z-10 ds:flex ds:min-w-[var(--min-target-size)] ds:items-center ds:cursor-pointer ds:appearance-none ds:border-0 ds:bg-transparent ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid ds:focus-visible:outline-[var(--ring)] ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)] ds:forced-colors:focus-visible:outline-[CanvasText]';\n\n/* Pin the chevron to its inline edge, over the faded tab. */\nconst scrollAffordanceStartClasses =\n  'ds:start-px ds:justify-start ds:ps-[var(--spacing-xs)]';\n\nconst scrollAffordanceEndClasses =\n  'ds:end-px ds:justify-end ds:pe-[var(--spacing-xs)]';\n\n/* The chevron is the only visible mark — accent-tinted (matching the tab icons),\n   mirrored under RTL. Decorative (`aria-hidden`); the button carries the label. */\nconst scrollChevronClasses =\n  'ds:size-4 ds:shrink-0 ds:text-[color:var(--accent)] ds:rtl:-scale-x-100';\n\nexport const TabBar = forwardRef<HTMLDivElement, TabBarProps>(\n  (\n    {\n      items,\n      id,\n      ariaLabel,\n      onSelect,\n      renderLink,\n      fill = false,\n      position = 'top',\n      collapseToMenu = false,\n      className,\n    },\n    ref,\n  ) => {\n    const { t } = useTranslation('ui');\n\n    // Collapse is twofold, OR'd: the documented mobile floor (≤sm) AND actual\n    // container overflow (a narrow column on a wide screen clips the tabs just\n    // the same). Both hooks run every render (hook order); only consulted when\n    // collapseToMenu is on. The pill (containerRef) stays mounted across the\n    // collapse so the overflow hook can still tell when the column has grown\n    // back; the tab row (contentRef) carries the natural width.\n    const isNarrow = useMediaQuery('(max-width: 640px)');\n    const { containerRef, contentRef, isOverflowing } = useOverflowCollapse<\n      HTMLDivElement,\n      HTMLElement\n    >(collapseToMenu);\n    const isDropdown = collapseToMenu && (isNarrow || isOverflowing);\n\n    // Edge scroll affordances for the scroll layout. Disabled in dropdown mode\n    // (no scroll box), so the observer tears down / re-attaches across the flip.\n    const {\n      ref: pillRef,\n      canScrollStart,\n      canScrollEnd,\n      scrollByPage,\n    } = useScrollOverflow<HTMLDivElement>(!isDropdown);\n\n    const activeItem = items.find((item) => item.isActive) ?? items[0];\n\n    return (\n      <div\n        ref={ref}\n        data-component=\"tab-bar\"\n        data-component-id={id}\n        className={`${stripVariants({ position, fill })}${className ? ` ${className}` : ''}`}\n      >\n        {/* Relative wrapper: the scroll affordances are absolutely positioned\n            against it, NOT inside the scroll box (absolute children of a scroller\n            scroll away with the content). */}\n        <div className=\"ds:relative\">\n          {/* The pill doubles as the overflow-collapse measurement container —\n              rendered in BOTH branches (same element, same width) so the hook\n              can keep measuring after the tab row is swapped for the menu. */}\n          <div ref={containerRef} className={pillClasses}>\n            {isDropdown ? (\n              <nav aria-label={ariaLabel} className=\"ds:w-full\">\n                <DropdownMenu.Root>\n                  <DropdownMenu.Trigger className={menuTriggerClasses}>\n                    {activeItem?.icon ? (\n                      <span aria-hidden=\"true\" className={iconClasses}>\n                        {activeItem.icon}\n                      </span>\n                    ) : null}\n                    <span className=\"ds:flex-1 ds:truncate ds:text-start\">\n                      {activeItem?.label}\n                    </span>\n                    <ChevronDown\n                      aria-hidden=\"true\"\n                      className=\"ds:size-4 ds:shrink-0 ds:text-[color:var(--muted-foreground)]\"\n                    />\n                  </DropdownMenu.Trigger>\n                  <DropdownMenu.Content\n                    align=\"start\"\n                    className=\"ds:min-w-[12rem]\"\n                  >\n                    {items.map((item) => (\n                      <DropdownMenu.Item\n                        key={item.id}\n                        data-tab-id={item.id}\n                        startIcon={item.icon}\n                        endIcon={\n                          item.isActive ? (\n                            <Check\n                              aria-hidden=\"true\"\n                              className=\"ds:text-[color:var(--accent)] ds:group-data-[highlighted]/menu-row:text-[color:var(--accent-foreground)]\"\n                            />\n                          ) : undefined\n                        }\n                        aria-current={item.isActive ? 'page' : undefined}\n                        onSelect={() => {\n                          if (item.href) {\n                            window.location.assign(item.href);\n                          } else {\n                            onSelect?.(item.id);\n                          }\n                        }}\n                      >\n                        {item.label}\n                      </DropdownMenu.Item>\n                    ))}\n                  </DropdownMenu.Content>\n                </DropdownMenu.Root>\n              </nav>\n            ) : (\n              <div\n                ref={pillRef}\n                data-fade-start={canScrollStart ? 'true' : undefined}\n                data-fade-end={canScrollEnd ? 'true' : undefined}\n                className={pillScrollClasses}\n              >\n                <nav\n                  ref={contentRef}\n                  aria-label={ariaLabel}\n                  className={navVariants({ fill })}\n                >\n                  {items.map((item) => {\n                    const badge =\n                      typeof item.badgeCount === 'number' && item.badgeCount > 0\n                        ? item.badgeCount\n                        : undefined;\n                    const ariaCurrent = item.isActive ? 'page' : undefined;\n                    const inner = (\n                      <>\n                        {item.icon ? (\n                          <span aria-hidden=\"true\" className={iconClasses}>\n                            {item.icon}\n                          </span>\n                        ) : null}\n                        {/* Label + badge stay paired; they sit under the icon when\n                          the tab stacks to a column. */}\n                        <span className=\"ds:inline-flex ds:items-center ds:gap-[var(--spacing-xs)]\">\n                          <span className={labelClasses}>{item.label}</span>\n                          {badge !== undefined ? (\n                            <Badge variant=\"neutral\">\n                              {formatBadgeCount(badge)}\n                            </Badge>\n                          ) : null}\n                        </span>\n                      </>\n                    );\n                    if (item.href !== undefined) {\n                      const tabClassName = tabVariants({ fill });\n                      // Consumer-router mode: hand the tab to the consumer's <Link>,\n                      // forwarding the same className + aria-current (+ the item's\n                      // onClick) so the active styling and `aria-current=\"page\"`\n                      // marker carry over and clicking routes client-side.\n                      if (renderLink) {\n                        return (\n                          <Fragment key={item.id}>\n                            {renderLink({\n                              href: item.href,\n                              className: tabClassName,\n                              children: inner,\n                              'aria-current': ariaCurrent,\n                              'data-tab-id': item.id,\n                              onClick: item.onClick,\n                            })}\n                          </Fragment>\n                        );\n                      }\n                      // Default: plain anchor — byte-identical to before when no\n                      // per-item onClick is supplied (onClick is omitted entirely,\n                      // not passed as undefined, so the rendered <a> is unchanged).\n                      return (\n                        <a\n                          key={item.id}\n                          href={item.href}\n                          data-tab-id={item.id}\n                          aria-current={ariaCurrent}\n                          className={tabClassName}\n                          {...(item.onClick ? { onClick: item.onClick } : {})}\n                        >\n                          {inner}\n                        </a>\n                      );\n                    }\n                    return (\n                      <button\n                        key={item.id}\n                        type=\"button\"\n                        data-tab-id={item.id}\n                        aria-current={ariaCurrent}\n                        className={tabVariants({ fill })}\n                        onClick={() => onSelect?.(item.id)}\n                      >\n                        {inner}\n                      </button>\n                    );\n                  })}\n                </nav>\n              </div>\n            )}\n          </div>\n          {canScrollStart ? (\n            <button\n              type=\"button\"\n              aria-label={t('navigation.tabBar.scrollBack')}\n              onClick={() => scrollByPage(-1)}\n              className={`${scrollAffordanceClasses} ${scrollAffordanceStartClasses}`}\n            >\n              <ChevronLeft\n                aria-hidden=\"true\"\n                className={scrollChevronClasses}\n              />\n            </button>\n          ) : null}\n          {canScrollEnd ? (\n            <button\n              type=\"button\"\n              aria-label={t('navigation.tabBar.scrollForward')}\n              onClick={() => scrollByPage(1)}\n              className={`${scrollAffordanceClasses} ${scrollAffordanceEndClasses}`}\n            >\n              <ChevronRight\n                aria-hidden=\"true\"\n                className={scrollChevronClasses}\n              />\n            </button>\n          ) : null}\n        </div>\n      </div>\n    );\n  },\n);\nTabBar.displayName = 'TabBar';\n"],"names":["formatBadgeCount","count","stripVariants","cva","pillClasses","pillScrollClasses","navVariants","tabVariants","iconClasses","labelClasses","menuTriggerClasses","scrollAffordanceClasses","scrollAffordanceStartClasses","scrollAffordanceEndClasses","scrollChevronClasses","TabBar","forwardRef","items","id","ariaLabel","onSelect","renderLink","fill","position","collapseToMenu","className","ref","t","useTranslation","isNarrow","useMediaQuery","containerRef","contentRef","isOverflowing","useOverflowCollapse","isDropdown","pillRef","canScrollStart","canScrollEnd","scrollByPage","useScrollOverflow","activeItem","item","jsx","jsxs","DropdownMenu","ChevronDown","Check","badge","ariaCurrent","inner","Fragment","Badge","tabClassName","ChevronLeft","ChevronRight"],"mappings":";;;;;;;;;;;;AAiJA,SAASA,EAAiBC,GAAuB;AAC/C,SAAOA,IAAQ,KAAK,QAAQ,OAAOA,CAAK;AAC1C;AAMA,MAAMC,IAAgBC,EAAI,eAAe;AAAA,EACvC,UAAU;AAAA,IACR,UAAU;AAAA,MACR,KAAK;AAAA,MACL,QAAQ;AAAA,IAAA;AAAA,IAEV,MAAM;AAAA,MACJ,OAAO;AAAA,MACP,MAAM;AAAA,IAAA;AAAA,EACR;AAAA,EAEF,iBAAiB,EAAE,UAAU,OAAO,MAAM,GAAA;AAC5C,CAAC,GAQKC,IACJ,wJAWIC,IAAoB;AAAA,EACxB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,EAAE,KAAK,GAAG,GAKJC,IAAcH;AAAA,EAClB;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,MAAM,EAAE,OAAO,eAAe,MAAM,YAAA;AAAA,IAAY;AAAA,IAElD,iBAAiB,EAAE,MAAM,GAAA;AAAA,EAAM;AAEnC,GAKMI,IAAcJ;AAAA,EAClB;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,MAAM;AAAA;AAAA,QAEJ,OAAO;AAAA;AAAA;AAAA;AAAA,QAIP,MAAM;AAAA,MAAA;AAAA,IACR;AAAA,IAEF,iBAAiB,EAAE,MAAM,GAAA;AAAA,EAAM;AAEnC,GAEMK,IACJ,kFAIIC,IACJ,oNAIIC,IACJ,+uBAQIC,IACJ,iaAGIC,IACJ,0DAEIC,KACJ,sDAIIC,IACJ,2EAEWC,KAASC;AAAA,EACpB,CACE;AAAA,IACE,OAAAC;AAAA,IACA,IAAAC;AAAA,IACA,WAAAC;AAAA,IACA,UAAAC;AAAA,IACA,YAAAC;AAAA,IACA,MAAAC,IAAO;AAAA,IACP,UAAAC,IAAW;AAAA,IACX,gBAAAC,IAAiB;AAAA,IACjB,WAAAC;AAAA,EAAA,GAEFC,MACG;AACH,UAAM,EAAE,GAAAC,EAAA,IAAMC,EAAe,IAAI,GAQ3BC,IAAWC,EAAc,oBAAoB,GAC7C,EAAE,cAAAC,GAAc,YAAAC,GAAY,eAAAC,EAAA,IAAkBC,EAGlDV,CAAc,GACVW,IAAaX,MAAmBK,KAAYI,IAI5C;AAAA,MACJ,KAAKG;AAAA,MACL,gBAAAC;AAAA,MACA,cAAAC;AAAA,MACA,cAAAC;AAAA,IAAA,IACEC,EAAkC,CAACL,CAAU,GAE3CM,IAAaxB,EAAM,KAAK,CAACyB,MAASA,EAAK,QAAQ,KAAKzB,EAAM,CAAC;AAEjE,WACE,gBAAA0B;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAAjB;AAAA,QACA,kBAAe;AAAA,QACf,qBAAmBR;AAAA,QACnB,WAAW,GAAGhB,EAAc,EAAE,UAAAqB,GAAU,MAAAD,EAAA,CAAM,CAAC,GAAGG,IAAY,IAAIA,CAAS,KAAK,EAAE;AAAA,QAKlF,UAAA,gBAAAmB,EAAC,OAAA,EAAI,WAAU,eAIb,UAAA;AAAA,UAAA,gBAAAD,EAAC,OAAA,EAAI,KAAKZ,GAAc,WAAW3B,GAChC,UAAA+B,IACC,gBAAAQ,EAAC,OAAA,EAAI,cAAYxB,GAAW,WAAU,aACpC,UAAA,gBAAAyB,EAACC,EAAa,MAAb,EACC,UAAA;AAAA,YAAA,gBAAAD,EAACC,EAAa,SAAb,EAAqB,WAAWnC,GAC9B,UAAA;AAAA,cAAA+B,KAAA,QAAAA,EAAY,yBACV,QAAA,EAAK,eAAY,QAAO,WAAWjC,GACjC,UAAAiC,EAAW,KAAA,CACd,IACE;AAAA,cACJ,gBAAAE,EAAC,QAAA,EAAK,WAAU,uCACb,iCAAY,OACf;AAAA,cACA,gBAAAA;AAAA,gBAACG;AAAA,gBAAA;AAAA,kBACC,eAAY;AAAA,kBACZ,WAAU;AAAA,gBAAA;AAAA,cAAA;AAAA,YACZ,GACF;AAAA,YACA,gBAAAH;AAAA,cAACE,EAAa;AAAA,cAAb;AAAA,gBACC,OAAM;AAAA,gBACN,WAAU;AAAA,gBAET,UAAA5B,EAAM,IAAI,CAACyB,MACV,gBAAAC;AAAA,kBAACE,EAAa;AAAA,kBAAb;AAAA,oBAEC,eAAaH,EAAK;AAAA,oBAClB,WAAWA,EAAK;AAAA,oBAChB,SACEA,EAAK,WACH,gBAAAC;AAAA,sBAACI;AAAA,sBAAA;AAAA,wBACC,eAAY;AAAA,wBACZ,WAAU;AAAA,sBAAA;AAAA,oBAAA,IAEV;AAAA,oBAEN,gBAAcL,EAAK,WAAW,SAAS;AAAA,oBACvC,UAAU,MAAM;AACd,sBAAIA,EAAK,OACP,OAAO,SAAS,OAAOA,EAAK,IAAI,IAEhCtB,KAAA,QAAAA,EAAWsB,EAAK;AAAA,oBAEpB;AAAA,oBAEC,UAAAA,EAAK;AAAA,kBAAA;AAAA,kBApBDA,EAAK;AAAA,gBAAA,CAsBb;AAAA,cAAA;AAAA,YAAA;AAAA,UACH,EAAA,CACF,GACF,IAEA,gBAAAC;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,KAAKP;AAAA,cACL,mBAAiBC,IAAiB,SAAS;AAAA,cAC3C,iBAAeC,IAAe,SAAS;AAAA,cACvC,WAAWjC;AAAA,cAEX,UAAA,gBAAAsC;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,KAAKX;AAAA,kBACL,cAAYb;AAAA,kBACZ,WAAWb,EAAY,EAAE,MAAAgB,GAAM;AAAA,kBAE9B,UAAAL,EAAM,IAAI,CAACyB,MAAS;AACnB,0BAAMM,IACJ,OAAON,EAAK,cAAe,YAAYA,EAAK,aAAa,IACrDA,EAAK,aACL,QACAO,IAAcP,EAAK,WAAW,SAAS,QACvCQ,IACJ,gBAAAN,EAAAO,GAAA,EACG,UAAA;AAAA,sBAAAT,EAAK,yBACH,QAAA,EAAK,eAAY,QAAO,WAAWlC,GACjC,UAAAkC,EAAK,KAAA,CACR,IACE;AAAA,sBAGJ,gBAAAE,EAAC,QAAA,EAAK,WAAU,6DACd,UAAA;AAAA,wBAAA,gBAAAD,EAAC,QAAA,EAAK,WAAWlC,GAAe,UAAAiC,EAAK,OAAM;AAAA,wBAC1CM,MAAU,SACT,gBAAAL,EAACS,GAAA,EAAM,SAAQ,WACZ,UAAApD,EAAiBgD,CAAK,EAAA,CACzB,IACE;AAAA,sBAAA,EAAA,CACN;AAAA,oBAAA,GACF;AAEF,wBAAIN,EAAK,SAAS,QAAW;AAC3B,4BAAMW,IAAe9C,EAAY,EAAE,MAAAe,GAAM;AAKzC,6BAAID,IAEA,gBAAAsB,EAACQ,GAAA,EACE,UAAA9B,EAAW;AAAA,wBACV,MAAMqB,EAAK;AAAA,wBACX,WAAWW;AAAA,wBACX,UAAUH;AAAA,wBACV,gBAAgBD;AAAA,wBAChB,eAAeP,EAAK;AAAA,wBACpB,SAASA,EAAK;AAAA,sBAAA,CACf,EAAA,GARYA,EAAK,EASpB,IAOF,gBAAAC;AAAA,wBAAC;AAAA,wBAAA;AAAA,0BAEC,MAAMD,EAAK;AAAA,0BACX,eAAaA,EAAK;AAAA,0BAClB,gBAAcO;AAAA,0BACd,WAAWI;AAAA,0BACV,GAAIX,EAAK,UAAU,EAAE,SAASA,EAAK,QAAA,IAAY,CAAA;AAAA,0BAE/C,UAAAQ;AAAA,wBAAA;AAAA,wBAPIR,EAAK;AAAA,sBAAA;AAAA,oBAUhB;AACA,2BACE,gBAAAC;AAAA,sBAAC;AAAA,sBAAA;AAAA,wBAEC,MAAK;AAAA,wBACL,eAAaD,EAAK;AAAA,wBAClB,gBAAcO;AAAA,wBACd,WAAW1C,EAAY,EAAE,MAAAe,GAAM;AAAA,wBAC/B,SAAS,MAAMF,KAAA,gBAAAA,EAAWsB,EAAK;AAAA,wBAE9B,UAAAQ;AAAA,sBAAA;AAAA,sBAPIR,EAAK;AAAA,oBAAA;AAAA,kBAUhB,CAAC;AAAA,gBAAA;AAAA,cAAA;AAAA,YACH;AAAA,UAAA,GAGN;AAAA,UACCL,IACC,gBAAAM;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,MAAK;AAAA,cACL,cAAYhB,EAAE,8BAA8B;AAAA,cAC5C,SAAS,MAAMY,EAAa,EAAE;AAAA,cAC9B,WAAW,GAAG5B,CAAuB,IAAIC,CAA4B;AAAA,cAErE,UAAA,gBAAA+B;AAAA,gBAACW;AAAA,gBAAA;AAAA,kBACC,eAAY;AAAA,kBACZ,WAAWxC;AAAA,gBAAA;AAAA,cAAA;AAAA,YACb;AAAA,UAAA,IAEA;AAAA,UACHwB,IACC,gBAAAK;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,MAAK;AAAA,cACL,cAAYhB,EAAE,iCAAiC;AAAA,cAC/C,SAAS,MAAMY,EAAa,CAAC;AAAA,cAC7B,WAAW,GAAG5B,CAAuB,IAAIE,EAA0B;AAAA,cAEnE,UAAA,gBAAA8B;AAAA,gBAACY;AAAA,gBAAA;AAAA,kBACC,eAAY;AAAA,kBACZ,WAAWzC;AAAA,gBAAA;AAAA,cAAA;AAAA,YACb;AAAA,UAAA,IAEA;AAAA,QAAA,EAAA,CACN;AAAA,MAAA;AAAA,IAAA;AAAA,EAGN;AACF;AACAC,GAAO,cAAc;"}
+{"version":3,"file":"tab-bar-BEODTG6k.js","sources":["../../src/components/tab-bar/tab-bar.tsx"],"sourcesContent":["/**\n * TabBar — a floating-pill bar of page-level navigation tabs.\n *\n * Each tab is an icon + label (+ optional count badge); the active tab is\n * marked with `aria-current=\"page\"` and an `--accent` underline. The bar is a\n * glassy `--card` pill that floats on whatever canvas the consumer provides\n * (the strip area itself is transparent, so it blends with the surrounding\n * surface).\n *\n * Two layouts:\n * - default (`fill` off): content-width tabs that **centre** when they fit and\n *   scroll from the inline-start (`safe center`) when they overflow, with a\n *   gutter preserved at both ends. The label stacks under the icon below `sm`.\n *   Use this when the tab set is open-ended (e.g. a marketplace app's routes).\n * - `fill`: equal-width tabs that fill the bar and always stack the label under\n *   the icon — a fixed, always-visible set that fits any column width without\n *   scrolling (e.g. a patient portal's handful of sections).\n *\n * Tabs render as links when given an `href` (real navigation) or as buttons\n * otherwise (in-app view switching via `onSelect`). Use it as a header (top,\n * default) for section navigation; `position=\"bottom\"` floats it from the\n * bottom edge for a footer.\n *\n * With `collapseToMenu`, the strip folds into a single DropdownMenu whenever the\n * tabs don't fit — below the `sm` breakpoint OR when they overflow their\n * container at any width (a narrow column on a wide screen, e.g. a page squeezed\n * between two sidebars, clips the tabs just the same as a small viewport).\n *\n * SPA / consumer-router links: pass `renderLink` and TabBar hands each `href`\n * tab off to your router's `<Link>` instead of rendering its own `<a>` — the\n * embedded MarketplaceAppShell strip uses this so a tab click is a client-side\n * route change, not a full page navigation. The kit forwards the same\n * `className` + `aria-current` so the accent-underline active styling and the\n * `aria-current=\"page\"` marker survive in both modes. With `renderLink`\n * omitted the output is the plain `<a href>` exactly as before.\n */\nimport { forwardRef, Fragment, type MouseEvent, type ReactNode } from 'react';\nimport { cva } from 'class-variance-authority';\nimport { Check, ChevronDown, ChevronLeft, ChevronRight } from 'lucide-react';\nimport { useTranslation } from 'react-i18next';\n\nimport { Badge } from '../badge';\nimport { DropdownMenu } from '../dropdown-menu';\nimport { useMediaQuery } from '../../hooks/use-media-query';\nimport { useScrollOverflow } from '../../hooks/use-scroll-overflow';\nimport { useOverflowCollapse } from '../../hooks/use-overflow-collapse';\n\nexport interface TabBarItem {\n  /** Stable id; also the value handed to `onSelect` for button tabs. */\n  id: string;\n  /** Pre-translated label — consumers localise their own nav copy. */\n  label: string;\n  /** Optional leading icon (a lucide-react element or equivalent), tinted with `--accent`. */\n  icon?: ReactNode;\n  /** Optional unseen-item count rendered as a pill badge. */\n  badgeCount?: number;\n  /** Mark the tab as the current page (`aria-current='page'` + accent underline). */\n  isActive?: boolean;\n  /** When set, the tab renders as a link to this href; otherwise it's a button. */\n  href?: string;\n  /**\n   * Optional click handler threaded onto the link tab's `<a>` (or, when\n   * `renderLink` is supplied, available to the consumer's router element). Use\n   * it to intercept a same-origin click and route client-side without a full\n   * navigation. Only applies to `href` (link) tabs — button tabs use `onSelect`.\n   */\n  onClick?: (event: MouseEvent<HTMLAnchorElement>) => void;\n}\n\n/**\n * Props the kit hands to `renderLink` for each `href` tab. The consumer returns\n * their router's `<Link to={href}>` carrying the same `className` (the active\n * accent-underline styling) and `aria-current` (`'page'` on the active tab).\n */\nexport interface TabBarRenderLinkProps {\n  /** The tab's destination — feed it to your router's `to` / `href`. */\n  href: string;\n  /** The kit's tab classes (CVA output) — apply verbatim to the link element. */\n  className: string;\n  /** Icon + label + badge — render as the link's children. */\n  children: ReactNode;\n  /** `'page'` on the active tab, otherwise omitted — forward to the link. */\n  'aria-current'?: 'page';\n  /**\n   * The tab's stable `TabBarItem.id`, as the agent / automation DOM hook.\n   * Spread it onto your router link (`{...rest}`) so the tab stays addressable\n   * by `[data-tab-id]` the same way the kit's own `<a>` / `<button>` tabs are —\n   * see PRS §26 §6.\n   */\n  'data-tab-id'?: string;\n  /** Optional per-item click handler (the item's `onClick`), if supplied. */\n  onClick?: (event: MouseEvent<HTMLAnchorElement>) => void;\n}\n\nexport interface TabBarProps {\n  /** The tabs, in order. */\n  items: TabBarItem[];\n  /**\n   * Opaque instance id, emitted on the strip as `data-component-id`. Pass it\n   * when more than one TabBar can be on screen so an agent / automation tool\n   * can scope its `[data-tab-id]` lookup to one bar (PRS §26 §6).\n   */\n  id?: string;\n  /** Accessible name for the `<nav>` landmark. */\n  ariaLabel: string;\n  /** Fires with the tab `id` when a button tab (one without `href`) is chosen. */\n  onSelect?: (id: string) => void;\n  /**\n   * Render an `href` tab via the consumer's router instead of the kit's own\n   * `<a>`. TabBar calls it for each link tab and renders the returned node; the\n   * consumer returns their `<Link to={href}>` carrying the supplied `className`\n   * + `aria-current` so the active accent underline and the `aria-current=\"page\"`\n   * marker are preserved. Use it for SPA navigation (e.g. the MarketplaceAppShell\n   * strip) so a tab click is a client-side route change, not a full page load.\n   * Omit it to render the plain `<a href>` exactly as before. Button tabs (no\n   * `href`) ignore `renderLink` and continue to use `onSelect`.\n   */\n  renderLink?: (props: TabBarRenderLinkProps) => ReactNode;\n  /**\n   * Equal-width tabs that fill the bar and always stack the label under the\n   * icon (for a fixed, always-visible set). Off (default) = content-width tabs\n   * that centre when they fit and scroll when they overflow.\n   */\n  fill?: boolean;\n  /**\n   * Float side. `'top'` (default) gutters from the top edge for a header;\n   * `'bottom'` gutters from the bottom edge for a footer.\n   */\n  position?: 'top' | 'bottom';\n  /**\n   * Collapse the tab strip into a single DropdownMenu whenever the tabs don't\n   * fit — below the `sm` breakpoint (≤640px) OR when they overflow their\n   * container at any viewport width (a narrow column between two sidebars clips\n   * the tabs the same as a small screen). The trigger shows the active tab; the\n   * menu lists them all. Off (default) keeps the content-width / scroll\n   * behaviour at every width, so existing consumers are unaffected. Designed for\n   * button (`onSelect`) tabs; in the collapsed menu an `href` tab navigates with\n   * a full page load, so `renderLink` (SPA routing) and a per-item `onClick`\n   * apply only to the expanded strip.\n   */\n  collapseToMenu?: boolean;\n  /** Extra classes merged onto the outer strip (e.g. sticky/fixed positioning). */\n  className?: string;\n}\n\nfunction formatBadgeCount(count: number): string {\n  return count > 99 ? '99+' : String(count);\n}\n\n/* Transparent strip area — provides the floating gutter on the active side. The\n   default layout also insets the pill horizontally so it reads as a floating\n   strip; `fill` drops that inset so the pill spans the full width and aligns\n   with the consumer's content (e.g. a portal's cards). */\nconst stripVariants = cva('ds:shrink-0', {\n  variants: {\n    position: {\n      top: 'ds:pt-[var(--spacing-md)]',\n      bottom: 'ds:pb-[var(--spacing-md)]',\n    },\n    fill: {\n      false: 'ds:ps-[var(--spacing-md)] ds:pe-[var(--spacing-md)]',\n      true: '',\n    },\n  },\n  defaultVariants: { position: 'top', fill: false },\n});\n\n/* The pill is the glass chrome — the bordered, blurred, rounded surface. The\n   scrollable tab row is a separate inner element (`pillScrollClasses`) so the\n   edge-fade mask touches only the tabs, never the pill's border. It is also the\n   overflow-collapse MEASUREMENT container: it stays mounted in both the scroll\n   and the dropdown render, and (carrying no padding) its `clientWidth` is\n   exactly the width the tab row has to fit. */\nconst pillClasses =\n  'ds:rounded-[var(--radius-lg)] ds:border ds:border-[color:var(--card-border)] ds:bg-[var(--card)]/80 ds:backdrop-blur-md ds:shadow-[var(--shadow-md)]';\n\n/* The inner scroll container. `safe center` centres the tabs when they fit but\n   falls back to start-alignment the moment they overflow, so the row stays fully\n   scrollable end to end. Inline-edge MASK: the leading / trailing edge fades only\n   when tabs are hidden past it (`data-fade-start` / `data-fade-end`), so a clipped\n   tab dissolves into the glass under the accent chevron — alpha-based, so no seam\n   with the translucent pill. Logical via `--tabbar-mask-*` (RTL-mapped); `black`\n   is the mask-opaque sentinel, not a colour. Disabled under reduced motion, the\n   accessible theme, and forced-colors so content is never hidden from those\n   users. `--tabbar-fade-distance` (default `--spacing-lg`) is per-instance. */\nconst pillScrollClasses = [\n  'ds:flex ds:[justify-content:safe_center] ds:overflow-x-auto ds:py-[var(--spacing-xs)]',\n  'ds:[--tabbar-mask-start:black] ds:[--tabbar-mask-end:black]',\n  'ds:ltr:data-[fade-start=true]:[--tabbar-mask-start:transparent]',\n  'ds:ltr:data-[fade-end=true]:[--tabbar-mask-end:transparent]',\n  'ds:rtl:data-[fade-start=true]:[--tabbar-mask-end:transparent]',\n  'ds:rtl:data-[fade-end=true]:[--tabbar-mask-start:transparent]',\n  'ds:[mask-image:var(--accessible-off,linear-gradient(to_right,var(--tabbar-mask-start)_0,black_var(--tabbar-fade-distance,var(--spacing-lg)),black_calc(100%-var(--tabbar-fade-distance,var(--spacing-lg))),var(--tabbar-mask-end)_100%))]',\n  'ds:motion-reduce:[mask-image:none]',\n  'ds:forced-colors:[mask-image:none]',\n].join(' ');\n\n/* The nav's inline padding is the start/end gutter — it scrolls WITH the tabs,\n   so the gutter survives a full scroll. Content width (`shrink-0`) by default so\n   it overflows and scrolls; `w-full` in fill mode so the tabs spread to fit. */\nconst navVariants = cva(\n  'ds:flex ds:items-stretch ds:gap-[var(--spacing-xs)] ds:ps-[var(--spacing-md)] ds:pe-[var(--spacing-md)]',\n  {\n    variants: {\n      fill: { false: 'ds:shrink-0', true: 'ds:w-full' },\n    },\n    defaultVariants: { fill: false },\n  },\n);\n\n/* Each tab is a centred flex box so the icon + label sit centred on both axes.\n   Regular weight; the active state is carried by the accent underline + accent\n   icon, not a heavier weight. */\nconst tabVariants = cva(\n  'ds:group ds:flex ds:items-center ds:justify-center ds:gap-[var(--spacing-xs)] ds:min-h-[var(--min-target-size)] ds:rounded-[var(--radius-sm)] ds:ps-[var(--spacing-sm)] ds:pe-[var(--spacing-sm)] ds:py-[var(--spacing-xs)] ds:whitespace-nowrap ds:cursor-pointer ds:appearance-none ds:border-0 ds:bg-transparent ds:text-[length:var(--font-size-sm)] ds:font-[var(--font-weight-regular)] ds:text-[color:var(--foreground)] ds:no-underline ds:hover:bg-[var(--muted)]/20 ds:transition-colors ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid ds:focus-visible:outline-[var(--ring)] ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)] ds:forced-colors:focus-visible:outline-[CanvasText]',\n  {\n    variants: {\n      fill: {\n        // Responsive: label under the icon below `sm`, beside it at `sm`+.\n        false: 'ds:flex-col ds:sm:flex-row ds:sm:gap-[var(--spacing-sm)]',\n        // Fill the bar, always icon-over-label. No `min-w-0`, so a tab never\n        // shrinks below its label (labels never overlap); if the full set can't\n        // fit, the pill scrolls instead.\n        true: 'ds:flex-1 ds:basis-0 ds:flex-col',\n      },\n    },\n    defaultVariants: { fill: false },\n  },\n);\n\nconst iconClasses =\n  'ds:inline-flex ds:items-center ds:text-[color:var(--accent)] ds:[&>svg]:size-4';\n\n/* The accent underline rides the label text itself (not the whole tab), so it\n   never reaches the icon or badge and never has to propagate through flex. */\nconst labelClasses =\n  'ds:group-aria-[current=page]:underline ds:group-aria-[current=page]:decoration-2 ds:group-aria-[current=page]:decoration-[color:var(--accent)] ds:group-aria-[current=page]:underline-offset-[var(--spacing-xs)]';\n\n/* The mobile collapse trigger — a full-width button styled like a tab, showing\n   the active tab's icon + label with a trailing chevron. */\nconst menuTriggerClasses =\n  'ds:flex ds:w-full ds:items-center ds:gap-[var(--spacing-sm)] ds:min-h-[var(--min-target-size)] ds:rounded-[var(--radius-sm)] ds:ps-[var(--spacing-sm)] ds:pe-[var(--spacing-sm)] ds:py-[var(--spacing-xs)] ds:cursor-pointer ds:appearance-none ds:border-0 ds:bg-transparent ds:text-[length:var(--font-size-sm)] ds:font-[var(--font-weight-regular)] ds:text-[color:var(--foreground)] ds:hover:bg-[var(--muted)]/20 ds:transition-colors ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid ds:focus-visible:outline-[var(--ring)] ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)] ds:forced-colors:focus-visible:outline-[CanvasText]';\n\n/* Scroll affordance — an accent chevron pinned to a scrollable edge of the pill,\n   shown only when there are tabs hidden past that edge. No button chrome: the\n   edge tab fades into the glass via the inner scroll's mask (above); the chevron\n   just points the way and pages the strip on click. A `--min-target-size` hit\n   area keeps it tappable. Block axis spans the pill (`top`/`bottom` px-inset past\n   the border); the inline edge (`start`/`end`) and the chevron flip mirror RTL. */\nconst scrollAffordanceClasses =\n  'ds:absolute ds:top-px ds:bottom-px ds:z-10 ds:flex ds:min-w-[var(--min-target-size)] ds:items-center ds:cursor-pointer ds:appearance-none ds:border-0 ds:bg-transparent ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid ds:focus-visible:outline-[var(--ring)] ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)] ds:forced-colors:focus-visible:outline-[CanvasText]';\n\n/* Pin the chevron to its inline edge, over the faded tab. */\nconst scrollAffordanceStartClasses =\n  'ds:start-px ds:justify-start ds:ps-[var(--spacing-xs)]';\n\nconst scrollAffordanceEndClasses =\n  'ds:end-px ds:justify-end ds:pe-[var(--spacing-xs)]';\n\n/* The chevron is the only visible mark — accent-tinted (matching the tab icons),\n   mirrored under RTL. Decorative (`aria-hidden`); the button carries the label. */\nconst scrollChevronClasses =\n  'ds:size-4 ds:shrink-0 ds:text-[color:var(--accent)] ds:rtl:-scale-x-100';\n\nexport const TabBar = forwardRef<HTMLDivElement, TabBarProps>(\n  (\n    {\n      items,\n      id,\n      ariaLabel,\n      onSelect,\n      renderLink,\n      fill = false,\n      position = 'top',\n      collapseToMenu = false,\n      className,\n    },\n    ref,\n  ) => {\n    const { t } = useTranslation('ui');\n\n    // Collapse is twofold, OR'd: the documented mobile floor (≤sm) AND actual\n    // container overflow (a narrow column on a wide screen clips the tabs just\n    // the same). Both hooks run every render (hook order); only consulted when\n    // collapseToMenu is on. The pill (containerRef) stays mounted across the\n    // collapse so the overflow hook can still tell when the column has grown\n    // back; the tab row (contentRef) carries the natural width.\n    const isNarrow = useMediaQuery('(max-width: 640px)');\n    const { containerRef, contentRef, isOverflowing } = useOverflowCollapse<\n      HTMLDivElement,\n      HTMLElement\n    >(collapseToMenu);\n    const isDropdown = collapseToMenu && (isNarrow || isOverflowing);\n\n    // Edge scroll affordances for the scroll layout. Disabled in dropdown mode\n    // (no scroll box), so the observer tears down / re-attaches across the flip.\n    const {\n      ref: pillRef,\n      canScrollStart,\n      canScrollEnd,\n      scrollByPage,\n    } = useScrollOverflow<HTMLDivElement>(!isDropdown);\n\n    const activeItem = items.find((item) => item.isActive) ?? items[0];\n\n    return (\n      <div\n        ref={ref}\n        data-component=\"tab-bar\"\n        data-component-id={id}\n        className={`${stripVariants({ position, fill })}${className ? ` ${className}` : ''}`}\n      >\n        {/* Relative wrapper: the scroll affordances are absolutely positioned\n            against it, NOT inside the scroll box (absolute children of a scroller\n            scroll away with the content). */}\n        <div className=\"ds:relative\">\n          {/* The pill doubles as the overflow-collapse measurement container —\n              rendered in BOTH branches (same element, same width) so the hook\n              can keep measuring after the tab row is swapped for the menu. */}\n          <div ref={containerRef} className={pillClasses}>\n            {isDropdown ? (\n              <nav aria-label={ariaLabel} className=\"ds:w-full\">\n                <DropdownMenu.Root>\n                  <DropdownMenu.Trigger className={menuTriggerClasses}>\n                    {activeItem?.icon ? (\n                      <span aria-hidden=\"true\" className={iconClasses}>\n                        {activeItem.icon}\n                      </span>\n                    ) : null}\n                    <span className=\"ds:flex-1 ds:truncate ds:text-start\">\n                      {activeItem?.label}\n                    </span>\n                    <ChevronDown\n                      aria-hidden=\"true\"\n                      className=\"ds:size-4 ds:shrink-0 ds:text-[color:var(--muted-foreground)]\"\n                    />\n                  </DropdownMenu.Trigger>\n                  <DropdownMenu.Content\n                    align=\"start\"\n                    className=\"ds:min-w-[12rem]\"\n                  >\n                    {items.map((item) => (\n                      <DropdownMenu.Item\n                        key={item.id}\n                        data-tab-id={item.id}\n                        startIcon={item.icon}\n                        endIcon={\n                          item.isActive ? (\n                            <Check\n                              aria-hidden=\"true\"\n                              className=\"ds:text-[color:var(--accent)] ds:group-data-[highlighted]/menu-row:text-[color:var(--accent-foreground)]\"\n                            />\n                          ) : undefined\n                        }\n                        aria-current={item.isActive ? 'page' : undefined}\n                        onSelect={() => {\n                          if (item.href) {\n                            window.location.assign(item.href);\n                          } else {\n                            onSelect?.(item.id);\n                          }\n                        }}\n                      >\n                        {item.label}\n                      </DropdownMenu.Item>\n                    ))}\n                  </DropdownMenu.Content>\n                </DropdownMenu.Root>\n              </nav>\n            ) : (\n              <div\n                ref={pillRef}\n                data-fade-start={canScrollStart ? 'true' : undefined}\n                data-fade-end={canScrollEnd ? 'true' : undefined}\n                className={pillScrollClasses}\n              >\n                <nav\n                  ref={contentRef}\n                  aria-label={ariaLabel}\n                  className={navVariants({ fill })}\n                >\n                  {items.map((item) => {\n                    const badge =\n                      typeof item.badgeCount === 'number' && item.badgeCount > 0\n                        ? item.badgeCount\n                        : undefined;\n                    const ariaCurrent = item.isActive ? 'page' : undefined;\n                    const inner = (\n                      <>\n                        {item.icon ? (\n                          <span aria-hidden=\"true\" className={iconClasses}>\n                            {item.icon}\n                          </span>\n                        ) : null}\n                        {/* Label + badge stay paired; they sit under the icon when\n                          the tab stacks to a column. */}\n                        <span className=\"ds:inline-flex ds:items-center ds:gap-[var(--spacing-xs)]\">\n                          <span className={labelClasses}>{item.label}</span>\n                          {badge !== undefined ? (\n                            <Badge variant=\"neutral\">\n                              {formatBadgeCount(badge)}\n                            </Badge>\n                          ) : null}\n                        </span>\n                      </>\n                    );\n                    if (item.href !== undefined) {\n                      const tabClassName = tabVariants({ fill });\n                      // Consumer-router mode: hand the tab to the consumer's <Link>,\n                      // forwarding the same className + aria-current (+ the item's\n                      // onClick) so the active styling and `aria-current=\"page\"`\n                      // marker carry over and clicking routes client-side.\n                      if (renderLink) {\n                        return (\n                          <Fragment key={item.id}>\n                            {renderLink({\n                              href: item.href,\n                              className: tabClassName,\n                              children: inner,\n                              'aria-current': ariaCurrent,\n                              'data-tab-id': item.id,\n                              onClick: item.onClick,\n                            })}\n                          </Fragment>\n                        );\n                      }\n                      // Default: plain anchor — byte-identical to before when no\n                      // per-item onClick is supplied (onClick is omitted entirely,\n                      // not passed as undefined, so the rendered <a> is unchanged).\n                      return (\n                        <a\n                          key={item.id}\n                          href={item.href}\n                          data-tab-id={item.id}\n                          aria-current={ariaCurrent}\n                          className={tabClassName}\n                          {...(item.onClick ? { onClick: item.onClick } : {})}\n                        >\n                          {inner}\n                        </a>\n                      );\n                    }\n                    return (\n                      <button\n                        key={item.id}\n                        type=\"button\"\n                        data-tab-id={item.id}\n                        aria-current={ariaCurrent}\n                        className={tabVariants({ fill })}\n                        onClick={() => onSelect?.(item.id)}\n                      >\n                        {inner}\n                      </button>\n                    );\n                  })}\n                </nav>\n              </div>\n            )}\n          </div>\n          {canScrollStart ? (\n            <button\n              type=\"button\"\n              aria-label={t('navigation.tabBar.scrollBack')}\n              onClick={() => scrollByPage(-1)}\n              className={`${scrollAffordanceClasses} ${scrollAffordanceStartClasses}`}\n            >\n              <ChevronLeft\n                aria-hidden=\"true\"\n                className={scrollChevronClasses}\n              />\n            </button>\n          ) : null}\n          {canScrollEnd ? (\n            <button\n              type=\"button\"\n              aria-label={t('navigation.tabBar.scrollForward')}\n              onClick={() => scrollByPage(1)}\n              className={`${scrollAffordanceClasses} ${scrollAffordanceEndClasses}`}\n            >\n              <ChevronRight\n                aria-hidden=\"true\"\n                className={scrollChevronClasses}\n              />\n            </button>\n          ) : null}\n        </div>\n      </div>\n    );\n  },\n);\nTabBar.displayName = 'TabBar';\n"],"names":["formatBadgeCount","count","stripVariants","cva","pillClasses","pillScrollClasses","navVariants","tabVariants","iconClasses","labelClasses","menuTriggerClasses","scrollAffordanceClasses","scrollAffordanceStartClasses","scrollAffordanceEndClasses","scrollChevronClasses","TabBar","forwardRef","items","id","ariaLabel","onSelect","renderLink","fill","position","collapseToMenu","className","ref","t","useTranslation","isNarrow","useMediaQuery","containerRef","contentRef","isOverflowing","useOverflowCollapse","isDropdown","pillRef","canScrollStart","canScrollEnd","scrollByPage","useScrollOverflow","activeItem","item","jsx","jsxs","DropdownMenu","ChevronDown","Check","badge","ariaCurrent","inner","Fragment","Badge","tabClassName","ChevronLeft","ChevronRight"],"mappings":";;;;;;;;;;;;AAiJA,SAASA,EAAiBC,GAAuB;AAC/C,SAAOA,IAAQ,KAAK,QAAQ,OAAOA,CAAK;AAC1C;AAMA,MAAMC,IAAgBC,EAAI,eAAe;AAAA,EACvC,UAAU;AAAA,IACR,UAAU;AAAA,MACR,KAAK;AAAA,MACL,QAAQ;AAAA,IAAA;AAAA,IAEV,MAAM;AAAA,MACJ,OAAO;AAAA,MACP,MAAM;AAAA,IAAA;AAAA,EACR;AAAA,EAEF,iBAAiB,EAAE,UAAU,OAAO,MAAM,GAAA;AAC5C,CAAC,GAQKC,IACJ,wJAWIC,IAAoB;AAAA,EACxB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,EAAE,KAAK,GAAG,GAKJC,IAAcH;AAAA,EAClB;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,MAAM,EAAE,OAAO,eAAe,MAAM,YAAA;AAAA,IAAY;AAAA,IAElD,iBAAiB,EAAE,MAAM,GAAA;AAAA,EAAM;AAEnC,GAKMI,IAAcJ;AAAA,EAClB;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,MAAM;AAAA;AAAA,QAEJ,OAAO;AAAA;AAAA;AAAA;AAAA,QAIP,MAAM;AAAA,MAAA;AAAA,IACR;AAAA,IAEF,iBAAiB,EAAE,MAAM,GAAA;AAAA,EAAM;AAEnC,GAEMK,IACJ,kFAIIC,IACJ,oNAIIC,IACJ,+uBAQIC,IACJ,iaAGIC,IACJ,0DAEIC,KACJ,sDAIIC,IACJ,2EAEWC,KAASC;AAAA,EACpB,CACE;AAAA,IACE,OAAAC;AAAA,IACA,IAAAC;AAAA,IACA,WAAAC;AAAA,IACA,UAAAC;AAAA,IACA,YAAAC;AAAA,IACA,MAAAC,IAAO;AAAA,IACP,UAAAC,IAAW;AAAA,IACX,gBAAAC,IAAiB;AAAA,IACjB,WAAAC;AAAA,EAAA,GAEFC,MACG;AACH,UAAM,EAAE,GAAAC,EAAA,IAAMC,EAAe,IAAI,GAQ3BC,IAAWC,EAAc,oBAAoB,GAC7C,EAAE,cAAAC,GAAc,YAAAC,GAAY,eAAAC,EAAA,IAAkBC,EAGlDV,CAAc,GACVW,IAAaX,MAAmBK,KAAYI,IAI5C;AAAA,MACJ,KAAKG;AAAA,MACL,gBAAAC;AAAA,MACA,cAAAC;AAAA,MACA,cAAAC;AAAA,IAAA,IACEC,EAAkC,CAACL,CAAU,GAE3CM,IAAaxB,EAAM,KAAK,CAACyB,MAASA,EAAK,QAAQ,KAAKzB,EAAM,CAAC;AAEjE,WACE,gBAAA0B;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAAjB;AAAA,QACA,kBAAe;AAAA,QACf,qBAAmBR;AAAA,QACnB,WAAW,GAAGhB,EAAc,EAAE,UAAAqB,GAAU,MAAAD,EAAA,CAAM,CAAC,GAAGG,IAAY,IAAIA,CAAS,KAAK,EAAE;AAAA,QAKlF,UAAA,gBAAAmB,EAAC,OAAA,EAAI,WAAU,eAIb,UAAA;AAAA,UAAA,gBAAAD,EAAC,OAAA,EAAI,KAAKZ,GAAc,WAAW3B,GAChC,UAAA+B,IACC,gBAAAQ,EAAC,OAAA,EAAI,cAAYxB,GAAW,WAAU,aACpC,UAAA,gBAAAyB,EAACC,EAAa,MAAb,EACC,UAAA;AAAA,YAAA,gBAAAD,EAACC,EAAa,SAAb,EAAqB,WAAWnC,GAC9B,UAAA;AAAA,cAAA+B,KAAA,QAAAA,EAAY,yBACV,QAAA,EAAK,eAAY,QAAO,WAAWjC,GACjC,UAAAiC,EAAW,KAAA,CACd,IACE;AAAA,cACJ,gBAAAE,EAAC,QAAA,EAAK,WAAU,uCACb,iCAAY,OACf;AAAA,cACA,gBAAAA;AAAA,gBAACG;AAAA,gBAAA;AAAA,kBACC,eAAY;AAAA,kBACZ,WAAU;AAAA,gBAAA;AAAA,cAAA;AAAA,YACZ,GACF;AAAA,YACA,gBAAAH;AAAA,cAACE,EAAa;AAAA,cAAb;AAAA,gBACC,OAAM;AAAA,gBACN,WAAU;AAAA,gBAET,UAAA5B,EAAM,IAAI,CAACyB,MACV,gBAAAC;AAAA,kBAACE,EAAa;AAAA,kBAAb;AAAA,oBAEC,eAAaH,EAAK;AAAA,oBAClB,WAAWA,EAAK;AAAA,oBAChB,SACEA,EAAK,WACH,gBAAAC;AAAA,sBAACI;AAAA,sBAAA;AAAA,wBACC,eAAY;AAAA,wBACZ,WAAU;AAAA,sBAAA;AAAA,oBAAA,IAEV;AAAA,oBAEN,gBAAcL,EAAK,WAAW,SAAS;AAAA,oBACvC,UAAU,MAAM;AACd,sBAAIA,EAAK,OACP,OAAO,SAAS,OAAOA,EAAK,IAAI,IAEhCtB,KAAA,QAAAA,EAAWsB,EAAK;AAAA,oBAEpB;AAAA,oBAEC,UAAAA,EAAK;AAAA,kBAAA;AAAA,kBApBDA,EAAK;AAAA,gBAAA,CAsBb;AAAA,cAAA;AAAA,YAAA;AAAA,UACH,EAAA,CACF,GACF,IAEA,gBAAAC;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,KAAKP;AAAA,cACL,mBAAiBC,IAAiB,SAAS;AAAA,cAC3C,iBAAeC,IAAe,SAAS;AAAA,cACvC,WAAWjC;AAAA,cAEX,UAAA,gBAAAsC;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,KAAKX;AAAA,kBACL,cAAYb;AAAA,kBACZ,WAAWb,EAAY,EAAE,MAAAgB,GAAM;AAAA,kBAE9B,UAAAL,EAAM,IAAI,CAACyB,MAAS;AACnB,0BAAMM,IACJ,OAAON,EAAK,cAAe,YAAYA,EAAK,aAAa,IACrDA,EAAK,aACL,QACAO,IAAcP,EAAK,WAAW,SAAS,QACvCQ,IACJ,gBAAAN,EAAAO,GAAA,EACG,UAAA;AAAA,sBAAAT,EAAK,yBACH,QAAA,EAAK,eAAY,QAAO,WAAWlC,GACjC,UAAAkC,EAAK,KAAA,CACR,IACE;AAAA,sBAGJ,gBAAAE,EAAC,QAAA,EAAK,WAAU,6DACd,UAAA;AAAA,wBAAA,gBAAAD,EAAC,QAAA,EAAK,WAAWlC,GAAe,UAAAiC,EAAK,OAAM;AAAA,wBAC1CM,MAAU,SACT,gBAAAL,EAACS,GAAA,EAAM,SAAQ,WACZ,UAAApD,EAAiBgD,CAAK,EAAA,CACzB,IACE;AAAA,sBAAA,EAAA,CACN;AAAA,oBAAA,GACF;AAEF,wBAAIN,EAAK,SAAS,QAAW;AAC3B,4BAAMW,IAAe9C,EAAY,EAAE,MAAAe,GAAM;AAKzC,6BAAID,IAEA,gBAAAsB,EAACQ,GAAA,EACE,UAAA9B,EAAW;AAAA,wBACV,MAAMqB,EAAK;AAAA,wBACX,WAAWW;AAAA,wBACX,UAAUH;AAAA,wBACV,gBAAgBD;AAAA,wBAChB,eAAeP,EAAK;AAAA,wBACpB,SAASA,EAAK;AAAA,sBAAA,CACf,EAAA,GARYA,EAAK,EASpB,IAOF,gBAAAC;AAAA,wBAAC;AAAA,wBAAA;AAAA,0BAEC,MAAMD,EAAK;AAAA,0BACX,eAAaA,EAAK;AAAA,0BAClB,gBAAcO;AAAA,0BACd,WAAWI;AAAA,0BACV,GAAIX,EAAK,UAAU,EAAE,SAASA,EAAK,QAAA,IAAY,CAAA;AAAA,0BAE/C,UAAAQ;AAAA,wBAAA;AAAA,wBAPIR,EAAK;AAAA,sBAAA;AAAA,oBAUhB;AACA,2BACE,gBAAAC;AAAA,sBAAC;AAAA,sBAAA;AAAA,wBAEC,MAAK;AAAA,wBACL,eAAaD,EAAK;AAAA,wBAClB,gBAAcO;AAAA,wBACd,WAAW1C,EAAY,EAAE,MAAAe,GAAM;AAAA,wBAC/B,SAAS,MAAMF,KAAA,gBAAAA,EAAWsB,EAAK;AAAA,wBAE9B,UAAAQ;AAAA,sBAAA;AAAA,sBAPIR,EAAK;AAAA,oBAAA;AAAA,kBAUhB,CAAC;AAAA,gBAAA;AAAA,cAAA;AAAA,YACH;AAAA,UAAA,GAGN;AAAA,UACCL,IACC,gBAAAM;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,MAAK;AAAA,cACL,cAAYhB,EAAE,8BAA8B;AAAA,cAC5C,SAAS,MAAMY,EAAa,EAAE;AAAA,cAC9B,WAAW,GAAG5B,CAAuB,IAAIC,CAA4B;AAAA,cAErE,UAAA,gBAAA+B;AAAA,gBAACW;AAAA,gBAAA;AAAA,kBACC,eAAY;AAAA,kBACZ,WAAWxC;AAAA,gBAAA;AAAA,cAAA;AAAA,YACb;AAAA,UAAA,IAEA;AAAA,UACHwB,IACC,gBAAAK;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,MAAK;AAAA,cACL,cAAYhB,EAAE,iCAAiC;AAAA,cAC/C,SAAS,MAAMY,EAAa,CAAC;AAAA,cAC7B,WAAW,GAAG5B,CAAuB,IAAIE,EAA0B;AAAA,cAEnE,UAAA,gBAAA8B;AAAA,gBAACY;AAAA,gBAAA;AAAA,kBACC,eAAY;AAAA,kBACZ,WAAWzC;AAAA,gBAAA;AAAA,cAAA;AAAA,YACb;AAAA,UAAA,IAEA;AAAA,QAAA,EAAA,CACN;AAAA,MAAA;AAAA,IAAA;AAAA,EAGN;AACF;AACAC,GAAO,cAAc;"}

package/dist/_chunks/{tag-CS5cXpfx.js → tag-DOZGz0fT.js}

@@ -2,7 +2,7 @@ import { jsx as e, jsxs as f } from "react/jsx-runtime";
 import { forwardRef as A, useRef as H, useState as j, useEffect as P } from "react";
 import { c as B } from "./index-D2ZczOXr.js";
 import { useTranslation as U } from "react-i18next";
-import { T as v } from "./tooltip-Cp-PLePW.js";
+import { T as v } from "./tooltip-uEBdD1-5.js";
 import { M as X } from "./menu-row-BAr8bx1I.js";
 import { X as q } from "./x-B5YnXwCz.js";
 const V = B(
@@ -258,4 +258,4 @@ G.displayName = "Tag";
 export {
   G as T
 };
-//# sourceMappingURL=tag-CS5cXpfx.js.map
+//# sourceMappingURL=tag-DOZGz0fT.js.map

package/dist/_chunks/{tag-CS5cXpfx.js.map → tag-DOZGz0fT.js.map}

@@ -1 +1 @@
-{"version":3,"file":"tag-CS5cXpfx.js","sources":["../../src/components/tag/tag.tsx"],"sourcesContent":["import { forwardRef, useRef, useState, useEffect, type ReactNode } from 'react';\nimport { cva } from 'class-variance-authority';\nimport { useTranslation } from 'react-i18next';\nimport { X } from 'lucide-react';\nimport { Tooltip } from '../tooltip';\nimport { MENU_ROW_CHIP } from '../_shared/menu-row';\n\n/* ------------------------------------------------------------------ */\n/* CVA — tag pill                                                       */\n/* ------------------------------------------------------------------ */\n\nconst tagVariants = cva(\n  [\n    'ds:inline-flex ds:items-center ds:gap-[var(--spacing-xs)]',\n    'ds:rounded-[var(--radius-full)]',\n    'type-eyebrow ds:whitespace-nowrap',\n    'ds:transition-colors ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none',\n    'ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid',\n    'ds:focus-visible:outline-[color:var(--ring)] ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)]',\n    'ds:aria-disabled:cursor-not-allowed ds:aria-disabled:opacity-50',\n    'ds:disabled:cursor-not-allowed ds:disabled:opacity-50',\n    // On a lit menu row every tone shows as an outline in the row's ink.\n    MENU_ROW_CHIP,\n  ].join(' '),\n  {\n    variants: {\n      variant: {\n        neutral: '',\n        info: '',\n        success: '',\n        warning: '',\n        error: '',\n        brand: '',\n      },\n      fill: {\n        // Solid chips carry a subtle, theme-aware border (a low-opacity\n        // foreground mix) so they read as a defined chip on any surface, not a\n        // floating fill — works across every colour variant, light and dark.\n        solid:\n          'ds:border ds:border-[color:color-mix(in_srgb,var(--foreground)_15%,transparent)]',\n        outline: 'ds:border ds:border-[color:var(--border)] ds:bg-transparent',\n      },\n      size: {\n        // Symmetric start/end padding — close button uses negative margin to stay flush.\n        // Size is the only eyebrow-role axis that varies per Tag size; weight, transform,\n        // tracking, line-height, and features all come from `.type-eyebrow` on the base.\n        sm: 'ds:h-[calc(var(--spacing)*4)] ds:ps-[var(--spacing-xs)] ds:pe-[var(--spacing-xs)] ds:[--type-eyebrow-size:var(--font-size-2xs)]',\n        md: 'ds:h-[calc(var(--spacing)*5)] ds:ps-[var(--spacing-sm)] ds:pe-[var(--spacing-sm)] ds:[--type-eyebrow-size:var(--font-size-2xs)]',\n        lg: 'ds:h-[calc(var(--spacing)*6)] ds:ps-[var(--spacing-sm)] ds:pe-[var(--spacing-sm)] ds:[--type-eyebrow-size:var(--font-size-xs)]',\n      },\n    },\n    compoundVariants: [\n      // Solid fills — foreground tokens adapt per theme\n      {\n        fill: 'solid',\n        variant: 'neutral',\n        className:\n          'ds:bg-muted/20 ds:text-muted-foreground ds:border-[color:var(--border)]',\n      },\n      {\n        fill: 'solid',\n        variant: 'info',\n        className: 'ds:bg-info ds:text-[color:var(--info-solid-foreground)]',\n      },\n      {\n        fill: 'solid',\n        variant: 'success',\n        className:\n          'ds:bg-success ds:text-[color:var(--success-solid-foreground)]',\n      },\n      {\n        fill: 'solid',\n        variant: 'warning',\n        className: 'ds:bg-warning ds:text-foreground',\n      },\n      {\n        fill: 'solid',\n        variant: 'error',\n        className: 'ds:bg-destructive ds:text-destructive-foreground',\n      },\n      {\n        fill: 'solid',\n        variant: 'brand',\n        className: 'ds:bg-primary ds:text-primary-foreground',\n      },\n      // Outline fills\n      {\n        fill: 'outline',\n        variant: 'neutral',\n        className: 'ds:border-[color:var(--border)] ds:text-muted-foreground',\n      },\n      {\n        fill: 'outline',\n        variant: 'info',\n        className: 'ds:border-info ds:text-[var(--info-foreground)]',\n      },\n      {\n        fill: 'outline',\n        variant: 'success',\n        className: 'ds:border-success ds:text-[var(--success-foreground)]',\n      },\n      {\n        fill: 'outline',\n        variant: 'warning',\n        className: 'ds:border-warning ds:text-[var(--warning-foreground)]',\n      },\n      {\n        fill: 'outline',\n        variant: 'error',\n        className: 'ds:border-destructive ds:text-[var(--error-foreground)]',\n      },\n      {\n        fill: 'outline',\n        variant: 'brand',\n        className: 'ds:border-primary ds:text-primary',\n      },\n    ],\n    defaultVariants: {\n      variant: 'neutral',\n      fill: 'solid',\n      size: 'md',\n    },\n  },\n);\n\n/* ------------------------------------------------------------------ */\n/* CVA — close button                                                   */\n/* ------------------------------------------------------------------ */\n\nconst closeButtonVariants = cva(\n  [\n    'ds:inline-flex ds:items-center ds:justify-center ds:shrink-0 ds:rounded-full',\n    // Negative end margin keeps the button flush with the pill edge\n    'ds:-me-[var(--spacing-xs)]',\n    'ds:hover:bg-foreground/10',\n    'ds:transition-colors ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none',\n    'ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid',\n    'ds:focus-visible:outline-[color:var(--ring)] ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)]',\n    'ds:disabled:cursor-not-allowed ds:disabled:opacity-50',\n  ].join(' '),\n  {\n    variants: {\n      size: {\n        sm: 'ds:p-1 ds:[&>svg]:size-3',\n        md: 'ds:p-1 ds:[&>svg]:size-3.5',\n        lg: 'ds:p-1.5 ds:[&>svg]:size-4',\n      },\n    },\n    defaultVariants: { size: 'md' },\n  },\n);\n\n/* ------------------------------------------------------------------ */\n/* TagProps                                                             */\n/* ------------------------------------------------------------------ */\n\nexport interface TagProps {\n  /** The visible label text */\n  label: string;\n  /** Semantic colour variant */\n  variant?: 'neutral' | 'info' | 'success' | 'warning' | 'error' | 'brand';\n  /** Visual fill style */\n  fill?: 'solid' | 'outline';\n  /** Size */\n  size?: 'sm' | 'md' | 'lg';\n  /** Leading slot — icon element or dot */\n  leading?: ReactNode;\n  /** Called when the tag is removed (enables close button + Backspace/Delete) */\n  onRemove?: () => void;\n  /** Called when the tag is clicked (non-removable interactive tag) */\n  onClick?: () => void;\n  /** Disabled state */\n  disabled?: boolean;\n  /** Max inline size before truncation with tooltip — default 'none' */\n  maxInlineSize?: string | 'none';\n  /** Additional class names */\n  className?: string;\n}\n\n/* ------------------------------------------------------------------ */\n/* Tag                                                                  */\n/* ------------------------------------------------------------------ */\n\nexport const Tag = forwardRef<HTMLElement, TagProps>(\n  (\n    {\n      label,\n      variant = 'neutral',\n      fill = 'solid',\n      size = 'md',\n      leading,\n      onRemove,\n      onClick,\n      disabled = false,\n      maxInlineSize = 'none',\n      className,\n    },\n    ref,\n  ) => {\n    const { t } = useTranslation('ui');\n    const labelRef = useRef<HTMLSpanElement>(null);\n    const [isOverflowing, setIsOverflowing] = useState(false);\n    const [announcement, setAnnouncement] = useState('');\n\n    useEffect(() => {\n      const el = labelRef.current;\n      if (!el || maxInlineSize === 'none') return;\n\n      const check = () => setIsOverflowing(el.scrollWidth > el.clientWidth);\n      const observer = new ResizeObserver(check);\n      observer.observe(el);\n      check();\n      return () => observer.disconnect();\n    }, [maxInlineSize]);\n\n    const handleKeyDown = (e: React.KeyboardEvent) => {\n      if (\n        (e.key === 'Backspace' || e.key === 'Delete') &&\n        onRemove &&\n        !disabled\n      ) {\n        e.preventDefault();\n        announce();\n        // Delay gives the live region one render cycle before unmount\n        setTimeout(onRemove, 100);\n      }\n    };\n\n    const announce = () => {\n      setAnnouncement(t('tag.removed', { label }));\n    };\n\n    const handleRemove = () => {\n      if (!disabled && onRemove) {\n        announce();\n        setTimeout(onRemove, 100);\n      }\n    };\n\n    const isRemovable = !!onRemove;\n    const isClickable = !!onClick && !isRemovable;\n\n    const rootClasses = tagVariants({\n      variant,\n      fill,\n      size,\n      className: [\n        isClickable && !disabled\n          ? 'ds:hover:brightness-90 ds:cursor-pointer'\n          : '',\n        className ?? '',\n      ]\n        .filter(Boolean)\n        .join(' '),\n    });\n\n    const leadingEl = leading ? (\n      <span\n        aria-hidden=\"true\"\n        className=\"ds:shrink-0 ds:inline-flex ds:items-center ds:[&>svg]:size-3.5\"\n      >\n        {leading}\n      </span>\n    ) : null;\n\n    // Consumer-controlled layout constraint — not a design token.\n    // maxInlineSize is an arbitrary caller-supplied value that cannot be expressed\n    // as a static Tailwind class; the style prop is the only cross-browser option.\n    const labelEl = (\n      <span\n        ref={labelRef}\n        className={\n          maxInlineSize !== 'none'\n            ? 'ds:overflow-hidden ds:text-ellipsis ds:whitespace-nowrap'\n            : undefined\n        }\n        // eslint-disable-next-line react/forbid-dom-props -- caller-supplied maxInlineSize, runtime-computed\n        style={maxInlineSize !== 'none' ? { maxInlineSize } : undefined}\n      >\n        {label}\n      </span>\n    );\n\n    // Live region — only for removable tags; must be a sibling outside the button.\n    const liveRegion = (\n      <span role=\"status\" aria-live=\"polite\" className=\"ds:sr-only\">\n        {announcement}\n      </span>\n    );\n\n    const closeButton = isRemovable ? (\n      <button\n        type=\"button\"\n        aria-label={t('tag.remove', { label })}\n        onClick={handleRemove}\n        disabled={disabled}\n        // Intentionally excluded from tab order: Backspace/Delete on the focused\n        // group element provides the same keyboard action.\n        tabIndex={-1}\n        className={closeButtonVariants({ size })}\n      >\n        <X aria-hidden=\"true\" />\n      </button>\n    ) : null;\n\n    const shouldWrapTooltip = maxInlineSize !== 'none' && isOverflowing;\n\n    // Clickable tag — renders as <button>; live region is a sibling, not inside button\n    if (isClickable) {\n      const tagEl = (\n        <button\n          ref={ref as React.Ref<HTMLButtonElement>}\n          type=\"button\"\n          onClick={!disabled ? onClick : undefined}\n          disabled={disabled}\n          data-component=\"tag\"\n          className={rootClasses}\n        >\n          {leadingEl}\n          {labelEl}\n        </button>\n      );\n      return shouldWrapTooltip ? (\n        <Tooltip label={label}>{tagEl}</Tooltip>\n      ) : (\n        tagEl\n      );\n    }\n\n    // Removable tag — focusable <span> with embedded close button\n    if (isRemovable) {\n      const tagEl = (\n        // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions -- removable tag is focusable as a group; Backspace/Delete keyboard removal handled via onKeyDown\n        <span\n          ref={ref as React.Ref<HTMLSpanElement>}\n          role=\"group\"\n          aria-label={label}\n          tabIndex={disabled ? -1 : 0}\n          aria-disabled={disabled || undefined}\n          onKeyDown={handleKeyDown}\n          data-component=\"tag\"\n          className={rootClasses}\n        >\n          {liveRegion}\n          {leadingEl}\n          {labelEl}\n          {closeButton}\n        </span>\n      );\n      return shouldWrapTooltip ? (\n        <Tooltip label={label}>{tagEl}</Tooltip>\n      ) : (\n        tagEl\n      );\n    }\n\n    // Decorative tag — plain <span>, no interactive role\n    const tagEl = (\n      <span\n        ref={ref as React.Ref<HTMLSpanElement>}\n        data-component=\"tag\"\n        className={tagVariants({ variant, fill, size, className })}\n      >\n        {leadingEl}\n        {labelEl}\n      </span>\n    );\n    return shouldWrapTooltip ? <Tooltip label={label}>{tagEl}</Tooltip> : tagEl;\n  },\n);\n\nTag.displayName = 'Tag';\n"],"names":["tagVariants","cva","MENU_ROW_CHIP","closeButtonVariants","Tag","forwardRef","label","variant","fill","size","leading","onRemove","onClick","disabled","maxInlineSize","className","ref","t","useTranslation","labelRef","useRef","isOverflowing","setIsOverflowing","useState","announcement","setAnnouncement","useEffect","el","check","observer","handleKeyDown","e","announce","handleRemove","isRemovable","isClickable","rootClasses","leadingEl","jsx","labelEl","liveRegion","closeButton","X","shouldWrapTooltip","tagEl","jsxs","Tooltip"],"mappings":"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"}
+{"version":3,"file":"tag-DOZGz0fT.js","sources":["../../src/components/tag/tag.tsx"],"sourcesContent":["import { forwardRef, useRef, useState, useEffect, type ReactNode } from 'react';\nimport { cva } from 'class-variance-authority';\nimport { useTranslation } from 'react-i18next';\nimport { X } from 'lucide-react';\nimport { Tooltip } from '../tooltip';\nimport { MENU_ROW_CHIP } from '../_shared/menu-row';\n\n/* ------------------------------------------------------------------ */\n/* CVA — tag pill                                                       */\n/* ------------------------------------------------------------------ */\n\nconst tagVariants = cva(\n  [\n    'ds:inline-flex ds:items-center ds:gap-[var(--spacing-xs)]',\n    'ds:rounded-[var(--radius-full)]',\n    'type-eyebrow ds:whitespace-nowrap',\n    'ds:transition-colors ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none',\n    'ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid',\n    'ds:focus-visible:outline-[color:var(--ring)] ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)]',\n    'ds:aria-disabled:cursor-not-allowed ds:aria-disabled:opacity-50',\n    'ds:disabled:cursor-not-allowed ds:disabled:opacity-50',\n    // On a lit menu row every tone shows as an outline in the row's ink.\n    MENU_ROW_CHIP,\n  ].join(' '),\n  {\n    variants: {\n      variant: {\n        neutral: '',\n        info: '',\n        success: '',\n        warning: '',\n        error: '',\n        brand: '',\n      },\n      fill: {\n        // Solid chips carry a subtle, theme-aware border (a low-opacity\n        // foreground mix) so they read as a defined chip on any surface, not a\n        // floating fill — works across every colour variant, light and dark.\n        solid:\n          'ds:border ds:border-[color:color-mix(in_srgb,var(--foreground)_15%,transparent)]',\n        outline: 'ds:border ds:border-[color:var(--border)] ds:bg-transparent',\n      },\n      size: {\n        // Symmetric start/end padding — close button uses negative margin to stay flush.\n        // Size is the only eyebrow-role axis that varies per Tag size; weight, transform,\n        // tracking, line-height, and features all come from `.type-eyebrow` on the base.\n        sm: 'ds:h-[calc(var(--spacing)*4)] ds:ps-[var(--spacing-xs)] ds:pe-[var(--spacing-xs)] ds:[--type-eyebrow-size:var(--font-size-2xs)]',\n        md: 'ds:h-[calc(var(--spacing)*5)] ds:ps-[var(--spacing-sm)] ds:pe-[var(--spacing-sm)] ds:[--type-eyebrow-size:var(--font-size-2xs)]',\n        lg: 'ds:h-[calc(var(--spacing)*6)] ds:ps-[var(--spacing-sm)] ds:pe-[var(--spacing-sm)] ds:[--type-eyebrow-size:var(--font-size-xs)]',\n      },\n    },\n    compoundVariants: [\n      // Solid fills — foreground tokens adapt per theme\n      {\n        fill: 'solid',\n        variant: 'neutral',\n        className:\n          'ds:bg-muted/20 ds:text-muted-foreground ds:border-[color:var(--border)]',\n      },\n      {\n        fill: 'solid',\n        variant: 'info',\n        className: 'ds:bg-info ds:text-[color:var(--info-solid-foreground)]',\n      },\n      {\n        fill: 'solid',\n        variant: 'success',\n        className:\n          'ds:bg-success ds:text-[color:var(--success-solid-foreground)]',\n      },\n      {\n        fill: 'solid',\n        variant: 'warning',\n        className: 'ds:bg-warning ds:text-foreground',\n      },\n      {\n        fill: 'solid',\n        variant: 'error',\n        className: 'ds:bg-destructive ds:text-destructive-foreground',\n      },\n      {\n        fill: 'solid',\n        variant: 'brand',\n        className: 'ds:bg-primary ds:text-primary-foreground',\n      },\n      // Outline fills\n      {\n        fill: 'outline',\n        variant: 'neutral',\n        className: 'ds:border-[color:var(--border)] ds:text-muted-foreground',\n      },\n      {\n        fill: 'outline',\n        variant: 'info',\n        className: 'ds:border-info ds:text-[var(--info-foreground)]',\n      },\n      {\n        fill: 'outline',\n        variant: 'success',\n        className: 'ds:border-success ds:text-[var(--success-foreground)]',\n      },\n      {\n        fill: 'outline',\n        variant: 'warning',\n        className: 'ds:border-warning ds:text-[var(--warning-foreground)]',\n      },\n      {\n        fill: 'outline',\n        variant: 'error',\n        className: 'ds:border-destructive ds:text-[var(--error-foreground)]',\n      },\n      {\n        fill: 'outline',\n        variant: 'brand',\n        className: 'ds:border-primary ds:text-primary',\n      },\n    ],\n    defaultVariants: {\n      variant: 'neutral',\n      fill: 'solid',\n      size: 'md',\n    },\n  },\n);\n\n/* ------------------------------------------------------------------ */\n/* CVA — close button                                                   */\n/* ------------------------------------------------------------------ */\n\nconst closeButtonVariants = cva(\n  [\n    'ds:inline-flex ds:items-center ds:justify-center ds:shrink-0 ds:rounded-full',\n    // Negative end margin keeps the button flush with the pill edge\n    'ds:-me-[var(--spacing-xs)]',\n    'ds:hover:bg-foreground/10',\n    'ds:transition-colors ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none',\n    'ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid',\n    'ds:focus-visible:outline-[color:var(--ring)] ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)]',\n    'ds:disabled:cursor-not-allowed ds:disabled:opacity-50',\n  ].join(' '),\n  {\n    variants: {\n      size: {\n        sm: 'ds:p-1 ds:[&>svg]:size-3',\n        md: 'ds:p-1 ds:[&>svg]:size-3.5',\n        lg: 'ds:p-1.5 ds:[&>svg]:size-4',\n      },\n    },\n    defaultVariants: { size: 'md' },\n  },\n);\n\n/* ------------------------------------------------------------------ */\n/* TagProps                                                             */\n/* ------------------------------------------------------------------ */\n\nexport interface TagProps {\n  /** The visible label text */\n  label: string;\n  /** Semantic colour variant */\n  variant?: 'neutral' | 'info' | 'success' | 'warning' | 'error' | 'brand';\n  /** Visual fill style */\n  fill?: 'solid' | 'outline';\n  /** Size */\n  size?: 'sm' | 'md' | 'lg';\n  /** Leading slot — icon element or dot */\n  leading?: ReactNode;\n  /** Called when the tag is removed (enables close button + Backspace/Delete) */\n  onRemove?: () => void;\n  /** Called when the tag is clicked (non-removable interactive tag) */\n  onClick?: () => void;\n  /** Disabled state */\n  disabled?: boolean;\n  /** Max inline size before truncation with tooltip — default 'none' */\n  maxInlineSize?: string | 'none';\n  /** Additional class names */\n  className?: string;\n}\n\n/* ------------------------------------------------------------------ */\n/* Tag                                                                  */\n/* ------------------------------------------------------------------ */\n\nexport const Tag = forwardRef<HTMLElement, TagProps>(\n  (\n    {\n      label,\n      variant = 'neutral',\n      fill = 'solid',\n      size = 'md',\n      leading,\n      onRemove,\n      onClick,\n      disabled = false,\n      maxInlineSize = 'none',\n      className,\n    },\n    ref,\n  ) => {\n    const { t } = useTranslation('ui');\n    const labelRef = useRef<HTMLSpanElement>(null);\n    const [isOverflowing, setIsOverflowing] = useState(false);\n    const [announcement, setAnnouncement] = useState('');\n\n    useEffect(() => {\n      const el = labelRef.current;\n      if (!el || maxInlineSize === 'none') return;\n\n      const check = () => setIsOverflowing(el.scrollWidth > el.clientWidth);\n      const observer = new ResizeObserver(check);\n      observer.observe(el);\n      check();\n      return () => observer.disconnect();\n    }, [maxInlineSize]);\n\n    const handleKeyDown = (e: React.KeyboardEvent) => {\n      if (\n        (e.key === 'Backspace' || e.key === 'Delete') &&\n        onRemove &&\n        !disabled\n      ) {\n        e.preventDefault();\n        announce();\n        // Delay gives the live region one render cycle before unmount\n        setTimeout(onRemove, 100);\n      }\n    };\n\n    const announce = () => {\n      setAnnouncement(t('tag.removed', { label }));\n    };\n\n    const handleRemove = () => {\n      if (!disabled && onRemove) {\n        announce();\n        setTimeout(onRemove, 100);\n      }\n    };\n\n    const isRemovable = !!onRemove;\n    const isClickable = !!onClick && !isRemovable;\n\n    const rootClasses = tagVariants({\n      variant,\n      fill,\n      size,\n      className: [\n        isClickable && !disabled\n          ? 'ds:hover:brightness-90 ds:cursor-pointer'\n          : '',\n        className ?? '',\n      ]\n        .filter(Boolean)\n        .join(' '),\n    });\n\n    const leadingEl = leading ? (\n      <span\n        aria-hidden=\"true\"\n        className=\"ds:shrink-0 ds:inline-flex ds:items-center ds:[&>svg]:size-3.5\"\n      >\n        {leading}\n      </span>\n    ) : null;\n\n    // Consumer-controlled layout constraint — not a design token.\n    // maxInlineSize is an arbitrary caller-supplied value that cannot be expressed\n    // as a static Tailwind class; the style prop is the only cross-browser option.\n    const labelEl = (\n      <span\n        ref={labelRef}\n        className={\n          maxInlineSize !== 'none'\n            ? 'ds:overflow-hidden ds:text-ellipsis ds:whitespace-nowrap'\n            : undefined\n        }\n        // eslint-disable-next-line react/forbid-dom-props -- caller-supplied maxInlineSize, runtime-computed\n        style={maxInlineSize !== 'none' ? { maxInlineSize } : undefined}\n      >\n        {label}\n      </span>\n    );\n\n    // Live region — only for removable tags; must be a sibling outside the button.\n    const liveRegion = (\n      <span role=\"status\" aria-live=\"polite\" className=\"ds:sr-only\">\n        {announcement}\n      </span>\n    );\n\n    const closeButton = isRemovable ? (\n      <button\n        type=\"button\"\n        aria-label={t('tag.remove', { label })}\n        onClick={handleRemove}\n        disabled={disabled}\n        // Intentionally excluded from tab order: Backspace/Delete on the focused\n        // group element provides the same keyboard action.\n        tabIndex={-1}\n        className={closeButtonVariants({ size })}\n      >\n        <X aria-hidden=\"true\" />\n      </button>\n    ) : null;\n\n    const shouldWrapTooltip = maxInlineSize !== 'none' && isOverflowing;\n\n    // Clickable tag — renders as <button>; live region is a sibling, not inside button\n    if (isClickable) {\n      const tagEl = (\n        <button\n          ref={ref as React.Ref<HTMLButtonElement>}\n          type=\"button\"\n          onClick={!disabled ? onClick : undefined}\n          disabled={disabled}\n          data-component=\"tag\"\n          className={rootClasses}\n        >\n          {leadingEl}\n          {labelEl}\n        </button>\n      );\n      return shouldWrapTooltip ? (\n        <Tooltip label={label}>{tagEl}</Tooltip>\n      ) : (\n        tagEl\n      );\n    }\n\n    // Removable tag — focusable <span> with embedded close button\n    if (isRemovable) {\n      const tagEl = (\n        // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions -- removable tag is focusable as a group; Backspace/Delete keyboard removal handled via onKeyDown\n        <span\n          ref={ref as React.Ref<HTMLSpanElement>}\n          role=\"group\"\n          aria-label={label}\n          tabIndex={disabled ? -1 : 0}\n          aria-disabled={disabled || undefined}\n          onKeyDown={handleKeyDown}\n          data-component=\"tag\"\n          className={rootClasses}\n        >\n          {liveRegion}\n          {leadingEl}\n          {labelEl}\n          {closeButton}\n        </span>\n      );\n      return shouldWrapTooltip ? (\n        <Tooltip label={label}>{tagEl}</Tooltip>\n      ) : (\n        tagEl\n      );\n    }\n\n    // Decorative tag — plain <span>, no interactive role\n    const tagEl = (\n      <span\n        ref={ref as React.Ref<HTMLSpanElement>}\n        data-component=\"tag\"\n        className={tagVariants({ variant, fill, size, className })}\n      >\n        {leadingEl}\n        {labelEl}\n      </span>\n    );\n    return shouldWrapTooltip ? <Tooltip label={label}>{tagEl}</Tooltip> : tagEl;\n  },\n);\n\nTag.displayName = 'Tag';\n"],"names":["tagVariants","cva","MENU_ROW_CHIP","closeButtonVariants","Tag","forwardRef","label","variant","fill","size","leading","onRemove","onClick","disabled","maxInlineSize","className","ref","t","useTranslation","labelRef","useRef","isOverflowing","setIsOverflowing","useState","announcement","setAnnouncement","useEffect","el","check","observer","handleKeyDown","e","announce","handleRemove","isRemovable","isClickable","rootClasses","leadingEl","jsx","labelEl","liveRegion","closeButton","X","shouldWrapTooltip","tagEl","jsxs","Tooltip"],"mappings":"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"}

package/dist/_chunks/{task-card-zaTU1rQa.js → task-card-BS7Uqevr.js}

@@ -3,7 +3,7 @@ import { forwardRef as C } from "react";
 import { c as w } from "./index-D2ZczOXr.js";
 import { useTranslation as T } from "react-i18next";
 import { V as p } from "./visually-hidden-BHxEUGyT.js";
-import { p as z } from "./privacy-mask-BfMC57ST.js";
+import { p as z } from "./privacy-mask-Ch7743uk.js";
 import { c as S } from "./createLucideIcon-DhHxpK9K.js";
 import { B as V } from "./building-2-D33bLCWL.js";
 import { U as g } from "./user-B12p7bVF.js";
@@ -187,4 +187,4 @@ export {
   O as T,
   q as i
 };
-//# sourceMappingURL=task-card-zaTU1rQa.js.map
+//# sourceMappingURL=task-card-BS7Uqevr.js.map

package/dist/_chunks/{task-card-zaTU1rQa.js.map → task-card-BS7Uqevr.js.map}

@@ -1 +1 @@
-{"version":3,"file":"task-card-zaTU1rQa.js","sources":["../../node_modules/lucide-react/dist/esm/icons/briefcase.mjs","../../src/components/task-card/task-card.tsx"],"sourcesContent":["/**\n * @license lucide-react v1.22.0 - ISC\n *\n * This source code is licensed under the ISC license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nimport createLucideIcon from '../createLucideIcon.mjs';\n\nconst __iconNode = [\n  [\"path\", { d: \"M16 20V4a2 2 0 0 0-2-2h-4a2 2 0 0 0-2 2v16\", key: \"jecpp\" }],\n  [\"rect\", { width: \"20\", height: \"14\", x: \"2\", y: \"6\", rx: \"2\", key: \"i6l2r4\" }]\n];\nconst Briefcase = createLucideIcon(\"briefcase\", __iconNode);\n\nexport { __iconNode, Briefcase as default };\n//# sourceMappingURL=briefcase.mjs.map\n","import { forwardRef, type HTMLAttributes, type ReactNode } from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { useTranslation } from 'react-i18next';\nimport {\n  CircleAlert,\n  Briefcase,\n  Building2,\n  SquareCheckBig,\n  ChevronRight,\n  EyeOff,\n  Square,\n  User,\n} from 'lucide-react';\nimport { VisuallyHidden } from '../visually-hidden';\nimport { privacyMask } from '../_shared/privacy-mask';\n\n/* ------------------------------------------------------------------ */\n/* Types                                                               */\n/* ------------------------------------------------------------------ */\n\nexport type TaskStatus = 'open' | 'in-progress' | 'done';\nexport type TaskPriority = 'low' | 'normal' | 'high';\n\n/** Which entity the task links to. The platform `DoctorReminder` links to exactly one of these (or none). */\nexport type TaskLinkType = 'patient' | 'company' | 'operator';\n\n/** Linked-entity glyph — patient (person), company (building), operator (briefcase). */\nconst LINK_ICON: Record<TaskLinkType, typeof User> = {\n  patient: User,\n  company: Building2,\n  operator: Briefcase,\n};\n\nexport interface TaskItem {\n  /** Unique identifier for the task. */\n  id: string;\n  /** Title — single line, primary content. */\n  title: string;\n  /** Optional secondary line (e.g. \"Patient A · Due today\"). */\n  description?: string;\n  /**\n   * Localised due-date hint (e.g. \"Due today\" / \"Tomorrow\"). Rendered as a\n   * trailing eyebrow chip when set; consumers compute the bucket and pass\n   * the localised string.\n   */\n  dueLabel?: string;\n  /**\n   * Linked-entity NAME (the patient / company / operator the task points at) —\n   * e.g. \"Mario Rossi\". When `linkType` is set the card renders it as a typed\n   * chip (a per-type glyph + an accessible \"Patient/Company/Operator:\" prefix);\n   * otherwise it renders as a plain eyebrow line. The consumer composes the\n   * name only — no prefix.\n   */\n  linkedLabel?: string;\n  /** Type of the linked entity — drives the leading glyph + the accessible prefix on the linked chip. */\n  linkType?: TaskLinkType;\n  /**\n   * The linked name is a privacy mask. The chip shows an EyeOff glyph, then a\n   * visually hidden \"Patient name hidden\", then the mask marked aria-hidden:\n   * `linkedLabel`, or the kit's bullets when the host sends none. It replaces\n   * the \"Patient:\" prefix.\n   */\n  linkedLabelMasked?: boolean;\n  /** Localised assignee display name (host-composed, e.g. \"Dr. Alfa\"). Renders an assignee chip on the meta line. */\n  assigneeLabel?: string;\n  /** Free-text note attached to the task — muted body line, clamped. */\n  note?: string;\n  /** Lifecycle state — drives the leading icon. */\n  status?: TaskStatus;\n  /** Priority — `high` colours the leading icon as `--destructive`. */\n  priority?: TaskPriority;\n  /** Optional deep link — when present the row is an anchor. */\n  url?: string;\n}\n\nexport interface TaskCardProps\n  extends\n    Omit<HTMLAttributes<HTMLDivElement>, 'onClick' | 'role' | 'title'>,\n    VariantProps<typeof taskCardVariants> {\n  /** The task to render. */\n  item: TaskItem;\n  /** Visual density. `xs` is the compact rail row (Control Room); `sm`/`md` for in-page lists. */\n  size?: 'xs' | 'sm' | 'md';\n  /** Fires when the row is activated (click / Enter / Space). */\n  onActivate?: (item: TaskItem) => void;\n  /**\n   * Trailing per-row action toolbar (icon buttons: schedule, edit, …).\n   * Rendered above the stretched-link overlay so the controls stay\n   * clickable inside an interactive row.\n   */\n  actions?: ReactNode;\n  /**\n   * Replaces the leading status glyph. Pass a control (the done checkbox)\n   * when the row can be completed in place: the glyph alone only reports\n   * status, and rendering both a glyph and a matching toggle elsewhere in\n   * the row shows the same mark twice, of which only one does anything.\n   * Rendered above the stretched-link overlay so it stays clickable.\n   */\n  leading?: ReactNode;\n}\n\n/* ------------------------------------------------------------------ */\n/* CVA                                                                 */\n/* ------------------------------------------------------------------ */\n\nconst taskCardVariants = cva(\n  [\n    'ds:relative ds:flex ds:items-start ds:gap-[var(--spacing-sm)]',\n    // Same corner as the elevated Card the note and appointment rows use.\n    'ds:rounded-[var(--radius-lg)]',\n    'ds:transition-colors',\n    'ds:motion-reduce:transition-none',\n    'ds:text-start ds:group',\n    'ds:[:where(&)]:border-[length:var(--surface-border-width,var(--border-width-sm))] ds:border-[color:var(--card-border)]',\n    'ds:forced-colors:border ds:forced-colors:border-[CanvasText]',\n  ].join(' '),\n  {\n    variants: {\n      size: {\n        xs: 'ds:p-[var(--spacing-xs)]',\n        sm: 'ds:p-[var(--spacing-sm)]',\n        md: 'ds:p-[var(--spacing-md)]',\n      },\n      interactive: {\n        true: 'ds:hover:bg-[color:var(--muted)]/40 ds:cursor-pointer',\n        false: '',\n      },\n    },\n    defaultVariants: {\n      size: 'sm',\n      interactive: false,\n    },\n  },\n);\n\n/* The activator keeps a box of its own (display: contents cannot take\n   focus in Chromium); its ::after still stretches over the card. */\nconst stretchedLinkClass = [\n  'ds:focus-visible:outline-none',\n  \"ds:after:content-[''] ds:after:absolute ds:after:inset-0 ds:after:rounded-[var(--radius-lg)]\",\n  'ds:after:pointer-events-auto',\n  'ds:focus-visible:after:outline-[length:var(--focus-ring-width)]',\n  'ds:focus-visible:after:outline-solid',\n  'ds:focus-visible:after:outline-[color:var(--ring)]',\n  'ds:focus-visible:after:outline-offset-[length:var(--focus-ring-offset)]',\n  'ds:forced-colors:focus-visible:after:outline-[CanvasText]',\n].join(' ');\n\n/* ------------------------------------------------------------------ */\n/* Helpers                                                             */\n/* ------------------------------------------------------------------ */\n\nexport function isSafeTaskUrl(url: string): boolean {\n  return /^(https?:\\/\\/(?!\\/)|\\/(?!\\/)|#)/.test(url);\n}\n\nfunction StatusIcon({\n  status,\n  priority,\n}: {\n  status?: TaskStatus;\n  priority?: TaskPriority;\n}): ReactNode {\n  const tone =\n    priority === 'high'\n      ? 'ds:text-[color:var(--destructive)]'\n      : 'ds:text-[color:var(--muted-foreground)]';\n  if (status === 'done') {\n    return (\n      <SquareCheckBig aria-hidden=\"true\" className={`ds:size-4 ${tone}`} />\n    );\n  }\n  if (priority === 'high') {\n    return <CircleAlert aria-hidden=\"true\" className={`ds:size-4 ${tone}`} />;\n  }\n  return <Square aria-hidden=\"true\" className={`ds:size-4 ${tone}`} />;\n}\n\n/* ------------------------------------------------------------------ */\n/* Component                                                           */\n/* ------------------------------------------------------------------ */\n\nexport const TaskCard = forwardRef<HTMLDivElement, TaskCardProps>(\n  (\n    { item, size = 'sm', onActivate, actions, leading, className, ...rest },\n    ref,\n  ) => {\n    const { t } = useTranslation('ui');\n    const interactive = !!onActivate;\n    const hasSafeUrl = !!item.url && isSafeTaskUrl(item.url);\n    const ariaLabel = t('taskCard.itemLabel', {\n      title: item.title,\n      due: item.dueLabel ?? '',\n      defaultValue: '{{title}}{{due, prepend, \" · \"}}',\n    });\n\n    // Static key lookups so the i18n coverage gate sees each literal key.\n    const linkTypeLabels: Record<TaskLinkType, string> = {\n      patient: t('taskCard.link.patient'),\n      company: t('taskCard.link.company'),\n      operator: t('taskCard.link.operator'),\n    };\n    const LinkIcon = item.linkType ? LINK_ICON[item.linkType] : null;\n    // A masked name always gets the chip, so it can say what is hidden,\n    // even when the host sends no mask of its own.\n    const masked = !!item.linkedLabelMasked;\n    // The meta row carries icon-led chips: a typed linked entity + an assignee.\n    const showLinkChip = masked || (!!item.linkType && !!item.linkedLabel);\n    const hasMetaRow = showLinkChip || !!item.assigneeLabel;\n\n    const titleNode = (\n      <span className=\"ds:flex-1 ds:min-w-0 ds:truncate type-body-sm ds:text-[color:var(--foreground)]\">\n        {item.title}\n      </span>\n    );\n\n    let activator: ReactNode;\n    if (interactive && hasSafeUrl) {\n      activator = (\n        <a\n          href={item.url}\n          aria-label={ariaLabel}\n          data-action=\"open-task\"\n          className={stretchedLinkClass + ' ds:flex ds:min-w-0'}\n          onClick={(e) => {\n            if (e.defaultPrevented || e.metaKey || e.ctrlKey || e.shiftKey)\n              return;\n            onActivate?.(item);\n          }}\n        >\n          {titleNode}\n        </a>\n      );\n    } else if (interactive) {\n      activator = (\n        <button\n          type=\"button\"\n          aria-label={ariaLabel}\n          data-action=\"open-task\"\n          className={\n            stretchedLinkClass +\n            ' ds:flex ds:min-w-0 ds:bg-transparent ds:border-0 ds:p-0 ds:text-start'\n          }\n          onClick={() => onActivate?.(item)}\n        >\n          {titleNode}\n        </button>\n      );\n    } else {\n      activator = titleNode;\n    }\n\n    return (\n      <div\n        ref={ref}\n        role=\"listitem\"\n        data-component=\"task-card\"\n        data-component-id={item.id}\n        data-status={item.status ?? 'open'}\n        data-priority={item.priority ?? 'normal'}\n        className={taskCardVariants({ size, interactive, className })}\n        {...rest}\n      >\n        <span className=\"ds:relative ds:z-[1] ds:mt-[var(--spacing-2xs)] ds:shrink-0\">\n          {leading ?? (\n            <StatusIcon status={item.status} priority={item.priority} />\n          )}\n        </span>\n\n        <div className=\"ds:flex-1 ds:min-w-0 ds:flex ds:flex-col ds:gap-[var(--spacing-2xs)]\">\n          {activator}\n          {item.description ? (\n            <span className=\"type-body-sm ds:text-[color:var(--muted-foreground)] ds:truncate\">\n              {item.description}\n            </span>\n          ) : null}\n          {item.note ? (\n            <span className=\"type-body-sm ds:text-[color:var(--muted-foreground)] ds:line-clamp-2\">\n              {item.note}\n            </span>\n          ) : null}\n          {hasMetaRow ? (\n            // `type-meta` (not `type-eyebrow`): these chips carry proper-noun\n            // values (patient / company / operator name, assignee) that must\n            // not be uppercased. Icons are decorative; the type word is exposed\n            // to AT via a VisuallyHidden prefix so each chip reads e.g.\n            // \"Patient: Mario Rossi\" / \"Assignee: Dr. Alfa\".\n            <div className=\"type-meta ds:flex ds:flex-wrap ds:items-center ds:gap-x-[var(--spacing-sm)] ds:gap-y-[var(--spacing-2xs)] ds:text-[color:var(--muted-foreground)]\">\n              {masked ? (\n                // The mask is visual noise to a screen reader, so it hears\n                // what the mask stands for instead.\n                <span className=\"ds:inline-flex ds:min-w-0 ds:items-center ds:gap-[var(--spacing-2xs)]\">\n                  <EyeOff\n                    aria-hidden=\"true\"\n                    className=\"ds:size-3 ds:shrink-0\"\n                  />\n                  <VisuallyHidden>\n                    {t('appointmentPeek.hiddenName')}\n                  </VisuallyHidden>\n                  <span aria-hidden=\"true\" className=\"ds:truncate\">\n                    {privacyMask(item.linkedLabel)}\n                  </span>\n                </span>\n              ) : item.linkType && item.linkedLabel && LinkIcon ? (\n                <span className=\"ds:inline-flex ds:min-w-0 ds:items-center ds:gap-[var(--spacing-2xs)]\">\n                  <LinkIcon\n                    aria-hidden=\"true\"\n                    className=\"ds:size-3 ds:shrink-0\"\n                  />\n                  <VisuallyHidden>{`${linkTypeLabels[item.linkType]}: `}</VisuallyHidden>\n                  <span className=\"ds:truncate\">{item.linkedLabel}</span>\n                </span>\n              ) : null}\n              {item.assigneeLabel ? (\n                <span className=\"ds:inline-flex ds:min-w-0 ds:items-center ds:gap-[var(--spacing-2xs)]\">\n                  <User aria-hidden=\"true\" className=\"ds:size-3 ds:shrink-0\" />\n                  <VisuallyHidden>{`${t('taskCard.assignee')}: `}</VisuallyHidden>\n                  <span className=\"ds:truncate\">{item.assigneeLabel}</span>\n                </span>\n              ) : null}\n            </div>\n          ) : null}\n          {item.linkedLabel && !item.linkType && !masked ? (\n            <span className=\"type-eyebrow ds:text-[color:var(--muted-foreground)] ds:truncate\">\n              {item.linkedLabel}\n            </span>\n          ) : null}\n          {item.dueLabel ? (\n            <span className=\"type-eyebrow ds:text-[color:var(--muted-foreground)]\">\n              {item.dueLabel}\n            </span>\n          ) : null}\n        </div>\n\n        {actions ? (\n          // Above the stretched-link overlay so the buttons stay clickable.\n          <span className=\"ds:relative ds:z-[1] ds:flex ds:items-center ds:gap-[var(--spacing-2xs)] ds:shrink-0\">\n            {actions}\n          </span>\n        ) : null}\n\n        {interactive ? (\n          <ChevronRight\n            aria-hidden=\"true\"\n            className=\"ds:mt-[var(--spacing-2xs)] ds:size-4 ds:shrink-0 ds:text-[color:var(--muted-foreground)] ds:opacity-0 ds:transition-opacity ds:motion-reduce:transition-none ds:group-hover:opacity-100 ds:group-focus-within:opacity-100 ds:rtl:rotate-180\"\n          />\n        ) : null}\n      </div>\n    );\n  },\n);\n\nTaskCard.displayName = 'TaskCard';\n"],"names":["__iconNode","Briefcase","createLucideIcon","LINK_ICON","User","Building2","taskCardVariants","cva","stretchedLinkClass","isSafeTaskUrl","url","StatusIcon","status","priority","tone","SquareCheckBig","CircleAlert","Square","TaskCard","forwardRef","item","size","onActivate","actions","leading","className","rest","ref","t","useTranslation","interactive","hasSafeUrl","ariaLabel","linkTypeLabels","LinkIcon","masked","hasMetaRow","titleNode","jsx","activator","e","jsxs","EyeOff","VisuallyHidden","privacyMask","ChevronRight"],"mappings":"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","x_google_ignoreList":[0]}
+{"version":3,"file":"task-card-BS7Uqevr.js","sources":["../../node_modules/lucide-react/dist/esm/icons/briefcase.mjs","../../src/components/task-card/task-card.tsx"],"sourcesContent":["/**\n * @license lucide-react v1.22.0 - ISC\n *\n * This source code is licensed under the ISC license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nimport createLucideIcon from '../createLucideIcon.mjs';\n\nconst __iconNode = [\n  [\"path\", { d: \"M16 20V4a2 2 0 0 0-2-2h-4a2 2 0 0 0-2 2v16\", key: \"jecpp\" }],\n  [\"rect\", { width: \"20\", height: \"14\", x: \"2\", y: \"6\", rx: \"2\", key: \"i6l2r4\" }]\n];\nconst Briefcase = createLucideIcon(\"briefcase\", __iconNode);\n\nexport { __iconNode, Briefcase as default };\n//# sourceMappingURL=briefcase.mjs.map\n","import { forwardRef, type HTMLAttributes, type ReactNode } from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { useTranslation } from 'react-i18next';\nimport {\n  CircleAlert,\n  Briefcase,\n  Building2,\n  SquareCheckBig,\n  ChevronRight,\n  EyeOff,\n  Square,\n  User,\n} from 'lucide-react';\nimport { VisuallyHidden } from '../visually-hidden';\nimport { privacyMask } from '../_shared/privacy-mask';\n\n/* ------------------------------------------------------------------ */\n/* Types                                                               */\n/* ------------------------------------------------------------------ */\n\nexport type TaskStatus = 'open' | 'in-progress' | 'done';\nexport type TaskPriority = 'low' | 'normal' | 'high';\n\n/** Which entity the task links to. The platform `DoctorReminder` links to exactly one of these (or none). */\nexport type TaskLinkType = 'patient' | 'company' | 'operator';\n\n/** Linked-entity glyph — patient (person), company (building), operator (briefcase). */\nconst LINK_ICON: Record<TaskLinkType, typeof User> = {\n  patient: User,\n  company: Building2,\n  operator: Briefcase,\n};\n\nexport interface TaskItem {\n  /** Unique identifier for the task. */\n  id: string;\n  /** Title — single line, primary content. */\n  title: string;\n  /** Optional secondary line (e.g. \"Patient A · Due today\"). */\n  description?: string;\n  /**\n   * Localised due-date hint (e.g. \"Due today\" / \"Tomorrow\"). Rendered as a\n   * trailing eyebrow chip when set; consumers compute the bucket and pass\n   * the localised string.\n   */\n  dueLabel?: string;\n  /**\n   * Linked-entity NAME (the patient / company / operator the task points at) —\n   * e.g. \"Mario Rossi\". When `linkType` is set the card renders it as a typed\n   * chip (a per-type glyph + an accessible \"Patient/Company/Operator:\" prefix);\n   * otherwise it renders as a plain eyebrow line. The consumer composes the\n   * name only — no prefix.\n   */\n  linkedLabel?: string;\n  /** Type of the linked entity — drives the leading glyph + the accessible prefix on the linked chip. */\n  linkType?: TaskLinkType;\n  /**\n   * The linked name is a privacy mask. The chip shows an EyeOff glyph, then a\n   * visually hidden \"Patient name hidden\", then the mask marked aria-hidden:\n   * `linkedLabel`, or the kit's bullets when the host sends none. It replaces\n   * the \"Patient:\" prefix.\n   */\n  linkedLabelMasked?: boolean;\n  /** Localised assignee display name (host-composed, e.g. \"Dr. Alfa\"). Renders an assignee chip on the meta line. */\n  assigneeLabel?: string;\n  /** Free-text note attached to the task — muted body line, clamped. */\n  note?: string;\n  /** Lifecycle state — drives the leading icon. */\n  status?: TaskStatus;\n  /** Priority — `high` colours the leading icon as `--destructive`. */\n  priority?: TaskPriority;\n  /** Optional deep link — when present the row is an anchor. */\n  url?: string;\n}\n\nexport interface TaskCardProps\n  extends\n    Omit<HTMLAttributes<HTMLDivElement>, 'onClick' | 'role' | 'title'>,\n    VariantProps<typeof taskCardVariants> {\n  /** The task to render. */\n  item: TaskItem;\n  /** Visual density. `xs` is the compact rail row (Control Room); `sm`/`md` for in-page lists. */\n  size?: 'xs' | 'sm' | 'md';\n  /** Fires when the row is activated (click / Enter / Space). */\n  onActivate?: (item: TaskItem) => void;\n  /**\n   * Trailing per-row action toolbar (icon buttons: schedule, edit, …).\n   * Rendered above the stretched-link overlay so the controls stay\n   * clickable inside an interactive row.\n   */\n  actions?: ReactNode;\n  /**\n   * Replaces the leading status glyph. Pass a control (the done checkbox)\n   * when the row can be completed in place: the glyph alone only reports\n   * status, and rendering both a glyph and a matching toggle elsewhere in\n   * the row shows the same mark twice, of which only one does anything.\n   * Rendered above the stretched-link overlay so it stays clickable.\n   */\n  leading?: ReactNode;\n}\n\n/* ------------------------------------------------------------------ */\n/* CVA                                                                 */\n/* ------------------------------------------------------------------ */\n\nconst taskCardVariants = cva(\n  [\n    'ds:relative ds:flex ds:items-start ds:gap-[var(--spacing-sm)]',\n    // Same corner as the elevated Card the note and appointment rows use.\n    'ds:rounded-[var(--radius-lg)]',\n    'ds:transition-colors',\n    'ds:motion-reduce:transition-none',\n    'ds:text-start ds:group',\n    'ds:[:where(&)]:border-[length:var(--surface-border-width,var(--border-width-sm))] ds:border-[color:var(--card-border)]',\n    'ds:forced-colors:border ds:forced-colors:border-[CanvasText]',\n  ].join(' '),\n  {\n    variants: {\n      size: {\n        xs: 'ds:p-[var(--spacing-xs)]',\n        sm: 'ds:p-[var(--spacing-sm)]',\n        md: 'ds:p-[var(--spacing-md)]',\n      },\n      interactive: {\n        true: 'ds:hover:bg-[color:var(--muted)]/40 ds:cursor-pointer',\n        false: '',\n      },\n    },\n    defaultVariants: {\n      size: 'sm',\n      interactive: false,\n    },\n  },\n);\n\n/* The activator keeps a box of its own (display: contents cannot take\n   focus in Chromium); its ::after still stretches over the card. */\nconst stretchedLinkClass = [\n  'ds:focus-visible:outline-none',\n  \"ds:after:content-[''] ds:after:absolute ds:after:inset-0 ds:after:rounded-[var(--radius-lg)]\",\n  'ds:after:pointer-events-auto',\n  'ds:focus-visible:after:outline-[length:var(--focus-ring-width)]',\n  'ds:focus-visible:after:outline-solid',\n  'ds:focus-visible:after:outline-[color:var(--ring)]',\n  'ds:focus-visible:after:outline-offset-[length:var(--focus-ring-offset)]',\n  'ds:forced-colors:focus-visible:after:outline-[CanvasText]',\n].join(' ');\n\n/* ------------------------------------------------------------------ */\n/* Helpers                                                             */\n/* ------------------------------------------------------------------ */\n\nexport function isSafeTaskUrl(url: string): boolean {\n  return /^(https?:\\/\\/(?!\\/)|\\/(?!\\/)|#)/.test(url);\n}\n\nfunction StatusIcon({\n  status,\n  priority,\n}: {\n  status?: TaskStatus;\n  priority?: TaskPriority;\n}): ReactNode {\n  const tone =\n    priority === 'high'\n      ? 'ds:text-[color:var(--destructive)]'\n      : 'ds:text-[color:var(--muted-foreground)]';\n  if (status === 'done') {\n    return (\n      <SquareCheckBig aria-hidden=\"true\" className={`ds:size-4 ${tone}`} />\n    );\n  }\n  if (priority === 'high') {\n    return <CircleAlert aria-hidden=\"true\" className={`ds:size-4 ${tone}`} />;\n  }\n  return <Square aria-hidden=\"true\" className={`ds:size-4 ${tone}`} />;\n}\n\n/* ------------------------------------------------------------------ */\n/* Component                                                           */\n/* ------------------------------------------------------------------ */\n\nexport const TaskCard = forwardRef<HTMLDivElement, TaskCardProps>(\n  (\n    { item, size = 'sm', onActivate, actions, leading, className, ...rest },\n    ref,\n  ) => {\n    const { t } = useTranslation('ui');\n    const interactive = !!onActivate;\n    const hasSafeUrl = !!item.url && isSafeTaskUrl(item.url);\n    const ariaLabel = t('taskCard.itemLabel', {\n      title: item.title,\n      due: item.dueLabel ?? '',\n      defaultValue: '{{title}}{{due, prepend, \" · \"}}',\n    });\n\n    // Static key lookups so the i18n coverage gate sees each literal key.\n    const linkTypeLabels: Record<TaskLinkType, string> = {\n      patient: t('taskCard.link.patient'),\n      company: t('taskCard.link.company'),\n      operator: t('taskCard.link.operator'),\n    };\n    const LinkIcon = item.linkType ? LINK_ICON[item.linkType] : null;\n    // A masked name always gets the chip, so it can say what is hidden,\n    // even when the host sends no mask of its own.\n    const masked = !!item.linkedLabelMasked;\n    // The meta row carries icon-led chips: a typed linked entity + an assignee.\n    const showLinkChip = masked || (!!item.linkType && !!item.linkedLabel);\n    const hasMetaRow = showLinkChip || !!item.assigneeLabel;\n\n    const titleNode = (\n      <span className=\"ds:flex-1 ds:min-w-0 ds:truncate type-body-sm ds:text-[color:var(--foreground)]\">\n        {item.title}\n      </span>\n    );\n\n    let activator: ReactNode;\n    if (interactive && hasSafeUrl) {\n      activator = (\n        <a\n          href={item.url}\n          aria-label={ariaLabel}\n          data-action=\"open-task\"\n          className={stretchedLinkClass + ' ds:flex ds:min-w-0'}\n          onClick={(e) => {\n            if (e.defaultPrevented || e.metaKey || e.ctrlKey || e.shiftKey)\n              return;\n            onActivate?.(item);\n          }}\n        >\n          {titleNode}\n        </a>\n      );\n    } else if (interactive) {\n      activator = (\n        <button\n          type=\"button\"\n          aria-label={ariaLabel}\n          data-action=\"open-task\"\n          className={\n            stretchedLinkClass +\n            ' ds:flex ds:min-w-0 ds:bg-transparent ds:border-0 ds:p-0 ds:text-start'\n          }\n          onClick={() => onActivate?.(item)}\n        >\n          {titleNode}\n        </button>\n      );\n    } else {\n      activator = titleNode;\n    }\n\n    return (\n      <div\n        ref={ref}\n        role=\"listitem\"\n        data-component=\"task-card\"\n        data-component-id={item.id}\n        data-status={item.status ?? 'open'}\n        data-priority={item.priority ?? 'normal'}\n        className={taskCardVariants({ size, interactive, className })}\n        {...rest}\n      >\n        <span className=\"ds:relative ds:z-[1] ds:mt-[var(--spacing-2xs)] ds:shrink-0\">\n          {leading ?? (\n            <StatusIcon status={item.status} priority={item.priority} />\n          )}\n        </span>\n\n        <div className=\"ds:flex-1 ds:min-w-0 ds:flex ds:flex-col ds:gap-[var(--spacing-2xs)]\">\n          {activator}\n          {item.description ? (\n            <span className=\"type-body-sm ds:text-[color:var(--muted-foreground)] ds:truncate\">\n              {item.description}\n            </span>\n          ) : null}\n          {item.note ? (\n            <span className=\"type-body-sm ds:text-[color:var(--muted-foreground)] ds:line-clamp-2\">\n              {item.note}\n            </span>\n          ) : null}\n          {hasMetaRow ? (\n            // `type-meta` (not `type-eyebrow`): these chips carry proper-noun\n            // values (patient / company / operator name, assignee) that must\n            // not be uppercased. Icons are decorative; the type word is exposed\n            // to AT via a VisuallyHidden prefix so each chip reads e.g.\n            // \"Patient: Mario Rossi\" / \"Assignee: Dr. Alfa\".\n            <div className=\"type-meta ds:flex ds:flex-wrap ds:items-center ds:gap-x-[var(--spacing-sm)] ds:gap-y-[var(--spacing-2xs)] ds:text-[color:var(--muted-foreground)]\">\n              {masked ? (\n                // The mask is visual noise to a screen reader, so it hears\n                // what the mask stands for instead.\n                <span className=\"ds:inline-flex ds:min-w-0 ds:items-center ds:gap-[var(--spacing-2xs)]\">\n                  <EyeOff\n                    aria-hidden=\"true\"\n                    className=\"ds:size-3 ds:shrink-0\"\n                  />\n                  <VisuallyHidden>\n                    {t('appointmentPeek.hiddenName')}\n                  </VisuallyHidden>\n                  <span aria-hidden=\"true\" className=\"ds:truncate\">\n                    {privacyMask(item.linkedLabel)}\n                  </span>\n                </span>\n              ) : item.linkType && item.linkedLabel && LinkIcon ? (\n                <span className=\"ds:inline-flex ds:min-w-0 ds:items-center ds:gap-[var(--spacing-2xs)]\">\n                  <LinkIcon\n                    aria-hidden=\"true\"\n                    className=\"ds:size-3 ds:shrink-0\"\n                  />\n                  <VisuallyHidden>{`${linkTypeLabels[item.linkType]}: `}</VisuallyHidden>\n                  <span className=\"ds:truncate\">{item.linkedLabel}</span>\n                </span>\n              ) : null}\n              {item.assigneeLabel ? (\n                <span className=\"ds:inline-flex ds:min-w-0 ds:items-center ds:gap-[var(--spacing-2xs)]\">\n                  <User aria-hidden=\"true\" className=\"ds:size-3 ds:shrink-0\" />\n                  <VisuallyHidden>{`${t('taskCard.assignee')}: `}</VisuallyHidden>\n                  <span className=\"ds:truncate\">{item.assigneeLabel}</span>\n                </span>\n              ) : null}\n            </div>\n          ) : null}\n          {item.linkedLabel && !item.linkType && !masked ? (\n            <span className=\"type-eyebrow ds:text-[color:var(--muted-foreground)] ds:truncate\">\n              {item.linkedLabel}\n            </span>\n          ) : null}\n          {item.dueLabel ? (\n            <span className=\"type-eyebrow ds:text-[color:var(--muted-foreground)]\">\n              {item.dueLabel}\n            </span>\n          ) : null}\n        </div>\n\n        {actions ? (\n          // Above the stretched-link overlay so the buttons stay clickable.\n          <span className=\"ds:relative ds:z-[1] ds:flex ds:items-center ds:gap-[var(--spacing-2xs)] ds:shrink-0\">\n            {actions}\n          </span>\n        ) : null}\n\n        {interactive ? (\n          <ChevronRight\n            aria-hidden=\"true\"\n            className=\"ds:mt-[var(--spacing-2xs)] ds:size-4 ds:shrink-0 ds:text-[color:var(--muted-foreground)] ds:opacity-0 ds:transition-opacity ds:motion-reduce:transition-none ds:group-hover:opacity-100 ds:group-focus-within:opacity-100 ds:rtl:rotate-180\"\n          />\n        ) : null}\n      </div>\n    );\n  },\n);\n\nTaskCard.displayName = 'TaskCard';\n"],"names":["__iconNode","Briefcase","createLucideIcon","LINK_ICON","User","Building2","taskCardVariants","cva","stretchedLinkClass","isSafeTaskUrl","url","StatusIcon","status","priority","tone","SquareCheckBig","CircleAlert","Square","TaskCard","forwardRef","item","size","onActivate","actions","leading","className","rest","ref","t","useTranslation","interactive","hasSafeUrl","ariaLabel","linkTypeLabels","LinkIcon","masked","hasMetaRow","titleNode","jsx","activator","e","jsxs","EyeOff","VisuallyHidden","privacyMask","ChevronRight"],"mappings":"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","x_google_ignoreList":[0]}