@agent-native/agentkit 0.3.2-nightly-20260927082735 → 0.4.0

package/dist/react/styles.css

@@ -495,6 +495,26 @@ body:has(> [data-agent-native-composer-popover="true"]) > .fixed.inset-0 {
   color: var(--agentkit-palette-muted);
 }
 
+.agentkit-chat {
+  position: relative;
+}
+
+.agentkit-file-drop-overlay {
+  position: absolute;
+  z-index: 8;
+  inset: 0;
+  display: grid;
+  place-items: center;
+  padding: 1rem;
+  border: 2px dashed var(--agentkit-accent);
+  border-radius: var(--agentkit-radius);
+  color: var(--agentkit-text);
+  background: color-mix(in srgb, var(--agentkit-canvas) 88%, transparent);
+  font-size: 0.875rem;
+  font-weight: 600;
+  pointer-events: none;
+}
+
 .agentkit-chat[data-empty="true"] {
   grid-template-rows: minmax(0, 1fr) auto;
 }
@@ -603,6 +623,36 @@ body:has(> [data-agent-native-composer-popover="true"]) > .fixed.inset-0 {
   padding: 1.5rem 1rem;
 }
 
+.agentkit-scroll-to-bottom-control {
+  position: sticky;
+  z-index: 2;
+  inset-block-end: 0.75rem;
+  display: flex;
+  block-size: 0;
+  justify-content: center;
+  margin-block-start: -2.25rem;
+  pointer-events: none;
+}
+
+.agentkit-scroll-to-bottom-control > * {
+  pointer-events: auto;
+  border: 1px solid var(--agentkit-border);
+  border-radius: 999px;
+  color: var(--agentkit-text);
+  background: var(--agentkit-surface);
+  box-shadow: 0 2px 8px
+    color-mix(in srgb, var(--agentkit-text) 14%, transparent);
+}
+
+.agentkit-visually-hidden {
+  position: absolute;
+  inline-size: 1px;
+  block-size: 1px;
+  overflow: hidden;
+  clip-path: inset(50%);
+  white-space: nowrap;
+}
+
 .agentkit-message {
   display: flex;
   flex-direction: column;
@@ -645,6 +695,108 @@ body:has(> [data-agent-native-composer-popover="true"]) > .fixed.inset-0 {
   font-style: normal;
 }
 
+.agentkit-user-message-text-content {
+  overflow-wrap: anywhere;
+  white-space: pre-wrap;
+}
+
+.agentkit-user-message-text-clip[data-clamped="true"] {
+  position: relative;
+  max-block-size: 200px;
+  overflow: hidden;
+}
+
+.agentkit-user-message-text-clip[data-clamped="true"]::after {
+  position: absolute;
+  inset-inline: 0;
+  inset-block-end: 0;
+  block-size: 3rem;
+  background: linear-gradient(to bottom, transparent, var(--agentkit-subtle));
+  content: "";
+  pointer-events: none;
+}
+
+.agentkit-mention {
+  display: inline-flex;
+  max-inline-size: 200px;
+  align-items: center;
+  gap: 0.25rem;
+  margin-inline: 0.125rem;
+  padding: 0.125rem 0.375rem;
+  border: 1px solid var(--agentkit-border);
+  border-radius: var(--agentkit-radius-inner);
+  color: var(--agentkit-text);
+  background: color-mix(in srgb, var(--agentkit-subtle) 75%, transparent);
+  font-size: 0.75rem;
+  font-weight: 550;
+  vertical-align: middle;
+  user-select: text;
+}
+
+.agentkit-mention-icon {
+  flex: none;
+  color: var(--agentkit-text-muted);
+}
+
+.agentkit-mention-label {
+  min-inline-size: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.agentkit-message-expand {
+  position: relative;
+  z-index: 1;
+  margin-block-start: 0.25rem;
+  padding: 0.125rem 0.25rem;
+  border: 0;
+  border-radius: var(--agentkit-radius-inner);
+  color: var(--agentkit-text-muted);
+  background: transparent;
+  font: inherit;
+  font-size: 0.6875rem;
+  cursor: pointer;
+}
+
+.agentkit-message-expand:hover {
+  color: var(--agentkit-text);
+}
+
+.agentkit-image-attachment-trigger {
+  display: block;
+  inline-size: 4rem;
+  block-size: 4rem;
+  overflow: hidden;
+  padding: 0;
+  border: 1px solid var(--agentkit-border);
+  border-radius: var(--agentkit-radius-inner);
+  background: var(--agentkit-canvas);
+  cursor: zoom-in;
+}
+
+.agentkit-image-attachment-trigger img {
+  inline-size: 100%;
+  block-size: 100%;
+  object-fit: cover;
+}
+
+.agentkit-image-preview {
+  display: flex;
+  min-block-size: min(70vh, 35rem);
+  align-items: center;
+  justify-content: center;
+  padding: 1.5rem;
+  background: var(--agentkit-canvas);
+}
+
+.agentkit-image-preview img {
+  max-inline-size: 92vw;
+  max-block-size: 90vh;
+  border-radius: var(--agentkit-radius);
+  object-fit: contain;
+}
+
 .agentkit-markdown {
   overflow-wrap: anywhere;
 }
@@ -750,71 +902,33 @@ body:has(> [data-agent-native-composer-popover="true"]) > .fixed.inset-0 {
 
 .agentkit-message-actions {
   display: flex;
+  inline-size: 100%;
   min-block-size: 1.5rem;
   align-items: center;
-  gap: 0.125rem;
+  justify-content: space-between;
+  gap: 0.25rem;
+  flex-wrap: wrap;
   margin-block-start: 0.25rem;
   color: var(--agentkit-text-muted);
   opacity: 0;
   transition: opacity 140ms ease;
 }
 
-.agentkit-message:hover .agentkit-message-actions,
-.agentkit-message:focus-within .agentkit-message-actions {
-  opacity: 1;
-}
-
-.agentkit-message-actions[data-action-mode="expanded"] {
-  opacity: 1;
-}
-
-.agentkit-message-action-swap {
-  display: grid;
-  min-inline-size: max-content;
-  grid-template-areas: "actions";
-  overflow: hidden;
-}
-
-.agentkit-message-action-group {
-  grid-area: actions;
+.agentkit-message-actions-leading,
+.agentkit-message-actions-trailing {
   display: flex;
+  min-inline-size: 0;
   align-items: center;
-  justify-content: flex-end;
   gap: 0.125rem;
-  transition:
-    opacity 180ms ease,
-    transform 220ms cubic-bezier(0.22, 1, 0.36, 1),
-    visibility 0s linear 180ms;
 }
 
-.agentkit-message-action-group--default {
-  opacity: 1;
-  transform: translateX(0);
-  visibility: visible;
-}
-
-.agentkit-message-action-group--request-id {
-  opacity: 0;
-  transform: translateX(0.4rem);
-  pointer-events: none;
-  visibility: hidden;
-}
-
-.agentkit-message-actions[data-action-mode="expanded"]
-  .agentkit-message-action-group--default {
-  opacity: 0;
-  transform: translateX(-0.4rem);
-  pointer-events: none;
-  visibility: hidden;
+.agentkit-message-actions-trailing {
+  margin-inline-start: auto;
 }
 
-.agentkit-message-actions[data-action-mode="expanded"]
-  .agentkit-message-action-group--request-id {
+.agentkit-message:hover .agentkit-message-actions,
+.agentkit-message:focus-within .agentkit-message-actions {
   opacity: 1;
-  transform: translateX(0);
-  pointer-events: auto;
-  visibility: visible;
-  transition-delay: 0s;
 }
 
 .agentkit-message-actions button {
@@ -878,6 +992,81 @@ body:has(> [data-agent-native-composer-popover="true"]) > .fixed.inset-0 {
   font-size: 0.6875rem;
 }
 
+.agentkit-message-menu {
+  z-index: 20;
+  min-inline-size: 12rem;
+  padding: 0.25rem;
+  border: 1px solid var(--agentkit-border);
+  border-radius: var(--agentkit-radius-inner);
+  background: var(--agentkit-surface);
+  box-shadow: 0 8px 24px
+    color-mix(in srgb, var(--agentkit-text) 16%, transparent);
+}
+
+.agentkit-message-menu-items {
+  display: grid;
+  gap: 0.125rem;
+}
+
+.agentkit-message-actions .agentkit-message-menu-item {
+  display: flex;
+  inline-size: 100%;
+  min-block-size: 2rem;
+  align-items: center;
+  justify-content: flex-start;
+  gap: 0.5rem;
+  padding: 0.375rem 0.5rem;
+  border-radius: var(--radius-sm, var(--radius));
+  text-align: start;
+}
+
+.agentkit-message-menu-item:hover:not(:disabled) {
+  background: var(--agentkit-subtle);
+}
+
+.agentkit-message-menu-item:disabled {
+  cursor: not-allowed;
+  opacity: 0.55;
+}
+
+.agentkit-branch-navigation {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.25rem;
+  margin-inline-start: 0.375rem;
+  font-size: 0.6875rem;
+}
+
+.agentkit-feedback-popover {
+  z-index: 20;
+  width: min(20rem, calc(100vw - 2rem));
+  padding: 0.75rem;
+  border: 1px solid var(--agentkit-border);
+  border-radius: var(--agentkit-radius-inner);
+  color: var(--agentkit-text);
+  background: var(--agentkit-surface);
+  box-shadow: 0 8px 24px
+    color-mix(in srgb, var(--agentkit-text) 16%, transparent);
+}
+
+.agentkit-feedback-form {
+  display: grid;
+  gap: 0.625rem;
+}
+
+.agentkit-feedback-textarea {
+  inline-size: 100%;
+}
+
+.agentkit-feedback-footer {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 0.75rem;
+  color: var(--agentkit-text-muted);
+  font-size: 0.6875rem;
+}
+
 .agentkit-icon {
   inline-size: 1rem;
   block-size: 1rem;
@@ -1342,6 +1531,13 @@ button.agentkit-object {
   text-decoration: none;
 }
 
+.agentkit-file--pasted-text {
+  border: 1px solid var(--agentkit-border);
+  border-radius: 999px;
+  padding: 0.125rem 0.5rem;
+  font-size: 0.75rem;
+}
+
 .agentkit-annotations {
   display: flex;
   flex-wrap: wrap;
@@ -1528,7 +1724,6 @@ button.agentkit-object {
   }
 
   .agentkit-message-actions,
-  .agentkit-message-action-group,
   .agentkit-summary-chevron,
   .agentkit-disclosure-icon,
   .agentkit-reasoning-chevron,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@agent-native/agentkit",
-  "version": "0.3.2-nightly-20260927082735",
+  "version": "0.4.0",
   "description": "Provider-neutral AgentKit protocol, headless client, transports, and React runtime for composable agent-native conversations.",
   "homepage": "https://github.com/BuilderIO/agent-native#readme",
   "bugs": {
@@ -79,7 +79,7 @@
     "@tabler/icons-react": "3.44.0",
     "react-markdown": "^10.1.0",
     "remark-gfm": "^4.0.1",
-    "@agent-native/toolkit": "0.22.2-nightly-20260927082735"
+    "@agent-native/toolkit": "0.22.2"
   },
   "devDependencies": {
     "@types/react": "^19.2.14",