@mcp-b/react-components 0.40.0 → 0.41.0

package/dist/styles/agent-activity-preview.css

@@ -1,209 +0,0 @@
-.agent-activity-preview {
-  position: relative;
-  width: min(28rem, 100%);
-  min-width: 0;
-  padding: var(--sigvelo-spacing-2);
-  border-radius: var(--sigvelo-radius-lg);
-  color: var(--sigvelo-color-text);
-  background: var(--sigvelo-color-surface-raised);
-  box-shadow: var(--sigvelo-elevation-raised);
-}
-
-.agent-activity-preview__badge {
-  position: absolute;
-  inset-block-start: calc(-1 * var(--sigvelo-spacing-2));
-  inset-inline-end: var(--sigvelo-spacing-1);
-  display: grid;
-  place-items: center;
-  width: var(--sigvelo-control-height-sm);
-  height: var(--sigvelo-control-height-sm);
-  border-radius: var(--sigvelo-radius-full);
-  color: var(--sigvelo-color-primary-text);
-  background: var(--sigvelo-color-surface-raised);
-  box-shadow: var(--sigvelo-elevation-raised);
-}
-
-.agent-activity-preview__badge > svg {
-  width: var(--sigvelo-control-icon-size-md);
-  height: var(--sigvelo-control-icon-size-md);
-}
-
-.agent-activity-preview__dismiss {
-  position: absolute;
-  z-index: 1;
-  inset-block-start: calc(-1 * var(--sigvelo-spacing-2));
-  inset-inline-end: var(--sigvelo-spacing-1);
-  border-radius: var(--sigvelo-radius-full);
-  color: var(--sigvelo-color-text-muted);
-  background: var(--sigvelo-color-surface-raised);
-  box-shadow: var(--sigvelo-elevation-raised);
-  opacity: 0;
-  scale: 0.92;
-  transition:
-    color var(--sigvelo-duration-fast) var(--sigvelo-ease-standard),
-    opacity var(--sigvelo-duration-fast) var(--sigvelo-ease-standard),
-    scale var(--sigvelo-duration-fast) var(--sigvelo-ease-standard);
-}
-
-.agent-activity-preview:hover .agent-activity-preview__dismiss,
-.agent-activity-preview:focus-within .agent-activity-preview__dismiss,
-.agent-activity-preview__dismiss:focus-visible {
-  opacity: 1;
-  scale: 1;
-}
-
-.agent-activity-preview__dismiss:hover:not([data-disabled]) {
-  color: var(--sigvelo-color-text);
-  background: var(--sigvelo-color-surface-raised);
-}
-
-.agent-activity-preview__row:focus-visible,
-.agent-activity-preview__file-action:focus-visible {
-  outline: none;
-  box-shadow: var(--sigvelo-recipe-focus-shadow);
-}
-
-.agent-activity-preview__list {
-  display: grid;
-  gap: var(--sigvelo-spacing-0-5);
-  max-height: min(18rem, 60dvh);
-  padding: 0;
-  margin: 0;
-  overflow-y: auto;
-  list-style: none;
-}
-
-.agent-activity-preview__item {
-  display: grid;
-  grid-template-columns: minmax(0, 1fr) auto;
-  align-items: stretch;
-  gap: var(--sigvelo-spacing-0-5);
-  min-width: 0;
-}
-
-.agent-activity-preview__item:first-child {
-  padding-inline-end: calc(var(--sigvelo-spacing-8) + var(--sigvelo-spacing-0-5));
-}
-
-.agent-activity-preview__row {
-  display: block;
-  width: 100%;
-  min-width: 0;
-  min-height: var(--sigvelo-control-height-sm);
-  padding: var(--sigvelo-spacing-1-5);
-  border: 0;
-  border-radius: var(--sigvelo-radius-md);
-  color: inherit;
-  background: transparent;
-  font: inherit;
-  text-decoration: none;
-  cursor: pointer;
-  transition:
-    background-color var(--sigvelo-duration-fast) var(--sigvelo-ease-standard),
-    transform var(--sigvelo-duration-fast) var(--sigvelo-ease-standard);
-}
-
-.agent-activity-preview__row:hover {
-  background: var(--sigvelo-color-neutral-bg-subtle);
-  transform: translateY(-1px);
-}
-
-.agent-activity-preview__file-action {
-  display: grid;
-  place-items: center;
-  min-width: var(--sigvelo-control-height-sm);
-  min-height: var(--sigvelo-control-height-sm);
-  padding: var(--sigvelo-spacing-1-5);
-  border: 0;
-  border-radius: var(--sigvelo-radius-md);
-  color: var(--sigvelo-color-text-muted);
-  background: transparent;
-  text-decoration: none;
-  cursor: pointer;
-  transition:
-    color var(--sigvelo-duration-fast) var(--sigvelo-ease-standard),
-    background-color var(--sigvelo-duration-fast) var(--sigvelo-ease-standard);
-}
-
-.agent-activity-preview__file-action:hover {
-  color: var(--sigvelo-color-text);
-  background: var(--sigvelo-color-neutral-bg-subtle);
-}
-
-.agent-activity-preview__file-action > svg {
-  width: var(--sigvelo-control-icon-size-md);
-  height: var(--sigvelo-control-icon-size-md);
-}
-
-.agent-activity-preview__row .activity__header {
-  gap: var(--sigvelo-spacing-2);
-}
-
-.agent-activity-preview__row .activity__header-action {
-  max-width: none;
-}
-
-.agent-activity-preview__trailing {
-  display: flex;
-  flex: none;
-  align-items: center;
-  gap: var(--sigvelo-spacing-2);
-  min-width: 1rem;
-}
-
-.agent-activity-preview__trailing > svg {
-  width: var(--sigvelo-control-icon-size-md);
-  height: var(--sigvelo-control-icon-size-md);
-}
-
-.agent-activity-preview__row[data-status="running"] .agent-activity-preview__trailing > svg,
-.agent-activity-preview__row[data-status="unviewed"] .agent-activity-preview__trailing {
-  color: var(--sigvelo-color-primary-text);
-}
-
-.agent-activity-preview__row[data-status="input-required"] .agent-activity-preview__trailing > svg {
-  color: var(--sigvelo-color-warning-text);
-}
-
-.agent-activity-preview__unviewed-dot {
-  width: var(--sigvelo-spacing-2);
-  height: var(--sigvelo-spacing-2);
-  border-radius: var(--sigvelo-radius-full);
-  background: currentColor;
-}
-
-@media (pointer: coarse) {
-  .agent-activity-preview__dismiss {
-    opacity: 1;
-    scale: 1;
-  }
-
-  .agent-activity-preview__row,
-  .agent-activity-preview__file-action {
-    min-height: var(--sigvelo-control-height-xl);
-  }
-}
-
-@media (prefers-reduced-motion: reduce) {
-  .agent-activity-preview__dismiss,
-  .agent-activity-preview__row,
-  .agent-activity-preview__file-action {
-    transition: none;
-  }
-
-  .agent-activity-preview__row:hover {
-    transform: none;
-  }
-}
-
-@media (forced-colors: active) {
-  .agent-activity-preview {
-    outline: 1px solid CanvasText;
-  }
-
-  .agent-activity-preview__badge,
-  .agent-activity-preview__dismiss,
-  .agent-activity-preview__file-action {
-    border: var(--sigvelo-border-style) var(--sigvelo-border-width) CanvasText;
-  }
-}

