@mcp-b/react-components 0.19.0 → 0.20.0

package/dist/styles/agent-chat.css

@@ -200,7 +200,7 @@
   margin: 0;
   overflow-wrap: anywhere;
   font-size: var(--sigvelo-text-sm);
-  line-height: 1.5;
+  line-height: var(--sigvelo-leading-normal);
 }
 
 .agent-chat__turn-error-actions {

package/dist/styles/agent-connection.css

@@ -36,7 +36,7 @@
   color: var(--sigvelo-color-text);
   font-size: var(--sigvelo-text-sm);
   font-weight: var(--sigvelo-font-weight-semibold);
-  line-height: 1.2;
+  line-height: var(--sigvelo-leading-tight);
   letter-spacing: 0;
 }
 
@@ -124,7 +124,7 @@
 .agent-connect .code-block__content,
 .agent-connect .code-block__content--highlighted pre.shiki {
   font-size: var(--sigvelo-text-xs);
-  line-height: 1.5;
+  line-height: var(--sigvelo-leading-normal);
 }
 
 .agent-connect__mcp-form {
@@ -145,7 +145,7 @@
   color: var(--sigvelo-color-text-muted);
   font-size: var(--sigvelo-text-xs);
   font-weight: var(--sigvelo-font-weight-semibold);
-  line-height: 1.25;
+  line-height: var(--sigvelo-leading-compact);
   overflow-wrap: anywhere;
 }
 

package/dist/styles/agent-tool-detail.css

@@ -30,7 +30,7 @@
   overflow-wrap: anywhere;
   color: var(--sigvelo-color-text-muted);
   font-size: var(--sigvelo-text-xs);
