@webskill/chatbot 0.6.0 → 0.7.0

package/README.md

@@ -154,9 +154,10 @@ so a symbol cannot be quietly downgraded — the change shows up in the diff.
     `configureA2uiMarkdown`, the `probe*` helpers, `RendererKind`,
     `RendererCapability` and `DEFAULT_RENDERER_CAPABILITIES`. Their shape
     tracks upstream ecosystems this package does not own.
-  - **Surfaces introduced in this release** — `ChatAttachmentInput` and
-    `ChatAttachmentMeta` (multimodal attachments), which no consumer has
-    exercised yet.
+  - **Surfaces not yet exercised by consumers** — `ChatAttachmentInput` and
+    `ChatAttachmentMeta` (multimodal attachments), `ChatThinking` and
+    `ChatTokenUsage` (thinking segments and token usage persisted on messages,
+    0.7.0), and `pickUsableLlmEntry` (usable-model entry criterion, 0.7.0).
   - **`RunSnapshot`** — the resume snapshot format, `@experimental` in
     `@webskill/sdk` for the same reason.
 

package/dist/chatbot.css

@@ -279,9 +279,6 @@
   .right-2 {
     right: calc(var(--spacing) * 2);
   }
-  .right-2\.5 {
-    right: calc(var(--spacing) * 2.5);
-  }
   .right-3 {
     right: calc(var(--spacing) * 3);
   }
@@ -381,6 +378,9 @@
   .my-3 {
     margin-block: calc(var(--spacing) * 3);
   }
+  .ms-1 {
+    margin-inline-start: var(--spacing);
+  }
   .ms-auto {
     margin-inline-start: auto;
   }
@@ -475,6 +475,10 @@
     width: calc(var(--spacing) * 9);
     height: calc(var(--spacing) * 9);
   }
