@kitn.ai/ui/dist/elements/thinking-bar.js

Framework-agnostic, Shadow-DOM web components for building AI chat interfaces — works in React, Vue, Angular, Svelte, or plain HTML. Authored in SolidJS.

import{s as p,i as o,c as r,y as i,S as u,a as m,b,t as l,e as f,f as g}from"./chunks/define-CNSKFZCd.js";import{c as x}from"./chunks/cn-CU7UAWzk.js";import{T as c}from"./chunks/text-shimmer-CEi-tlXr.js";import{c as h}from"./chunks/chevron-right-ChzBcNJ-.js";var k=l('<button type=button class="flex items-center gap-1 text-sm transition-opacity hover:opacity-80">'),v=l('<button type=button class="text-muted-foreground hover:text-foreground border-muted-foreground/50 hover:border-foreground border-b border-dotted text-sm transition-colors">'),w=l("<div>");function y(n){const[t]=p(n,["class","text","onStop","stopLabel","onClick"]),s=()=>t.text??"Thinking",d=()=>t.stopLabel??"Answer now";return(()=>{var a=w();return o(a,r(u,{get when(){return t.onClick},get fallback(){return r(c,{class:"cursor-default text-sm font-medium",get children(){return s()}})},get children(){var e=k();return i(e,"click",t.onClick,!0),o(e,r(c,{class:"text-sm font-medium",get children(){return s()}}),null),o(e,r(h,{class:"text-muted-foreground size-4"}),null),e}}),null),o(a,r(u,{get when(){return t.onStop},get children(){var e=v();return i(e,"click",t.onStop,!0),o(e,d),e}}),null),m(()=>b(a,x("flex w-full items-center justify-between",t.class))),a})()}f(["click"]),g("kai-thinking-bar",{text:"Thinking",stoppable:!1,stopLabel:"Answer now"},(n,{dispatch:t,flag:s})=>r(y,{get text(){return n.text},get stopLabel(){return n.stopLabel},get onStop(){return s("stoppable")?()=>t("kai-stop"):void 0}}));