@mieweb/ui 0.10.0-dev.4 → 0.10.0-dev.41

package/dist/{chunk-Y5HFM7LO.js.map → chunk-LDBNUJB7.js.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/RadialExplorer/RadialExplorer.tsx"],"names":[],"mappings":"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","file":"chunk-Y5HFM7LO.js","sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { ArrowRight } from 'lucide-react';\nimport { cn } from '../../utils/cn';\nimport { Badge } from '../Badge';\nimport { buttonVariants } from '../Button';\nimport { usePrefersReducedMotion } from '../../hooks/usePrefersReducedMotion';\n\n// =============================================================================\n// Types\n// =============================================================================\n\nexport interface RadialSpoke {\n  id: string;\n  /** Label under the tile. */\n  label: string;\n  /** Tile icon (Lucide, ~22px). */\n  icon: React.ReactNode;\n  /** Small caps tag above the detail heading. Defaults to `label`. */\n  tag?: string;\n  /** Detail heading. Defaults to `label`. */\n  title?: string;\n  description?: string;\n  /** Detail media — a `VideoCard variant=\"plate\"`, an image, a chart. */\n  media?: React.ReactNode;\n  /** Caption under the media, e.g. \"AI Medical Assistant · 2:44\". */\n  caption?: string;\n  /** Primary CTA in the detail panel. */\n  cta?: { label: string; href: string };\n  /** Secondary \"Explore module →\" link. */\n  href?: string;\n  hrefLabel?: string;\n}\n\nexport interface RadialExplorerProps {\n  spokes: RadialSpoke[];\n  /** Centre node — a brand mark or product tile. */\n  center: React.ReactNode;\n  /** Small caps label over the whole explorer. */\n  eyebrow?: string;\n  /** Controlled active spoke. */\n  activeId?: string | null;\n  defaultActiveId?: string | null;\n  onActiveChange?: (id: string | null) => void;\n  /** Shown in the detail panel before any spoke is chosen. */\n  welcome?: {\n    tag?: string;\n    title: string;\n    description?: string;\n    media?: React.ReactNode;\n    cta?: { label: string; href: string };\n  };\n  /**\n   * Auto-advance through the spokes until the visitor interacts. Default\n   * 2200ms; pass 0 to disable. Skipped under `prefers-reduced-motion`.\n   */\n  attractMs?: number;\n  /** Hint under the ring. Default \"Hover a module to preview\". */\n  hint?: string;\n  /** Orbit radius. Default `clamp(118px, 17vw, 188px)`. */\n  radius?: string;\n  /** Accessible name for the spoke group. Default \"Modules\". */\n  groupLabel?: string;\n  className?: string;\n}\n\n// =============================================================================\n// RadialExplorer\n// =============================================================================\n\n/**\n * A radial product explorer: a centre mark with N icon tiles orbiting it, a\n * glowing tracer ray from the core to the active tile, tab dots, and a detail\n * panel beside the ring that shows the active spoke's media, copy and CTAs\n * (with a welcome state before any pick). Auto-advances gently until the\n * visitor engages. Below `lg` the ring becomes a chip grid above the panel.\n * Ported from the Enterprise Health hero HUD.\n *\n * @example\n * ```tsx\n * <RadialExplorer\n *   eyebrow=\"Explore the platform\"\n *   center={<img src=\"/mark.svg\" alt=\"\" />}\n *   spokes={[{ id: 'ehr', label: 'Certified EHR', icon: <FileText />, description: '…',\n *     media: <VideoCard variant=\"plate\" title=\"EHR tour\" youtubeId=\"…\" duration=\"2:44\" />,\n *     cta: { label: 'Request a demo', href: '/demo/' }, href: '/platform/ehr/' }]}\n * />\n * ```\n */\nexport function RadialExplorer({\n  spokes,\n  center,\n  eyebrow,\n  activeId: controlled,\n  defaultActiveId = null,\n  onActiveChange,\n  welcome,\n  attractMs = 2200,\n  hint = 'Hover a module to preview',\n  radius = 'clamp(118px, 17vw, 188px)',\n  groupLabel = 'Modules',\n  className,\n}: RadialExplorerProps) {\n  const reduced = usePrefersReducedMotion();\n  const [inner, setInner] = React.useState<string | null>(defaultActiveId);\n  const [engaged, setEngaged] = React.useState(false);\n  const activeId = controlled !== undefined ? controlled : inner;\n  const id = React.useId();\n\n  const select = React.useCallback(\n    (next: string | null) => {\n      setEngaged(true);\n      if (controlled === undefined) setInner(next);\n      onActiveChange?.(next);\n    },\n    [controlled, onActiveChange]\n  );\n\n  // Attract loop until the visitor interacts. Never runs in controlled mode:\n  // `activeId` is owned by the host, so cycling it (or firing unsolicited\n  // `onActiveChange` ticks) would fight the controlled API contract.\n  React.useEffect(() => {\n    if (\n      controlled !== undefined ||\n      engaged ||\n      reduced ||\n      !attractMs ||\n      spokes.length === 0\n    )\n      return;\n    let i = spokes.findIndex((s) => s.id === activeId);\n    const t = window.setInterval(() => {\n      i = (i + 1) % spokes.length;\n      setInner(spokes[i].id);\n      onActiveChange?.(spokes[i].id);\n    }, attractMs);\n    return () => window.clearInterval(t);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [engaged, reduced, attractMs, spokes.length, controlled]);\n\n  const activeIndex = spokes.findIndex((s) => s.id === activeId);\n  const active = activeIndex >= 0 ? spokes[activeIndex] : null;\n  const step = 360 / Math.max(spokes.length, 1);\n  const angle = (i: number) => `${i * step - 90}deg`;\n\n  return (\n    <section\n      data-slot=\"radial-explorer\"\n      style={{ '--re-r': radius } as React.CSSProperties}\n      className={cn(\n        'grid gap-8 lg:grid-cols-[1.1fr_minmax(300px,380px)] lg:items-center',\n        className\n      )}\n      aria-labelledby={eyebrow ? `${id}-eyebrow` : undefined}\n    >\n      <div className=\"flex flex-col items-center gap-5\">\n        {eyebrow && (\n          <p\n            id={`${id}-eyebrow`}\n            className=\"text-primary-800 dark:text-primary-300 text-[11px] font-bold tracking-[0.18em] uppercase\"\n          >\n            {eyebrow}\n          </p>\n        )}\n\n        {/* Ring (lg+) */}\n        <div\n          role=\"group\"\n          aria-label={groupLabel}\n          data-slot=\"radial-explorer-ring\"\n          className=\"relative hidden aspect-square w-[calc(var(--re-r)*2+120px)] place-items-center lg:grid\"\n        >\n          <span\n            aria-hidden\n            data-slot=\"radial-explorer-core\"\n            className={cn(\n              // rtl-ignore -- physical centering paired with -translate-x-1/2 is direction-independent; start-1/2 would break it in RTL\n              'absolute top-1/2 left-1/2 grid h-[100px] w-[100px] -translate-x-1/2 -translate-y-1/2 place-items-center rounded-[24%] border border-white/15 text-white shadow-[0_14px_30px_rgba(0,0,0,0.3),inset_0_1px_0_rgba(255,255,255,0.08)]',\n              '[background:radial-gradient(90%_90%_at_24%_8%,color-mix(in_srgb,var(--mieweb-primary-400)_35%,transparent),transparent_60%),linear-gradient(145deg,var(--mieweb-primary-700)_0%,var(--mieweb-primary-900)_68%,var(--mieweb-primary-950)_100%)]',\n              '[&>*]:h-[54px] [&>*]:w-[54px] [&>img]:object-contain'\n            )}\n          >\n            {center}\n          </span>\n\n          {active && (\n            <span\n              aria-hidden\n              data-slot=\"radial-explorer-ray\"\n              style={{\n                width: 'var(--re-r)',\n                transform: `translateY(-50%) rotate(${angle(activeIndex)})`,\n              }}\n              className={cn(\n                // rtl-ignore -- the ray is rotated to a computed angle from the physical center; origin/tip geometry must stay physical\n                'pointer-events-none absolute top-1/2 left-1/2 z-0 h-0.5 origin-left rounded-full transition-transform duration-500 [transition-timing-function:cubic-bezier(0.4,0.85,0.3,1)]',\n                '[filter:drop-shadow(0_0_6px_color-mix(in_srgb,var(--mieweb-accent,var(--mieweb-primary-300))_55%,transparent))] [background:linear-gradient(90deg,transparent_4%,var(--mieweb-accent,var(--mieweb-primary-300))_94%)]',\n                // rtl-ignore -- tip dot sits at the physical end of the rotated ray\n                'after:absolute after:top-1/2 after:-right-[3px] after:h-[7px] after:w-[7px] after:-translate-y-1/2 after:rounded-full after:bg-[var(--mieweb-accent,var(--mieweb-primary-300))] after:shadow-[0_0_9px_2px_color-mix(in_srgb,var(--mieweb-accent,var(--mieweb-primary-300))_70%,transparent)] after:content-[\"\"]'\n              )}\n            />\n          )}\n\n          {spokes.map((s, i) => {\n            const on = s.id === activeId;\n            return (\n              <button\n                key={s.id}\n                type=\"button\"\n                aria-pressed={on}\n                data-slot=\"radial-explorer-spoke\"\n                data-active={on || undefined}\n                style={{\n                  transform: `translate(-50%,-50%) rotate(${angle(i)}) translate(var(--re-r)) rotate(calc(-1 * ${angle(i)}))`,\n                }}\n                onMouseEnter={() => select(s.id)}\n                onFocus={() => select(s.id)}\n                onClick={() => select(s.id)}\n                // rtl-ignore -- spokes are placed by rotate/translate trig from the physical center; the wheel is rotationally symmetric\n                className=\"group/spoke absolute top-1/2 left-1/2 grid w-24 justify-items-center gap-2 focus-visible:outline-none\"\n              >\n                <SpokeTile icon={s.icon} active={on} />\n                <span\n                  className={cn(\n                    'text-muted-foreground group-hover/spoke:text-primary-800 dark:group-hover/spoke:text-primary-200 text-[13px] font-semibold transition-colors',\n                    on && 'text-primary-800 dark:text-primary-200'\n                  )}\n                >\n                  {s.label}\n                </span>\n              </button>\n            );\n          })}\n        </div>\n\n        {/* Chip grid (< lg) */}\n        <div\n          role=\"group\"\n          aria-label={groupLabel}\n          className=\"grid w-full grid-cols-3 gap-3 lg:hidden\"\n        >\n          {spokes.map((s) => {\n            const on = s.id === activeId;\n            return (\n              <button\n                key={s.id}\n                type=\"button\"\n                aria-pressed={on}\n                data-slot=\"radial-explorer-chip\"\n                onClick={() => select(s.id)}\n                className=\"group/spoke grid justify-items-center gap-1.5 focus-visible:outline-none\"\n              >\n                <SpokeTile icon={s.icon} active={on} size=\"sm\" />\n                <span\n                  className={cn(\n                    'text-muted-foreground text-center text-xs font-semibold',\n                    on && 'text-primary-800 dark:text-primary-200'\n                  )}\n                >\n                  {s.label}\n                </span>\n              </button>\n            );\n          })}\n        </div>\n\n        {/* dots + hint */}\n        <div className=\"flex flex-col items-center gap-2\">\n          <div role=\"group\" aria-label={groupLabel} className=\"flex gap-2\">\n            {spokes.map((s, i) => (\n              <button\n                key={s.id}\n                type=\"button\"\n                aria-pressed={i === activeIndex}\n                aria-label={s.label}\n                onClick={() => select(s.id)}\n                className={cn(\n                  'h-2 rounded-full transition-all',\n                  i === activeIndex\n                    ? 'w-6 bg-[var(--mieweb-accent,var(--mieweb-primary-400))]'\n                    : 'bg-primary-300/60 hover:bg-primary-400 w-2'\n                )}\n              />\n            ))}\n          </div>\n          {hint && (\n            <p\n              className={cn(\n                'text-muted-foreground text-xs transition-opacity',\n                engaged && 'opacity-0'\n              )}\n              aria-hidden={engaged}\n            >\n              {hint}\n            </p>\n          )}\n        </div>\n      </div>\n\n      {/* Detail */}\n      <div\n        data-slot=\"radial-explorer-detail\"\n        aria-live={engaged ? 'polite' : 'off'}\n        className=\"border-border bg-card text-card-foreground grid content-center gap-3.5 rounded-2xl border p-5 shadow-xl\"\n      >\n        {active ? (\n          <Detail\n            key={active.id}\n            tag={active.tag ?? active.label}\n            title={active.title ?? active.label}\n            description={active.description}\n            media={active.media}\n            caption={active.caption}\n            cta={active.cta}\n            href={active.href}\n            hrefLabel={active.hrefLabel ?? 'Explore module'}\n          />\n        ) : welcome ? (\n          <Detail\n            key=\"welcome\"\n            tag={welcome.tag}\n            title={welcome.title}\n            description={welcome.description}\n            media={welcome.media}\n            cta={welcome.cta}\n          />\n        ) : null}\n      </div>\n    </section>\n  );\n}\n\n// =============================================================================\n// Pieces\n// =============================================================================\n\nfunction SpokeTile({\n  icon,\n  active,\n  size = 'md',\n}: {\n  icon: React.ReactNode;\n  active: boolean;\n  size?: 'sm' | 'md';\n}) {\n  return (\n    <span\n      aria-hidden\n      className={cn(\n        'mie-fx-sheen relative grid place-items-center rounded-[17px] border transition-[transform,border-color,color,box-shadow,background] duration-200',\n        size === 'md'\n          ? 'h-[60px] w-[60px] [&>svg]:h-[22px] [&>svg]:w-[22px]'\n          : 'h-12 w-12 rounded-xl [&>svg]:h-5 [&>svg]:w-5',\n        'border-border bg-primary-500/10 text-primary-800 dark:text-primary-300 shadow-md backdrop-blur-sm',\n        'group-hover/spoke:-translate-y-0.5 group-hover/spoke:scale-[1.04] group-hover/spoke:border-transparent group-hover/spoke:text-white group-hover/spoke:shadow-xl',\n        'group-hover/spoke:[background:linear-gradient(150deg,var(--mieweb-primary-700),var(--mieweb-primary-900))_padding-box,linear-gradient(135deg,var(--mieweb-accent,var(--mieweb-primary-300)),var(--mieweb-primary-200)_55%,var(--mieweb-accent,var(--mieweb-primary-300)))_border-box]',\n        'group-focus-visible/spoke:outline-primary-500 group-focus-visible/spoke:outline group-focus-visible/spoke:outline-2 group-focus-visible/spoke:outline-offset-[3px]',\n        active &&\n          '-translate-y-0.5 scale-[1.04] border-transparent text-white shadow-xl [background:linear-gradient(150deg,var(--mieweb-primary-700),var(--mieweb-primary-900))_padding-box,linear-gradient(135deg,var(--mieweb-accent,var(--mieweb-primary-300)),var(--mieweb-primary-200)_55%,var(--mieweb-accent,var(--mieweb-primary-300)))_border-box]'\n      )}\n    >\n      {icon}\n    </span>\n  );\n}\n\nfunction Detail({\n  tag,\n  title,\n  description,\n  media,\n  caption,\n  cta,\n  href,\n  hrefLabel,\n}: {\n  tag?: string;\n  title: string;\n  description?: string;\n  media?: React.ReactNode;\n  caption?: string;\n  cta?: { label: string; href: string };\n  href?: string;\n  hrefLabel?: string;\n}) {\n  return (\n    <div className=\"grid gap-3.5 motion-safe:animate-[mie-fade-in_0.25s_ease-out]\">\n      {media && <div data-slot=\"radial-explorer-media\">{media}</div>}\n      {tag && (\n        <Badge\n          size=\"sm\"\n          className=\"w-fit text-[10px] font-bold tracking-[0.14em] uppercase\"\n        >\n          {tag}\n        </Badge>\n      )}\n      <h3 className=\"text-foreground text-2xl leading-tight font-semibold\">\n        {title}\n      </h3>\n      {description && (\n        <p className=\"text-muted-foreground text-[15px] leading-snug\">\n          {description}\n        </p>\n      )}\n      {caption && <p className=\"text-muted-foreground text-sm\">{caption}</p>}\n      {(cta || href) && (\n        <div className=\"mt-1 flex flex-wrap items-center gap-3\">\n          {cta && (\n            <a href={cta.href} className={buttonVariants({ effect: 'sheen' })}>\n              {cta.label}\n              <ArrowRight size={16} aria-hidden />\n            </a>\n          )}\n          {href && (\n            <a\n              href={href}\n              className=\"text-primary-800 dark:text-primary-200 text-sm font-semibold underline-offset-4 hover:underline\"\n            >\n              {hrefLabel}\n            </a>\n          )}\n        </div>\n      )}\n    </div>\n  );\n}\n"]}
+{"version":3,"sources":["../src/components/RadialExplorer/RadialExplorer.tsx"],"names":[],"mappings":"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","file":"chunk-LDBNUJB7.js","sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { ArrowRight } from 'lucide-react';\nimport { cn } from '../../utils/cn';\nimport { Badge } from '../Badge';\nimport { buttonVariants } from '../Button';\nimport { usePrefersReducedMotion } from '../../hooks/usePrefersReducedMotion';\n\n// =============================================================================\n// Types\n// =============================================================================\n\nexport interface RadialSpoke {\n  id: string;\n  /** Label under the tile. */\n  label: string;\n  /** Tile icon (Lucide, ~22px). */\n  icon: React.ReactNode;\n  /** Small caps tag above the detail heading. Defaults to `label`. */\n  tag?: string;\n  /** Detail heading. Defaults to `label`. */\n  title?: string;\n  description?: string;\n  /** Detail media — a `VideoCard variant=\"plate\"`, an image, a chart. */\n  media?: React.ReactNode;\n  /** Caption under the media, e.g. \"AI Medical Assistant · 2:44\". */\n  caption?: string;\n  /** Primary CTA in the detail panel. */\n  cta?: { label: string; href: string };\n  /** Secondary \"Explore module →\" link. */\n  href?: string;\n  hrefLabel?: string;\n}\n\nexport interface RadialExplorerProps {\n  spokes: RadialSpoke[];\n  /** Centre node — a brand mark or product tile. */\n  center: React.ReactNode;\n  /** Small caps label over the whole explorer. */\n  eyebrow?: string;\n  /** Controlled active spoke. */\n  activeId?: string | null;\n  defaultActiveId?: string | null;\n  onActiveChange?: (id: string | null) => void;\n  /** Shown in the detail panel before any spoke is chosen. */\n  welcome?: {\n    tag?: string;\n    title: string;\n    description?: string;\n    media?: React.ReactNode;\n    cta?: { label: string; href: string };\n  };\n  /**\n   * Auto-advance through the spokes until the visitor interacts. Default\n   * 2200ms; pass 0 to disable. Skipped under `prefers-reduced-motion`.\n   */\n  attractMs?: number;\n  /** Hint under the ring. Default \"Hover a module to preview\". */\n  hint?: string;\n  /** Orbit radius. Default `clamp(118px, 17vw, 188px)`. */\n  radius?: string;\n  /** Accessible name for the spoke group. Default \"Modules\". */\n  groupLabel?: string;\n  className?: string;\n}\n\n// =============================================================================\n// RadialExplorer\n// =============================================================================\n\n/**\n * A radial product explorer: a centre mark with N icon tiles orbiting it, a\n * glowing tracer ray from the core to the active tile, tab dots, and a detail\n * panel beside the ring that shows the active spoke's media, copy and CTAs\n * (with a welcome state before any pick). Auto-advances gently until the\n * visitor engages. Below `lg` the ring becomes a chip grid above the panel.\n * Ported from the Enterprise Health hero HUD.\n *\n * @example\n * ```tsx\n * <RadialExplorer\n *   eyebrow=\"Explore the platform\"\n *   center={<img src=\"/mark.svg\" alt=\"\" />}\n *   spokes={[{ id: 'ehr', label: 'Certified EHR', icon: <FileText />, description: '…',\n *     media: <VideoCard variant=\"plate\" title=\"EHR tour\" youtubeId=\"…\" duration=\"2:44\" />,\n *     cta: { label: 'Request a demo', href: '/demo/' }, href: '/platform/ehr/' }]}\n * />\n * ```\n */\nexport function RadialExplorer({\n  spokes,\n  center,\n  eyebrow,\n  activeId: controlled,\n  defaultActiveId = null,\n  onActiveChange,\n  welcome,\n  attractMs = 2200,\n  hint = 'Hover a module to preview',\n  radius = 'clamp(118px, 17vw, 188px)',\n  groupLabel = 'Modules',\n  className,\n}: RadialExplorerProps) {\n  const reduced = usePrefersReducedMotion();\n  const [inner, setInner] = React.useState<string | null>(defaultActiveId);\n  const [engaged, setEngaged] = React.useState(false);\n  const activeId = controlled !== undefined ? controlled : inner;\n  const id = React.useId();\n\n  const select = React.useCallback(\n    (next: string | null) => {\n      setEngaged(true);\n      if (controlled === undefined) setInner(next);\n      onActiveChange?.(next);\n    },\n    [controlled, onActiveChange]\n  );\n\n  // Attract loop until the visitor interacts. Never runs in controlled mode:\n  // `activeId` is owned by the host, so cycling it (or firing unsolicited\n  // `onActiveChange` ticks) would fight the controlled API contract.\n  React.useEffect(() => {\n    if (\n      controlled !== undefined ||\n      engaged ||\n      reduced ||\n      !attractMs ||\n      spokes.length === 0\n    )\n      return;\n    let i = spokes.findIndex((s) => s.id === activeId);\n    const t = window.setInterval(() => {\n      i = (i + 1) % spokes.length;\n      setInner(spokes[i].id);\n      onActiveChange?.(spokes[i].id);\n    }, attractMs);\n    return () => window.clearInterval(t);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [engaged, reduced, attractMs, spokes.length, controlled]);\n\n  const activeIndex = spokes.findIndex((s) => s.id === activeId);\n  const active = activeIndex >= 0 ? spokes[activeIndex] : null;\n  const step = 360 / Math.max(spokes.length, 1);\n  const angle = (i: number) => `${i * step - 90}deg`;\n\n  return (\n    <section\n      data-slot=\"radial-explorer\"\n      style={{ '--re-r': radius } as React.CSSProperties}\n      className={cn(\n        'grid gap-8 lg:grid-cols-[1.1fr_minmax(300px,380px)] lg:items-center',\n        className\n      )}\n      aria-labelledby={eyebrow ? `${id}-eyebrow` : undefined}\n    >\n      <div className=\"flex flex-col items-center gap-5\">\n        {eyebrow && (\n          <p\n            id={`${id}-eyebrow`}\n            className=\"text-primary-800 dark:text-primary-300 text-[11px] font-bold tracking-[0.18em] uppercase\"\n          >\n            {eyebrow}\n          </p>\n        )}\n\n        {/* Ring (lg+) */}\n        <div\n          role=\"group\"\n          aria-label={groupLabel}\n          data-slot=\"radial-explorer-ring\"\n          className=\"relative hidden aspect-square w-[calc(var(--re-r)*2+120px)] place-items-center lg:grid\"\n        >\n          <span\n            aria-hidden\n            data-slot=\"radial-explorer-core\"\n            className={cn(\n              // rtl-ignore -- physical centering paired with -translate-x-1/2 is direction-independent; start-1/2 would break it in RTL\n              'absolute top-1/2 left-1/2 grid h-[100px] w-[100px] -translate-x-1/2 -translate-y-1/2 place-items-center rounded-[24%] border border-white/15 text-white shadow-[0_14px_30px_rgba(0,0,0,0.3),inset_0_1px_0_rgba(255,255,255,0.08)]',\n              '[background:radial-gradient(90%_90%_at_24%_8%,color-mix(in_srgb,var(--mieweb-primary-400)_35%,transparent),transparent_60%),linear-gradient(145deg,var(--mieweb-primary-700)_0%,var(--mieweb-primary-900)_68%,var(--mieweb-primary-950)_100%)]',\n              '[&>*]:h-[54px] [&>*]:w-[54px] [&>img]:object-contain'\n            )}\n          >\n            {center}\n          </span>\n\n          {active && (\n            <span\n              aria-hidden\n              data-slot=\"radial-explorer-ray\"\n              style={{\n                width: 'var(--re-r)',\n                transform: `translateY(-50%) rotate(${angle(activeIndex)})`,\n              }}\n              className={cn(\n                // rtl-ignore -- the ray is rotated to a computed angle from the physical center; origin/tip geometry must stay physical\n                'pointer-events-none absolute top-1/2 left-1/2 z-0 h-0.5 origin-left rounded-full transition-transform duration-500 [transition-timing-function:cubic-bezier(0.4,0.85,0.3,1)]',\n                '[filter:drop-shadow(0_0_6px_color-mix(in_srgb,var(--mieweb-accent,var(--mieweb-primary-300))_55%,transparent))] [background:linear-gradient(90deg,transparent_4%,var(--mieweb-accent,var(--mieweb-primary-300))_94%)]',\n                // rtl-ignore -- tip dot sits at the physical end of the rotated ray\n                'after:absolute after:top-1/2 after:-right-[3px] after:h-[7px] after:w-[7px] after:-translate-y-1/2 after:rounded-full after:bg-[var(--mieweb-accent,var(--mieweb-primary-300))] after:shadow-[0_0_9px_2px_color-mix(in_srgb,var(--mieweb-accent,var(--mieweb-primary-300))_70%,transparent)] after:content-[\"\"]'\n              )}\n            />\n          )}\n\n          {spokes.map((s, i) => {\n            const on = s.id === activeId;\n            return (\n              <button\n                key={s.id}\n                type=\"button\"\n                aria-pressed={on}\n                data-slot=\"radial-explorer-spoke\"\n                data-active={on || undefined}\n                style={{\n                  transform: `translate(-50%,-50%) rotate(${angle(i)}) translate(var(--re-r)) rotate(calc(-1 * ${angle(i)}))`,\n                }}\n                onMouseEnter={() => select(s.id)}\n                onFocus={() => select(s.id)}\n                onClick={() => select(s.id)}\n                // rtl-ignore -- spokes are placed by rotate/translate trig from the physical center; the wheel is rotationally symmetric\n                className=\"group/spoke absolute top-1/2 left-1/2 grid w-24 justify-items-center gap-2 focus-visible:outline-none\"\n              >\n                <SpokeTile icon={s.icon} active={on} />\n                <span\n                  className={cn(\n                    'text-muted-foreground group-hover/spoke:text-primary-800 dark:group-hover/spoke:text-primary-200 text-[13px] font-semibold transition-colors',\n                    on && 'text-primary-800 dark:text-primary-200'\n                  )}\n                >\n                  {s.label}\n                </span>\n              </button>\n            );\n          })}\n        </div>\n\n        {/* Chip grid (< lg) */}\n        <div\n          role=\"group\"\n          aria-label={groupLabel}\n          className=\"grid w-full grid-cols-3 gap-3 lg:hidden\"\n        >\n          {spokes.map((s) => {\n            const on = s.id === activeId;\n            return (\n              <button\n                key={s.id}\n                type=\"button\"\n                aria-pressed={on}\n                data-slot=\"radial-explorer-chip\"\n                onClick={() => select(s.id)}\n                className=\"group/spoke grid justify-items-center gap-1.5 focus-visible:outline-none\"\n              >\n                <SpokeTile icon={s.icon} active={on} size=\"sm\" />\n                <span\n                  className={cn(\n                    'text-muted-foreground text-center text-xs font-semibold',\n                    on && 'text-primary-800 dark:text-primary-200'\n                  )}\n                >\n                  {s.label}\n                </span>\n              </button>\n            );\n          })}\n        </div>\n\n        {/* dots + hint */}\n        <div className=\"flex flex-col items-center gap-2\">\n          <div role=\"group\" aria-label={groupLabel} className=\"flex gap-2\">\n            {spokes.map((s, i) => (\n              <button\n                key={s.id}\n                type=\"button\"\n                aria-pressed={i === activeIndex}\n                aria-label={s.label}\n                onClick={() => select(s.id)}\n                className={cn(\n                  'h-2 rounded-full transition-all',\n                  i === activeIndex\n                    ? 'w-6 bg-[var(--mieweb-accent,var(--mieweb-primary-400))]'\n                    : 'bg-primary-300/60 hover:bg-primary-400 w-2'\n                )}\n              />\n            ))}\n          </div>\n          {hint && (\n            <p\n              className={cn(\n                'text-muted-foreground text-xs transition-opacity',\n                engaged && 'opacity-0'\n              )}\n              aria-hidden={engaged}\n            >\n              {hint}\n            </p>\n          )}\n        </div>\n      </div>\n\n      {/* Detail */}\n      <div\n        data-slot=\"radial-explorer-detail\"\n        aria-live={engaged ? 'polite' : 'off'}\n        className=\"border-border bg-card text-card-foreground grid content-center gap-3.5 rounded-2xl border p-5 shadow-xl\"\n      >\n        {active ? (\n          <Detail\n            key={active.id}\n            tag={active.tag ?? active.label}\n            title={active.title ?? active.label}\n            description={active.description}\n            media={active.media}\n            caption={active.caption}\n            cta={active.cta}\n            href={active.href}\n            hrefLabel={active.hrefLabel ?? 'Explore module'}\n          />\n        ) : welcome ? (\n          <Detail\n            key=\"welcome\"\n            tag={welcome.tag}\n            title={welcome.title}\n            description={welcome.description}\n            media={welcome.media}\n            cta={welcome.cta}\n          />\n        ) : null}\n      </div>\n    </section>\n  );\n}\n\n// =============================================================================\n// Pieces\n// =============================================================================\n\nfunction SpokeTile({\n  icon,\n  active,\n  size = 'md',\n}: {\n  icon: React.ReactNode;\n  active: boolean;\n  size?: 'sm' | 'md';\n}) {\n  return (\n    <span\n      aria-hidden\n      className={cn(\n        'mie-fx-sheen relative grid place-items-center rounded-[17px] border transition-[transform,border-color,color,box-shadow,background] duration-200',\n        size === 'md'\n          ? 'h-[60px] w-[60px] [&>svg]:h-[22px] [&>svg]:w-[22px]'\n          : 'h-12 w-12 rounded-xl [&>svg]:h-5 [&>svg]:w-5',\n        'border-border bg-primary-500/10 text-primary-800 dark:text-primary-300 shadow-md backdrop-blur-sm',\n        'group-hover/spoke:-translate-y-0.5 group-hover/spoke:scale-[1.04] group-hover/spoke:border-transparent group-hover/spoke:text-white group-hover/spoke:shadow-xl',\n        'group-hover/spoke:[background:linear-gradient(150deg,var(--mieweb-primary-700),var(--mieweb-primary-900))_padding-box,linear-gradient(135deg,var(--mieweb-accent,var(--mieweb-primary-300)),var(--mieweb-primary-200)_55%,var(--mieweb-accent,var(--mieweb-primary-300)))_border-box]',\n        'group-focus-visible/spoke:outline-primary-500 group-focus-visible/spoke:outline group-focus-visible/spoke:outline-2 group-focus-visible/spoke:outline-offset-[3px]',\n        active &&\n          '-translate-y-0.5 scale-[1.04] border-transparent text-white shadow-xl [background:linear-gradient(150deg,var(--mieweb-primary-700),var(--mieweb-primary-900))_padding-box,linear-gradient(135deg,var(--mieweb-accent,var(--mieweb-primary-300)),var(--mieweb-primary-200)_55%,var(--mieweb-accent,var(--mieweb-primary-300)))_border-box]'\n      )}\n    >\n      {icon}\n    </span>\n  );\n}\n\nfunction Detail({\n  tag,\n  title,\n  description,\n  media,\n  caption,\n  cta,\n  href,\n  hrefLabel,\n}: {\n  tag?: string;\n  title: string;\n  description?: string;\n  media?: React.ReactNode;\n  caption?: string;\n  cta?: { label: string; href: string };\n  href?: string;\n  hrefLabel?: string;\n}) {\n  return (\n    <div className=\"grid gap-3.5 motion-safe:animate-[mie-fade-in_0.25s_ease-out]\">\n      {media && <div data-slot=\"radial-explorer-media\">{media}</div>}\n      {tag && (\n        <Badge\n          size=\"sm\"\n          className=\"w-fit text-[10px] font-bold tracking-[0.14em] uppercase\"\n        >\n          {tag}\n        </Badge>\n      )}\n      <h3 className=\"text-foreground text-2xl leading-tight font-semibold\">\n        {title}\n      </h3>\n      {description && (\n        <p className=\"text-muted-foreground text-[15px] leading-snug\">\n          {description}\n        </p>\n      )}\n      {caption && <p className=\"text-muted-foreground text-sm\">{caption}</p>}\n      {(cta || href) && (\n        <div className=\"mt-1 flex flex-wrap items-center gap-3\">\n          {cta && (\n            <a href={cta.href} className={buttonVariants({ effect: 'sheen' })}>\n              {cta.label}\n              <ArrowRight size={16} aria-hidden />\n            </a>\n          )}\n          {href && (\n            <a\n              href={href}\n              className=\"text-primary-800 dark:text-primary-200 text-sm font-semibold underline-offset-4 hover:underline\"\n            >\n              {hrefLabel}\n            </a>\n          )}\n        </div>\n      )}\n    </div>\n  );\n}\n"]}