@mieweb/ui 0.10.0-dev.14 → 0.10.0-dev.16

package/dist/{chunk-VU6UTJRM.js.map → chunk-CATY3P2U.js.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/SectionSpyNav/SectionSpyNav.tsx"],"names":[],"mappings":"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","file":"chunk-VU6UTJRM.js","sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { ArrowDown, ArrowRight, ArrowUpRight } from 'lucide-react';\nimport { cn } from '../../utils/cn';\nimport { useScrollSpy } from '../../hooks/useScrollSpy';\nimport { buttonVariants } from '../Button';\n\n// =============================================================================\n// Types\n// =============================================================================\n\n/** One section the nav links to. The id must match a `section[id]` on the page. */\nexport interface SectionSpyItem {\n  id: string;\n  label: string;\n}\n\n/**\n * Funnel intent for the bar's single contextual CTA — drives its visual\n * weight so the in-page strip never out-shouts a page's primary CTA:\n * `explore` (quiet next step) → `evaluate` (sales-ready ask) → `commit`\n * (high-intent action).\n */\nexport type SectionSpyCtaTier = 'explore' | 'evaluate' | 'commit';\n\nexport interface SectionSpyCta {\n  label: string;\n  href: string;\n  tier?: SectionSpyCtaTier;\n}\n\nexport interface SectionSpyNavProps {\n  /** Sections to link to, in page order. */\n  items: SectionSpyItem[];\n  /** Optional single page-specific next-step CTA at the end of the bar. */\n  cta?: SectionSpyCta;\n  /** Eyebrow before the links (default \"On this page\"). */\n  label?: string;\n  /**\n   * Visual tone: `surface` sits on the page background; `brand` renders the\n   * inverted primary band.\n   */\n  tone?: 'surface' | 'brand';\n  /** IntersectionObserver root margin tuning for the scroll spy. */\n  rootMargin?: string;\n  /** Called with the section id when a nav link is clicked. */\n  onItemClick?: (id: string) => void;\n  /** Called when the CTA is clicked (e.g. for analytics). */\n  onCtaClick?: (cta: SectionSpyCta) => void;\n  className?: string;\n}\n\n// =============================================================================\n// Internals\n// =============================================================================\n\n/** Directional glyph inferred from the destination. */\nfunction CtaArrow({ href }: { href: string }) {\n  const Icon = href.startsWith('#')\n    ? ArrowDown\n    : href.startsWith('/')\n      ? ArrowRight\n      : ArrowUpRight;\n  // rtl:-scale-x-100 mirrors ArrowRight and ArrowUpRight for RTL reading\n  // direction; ArrowDown is horizontally symmetric so the flip is a no-op.\n  return <Icon aria-hidden=\"true\" className=\"h-3.5 w-3.5 rtl:-scale-x-100\" />;\n}\n\nconst CTA_TIER_VARIANT = {\n  explore: 'ghost',\n  evaluate: 'outline',\n  commit: 'primary',\n} as const;\n\n// =============================================================================\n// SectionSpyNav\n// =============================================================================\n\n/**\n * Sticky horizontal in-page wayfinding: jumps between a page's major\n * sections, highlights the one in view with a sliding underline, and can\n * carry a single page-specific next-step CTA. Pure anchor links, so it\n * still works if the scroll spy never runs.\n *\n * The horizontal complement to `TableOfContents` — use that for a sidebar\n * outline, this for a band under the page header. Section elements need\n * matching `id`s.\n *\n * @example\n * ```tsx\n * <SectionSpyNav\n *   items={[\n *     { id: 'overview', label: 'Overview' },\n *     { id: 'pricing', label: 'Pricing' },\n *   ]}\n *   cta={{ label: 'Book a demo', href: '/demo', tier: 'evaluate' }}\n * />\n * ```\n */\nexport function SectionSpyNav({\n  items,\n  cta,\n  label = 'On this page',\n  tone = 'surface',\n  rootMargin = '-22% 0px -68% 0px',\n  onItemClick,\n  onCtaClick,\n  className,\n}: SectionSpyNavProps) {\n  const ids = React.useMemo(() => items.map((it) => it.id), [items]);\n  const { activeId } = useScrollSpy({ ids, rootMargin });\n  const active = activeId ?? items[0]?.id ?? '';\n\n  const railRef = React.useRef<HTMLDivElement>(null);\n  const markRef = React.useRef<HTMLSpanElement>(null);\n\n  // Find the active link by dataset rather than a CSS selector, so ids\n  // never need escaping and CSS.escape availability doesn't matter.\n  const findActiveLink = React.useCallback((): HTMLAnchorElement | null => {\n    const links = railRef.current?.querySelectorAll<HTMLAnchorElement>('a');\n    if (!links) return null;\n    for (const link of links) {\n      if (link.dataset.id === active) return link;\n    }\n    return null;\n  }, [active]);\n\n  // Slide the underline beneath the active link. offsetLeft/offsetWidth are\n  // physical and measured against the rail, so the marker tracks the link\n  // in both directions and while the rail is scrolled horizontally.\n  const syncMarker = React.useCallback(() => {\n    const link = findActiveLink();\n    const mark = markRef.current;\n    if (!link || !mark) return;\n    mark.style.left = `${link.offsetLeft}px`;\n    mark.style.width = `${link.offsetWidth}px`;\n  }, [findActiveLink]);\n\n  React.useEffect(() => {\n    const link = findActiveLink();\n    link?.scrollIntoView?.({ inline: 'center', block: 'nearest' });\n    syncMarker();\n  }, [findActiveLink, syncMarker]);\n\n  React.useEffect(() => {\n    window.addEventListener('resize', syncMarker);\n    return () => window.removeEventListener('resize', syncMarker);\n  }, [syncMarker]);\n\n  const brand = tone === 'brand';\n\n  return (\n    <nav\n      className={cn(\n        'sticky top-0 z-30 w-full',\n        brand\n          ? 'bg-primary-900 text-white'\n          : 'border-border bg-card/95 border-b backdrop-blur',\n        className\n      )}\n      aria-label={label}\n    >\n      <div className=\"flex items-center gap-4 px-4 py-0.5\">\n        <span\n          className={cn(\n            'shrink-0 text-[11px] font-semibold tracking-wide uppercase max-md:hidden',\n            brand ? 'text-white/85' : 'text-muted-foreground'\n          )}\n          aria-hidden=\"true\"\n        >\n          {label}\n        </span>\n        <div\n          ref={railRef}\n          className=\"relative flex min-w-0 flex-1 gap-1 overflow-x-auto [scrollbar-width:none] [&::-webkit-scrollbar]:hidden\"\n        >\n          {items.map((it) => {\n            const isActive = active === it.id;\n            return (\n              <a\n                key={it.id}\n                href={`#${it.id}`}\n                data-id={it.id}\n                onClick={() => onItemClick?.(it.id)}\n                className={cn(\n                  'shrink-0 rounded px-2.5 py-2 text-sm whitespace-nowrap transition-colors',\n                  brand\n                    ? isActive\n                      ? 'font-semibold text-white'\n                      : 'text-white/85 hover:text-white'\n                    : isActive\n                      ? 'text-foreground font-semibold'\n                      : 'text-muted-foreground hover:text-foreground'\n                )}\n                aria-current={isActive ? 'location' : undefined}\n              >\n                {it.label}\n              </a>\n            );\n          })}\n          <span\n            ref={markRef}\n            className={cn(\n              'absolute bottom-0 h-0.5 rounded-full transition-[left,width] duration-300',\n              brand ? 'bg-primary-400' : 'bg-primary-500'\n            )}\n            aria-hidden=\"true\"\n          />\n        </div>\n        {cta && (\n          <a\n            href={cta.href}\n            onClick={() => onCtaClick?.(cta)}\n            className={cn(\n              buttonVariants({\n                variant: CTA_TIER_VARIANT[cta.tier ?? 'explore'],\n                size: 'sm',\n              }),\n              'shrink-0',\n              brand &&\n                (cta.tier ?? 'explore') !== 'commit' &&\n                'text-white hover:bg-white/10 hover:text-white'\n            )}\n          >\n            {cta.label}\n            <CtaArrow href={cta.href} />\n          </a>\n        )}\n      </div>\n    </nav>\n  );\n}\n"]}
+{"version":3,"sources":["../src/components/SectionSpyNav/SectionSpyNav.tsx"],"names":[],"mappings":"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","file":"chunk-CATY3P2U.js","sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { ArrowDown, ArrowRight, ArrowUpRight } from 'lucide-react';\nimport { cn } from '../../utils/cn';\nimport { useScrollSpy } from '../../hooks/useScrollSpy';\nimport { buttonVariants } from '../Button';\n\n// =============================================================================\n// Types\n// =============================================================================\n\n/** One section the nav links to. The id must match a `section[id]` on the page. */\nexport interface SectionSpyItem {\n  id: string;\n  label: string;\n}\n\n/**\n * Funnel intent for the bar's single contextual CTA — drives its visual\n * weight so the in-page strip never out-shouts a page's primary CTA:\n * `explore` (quiet next step) → `evaluate` (sales-ready ask) → `commit`\n * (high-intent action).\n */\nexport type SectionSpyCtaTier = 'explore' | 'evaluate' | 'commit';\n\nexport interface SectionSpyCta {\n  label: string;\n  href: string;\n  tier?: SectionSpyCtaTier;\n}\n\nexport interface SectionSpyNavProps {\n  /** Sections to link to, in page order. */\n  items: SectionSpyItem[];\n  /** Optional single page-specific next-step CTA at the end of the bar. */\n  cta?: SectionSpyCta;\n  /** Eyebrow before the links (default \"On this page\"). */\n  label?: string;\n  /**\n   * Visual tone: `surface` sits on the page background; `brand` renders the\n   * inverted primary band.\n   */\n  tone?: 'surface' | 'brand';\n  /** IntersectionObserver root margin tuning for the scroll spy. */\n  rootMargin?: string;\n  /** Called with the section id when a nav link is clicked. */\n  onItemClick?: (id: string) => void;\n  /** Called when the CTA is clicked (e.g. for analytics). */\n  onCtaClick?: (cta: SectionSpyCta) => void;\n  className?: string;\n}\n\n// =============================================================================\n// Internals\n// =============================================================================\n\n/** Directional glyph inferred from the destination. */\nfunction CtaArrow({ href }: { href: string }) {\n  const Icon = href.startsWith('#')\n    ? ArrowDown\n    : href.startsWith('/')\n      ? ArrowRight\n      : ArrowUpRight;\n  // rtl:-scale-x-100 mirrors ArrowRight and ArrowUpRight for RTL reading\n  // direction; ArrowDown is horizontally symmetric so the flip is a no-op.\n  return <Icon aria-hidden=\"true\" className=\"h-3.5 w-3.5 rtl:-scale-x-100\" />;\n}\n\nconst CTA_TIER_VARIANT = {\n  explore: 'ghost',\n  evaluate: 'outline',\n  commit: 'primary',\n} as const;\n\n// =============================================================================\n// SectionSpyNav\n// =============================================================================\n\n/**\n * Sticky horizontal in-page wayfinding: jumps between a page's major\n * sections, highlights the one in view with a sliding underline, and can\n * carry a single page-specific next-step CTA. Pure anchor links, so it\n * still works if the scroll spy never runs.\n *\n * The horizontal complement to `TableOfContents` — use that for a sidebar\n * outline, this for a band under the page header. Section elements need\n * matching `id`s.\n *\n * @example\n * ```tsx\n * <SectionSpyNav\n *   items={[\n *     { id: 'overview', label: 'Overview' },\n *     { id: 'pricing', label: 'Pricing' },\n *   ]}\n *   cta={{ label: 'Book a demo', href: '/demo', tier: 'evaluate' }}\n * />\n * ```\n */\nexport function SectionSpyNav({\n  items,\n  cta,\n  label = 'On this page',\n  tone = 'surface',\n  rootMargin = '-22% 0px -68% 0px',\n  onItemClick,\n  onCtaClick,\n  className,\n}: SectionSpyNavProps) {\n  const ids = React.useMemo(() => items.map((it) => it.id), [items]);\n  const { activeId } = useScrollSpy({ ids, rootMargin });\n  const active = activeId ?? items[0]?.id ?? '';\n\n  const railRef = React.useRef<HTMLDivElement>(null);\n  const markRef = React.useRef<HTMLSpanElement>(null);\n\n  // Find the active link by dataset rather than a CSS selector, so ids\n  // never need escaping and CSS.escape availability doesn't matter.\n  const findActiveLink = React.useCallback((): HTMLAnchorElement | null => {\n    const links = railRef.current?.querySelectorAll<HTMLAnchorElement>('a');\n    if (!links) return null;\n    for (const link of links) {\n      if (link.dataset.id === active) return link;\n    }\n    return null;\n  }, [active]);\n\n  // Slide the underline beneath the active link. offsetLeft/offsetWidth are\n  // physical and measured against the rail, so the marker tracks the link\n  // in both directions and while the rail is scrolled horizontally.\n  const syncMarker = React.useCallback(() => {\n    const link = findActiveLink();\n    const mark = markRef.current;\n    if (!link || !mark) return;\n    mark.style.left = `${link.offsetLeft}px`;\n    mark.style.width = `${link.offsetWidth}px`;\n  }, [findActiveLink]);\n\n  React.useEffect(() => {\n    const link = findActiveLink();\n    link?.scrollIntoView?.({ inline: 'center', block: 'nearest' });\n    syncMarker();\n  }, [findActiveLink, syncMarker]);\n\n  React.useEffect(() => {\n    window.addEventListener('resize', syncMarker);\n    return () => window.removeEventListener('resize', syncMarker);\n  }, [syncMarker]);\n\n  const brand = tone === 'brand';\n\n  return (\n    <nav\n      className={cn(\n        'sticky top-0 z-30 w-full',\n        brand\n          ? 'bg-primary-900 text-white'\n          : 'border-border bg-card/95 border-b backdrop-blur',\n        className\n      )}\n      aria-label={label}\n    >\n      <div className=\"flex items-center gap-4 px-4 py-0.5\">\n        <span\n          className={cn(\n            'shrink-0 text-[11px] font-semibold tracking-wide uppercase max-md:hidden',\n            brand ? 'text-white/85' : 'text-muted-foreground'\n          )}\n          aria-hidden=\"true\"\n        >\n          {label}\n        </span>\n        <div\n          ref={railRef}\n          className=\"relative flex min-w-0 flex-1 gap-1 overflow-x-auto [scrollbar-width:none] [&::-webkit-scrollbar]:hidden\"\n        >\n          {items.map((it) => {\n            const isActive = active === it.id;\n            return (\n              <a\n                key={it.id}\n                href={`#${it.id}`}\n                data-id={it.id}\n                onClick={() => onItemClick?.(it.id)}\n                className={cn(\n                  'shrink-0 rounded px-2.5 py-2 text-sm whitespace-nowrap transition-colors',\n                  brand\n                    ? isActive\n                      ? 'font-semibold text-white'\n                      : 'text-white/85 hover:text-white'\n                    : isActive\n                      ? 'text-foreground font-semibold'\n                      : 'text-muted-foreground hover:text-foreground'\n                )}\n                aria-current={isActive ? 'location' : undefined}\n              >\n                {it.label}\n              </a>\n            );\n          })}\n          <span\n            ref={markRef}\n            className={cn(\n              'absolute bottom-0 h-0.5 rounded-full transition-[left,width] duration-300',\n              brand ? 'bg-primary-400' : 'bg-primary-500'\n            )}\n            aria-hidden=\"true\"\n          />\n        </div>\n        {cta && (\n          <a\n            href={cta.href}\n            onClick={() => onCtaClick?.(cta)}\n            className={cn(\n              buttonVariants({\n                variant: CTA_TIER_VARIANT[cta.tier ?? 'explore'],\n                size: 'sm',\n              }),\n              'shrink-0',\n              brand &&\n                (cta.tier ?? 'explore') !== 'commit' &&\n                'text-white hover:bg-white/10 hover:text-white'\n            )}\n          >\n            {cta.label}\n            <CtaArrow href={cta.href} />\n          </a>\n        )}\n      </div>\n    </nav>\n  );\n}\n"]}