-  line-height: 1.5;
+  line-height: var(--sigvelo-leading-normal);
 }
 
 .agent-tool-detail__error {

package/dist/styles/alert-dialog.css

@@ -28,32 +28,11 @@
   inset-block-start: 50%;
   inset-inline-start: 50%;
   translate: -50% -50%;
-  scale: 1;
   z-index: 50;
   inline-size: calc(100% - var(--sigvelo-control-height-sm));
   max-inline-size: 28rem;
   max-block-size: calc(100dvb - var(--sigvelo-control-height-sm));
   overflow-block: auto;
-  transition:
-    opacity var(--sigvelo-motion-duration-presence) var(--sigvelo-motion-ease-change),
-    scale var(--sigvelo-motion-duration-presence) var(--sigvelo-motion-ease-enter);
-}
-
-.alert-dialog__popup[data-starting-style],
-.alert-dialog__popup[data-ending-style] {
-  opacity: 0;
-  scale: var(--sigvelo-motion-presence-scale);
-}
-
-:root[data-motion="reduce"] .alert-dialog__popup:is([data-starting-style], [data-ending-style]) {
-  scale: 1;
-}
-
-@media (prefers-reduced-motion: reduce) {
-  .alert-dialog__popup[data-starting-style],
-  .alert-dialog__popup[data-ending-style] {
-    scale: 1;
-  }
 }
 
 .alert-dialog__popup--sm {
@@ -67,7 +46,7 @@
 .alert-dialog__title {
   font-size: var(--sigvelo-text-base);
   font-weight: var(--sigvelo-font-weight-semibold);
-  line-height: 1.25;
+  line-height: var(--sigvelo-leading-compact);
   color: var(--sigvelo-color-text);
   margin: 0 0 var(--sigvelo-spacing-1);
   text-wrap: balance;
@@ -87,91 +66,6 @@
   margin-block-end: var(--sigvelo-spacing-3);
 }
 
-.alert-dialog__footer {
-  display: flex;
-  flex-wrap: wrap;
-  justify-content: flex-end;
-  gap: var(--sigvelo-spacing-2);
-}
-
 .alert-dialog__media {
   margin-block-end: var(--sigvelo-spacing-3);
 }
-
-.alert-dialog__action {
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  min-block-size: var(--sigvelo-recipe-control-height);
-  padding-block: 0;
-  padding-inline: var(--sigvelo-recipe-control-padding-inline);
-  font-family: inherit;
-  font-size: var(--sigvelo-recipe-control-font-size);
-  font-weight: var(--sigvelo-font-weight-semibold);
-  border: none;
-  border-radius: var(--sigvelo-radius-md);
-  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),
-    opacity var(--sigvelo-motion-duration-interaction) var(--sigvelo-motion-ease-change);
-}
-
-.alert-dialog__action:focus-visible {
-  outline: none;
-  box-shadow: var(--sigvelo-recipe-focus-shadow);
-}
-
-.alert-dialog__action:disabled {
-  cursor: not-allowed;
-  opacity: var(--sigvelo-recipe-disabled-opacity);
-}
-
-.alert-dialog__action--primary {
-  background-color: var(--sigvelo-color-primary-bg);
-  color: var(--sigvelo-color-primary-text-on-bg);
-}
-
-.alert-dialog__action--primary:hover:not(:disabled) {
-  background-color: color-mix(in oklab, var(--sigvelo-color-primary-bg), transparent 10%);
-}
-
-.alert-dialog__action--secondary {
-  background-color: var(--sigvelo-color-neutral-bg-subtle);
-  color: var(--sigvelo-color-neutral-text-on-subtle);
-}
-
-.alert-dialog__action--secondary:hover:not(:disabled) {
-  background-color: color-mix(in oklab, var(--sigvelo-color-neutral-bg-subtle), transparent 20%);
-}
-
-.alert-dialog__action--destructive {
-  background-color: var(--sigvelo-color-danger-bg);
-  color: var(--sigvelo-color-danger-text-on-bg);
-}
-
-.alert-dialog__action--destructive:hover:not(:disabled) {
-  background-color: color-mix(in oklab, var(--sigvelo-color-danger-bg), transparent 10%);
-}
-
-.alert-dialog__action--outline {
-  background-color: transparent;
-  color: var(--sigvelo-color-text);
-  border: var(--sigvelo-border-style) var(--sigvelo-border-width)
-    var(--sigvelo-color-neutral-border-muted);
-}
-
-.alert-dialog__action--outline:hover:not(:disabled) {
-  background-color: var(--sigvelo-color-neutral-bg-subtle);
-  color: var(--sigvelo-color-neutral-text-on-subtle);
-}
-
-.alert-dialog__action--ghost {
-  background-color: transparent;
-  color: var(--sigvelo-color-text);
-}
-
-.alert-dialog__action--ghost:hover:not(:disabled) {
-  background-color: var(--sigvelo-color-neutral-bg-subtle);
-  color: var(--sigvelo-color-neutral-text-on-subtle);
-}

package/dist/styles/approval.css

@@ -44,7 +44,7 @@
   color: var(--sigvelo-color-text-muted);
   font-family: var(--sigvelo-font-mono);
   font-size: var(--sigvelo-text-xs);
-  line-height: 1.5;
+  line-height: var(--sigvelo-leading-normal);
 }
 
 .approval__preview-key {

package/dist/styles/artifact.css

@@ -53,16 +53,11 @@
   flex-shrink: 0;
 }
 
-.artifact__action,
-.artifact__close {
-  /* Inherits from Button variant=ghost size=icon; overrides only when needed */
-}
-
 .artifact__content {
   padding-block: var(--sigvelo-spacing-4);
   padding-inline: var(--sigvelo-spacing-4);
   font-size: var(--sigvelo-text-sm);
-  line-height: 1.5;
+  line-height: var(--sigvelo-leading-normal);
   overflow-wrap: anywhere;
 }
 

package/dist/styles/badge.css

@@ -11,7 +11,7 @@
   font-family: inherit;
   font-size: var(--sigvelo-text-xs);
   font-weight: var(--sigvelo-font-weight-bold);