package/dist/styles/badge.css

@@ -1,120 +0,0 @@
-.badge {
-  display: inline-flex;
-  flex-shrink: 0;
-  align-items: center;
-  justify-content: center;
-  gap: var(--sigvelo-spacing-1);
-  inline-size: fit-content;
-  overflow: hidden;
-  padding-block: var(--sigvelo-spacing-0-5);
-  padding-inline: var(--sigvelo-spacing-2);
-  font-family: inherit;
-  font-size: var(--sigvelo-text-xs);
-  font-weight: var(--sigvelo-font-weight-bold);
-  line-height: var(--sigvelo-leading-compact);
-  text-transform: uppercase;
-  letter-spacing: 0.025em;
-  border: var(--sigvelo-border-style) var(--sigvelo-border-width) transparent;
-  border-radius: var(--sigvelo-radius-full);
-  white-space: nowrap;
-  transition:
-    background-color var(--sigvelo-motion-duration-interaction) var(--sigvelo-motion-ease-change),
-    color var(--sigvelo-motion-duration-interaction) var(--sigvelo-motion-ease-change),
-    border-color var(--sigvelo-motion-duration-interaction) var(--sigvelo-motion-ease-change),
-    box-shadow var(--sigvelo-motion-duration-interaction) var(--sigvelo-motion-ease-change);
-}
-
-.badge:where(a, button) {
-  text-decoration: none;
-}
-
-.badge:focus-visible {
-  outline: none;
-  box-shadow: var(--sigvelo-recipe-focus-shadow);
-}
-
-.badge:is([aria-invalid="true"], [data-invalid]) {
-  border-color: var(--sigvelo-color-danger-bg);
-}
-
-.badge > svg {
-  flex-shrink: 0;
-  inline-size: var(--sigvelo-spacing-3);
-  block-size: var(--sigvelo-spacing-3);
-  pointer-events: none;
-}
-
-.badge--sm {
-  padding-block: calc(var(--sigvelo-spacing-0-5) / 2);
-  padding-inline: var(--sigvelo-spacing-1-5);
-  font-size: var(--sigvelo-text-3xs);
-}
-
-/* Normal appearance */
-
-.badge--normal.badge--primary {
-  background-color: var(--sigvelo-color-primary-bg);
-  color: var(--sigvelo-color-primary-text-on-bg);
-}
-
-.badge--normal.badge--neutral {
-  background-color: var(--sigvelo-color-neutral-bg-subtle);
-  color: var(--sigvelo-color-neutral-text-on-subtle);
-}
-
-.badge--normal.badge--success {
-  background-color: var(--sigvelo-color-success-bg);
-  color: var(--sigvelo-color-success-text-on-bg);
-}
-
-.badge--normal.badge--warning {
-  background-color: var(--sigvelo-color-warning-bg);
-  color: var(--sigvelo-color-warning-text-on-bg);
-}
-
-.badge--normal.badge--destructive {
-  background-color: var(--sigvelo-color-danger-bg);
-  color: var(--sigvelo-color-danger-text-on-bg);
-}
-
-/* Outline appearance */
-
-.badge--outline {
-  background-color: transparent;
-  color: var(--sigvelo-color-text);
-  border-color: var(--sigvelo-color-neutral-border-muted);
-}
-
-/* Ghost appearance */
-
-.badge--ghost {
-  background-color: transparent;
-  color: var(--sigvelo-color-neutral-text-on-subtle);
-}
-
-.badge--ghost:where(a, button):hover {
-  background-color: color-mix(in oklab, transparent, var(--sigvelo-color-text) 5%);
-}
-
-/* Link appearance */
-
-.badge--link {
-  background-color: transparent;
-  color: var(--sigvelo-color-primary-text);
-  text-underline-offset: 4px;
-}
-
-.badge--link:where(a, button):hover {
-  text-decoration: underline;
-}
-
-@media (forced-colors: active) {
-  .badge {
-    border: var(--sigvelo-border-style) var(--sigvelo-border-width) ButtonText;
-  }
-
-  .badge--ghost,
-  .badge--link {
-    border-color: transparent;
-  }
-}

