agentic-ui-kit 0.4.0 → 0.5.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +6 -0
- package/dist/core.js +11 -4
- package/dist/index.js +457 -211
- package/dist/styles.css +1 -1
- package/dist/types/core/src/index.d.ts +1 -0
- package/dist/types/core/src/replaces.d.ts +15 -0
- package/dist/types/core/src/types.d.ts +2 -0
- package/dist/types/core/src/ui-markup.d.ts +6 -0
- package/dist/types/core/src/ui-tree.d.ts +6 -0
- package/dist/types/core/src/visualize.d.ts +7 -1
- package/dist/types/react/src/components/effort-slider.d.ts +24 -0
- package/dist/types/react/src/components/replacements.d.ts +29 -0
- package/dist/types/react/src/index.d.ts +3 -0
- package/dist/types/react/src/primitives/code-block.d.ts +3 -1
- package/dist/types/react/src/primitives/copy-button.d.ts +5 -0
- package/dist/types/react/src/primitives/icons.d.ts +7 -0
- package/dist/types/react/src/primitives/labels.d.ts +7 -0
- package/dist/types/react/src/views/chat-view.d.ts +10 -2
- package/dist/types/react/src/views/sidebar.d.ts +3 -1
- package/dist/{ui-markup-DtMYer7I.js → ui-markup-CG9Lednh.js} +33 -9
- package/package.json +1 -1
package/dist/styles.css
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
@import "katex/dist/katex.min.css";
|
|
2
2
|
/*! tailwindcss v4.3.4 | MIT License | https://tailwindcss.com */
|
|
3
|
-
@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:block))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-space-y-reverse:0;--tw-divide-y-reverse:0;--tw-border-style:solid;--tw-gradient-position:initial;--tw-gradient-from:#0000;--tw-gradient-via:#0000;--tw-gradient-to:#0000;--tw-gradient-stops:initial;--tw-gradient-via-stops:initial;--tw-gradient-from-position:0%;--tw-gradient-via-position:50%;--tw-gradient-to-position:100%;--tw-mask-linear:linear-gradient(#fff, #fff);--tw-mask-radial:linear-gradient(#fff, #fff);--tw-mask-conic:linear-gradient(#fff, #fff);--tw-mask-left:linear-gradient(#fff, #fff);--tw-mask-right:linear-gradient(#fff, #fff);--tw-mask-bottom:linear-gradient(#fff, #fff);--tw-mask-top:linear-gradient(#fff, #fff);--tw-mask-bottom-from-position:0%;--tw-mask-bottom-to-position:100%;--tw-mask-bottom-from-color:black;--tw-mask-bottom-to-color:transparent;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking:initial;--tw-ordinal:initial;--tw-slashed-zero:initial;--tw-numeric-figure:initial;--tw-numeric-spacing:initial;--tw-numeric-fraction:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-outline-style:solid;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-duration:initial;--tw-ease:initial}}}@layer theme{:root,:host{--font-sans:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--font-serif:ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--spacing:.25rem;--container-2xl:42rem;--text-base:1rem;--text-base--line-height:calc(1.5 / 1);--text-lg:1.125rem;--text-lg--line-height:calc(1.75 / 1.125);--font-weight-normal:400;--font-weight-medium:500;--tracking-wide:.025em;--leading-snug:1.375;--leading-relaxed:1.625;--radius-sm:.25rem;--ease-out:cubic-bezier(0, 0, .2, 1);--animate-pulse:pulse 2s cubic-bezier(.4, 0, .6, 1) infinite;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring:where(:not(iframe)){outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab, currentcolor 50%, transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}:root,[data-chat-theme=claude-dark]{color-scheme:dark;--chat-bg:#191919;--chat-sidebar:#1f1f1f;--chat-surface:#303030;--chat-raised:#3a3a3a;--chat-hover:#3d3d3d;--chat-selected:#4a4a4a;--chat-bubble:#2a2a2a;--chat-popover:#303030;--chat-popover-border:#383838;--chat-popover-hover:#4f4f4f;--chat-border:#303030;--chat-border-strong:#454545;--chat-divider:#222;--chat-code-bg:#1c1c1c;--chat-code-border:#252525;--chat-inline-code:#2e2e2e;--chat-fg:#ecebe6;--chat-muted:#a3a29e;--chat-subtle:#75746f;--chat-accent:#d97757;--chat-accent-fg:#fff;--chat-check:#6c9cf0;--chat-warning:#e8b04b;--chat-warning-bg:#4a3b1c;--chat-danger:#e5675c;--chat-focus:#6c9cf0;--chat-backdrop:#00000080;--chat-font-sans:"Inter", ui-sans-serif, system-ui, sans-serif;--chat-font-serif:"Source Serif 4", ui-serif, Georgia, serif;--chat-font-mono:"JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;--chat-radius-sm:6px;--chat-radius-md:10px;--chat-radius-lg:16px;--chat-radius-popover:12px;--chat-shadow-popover:0 8px 24px #00000080;--chat-content-width:48rem;--chat-content-padding:1.5rem;--chat-message-font-size:1.0625rem;--chat-code-font-size:.8125rem;--chat-message-line-height:1.65;--chat-ui-font-size:.875rem;--chat-ui-font-size-sm:.75rem;--chat-bubble-font-size:.9375rem;--chat-activity-font-size:.9375rem}}@layer components{.chat-markdown{font-family:var(--chat-font-message,var(--chat-font-serif));font-size:var(--chat-message-font-size);line-height:var(--chat-message-line-height);color:var(--chat-fg);overflow-wrap:anywhere}.chat-markdown>div>*+*{margin-top:.75em}.chat-markdown :is(h1,h2,h3,h4){margin-top:1.25em;font-weight:600;line-height:1.3}.chat-markdown h1{font-size:1.5em}.chat-markdown h2{font-size:1.3em}.chat-markdown h3{font-size:1.12em}.chat-markdown :is(strong,[data-streamdown=strong]){font-weight:650}.chat-markdown :is(ul,ol){padding-left:1.6em}.chat-markdown ul{list-style:outside}.chat-markdown ol{list-style:decimal}.chat-markdown li+li,.chat-markdown li>:is(ul,ol){margin-top:.3em}.chat-markdown .chat-ui-tree{font-family:var(--chat-font-sans);font-size:var(--chat-ui-font-size);line-height:1.5}.chat-markdown .chat-ui-tree :is(ul,ol){padding-left:0;list-style:none}.chat-markdown .chat-ui-tree li+li{margin-top:0}.chat-markdown .chat-ui-tree :is(h1,h2,h3,h4){font-size:inherit;margin-top:0}.chat-markdown a{color:var(--chat-fg);text-decoration:underline;-webkit-text-decoration-color:var(--chat-subtle);-webkit-text-decoration-color:var(--chat-subtle);text-decoration-color:var(--chat-subtle);text-underline-offset:3px}.chat-markdown a:hover{-webkit-text-decoration-color:var(--chat-fg);-webkit-text-decoration-color:var(--chat-fg);text-decoration-color:var(--chat-fg)}.chat-markdown blockquote{border-left:3px solid var(--chat-border-strong);color:var(--chat-muted);padding-left:1em}.chat-markdown hr{border-color:var(--chat-border);margin-block:1.5em}.chat-markdown [data-chat-inline-code]{font-family:var(--chat-font-mono);background:var(--chat-inline-code);border-radius:5px;padding:.12em .35em;font-size:.82em}.chat-markdown [data-streamdown=table-wrapper]{margin-block:1em;overflow-x:auto}.chat-markdown table{border-collapse:collapse;font-family:var(--chat-font-sans);font-size:var(--chat-ui-font-size)}.chat-markdown :is(th,td){border-bottom:1px solid var(--chat-border);text-align:left;padding:.45em .9em .45em 0}.chat-markdown th{font-weight:600}.chat-markdown .katex-display{margin-block:1em;overflow:auto hidden}.chat-markdown .katex{font-size:1.08em}.chat-markdown.chat-fade .chat-word{animation:chat-word-in var(--chat-fade-duration,.7s) ease-out both}.chat-view{container:chat/inline-size}.chat-view-body{--chat-gutter:var(--chat-content-padding);container:chat-body/size}@container chat (max-width:34rem){.chat-view-body{--chat-gutter:min(var(--chat-content-padding), .75rem)}}@container chat (max-width:24rem){.chat-picker-detail{display:none}}@container chat-body (max-height:24rem){.chat-empty-greeting{display:none}}.chat-code-token{color:light-dark(var(--shiki-light),var(--shiki-dark))}.chat-shimmer{background-image:linear-gradient(90deg, var(--chat-muted) 0%, var(--chat-muted) 35%, var(--chat-fg) 50%, var(--chat-muted) 65%, var(--chat-muted) 100%);color:#0000;animation:chat-shimmer var(--chat-shimmer-duration,2s) linear infinite;background-repeat:repeat-x;background-size:20em 100%;-webkit-background-clip:text;background-clip:text}.chat-markdown.chat-thinking{font-family:var(--chat-font-sans);font-size:var(--chat-activity-font-size);color:var(--chat-muted);line-height:1.6}.chat-shimmer-surface:after{content:"";background:linear-gradient(100deg, transparent 30%, var(--chat-fg) 50%, transparent 70%) 0 0 / 300% 100%;position:absolute;inset:0}@supports (color:color-mix(in lab, red, red)){.chat-shimmer-surface:after{background:linear-gradient(100deg, transparent 30%, color-mix(in srgb, var(--chat-fg) 12%, transparent) 50%, transparent 70%) 0 0 / 300% 100%}}.chat-shimmer-surface:after{pointer-events:none;animation:1.6s linear infinite chat-shimmer-surface}}@layer utilities{.pointer-events-none{pointer-events:none}.collapse{visibility:collapse}.visible{visibility:visible}.sr-only{clip-path:inset(50%);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.static{position:static}.sticky{position:sticky}.inset-0{inset:0}.inset-x-2{inset-inline:calc(var(--spacing) * 2)}.inset-y-0{inset-block:0}.-top-2{top:calc(var(--spacing) * -2)}.top-1\/2{top:50%}.-right-2{right:calc(var(--spacing) * -2)}.right-0{right:0}.right-1{right:var(--spacing)}.bottom-0{bottom:0}.bottom-2{bottom:calc(var(--spacing) * 2)}.bottom-\[min\(10rem\,40\%\)\]{bottom:min(10rem,40%)}.left-0{left:0}.left-1\/2{left:50%}.z-40{z-index:40}.z-50{z-index:50}.container{width:100%}@media (min-width:40rem){.container{max-width:40rem}}@media (min-width:48rem){.container{max-width:48rem}}@media (min-width:64rem){.container{max-width:64rem}}@media (min-width:80rem){.container{max-width:80rem}}@media (min-width:96rem){.container{max-width:96rem}}.m-0{margin:0}.-mx-1{margin-inline:calc(var(--spacing) * -1)}.-mx-1\.5{margin-inline:calc(var(--spacing) * -1.5)}.mx-5{margin-inline:calc(var(--spacing) * 5)}.mx-auto{margin-inline:auto}.my-1\.5{margin-block:calc(var(--spacing) * 1.5)}.my-2{margin-block:calc(var(--spacing) * 2)}.my-4{margin-block:calc(var(--spacing) * 4)}.mt-0\.5{margin-top:calc(var(--spacing) * .5)}.mt-1{margin-top:var(--spacing)}.mt-1\.5{margin-top:calc(var(--spacing) * 1.5)}.mt-2\.5{margin-top:calc(var(--spacing) * 2.5)}.mt-3{margin-top:calc(var(--spacing) * 3)}.mb-2{margin-bottom:calc(var(--spacing) * 2)}.mb-3{margin-bottom:calc(var(--spacing) * 3)}.-ml-1\.5{margin-left:calc(var(--spacing) * -1.5)}.ml-1\.5{margin-left:calc(var(--spacing) * 1.5)}.ml-auto{margin-left:auto}.line-clamp-3{-webkit-line-clamp:3;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.block{display:block}.flex{display:flex}.hidden{display:none}.inline{display:inline}.inline-flex{display:inline-flex}.size-0{width:0;height:0}.size-2{width:calc(var(--spacing) * 2);height:calc(var(--spacing) * 2)}.size-2\.5{width:calc(var(--spacing) * 2.5);height:calc(var(--spacing) * 2.5)}.size-4{width:calc(var(--spacing) * 4);height:calc(var(--spacing) * 4)}.size-6{width:calc(var(--spacing) * 6);height:calc(var(--spacing) * 6)}.size-7{width:calc(var(--spacing) * 7);height:calc(var(--spacing) * 7)}.size-8{width:calc(var(--spacing) * 8);height:calc(var(--spacing) * 8)}.size-24{width:calc(var(--spacing) * 24);height:calc(var(--spacing) * 24)}.size-30{width:calc(var(--spacing) * 30);height:calc(var(--spacing) * 30)}.size-full{width:100%;height:100%}.h-1{height:var(--spacing)}.h-6{height:calc(var(--spacing) * 6)}.h-7{height:calc(var(--spacing) * 7)}.h-8{height:calc(var(--spacing) * 8)}.h-9{height:calc(var(--spacing) * 9)}.h-10{height:calc(var(--spacing) * 10)}.h-12{height:calc(var(--spacing) * 12)}.h-dvh{height:100dvh}.h-full{height:100%}.max-h-48{max-height:calc(var(--spacing) * 48)}.max-h-56{max-height:calc(var(--spacing) * 56)}.max-h-72{max-height:calc(var(--spacing) * 72)}.max-h-96{max-height:calc(var(--spacing) * 96)}.max-h-\[85dvh\]{max-height:85dvh}.max-h-\[inherit\]{max-height:inherit}.max-h-\[min\(10rem\,30cqh\)\]{max-height:min(10rem,30cqh)}.max-h-\[min\(18rem\,35cqh\)\]{max-height:min(18rem,35cqh)}.max-h-\[min\(24rem\,45cqh\)\]{max-height:min(24rem,45cqh)}.min-h-0{min-height:0}.min-h-2{min-height:calc(var(--spacing) * 2)}.min-h-6{min-height:calc(var(--spacing) * 6)}.min-h-7{min-height:calc(var(--spacing) * 7)}.min-h-12{min-height:calc(var(--spacing) * 12)}.min-h-64{min-height:calc(var(--spacing) * 64)}.min-h-full{min-height:100%}.w-\(--chat-sidebar-width\,18rem\){width:var(--chat-sidebar-width,18rem)}.w-7{width:calc(var(--spacing) * 7)}.w-9{width:calc(var(--spacing) * 9)}.w-12{width:calc(var(--spacing) * 12)}.w-13{width:calc(var(--spacing) * 13)}.w-14{width:calc(var(--spacing) * 14)}.w-60{width:calc(var(--spacing) * 60)}.w-72{width:calc(var(--spacing) * 72)}.w-80{width:calc(var(--spacing) * 80)}.w-\[min\(20rem\,85vw\)\]{width:min(20rem,85vw)}.w-\[min\(36rem\,calc\(100vw-2rem\)\)\]{width:min(36rem,100vw - 2rem)}.w-full{width:100%}.max-w-\(--chat-content-width\){max-width:var(--chat-content-width)}.max-w-2xl{max-width:var(--container-2xl)}.max-w-\[85\%\]{max-width:85%}.max-w-\[calc\(var\(--chat-content-width\)\+2\*var\(--chat-gutter\,var\(--chat-content-padding\)\)\)\]{max-width:calc(var(--chat-content-width) + 2 * var(--chat-gutter,var(--chat-content-padding)))}.max-w-full{max-width:100%}.min-w-0{min-width:0}.min-w-44{min-width:calc(var(--spacing) * 44)}.min-w-52{min-width:calc(var(--spacing) * 52)}.min-w-\[2px\]{min-width:2px}.flex-1{flex:1}.shrink-0{flex-shrink:0}.grow{flex-grow:1}.-translate-x-1\/2{--tw-translate-x:calc(calc(1 / 2 * 100%) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.-translate-y-1\/2{--tw-translate-y:calc(calc(1 / 2 * 100%) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.animate-pulse{animation:var(--animate-pulse)}.cursor-help{cursor:help}.cursor-pointer{cursor:pointer}.resize-none{resize:none}.\[scrollbar-width\:thin\]{scrollbar-width:thin}.\[scrollbar-color\:var\(--chat-border-strong\)_transparent\]{scrollbar-color:var(--chat-border-strong) transparent}.\[scrollbar-gutter\:stable\]{scrollbar-gutter:stable}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-baseline{align-items:baseline}.items-center{align-items:center}.items-end{align-items:flex-end}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.gap-0\.5{gap:calc(var(--spacing) * .5)}.gap-1{gap:var(--spacing)}.gap-1\.5{gap:calc(var(--spacing) * 1.5)}.gap-2{gap:calc(var(--spacing) * 2)}.gap-2\.5{gap:calc(var(--spacing) * 2.5)}.gap-3{gap:calc(var(--spacing) * 3)}.gap-4{gap:calc(var(--spacing) * 4)}.gap-6{gap:calc(var(--spacing) * 6)}.gap-8{gap:calc(var(--spacing) * 8)}.gap-px{gap:1px}:where(.space-y-1>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(var(--spacing) * var(--tw-space-y-reverse));margin-block-end:calc(var(--spacing) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-1\.5>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 1.5) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 1.5) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-4>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)))}:where(.divide-y>:not(:last-child)){--tw-divide-y-reverse:0;border-bottom-style:var(--tw-border-style);border-top-style:var(--tw-border-style);border-top-width:calc(1px * var(--tw-divide-y-reverse));border-bottom-width:calc(1px * calc(1 - var(--tw-divide-y-reverse)))}:where(.divide-chat-divider>:not(:last-child)){border-color:var(--chat-divider)}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.overflow-y-auto{overflow-y:auto}.rounded-\[0\.3rem\]{border-radius:.3rem}.rounded-\[2px\]{border-radius:2px}.rounded-\[calc\(var\(--chat-radius-md\)-2px\)\]{border-radius:calc(var(--chat-radius-md) - 2px)}.rounded-\[inherit\]{border-radius:inherit}.rounded-\[var\(--chat-composer-radius\,1\.25rem\)\]{border-radius:var(--chat-composer-radius,1.25rem)}.rounded-\[var\(--chat-send-radius\,var\(--chat-radius-md\)\)\]\!{border-radius:var(--chat-send-radius,var(--chat-radius-md))!important}.rounded-chat-lg{border-radius:var(--chat-radius-lg)}.rounded-chat-md{border-radius:var(--chat-radius-md)}.rounded-chat-popover{border-radius:var(--chat-radius-popover)}.rounded-chat-sm{border-radius:var(--chat-radius-sm)}.rounded-full{border-radius:2147483647px}.rounded-sm{border-radius:var(--radius-sm)}.border{border-style:var(--tw-border-style);border-width:1px}.border-0{border-style:var(--tw-border-style);border-width:0}.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.border-r{border-right-style:var(--tw-border-style);border-right-width:1px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-dashed{--tw-border-style:dashed;border-style:dashed}.border-\(--chat-notice-border\,var\(--chat-border\)\){border-color:var(--chat-notice-border,var(--chat-border))}.border-chat-accent\!{border-color:var(--chat-accent)!important}.border-chat-border{border-color:var(--chat-border)}.border-chat-border-strong{border-color:var(--chat-border-strong)}.border-chat-code-border{border-color:var(--chat-code-border)}.border-chat-danger{border-color:var(--chat-danger)}.border-chat-divider{border-color:var(--chat-divider)}.border-chat-popover-border{border-color:var(--chat-popover-border)}.bg-\(--chat-backdrop\){background-color:var(--chat-backdrop)}.bg-\(--chat-notice-bg\,transparent\){background-color:var(--chat-notice-bg,transparent)}.bg-\[var\(--chat-danger-bg\,color-mix\(in_srgb\,var\(--chat-danger\)_70\%\,black\)\)\]{background-color:var(--chat-danger-bg,var(--chat-danger))}@supports (color:color-mix(in lab, red, red)){.bg-\[var\(--chat-danger-bg\,color-mix\(in_srgb\,var\(--chat-danger\)_70\%\,black\)\)\]{background-color:var(--chat-danger-bg,color-mix(in srgb,var(--chat-danger) 70%,black))}}.bg-\[var\(--chat-segment-track\,color-mix\(in_srgb\,var\(--chat-bg\)_55\%\,transparent\)\)\]{background-color:var(--chat-segment-track,var(--chat-bg))}@supports (color:color-mix(in lab, red, red)){.bg-\[var\(--chat-segment-track\,color-mix\(in_srgb\,var\(--chat-bg\)_55\%\,transparent\)\)\]{background-color:var(--chat-segment-track,color-mix(in srgb,var(--chat-bg) 55%,transparent))}}.bg-chat-accent{background-color:var(--chat-accent)}.bg-chat-bg{background-color:var(--chat-bg)}.bg-chat-bubble{background-color:var(--chat-bubble)}.bg-chat-check{background-color:var(--chat-check)}.bg-chat-code-bg{background-color:var(--chat-code-bg)}.bg-chat-fg{background-color:var(--chat-fg)}.bg-chat-popover{background-color:var(--chat-popover)}.bg-chat-raised{background-color:var(--chat-raised)}.bg-chat-selected{background-color:var(--chat-selected)}.bg-chat-sidebar{background-color:var(--chat-sidebar)}.bg-chat-surface{background-color:var(--chat-surface)}.bg-chat-warning-bg{background-color:var(--chat-warning-bg)}.bg-transparent{background-color:#0000}.bg-linear-to-t{--tw-gradient-position:to top}@supports (background-image:linear-gradient(in lab, red, red)){.bg-linear-to-t{--tw-gradient-position:to top in oklab}}.bg-linear-to-t{background-image:linear-gradient(var(--tw-gradient-stops))}.from-chat-bg{--tw-gradient-from:var(--chat-bg);--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.from-70\%{--tw-gradient-from-position:70%}.to-transparent{--tw-gradient-to:transparent;--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.mask-b-from-60\%{-webkit-mask-image:var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);-webkit-mask-image:var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);mask-image:var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);--tw-mask-linear:var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);--tw-mask-bottom:linear-gradient(to bottom, var(--tw-mask-bottom-from-color) var(--tw-mask-bottom-from-position), var(--tw-mask-bottom-to-color) var(--tw-mask-bottom-to-position));--tw-mask-bottom-from-position:60%;-webkit-mask-composite:source-in;-webkit-mask-composite:source-in;mask-composite:intersect}.mask-b-to-100\%{-webkit-mask-image:var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);-webkit-mask-image:var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);mask-image:var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);--tw-mask-linear:var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);--tw-mask-bottom:linear-gradient(to bottom, var(--tw-mask-bottom-from-color) var(--tw-mask-bottom-from-position), var(--tw-mask-bottom-to-color) var(--tw-mask-bottom-to-position));--tw-mask-bottom-to-position:100%;-webkit-mask-composite:source-in;-webkit-mask-composite:source-in;mask-composite:intersect}.\[mask-image\:linear-gradient\(to_bottom\,black_45\%\,transparent_72\%\)\]{-webkit-mask-image:linear-gradient(#000 45%,#0000 72%);mask-image:linear-gradient(#000 45%,#0000 72%)}.fill-current{fill:currentColor}.object-cover{object-fit:cover}.p-0\.5{padding:calc(var(--spacing) * .5)}.p-1\.5{padding:calc(var(--spacing) * 1.5)}.p-2{padding:calc(var(--spacing) * 2)}.p-2\.5{padding:calc(var(--spacing) * 2.5)}.p-3{padding:calc(var(--spacing) * 3)}.p-4{padding:calc(var(--spacing) * 4)}.px-\(--chat-gutter\){padding-inline:var(--chat-gutter)}.px-0\.5{padding-inline:calc(var(--spacing) * .5)}.px-1{padding-inline:var(--spacing)}.px-1\.5{padding-inline:calc(var(--spacing) * 1.5)}.px-2{padding-inline:calc(var(--spacing) * 2)}.px-2\.5{padding-inline:calc(var(--spacing) * 2.5)}.px-3{padding-inline:calc(var(--spacing) * 3)}.px-3\.5{padding-inline:calc(var(--spacing) * 3.5)}.px-4{padding-inline:calc(var(--spacing) * 4)}.px-5{padding-inline:calc(var(--spacing) * 5)}.px-\[var\(--chat-gutter\,var\(--chat-content-padding\)\)\]{padding-inline:var(--chat-gutter,var(--chat-content-padding))}.py-0\.5{padding-block:calc(var(--spacing) * .5)}.py-1{padding-block:var(--spacing)}.py-1\.5{padding-block:calc(var(--spacing) * 1.5)}.py-2{padding-block:calc(var(--spacing) * 2)}.py-2\.5{padding-block:calc(var(--spacing) * 2.5)}.py-3\.5{padding-block:calc(var(--spacing) * 3.5)}.py-4{padding-block:calc(var(--spacing) * 4)}.py-px{padding-block:1px}.pt-1{padding-top:var(--spacing)}.pt-1\.5{padding-top:calc(var(--spacing) * 1.5)}.pt-2{padding-top:calc(var(--spacing) * 2)}.pt-2\.5{padding-top:calc(var(--spacing) * 2.5)}.pt-3{padding-top:calc(var(--spacing) * 3)}.pt-4{padding-top:calc(var(--spacing) * 4)}.pt-6{padding-top:calc(var(--spacing) * 6)}.pr-1{padding-right:var(--spacing)}.pr-8{padding-right:calc(var(--spacing) * 8)}.pb-1{padding-bottom:var(--spacing)}.pb-2{padding-bottom:calc(var(--spacing) * 2)}.pb-3{padding-bottom:calc(var(--spacing) * 3)}.pb-4{padding-bottom:calc(var(--spacing) * 4)}.pb-9{padding-bottom:calc(var(--spacing) * 9)}.pb-\[10cqh\]{padding-bottom:10cqh}.pb-\[max\(0\.5rem\,env\(safe-area-inset-bottom\)\)\]{padding-bottom:max(.5rem, env(safe-area-inset-bottom))}.pb-\[max\(0\.25rem\,env\(safe-area-inset-bottom\)\)\]{padding-bottom:max(.25rem, env(safe-area-inset-bottom))}.pb-\[max\(1rem\,env\(safe-area-inset-bottom\)\)\]{padding-bottom:max(1rem, env(safe-area-inset-bottom))}.pl-2{padding-left:calc(var(--spacing) * 2)}.pl-6{padding-left:calc(var(--spacing) * 6)}.pl-8{padding-left:calc(var(--spacing) * 8)}.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.font-chat-mono{font-family:var(--chat-font-mono)}.font-chat-sans{font-family:var(--chat-font-sans)}.font-chat-serif{font-family:var(--chat-font-serif)}.font-mono{font-family:var(--font-mono)}.font-sans{font-family:var(--font-sans)}.font-serif{font-family:var(--font-serif)}.text-base{font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-\(length\:--chat-activity-font-size\){font-size:var(--chat-activity-font-size)}.text-\(length\:--chat-bubble-font-size\){font-size:var(--chat-bubble-font-size)}.text-\(length\:--chat-code-font-size\){font-size:var(--chat-code-font-size)}.text-\(length\:--chat-ui-font-size\){font-size:var(--chat-ui-font-size)}.text-\(length\:--chat-ui-font-size-sm\){font-size:var(--chat-ui-font-size-sm)}.text-\[0\.625rem\]{font-size:.625rem}.text-\[0\.5625rem\]{font-size:.5625rem}.text-\[clamp\(1\.5rem\,6cqw\,2\.5rem\)\]{font-size:clamp(1.5rem,6cqw,2.5rem)}.leading-4{--tw-leading:calc(var(--spacing) * 4);line-height:calc(var(--spacing) * 4)}.leading-5{--tw-leading:calc(var(--spacing) * 5);line-height:calc(var(--spacing) * 5)}.leading-\[1\.75\]{--tw-leading:1.75;line-height:1.75}.leading-none{--tw-leading:1;line-height:1}.leading-relaxed{--tw-leading:var(--leading-relaxed);line-height:var(--leading-relaxed)}.leading-snug{--tw-leading:var(--leading-snug);line-height:var(--leading-snug)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-normal{--tw-font-weight:var(--font-weight-normal);font-weight:var(--font-weight-normal)}.tracking-wide{--tw-tracking:var(--tracking-wide);letter-spacing:var(--tracking-wide)}.break-words{overflow-wrap:break-word}.break-all{word-break:break-all}.whitespace-nowrap{white-space:nowrap}.whitespace-pre{white-space:pre}.whitespace-pre-wrap{white-space:pre-wrap}.text-\[var\(--chat-danger-fg\,\#fff\)\]{color:var(--chat-danger-fg,#fff)}.text-chat-accent{color:var(--chat-accent)}.text-chat-accent-fg{color:var(--chat-accent-fg)}.text-chat-bg{color:var(--chat-bg)}.text-chat-check{color:var(--chat-check)}.text-chat-danger{color:var(--chat-danger)}.text-chat-fg{color:var(--chat-fg)}.text-chat-muted{color:var(--chat-muted)}.text-chat-subtle{color:var(--chat-subtle)}.text-chat-warning{color:var(--chat-warning)}.lowercase{text-transform:lowercase}.uppercase{text-transform:uppercase}.tabular-nums{--tw-numeric-spacing:tabular-nums;font-variant-numeric:var(--tw-ordinal, ) var(--tw-slashed-zero, ) var(--tw-numeric-figure, ) var(--tw-numeric-spacing, ) var(--tw-numeric-fraction, )}.underline{text-decoration-line:underline}.decoration-chat-subtle{-webkit-text-decoration-color:var(--chat-subtle);-webkit-text-decoration-color:var(--chat-subtle);text-decoration-color:var(--chat-subtle)}.decoration-dotted{text-decoration-style:dotted}.underline-offset-4{text-underline-offset:4px}.opacity-0{opacity:0}.opacity-60{opacity:.6}.opacity-100{opacity:1}.shadow-chat-popover{--tw-shadow:var(--chat-shadow-popover);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.outline{outline-style:var(--tw-outline-style);outline-width:1px}.filter{filter:var(--tw-blur, ) var(--tw-brightness, ) var(--tw-contrast, ) var(--tw-grayscale, ) var(--tw-hue-rotate, ) var(--tw-invert, ) var(--tw-saturate, ) var(--tw-sepia, ) var(--tw-drop-shadow, )}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-\[width\]{transition-property:width;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-transform{transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.duration-150{--tw-duration:.15s;transition-duration:.15s}.duration-200{--tw-duration:.2s;transition-duration:.2s}.ease-out{--tw-ease:var(--ease-out);transition-timing-function:var(--ease-out)}.outline-none{--tw-outline-style:none;outline-style:none}.select-none{-webkit-user-select:none;user-select:none}:is(:where(.group\/card):focus-within .group-focus-within\/card\:opacity-100){opacity:1}:is(:where(.group\/item):focus-within .group-focus-within\/item\:pr-8){padding-right:calc(var(--spacing) * 8)}:is(:where(.group\/item):focus-within .group-focus-within\/item\:opacity-100),:is(:where(.group\/message):focus-within .group-focus-within\/message\:opacity-100){opacity:1}@media (hover:hover){:is(:where(.group\/card):hover .group-hover\/card\:opacity-100){opacity:1}:is(:where(.group\/item):hover .group-hover\/item\:pr-8){padding-right:calc(var(--spacing) * 8)}:is(:where(.group\/item):hover .group-hover\/item\:opacity-100),:is(:where(.group\/message):hover .group-hover\/message\:opacity-100),:is(:where(.group\/section):hover .group-hover\/section\:opacity-100){opacity:1}}:is(:where(.group\/trigger)[aria-expanded=true] .group-aria-expanded\/trigger\:rotate-90){rotate:90deg}:is(:where(.group\/trigger)[data-focus-visible] .group-data-focus-visible\/trigger\:opacity-100),:is(:where(.group)[data-hovered] .group-data-hovered\:opacity-100){opacity:1}.placeholder\:text-chat-subtle::placeholder{color:var(--chat-subtle)}.focus-within\:border-chat-border-strong:focus-within{border-color:var(--chat-border-strong)}@media (hover:hover){.hover\:text-chat-fg:hover{color:var(--chat-fg)}.hover\:underline:hover{text-decoration-line:underline}}.focus\:border-chat-border-strong:focus{border-color:var(--chat-border-strong)}.focus-visible\:ring-2:focus-visible{--tw-ring-shadow:var(--tw-ring-inset, ) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.focus-visible\:ring-chat-focus:focus-visible{--tw-ring-color:var(--chat-focus)}.data-disabled\:cursor-default[data-disabled]{cursor:default}.data-disabled\:opacity-40[data-disabled]{opacity:.4}.data-entering\:animate-chat-drawer-in[data-entering]{animation:.22s cubic-bezier(.2,.8,.2,1) chat-drawer-in}.data-entering\:animate-chat-drawer-in-right[data-entering]{animation:.22s cubic-bezier(.2,.8,.2,1) chat-drawer-in-right}.data-entering\:animate-chat-fade-in[data-entering]{animation:.2s ease-out chat-fade-in}.data-entering\:animate-chat-in[data-entering]{animation:.12s ease-out chat-in}.data-exiting\:animate-chat-drawer-out[data-exiting]{animation:.16s ease-in reverse forwards chat-drawer-in}.data-exiting\:animate-chat-drawer-out-right[data-exiting]{animation:.16s ease-in reverse forwards chat-drawer-in-right}.data-exiting\:animate-chat-fade-out[data-exiting]{animation:.15s ease-in reverse forwards chat-fade-in}.data-exiting\:animate-chat-out[data-exiting]{animation:90ms ease-in forwards chat-out}.data-focus-visible\:opacity-100[data-focus-visible]{opacity:1}.data-focus-visible\:ring-2[data-focus-visible]{--tw-ring-shadow:var(--tw-ring-inset, ) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.data-focus-visible\:ring-chat-focus[data-focus-visible]{--tw-ring-color:var(--chat-focus)}.data-focus-visible\:ring-inset[data-focus-visible]{--tw-ring-inset:inset}.data-focused\:bg-chat-popover-hover[data-focused]{background-color:var(--chat-popover-hover)}.data-hovered\:bg-chat-hover[data-hovered]{background-color:var(--chat-hover)}.data-hovered\:text-chat-fg[data-hovered]{color:var(--chat-fg)}.data-hovered\:text-chat-muted[data-hovered]{color:var(--chat-muted)}.data-hovered\:brightness-110[data-hovered]{--tw-brightness:brightness(110%);filter:var(--tw-blur, ) var(--tw-brightness, ) var(--tw-contrast, ) var(--tw-grayscale, ) var(--tw-hue-rotate, ) var(--tw-invert, ) var(--tw-saturate, ) var(--tw-sepia, ) var(--tw-drop-shadow, )}.data-open\:bg-chat-popover-hover[data-open]{background-color:var(--chat-popover-hover)}.data-pressed\:bg-chat-selected[data-pressed]{background-color:var(--chat-selected)}.data-pressed\:brightness-95[data-pressed]{--tw-brightness:brightness(95%);filter:var(--tw-blur, ) var(--tw-brightness, ) var(--tw-contrast, ) var(--tw-grayscale, ) var(--tw-hue-rotate, ) var(--tw-invert, ) var(--tw-saturate, ) var(--tw-sepia, ) var(--tw-drop-shadow, )}.data-selected\:bg-\[var\(--chat-segment-selected\,var\(--chat-raised\)\)\][data-selected]{background-color:var(--chat-segment-selected,var(--chat-raised))}.data-selected\:text-chat-fg[data-selected]{color:var(--chat-fg)}.data-selected\:shadow-\[inset_0_0_0_1px_var\(--chat-border-strong\)\][data-selected]{--tw-shadow:inset 0 0 0 1px var(--tw-shadow-color,var(--chat-border-strong));box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}@media (prefers-reduced-motion:no-preference){.motion-safe\:data-entering\:animate-chat-in[data-entering]{animation:.12s ease-out chat-in}.motion-safe\:data-exiting\:animate-chat-out[data-exiting]{animation:90ms ease-in forwards chat-out}}@media (prefers-reduced-motion:reduce){.motion-reduce\:animate-none{animation:none}.motion-reduce\:transition-none{transition-property:none}}.\[\&_svg\]\:size-3 svg{width:calc(var(--spacing) * 3);height:calc(var(--spacing) * 3)}.\[\&_svg\]\:size-3\.5 svg{width:calc(var(--spacing) * 3.5);height:calc(var(--spacing) * 3.5)}.\[\&_svg\]\:size-4 svg{width:calc(var(--spacing) * 4);height:calc(var(--spacing) * 4)}.\[\&_svg\]\:size-5 svg{width:calc(var(--spacing) * 5);height:calc(var(--spacing) * 5)}.\[\&_svg\]\:size-\[1em\] svg{width:1em;height:1em}.\[\&_svg\]\:shrink-0 svg{flex-shrink:0}.\[\&_svg\]\:fill-current svg{fill:currentColor}.\[\&\:not\(\:first-child\)\]\:mt-1:not(:first-child){margin-top:var(--spacing)}@media (hover:none){.\[\@media\(hover\:none\)\]\:pr-10{padding-right:calc(var(--spacing) * 10)}.\[\@media\(hover\:none\)\]\:opacity-100{opacity:1}}@media (pointer:coarse){.\[\@media\(pointer\:coarse\)\]\:size-7\!{width:calc(var(--spacing) * 7)!important;height:calc(var(--spacing) * 7)!important}.\[\@media\(pointer\:coarse\)\]\:size-8{width:calc(var(--spacing) * 8);height:calc(var(--spacing) * 8)}.\[\@media\(pointer\:coarse\)\]\:size-9{width:calc(var(--spacing) * 9);height:calc(var(--spacing) * 9)}.\[\@media\(pointer\:coarse\)\]\:size-10{width:calc(var(--spacing) * 10);height:calc(var(--spacing) * 10)}.\[\@media\(pointer\:coarse\)\]\:h-9{height:calc(var(--spacing) * 9)}.\[\@media\(pointer\:coarse\)\]\:h-10{height:calc(var(--spacing) * 10)}.\[\@media\(pointer\:coarse\)\]\:h-11{height:calc(var(--spacing) * 11)}.\[\@media\(pointer\:coarse\)\]\:w-10{width:calc(var(--spacing) * 10)}}}@keyframes chat-word-in{0%{opacity:0}}[data-chat-code-bg=theme]{background-color:light-dark(var(--shiki-light-bg),var(--shiki-dark-bg))}[data-chat-code-bg=theme] pre{color:light-dark(var(--shiki-light),var(--shiki-dark))}@keyframes chat-shimmer-surface{0%{background-position:150% 0}to{background-position:-50% 0}}@keyframes chat-shimmer{0%{background-position:-20em 0}to{background-position:0 0}}@media (prefers-reduced-motion:reduce){.chat-markdown.chat-fade .chat-word:not([data-chat-motion=full] *){animation:none}.chat-shimmer-surface:not([data-chat-motion=full] *):after{background:var(--chat-fg);animation:none}@supports (color:color-mix(in lab, red, red)){.chat-shimmer-surface:not([data-chat-motion=full] *):after{background:color-mix(in srgb, var(--chat-fg) 6%, transparent)}}.chat-shimmer:not([data-chat-motion=full] *){color:var(--chat-muted);background:0 0;animation:none}[data-entering]:not([data-chat-motion=full] *),[data-exiting]:not([data-chat-motion=full] *){animation-duration:1ms!important}}[data-chat-motion=reduce] .chat-markdown.chat-fade .chat-word{animation:none}[data-chat-motion=reduce] .chat-shimmer-surface:after{background:var(--chat-fg);animation:none}@supports (color:color-mix(in lab, red, red)){[data-chat-motion=reduce] .chat-shimmer-surface:after{background:color-mix(in srgb, var(--chat-fg) 6%, transparent)}}[data-chat-motion=reduce] .chat-shimmer{color:var(--chat-muted);background:0 0;animation:none}[data-chat-motion=reduce] [data-entering],[data-chat-motion=reduce] [data-exiting]{animation-duration:1ms!important}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-divide-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-gradient-position{syntax:"*";inherits:false}@property --tw-gradient-from{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-via{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-to{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-stops{syntax:"*";inherits:false}@property --tw-gradient-via-stops{syntax:"*";inherits:false}@property --tw-gradient-from-position{syntax:"<length-percentage>";inherits:false;initial-value:0%}@property --tw-gradient-via-position{syntax:"<length-percentage>";inherits:false;initial-value:50%}@property --tw-gradient-to-position{syntax:"<length-percentage>";inherits:false;initial-value:100%}@property --tw-mask-linear{syntax:"*";inherits:false;initial-value:linear-gradient(#fff, #fff)}@property --tw-mask-radial{syntax:"*";inherits:false;initial-value:linear-gradient(#fff, #fff)}@property --tw-mask-conic{syntax:"*";inherits:false;initial-value:linear-gradient(#fff, #fff)}@property --tw-mask-left{syntax:"*";inherits:false;initial-value:linear-gradient(#fff, #fff)}@property --tw-mask-right{syntax:"*";inherits:false;initial-value:linear-gradient(#fff, #fff)}@property --tw-mask-bottom{syntax:"*";inherits:false;initial-value:linear-gradient(#fff, #fff)}@property --tw-mask-top{syntax:"*";inherits:false;initial-value:linear-gradient(#fff, #fff)}@property --tw-mask-bottom-from-position{syntax:"*";inherits:false;initial-value:0%}@property --tw-mask-bottom-to-position{syntax:"*";inherits:false;initial-value:100%}@property --tw-mask-bottom-from-color{syntax:"*";inherits:false;initial-value:black}@property --tw-mask-bottom-to-color{syntax:"*";inherits:false;initial-value:transparent}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-ordinal{syntax:"*";inherits:false}@property --tw-slashed-zero{syntax:"*";inherits:false}@property --tw-numeric-figure{syntax:"*";inherits:false}@property --tw-numeric-spacing{syntax:"*";inherits:false}@property --tw-numeric-fraction{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@property --tw-duration{syntax:"*";inherits:false}@property --tw-ease{syntax:"*";inherits:false}@keyframes pulse{50%{opacity:.5}}@keyframes chat-drawer-in-right{0%{transform:translate(100%)}}@keyframes chat-fade-in{0%{opacity:0}}@keyframes chat-drawer-in{0%{transform:translate(-100%)}}@keyframes chat-in{0%{opacity:0;transform:scale(.98)}}@keyframes chat-out{to{opacity:0;transform:scale(.98)}}
|
|
3
|
+
@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:block))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-space-y-reverse:0;--tw-divide-y-reverse:0;--tw-border-style:solid;--tw-gradient-position:initial;--tw-gradient-from:#0000;--tw-gradient-via:#0000;--tw-gradient-to:#0000;--tw-gradient-stops:initial;--tw-gradient-via-stops:initial;--tw-gradient-from-position:0%;--tw-gradient-via-position:50%;--tw-gradient-to-position:100%;--tw-mask-linear:linear-gradient(#fff, #fff);--tw-mask-radial:linear-gradient(#fff, #fff);--tw-mask-conic:linear-gradient(#fff, #fff);--tw-mask-left:linear-gradient(#fff, #fff);--tw-mask-right:linear-gradient(#fff, #fff);--tw-mask-bottom:linear-gradient(#fff, #fff);--tw-mask-top:linear-gradient(#fff, #fff);--tw-mask-bottom-from-position:0%;--tw-mask-bottom-to-position:100%;--tw-mask-bottom-from-color:black;--tw-mask-bottom-to-color:transparent;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking:initial;--tw-ordinal:initial;--tw-slashed-zero:initial;--tw-numeric-figure:initial;--tw-numeric-spacing:initial;--tw-numeric-fraction:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-outline-style:solid;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-duration:initial;--tw-ease:initial}}}@layer theme{:root,:host{--font-sans:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--font-serif:ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--spacing:.25rem;--container-2xl:42rem;--text-base:1rem;--text-base--line-height:calc(1.5 / 1);--text-lg:1.125rem;--text-lg--line-height:calc(1.75 / 1.125);--font-weight-normal:400;--font-weight-medium:500;--tracking-wide:.025em;--leading-snug:1.375;--leading-relaxed:1.625;--radius-sm:.25rem;--ease-out:cubic-bezier(0, 0, .2, 1);--animate-pulse:pulse 2s cubic-bezier(.4, 0, .6, 1) infinite;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring:where(:not(iframe)){outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab, currentcolor 50%, transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}:root,[data-chat-theme=claude-dark]{color-scheme:dark;--chat-bg:#191919;--chat-sidebar:#1f1f1f;--chat-surface:#303030;--chat-raised:#3a3a3a;--chat-hover:#3d3d3d;--chat-selected:#4a4a4a;--chat-bubble:#2a2a2a;--chat-popover:#303030;--chat-popover-border:#383838;--chat-popover-hover:#4f4f4f;--chat-border:#303030;--chat-border-strong:#454545;--chat-divider:#222;--chat-code-bg:#1c1c1c;--chat-code-border:#252525;--chat-inline-code:#2e2e2e;--chat-fg:#ecebe6;--chat-muted:#a3a29e;--chat-subtle:#75746f;--chat-accent:#d97757;--chat-accent-fg:#fff;--chat-check:#6c9cf0;--chat-warning:#e8b04b;--chat-warning-bg:#4a3b1c;--chat-danger:#e5675c;--chat-focus:#6c9cf0;--chat-backdrop:#00000080;--chat-font-sans:"Inter", ui-sans-serif, system-ui, sans-serif;--chat-font-serif:"Source Serif 4", ui-serif, Georgia, serif;--chat-font-mono:"JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;--chat-radius-sm:6px;--chat-radius-md:10px;--chat-radius-lg:16px;--chat-radius-popover:12px;--chat-shadow-popover:0 8px 24px #00000080;--chat-content-width:48rem;--chat-content-padding:1.5rem;--chat-message-font-size:1.0625rem;--chat-code-font-size:.8125rem;--chat-message-line-height:1.65;--chat-ui-font-size:.875rem;--chat-ui-font-size-sm:.75rem;--chat-bubble-font-size:.9375rem;--chat-activity-font-size:.9375rem}}@layer components{.chat-markdown{font-family:var(--chat-font-message,var(--chat-font-serif));font-size:var(--chat-message-font-size);line-height:var(--chat-message-line-height);color:var(--chat-fg);overflow-wrap:anywhere}.chat-markdown>div>*+*{margin-top:.75em}.chat-markdown :is(h1,h2,h3,h4){margin-top:1.25em;font-weight:600;line-height:1.3}.chat-markdown h1{font-size:1.5em}.chat-markdown h2{font-size:1.3em}.chat-markdown h3{font-size:1.12em}.chat-markdown :is(strong,[data-streamdown=strong]){font-weight:650}.chat-markdown :is(ul,ol){padding-left:1.6em}.chat-markdown ul{list-style:outside}.chat-markdown ol{list-style:decimal}.chat-markdown li+li,.chat-markdown li>:is(ul,ol){margin-top:.3em}.chat-markdown .chat-ui-tree{font-family:var(--chat-font-sans);font-size:var(--chat-ui-font-size);line-height:1.5}.chat-markdown .chat-ui-tree :is(ul,ol){padding-left:0;list-style:none}.chat-markdown .chat-ui-tree li+li{margin-top:0}.chat-markdown .chat-ui-tree :is(h1,h2,h3,h4){font-size:inherit;margin-top:0}.chat-markdown a{color:var(--chat-fg);text-decoration:underline;-webkit-text-decoration-color:var(--chat-subtle);-webkit-text-decoration-color:var(--chat-subtle);text-decoration-color:var(--chat-subtle);text-underline-offset:3px}.chat-markdown a:hover{-webkit-text-decoration-color:var(--chat-fg);-webkit-text-decoration-color:var(--chat-fg);text-decoration-color:var(--chat-fg)}.chat-markdown blockquote{border-left:3px solid var(--chat-border-strong);color:var(--chat-muted);padding-left:1em}.chat-markdown hr{border-color:var(--chat-border);margin-block:1.5em}.chat-markdown [data-chat-inline-code]{font-family:var(--chat-font-mono);background:var(--chat-inline-code);border-radius:5px;padding:.12em .35em;font-size:.82em}.chat-markdown [data-streamdown=table-wrapper]{margin-block:1em;overflow-x:auto}.chat-markdown table{border-collapse:collapse;font-family:var(--chat-font-sans);font-size:var(--chat-ui-font-size)}.chat-markdown :is(th,td){border-bottom:1px solid var(--chat-border);text-align:left;padding:.45em .9em .45em 0}.chat-markdown th{font-weight:600}.chat-markdown .katex-display{margin-block:1em;overflow:auto hidden}.chat-markdown .katex{font-size:1.08em}.chat-markdown.chat-fade .chat-word{animation:chat-word-in var(--chat-fade-duration,.7s) ease-out both}.chat-view{container:chat/inline-size}.chat-view-body{--chat-gutter:var(--chat-content-padding);container:chat-body/size}@container chat (max-width:34rem){.chat-view-body{--chat-gutter:min(var(--chat-content-padding), .75rem)}}@container chat (max-width:24rem){.chat-picker-detail{display:none}}@container chat-body (max-height:24rem){.chat-empty-greeting{display:none}}.chat-code-token{color:light-dark(var(--shiki-light),var(--shiki-dark))}.chat-shimmer{background-image:linear-gradient(90deg, var(--chat-muted) 0%, var(--chat-muted) 35%, var(--chat-fg) 50%, var(--chat-muted) 65%, var(--chat-muted) 100%);color:#0000;animation:chat-shimmer var(--chat-shimmer-duration,2s) linear infinite;background-repeat:repeat-x;background-size:20em 100%;-webkit-background-clip:text;background-clip:text}.chat-markdown.chat-thinking{font-family:var(--chat-font-sans);font-size:var(--chat-activity-font-size);color:var(--chat-muted);line-height:1.6}.chat-shimmer-surface:after{content:"";background:linear-gradient(100deg, transparent 30%, var(--chat-fg) 50%, transparent 70%) 0 0 / 300% 100%;position:absolute;inset:0}@supports (color:color-mix(in lab, red, red)){.chat-shimmer-surface:after{background:linear-gradient(100deg, transparent 30%, color-mix(in srgb, var(--chat-fg) 12%, transparent) 50%, transparent 70%) 0 0 / 300% 100%}}.chat-shimmer-surface:after{pointer-events:none;animation:1.6s linear infinite chat-shimmer-surface}}@layer utilities{.pointer-events-none{pointer-events:none}.collapse{visibility:collapse}.visible{visibility:visible}.sr-only{clip-path:inset(50%);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.static{position:static}.sticky{position:sticky}.inset-0{inset:0}.-inset-x-2{inset-inline:calc(var(--spacing) * -2)}.inset-x-2{inset-inline:calc(var(--spacing) * 2)}.inset-y-0{inset-block:0}.-top-2{top:calc(var(--spacing) * -2)}.top-1\/2{top:50%}.-right-2{right:calc(var(--spacing) * -2)}.right-0{right:0}.right-1{right:var(--spacing)}.bottom-0{bottom:0}.bottom-2{bottom:calc(var(--spacing) * 2)}.bottom-\[min\(10rem\,40\%\)\]{bottom:min(10rem,40%)}.left-0{left:0}.left-1\/2{left:50%}.z-40{z-index:40}.z-50{z-index:50}.container{width:100%}@media (min-width:40rem){.container{max-width:40rem}}@media (min-width:48rem){.container{max-width:48rem}}@media (min-width:64rem){.container{max-width:64rem}}@media (min-width:80rem){.container{max-width:80rem}}@media (min-width:96rem){.container{max-width:96rem}}.m-0{margin:0}.-mx-1{margin-inline:calc(var(--spacing) * -1)}.-mx-1\.5{margin-inline:calc(var(--spacing) * -1.5)}.mx-2{margin-inline:calc(var(--spacing) * 2)}.mx-5{margin-inline:calc(var(--spacing) * 5)}.mx-auto{margin-inline:auto}.my-1\.5{margin-block:calc(var(--spacing) * 1.5)}.my-2{margin-block:calc(var(--spacing) * 2)}.my-4{margin-block:calc(var(--spacing) * 4)}.-mt-1\.5{margin-top:calc(var(--spacing) * -1.5)}.mt-0\.5{margin-top:calc(var(--spacing) * .5)}.mt-1{margin-top:var(--spacing)}.mt-1\.5{margin-top:calc(var(--spacing) * 1.5)}.mt-2{margin-top:calc(var(--spacing) * 2)}.mt-2\.5{margin-top:calc(var(--spacing) * 2.5)}.mt-3{margin-top:calc(var(--spacing) * 3)}.-mr-2{margin-right:calc(var(--spacing) * -2)}.mr-1\.5{margin-right:calc(var(--spacing) * 1.5)}.mb-1\.5{margin-bottom:calc(var(--spacing) * 1.5)}.mb-2{margin-bottom:calc(var(--spacing) * 2)}.mb-3{margin-bottom:calc(var(--spacing) * 3)}.-ml-1\.5{margin-left:calc(var(--spacing) * -1.5)}.ml-1\.5{margin-left:calc(var(--spacing) * 1.5)}.ml-auto{margin-left:auto}.line-clamp-3{-webkit-line-clamp:3;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.block{display:block}.flex{display:flex}.hidden{display:none}.inline{display:inline}.inline-flex{display:inline-flex}.size-0{width:0;height:0}.size-1\.5{width:calc(var(--spacing) * 1.5);height:calc(var(--spacing) * 1.5)}.size-2{width:calc(var(--spacing) * 2);height:calc(var(--spacing) * 2)}.size-2\.5{width:calc(var(--spacing) * 2.5);height:calc(var(--spacing) * 2.5)}.size-4{width:calc(var(--spacing) * 4);height:calc(var(--spacing) * 4)}.size-6{width:calc(var(--spacing) * 6);height:calc(var(--spacing) * 6)}.size-7{width:calc(var(--spacing) * 7);height:calc(var(--spacing) * 7)}.size-8{width:calc(var(--spacing) * 8);height:calc(var(--spacing) * 8)}.size-24{width:calc(var(--spacing) * 24);height:calc(var(--spacing) * 24)}.size-30{width:calc(var(--spacing) * 30);height:calc(var(--spacing) * 30)}.size-\[1\.15em\]{width:1.15em;height:1.15em}.size-full{width:100%;height:100%}.h-1{height:var(--spacing)}.h-6{height:calc(var(--spacing) * 6)}.h-7{height:calc(var(--spacing) * 7)}.h-8{height:calc(var(--spacing) * 8)}.h-9{height:calc(var(--spacing) * 9)}.h-10{height:calc(var(--spacing) * 10)}.h-12{height:calc(var(--spacing) * 12)}.h-dvh{height:100dvh}.h-full{height:100%}.max-h-48{max-height:calc(var(--spacing) * 48)}.max-h-56{max-height:calc(var(--spacing) * 56)}.max-h-72{max-height:calc(var(--spacing) * 72)}.max-h-96{max-height:calc(var(--spacing) * 96)}.max-h-\[85dvh\]{max-height:85dvh}.max-h-\[inherit\]{max-height:inherit}.max-h-\[min\(10rem\,30cqh\)\]{max-height:min(10rem,30cqh)}.max-h-\[min\(18rem\,35cqh\)\]{max-height:min(18rem,35cqh)}.max-h-\[min\(24rem\,45cqh\)\]{max-height:min(24rem,45cqh)}.min-h-0{min-height:0}.min-h-2{min-height:calc(var(--spacing) * 2)}.min-h-6{min-height:calc(var(--spacing) * 6)}.min-h-7{min-height:calc(var(--spacing) * 7)}.min-h-12{min-height:calc(var(--spacing) * 12)}.min-h-64{min-height:calc(var(--spacing) * 64)}.min-h-full{min-height:100%}.w-\(--chat-sidebar-width\,18rem\){width:var(--chat-sidebar-width,18rem)}.w-7{width:calc(var(--spacing) * 7)}.w-9{width:calc(var(--spacing) * 9)}.w-12{width:calc(var(--spacing) * 12)}.w-13{width:calc(var(--spacing) * 13)}.w-14{width:calc(var(--spacing) * 14)}.w-60{width:calc(var(--spacing) * 60)}.w-72{width:calc(var(--spacing) * 72)}.w-80{width:calc(var(--spacing) * 80)}.w-\[calc\(100\%\+1rem\)\]{width:calc(100% + 1rem)}.w-\[min\(20rem\,85vw\)\]{width:min(20rem,85vw)}.w-\[min\(36rem\,calc\(100vw-2rem\)\)\]{width:min(36rem,100vw - 2rem)}.w-full{width:100%}.max-w-\(--chat-content-width\){max-width:var(--chat-content-width)}.max-w-2xl{max-width:var(--container-2xl)}.max-w-\[85\%\]{max-width:85%}.max-w-\[calc\(var\(--chat-content-width\)\+2\*var\(--chat-gutter\,var\(--chat-content-padding\)\)\)\]{max-width:calc(var(--chat-content-width) + 2 * var(--chat-gutter,var(--chat-content-padding)))}.max-w-full{max-width:100%}.min-w-0{min-width:0}.min-w-44{min-width:calc(var(--spacing) * 44)}.min-w-52{min-width:calc(var(--spacing) * 52)}.min-w-\[2px\]{min-width:2px}.flex-1{flex:1}.shrink-0{flex-shrink:0}.grow{flex-grow:1}.-translate-1\/2{--tw-translate-x:calc(calc(1 / 2 * 100%) * -1);--tw-translate-y:calc(calc(1 / 2 * 100%) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.-translate-x-1\/2{--tw-translate-x:calc(calc(1 / 2 * 100%) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.-translate-y-1\/2{--tw-translate-y:calc(calc(1 / 2 * 100%) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.animate-pulse{animation:var(--animate-pulse)}.cursor-help{cursor:help}.cursor-pointer{cursor:pointer}.resize-none{resize:none}.\[scrollbar-width\:thin\]{scrollbar-width:thin}.\[scrollbar-color\:var\(--chat-border-strong\)_transparent\]{scrollbar-color:var(--chat-border-strong) transparent}.\[scrollbar-gutter\:stable\]{scrollbar-gutter:stable}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-baseline{align-items:baseline}.items-center{align-items:center}.items-end{align-items:flex-end}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.gap-0\.5{gap:calc(var(--spacing) * .5)}.gap-1{gap:var(--spacing)}.gap-1\.5{gap:calc(var(--spacing) * 1.5)}.gap-2{gap:calc(var(--spacing) * 2)}.gap-2\.5{gap:calc(var(--spacing) * 2.5)}.gap-3{gap:calc(var(--spacing) * 3)}.gap-4{gap:calc(var(--spacing) * 4)}.gap-6{gap:calc(var(--spacing) * 6)}.gap-8{gap:calc(var(--spacing) * 8)}.gap-px{gap:1px}:where(.space-y-1>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(var(--spacing) * var(--tw-space-y-reverse));margin-block-end:calc(var(--spacing) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-1\.5>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 1.5) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 1.5) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-4>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)))}:where(.divide-y>:not(:last-child)){--tw-divide-y-reverse:0;border-bottom-style:var(--tw-border-style);border-top-style:var(--tw-border-style);border-top-width:calc(1px * var(--tw-divide-y-reverse));border-bottom-width:calc(1px * calc(1 - var(--tw-divide-y-reverse)))}:where(.divide-chat-divider>:not(:last-child)){border-color:var(--chat-divider)}.self-center{align-self:center}.self-start{align-self:flex-start}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.overflow-y-auto{overflow-y:auto}.rounded-\[0\.3rem\]{border-radius:.3rem}.rounded-\[2px\]{border-radius:2px}.rounded-\[calc\(var\(--chat-radius-md\)-2px\)\]{border-radius:calc(var(--chat-radius-md) - 2px)}.rounded-\[inherit\]{border-radius:inherit}.rounded-\[var\(--chat-composer-radius\,1\.25rem\)\]{border-radius:var(--chat-composer-radius,1.25rem)}.rounded-\[var\(--chat-send-radius\,var\(--chat-radius-md\)\)\]\!{border-radius:var(--chat-send-radius,var(--chat-radius-md))!important}.rounded-chat-lg{border-radius:var(--chat-radius-lg)}.rounded-chat-md{border-radius:var(--chat-radius-md)}.rounded-chat-popover{border-radius:var(--chat-radius-popover)}.rounded-chat-sm{border-radius:var(--chat-radius-sm)}.rounded-full{border-radius:2147483647px}.rounded-sm{border-radius:var(--radius-sm)}.border{border-style:var(--tw-border-style);border-width:1px}.border-0{border-style:var(--tw-border-style);border-width:0}.border-2{border-style:var(--tw-border-style);border-width:2px}.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.border-r{border-right-style:var(--tw-border-style);border-right-width:1px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-dashed{--tw-border-style:dashed;border-style:dashed}.border-\(--chat-notice-border\,var\(--chat-border\)\){border-color:var(--chat-notice-border,var(--chat-border))}.border-chat-accent{border-color:var(--chat-accent)}.border-chat-accent\!{border-color:var(--chat-accent)!important}.border-chat-border{border-color:var(--chat-border)}.border-chat-border-strong{border-color:var(--chat-border-strong)}.border-chat-code-border{border-color:var(--chat-code-border)}.border-chat-danger{border-color:var(--chat-danger)}.border-chat-divider{border-color:var(--chat-divider)}.border-chat-popover-border{border-color:var(--chat-popover-border)}.bg-\(--chat-backdrop\){background-color:var(--chat-backdrop)}.bg-\(--chat-notice-bg\,transparent\){background-color:var(--chat-notice-bg,transparent)}.bg-\[var\(--chat-danger-bg\,color-mix\(in_srgb\,var\(--chat-danger\)_70\%\,black\)\)\]{background-color:var(--chat-danger-bg,var(--chat-danger))}@supports (color:color-mix(in lab, red, red)){.bg-\[var\(--chat-danger-bg\,color-mix\(in_srgb\,var\(--chat-danger\)_70\%\,black\)\)\]{background-color:var(--chat-danger-bg,color-mix(in srgb,var(--chat-danger) 70%,black))}}.bg-\[var\(--chat-segment-track\,color-mix\(in_srgb\,var\(--chat-bg\)_55\%\,transparent\)\)\]{background-color:var(--chat-segment-track,var(--chat-bg))}@supports (color:color-mix(in lab, red, red)){.bg-\[var\(--chat-segment-track\,color-mix\(in_srgb\,var\(--chat-bg\)_55\%\,transparent\)\)\]{background-color:var(--chat-segment-track,color-mix(in srgb,var(--chat-bg) 55%,transparent))}}.bg-chat-accent{background-color:var(--chat-accent)}.bg-chat-accent-fg\/70{background-color:var(--chat-accent-fg)}@supports (color:color-mix(in lab, red, red)){.bg-chat-accent-fg\/70{background-color:color-mix(in oklab, var(--chat-accent-fg) 70%, transparent)}}.bg-chat-bg{background-color:var(--chat-bg)}.bg-chat-border-strong{background-color:var(--chat-border-strong)}.bg-chat-bubble{background-color:var(--chat-bubble)}.bg-chat-check{background-color:var(--chat-check)}.bg-chat-code-bg{background-color:var(--chat-code-bg)}.bg-chat-fg{background-color:var(--chat-fg)}.bg-chat-popover{background-color:var(--chat-popover)}.bg-chat-raised{background-color:var(--chat-raised)}.bg-chat-selected{background-color:var(--chat-selected)}.bg-chat-sidebar{background-color:var(--chat-sidebar)}.bg-chat-subtle{background-color:var(--chat-subtle)}.bg-chat-surface{background-color:var(--chat-surface)}.bg-chat-warning-bg{background-color:var(--chat-warning-bg)}.bg-transparent{background-color:#0000}.bg-linear-to-t{--tw-gradient-position:to top}@supports (background-image:linear-gradient(in lab, red, red)){.bg-linear-to-t{--tw-gradient-position:to top in oklab}}.bg-linear-to-t{background-image:linear-gradient(var(--tw-gradient-stops))}.from-chat-bg{--tw-gradient-from:var(--chat-bg);--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.from-70\%{--tw-gradient-from-position:70%}.to-transparent{--tw-gradient-to:transparent;--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.mask-b-from-60\%{-webkit-mask-image:var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);-webkit-mask-image:var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);mask-image:var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);--tw-mask-linear:var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);--tw-mask-bottom:linear-gradient(to bottom, var(--tw-mask-bottom-from-color) var(--tw-mask-bottom-from-position), var(--tw-mask-bottom-to-color) var(--tw-mask-bottom-to-position));--tw-mask-bottom-from-position:60%;-webkit-mask-composite:source-in;-webkit-mask-composite:source-in;mask-composite:intersect}.mask-b-to-100\%{-webkit-mask-image:var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);-webkit-mask-image:var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);mask-image:var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);--tw-mask-linear:var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);--tw-mask-bottom:linear-gradient(to bottom, var(--tw-mask-bottom-from-color) var(--tw-mask-bottom-from-position), var(--tw-mask-bottom-to-color) var(--tw-mask-bottom-to-position));--tw-mask-bottom-to-position:100%;-webkit-mask-composite:source-in;-webkit-mask-composite:source-in;mask-composite:intersect}.\[mask-image\:linear-gradient\(to_bottom\,black_45\%\,transparent_72\%\)\]{-webkit-mask-image:linear-gradient(#000 45%,#0000 72%);mask-image:linear-gradient(#000 45%,#0000 72%)}.fill-current{fill:currentColor}.object-cover{object-fit:cover}.p-0\.5{padding:calc(var(--spacing) * .5)}.p-1\.5{padding:calc(var(--spacing) * 1.5)}.p-2{padding:calc(var(--spacing) * 2)}.p-2\.5{padding:calc(var(--spacing) * 2.5)}.p-3{padding:calc(var(--spacing) * 3)}.p-4{padding:calc(var(--spacing) * 4)}.px-\(--chat-gutter\){padding-inline:var(--chat-gutter)}.px-0\.5{padding-inline:calc(var(--spacing) * .5)}.px-1{padding-inline:var(--spacing)}.px-1\.5{padding-inline:calc(var(--spacing) * 1.5)}.px-2{padding-inline:calc(var(--spacing) * 2)}.px-2\.5{padding-inline:calc(var(--spacing) * 2.5)}.px-3{padding-inline:calc(var(--spacing) * 3)}.px-3\.5{padding-inline:calc(var(--spacing) * 3.5)}.px-4{padding-inline:calc(var(--spacing) * 4)}.px-5{padding-inline:calc(var(--spacing) * 5)}.px-\[var\(--chat-gutter\,var\(--chat-content-padding\)\)\]{padding-inline:var(--chat-gutter,var(--chat-content-padding))}.py-0\.5{padding-block:calc(var(--spacing) * .5)}.py-1{padding-block:var(--spacing)}.py-1\.5{padding-block:calc(var(--spacing) * 1.5)}.py-2{padding-block:calc(var(--spacing) * 2)}.py-2\.5{padding-block:calc(var(--spacing) * 2.5)}.py-3\.5{padding-block:calc(var(--spacing) * 3.5)}.py-4{padding-block:calc(var(--spacing) * 4)}.py-px{padding-block:1px}.pt-1{padding-top:var(--spacing)}.pt-1\.5{padding-top:calc(var(--spacing) * 1.5)}.pt-2{padding-top:calc(var(--spacing) * 2)}.pt-2\.5{padding-top:calc(var(--spacing) * 2.5)}.pt-3{padding-top:calc(var(--spacing) * 3)}.pt-4{padding-top:calc(var(--spacing) * 4)}.pt-6{padding-top:calc(var(--spacing) * 6)}.pr-1{padding-right:var(--spacing)}.pr-8{padding-right:calc(var(--spacing) * 8)}.pb-1{padding-bottom:var(--spacing)}.pb-2{padding-bottom:calc(var(--spacing) * 2)}.pb-3{padding-bottom:calc(var(--spacing) * 3)}.pb-4{padding-bottom:calc(var(--spacing) * 4)}.pb-9{padding-bottom:calc(var(--spacing) * 9)}.pb-\[10cqh\]{padding-bottom:10cqh}.pb-\[max\(0\.5rem\,env\(safe-area-inset-bottom\)\)\]{padding-bottom:max(.5rem, env(safe-area-inset-bottom))}.pb-\[max\(0\.25rem\,env\(safe-area-inset-bottom\)\)\]{padding-bottom:max(.25rem, env(safe-area-inset-bottom))}.pb-\[max\(1rem\,env\(safe-area-inset-bottom\)\)\]{padding-bottom:max(1rem, env(safe-area-inset-bottom))}.pl-2{padding-left:calc(var(--spacing) * 2)}.pl-6{padding-left:calc(var(--spacing) * 6)}.pl-8{padding-left:calc(var(--spacing) * 8)}.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.font-chat-mono{font-family:var(--chat-font-mono)}.font-chat-sans{font-family:var(--chat-font-sans)}.font-chat-serif{font-family:var(--chat-font-serif)}.font-mono{font-family:var(--font-mono)}.font-sans{font-family:var(--font-sans)}.font-serif{font-family:var(--font-serif)}.text-base{font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-\(length\:--chat-activity-font-size\){font-size:var(--chat-activity-font-size)}.text-\(length\:--chat-bubble-font-size\){font-size:var(--chat-bubble-font-size)}.text-\(length\:--chat-code-font-size\){font-size:var(--chat-code-font-size)}.text-\(length\:--chat-ui-font-size\){font-size:var(--chat-ui-font-size)}.text-\(length\:--chat-ui-font-size-sm\){font-size:var(--chat-ui-font-size-sm)}.text-\[0\.625rem\]{font-size:.625rem}.text-\[0\.5625rem\]{font-size:.5625rem}.text-\[clamp\(1\.5rem\,6cqw\,2\.5rem\)\]{font-size:clamp(1.5rem,6cqw,2.5rem)}.leading-4{--tw-leading:calc(var(--spacing) * 4);line-height:calc(var(--spacing) * 4)}.leading-5{--tw-leading:calc(var(--spacing) * 5);line-height:calc(var(--spacing) * 5)}.leading-\[1\.75\]{--tw-leading:1.75;line-height:1.75}.leading-none{--tw-leading:1;line-height:1}.leading-relaxed{--tw-leading:var(--leading-relaxed);line-height:var(--leading-relaxed)}.leading-snug{--tw-leading:var(--leading-snug);line-height:var(--leading-snug)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-normal{--tw-font-weight:var(--font-weight-normal);font-weight:var(--font-weight-normal)}.tracking-wide{--tw-tracking:var(--tracking-wide);letter-spacing:var(--tracking-wide)}.break-words{overflow-wrap:break-word}.break-all{word-break:break-all}.whitespace-nowrap{white-space:nowrap}.whitespace-pre{white-space:pre}.whitespace-pre-wrap{white-space:pre-wrap}.text-\[var\(--chat-danger-fg\,\#fff\)\]{color:var(--chat-danger-fg,#fff)}.text-\[var\(--chat-empty-icon\,var\(--chat-accent\)\)\]{color:var(--chat-empty-icon,var(--chat-accent))}.text-chat-accent{color:var(--chat-accent)}.text-chat-accent-fg{color:var(--chat-accent-fg)}.text-chat-bg{color:var(--chat-bg)}.text-chat-check{color:var(--chat-check)}.text-chat-danger{color:var(--chat-danger)}.text-chat-fg{color:var(--chat-fg)}.text-chat-muted{color:var(--chat-muted)}.text-chat-subtle{color:var(--chat-subtle)}.text-chat-warning{color:var(--chat-warning)}.lowercase{text-transform:lowercase}.uppercase{text-transform:uppercase}.tabular-nums{--tw-numeric-spacing:tabular-nums;font-variant-numeric:var(--tw-ordinal, ) var(--tw-slashed-zero, ) var(--tw-numeric-figure, ) var(--tw-numeric-spacing, ) var(--tw-numeric-fraction, )}.underline{text-decoration-line:underline}.decoration-chat-subtle{-webkit-text-decoration-color:var(--chat-subtle);-webkit-text-decoration-color:var(--chat-subtle);text-decoration-color:var(--chat-subtle)}.decoration-dotted{text-decoration-style:dotted}.underline-offset-4{text-underline-offset:4px}.opacity-0{opacity:0}.opacity-60{opacity:.6}.opacity-100{opacity:1}.shadow-chat-popover{--tw-shadow:var(--chat-shadow-popover);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-sm{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.outline{outline-style:var(--tw-outline-style);outline-width:1px}.filter{filter:var(--tw-blur, ) var(--tw-brightness, ) var(--tw-contrast, ) var(--tw-grayscale, ) var(--tw-hue-rotate, ) var(--tw-invert, ) var(--tw-saturate, ) var(--tw-sepia, ) var(--tw-drop-shadow, )}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-\[width\]{transition-property:width;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-transform{transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.duration-150{--tw-duration:.15s;transition-duration:.15s}.duration-200{--tw-duration:.2s;transition-duration:.2s}.ease-out{--tw-ease:var(--ease-out);transition-timing-function:var(--ease-out)}.outline-none{--tw-outline-style:none;outline-style:none}.select-none{-webkit-user-select:none;user-select:none}:is(:where(.group\/card):focus-within .group-focus-within\/card\:opacity-100){opacity:1}:is(:where(.group\/item):focus-within .group-focus-within\/item\:pr-8){padding-right:calc(var(--spacing) * 8)}:is(:where(.group\/item):focus-within .group-focus-within\/item\:opacity-100),:is(:where(.group\/message):focus-within .group-focus-within\/message\:opacity-100){opacity:1}@media (hover:hover){:is(:where(.group\/card):hover .group-hover\/card\:opacity-100){opacity:1}:is(:where(.group\/item):hover .group-hover\/item\:pr-8){padding-right:calc(var(--spacing) * 8)}:is(:where(.group\/item):hover .group-hover\/item\:opacity-100),:is(:where(.group\/message):hover .group-hover\/message\:opacity-100),:is(:where(.group\/section):hover .group-hover\/section\:opacity-100){opacity:1}}:is(:where(.group\/trigger)[aria-expanded=true] .group-aria-expanded\/trigger\:rotate-90){rotate:90deg}:is(:where(.group\/trigger)[data-focus-visible] .group-data-focus-visible\/trigger\:opacity-100),:is(:where(.group)[data-hovered] .group-data-hovered\:opacity-100){opacity:1}:is(:where(.peer):focus-visible~.peer-focus-visible\:ring-2){--tw-ring-shadow:var(--tw-ring-inset, ) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.placeholder\:text-chat-subtle::placeholder{color:var(--chat-subtle)}.focus-within\:border-chat-border-strong:focus-within{border-color:var(--chat-border-strong)}@media (hover:hover){.hover\:text-chat-fg:hover{color:var(--chat-fg)}.hover\:underline:hover{text-decoration-line:underline}}.focus\:border-chat-border-strong:focus{border-color:var(--chat-border-strong)}.focus-visible\:opacity-100:focus-visible{opacity:1}.focus-visible\:ring-2:focus-visible{--tw-ring-shadow:var(--tw-ring-inset, ) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.focus-visible\:ring-chat-focus:focus-visible{--tw-ring-color:var(--chat-focus)}.focus-visible\:outline-2:focus-visible{outline-style:var(--tw-outline-style);outline-width:2px}.focus-visible\:outline-chat-focus:focus-visible{outline-color:var(--chat-focus)}.data-disabled\:cursor-default[data-disabled]{cursor:default}.data-disabled\:opacity-40[data-disabled]{opacity:.4}.data-entering\:animate-chat-drawer-in[data-entering]{animation:.22s cubic-bezier(.2,.8,.2,1) chat-drawer-in}.data-entering\:animate-chat-drawer-in-right[data-entering]{animation:.22s cubic-bezier(.2,.8,.2,1) chat-drawer-in-right}.data-entering\:animate-chat-fade-in[data-entering]{animation:.2s ease-out chat-fade-in}.data-entering\:animate-chat-in[data-entering]{animation:.12s ease-out chat-in}.data-exiting\:animate-chat-drawer-out[data-exiting]{animation:.16s ease-in reverse forwards chat-drawer-in}.data-exiting\:animate-chat-drawer-out-right[data-exiting]{animation:.16s ease-in reverse forwards chat-drawer-in-right}.data-exiting\:animate-chat-fade-out[data-exiting]{animation:.15s ease-in reverse forwards chat-fade-in}.data-exiting\:animate-chat-out[data-exiting]{animation:90ms ease-in forwards chat-out}.data-focus-visible\:opacity-100[data-focus-visible]{opacity:1}.data-focus-visible\:ring-2[data-focus-visible]{--tw-ring-shadow:var(--tw-ring-inset, ) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.data-focus-visible\:ring-chat-focus[data-focus-visible]{--tw-ring-color:var(--chat-focus)}.data-focus-visible\:ring-inset[data-focus-visible]{--tw-ring-inset:inset}.data-focused\:bg-chat-popover-hover[data-focused]{background-color:var(--chat-popover-hover)}.data-hovered\:bg-chat-hover[data-hovered]{background-color:var(--chat-hover)}.data-hovered\:text-chat-fg[data-hovered]{color:var(--chat-fg)}.data-hovered\:text-chat-muted[data-hovered]{color:var(--chat-muted)}.data-hovered\:brightness-110[data-hovered]{--tw-brightness:brightness(110%);filter:var(--tw-blur, ) var(--tw-brightness, ) var(--tw-contrast, ) var(--tw-grayscale, ) var(--tw-hue-rotate, ) var(--tw-invert, ) var(--tw-saturate, ) var(--tw-sepia, ) var(--tw-drop-shadow, )}.data-open\:bg-chat-popover-hover[data-open]{background-color:var(--chat-popover-hover)}.data-pressed\:bg-chat-selected[data-pressed]{background-color:var(--chat-selected)}.data-pressed\:brightness-95[data-pressed]{--tw-brightness:brightness(95%);filter:var(--tw-blur, ) var(--tw-brightness, ) var(--tw-contrast, ) var(--tw-grayscale, ) var(--tw-hue-rotate, ) var(--tw-invert, ) var(--tw-saturate, ) var(--tw-sepia, ) var(--tw-drop-shadow, )}.data-selected\:bg-\[var\(--chat-segment-selected\,var\(--chat-raised\)\)\][data-selected]{background-color:var(--chat-segment-selected,var(--chat-raised))}.data-selected\:text-chat-fg[data-selected]{color:var(--chat-fg)}.data-selected\:shadow-\[inset_0_0_0_1px_var\(--chat-border-strong\)\][data-selected]{--tw-shadow:inset 0 0 0 1px var(--tw-shadow-color,var(--chat-border-strong));box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}@media (prefers-reduced-motion:no-preference){.motion-safe\:data-entering\:animate-chat-in[data-entering]{animation:.12s ease-out chat-in}.motion-safe\:data-exiting\:animate-chat-out[data-exiting]{animation:90ms ease-in forwards chat-out}}@media (prefers-reduced-motion:reduce){.motion-reduce\:animate-none{animation:none}.motion-reduce\:transition-none{transition-property:none}}.\[\&_svg\]\:size-3 svg{width:calc(var(--spacing) * 3);height:calc(var(--spacing) * 3)}.\[\&_svg\]\:size-3\.5 svg{width:calc(var(--spacing) * 3.5);height:calc(var(--spacing) * 3.5)}.\[\&_svg\]\:size-4 svg{width:calc(var(--spacing) * 4);height:calc(var(--spacing) * 4)}.\[\&_svg\]\:size-5 svg{width:calc(var(--spacing) * 5);height:calc(var(--spacing) * 5)}.\[\&_svg\]\:size-\[1em\] svg{width:1em;height:1em}.\[\&_svg\]\:size-full svg{width:100%;height:100%}.\[\&_svg\]\:shrink-0 svg{flex-shrink:0}.\[\&_svg\]\:fill-current svg{fill:currentColor}.\[\&\:\:-webkit-slider-thumb\]\:opacity-0::-webkit-slider-thumb{opacity:0}.\[\&\:not\(\:first-child\)\]\:mt-1:not(:first-child){margin-top:var(--spacing)}@media (hover:none){.\[\@media\(hover\:none\)\]\:pr-10{padding-right:calc(var(--spacing) * 10)}.\[\@media\(hover\:none\)\]\:opacity-100{opacity:1}}@media (pointer:coarse){.\[\@media\(pointer\:coarse\)\]\:size-7\!{width:calc(var(--spacing) * 7)!important;height:calc(var(--spacing) * 7)!important}.\[\@media\(pointer\:coarse\)\]\:size-8{width:calc(var(--spacing) * 8);height:calc(var(--spacing) * 8)}.\[\@media\(pointer\:coarse\)\]\:size-9{width:calc(var(--spacing) * 9);height:calc(var(--spacing) * 9)}.\[\@media\(pointer\:coarse\)\]\:size-10{width:calc(var(--spacing) * 10);height:calc(var(--spacing) * 10)}.\[\@media\(pointer\:coarse\)\]\:h-9{height:calc(var(--spacing) * 9)}.\[\@media\(pointer\:coarse\)\]\:h-10{height:calc(var(--spacing) * 10)}.\[\@media\(pointer\:coarse\)\]\:h-11{height:calc(var(--spacing) * 11)}.\[\@media\(pointer\:coarse\)\]\:w-10{width:calc(var(--spacing) * 10)}}}@keyframes chat-word-in{0%{opacity:0}}[data-chat-code-bg=theme]{background-color:light-dark(var(--shiki-light-bg),var(--shiki-dark-bg))}[data-chat-code-bg=theme] pre{color:light-dark(var(--shiki-light),var(--shiki-dark))}@keyframes chat-shimmer-surface{0%{background-position:150% 0}to{background-position:-50% 0}}@keyframes chat-shimmer{0%{background-position:-20em 0}to{background-position:0 0}}@media (prefers-reduced-motion:reduce){.chat-markdown.chat-fade .chat-word:not([data-chat-motion=full] *){animation:none}.chat-shimmer-surface:not([data-chat-motion=full] *):after{background:var(--chat-fg);animation:none}@supports (color:color-mix(in lab, red, red)){.chat-shimmer-surface:not([data-chat-motion=full] *):after{background:color-mix(in srgb, var(--chat-fg) 6%, transparent)}}.chat-shimmer:not([data-chat-motion=full] *){color:var(--chat-muted);background:0 0;animation:none}[data-entering]:not([data-chat-motion=full] *),[data-exiting]:not([data-chat-motion=full] *){animation-duration:1ms!important}}[data-chat-motion=reduce] .chat-markdown.chat-fade .chat-word{animation:none}[data-chat-motion=reduce] .chat-shimmer-surface:after{background:var(--chat-fg);animation:none}@supports (color:color-mix(in lab, red, red)){[data-chat-motion=reduce] .chat-shimmer-surface:after{background:color-mix(in srgb, var(--chat-fg) 6%, transparent)}}[data-chat-motion=reduce] .chat-shimmer{color:var(--chat-muted);background:0 0;animation:none}[data-chat-motion=reduce] [data-entering],[data-chat-motion=reduce] [data-exiting]{animation-duration:1ms!important}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-divide-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-gradient-position{syntax:"*";inherits:false}@property --tw-gradient-from{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-via{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-to{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-stops{syntax:"*";inherits:false}@property --tw-gradient-via-stops{syntax:"*";inherits:false}@property --tw-gradient-from-position{syntax:"<length-percentage>";inherits:false;initial-value:0%}@property --tw-gradient-via-position{syntax:"<length-percentage>";inherits:false;initial-value:50%}@property --tw-gradient-to-position{syntax:"<length-percentage>";inherits:false;initial-value:100%}@property --tw-mask-linear{syntax:"*";inherits:false;initial-value:linear-gradient(#fff, #fff)}@property --tw-mask-radial{syntax:"*";inherits:false;initial-value:linear-gradient(#fff, #fff)}@property --tw-mask-conic{syntax:"*";inherits:false;initial-value:linear-gradient(#fff, #fff)}@property --tw-mask-left{syntax:"*";inherits:false;initial-value:linear-gradient(#fff, #fff)}@property --tw-mask-right{syntax:"*";inherits:false;initial-value:linear-gradient(#fff, #fff)}@property --tw-mask-bottom{syntax:"*";inherits:false;initial-value:linear-gradient(#fff, #fff)}@property --tw-mask-top{syntax:"*";inherits:false;initial-value:linear-gradient(#fff, #fff)}@property --tw-mask-bottom-from-position{syntax:"*";inherits:false;initial-value:0%}@property --tw-mask-bottom-to-position{syntax:"*";inherits:false;initial-value:100%}@property --tw-mask-bottom-from-color{syntax:"*";inherits:false;initial-value:black}@property --tw-mask-bottom-to-color{syntax:"*";inherits:false;initial-value:transparent}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-ordinal{syntax:"*";inherits:false}@property --tw-slashed-zero{syntax:"*";inherits:false}@property --tw-numeric-figure{syntax:"*";inherits:false}@property --tw-numeric-spacing{syntax:"*";inherits:false}@property --tw-numeric-fraction{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@property --tw-duration{syntax:"*";inherits:false}@property --tw-ease{syntax:"*";inherits:false}@keyframes pulse{50%{opacity:.5}}@keyframes chat-drawer-in-right{0%{transform:translate(100%)}}@keyframes chat-fade-in{0%{opacity:0}}@keyframes chat-drawer-in{0%{transform:translate(-100%)}}@keyframes chat-in{0%{opacity:0;transform:scale(.98)}}@keyframes chat-out{to{opacity:0;transform:scale(.98)}}
|
|
@@ -5,6 +5,7 @@ export { toBlocks, isActivityPart } from "./blocks";
|
|
|
5
5
|
export type { Block, ActivityPart } from "./blocks";
|
|
6
6
|
export { readEventStream, formatEvent } from "./sse";
|
|
7
7
|
export { parsePartialJson, salvageJson } from "./partial-json";
|
|
8
|
+
export { replacesProperty, replacesGuide, replacedId } from "./replaces";
|
|
8
9
|
export { visualizeTool, visualizeGuide, checkWidgetCode } from "./visualize";
|
|
9
10
|
export type { VisualizeInput, WidgetCodeCheck } from "./visualize";
|
|
10
11
|
export { matchesSchema, schemaErrors, checkUiTree, isStateRef, renderUiTool, renderUiToolName, uiActionSchema } from "./ui-tree";
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Updating a visual in place: the drawing tools (show_widget, show_ui, render_ui) take an optional
|
|
3
|
+
* `replaces`, the id of an earlier call of theirs. The kit draws the new call where the old one was (same
|
|
4
|
+
* reply) or folds the old one into a link to the new one (earlier reply). The model sees its own call ids in
|
|
5
|
+
* the history, so keep tool call ids when you send the history back.
|
|
6
|
+
*/
|
|
7
|
+
/** The `replaces` input property, shared by the drawing tools. */
|
|
8
|
+
export declare const replacesProperty: {
|
|
9
|
+
readonly type: "string";
|
|
10
|
+
readonly description: "Id of an earlier call of this tool whose visual this one updates in place: after a fix, or when the user asks for a change. Leave it out for a new visual.";
|
|
11
|
+
};
|
|
12
|
+
/** One line for a drawing tool's description or guide. */
|
|
13
|
+
export declare const replacesGuide = "To change a visual you already drew (a fix, or the user asks for a change), call the tool again with `replaces` set to that call's id: it is redrawn in place. Never draw a second copy without it.";
|
|
14
|
+
/** The id a drawing tool call replaces, from its (streaming) input; undefined if none. */
|
|
15
|
+
export declare function replacedId(input: unknown): string | undefined;
|
|
@@ -127,6 +127,8 @@ export interface EffortLevel {
|
|
|
127
127
|
recommended?: boolean;
|
|
128
128
|
/** Short warning shown next to the level, e.g. "5.5x or more usage". */
|
|
129
129
|
warning?: string;
|
|
130
|
+
/** One line on what the level is for, e.g. "For hard problems". Shown under the effort slider. */
|
|
131
|
+
description?: string;
|
|
130
132
|
}
|
|
131
133
|
export interface ModelInfo {
|
|
132
134
|
/** The slug sent to the backend, e.g. "gpt-6-astra". */
|
|
@@ -60,6 +60,8 @@ export declare const showUiToolName = "show_ui";
|
|
|
60
60
|
/** Input of the suggested UI tool, as the model writes it. */
|
|
61
61
|
export interface ShowUiInput {
|
|
62
62
|
markup: string;
|
|
63
|
+
/** Id of the earlier show_ui call this one updates in place. */
|
|
64
|
+
replaces?: string;
|
|
63
65
|
}
|
|
64
66
|
/**
|
|
65
67
|
* A suggested tool for drawing UI from your components: the model passes JSX as a string, which streams
|
|
@@ -76,6 +78,10 @@ export declare function showUiTool(components: readonly UiComponentSpec[], name?
|
|
|
76
78
|
readonly type: "string";
|
|
77
79
|
readonly description: 'JSX of the components above, e.g. <Card title="Plan"><Metric label="Total" value="€184" /></Card>';
|
|
78
80
|
};
|
|
81
|
+
readonly replaces: {
|
|
82
|
+
readonly type: "string";
|
|
83
|
+
readonly description: "Id of an earlier call of this tool whose visual this one updates in place: after a fix, or when the user asks for a change. Leave it out for a new visual.";
|
|
84
|
+
};
|
|
79
85
|
};
|
|
80
86
|
readonly required: readonly ["markup"];
|
|
81
87
|
};
|
|
@@ -36,6 +36,8 @@ export interface RenderUiInput {
|
|
|
36
36
|
root: UiNode;
|
|
37
37
|
/** Starting values of the widget's state. */
|
|
38
38
|
state?: Record<string, unknown>;
|
|
39
|
+
/** Id of the earlier render_ui call this one updates in place. */
|
|
40
|
+
replaces?: string;
|
|
39
41
|
}
|
|
40
42
|
/** A component as the model sees it. */
|
|
41
43
|
export interface UiComponentSpec {
|
|
@@ -83,6 +85,10 @@ export declare function renderUiTool(components: readonly UiComponentSpec[]): {
|
|
|
83
85
|
type: string;
|
|
84
86
|
description: string;
|
|
85
87
|
};
|
|
88
|
+
replaces: {
|
|
89
|
+
readonly type: "string";
|
|
90
|
+
readonly description: "Id of an earlier call of this tool whose visual this one updates in place: after a fix, or when the user asks for a change. Leave it out for a new visual.";
|
|
91
|
+
};
|
|
86
92
|
};
|
|
87
93
|
required: string[];
|
|
88
94
|
};
|
|
@@ -8,6 +8,8 @@ export interface VisualizeInput {
|
|
|
8
8
|
widget_code: string;
|
|
9
9
|
title?: string;
|
|
10
10
|
loading_messages?: string[];
|
|
11
|
+
/** Id of the earlier show_widget call this one updates in place. */
|
|
12
|
+
replaces?: string;
|
|
11
13
|
}
|
|
12
14
|
/** The tool definition to give the model. Same shape as a page tool's `ToolSpec`. */
|
|
13
15
|
export declare const visualizeTool: {
|
|
@@ -33,12 +35,16 @@ export declare const visualizeTool: {
|
|
|
33
35
|
readonly maxItems: 4;
|
|
34
36
|
readonly description: "1-4 short lines shown while you write it, e.g. \"Finding free slots\".";
|
|
35
37
|
};
|
|
38
|
+
readonly replaces: {
|
|
39
|
+
readonly type: "string";
|
|
40
|
+
readonly description: "Id of an earlier call of this tool whose visual this one updates in place: after a fix, or when the user asks for a change. Leave it out for a new visual.";
|
|
41
|
+
};
|
|
36
42
|
};
|
|
37
43
|
readonly required: readonly ["widget_code"];
|
|
38
44
|
};
|
|
39
45
|
};
|
|
40
46
|
/** Design guide for the system prompt when the visualize tool is on. */
|
|
41
|
-
export declare const visualizeGuide = "## Visuals (show_widget)\nUse show_widget when a visual says it better than text: data to compare, a plan to adjust, a place to see, a\nprocess to step through. Keep explaining in text around it; the widget is not the whole answer.\n\nHow the frame works\n- widget_code is a fragment: no <!doctype>, <html>, <head> or <body>. Put <style> first, then markup, then <script>.\n- It renders while you write it; scripts run once it is complete, in order. Put scripts last.\n- No network unless the host allows it: no fetch, no external images or fonts. Inline your data.\n- The background is transparent and the frame sizes itself to your content. Add no outer margin or padding,\n no outer border or card around the whole widget, and no fixed height on the root.\n- Two globals: sendPrompt(text) sends a message as the user (for \"Add these to my calendar\", \"Explain this\"),\n openLink(url) opens an http(s) link. Prefer local state (JavaScript in the widget) over round trips: filter,\n toggle, recalculate and animate in place; use sendPrompt only for what needs you.\n\nLook\n- Use the chat's theme variables, never hard-coded colors or fonts: var(--chat-fg) text, var(--chat-muted) and\n var(--chat-subtle) secondary text, var(--chat-surface) and var(--chat-raised) fills, var(--chat-border) and\n var(--chat-divider) lines, var(--chat-hover) hover, var(--chat-accent) with var(--chat-accent-fg) for the one\n thing that matters most, var(--chat-check) good, var(--chat-warning), var(--chat-danger) bad;\n var(--chat-font-sans), var(--chat-font-mono); var(--chat-ui-font-size), var(--chat-ui-font-size-sm);\n var(--chat-radius-sm), var(--chat-radius-md), var(--chat-radius-lg).\n- Quiet by default: thin borders, few fills, one accent. Readable labels, aligned numbers, no decoration.\n- Set apart what you added or changed from what was already there: your proposals in the accent with a small\n \"New\" (or \"Changed\") tag, existing data quiet. The user must see at a glance what is yours.\n- Make it work on a narrow screen (down to 320px wide) and with a keyboard: real <button>s, visible focus.";
|
|
47
|
+
export declare const visualizeGuide = "## Visuals (show_widget)\nUse show_widget when a visual says it better than text: data to compare, a plan to adjust, a place to see, a\nprocess to step through. Keep explaining in text around it; the widget is not the whole answer.\n\nHow the frame works\n- widget_code is a fragment: no <!doctype>, <html>, <head> or <body>. Put <style> first, then markup, then <script>.\n- It renders while you write it; scripts run once it is complete, in order. Put scripts last.\n- No network unless the host allows it: no fetch, no external images or fonts. Inline your data.\n- The background is transparent and the frame sizes itself to your content. Add no outer margin or padding,\n no outer border or card around the whole widget, and no fixed height on the root.\n- Two globals: sendPrompt(text) sends a message as the user (for \"Add these to my calendar\", \"Explain this\"),\n openLink(url) opens an http(s) link. Prefer local state (JavaScript in the widget) over round trips: filter,\n toggle, recalculate and animate in place; use sendPrompt only for what needs you.\n- To change a visual you already drew (a fix, or the user asks for a change), call the tool again with `replaces` set to that call's id: it is redrawn in place. Never draw a second copy without it.\n\nLook\n- Use the chat's theme variables, never hard-coded colors or fonts: var(--chat-fg) text, var(--chat-muted) and\n var(--chat-subtle) secondary text, var(--chat-surface) and var(--chat-raised) fills, var(--chat-border) and\n var(--chat-divider) lines, var(--chat-hover) hover, var(--chat-accent) with var(--chat-accent-fg) for the one\n thing that matters most, var(--chat-check) good, var(--chat-warning), var(--chat-danger) bad;\n var(--chat-font-sans), var(--chat-font-mono); var(--chat-ui-font-size), var(--chat-ui-font-size-sm);\n var(--chat-radius-sm), var(--chat-radius-md), var(--chat-radius-lg).\n- Quiet by default: thin borders, few fills, one accent. Readable labels, aligned numbers, no decoration.\n- Set apart what you added or changed from what was already there: your proposals in the accent with a small\n \"New\" (or \"Changed\") tag, existing data quiet. The user must see at a glance what is yours.\n- Make it work on a narrow screen (down to 320px wide) and with a keyboard: real <button>s, visible focus.";
|
|
42
48
|
/** What `checkWidgetCode` found. */
|
|
43
49
|
export interface WidgetCodeCheck {
|
|
44
50
|
/** Nothing will break: no errors (warnings may remain). */
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import type { EffortLevel } from "../../../core/src/index.js";
|
|
2
|
+
import { type ReactNode } from "react";
|
|
3
|
+
export interface EffortSliderProps {
|
|
4
|
+
/** The levels, lowest first. */
|
|
5
|
+
efforts: readonly EffortLevel[];
|
|
6
|
+
value: string;
|
|
7
|
+
onChange: (id: string) => void;
|
|
8
|
+
/** Title over the track. Default: the "Effort" label. */
|
|
9
|
+
label?: ReactNode;
|
|
10
|
+
className?: string;
|
|
11
|
+
}
|
|
12
|
+
/**
|
|
13
|
+
* Effort as a slider with one stop per level, lowest (faster) on the left: title and the current level on
|
|
14
|
+
* top, the level's description under them, "Faster" and "Smarter" under the track. Arrow keys move a stop.
|
|
15
|
+
*/
|
|
16
|
+
export declare function EffortSlider({ efforts, value, onChange, label, className }: EffortSliderProps): import("react").JSX.Element | null;
|
|
17
|
+
export interface EffortButtonProps extends EffortSliderProps {
|
|
18
|
+
/** Before the level's name on the button, e.g. a brain icon. */
|
|
19
|
+
icon?: ReactNode;
|
|
20
|
+
/** What the button reads. Default: the current level's label. */
|
|
21
|
+
children?: ReactNode;
|
|
22
|
+
}
|
|
23
|
+
/** A composer pill ("◎ Medium") that opens the effort slider above it, like chatgpt.com's Think button. */
|
|
24
|
+
export declare function EffortButton({ icon, children, className, ...slider }: EffortButtonProps): import("react").JSX.Element;
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
import { type Message, type ToolCallPart } from "../../../core/src/index.js";
|
|
2
|
+
import { type ReactNode } from "react";
|
|
3
|
+
/**
|
|
4
|
+
* In-place updates of drawn visuals: a tool call whose input has `replaces: <id>` takes the place of that
|
|
5
|
+
* earlier call. In the same reply the newest finished call is drawn where the first one was, and the old one
|
|
6
|
+
* stays (dimmed) until the new one's input is complete. A call replaced from a later reply folds into a link.
|
|
7
|
+
*/
|
|
8
|
+
/** Ready to take the old one's place: its input is complete and it didn't fail. */
|
|
9
|
+
export declare const isReady: (p: ToolCallPart) => boolean;
|
|
10
|
+
/** One reply's chains: each call's first call (where the chain is drawn) and each first call's chain, in order. */
|
|
11
|
+
export declare function chainsOf(message: Message): {
|
|
12
|
+
first: Map<string, string>;
|
|
13
|
+
chains: Map<string, ToolCallPart[]>;
|
|
14
|
+
};
|
|
15
|
+
/** Calls replaced by a finished call in a later reply: replaced id → the newest such call. */
|
|
16
|
+
export declare function laterReplacements(messages: readonly Message[]): Map<string, ToolCallPart>;
|
|
17
|
+
export declare function LaterReplacements({ value, children }: {
|
|
18
|
+
value: ReadonlyMap<string, ToolCallPart>;
|
|
19
|
+
children: ReactNode;
|
|
20
|
+
}): import("react").JSX.Element;
|
|
21
|
+
/** The call in a later reply that replaces any call of this chain, if there is one. */
|
|
22
|
+
export declare function useLaterReplacement(chain: readonly ToolCallPart[]): ToolCallPart | undefined;
|
|
23
|
+
/** The DOM id of a drawn tool call, for the "Updated below" link. */
|
|
24
|
+
export declare const toolAnchor: (id: string) => string;
|
|
25
|
+
/** Draws a chain: the newest finished call (dimmed while a newer one streams), or a link to its later update. */
|
|
26
|
+
export declare function ToolChain({ chain, draw }: {
|
|
27
|
+
chain: readonly ToolCallPart[];
|
|
28
|
+
draw: (part: ToolCallPart) => ReactNode;
|
|
29
|
+
}): import("react").JSX.Element;
|
|
@@ -4,6 +4,7 @@ export { Badge } from "./primitives/badge";
|
|
|
4
4
|
export type { BadgeProps } from "./primitives/badge";
|
|
5
5
|
export { Tooltip } from "./primitives/tooltip";
|
|
6
6
|
export type { TooltipProps } from "./primitives/tooltip";
|
|
7
|
+
export { CopyButton } from "./primitives/copy-button";
|
|
7
8
|
export { SegmentedControl } from "./primitives/segmented-control";
|
|
8
9
|
export type { SegmentedControlProps, SegmentedOption } from "./primitives/segmented-control";
|
|
9
10
|
export { Caret } from "./primitives/caret";
|
|
@@ -53,6 +54,8 @@ export type { TokenCounterProps } from "./components/token-counter";
|
|
|
53
54
|
export { ContextPanel } from "./components/context-panel";
|
|
54
55
|
export type { ContextPanelProps } from "./components/context-panel";
|
|
55
56
|
export { Composer, AttachButton } from "./components/composer";
|
|
57
|
+
export { EffortSlider, EffortButton } from "./components/effort-slider";
|
|
58
|
+
export type { EffortSliderProps, EffortButtonProps } from "./components/effort-slider";
|
|
56
59
|
export type { ComposerProps, AttachButtonProps } from "./components/composer";
|
|
57
60
|
export { ModelPicker } from "./components/model-picker";
|
|
58
61
|
export type { ModelPickerProps } from "./components/model-picker";
|
|
@@ -7,7 +7,9 @@ export interface CodeBlockProps {
|
|
|
7
7
|
label?: string;
|
|
8
8
|
/** "boxed" for code in a message (bordered box); "plain" inside tool details. */
|
|
9
9
|
variant?: "boxed" | "plain";
|
|
10
|
+
/** A button that copies the whole block, right of the caption. Default: on for "boxed", off for "plain". */
|
|
11
|
+
copy?: boolean;
|
|
10
12
|
className?: string;
|
|
11
13
|
}
|
|
12
14
|
/** Monospace code with Shiki highlighting, scrolling past a fixed height. */
|
|
13
|
-
export declare function CodeBlock({ code, language, label, variant, className }: CodeBlockProps): React.JSX.Element;
|
|
15
|
+
export declare function CodeBlock({ code, language, label, variant, copy, className }: CodeBlockProps): React.JSX.Element;
|
|
@@ -75,6 +75,13 @@ export interface ChatIcons {
|
|
|
75
75
|
file: ReactNode;
|
|
76
76
|
/** Remove an attachment. */
|
|
77
77
|
remove: ReactNode;
|
|
78
|
+
/**
|
|
79
|
+
* Left of the thinking / tool-steps summary while the model works, e.g. your logo animating. None by
|
|
80
|
+
* default.
|
|
81
|
+
*/
|
|
82
|
+
activity?: ReactNode;
|
|
83
|
+
/** The same spot once the steps are done, e.g. the logo at rest. None by default. */
|
|
84
|
+
activityDone?: ReactNode;
|
|
78
85
|
}
|
|
79
86
|
/** Lucide icons, plus the claude.ai caret. Unsized: the places that show them size them with CSS. */
|
|
80
87
|
export declare const defaultIcons: ChatIcons;
|
|
@@ -175,10 +175,17 @@ export interface ChatLabels {
|
|
|
175
175
|
effortNote: string;
|
|
176
176
|
/** Badge on the recommended effort. */
|
|
177
177
|
recommended: string;
|
|
178
|
+
/** Ends of the effort slider. */
|
|
179
|
+
effortFaster: string;
|
|
180
|
+
effortSmarter: string;
|
|
178
181
|
/** Submenu item and list name. */
|
|
179
182
|
moreModels: string;
|
|
180
183
|
/** Accessible name of a widget without a title. */
|
|
181
184
|
widget: string;
|
|
185
|
+
/** Link left where a visual was, once a later reply updated it. */
|
|
186
|
+
visualUpdated: string;
|
|
187
|
+
/** Under a visual while its update streams. */
|
|
188
|
+
visualUpdating: string;
|
|
182
189
|
/** Loading line while a widget streams and the model gave none. */
|
|
183
190
|
drawingWidget: string;
|
|
184
191
|
}
|
|
@@ -44,6 +44,11 @@ export interface ChatViewProps {
|
|
|
44
44
|
emptyState?: (composer: ReactNode) => ReactNode;
|
|
45
45
|
/** Small print under the composer. */
|
|
46
46
|
disclaimer?: ReactNode;
|
|
47
|
+
/**
|
|
48
|
+
* Wraps the composer, on the empty screen and docked under the chat, to put things outside its box:
|
|
49
|
+
* buttons above or beside it, a row of chips under it. `where` says which of the two it is.
|
|
50
|
+
*/
|
|
51
|
+
renderComposer?: (composer: ReactNode, where: "empty" | "docked") => ReactNode;
|
|
47
52
|
/** "full": a page. "panel": a docked side panel. "inline": a small area inside a form. */
|
|
48
53
|
density?: Density;
|
|
49
54
|
/** Width of the message column, e.g. "48rem". Users can change it in settings. */
|
|
@@ -53,11 +58,14 @@ export interface ChatViewProps {
|
|
|
53
58
|
className?: string;
|
|
54
59
|
}
|
|
55
60
|
/** A whole chat: header, the conversation, the docked composer. An empty chat shows `emptyState`. */
|
|
56
|
-
export declare function ChatView({ messages, busy, onSend, onStop, approvals, onApprove, onRetry, onEdit, onFeedback, onReadAloud, messageActions, renderPart, widgets, header, composer, emptyState, disclaimer, density, contentWidth, contentPadding, className, }: ChatViewProps): import("react").JSX.Element;
|
|
61
|
+
export declare function ChatView({ messages, busy, onSend, onStop, approvals, onApprove, onRetry, onEdit, onFeedback, onReadAloud, messageActions, renderPart, widgets, header, composer, emptyState, disclaimer, renderComposer, density, contentWidth, contentPadding, className, }: ChatViewProps): import("react").JSX.Element;
|
|
57
62
|
export interface EmptyStateProps {
|
|
58
63
|
/** "Good evening, Alex". */
|
|
59
64
|
greeting: ReactNode;
|
|
60
|
-
/**
|
|
65
|
+
/**
|
|
66
|
+
* Mark left of the greeting, e.g. a logo. Its currentColor is --chat-empty-icon (default the accent), for
|
|
67
|
+
* one-color marks; a multi-color logo sets its own fills.
|
|
68
|
+
*/
|
|
61
69
|
icon?: ReactNode;
|
|
62
70
|
/** The centered composer. */
|
|
63
71
|
children: ReactNode;
|
|
@@ -2,6 +2,8 @@ import type { ReactNode } from "react";
|
|
|
2
2
|
export interface SidebarProps {
|
|
3
3
|
/** Name or logo at the top left; hidden when collapsed. */
|
|
4
4
|
brand?: ReactNode;
|
|
5
|
+
/** A logo mark left of `brand`, sized 1.25rem. It stays at the top of the collapsed rail. */
|
|
6
|
+
brandIcon?: ReactNode;
|
|
5
7
|
/** Buttons at the top right next to the collapse toggle, e.g. a mode switch. */
|
|
6
8
|
headerActions?: ReactNode;
|
|
7
9
|
/** Fixed items under the header: New chat, Search, Projects… (`SidebarItem`s). */
|
|
@@ -13,7 +15,7 @@ export interface SidebarProps {
|
|
|
13
15
|
className?: string;
|
|
14
16
|
}
|
|
15
17
|
/** The claude.ai sidebar frame. Collapses to an icon rail inside `AppShell`; a drawer on phones. */
|
|
16
|
-
export declare function Sidebar({ brand, headerActions, nav, children, footer, className }: SidebarProps): import("react").JSX.Element;
|
|
18
|
+
export declare function Sidebar({ brand, brandIcon, headerActions, nav, children, footer, className }: SidebarProps): import("react").JSX.Element;
|
|
17
19
|
export interface SidebarItemProps {
|
|
18
20
|
icon: ReactNode;
|
|
19
21
|
label: string;
|
|
@@ -422,6 +422,25 @@ function parseMessage(text) {
|
|
|
422
422
|
if (data.length === 0) return void 0;
|
|
423
423
|
return JSON.parse(data.join("\n"));
|
|
424
424
|
}
|
|
425
|
+
// ../core/src/replaces.ts
|
|
426
|
+
/**
|
|
427
|
+
* Updating a visual in place: the drawing tools (show_widget, show_ui, render_ui) take an optional
|
|
428
|
+
* `replaces`, the id of an earlier call of theirs. The kit draws the new call where the old one was (same
|
|
429
|
+
* reply) or folds the old one into a link to the new one (earlier reply). The model sees its own call ids in
|
|
430
|
+
* the history, so keep tool call ids when you send the history back.
|
|
431
|
+
*/
|
|
432
|
+
/** The `replaces` input property, shared by the drawing tools. */
|
|
433
|
+
const replacesProperty = {
|
|
434
|
+
type: "string",
|
|
435
|
+
description: "Id of an earlier call of this tool whose visual this one updates in place: after a fix, or when the user asks for a change. Leave it out for a new visual."
|
|
436
|
+
};
|
|
437
|
+
/** One line for a drawing tool's description or guide. */
|
|
438
|
+
const replacesGuide = "To change a visual you already drew (a fix, or the user asks for a change), call the tool again with `replaces` set to that call's id: it is redrawn in place. Never draw a second copy without it.";
|
|
439
|
+
/** The id a drawing tool call replaces, from its (streaming) input; undefined if none. */
|
|
440
|
+
function replacedId(input) {
|
|
441
|
+
const r = input?.replaces;
|
|
442
|
+
return typeof r === "string" && r ? r : void 0;
|
|
443
|
+
}
|
|
425
444
|
// ../core/src/ui-tree.ts
|
|
426
445
|
/**
|
|
427
446
|
* Host-registered components: instead of HTML, the model writes a small tree of components the host
|
|
@@ -557,6 +576,7 @@ function renderUiTool(components) {
|
|
|
557
576
|
Write a tree: { "root": { "component": "<name>", "props": { ... }, "children": [ ...nodes ] }, "state": { ... } }.
|
|
558
577
|
"root" is a JSON object, never a string. Only these components exist; a node with an unknown component or
|
|
559
578
|
props that don't fit is not shown. One visual per answer: don't also draw the same thing another way.
|
|
579
|
+
${replacesGuide}
|
|
560
580
|
${list}
|
|
561
581
|
|
|
562
582
|
Actions: a prop the schema marks as an action takes one of
|
|
@@ -577,7 +597,8 @@ Set apart what you added or changed from what was already there.`,
|
|
|
577
597
|
state: {
|
|
578
598
|
type: "object",
|
|
579
599
|
description: "Starting values of the widget's state."
|
|
580
|
-
}
|
|
600
|
+
},
|
|
601
|
+
replaces: replacesProperty
|
|
581
602
|
},
|
|
582
603
|
required: ["root"]
|
|
583
604
|
}
|
|
@@ -658,7 +679,7 @@ function checkUiTree(input, components, options = {}) {
|
|
|
658
679
|
return {
|
|
659
680
|
ok,
|
|
660
681
|
errors,
|
|
661
|
-
feedback: ok ? "Shown to the user." : `${bad === 0 ? "Not shown as written" : `Only part of it is shown: ${bad} of ${total} nodes were left out`}. Fix these and call ${toolName} again, without remarking on the fix to the user:\n` + errors.slice(0, 20).map((e) => `- ${e}`).join("\n") + (errors.length > 20 ? `\n- ...and ${errors.length - 20} more` : "")
|
|
682
|
+
feedback: ok ? "Shown to the user." : `${bad === 0 ? "Not shown as written" : `Only part of it is shown: ${bad} of ${total} nodes were left out`}. Fix these and call ${toolName} again with "replaces" set to this call's id, without remarking on the fix to the user:\n` + errors.slice(0, 20).map((e) => `- ${e}`).join("\n") + (errors.length > 20 ? `\n- ...and ${errors.length - 20} more` : "")
|
|
662
683
|
};
|
|
663
684
|
}
|
|
664
685
|
// ../core/src/ui-markup.ts
|
|
@@ -1039,13 +1060,16 @@ const showUiToolName = "show_ui";
|
|
|
1039
1060
|
function showUiTool(components, name = showUiToolName) {
|
|
1040
1061
|
return {
|
|
1041
1062
|
name,
|
|
1042
|
-
description: "Show interactive UI inline in your reply, built from the app's components: options to compare, a plan, a checklist, numbers at a glance. Write JSX in `markup`. Keep explaining in text around it; one call per answer unless the user asks for more
|
|
1063
|
+
description: "Show interactive UI inline in your reply, built from the app's components: options to compare, a plan, a checklist, numbers at a glance. Write JSX in `markup`. Keep explaining in text around it; one call per answer unless the user asks for more. " + replacesGuide + "\n\n" + markupRules(components),
|
|
1043
1064
|
inputSchema: {
|
|
1044
1065
|
type: "object",
|
|
1045
|
-
properties: {
|
|
1046
|
-
|
|
1047
|
-
|
|
1048
|
-
|
|
1066
|
+
properties: {
|
|
1067
|
+
markup: {
|
|
1068
|
+
type: "string",
|
|
1069
|
+
description: "JSX of the components above, e.g. <Card title=\"Plan\"><Metric label=\"Total\" value=\"€184\" /></Card>"
|
|
1070
|
+
},
|
|
1071
|
+
replaces: replacesProperty
|
|
1072
|
+
},
|
|
1049
1073
|
required: ["markup"]
|
|
1050
1074
|
}
|
|
1051
1075
|
};
|
|
@@ -1065,7 +1089,7 @@ function checkUiMarkupCode(markup, components, toolName = showUiToolName) {
|
|
|
1065
1089
|
return {
|
|
1066
1090
|
ok,
|
|
1067
1091
|
errors,
|
|
1068
|
-
feedback: ok ? "Shown to the user." : `Not all of it is shown. Fix these and call ${toolName} again, without remarking on the fix to the user:\n` + list(errors)
|
|
1092
|
+
feedback: ok ? "Shown to the user." : `Not all of it is shown. Fix these and call ${toolName} again with "replaces" set to this call's id, without remarking on the fix to the user:\n` + list(errors)
|
|
1069
1093
|
};
|
|
1070
1094
|
}
|
|
1071
1095
|
/**
|
|
@@ -1079,4 +1103,4 @@ When a visual helps more than text (options to compare, a plan, a checklist, num
|
|
|
1079
1103
|
${markupRules(components)}
|
|
1080
1104
|
- Keep explaining in text around the block. One block per answer, unless the user asks for more.`;
|
|
1081
1105
|
}
|
|
1082
|
-
export {
|
|
1106
|
+
export { resolveEffort as A, toBlocks as C, estimateTokens as D, awaitingToolCalls as E, parsePartialJson as M, salvageJson as N, outputTokens as O, isActivityPart as S, applyEvent as T, replacedId as _, readUiValue as a, formatEvent as b, uiMarkupGuide as c, isStateRef as d, matchesSchema as f, uiActionSchema as g, schemaErrors as h, parseUiMarkup as i, settleToolCall as j, reduceEvents as k, uiMarkupLanguage as l, renderUiToolName as m, checkUiMarkupCode as n, showUiTool as o, renderUiTool as p, findUiBlocks as r, showUiToolName as s, checkUiMarkup as t, checkUiTree as u, replacesGuide as v, activityTokens as w, readEventStream as x, replacesProperty as y };
|
package/package.json
CHANGED