@kitn.ai/ui/dist/elements/message-skills.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{c as n,i as a,F as d,a as p,b as k,S as v,t as o,f as x,g as f,o as g,p as b}from"./chunks/define-CNSKFZCd.js";import{c as h}from"./chunks/cn-CU7UAWzk.js";var w=o("<div>"),S=o('<span class="inline-flex items-center px-1.5 py-0.5 rounded text-[10px] font-medium bg-violet-400/10 text-violet-600 dark:text-violet-400">');function y(t){return n(v,{get when(){return t.skills.length>0},get children(){var e=w();return a(e,n(d,{get each(){return t.skills},children:s=>(()=>{var r=S();return a(r,()=>s.name),r})()})),p(()=>k(e,h("flex items-center gap-1 flex-wrap",t.class))),e}})}function c(t){var e;const s=((e=t.textContent)==null?void 0:e.trim())??"";return{id:t.getAttribute("id")??s,name:s}}x("kai-skills",{skills:[]},(t,{element:e})=>{const[s,r]=f([]);g(()=>{const i=()=>{const m=[...e.querySelectorAll("kai-skill")];r(m.map(c))};i();const l=new MutationObserver(i);l.observe(e,{childList:!0,attributes:!0,subtree:!0}),b(()=>l.disconnect())});const u=()=>[...t.skills??[],...s()];return n(y,{get skills(){return u()}})});export{c as parseKaiSkillElement};