package/dist/styles/shell.css

@@ -1,122 +0,0 @@
-/* Shell Component */
-.shell {
-  display: flex;
-  flex-direction: column;
-  height: 100%;
-  min-height: 25rem;
-  border-radius: var(--sigvelo-radius-md);
-  border: var(--sigvelo-border-style) var(--sigvelo-border-width)
-    var(--sigvelo-color-neutral-border-subtle);
-  background: var(--sigvelo-color-surface-raised);
-  overflow: hidden;
-}
-
-.shell__header {
-  display: flex;
-  align-items: center;
-  padding: var(--sigvelo-spacing-3) var(--sigvelo-spacing-4);
-  background: var(--sigvelo-color-surface-sunken);
-  border-block-end: var(--sigvelo-border-style) var(--sigvelo-border-width)
-    var(--sigvelo-color-neutral-border-subtle);
-}
-
-.shell__heading {
-  margin: 0;
-  font-size: var(--sigvelo-text-sm);
-  font-weight: var(--sigvelo-font-weight-semibold);
-  color: var(--sigvelo-color-text);
-}
-
-.shell__body {
-  display: flex;
-  flex: 1;
-  min-height: 0;
-  position: relative;
-}
-
-/* Action Bar */
-.shell__action-bar {
-  display: flex;
-  flex-direction: column;
-  gap: var(--sigvelo-spacing-1);
-  padding: var(--sigvelo-spacing-2);
-  background: var(--sigvelo-color-surface-sunken);
-  border-inline-end: var(--sigvelo-border-style) var(--sigvelo-border-width)
-    var(--sigvelo-color-neutral-border-subtle);
-}
-
-.shell__action {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: var(--sigvelo-spacing-10);
-  height: var(--sigvelo-spacing-10);
-  padding: 0;
-  border: none;
-  border-radius: var(--sigvelo-radius-md);
-  background: transparent;
-  color: var(--sigvelo-color-text-muted);
-  cursor: pointer;
-  transition:
-    background-color var(--sigvelo-motion-duration-interaction) var(--sigvelo-motion-ease-change),
-    color var(--sigvelo-motion-duration-interaction) var(--sigvelo-motion-ease-change);
-}
-
-.shell__action:hover {
-  background: var(--sigvelo-color-surface-sunken);
-  color: var(--sigvelo-color-text);
-}
-
-.shell__action--active {
-  background: var(--sigvelo-color-primary-bg);
-  color: var(--sigvelo-color-primary-text-on-bg);
-}
-
-.shell__action--active:hover {
-  background: color-mix(in oklab, var(--sigvelo-color-primary-bg), black 5%);
-  color: var(--sigvelo-color-primary-text-on-bg);
-}
-
-.shell__action svg {
-  width: var(--sigvelo-spacing-5);
-  height: var(--sigvelo-spacing-5);
-}
-
-/* Panel */
-.shell__panel {
-  display: flex;
-  flex-direction: column;
-  width: 16.25rem;
-  max-width: 100%;
-  background: var(--sigvelo-color-surface-raised);
-  border-inline-end: var(--sigvelo-border-style) var(--sigvelo-border-width)
-    var(--sigvelo-color-neutral-border-subtle);
-  overflow: hidden;
-}
-
-.shell__panel[hidden] {
-  display: none;
-}
-
-.shell__panel-heading {
-  padding: var(--sigvelo-spacing-3) var(--sigvelo-spacing-4);
-  font-size: var(--sigvelo-text-sm);
-  font-weight: var(--sigvelo-font-weight-bold);
-  color: var(--sigvelo-color-text);
-  border-block-end: var(--sigvelo-border-style) var(--sigvelo-border-width)
-    var(--sigvelo-color-neutral-border-subtle);
-}
-
-.shell__panel-content {
-  flex: 1;
-  overflow-y: auto;
-  padding: var(--sigvelo-spacing-4);
-}
-
-/* Content */
-.shell__content {
-  flex: 1;
-  min-width: 0;
-  position: relative;
-  overflow: hidden;
-}