+  .size-\[3px\] {
+    width: 3px;
+    height: 3px;
+  }
   .size-full {
     width: 100%;
     height: 100%;
@@ -482,6 +486,9 @@
   .h-0 {
     height: 0px;
   }
+  .h-2 {
+    height: calc(var(--spacing) * 2);
+  }
   .h-2\.5 {
     height: calc(var(--spacing) * 2.5);
   }
@@ -527,6 +534,9 @@
   .max-h-\[calc\(100dvh-2rem\)\] {
     max-height: calc(100dvh - 2rem);
   }
+  .max-h-\[var\(--radix-select-content-available-height\)\] {
+    max-height: var(--radix-select-content-available-height);
+  }
   .min-h-0 {
     min-height: 0px;
   }
@@ -575,6 +585,9 @@
   .w-72 {
     width: calc(var(--spacing) * 72);
   }
+  .w-80 {
+    width: calc(var(--spacing) * 80);
+  }
   .w-\[80\%\] {
     width: 80%;
   }
@@ -608,6 +621,9 @@
   .max-w-72 {
     max-width: calc(var(--spacing) * 72);
   }
+  .max-w-\[calc\(100vw-2rem\)\] {
+    max-width: calc(100vw - 2rem);
+  }
   .max-w-full {
     max-width: 100%;
   }
@@ -623,9 +639,6 @@
   .min-w-5 {
     min-width: calc(var(--spacing) * 5);
   }
-  .min-w-20 {
-    min-width: calc(var(--spacing) * 20);
-  }
   .min-w-32 {
     min-width: calc(var(--spacing) * 32);
   }
@@ -635,6 +648,9 @@
   .min-w-44 {
     min-width: calc(var(--spacing) * 44);
   }
+  .min-w-\[var\(--radix-select-trigger-width\)\] {
+    min-width: var(--radix-select-trigger-width);
+  }
   .min-w-max {
     min-width: max-content;
   }
@@ -715,15 +731,9 @@
   .list-disc {
     list-style-type: disc;
   }
-  .appearance-none {
-    appearance: none;
-  }
   .grid-cols-1 {
     grid-template-columns: repeat(1, minmax(0, 1fr));
   }
-  .grid-cols-\[auto_auto_auto\] {
-    grid-template-columns: auto auto auto;
-  }
   .flex-col {
     flex-direction: column;
   }
@@ -778,6 +788,9 @@
   .gap-4 {
     gap: calc(var(--spacing) * 4);
   }
+  .gap-\[3px\] {
+    gap: 3px;
+  }
   :where(.space-y-1 > :not(:last-child)) {
     --tw-space-y-reverse: 0;
     margin-block-start: calc(var(--spacing) * var(--tw-space-y-reverse));
@@ -1024,6 +1037,9 @@
   .bg-primary {
     background-color: var(--primary);
   }
+  .bg-secondary {
+    background-color: var(--secondary);
+  }
   .bg-sidebar {
     background-color: var(--sidebar);
   }
@@ -1054,6 +1070,9 @@
   .fill-ink {
     fill: var(--foreground);
   }
+  .object-cover {
+    object-fit: cover;
+  }
   .p-0 {
     padding: 0px;
   }
@@ -1156,8 +1175,11 @@
   .pb-4 {
     padding-bottom: calc(var(--spacing) * 4);
   }
-  .pl-3 {
-    padding-left: calc(var(--spacing) * 3);
+  .pl-2 {
+    padding-left: calc(var(--spacing) * 2);
+  }
+  .pl-4 {
+    padding-left: calc(var(--spacing) * 4);
   }
   .pl-5 {
     padding-left: calc(var(--spacing) * 5);
@@ -1247,9 +1269,6 @@
   .whitespace-pre-wrap {
     white-space: pre-wrap;
   }
-  .text-background {
-    color: var(--background);
-  }
   .text-canvas {
     color: var(--background);
   }
@@ -1422,6 +1441,10 @@
     -webkit-user-select: none;
     user-select: none;
   }
+  .select-text {
+    -webkit-user-select: text;
+    user-select: text;
+  }
   .group-focus-within\:opacity-100:is(:where(.group):focus-within *) {
     opacity: 100%;
   }
@@ -1429,6 +1452,9 @@
     opacity: 100%;
   }
   @media (hover: hover) {
+    .group-hover\:bg-border:is(:where(.group):hover *) {
+      background-color: var(--border);
+    }
     .group-hover\:opacity-100:is(:where(.group):hover *) {
       opacity: 100%;
     }
@@ -1511,6 +1537,39 @@
   .peer-data-\[size\=sm\]\/menu-button\:top-1:is(:where(.peer\/menu-button)[data-size="sm"] ~ *) {
     top: var(--spacing);
   }
+  .file\:mr-3::file-selector-button {
+    margin-right: calc(var(--spacing) * 3);
+  }
+  .file\:cursor-pointer::file-selector-button {
+    cursor: pointer;
+  }
+  .file\:rounded-md::file-selector-button {
+    border-radius: calc(var(--radius) - 2px);
+  }
+  .file\:border-0::file-selector-button {
+    border-style: var(--tw-border-style);
+    border-width: 0px;
+  }
+  .file\:bg-primary::file-selector-button {
+    background-color: var(--primary);
+  }
+  .file\:px-3::file-selector-button {
+    padding-inline: calc(var(--spacing) * 3);
+  }
+  .file\:py-1::file-selector-button {
+    padding-block: var(--spacing);
+  }
+  .file\:text-sm::file-selector-button {
+    font-size: var(--text-sm);
+    line-height: var(--tw-leading, var(--text-sm--line-height));
+  }
+  .file\:font-medium::file-selector-button {
+    --tw-font-weight: var(--font-weight-medium);
+    font-weight: var(--font-weight-medium);
+  }
+  .file\:text-primary-foreground::file-selector-button {
+    color: var(--primary-foreground);
+  }
   .placeholder\:text-muted::placeholder {
     color: var(--muted-foreground);
   }
@@ -1581,12 +1640,15 @@
     .hover\:text-sidebar-accent-foreground:hover {
       color: var(--sidebar-accent-foreground);
     }
-    .hover\:opacity-85:hover {
-      opacity: 85%;
-    }
     .hover\:opacity-90:hover {
       opacity: 90%;
     }
+    .hover\:file\:bg-primary\/90:hover::file-selector-button {
+      background-color: var(--primary);
+      @supports (color: color-mix(in lab, red, red)) {
+        background-color: color-mix(in oklab, var(--primary) 90%, transparent);
+      }
+    }
   }
   .focus\:border-ring:focus {
     border-color: var(--ring);
@@ -1688,8 +1750,8 @@
   .data-dragging\:bg-subtle[data-dragging] {
     background-color: var(--accent);
   }
-  .data-\[active\=true\]\:bg-sidebar-accent[data-active="true"] {
-    background-color: var(--sidebar-accent);
+  .data-\[active\=true\]\:bg-subtle[data-active="true"] {
+    background-color: var(--accent);
   }
   .data-\[active\=true\]\:font-medium[data-active="true"] {
     --tw-font-weight: var(--font-weight-medium);
@@ -1725,6 +1787,9 @@
   .data-\[orientation\=vertical\]\:flex-col[data-orientation="vertical"] {
     flex-direction: column;
   }
+  .data-\[placeholder\]\:text-muted[data-placeholder] {
+    color: var(--muted-foreground);
+  }
   .data-\[selected\=true\]\:bg-subtle[data-selected="true"] {
     background-color: var(--accent);
   }
@@ -2011,12 +2076,12 @@
   --secondary-foreground: oklch(0.205 0 0);
   --muted: oklch(0.97 0 0);
   --muted-foreground: oklch(0.556 0 0);
-  --accent: oklch(0.97 0 0);
+  --accent: #0000000f;
   --accent-foreground: oklch(0.205 0 0);
   --border: oklch(0.922 0 0);
   --input: oklch(0.922 0 0);
   --ring: oklch(0.708 0 0);
-  --destructive: oklch(0.577 0.245 27.325);
+  --destructive: oklch(0.52 0.22 27);
   --destructive-foreground: oklch(0.985 0 0);
   --success: oklch(0.62 0.13 150);
   --success-foreground: oklch(0.985 0 0);
@@ -2049,7 +2114,7 @@
   --sidebar-foreground: oklch(0.145 0 0);
   --sidebar-primary: oklch(0.205 0 0);
   --sidebar-primary-foreground: oklch(0.985 0 0);
-  --sidebar-accent: oklch(0.97 0 0);
+  --sidebar-accent: #0000000f;
   --sidebar-accent-foreground: oklch(0.205 0 0);
   --sidebar-border: oklch(0.922 0 0);
   --sidebar-ring: oklch(0.708 0 0);
@@ -2101,7 +2166,7 @@
   --secondary-foreground: oklch(0.985 0 0);
   --muted: oklch(0.269 0 0);
   --muted-foreground: oklch(0.708 0 0);
-  --accent: oklch(0.269 0 0);
+  --accent: #ffffff0d;
   --accent-foreground: oklch(0.985 0 0);
   --border: oklch(1 0 0 / 10%);
   --input: oklch(1 0 0 / 15%);
@@ -2134,7 +2199,7 @@
   --sidebar-foreground: oklch(0.985 0 0);
   --sidebar-primary: oklch(0.985 0 0);
   --sidebar-primary-foreground: oklch(0.205 0 0);
-  --sidebar-accent: oklch(0.269 0 0);
+  --sidebar-accent: #ffffff0d;
   --sidebar-accent-foreground: oklch(0.985 0 0);
   --sidebar-border: oklch(1 0 0 / 10%);
   --sidebar-ring: oklch(0.556 0 0);
@@ -2318,6 +2383,15 @@
 .webskill-surface--form, .webskill-surface--metric, .webskill-surface--file, .webskill-surface--error, .webskill-surface--unsupported {
   padding: 1rem;
 }
+.webskill-surface.webskill-surface--spec {
+  padding: 1rem;
+}
+.webskill-surface--spec > .webskill-spec-card:only-child, .webskill-surface--spec > div > .webskill-spec-card:only-child {
+  border: 0;
+  background: transparent;
+  box-shadow: none;
+  padding: 0;
+}
 .webskill-surface--form, .webskill-surface__field {
   display: flex;
   flex-direction: column;