-  line-height: 1.25;
+  line-height: var(--sigvelo-leading-compact);
   text-transform: uppercase;
   letter-spacing: 0.025em;
   border: var(--sigvelo-border-style) var(--sigvelo-border-width) transparent;
@@ -33,7 +33,7 @@
   box-shadow: var(--sigvelo-recipe-focus-shadow);
 }
 
-.badge:is([aria-invalid="true"], [data-invalid="true"], [data-invalid=""]) {
+.badge:is([aria-invalid="true"], [data-invalid]) {
   border-color: var(--sigvelo-color-danger-bg);
 }
 

package/dist/styles/base-ui-motion.css

@@ -24,23 +24,30 @@
   }
 }
 
-.base-ui-popup {
-  transform-origin: var(--transform-origin);
-  translate: 0;
+.base-ui-popup,
+.base-ui-modal-popup {
   scale: 1;
   transition:
     opacity var(--sigvelo-motion-duration-presence) var(--sigvelo-motion-ease-change),
-    scale var(--sigvelo-motion-duration-presence) var(--sigvelo-motion-ease-enter),
-    translate var(--sigvelo-motion-duration-presence) var(--sigvelo-motion-ease-enter);
+    scale var(--sigvelo-motion-duration-presence) var(--sigvelo-motion-ease-enter);
 }
 
-.base-ui-popup[data-starting-style],
-.base-ui-popup[data-ending-style] {
+.base-ui-popup {
+  transform-origin: var(--transform-origin);
+  translate: 0;
+  transition-property: opacity, scale, translate;
+  transition-duration: var(--sigvelo-motion-duration-presence);
+  transition-timing-function:
+    var(--sigvelo-motion-ease-change), var(--sigvelo-motion-ease-enter),
+    var(--sigvelo-motion-ease-enter);
+}
+
+:is(.base-ui-popup, .base-ui-modal-popup):is([data-starting-style], [data-ending-style]) {
   opacity: 0;
   scale: var(--sigvelo-motion-presence-scale);
 }
 
-.base-ui-popup[data-ending-style] {
+:is(.base-ui-popup, .base-ui-modal-popup)[data-ending-style] {
   transition-timing-function: var(--sigvelo-motion-ease-exit);
 }
 
@@ -77,23 +84,29 @@
 }
 
 @media (prefers-reduced-motion: reduce) {
-  .base-ui-popup {
+  :is(.base-ui-popup, .base-ui-modal-popup) {
     transition-duration: var(--sigvelo-duration-reduced);
   }
 
-  .base-ui-popup[data-starting-style],
-  .base-ui-popup[data-ending-style] {
+  :is(.base-ui-popup, .base-ui-modal-popup):is([data-starting-style], [data-ending-style]) {
     scale: 1;
+  }
+
+  .base-ui-popup:is([data-starting-style], [data-ending-style]) {
     translate: none;
   }
 }
 
-:root[data-motion="reduce"] .base-ui-popup {
+:root[data-motion="reduce"] :is(.base-ui-popup, .base-ui-modal-popup) {
   transition-duration: var(--sigvelo-duration-reduced);
 }
 
-:root[data-motion="reduce"] .base-ui-popup:is([data-starting-style], [data-ending-style]) {
+:root[data-motion="reduce"]
+  :is(.base-ui-popup, .base-ui-modal-popup):is([data-starting-style], [data-ending-style]) {
   scale: 1;
+}
+
+:root[data-motion="reduce"] .base-ui-popup:is([data-starting-style], [data-ending-style]) {
   translate: none;
 }
 

package/dist/styles/base.css

@@ -17,7 +17,7 @@ body {
   position: relative;
   font-family: var(--sigvelo-font-sans);
   font-size: var(--sigvelo-text-base);
-  line-height: 1.5;
+  line-height: var(--sigvelo-leading-normal);
   color: var(--sigvelo-color-text);
   background-color: var(--sigvelo-color-canvas);
   -webkit-font-smoothing: antialiased;

package/dist/styles/browser-run-panel.css

@@ -57,14 +57,14 @@
   color: var(--sigvelo-color-primary-text);
   font-size: var(--sigvelo-text-3xs);
   font-weight: var(--sigvelo-font-weight-bold);
-  line-height: 1;
+  line-height: var(--sigvelo-leading-none);
 }
 
 .browser-run-panel__tab-title {
   overflow: hidden;
   max-inline-size: 100%;
   font-size: var(--sigvelo-text-xs);
-  line-height: 1.2;
+  line-height: var(--sigvelo-leading-tight);
   text-overflow: ellipsis;
   white-space: nowrap;
 }

package/dist/styles/button.css

@@ -18,7 +18,7 @@
   font-family: inherit;
   font-size: var(--sigvelo-recipe-button-font-size);
   font-weight: var(--sigvelo-font-weight-semibold);
-  line-height: 1.25;
+  line-height: var(--sigvelo-leading-compact);
   text-decoration: none;
   border-radius: var(--sigvelo-recipe-button-radius);
   translate: 0;
@@ -49,8 +49,8 @@
 }
 
 .button[data-disabled] {
-  pointer-events: none;
   opacity: var(--sigvelo-recipe-disabled-opacity);
+  cursor: not-allowed;
 }
 
 /* Normal appearance */

package/dist/styles/chain-of-thought.css

@@ -68,7 +68,7 @@
 .chain-of-thought__step-description {
   font-size: var(--sigvelo-text-xs);
   color: var(--sigvelo-color-text-muted);
-  line-height: 1.5;
+  line-height: var(--sigvelo-leading-normal);
 }
 
 .chain-of-thought__step-children {

package/dist/styles/chatgpt-sign-in-screen.css

@@ -84,7 +84,7 @@
   color: var(--sigvelo-color-text-muted);
   font-size: var(--sigvelo-text-sm);
   font-weight: var(--sigvelo-font-weight-semibold);
-  line-height: 1.25;
+  line-height: var(--sigvelo-leading-compact);
 }
 
 .chatgpt-sign-in__brand-mark,

package/dist/styles/checkbox.css

@@ -33,11 +33,11 @@
   border-color: var(--sigvelo-color-primary-bg);
 }
 
-.checkbox:is([aria-invalid="true"], [data-invalid="true"], [data-invalid=""]) {
+.checkbox:is([aria-invalid="true"], [data-invalid]) {
   border-color: var(--sigvelo-color-danger-bg);
 }
 
-.checkbox:is([aria-invalid="true"], [data-invalid="true"], [data-invalid=""]):focus-visible {
+.checkbox:is([aria-invalid="true"], [data-invalid]):focus-visible {
   box-shadow: var(--sigvelo-recipe-invalid-focus-shadow);
 }
 

package/dist/styles/codex-model-selector.css

@@ -23,7 +23,7 @@
   font-family: inherit;
   font-size: var(--sigvelo-control-text-md);
   font-weight: var(--sigvelo-font-weight-normal);
-  line-height: 1.25;
+  line-height: var(--sigvelo-leading-compact);
   isolation: isolate;
 }
 
@@ -135,7 +135,7 @@
   color: var(--sigvelo-color-text-muted);
   font-size: var(--sigvelo-control-text-sm);
   font-weight: var(--sigvelo-font-weight-normal);
-  line-height: 1.25;
+  line-height: var(--sigvelo-leading-compact);
 }
 
 .codex-model-selector__submenu-trigger::after {
@@ -167,7 +167,7 @@
 .codex-model-selector__option-description {
   margin-block-start: var(--sigvelo-spacing-0-5);
   font-size: var(--sigvelo-control-text-sm);
-  line-height: 1.25;
+  line-height: var(--sigvelo-leading-compact);
 }
 
 .codex-model-selector__option-indicator {

package/dist/styles/collapsible.css

@@ -28,7 +28,7 @@
     border-color var(--sigvelo-motion-duration-interaction) var(--sigvelo-motion-ease-change);
 }
 
-.collapsible__trigger:hover {
+.collapsible__trigger:hover:not([data-disabled]) {
   background-color: var(--sigvelo-color-neutral-bg-subtle);
 }
 

package/dist/styles/context.css

@@ -3,7 +3,7 @@
   font-family: inherit;
 }
 
-/* Bare ring icon — undo the popover__trigger pill chrome. */
+/* Bare ring icon owns its trigger chrome. */
 .context__trigger {
   display: inline-flex;
   align-items: center;

package/dist/styles/dialog.css

@@ -10,26 +10,12 @@
   inset-block-start: 50%;
   inset-inline-start: 50%;
   translate: -50% -50%;
-  scale: 1;
   z-index: 50;
   inline-size: calc(100% - var(--sigvelo-control-height-sm));
   max-inline-size: 32rem;
   max-block-size: calc(100dvb - var(--sigvelo-spacing-8));
   overflow-block: auto;
   overscroll-behavior: contain;
-  transition:
-    opacity var(--sigvelo-motion-duration-presence) var(--sigvelo-motion-ease-change),
-    scale var(--sigvelo-motion-duration-presence) var(--sigvelo-motion-ease-enter);
-}
-
-.dialog__popup[data-starting-style],
-.dialog__popup[data-ending-style] {
-  opacity: 0;
-  scale: var(--sigvelo-motion-presence-scale);
-}
-
-:root[data-motion="reduce"] .dialog__popup:is([data-starting-style], [data-ending-style]) {
-  scale: 1;
 }
 
 .dialog__popup--sm {
@@ -48,17 +34,10 @@
   border-radius: 0;
 }
 
-@media (prefers-reduced-motion: reduce) {
-  .dialog__popup[data-starting-style],
-  .dialog__popup[data-ending-style] {
-    scale: 1;
-  }
-}
-
 .dialog__title {
   font-size: var(--sigvelo-text-base);
   font-weight: var(--sigvelo-font-weight-semibold);
-  line-height: 1.25;
+  line-height: var(--sigvelo-leading-compact);
   color: var(--sigvelo-color-text);
   margin-block-end: var(--sigvelo-spacing-1);
 }
@@ -77,37 +56,5 @@
 }
 
 .dialog__footer {
-  display: flex;
-  flex-wrap: wrap;
-  justify-content: flex-end;
-  gap: var(--sigvelo-spacing-2);
   margin-block-start: var(--sigvelo-spacing-4);
 }
-
-.dialog__close {
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  min-block-size: var(--sigvelo-recipe-control-height);
-  padding-block: 0;
-  padding-inline: var(--sigvelo-recipe-control-padding-inline);
-  font-family: inherit;
-  font-size: var(--sigvelo-recipe-control-font-size);
-  font-weight: var(--sigvelo-font-weight-semibold);
-  color: var(--sigvelo-color-text);
-  background-color: var(--sigvelo-color-neutral-bg-subtle);
-  border: none;
-  border-radius: var(--sigvelo-radius-md);
-  cursor: pointer;
-  transition: background-color var(--sigvelo-motion-duration-interaction)
-    var(--sigvelo-motion-ease-change);
-}
-
-.dialog__close:hover {
-  background-color: color-mix(in oklab, var(--sigvelo-color-neutral-bg-subtle), transparent 20%);
-}
-
-.dialog__close:focus-visible {
-  outline: none;
-  box-shadow: var(--sigvelo-recipe-focus-shadow);
-}

package/dist/styles/field.css

@@ -6,8 +6,8 @@
   gap: var(--sigvelo-spacing-1-5);
 }
 
-.field:is([data-invalid="true"], [data-invalid=""]) .field__label,
-.field:is([data-invalid="true"], [data-invalid=""]) .field-title {
+.field[data-invalid] .field__label,
+.field[data-invalid] .field-title {
   color: var(--sigvelo-color-danger-bg);
 }
 
@@ -58,7 +58,7 @@
   font-family: inherit;
   font-size: var(--sigvelo-text-compact);
   font-weight: var(--sigvelo-font-weight-semibold);
-  line-height: 1;
+  line-height: var(--sigvelo-leading-none);
   color: var(--sigvelo-color-text);
 }
 
@@ -74,7 +74,7 @@
   padding: var(--sigvelo-spacing-3);
 }
 
-.field__label:has(> [data-slot="field"]):has([data-state="checked"], [data-checked]) {
+.field__label:has(> [data-slot="field"]):has([data-checked]) {
   border-color: var(--sigvelo-color-primary-border);
   background-color: color-mix(in oklab, var(--sigvelo-color-primary-bg), transparent 95%);
 }
@@ -167,14 +167,14 @@
 .field-content {
   flex: 1;
   gap: var(--sigvelo-spacing-1-5);
-  line-height: 1.375;
+  line-height: var(--sigvelo-leading-snug);
 }
 
 .field-legend,
 .field-title {
   color: var(--sigvelo-color-text);
   font-weight: var(--sigvelo-font-weight-semibold);
-  line-height: 1.25;
+  line-height: var(--sigvelo-leading-compact);
 }
 
 .field-legend {

package/dist/styles/inline-citation.css

@@ -31,7 +31,7 @@
   font: inherit;
   font-size: var(--sigvelo-text-2xs);
   font-variant-numeric: tabular-nums;
-  line-height: 1;
+  line-height: var(--sigvelo-leading-none);
   text-decoration: none;
   cursor: pointer;
   vertical-align: baseline;
@@ -72,7 +72,7 @@
   color: var(--sigvelo-color-text);
   font-size: var(--sigvelo-text-compact);
   font-weight: var(--sigvelo-font-weight-semibold);
-  line-height: 1.25;
+  line-height: var(--sigvelo-leading-compact);
   text-overflow: ellipsis;
   white-space: nowrap;
 }

package/dist/styles/label.css

@@ -5,15 +5,13 @@
   font-family: inherit;
   font-size: var(--sigvelo-text-sm);
   font-weight: var(--sigvelo-font-weight-semibold);
-  line-height: 1;
+  line-height: var(--sigvelo-leading-none);
   color: var(--sigvelo-color-text);
   user-select: none;
 }
 
 .label[data-disabled],
-.label[data-disabled="true"],
-.group[data-disabled] .label,
-.group[data-disabled="true"] .label {
+.group[data-disabled] .label {
   color: var(--sigvelo-color-text-muted);
   pointer-events: none;
 }
@@ -23,7 +21,6 @@
   cursor: not-allowed;
 }
 
-.label[data-disabled],
-.label[data-disabled="true"] {
+.label[data-disabled] {
   cursor: not-allowed;
 }

package/dist/styles/marker.css

@@ -7,7 +7,7 @@
   min-block-size: var(--sigvelo-spacing-4);
   font-family: inherit;
   font-size: var(--sigvelo-text-sm);
-  line-height: 1.5;
+  line-height: var(--sigvelo-leading-normal);
   color: var(--sigvelo-color-text-muted);
   text-align: start;
 }

package/dist/styles/mcp-server-picker.css

@@ -93,7 +93,7 @@
 .mcp-server-picker__avatar-fallback {
   font-size: var(--sigvelo-text-xs);
   font-weight: var(--sigvelo-font-weight-bold);
-  line-height: 1;
+  line-height: var(--sigvelo-leading-none);
 }
 
 .mcp-server-picker__copy {

package/dist/styles/media-preview-card.css

@@ -94,7 +94,7 @@
   scale: var(--sigvelo-motion-presence-scale);
 }
 
-.media-preview-card .card__content {
+:where([data-slot="media-preview-card"]) [data-slot="card-content"] {
   gap: var(--sigvelo-spacing-2);
   padding: var(--sigvelo-spacing-3) var(--sigvelo-spacing-4) var(--sigvelo-spacing-4);
 }