package/dist/styles/status-pill.css

@@ -1,39 +0,0 @@
-/*
- * The chip itself is `.badge`. Only the indicator lives here.
- */
-.status-pill__dot {
-  inline-size: var(--sigvelo-spacing-1-5);
-  block-size: var(--sigvelo-spacing-1-5);
-  flex-shrink: 0;
-  border-radius: var(--sigvelo-radius-circle);
-  /* currentColor, so the dot follows whichever badge color it was given rather
-     than needing a matching set of its own. */
-  background-color: currentColor;
-}
-
-.status-pill[data-busy] .status-pill__dot {
-  animation: sigvelo-status-pulse var(--sigvelo-motion-duration-pulse) ease-in-out infinite;
-}
-
-@keyframes sigvelo-status-pulse {
-  0%,
-  100% {
-    opacity: 1;
-  }
-
-  50% {
-    opacity: 0.4;
-  }
-}
-
-/* The dot stays; only its breathing stops. A still dot still reads as a state
-   indicator, which is the part carrying meaning. */
-@media (prefers-reduced-motion: reduce) {
-  .status-pill[data-busy] .status-pill__dot {
-    animation: none;
-  }
-}
-
-:root[data-motion="reduce"] .status-pill[data-busy] .status-pill__dot {
-  animation: none;
-}

package/dist/{ThinkChat-DkA4Wr71.js → ThinkChat-BES_3Mb-.js}

@@ -1,6 +1,6 @@
 import { TransitionSurface } from "./components/foundations/TransitionSurface.js";
-import { AgentToolRunsProvider, useOptionalAgentToolRuns, useSourceScopedAgentToolEvents } from "./components/agents-sdk/AgentToolRunsContext.js";
 import { AgentChat, compactingNotice } from "./components/agents-sdk/AgentChat.js";
+import { AgentToolRunsProvider, useOptionalAgentToolRuns, useSourceScopedAgentToolEvents } from "./components/agents-sdk/AgentToolRunsContext.js";
 import { SubagentRunList } from "./components/agents-sdk/SubagentRunList.js";
 import { ThinkChatContext, ThinkChatLiveContext, useOptionalThinkChatContext, useThinkChatContext } from "./components/agents-sdk/ThinkChatContext.js";
 import { ThinkChatActivity, createThinkChatActivityRenderer, renderThinkChatActivityPart } from "./components/agents-sdk/ThinkChatActivity.js";