{
  "name": "Viewership UI",
  "description": "A gallery of crafted, copy-in UI components for Astro: server-rendered markup, vanilla TypeScript behaviour, token-driven theming and accessibility built in.",
  "docs": {
    "llms": "https://viewership.ai/ui/llms.txt",
    "llmsFull": "https://viewership.ai/ui/llms-full.txt",
    "overview": "https://viewership.ai/ui/index.md",
    "conventions": "https://viewership.ai/ui/conventions.md",
    "foundations": "https://viewership.ai/ui/foundations.md",
    "foundationCss": "https://viewership.ai/ui/raw/foundation.css.txt"
  },
  "items": [
    {
      "slug": "button",
      "title": "Button",
      "description": "Pill-shaped action button in six variants and three sizes.",
      "kind": "atom",
      "category": "Actions",
      "source": "Beautiful UI",
      "dependencies": [],
      "files": [
        "Button.astro"
      ],
      "urls": {
        "page": "https://viewership.ai/ui/components/button",
        "markdown": "https://viewership.ai/ui/components/button.md",
        "json": "https://viewership.ai/ui/components/button.json",
        "bundle": "https://viewership.ai/ui/components/button.bundle.txt"
      }
    },
    {
      "slug": "glide-menu",
      "title": "Glide Menu",
      "description": "One highlight that glides to the hovered or focused row.",
      "kind": "atom",
      "category": "Navigation",
      "source": "Beautiful UI",
      "dependencies": [],
      "files": [
        "GlideMenu.astro",
        "glide-menu.ts"
      ],
      "urls": {
        "page": "https://viewership.ai/ui/components/glide-menu",
        "markdown": "https://viewership.ai/ui/components/glide-menu.md",
        "json": "https://viewership.ai/ui/components/glide-menu.json",
        "bundle": "https://viewership.ai/ui/components/glide-menu.bundle.txt"
      }
    },
    {
      "slug": "entity-chip",
      "title": "Entity Chip",
      "description": "Inline reference to a client, person or record, as a monogram and name.",
      "kind": "atom",
      "category": "Content",
      "source": "Beautiful UI",
      "dependencies": [],
      "files": [
        "EntityChip.astro",
        "Monogram.astro"
      ],
      "urls": {
        "page": "https://viewership.ai/ui/components/entity-chip",
        "markdown": "https://viewership.ai/ui/components/entity-chip.md",
        "json": "https://viewership.ai/ui/components/entity-chip.json",
        "bundle": "https://viewership.ai/ui/components/entity-chip.bundle.txt"
      }
    },
    {
      "slug": "value-pill",
      "title": "Value Pill",
      "description": "Inline badge that sets a value off from running text.",
      "kind": "atom",
      "category": "Content",
      "source": "Beautiful UI",
      "dependencies": [],
      "files": [
        "ValuePill.astro"
      ],
      "urls": {
        "page": "https://viewership.ai/ui/components/value-pill",
        "markdown": "https://viewership.ai/ui/components/value-pill.md",
        "json": "https://viewership.ai/ui/components/value-pill.json",
        "bundle": "https://viewership.ai/ui/components/value-pill.bundle.txt"
      }
    },
    {
      "slug": "shimmer",
      "title": "Shimmer",
      "description": "Label with a moving light sweep that shows the agent is working.",
      "kind": "atom",
      "category": "Feedback",
      "source": "Beautiful UI",
      "dependencies": [],
      "files": [
        "Shimmer.astro"
      ],
      "urls": {
        "page": "https://viewership.ai/ui/components/shimmer",
        "markdown": "https://viewership.ai/ui/components/shimmer.md",
        "json": "https://viewership.ai/ui/components/shimmer.json",
        "bundle": "https://viewership.ai/ui/components/shimmer.bundle.txt"
      }
    },
    {
      "slug": "stream-text",
      "title": "Stream Text",
      "description": "Text that streams in like model output, with a blurred edge and caret.",
      "kind": "atom",
      "category": "Feedback",
      "source": "Beautiful UI",
      "dependencies": [],
      "files": [
        "StreamText.astro",
        "stream-text.ts"
      ],
      "urls": {
        "page": "https://viewership.ai/ui/components/stream-text",
        "markdown": "https://viewership.ai/ui/components/stream-text.md",
        "json": "https://viewership.ai/ui/components/stream-text.json",
        "bundle": "https://viewership.ai/ui/components/stream-text.bundle.txt"
      }
    },
    {
      "slug": "chip",
      "title": "Chip",
      "description": "Monospace chip for code values and field names in text.",
      "kind": "atom",
      "category": "Content",
      "source": "Beautiful UI",
      "dependencies": [],
      "files": [
        "Chip.astro"
      ],
      "urls": {
        "page": "https://viewership.ai/ui/components/chip",
        "markdown": "https://viewership.ai/ui/components/chip.md",
        "json": "https://viewership.ai/ui/components/chip.json",
        "bundle": "https://viewership.ai/ui/components/chip.bundle.txt"
      }
    },
    {
      "slug": "status-pill",
      "title": "Status Pill",
      "description": "Tinted status label with a leading dot, in five tones.",
      "kind": "atom",
      "category": "Feedback",
      "source": "Beautiful UI",
      "dependencies": [],
      "files": [
        "StatusPill.astro"
      ],
      "urls": {
        "page": "https://viewership.ai/ui/components/status-pill",
        "markdown": "https://viewership.ai/ui/components/status-pill.md",
        "json": "https://viewership.ai/ui/components/status-pill.json",
        "bundle": "https://viewership.ai/ui/components/status-pill.bundle.txt"
      }
    },
    {
      "slug": "segmented-control",
      "title": "Segmented Control",
      "description": "Equal-width segments with a sliding thumb, as a radio group.",
      "kind": "atom",
      "category": "Inputs",
      "source": "Beautiful UI",
      "dependencies": [],
      "files": [
        "SegmentedControl.astro"
      ],
      "urls": {
        "page": "https://viewership.ai/ui/components/segmented-control",
        "markdown": "https://viewership.ai/ui/components/segmented-control.md",
        "json": "https://viewership.ai/ui/components/segmented-control.json",
        "bundle": "https://viewership.ai/ui/components/segmented-control.bundle.txt"
      }
    },
    {
      "slug": "switch",
      "title": "Switch",
      "description": "On/off toggle on a native checkbox, in two sizes and two tones.",
      "kind": "atom",
      "category": "Inputs",
      "source": "Beautiful UI",
      "dependencies": [],
      "files": [
        "Switch.astro"
      ],
      "urls": {
        "page": "https://viewership.ai/ui/components/switch",
        "markdown": "https://viewership.ai/ui/components/switch.md",
        "json": "https://viewership.ai/ui/components/switch.json",
        "bundle": "https://viewership.ai/ui/components/switch.bundle.txt"
      }
    },
    {
      "slug": "progress-ring",
      "title": "Progress Ring",
      "description": "Small progress ring with a count or glyph in the center.",
      "kind": "atom",
      "category": "Data",
      "source": "Beautiful UI",
      "dependencies": [],
      "files": [
        "ProgressRing.astro",
        "progress-ring.ts"
      ],
      "urls": {
        "page": "https://viewership.ai/ui/components/progress-ring",
        "markdown": "https://viewership.ai/ui/components/progress-ring.md",
        "json": "https://viewership.ai/ui/components/progress-ring.json",
        "bundle": "https://viewership.ai/ui/components/progress-ring.bundle.txt"
      }
    },
    {
      "slug": "text-row",
      "title": "Text Row",
      "description": "Label on the left, value and optional meta on the right.",
      "kind": "atom",
      "category": "Data",
      "source": "Beautiful UI",
      "dependencies": [],
      "files": [
        "TextRow.astro"
      ],
      "urls": {
        "page": "https://viewership.ai/ui/components/text-row",
        "markdown": "https://viewership.ai/ui/components/text-row.md",
        "json": "https://viewership.ai/ui/components/text-row.json",
        "bundle": "https://viewership.ai/ui/components/text-row.bundle.txt"
      }
    },
    {
      "slug": "overlay",
      "title": "Overlay core",
      "description": "Positioning, dismissal, focus-trap and roving-focus helpers for popovers, menus and dialogs.",
      "kind": "atom",
      "category": "Overlays",
      "source": "Viewership UI",
      "dependencies": [],
      "files": [
        "overlay.ts"
      ],
      "urls": {
        "page": "https://viewership.ai/ui/components/overlay",
        "markdown": "https://viewership.ai/ui/components/overlay.md",
        "json": "https://viewership.ai/ui/components/overlay.json",
        "bundle": "https://viewership.ai/ui/components/overlay.bundle.txt"
      }
    },
    {
      "slug": "loading-state",
      "title": "Loading State",
      "description": "Pixel-grid loader with a shimmering label and elapsed timer.",
      "kind": "component",
      "category": "Feedback",
      "source": "Beautiful UI",
      "dependencies": [],
      "files": [
        "LoadingState.astro"
      ],
      "urls": {
        "page": "https://viewership.ai/ui/components/loading-state",
        "markdown": "https://viewership.ai/ui/components/loading-state.md",
        "json": "https://viewership.ai/ui/components/loading-state.json",
        "bundle": "https://viewership.ai/ui/components/loading-state.bundle.txt"
      }
    },
    {
      "slug": "thinking-state",
      "title": "Thinking",
      "description": "Expandable agent trace for steps, reasoning, search or tool calls.",
      "kind": "component",
      "category": "Agent",
      "source": "Beautiful UI",
      "dependencies": [],
      "files": [
        "ThinkingState.astro"
      ],
      "urls": {
        "page": "https://viewership.ai/ui/components/thinking-state",
        "markdown": "https://viewership.ai/ui/components/thinking-state.md",
        "json": "https://viewership.ai/ui/components/thinking-state.json",
        "bundle": "https://viewership.ai/ui/components/thinking-state.bundle.txt"
      }
    },
    {
      "slug": "streaming-text",
      "title": "Streaming Text",
      "description": "Streamed answer with inline citations, sources, actions and follow-ups.",
      "kind": "component",
      "category": "Agent",
      "source": "Beautiful UI",
      "dependencies": [],
      "files": [
        "StreamingText.astro"
      ],
      "urls": {
        "page": "https://viewership.ai/ui/components/streaming-text",
        "markdown": "https://viewership.ai/ui/components/streaming-text.md",
        "json": "https://viewership.ai/ui/components/streaming-text.json",
        "bundle": "https://viewership.ai/ui/components/streaming-text.bundle.txt"
      }
    },
    {
      "slug": "approval-card",
      "title": "Approval Card",
      "description": "Questions an agent asks, one step at a time, before acting.",
      "kind": "component",
      "category": "Agent",
      "source": "Beautiful UI",
      "dependencies": [
        "button",
        "glide-menu"
      ],
      "files": [
        "ApprovalCard.astro"
      ],
      "urls": {
        "page": "https://viewership.ai/ui/components/approval-card",
        "markdown": "https://viewership.ai/ui/components/approval-card.md",
        "json": "https://viewership.ai/ui/components/approval-card.json",
        "bundle": "https://viewership.ai/ui/components/approval-card.bundle.txt"
      }
    },
    {
      "slug": "tool-chips",
      "title": "Tool Chips",
      "description": "Agent run as expandable tool-call rows, then file-diff chips.",
      "kind": "component",
      "category": "Agent",
      "source": "Beautiful UI",
      "dependencies": [],
      "files": [
        "ToolChips.astro"
      ],
      "urls": {
        "page": "https://viewership.ai/ui/components/tool-chips",
        "markdown": "https://viewership.ai/ui/components/tool-chips.md",
        "json": "https://viewership.ai/ui/components/tool-chips.json",
        "bundle": "https://viewership.ai/ui/components/tool-chips.bundle.txt"
      }
    },
    {
      "slug": "task-rows",
      "title": "Task Rows",
      "description": "Live agent task status as expandable capsules or a list.",
      "kind": "component",
      "category": "Agent",
      "source": "Beautiful UI",
      "dependencies": [],
      "files": [
        "TaskRows.astro"
      ],
      "urls": {
        "page": "https://viewership.ai/ui/components/task-rows",
        "markdown": "https://viewership.ai/ui/components/task-rows.md",
        "json": "https://viewership.ai/ui/components/task-rows.json",
        "bundle": "https://viewership.ai/ui/components/task-rows.bundle.txt"
      }
    },
    {
      "slug": "chat-composer",
      "title": "Chat",
      "description": "Tabbed chat panel with reasoning replies and a growing composer.",
      "kind": "component",
      "category": "Agent",
      "source": "Beautiful UI",
      "dependencies": [],
      "files": [
        "ChatComposer.astro"
      ],
      "urls": {
        "page": "https://viewership.ai/ui/components/chat-composer",
        "markdown": "https://viewership.ai/ui/components/chat-composer.md",
        "json": "https://viewership.ai/ui/components/chat-composer.json",
        "bundle": "https://viewership.ai/ui/components/chat-composer.bundle.txt"
      }
    },
    {
      "slug": "prompt-bar",
      "title": "Prompt Bar",
      "description": "Message composer with @ sources, / commands and a model picker.",
      "kind": "component",
      "category": "Agent",
      "source": "Beautiful UI",
      "dependencies": [
        "glide-menu"
      ],
      "files": [
        "PromptBar.astro"
      ],
      "urls": {
        "page": "https://viewership.ai/ui/components/prompt-bar",
        "markdown": "https://viewership.ai/ui/components/prompt-bar.md",
        "json": "https://viewership.ai/ui/components/prompt-bar.json",
        "bundle": "https://viewership.ai/ui/components/prompt-bar.bundle.txt"
      }
    },
    {
      "slug": "recommendation-card",
      "title": "Recommendation Card",
      "description": "Agent suggestion with a confidence meter and alternatives.",
      "kind": "component",
      "category": "Agent",
      "source": "Beautiful UI",
      "dependencies": [
        "button",
        "entity-chip",
        "value-pill"
      ],
      "files": [
        "RecommendationCard.astro"
      ],
      "urls": {
        "page": "https://viewership.ai/ui/components/recommendation-card",
        "markdown": "https://viewership.ai/ui/components/recommendation-card.md",
        "json": "https://viewership.ai/ui/components/recommendation-card.json",
        "bundle": "https://viewership.ai/ui/components/recommendation-card.bundle.txt"
      }
    },
    {
      "slug": "context-cards",
      "title": "Context Cards",
      "description": "Retrieved knowledge chunks with sources, entering in sequence.",
      "kind": "component",
      "category": "Agent",
      "source": "Beautiful UI",
      "dependencies": [],
      "files": [
        "ContextCards.astro"
      ],
      "urls": {
        "page": "https://viewership.ai/ui/components/context-cards",
        "markdown": "https://viewership.ai/ui/components/context-cards.md",
        "json": "https://viewership.ai/ui/components/context-cards.json",
        "bundle": "https://viewership.ai/ui/components/context-cards.bundle.txt"
      }
    },
    {
      "slug": "diff-table",
      "title": "Diff Table",
      "description": "AI-proposed table edits you include or skip, then apply.",
      "kind": "component",
      "category": "Data",
      "source": "Beautiful UI",
      "dependencies": [
        "button"
      ],
      "files": [
        "DiffTable.astro"
      ],
      "urls": {
        "page": "https://viewership.ai/ui/components/diff-table",
        "markdown": "https://viewership.ai/ui/components/diff-table.md",
        "json": "https://viewership.ai/ui/components/diff-table.json",
        "bundle": "https://viewership.ai/ui/components/diff-table.bundle.txt"
      }
    },
    {
      "slug": "records-table",
      "title": "Records Table",
      "description": "CRM-style AI spreadsheet with tags, sorting and configurable AI columns.",
      "kind": "component",
      "category": "Data",
      "source": "Beautiful UI",
      "dependencies": [
        "glide-menu",
        "switch"
      ],
      "files": [
        "RecordsTable.astro"
      ],
      "urls": {
        "page": "https://viewership.ai/ui/components/records-table",
        "markdown": "https://viewership.ai/ui/components/records-table.md",
        "json": "https://viewership.ai/ui/components/records-table.json",
        "bundle": "https://viewership.ai/ui/components/records-table.bundle.txt"
      }
    },
    {
      "slug": "filter-table",
      "title": "Filter Table",
      "description": "Status chips that filter a table in place.",
      "kind": "component",
      "category": "Data",
      "source": "Beautiful UI",
      "dependencies": [],
      "files": [
        "FilterTable.astro"
      ],
      "urls": {
        "page": "https://viewership.ai/ui/components/filter-table",
        "markdown": "https://viewership.ai/ui/components/filter-table.md",
        "json": "https://viewership.ai/ui/components/filter-table.json",
        "bundle": "https://viewership.ai/ui/components/filter-table.bundle.txt"
      }
    },
    {
      "slug": "sidebar-nav",
      "title": "Sidebar Nav",
      "description": "Collapsible workspace and chat navigation with searchable history.",
      "kind": "component",
      "category": "Navigation",
      "source": "Beautiful UI",
      "dependencies": [
        "glide-menu"
      ],
      "files": [
        "SidebarNav.astro"
      ],
      "urls": {
        "page": "https://viewership.ai/ui/components/sidebar-nav",
        "markdown": "https://viewership.ai/ui/components/sidebar-nav.md",
        "json": "https://viewership.ai/ui/components/sidebar-nav.json",
        "bundle": "https://viewership.ai/ui/components/sidebar-nav.bundle.txt"
      }
    },
    {
      "slug": "search",
      "title": "Search",
      "description": "Command search with live filtering and an empty state.",
      "kind": "component",
      "category": "Navigation",
      "source": "Beautiful UI",
      "dependencies": [
        "glide-menu"
      ],
      "files": [
        "SearchList.astro"
      ],
      "urls": {
        "page": "https://viewership.ai/ui/components/search",
        "markdown": "https://viewership.ai/ui/components/search.md",
        "json": "https://viewership.ai/ui/components/search.json",
        "bundle": "https://viewership.ai/ui/components/search.bundle.txt"
      }
    },
    {
      "slug": "flowchart",
      "title": "Flowchart",
      "description": "Workflow trigger and condition cards on a dotted canvas with draggable steps.",
      "kind": "component",
      "category": "Data",
      "source": "Beautiful UI",
      "dependencies": [],
      "files": [
        "Flowchart.astro",
        "layout.ts"
      ],
      "urls": {
        "page": "https://viewership.ai/ui/components/flowchart",
        "markdown": "https://viewership.ai/ui/components/flowchart.md",
        "json": "https://viewership.ai/ui/components/flowchart.json",
        "bundle": "https://viewership.ai/ui/components/flowchart.bundle.txt"
      }
    },
    {
      "slug": "insight-cards",
      "title": "Insight Cards",
      "description": "Paged agent insights with scrubbable SVG charts and follow-up prompts.",
      "kind": "component",
      "category": "Data",
      "source": "Beautiful UI",
      "dependencies": [],
      "files": [
        "InsightCards.astro",
        "insight-chart.ts"
      ],
      "urls": {
        "page": "https://viewership.ai/ui/components/insight-cards",
        "markdown": "https://viewership.ai/ui/components/insight-cards.md",
        "json": "https://viewership.ai/ui/components/insight-cards.json",
        "bundle": "https://viewership.ai/ui/components/insight-cards.bundle.txt"
      }
    },
    {
      "slug": "code-block",
      "title": "Code Block",
      "description": "Line-numbered code listing with copy, or a unified diff.",
      "kind": "component",
      "category": "Content",
      "source": "Beautiful UI",
      "dependencies": [],
      "files": [
        "CodeBlock.astro",
        "highlight.ts"
      ],
      "urls": {
        "page": "https://viewership.ai/ui/components/code-block",
        "markdown": "https://viewership.ai/ui/components/code-block.md",
        "json": "https://viewership.ai/ui/components/code-block.json",
        "bundle": "https://viewership.ai/ui/components/code-block.bundle.txt"
      }
    },
    {
      "slug": "fine-tune-card",
      "title": "Fine-tune Card",
      "description": "Compact inspector the agent adjusts, then hands back to you.",
      "kind": "component",
      "category": "Agent",
      "source": "Beautiful UI",
      "dependencies": [
        "glide-menu"
      ],
      "files": [
        "FineTuneCard.astro"
      ],
      "urls": {
        "page": "https://viewership.ai/ui/components/fine-tune-card",
        "markdown": "https://viewership.ai/ui/components/fine-tune-card.md",
        "json": "https://viewership.ai/ui/components/fine-tune-card.json",
        "bundle": "https://viewership.ai/ui/components/fine-tune-card.bundle.txt"
      }
    },
    {
      "slug": "selection-actions",
      "title": "Selection Actions",
      "description": "Select text and a floating toolbar rewrites it in place.",
      "kind": "component",
      "category": "Agent",
      "source": "Beautiful UI",
      "dependencies": [
        "button",
        "shimmer",
        "stream-text"
      ],
      "files": [
        "SelectionActions.astro"
      ],
      "urls": {
        "page": "https://viewership.ai/ui/components/selection-actions",
        "markdown": "https://viewership.ai/ui/components/selection-actions.md",
        "json": "https://viewership.ai/ui/components/selection-actions.json",
        "bundle": "https://viewership.ai/ui/components/selection-actions.bundle.txt"
      }
    },
    {
      "slug": "agent-screen",
      "title": "Agent Screen",
      "description": "An agent's live screen with an expandable viewer and recording.",
      "kind": "component",
      "category": "Agent",
      "source": "Beautiful UI",
      "dependencies": [
        "button"
      ],
      "files": [
        "AgentScreen.astro"
      ],
      "urls": {
        "page": "https://viewership.ai/ui/components/agent-screen",
        "markdown": "https://viewership.ai/ui/components/agent-screen.md",
        "json": "https://viewership.ai/ui/components/agent-screen.json",
        "bundle": "https://viewership.ai/ui/components/agent-screen.bundle.txt"
      }
    }
  ]
}