package/dist/{chunk-3YFJBUX4.js → chunk-CXEKSA7I.js}

@@ -1,4 +1,4 @@
-import { notifyComposerMigrationOnce, DragDropZone, ChatComposer, DEFAULT_MAX_FILE_SIZE, DEFAULT_ACCEPTED_FILE_TYPES, CameraButton } from './chunk-4CXGT3P7.js';
+import { notifyComposerMigrationOnce, DragDropZone, ChatComposer, DEFAULT_MAX_FILE_SIZE, DEFAULT_ACCEPTED_FILE_TYPES, CameraButton } from './chunk-QR7EG7YH.js';
 import { cn } from './chunk-TQONQSJO.js';
 import * as React from 'react';
 import { cva } from 'class-variance-authority';
@@ -2043,5 +2043,5 @@ function MessagingSplitView({
 MessagingSplitView.displayName = "MessagingSplitView";
 
 export { AttachmentPreview, ConversationHeader, ConversationListItem, ConversationListSkeleton, DateSeparator, EmptyState, LightboxModal, LoadMoreButton, MessageBubble, MessageList, MessageStatusIcon, MessageThread, MessagingSplitView, ReadReceiptIndicator, SkeletonMessage, TypingIndicator, bubbleVariants, formatDateLabel, formatFileSize, formatLastSeen, getConversationSubtitle, getConversationTitle, groupMessagesByDate, headerVariants, isSameSenderGroup, useMessageScroll, useMessages, useReadReceipts, useTypingEmulation, useTypingIndicator };
-//# sourceMappingURL=chunk-3YFJBUX4.js.map
-//# sourceMappingURL=chunk-3YFJBUX4.js.map
+//# sourceMappingURL=chunk-CXEKSA7I.js.map
+//# sourceMappingURL=chunk-CXEKSA7I.js.map