@copilotkitnext/web-inspector 0.0.28 → 0.0.30

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/dist/index.js CHANGED
@@ -29,14 +29,19 @@ var import_lit = require("lit");
29
29
  var import_style_map = require("lit/directives/style-map.js");
30
30
 
31
31
  // src/styles/generated.css
32
- var generated_default = '/*! tailwindcss v4.1.11 | MIT License | https://tailwindcss.com */\n@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-space-y-reverse:0;--tw-divide-y-reverse:0;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking: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-backdrop-blur:initial;--tw-backdrop-brightness:initial;--tw-backdrop-contrast:initial;--tw-backdrop-grayscale:initial;--tw-backdrop-hue-rotate:initial;--tw-backdrop-invert:initial;--tw-backdrop-opacity:initial;--tw-backdrop-saturate:initial;--tw-backdrop-sepia:initial;--tw-duration:initial;--tw-scale-x:1;--tw-scale-y:1;--tw-scale-z:1;--tw-outline-style:solid}}}@layer theme{:root,:host{--font-sans:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--color-amber-50:oklch(98.7% .022 95.277);--color-amber-200:oklch(92.4% .12 95.746);--color-amber-700:oklch(55.5% .163 48.998);--color-green-100:oklch(96.2% .044 156.743);--color-green-700:oklch(52.7% .154 150.069);--color-green-800:oklch(44.8% .119 151.328);--color-emerald-50:oklch(97.9% .021 166.113);--color-emerald-200:oklch(90.5% .093 164.15);--color-emerald-500:oklch(69.6% .17 162.48);--color-emerald-700:oklch(50.8% .118 165.612);--color-sky-50:oklch(97.7% .013 236.62);--color-sky-200:oklch(90.1% .058 230.902);--color-sky-700:oklch(50% .134 242.749);--color-blue-50:oklch(97% .014 254.604);--color-blue-100:oklch(93.2% .032 255.585);--color-blue-200:oklch(88.2% .059 254.128);--color-blue-600:oklch(54.6% .245 262.881);--color-blue-700:oklch(48.8% .243 264.376);--color-blue-800:oklch(42.4% .199 265.638);--color-violet-50:oklch(96.9% .016 293.756);--color-violet-200:oklch(89.4% .057 293.283);--color-violet-700:oklch(49.1% .27 292.581);--color-purple-50:oklch(97.7% .014 308.299);--color-purple-200:oklch(90.2% .063 306.703);--color-purple-700:oklch(49.6% .265 301.924);--color-rose-50:oklch(96.9% .015 12.422);--color-rose-200:oklch(89.2% .058 10.001);--color-rose-500:oklch(64.5% .246 16.439);--color-rose-700:oklch(51.4% .222 16.935);--color-slate-900:oklch(20.8% .042 265.755);--color-slate-950:oklch(12.9% .042 264.695);--color-gray-50:oklch(98.5% .002 247.839);--color-gray-100:oklch(96.7% .003 264.542);--color-gray-200:oklch(92.8% .006 264.531);--color-gray-300:oklch(87.2% .01 258.338);--color-gray-400:oklch(70.7% .022 261.325);--color-gray-500:oklch(55.1% .027 264.364);--color-gray-600:oklch(44.6% .03 256.802);--color-gray-700:oklch(37.3% .034 259.733);--color-gray-800:oklch(27.8% .033 256.848);--color-gray-900:oklch(21% .034 264.665);--color-black:#000;--color-white:#fff;--spacing:.25rem;--container-xs:20rem;--container-md:28rem;--container-2xl:42rem;--text-xs:.75rem;--text-xs--line-height:calc(1/.75);--text-sm:.875rem;--text-sm--line-height:calc(1.25/.875);--text-lg:1.125rem;--text-lg--line-height:calc(1.75/1.125);--font-weight-medium:500;--font-weight-semibold:600;--tracking-wider:.05em;--leading-tight:1.25;--leading-relaxed:1.625;--radius-sm:.25rem;--radius-md:.375rem;--radius-lg:.5rem;--radius-xl:.75rem;--animate-pulse:pulse 2s cubic-bezier(.4,0,.6,1)infinite;--blur-md:12px;--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,ui-sans-serif,system-ui,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{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}:host{font-family:var(--font-sans);color:var(--color-slate-900);background-color:#0000;display:block}}@layer components;@layer utilities{.pointer-events-auto{pointer-events:auto}.pointer-events-none{pointer-events:none}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.static{position:static}.sticky{position:sticky}.top-0{top:calc(var(--spacing)*0)}.right-0{right:calc(var(--spacing)*0)}.right-1{right:calc(var(--spacing)*1)}.bottom-1{bottom:calc(var(--spacing)*1)}.left-0{left:calc(var(--spacing)*0)}.z-10{z-index:10}.z-50{z-index:50}.m-0{margin:calc(var(--spacing)*0)}.mx-3{margin-inline:calc(var(--spacing)*3)}.mt-1{margin-top:calc(var(--spacing)*1)}.mt-1\\.5{margin-top:calc(var(--spacing)*1.5)}.mt-2{margin-top:calc(var(--spacing)*2)}.mb-1{margin-bottom:calc(var(--spacing)*1)}.mb-2{margin-bottom:calc(var(--spacing)*2)}.mb-3{margin-bottom:calc(var(--spacing)*3)}.mb-4{margin-bottom:calc(var(--spacing)*4)}.ml-2{margin-left:calc(var(--spacing)*2)}.block{display:block}.flex{display:flex}.grid{display:grid}.inline-flex{display:inline-flex}.h-1\\.5{height:calc(var(--spacing)*1.5)}.h-3{height:calc(var(--spacing)*3)}.h-3\\.5{height:calc(var(--spacing)*3.5)}.h-5{height:calc(var(--spacing)*5)}.h-6{height:calc(var(--spacing)*6)}.h-7{height:calc(var(--spacing)*7)}.h-8{height:calc(var(--spacing)*8)}.h-10{height:calc(var(--spacing)*10)}.h-12{height:calc(var(--spacing)*12)}.h-20{height:calc(var(--spacing)*20)}.h-24{height:calc(var(--spacing)*24)}.h-40{height:calc(var(--spacing)*40)}.h-full{height:100%}.max-h-64{max-height:calc(var(--spacing)*64)}.max-h-96{max-height:calc(var(--spacing)*96)}.w-1\\.5{width:calc(var(--spacing)*1.5)}.w-3{width:calc(var(--spacing)*3)}.w-3\\.5{width:calc(var(--spacing)*3.5)}.w-5{width:calc(var(--spacing)*5)}.w-6{width:calc(var(--spacing)*6)}.w-7{width:calc(var(--spacing)*7)}.w-8{width:calc(var(--spacing)*8)}.w-10{width:calc(var(--spacing)*10)}.w-12{width:calc(var(--spacing)*12)}.w-16{width:calc(var(--spacing)*16)}.w-40{width:calc(var(--spacing)*40)}.w-56{width:calc(var(--spacing)*56)}.w-full{width:100%}.w-px{width:1px}.max-w-2xl{max-width:var(--container-2xl)}.max-w-\\[150px\\]{max-width:150px}.max-w-md{max-width:var(--container-md)}.max-w-xs{max-width:var(--container-xs)}.min-w-0{min-width:calc(var(--spacing)*0)}.flex-1{flex:1}.shrink-0{flex-shrink:0}.border-separate{border-collapse:separate}.border-spacing-0{--tw-border-spacing-x:calc(var(--spacing)*0);--tw-border-spacing-y:calc(var(--spacing)*0);border-spacing:var(--tw-border-spacing-x)var(--tw-border-spacing-y)}.-translate-y-\\[2px\\]{--tw-translate-y:calc(2px*-1);translate:var(--tw-translate-x)var(--tw-translate-y)}.rotate-180{rotate:180deg}.transform{transform:var(--tw-rotate-x,)var(--tw-rotate-y,)var(--tw-rotate-z,)var(--tw-skew-x,)var(--tw-skew-y,)}.animate-pulse{animation:var(--animate-pulse)}.cursor-grab{cursor:grab}.cursor-grabbing{cursor:grabbing}.cursor-nwse-resize{cursor:nwse-resize}.cursor-pointer{cursor:pointer}.touch-none{touch-action:none}.resize{resize:both}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.items-start{align-items:flex-start}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.gap-0\\.5{gap:calc(var(--spacing)*.5)}.gap-1{gap:calc(var(--spacing)*1)}.gap-1\\.5{gap:calc(var(--spacing)*1.5)}.gap-2{gap:calc(var(--spacing)*2)}.gap-3{gap:calc(var(--spacing)*3)}.gap-4{gap:calc(var(--spacing)*4)}:where(.space-y-2>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing)*2)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing)*2)*calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-3>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing)*3)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing)*3)*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-gray-200>:not(:last-child)){border-color:var(--color-gray-200)}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.overflow-y-auto{overflow-y:auto}.rounded{border-radius:.25rem}.rounded-full{border-radius:3.40282e38px}.rounded-lg{border-radius:var(--radius-lg)}.rounded-md{border-radius:var(--radius-md)}.rounded-sm{border-radius:var(--radius-sm)}.rounded-xl{border-radius:var(--radius-xl)}.border{border-style:var(--tw-border-style);border-width:1px}.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-l{border-left-style:var(--tw-border-style);border-left-width:1px}.border-amber-200{border-color:var(--color-amber-200)}.border-blue-200{border-color:var(--color-blue-200)}.border-emerald-200{border-color:var(--color-emerald-200)}.border-gray-200{border-color:var(--color-gray-200)}.border-purple-200{border-color:var(--color-purple-200)}.border-rose-200{border-color:var(--color-rose-200)}.border-sky-200{border-color:var(--color-sky-200)}.border-violet-200{border-color:var(--color-violet-200)}.border-white\\/20{border-color:#fff3}@supports (color:color-mix(in lab, red, red)){.border-white\\/20{border-color:color-mix(in oklab,var(--color-white)20%,transparent)}}.bg-amber-50{background-color:var(--color-amber-50)}.bg-blue-50{background-color:var(--color-blue-50)}.bg-blue-100{background-color:var(--color-blue-100)}.bg-emerald-50{background-color:var(--color-emerald-50)}.bg-emerald-500{background-color:var(--color-emerald-500)}.bg-gray-50{background-color:var(--color-gray-50)}.bg-gray-50\\/50{background-color:#f9fafb80}@supports (color:color-mix(in lab, red, red)){.bg-gray-50\\/50{background-color:color-mix(in oklab,var(--color-gray-50)50%,transparent)}}.bg-gray-100{background-color:var(--color-gray-100)}.bg-gray-200{background-color:var(--color-gray-200)}.bg-gray-400{background-color:var(--color-gray-400)}.bg-gray-800{background-color:var(--color-gray-800)}.bg-gray-900{background-color:var(--color-gray-900)}.bg-green-100{background-color:var(--color-green-100)}.bg-purple-50{background-color:var(--color-purple-50)}.bg-rose-50{background-color:var(--color-rose-50)}.bg-rose-500{background-color:var(--color-rose-500)}.bg-sky-50{background-color:var(--color-sky-50)}.bg-slate-950\\/95{background-color:#020618f2}@supports (color:color-mix(in lab, red, red)){.bg-slate-950\\/95{background-color:color-mix(in oklab,var(--color-slate-950)95%,transparent)}}.bg-violet-50{background-color:var(--color-violet-50)}.bg-white{background-color:var(--color-white)}.p-1{padding:calc(var(--spacing)*1)}.p-2{padding:calc(var(--spacing)*2)}.p-3{padding:calc(var(--spacing)*3)}.p-4{padding:calc(var(--spacing)*4)}.px-1{padding-inline:calc(var(--spacing)*1)}.px-1\\.5{padding-inline:calc(var(--spacing)*1.5)}.px-2{padding-inline:calc(var(--spacing)*2)}.px-3{padding-inline:calc(var(--spacing)*3)}.px-4{padding-inline:calc(var(--spacing)*4)}.py-0\\.5{padding-block:calc(var(--spacing)*.5)}.py-1{padding-block:calc(var(--spacing)*1)}.py-1\\.5{padding-block:calc(var(--spacing)*1.5)}.py-2{padding-block:calc(var(--spacing)*2)}.py-3{padding-block:calc(var(--spacing)*3)}.py-4{padding-block:calc(var(--spacing)*4)}.py-8{padding-block:calc(var(--spacing)*8)}.pt-2{padding-top:calc(var(--spacing)*2)}.pt-3{padding-top:calc(var(--spacing)*3)}.pb-3{padding-bottom:calc(var(--spacing)*3)}.pl-1{padding-left:calc(var(--spacing)*1)}.pl-2{padding-left:calc(var(--spacing)*2)}.text-center{text-align:center}.text-left{text-align:left}.align-top{vertical-align:top}.font-mono{font-family:var(--font-mono)}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.text-\\[9px\\]{font-size:9px}.text-\\[10px\\]{font-size:10px}.text-\\[11px\\]{font-size:11px}.leading-relaxed{--tw-leading:var(--leading-relaxed);line-height:var(--leading-relaxed)}.leading-tight{--tw-leading:var(--leading-tight);line-height:var(--leading-tight)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.tracking-wider{--tw-tracking:var(--tracking-wider);letter-spacing:var(--tracking-wider)}.break-words{overflow-wrap:break-word}.whitespace-nowrap{white-space:nowrap}.whitespace-pre-wrap{white-space:pre-wrap}.text-amber-700{color:var(--color-amber-700)}.text-blue-600{color:var(--color-blue-600)}.text-blue-700{color:var(--color-blue-700)}.text-blue-800{color:var(--color-blue-800)}.text-emerald-700{color:var(--color-emerald-700)}.text-gray-300{color:var(--color-gray-300)}.text-gray-400{color:var(--color-gray-400)}.text-gray-500{color:var(--color-gray-500)}.text-gray-600{color:var(--color-gray-600)}.text-gray-700{color:var(--color-gray-700)}.text-gray-800{color:var(--color-gray-800)}.text-gray-900{color:var(--color-gray-900)}.text-green-700{color:var(--color-green-700)}.text-green-800{color:var(--color-green-800)}.text-purple-700{color:var(--color-purple-700)}.text-rose-700{color:var(--color-rose-700)}.text-sky-700{color:var(--color-sky-700)}.text-violet-700{color:var(--color-violet-700)}.text-white{color:var(--color-white)}.uppercase{text-transform:uppercase}.italic{font-style:italic}.opacity-0{opacity:0}.opacity-60{opacity:.6}.shadow-lg{--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,#0000001a),0 4px 6px -4px 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)}.shadow-md{--tw-shadow:0 4px 6px -1px var(--tw-shadow-color,#0000001a),0 2px 4px -2px 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)}.ring-1{--tw-ring-shadow:var(--tw-ring-inset,)0 0 0 calc(1px + 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)}.ring-black\\/5{--tw-ring-color:#0000000d}@supports (color:color-mix(in lab, red, red)){.ring-black\\/5{--tw-ring-color:color-mix(in oklab,var(--color-black)5%,transparent)}}.ring-white\\/10{--tw-ring-color:#ffffff1a}@supports (color:color-mix(in lab, red, red)){.ring-white\\/10{--tw-ring-color:color-mix(in oklab,var(--color-white)10%,transparent)}}.backdrop-blur-md{--tw-backdrop-blur:blur(var(--blur-md));-webkit-backdrop-filter:var(--tw-backdrop-blur,)var(--tw-backdrop-brightness,)var(--tw-backdrop-contrast,)var(--tw-backdrop-grayscale,)var(--tw-backdrop-hue-rotate,)var(--tw-backdrop-invert,)var(--tw-backdrop-opacity,)var(--tw-backdrop-saturate,)var(--tw-backdrop-sepia,);backdrop-filter:var(--tw-backdrop-blur,)var(--tw-backdrop-brightness,)var(--tw-backdrop-contrast,)var(--tw-backdrop-grayscale,)var(--tw-backdrop-hue-rotate,)var(--tw-backdrop-invert,)var(--tw-backdrop-opacity,)var(--tw-backdrop-saturate,)var(--tw-backdrop-sepia,)}.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,visibility,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-all{transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.duration-300{--tw-duration:.3s;transition-duration:.3s}.select-none{-webkit-user-select:none;user-select:none}@media (hover:hover){.group-hover\\:border-gray-300:is(:where(.group):hover *){border-color:var(--color-gray-300)}.group-hover\\:text-gray-700:is(:where(.group):hover *){color:var(--color-gray-700)}.group-hover\\:opacity-100:is(:where(.group):hover *){opacity:1}.hover\\:scale-105:hover{--tw-scale-x:105%;--tw-scale-y:105%;--tw-scale-z:105%;scale:var(--tw-scale-x)var(--tw-scale-y)}.hover\\:border-white\\/30:hover{border-color:#ffffff4d}@supports (color:color-mix(in lab, red, red)){.hover\\:border-white\\/30:hover{border-color:color-mix(in oklab,var(--color-white)30%,transparent)}}.hover\\:bg-blue-50\\/50:hover{background-color:#eff6ff80}@supports (color:color-mix(in lab, red, red)){.hover\\:bg-blue-50\\/50:hover{background-color:color-mix(in oklab,var(--color-blue-50)50%,transparent)}}.hover\\:bg-gray-50:hover{background-color:var(--color-gray-50)}.hover\\:bg-gray-100:hover{background-color:var(--color-gray-100)}.hover\\:bg-gray-200:hover{background-color:var(--color-gray-200)}.hover\\:bg-slate-900\\/95:hover{background-color:#0f172bf2}@supports (color:color-mix(in lab, red, red)){.hover\\:bg-slate-900\\/95:hover{background-color:color-mix(in oklab,var(--color-slate-900)95%,transparent)}}.hover\\:text-gray-600:hover{color:var(--color-gray-600)}.hover\\:text-gray-900:hover{color:var(--color-gray-900)}}.focus\\:bg-gray-50:focus{background-color:var(--color-gray-50)}.focus\\:outline-none:focus{--tw-outline-style:none;outline-style:none}.focus-visible\\:outline:focus-visible{outline-style:var(--tw-outline-style);outline-width:1px}.focus-visible\\:outline-2:focus-visible{outline-style:var(--tw-outline-style);outline-width:2px}.focus-visible\\:outline-offset-2:focus-visible{outline-offset:2px}.focus-visible\\:outline-gray-300:focus-visible{outline-color:var(--color-gray-300)}.focus-visible\\:outline-gray-400:focus-visible{outline-color:var(--color-gray-400)}.focus-visible\\:outline-rose-500:focus-visible{outline-color:var(--color-rose-500)}@media (min-width:48rem){.md\\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}}.\\[\\&\\>svg\\]\\:\\!h-8>svg{height:calc(var(--spacing)*8)!important}.\\[\\&\\>svg\\]\\:\\!w-8>svg{width:calc(var(--spacing)*8)!important}.sr-only{clip:rect(0,0,0,0);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}}@property --tw-border-spacing-x{syntax:"<length>";inherits:false;initial-value:0}@property --tw-border-spacing-y{syntax:"<length>";inherits:false;initial-value:0}@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-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@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-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{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-backdrop-blur{syntax:"*";inherits:false}@property --tw-backdrop-brightness{syntax:"*";inherits:false}@property --tw-backdrop-contrast{syntax:"*";inherits:false}@property --tw-backdrop-grayscale{syntax:"*";inherits:false}@property --tw-backdrop-hue-rotate{syntax:"*";inherits:false}@property --tw-backdrop-invert{syntax:"*";inherits:false}@property --tw-backdrop-opacity{syntax:"*";inherits:false}@property --tw-backdrop-saturate{syntax:"*";inherits:false}@property --tw-backdrop-sepia{syntax:"*";inherits:false}@property --tw-duration{syntax:"*";inherits:false}@property --tw-scale-x{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-y{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-z{syntax:"*";inherits:false;initial-value:1}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}@keyframes pulse{50%{opacity:.5}}';
32
+ var generated_default = '/*! tailwindcss v4.1.11 | MIT License | https://tailwindcss.com */\n@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) 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-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-space-y-reverse:0;--tw-divide-y-reverse:0;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight: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-backdrop-blur:initial;--tw-backdrop-brightness:initial;--tw-backdrop-contrast:initial;--tw-backdrop-grayscale:initial;--tw-backdrop-hue-rotate:initial;--tw-backdrop-invert:initial;--tw-backdrop-opacity:initial;--tw-backdrop-saturate:initial;--tw-backdrop-sepia:initial;--tw-scale-x:1;--tw-scale-y:1;--tw-scale-z:1;--tw-outline-style:solid}}}@layer theme{:root,:host{--font-sans:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--color-amber-50:oklch(98.7% .022 95.277);--color-amber-100:oklch(96.2% .059 95.617);--color-amber-200:oklch(92.4% .12 95.746);--color-amber-600:oklch(66.6% .179 58.318);--color-amber-700:oklch(55.5% .163 48.998);--color-amber-800:oklch(47.3% .137 46.201);--color-amber-900:oklch(41.4% .112 45.904);--color-green-100:oklch(96.2% .044 156.743);--color-green-700:oklch(52.7% .154 150.069);--color-green-800:oklch(44.8% .119 151.328);--color-emerald-50:oklch(97.9% .021 166.113);--color-emerald-200:oklch(90.5% .093 164.15);--color-emerald-500:oklch(69.6% .17 162.48);--color-emerald-700:oklch(50.8% .118 165.612);--color-sky-50:oklch(97.7% .013 236.62);--color-sky-200:oklch(90.1% .058 230.902);--color-sky-700:oklch(50% .134 242.749);--color-blue-50:oklch(97% .014 254.604);--color-blue-100:oklch(93.2% .032 255.585);--color-blue-200:oklch(88.2% .059 254.128);--color-blue-600:oklch(54.6% .245 262.881);--color-blue-700:oklch(48.8% .243 264.376);--color-blue-800:oklch(42.4% .199 265.638);--color-violet-50:oklch(96.9% .016 293.756);--color-violet-200:oklch(89.4% .057 293.283);--color-violet-700:oklch(49.1% .27 292.581);--color-purple-50:oklch(97.7% .014 308.299);--color-purple-200:oklch(90.2% .063 306.703);--color-purple-700:oklch(49.6% .265 301.924);--color-rose-50:oklch(96.9% .015 12.422);--color-rose-200:oklch(89.2% .058 10.001);--color-rose-500:oklch(64.5% .246 16.439);--color-rose-600:oklch(58.6% .253 17.585);--color-rose-700:oklch(51.4% .222 16.935);--color-rose-800:oklch(45.5% .188 13.697);--color-rose-900:oklch(41% .159 10.272);--color-slate-200:oklch(92.9% .013 255.508);--color-slate-800:oklch(27.9% .041 260.031);--color-slate-900:oklch(20.8% .042 265.755);--color-slate-950:oklch(12.9% .042 264.695);--color-gray-50:oklch(98.5% .002 247.839);--color-gray-100:oklch(96.7% .003 264.542);--color-gray-200:oklch(92.8% .006 264.531);--color-gray-300:oklch(87.2% .01 258.338);--color-gray-400:oklch(70.7% .022 261.325);--color-gray-500:oklch(55.1% .027 264.364);--color-gray-600:oklch(44.6% .03 256.802);--color-gray-700:oklch(37.3% .034 259.733);--color-gray-800:oklch(27.8% .033 256.848);--color-gray-900:oklch(21% .034 264.665);--color-black:#000;--color-white:#fff;--spacing:.25rem;--container-xs:20rem;--container-md:28rem;--container-2xl:42rem;--text-xs:.75rem;--text-xs--line-height:calc(1/.75);--text-sm:.875rem;--text-sm--line-height:calc(1.25/.875);--text-lg:1.125rem;--text-lg--line-height:calc(1.75/1.125);--font-weight-medium:500;--font-weight-semibold:600;--leading-snug:1.375;--leading-relaxed:1.625;--radius-sm:.25rem;--radius-md:.375rem;--radius-lg:.5rem;--radius-xl:.75rem;--animate-pulse:pulse 2s cubic-bezier(.4,0,.6,1)infinite;--blur-sm:8px;--blur-md:12px;--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,ui-sans-serif,system-ui,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{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}:host{font-family:var(--font-sans);color:var(--color-slate-900);background-color:#0000;display:block}}@layer components;@layer utilities{.pointer-events-auto{pointer-events:auto}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.static{position:static}.sticky{position:sticky}.top-0{top:calc(var(--spacing)*0)}.right-0{right:calc(var(--spacing)*0)}.right-1{right:calc(var(--spacing)*1)}.bottom-1{bottom:calc(var(--spacing)*1)}.left-0{left:calc(var(--spacing)*0)}.z-10{z-index:10}.z-30{z-index:30}.z-40{z-index:40}.z-50{z-index:50}.m-0{margin:calc(var(--spacing)*0)}.mx-4{margin-inline:calc(var(--spacing)*4)}.my-1{margin-block:calc(var(--spacing)*1)}.my-3{margin-block:calc(var(--spacing)*3)}.mt-0\\.5{margin-top:calc(var(--spacing)*.5)}.mt-1{margin-top:calc(var(--spacing)*1)}.mt-1\\.5{margin-top:calc(var(--spacing)*1.5)}.mt-2{margin-top:calc(var(--spacing)*2)}.mb-1{margin-bottom:calc(var(--spacing)*1)}.mb-2{margin-bottom:calc(var(--spacing)*2)}.mb-3{margin-bottom:calc(var(--spacing)*3)}.mb-4{margin-bottom:calc(var(--spacing)*4)}.ml-auto{margin-left:auto}.box-border{box-sizing:border-box}.block{display:block}.flex{display:flex}.grid{display:grid}.inline-block{display:inline-block}.inline-flex{display:inline-flex}.h-1\\.5{height:calc(var(--spacing)*1.5)}.h-3{height:calc(var(--spacing)*3)}.h-3\\.5{height:calc(var(--spacing)*3.5)}.h-5{height:calc(var(--spacing)*5)}.h-6{height:calc(var(--spacing)*6)}.h-7{height:calc(var(--spacing)*7)}.h-8{height:calc(var(--spacing)*8)}.h-10{height:calc(var(--spacing)*10)}.h-12{height:calc(var(--spacing)*12)}.h-40{height:calc(var(--spacing)*40)}.h-full{height:100%}.max-h-64{max-height:calc(var(--spacing)*64)}.max-h-96{max-height:calc(var(--spacing)*96)}.w-1\\.5{width:calc(var(--spacing)*1.5)}.w-3{width:calc(var(--spacing)*3)}.w-3\\.5{width:calc(var(--spacing)*3.5)}.w-5{width:calc(var(--spacing)*5)}.w-6{width:calc(var(--spacing)*6)}.w-7{width:calc(var(--spacing)*7)}.w-8{width:calc(var(--spacing)*8)}.w-10{width:calc(var(--spacing)*10)}.w-12{width:calc(var(--spacing)*12)}.w-40{width:calc(var(--spacing)*40)}.w-auto{width:auto}.w-full{width:100%}.max-w-2xl{max-width:var(--container-2xl)}.max-w-\\[240px\\]{max-width:240px}.max-w-md{max-width:var(--container-md)}.max-w-xs{max-width:var(--container-xs)}.min-w-0{min-width:calc(var(--spacing)*0)}.min-w-\\[160px\\]{min-width:160px}.min-w-\\[200px\\]{min-width:200px}.flex-1{flex:1}.shrink-0{flex-shrink:0}.table-fixed{table-layout:fixed}.border-collapse{border-collapse:collapse}.-translate-y-\\[2px\\]{--tw-translate-y:calc(2px*-1);translate:var(--tw-translate-x)var(--tw-translate-y)}.rotate-180{rotate:180deg}.transform{transform:var(--tw-rotate-x,)var(--tw-rotate-y,)var(--tw-rotate-z,)var(--tw-skew-x,)var(--tw-skew-y,)}.animate-pulse{animation:var(--animate-pulse)}.cursor-grab{cursor:grab}.cursor-grabbing{cursor:grabbing}.cursor-nwse-resize{cursor:nwse-resize}.cursor-pointer{cursor:pointer}.touch-none{touch-action:none}.resize{resize:both}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.items-start{align-items:flex-start}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.gap-1{gap:calc(var(--spacing)*1)}.gap-1\\.5{gap:calc(var(--spacing)*1.5)}.gap-2{gap:calc(var(--spacing)*2)}.gap-3{gap:calc(var(--spacing)*3)}.gap-4{gap:calc(var(--spacing)*4)}:where(.space-y-1>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing)*1)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing)*1)*calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-2>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing)*2)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing)*2)*calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-3>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing)*3)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing)*3)*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-gray-200>:not(:last-child)){border-color:var(--color-gray-200)}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.overflow-x-hidden{overflow-x:hidden}.overflow-y-auto{overflow-y:auto}.rounded{border-radius:.25rem}.rounded-full{border-radius:3.40282e38px}.rounded-lg{border-radius:var(--radius-lg)}.rounded-md{border-radius:var(--radius-md)}.rounded-sm{border-radius:var(--radius-sm)}.rounded-xl{border-radius:var(--radius-xl)}.border{border-style:var(--tw-border-style);border-width:1px}.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-l{border-left-style:var(--tw-border-style);border-left-width:1px}.border-dashed{--tw-border-style:dashed;border-style:dashed}.border-amber-200{border-color:var(--color-amber-200)}.border-blue-200{border-color:var(--color-blue-200)}.border-emerald-200{border-color:var(--color-emerald-200)}.border-gray-100{border-color:var(--color-gray-100)}.border-gray-200{border-color:var(--color-gray-200)}.border-purple-200{border-color:var(--color-purple-200)}.border-rose-200{border-color:var(--color-rose-200)}.border-sky-200{border-color:var(--color-sky-200)}.border-slate-200{border-color:var(--color-slate-200)}.border-violet-200{border-color:var(--color-violet-200)}.border-white\\/20{border-color:#fff3}@supports (color:color-mix(in lab, red, red)){.border-white\\/20{border-color:color-mix(in oklab,var(--color-white)20%,transparent)}}.bg-amber-50{background-color:var(--color-amber-50)}.bg-amber-100{background-color:var(--color-amber-100)}.bg-blue-50{background-color:var(--color-blue-50)}.bg-blue-100{background-color:var(--color-blue-100)}.bg-emerald-50{background-color:var(--color-emerald-50)}.bg-emerald-500{background-color:var(--color-emerald-500)}.bg-gray-50{background-color:var(--color-gray-50)}.bg-gray-50\\/50{background-color:#f9fafb80}@supports (color:color-mix(in lab, red, red)){.bg-gray-50\\/50{background-color:color-mix(in oklab,var(--color-gray-50)50%,transparent)}}.bg-gray-100{background-color:var(--color-gray-100)}.bg-gray-400{background-color:var(--color-gray-400)}.bg-gray-900{background-color:var(--color-gray-900)}.bg-green-100{background-color:var(--color-green-100)}.bg-purple-50{background-color:var(--color-purple-50)}.bg-rose-50{background-color:var(--color-rose-50)}.bg-rose-500{background-color:var(--color-rose-500)}.bg-rose-600{background-color:var(--color-rose-600)}.bg-sky-50{background-color:var(--color-sky-50)}.bg-slate-900{background-color:var(--color-slate-900)}.bg-slate-950\\/95{background-color:#020618f2}@supports (color:color-mix(in lab, red, red)){.bg-slate-950\\/95{background-color:color-mix(in oklab,var(--color-slate-950)95%,transparent)}}.bg-violet-50{background-color:var(--color-violet-50)}.bg-white{background-color:var(--color-white)}.bg-white\\/60{background-color:#fff9}@supports (color:color-mix(in lab, red, red)){.bg-white\\/60{background-color:color-mix(in oklab,var(--color-white)60%,transparent)}}.bg-white\\/95{background-color:#fffffff2}@supports (color:color-mix(in lab, red, red)){.bg-white\\/95{background-color:color-mix(in oklab,var(--color-white)95%,transparent)}}.p-2{padding:calc(var(--spacing)*2)}.p-3{padding:calc(var(--spacing)*3)}.p-4{padding:calc(var(--spacing)*4)}.px-1{padding-inline:calc(var(--spacing)*1)}.px-1\\.5{padding-inline:calc(var(--spacing)*1.5)}.px-2{padding-inline:calc(var(--spacing)*2)}.px-3{padding-inline:calc(var(--spacing)*3)}.px-4{padding-inline:calc(var(--spacing)*4)}.py-0\\.5{padding-block:calc(var(--spacing)*.5)}.py-1{padding-block:calc(var(--spacing)*1)}.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{padding-block:calc(var(--spacing)*3)}.py-4{padding-block:calc(var(--spacing)*4)}.py-8{padding-block:calc(var(--spacing)*8)}.text-center{text-align:center}.text-left{text-align:left}.align-middle{vertical-align:middle}.align-top{vertical-align:top}.font-mono{font-family:var(--font-mono)}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.text-\\[9px\\]{font-size:9px}.text-\\[10px\\]{font-size:10px}.text-\\[11px\\]{font-size:11px}.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-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.break-words{overflow-wrap:break-word}.whitespace-nowrap{white-space:nowrap}.whitespace-pre-wrap{white-space:pre-wrap}.text-amber-600{color:var(--color-amber-600)}.text-amber-700{color:var(--color-amber-700)}.text-amber-800{color:var(--color-amber-800)}.text-amber-900{color:var(--color-amber-900)}.text-blue-600{color:var(--color-blue-600)}.text-blue-700{color:var(--color-blue-700)}.text-blue-800{color:var(--color-blue-800)}.text-emerald-700{color:var(--color-emerald-700)}.text-gray-300{color:var(--color-gray-300)}.text-gray-400{color:var(--color-gray-400)}.text-gray-500{color:var(--color-gray-500)}.text-gray-600{color:var(--color-gray-600)}.text-gray-700{color:var(--color-gray-700)}.text-gray-800{color:var(--color-gray-800)}.text-gray-900{color:var(--color-gray-900)}.text-green-700{color:var(--color-green-700)}.text-green-800{color:var(--color-green-800)}.text-purple-700{color:var(--color-purple-700)}.text-rose-700{color:var(--color-rose-700)}.text-rose-800{color:var(--color-rose-800)}.text-rose-900{color:var(--color-rose-900)}.text-sky-700{color:var(--color-sky-700)}.text-slate-800{color:var(--color-slate-800)}.text-slate-900{color:var(--color-slate-900)}.text-violet-700{color:var(--color-violet-700)}.text-white{color:var(--color-white)}.italic{font-style:italic}.opacity-0{opacity:0}.opacity-80{opacity:.8}.shadow-\\[0_12px_30px_rgba\\(15\\,23\\,42\\,0\\.12\\)\\]{--tw-shadow:0 12px 30px var(--tw-shadow-color,#0f172a1f);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-lg{--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,#0000001a),0 4px 6px -4px 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)}.shadow-md{--tw-shadow:0 4px 6px -1px var(--tw-shadow-color,#0000001a),0 2px 4px -2px 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)}.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)}.ring-1{--tw-ring-shadow:var(--tw-ring-inset,)0 0 0 calc(1px + 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)}.ring-black\\/5{--tw-ring-color:#0000000d}@supports (color:color-mix(in lab, red, red)){.ring-black\\/5{--tw-ring-color:color-mix(in oklab,var(--color-black)5%,transparent)}}.ring-transparent{--tw-ring-color:transparent}.ring-white\\/10{--tw-ring-color:#ffffff1a}@supports (color:color-mix(in lab, red, red)){.ring-white\\/10{--tw-ring-color:color-mix(in oklab,var(--color-white)10%,transparent)}}.backdrop-blur-md{--tw-backdrop-blur:blur(var(--blur-md));-webkit-backdrop-filter:var(--tw-backdrop-blur,)var(--tw-backdrop-brightness,)var(--tw-backdrop-contrast,)var(--tw-backdrop-grayscale,)var(--tw-backdrop-hue-rotate,)var(--tw-backdrop-invert,)var(--tw-backdrop-opacity,)var(--tw-backdrop-saturate,)var(--tw-backdrop-sepia,);backdrop-filter:var(--tw-backdrop-blur,)var(--tw-backdrop-brightness,)var(--tw-backdrop-contrast,)var(--tw-backdrop-grayscale,)var(--tw-backdrop-hue-rotate,)var(--tw-backdrop-invert,)var(--tw-backdrop-opacity,)var(--tw-backdrop-saturate,)var(--tw-backdrop-sepia,)}.backdrop-blur-sm{--tw-backdrop-blur:blur(var(--blur-sm));-webkit-backdrop-filter:var(--tw-backdrop-blur,)var(--tw-backdrop-brightness,)var(--tw-backdrop-contrast,)var(--tw-backdrop-grayscale,)var(--tw-backdrop-hue-rotate,)var(--tw-backdrop-invert,)var(--tw-backdrop-opacity,)var(--tw-backdrop-saturate,)var(--tw-backdrop-sepia,);backdrop-filter:var(--tw-backdrop-blur,)var(--tw-backdrop-brightness,)var(--tw-backdrop-contrast,)var(--tw-backdrop-grayscale,)var(--tw-backdrop-hue-rotate,)var(--tw-backdrop-invert,)var(--tw-backdrop-opacity,)var(--tw-backdrop-saturate,)var(--tw-backdrop-sepia,)}.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,visibility,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))}.outline-none{--tw-outline-style:none;outline-style:none}.select-none{-webkit-user-select:none;user-select:none}@media (hover:hover){.group-hover\\:opacity-100:is(:where(.group):hover *){opacity:1}.hover\\:scale-105:hover{--tw-scale-x:105%;--tw-scale-y:105%;--tw-scale-z:105%;scale:var(--tw-scale-x)var(--tw-scale-y)}.hover\\:border-gray-300:hover{border-color:var(--color-gray-300)}.hover\\:border-white\\/30:hover{border-color:#ffffff4d}@supports (color:color-mix(in lab, red, red)){.hover\\:border-white\\/30:hover{border-color:color-mix(in oklab,var(--color-white)30%,transparent)}}.hover\\:bg-blue-50\\/50:hover{background-color:#eff6ff80}@supports (color:color-mix(in lab, red, red)){.hover\\:bg-blue-50\\/50:hover{background-color:color-mix(in oklab,var(--color-blue-50)50%,transparent)}}.hover\\:bg-gray-50:hover{background-color:var(--color-gray-50)}.hover\\:bg-gray-100:hover{background-color:var(--color-gray-100)}.hover\\:bg-gray-200:hover{background-color:var(--color-gray-200)}.hover\\:bg-gray-800:hover{background-color:var(--color-gray-800)}.hover\\:bg-slate-900\\/95:hover{background-color:#0f172bf2}@supports (color:color-mix(in lab, red, red)){.hover\\:bg-slate-900\\/95:hover{background-color:color-mix(in oklab,var(--color-slate-900)95%,transparent)}}.hover\\:text-gray-600:hover{color:var(--color-gray-600)}.hover\\:text-gray-900:hover{color:var(--color-gray-900)}}.focus\\:border-gray-300:focus{border-color:var(--color-gray-300)}.focus\\:bg-gray-50:focus{background-color:var(--color-gray-50)}.focus\\:ring-2:focus{--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\\:ring-gray-200:focus{--tw-ring-color:var(--color-gray-200)}.focus\\:outline-none:focus{--tw-outline-style:none;outline-style:none}.focus-visible\\:outline:focus-visible{outline-style:var(--tw-outline-style);outline-width:1px}.focus-visible\\:outline-2:focus-visible{outline-style:var(--tw-outline-style);outline-width:2px}.focus-visible\\:outline-offset-2:focus-visible{outline-offset:2px}.focus-visible\\:outline-gray-300:focus-visible{outline-color:var(--color-gray-300)}.focus-visible\\:outline-gray-400:focus-visible{outline-color:var(--color-gray-400)}.focus-visible\\:outline-rose-500:focus-visible{outline-color:var(--color-rose-500)}.disabled\\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\\:opacity-50:disabled{opacity:.5}@media (min-width:48rem){.md\\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}}.\\[\\&\\>svg\\]\\:\\!h-8>svg{height:calc(var(--spacing)*8)!important}.\\[\\&\\>svg\\]\\:\\!w-8>svg{width:calc(var(--spacing)*8)!important}.sr-only{clip:rect(0,0,0,0);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}}@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-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@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-leading{syntax:"*";inherits:false}@property --tw-font-weight{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-backdrop-blur{syntax:"*";inherits:false}@property --tw-backdrop-brightness{syntax:"*";inherits:false}@property --tw-backdrop-contrast{syntax:"*";inherits:false}@property --tw-backdrop-grayscale{syntax:"*";inherits:false}@property --tw-backdrop-hue-rotate{syntax:"*";inherits:false}@property --tw-backdrop-invert{syntax:"*";inherits:false}@property --tw-backdrop-opacity{syntax:"*";inherits:false}@property --tw-backdrop-saturate{syntax:"*";inherits:false}@property --tw-backdrop-sepia{syntax:"*";inherits:false}@property --tw-scale-x{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-y{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-z{syntax:"*";inherits:false;initial-value:1}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}@keyframes pulse{50%{opacity:.5}}';
33
33
 
34
- // src/assets/logo-mark.svg
35
- var logo_mark_default = 'data:image/svg+xml,<?xml version="1.0" encoding="utf-8"?>%0A<svg xmlns="http://www.w3.org/2000/svg" width="55" height="60" viewBox="0 0 55 60" fill="none">%0A <g stroke="%23FFFFFF" stroke-width="3.3125" stroke-linejoin="round">%0A <path d="M0 21.9336L16.5449 0C40.8483 5.37332 53 8.05998 53 8.05998L43.123 56L0 21.9336Z" />%0A <line x1="16.5828" y1="0" x2="43.2454" y2="56" />%0A <line x1="0" y1="21.9336" x2="53" y2="8.48421" />%0A </g>%0A</svg>%0A';
34
+ // src/assets/inspector-logo.svg
35
+ var inspector_logo_default = 'data:image/svg+xml,<svg width="136" height="26" viewBox="0 0 136 26" fill="none" xmlns="http://www.w3.org/2000/svg">%0A<path d="M15.5253 11.0828H11.2602C11.2299 10.7299 11.1492 10.4097 11.0181 10.1224C10.8921 9.83503 10.7157 9.588 10.4888 9.38129C10.267 9.16958 9.99725 9.00818 9.67964 8.89733C9.36202 8.78136 9.00155 8.72338 8.59823 8.72338C7.89242 8.72338 7.29501 8.89477 6.80598 9.23756C6.322 9.58045 5.95397 10.072 5.70189 10.7122C5.45486 11.3524 5.33134 12.1213 5.33134 13.0187C5.33134 13.9665 5.45738 14.7606 5.70946 15.4008C5.96657 16.0361 6.33712 16.515 6.82111 16.8376C7.30509 17.1553 7.88739 17.314 8.56798 17.314C8.95618 17.314 9.30404 17.2662 9.61158 17.1704C9.91911 17.0695 10.1863 16.9259 10.4132 16.7393C10.64 16.5528 10.8241 16.3284 10.9653 16.0663C11.1114 15.7991 11.2097 15.4991 11.2602 15.1664L15.5253 15.1967C15.4748 15.852 15.2908 16.52 14.9732 17.2006C14.6556 17.8762 14.2044 18.5013 13.6195 19.076C13.0398 19.6457 12.3214 20.1046 11.4643 20.4524C10.6073 20.8003 9.61158 20.9742 8.47724 20.9742C7.05554 20.9742 5.78004 20.6692 4.65074 20.0592C3.52649 19.4491 2.63667 18.5517 1.98126 17.367C1.33091 16.1823 1.00574 14.7328 1.00574 13.0187C1.00574 11.2946 1.33848 9.84259 2.00396 8.66285C2.66944 7.47811 3.56682 6.58324 4.69611 5.97827C5.82541 5.36825 7.08578 5.06323 8.47724 5.06323C9.45528 5.06323 10.3552 5.19683 11.177 5.46403C11.9987 5.73123 12.7196 6.12194 13.3397 6.63618C13.9599 7.14537 14.4589 7.77302 14.8371 8.51922C15.2152 9.26533 15.4446 10.1198 15.5253 11.0828Z" fill="%23010507"/>%0A<path d="M23.0894 20.9742C21.829 20.9742 20.7501 20.7246 19.8527 20.2256C18.9553 19.7214 18.2672 19.0206 17.7883 18.1232C17.3093 17.2208 17.0698 16.1747 17.0698 14.9849C17.0698 13.7951 17.3093 12.7516 17.7883 11.8542C18.2672 10.9517 18.9553 10.2509 19.8527 9.75184C20.7501 9.24767 21.829 8.99564 23.0894 8.99564C24.3498 8.99564 25.4286 9.24767 26.326 9.75184C27.2234 10.2509 27.9115 10.9517 28.3905 11.8542C28.8695 12.7516 29.1089 13.7951 29.1089 14.9849C29.1089 16.1747 28.8695 17.2208 28.3905 18.1232C27.9115 19.0206 27.2234 19.7214 26.326 20.2256C25.4286 20.7246 24.3498 20.9742 23.0894 20.9742ZM23.1196 17.8888C23.4726 17.8888 23.7776 17.7703 24.0346 17.5334C24.2918 17.2965 24.4909 16.9587 24.6321 16.5201C24.7733 16.0814 24.8438 15.5597 24.8438 14.9547C24.8438 14.3446 24.7733 13.8228 24.6321 13.3893C24.4909 12.9506 24.2918 12.6128 24.0346 12.3759C23.7776 12.139 23.4726 12.0205 23.1196 12.0205C22.7466 12.0205 22.4265 12.139 22.1592 12.3759C21.8921 12.6128 21.6878 12.9506 21.5466 13.3893C21.4056 13.8228 21.3349 14.3446 21.3349 14.9547C21.3349 15.5597 21.4056 16.0814 21.5466 16.5201C21.6878 16.9587 21.8921 17.2965 22.1592 17.5334C22.4265 17.7703 22.7466 17.8888 23.1196 17.8888Z" fill="%23010507"/>%0A<path d="M30.8029 25.1184V9.14681H34.947V11.1735H35.0377C35.189 10.7803 35.4109 10.4199 35.7032 10.0922C35.9957 9.7594 36.3587 9.4947 36.7922 9.2981C37.2257 9.09639 37.7299 8.99564 38.3046 8.99564C39.0709 8.99564 39.7995 9.19979 40.4901 9.60811C41.1858 10.0165 41.7505 10.6593 42.1841 11.5365C42.6227 12.4138 42.842 13.5531 42.842 14.9547C42.842 16.2957 42.6328 17.4073 42.2143 18.2896C41.801 19.1719 41.2464 19.8298 40.5506 20.2633C39.8599 20.697 39.1011 20.9137 38.2744 20.9137C37.7299 20.9137 37.2434 20.8255 36.8149 20.649C36.3914 20.4675 36.0284 20.223 35.7259 19.9155C35.4285 19.6029 35.199 19.25 35.0377 18.8568H34.9772V25.1184H30.8029ZM34.8865 14.9547C34.8865 15.5193 34.9596 16.0083 35.1058 16.4218C35.257 16.8301 35.4688 17.1477 35.7411 17.3746C36.0183 17.5964 36.3486 17.7073 36.7317 17.7073C37.1149 17.7073 37.44 17.5989 37.7072 17.3821C37.9795 17.1603 38.1862 16.8452 38.3273 16.4369C38.4736 16.0234 38.5466 15.5294 38.5466 14.9547C38.5466 14.3799 38.4736 13.8884 38.3273 13.48C38.1862 13.0666 37.9795 12.7516 37.7072 12.5347C37.44 12.3129 37.1149 12.202 36.7317 12.202C36.3486 12.202 36.0183 12.3129 35.7411 12.5347C35.4688 12.7516 35.257 13.0666 35.1058 13.48C34.9596 13.8884 34.8865 14.3799 34.8865 14.9547Z" fill="%23010507"/>%0A<path d="M44.5908 20.7625V9.14678H48.7652V20.7625H44.5908ZM46.6779 7.93683C46.1133 7.93683 45.6294 7.75033 45.2261 7.37726C44.8227 7.00419 44.621 6.55549 44.621 6.03118C44.621 5.50686 44.8227 5.05816 45.2261 4.68509C45.6294 4.31202 46.1133 4.12549 46.6779 4.12549C47.2477 4.12549 47.7316 4.31202 48.1299 4.68509C48.5332 5.05816 48.7349 5.50686 48.7349 6.03118C48.7349 6.55549 48.5332 7.00419 48.1299 7.37726C47.7316 7.75033 47.2477 7.93683 46.6779 7.93683Z" fill="%23010507"/>%0A<path d="M55.0664 5.27496V20.7625H50.892V5.27496H55.0664Z" fill="%23010507"/>%0A<path d="M62.7893 20.9742C61.5289 20.9742 60.4501 20.7246 59.5527 20.2256C58.6553 19.7214 57.9671 19.0206 57.4881 18.1232C57.0093 17.2208 56.7698 16.1747 56.7698 14.9849C56.7698 13.7951 57.0093 12.7516 57.4881 11.8542C57.9671 10.9517 58.6553 10.2509 59.5527 9.75184C60.4501 9.24767 61.5289 8.99564 62.7893 8.99564C64.0497 8.99564 65.1286 9.24767 66.026 9.75184C66.9234 10.2509 67.6115 10.9517 68.0904 11.8542C68.5694 12.7516 68.8089 13.7951 68.8089 14.9849C68.8089 16.1747 68.5694 17.2208 68.0904 18.1232C67.6115 19.0206 66.9234 19.7214 66.026 20.2256C65.1286 20.7246 64.0497 20.9742 62.7893 20.9742ZM62.8195 17.8888C63.1724 17.8888 63.4775 17.7703 63.7346 17.5334C63.9917 17.2965 64.1908 16.9587 64.332 16.5201C64.4731 16.0814 64.5438 15.5597 64.5438 14.9547C64.5438 14.3446 64.4731 13.8228 64.332 13.3893C64.1908 12.9506 63.9917 12.6128 63.7346 12.3759C63.4775 12.139 63.1724 12.0205 62.8195 12.0205C62.4464 12.0205 62.1263 12.139 61.8592 12.3759C61.5919 12.6128 61.3878 12.9506 61.2466 13.3893C61.1054 13.8228 61.0349 14.3446 61.0349 14.9547C61.0349 15.5597 61.1054 16.0814 61.2466 16.5201C61.3878 16.9587 61.5919 17.2965 61.8592 17.5334C62.1263 17.7703 62.4464 17.8888 62.8195 17.8888Z" fill="%23010507"/>%0A<path d="M77.4298 9.1468V12.1717H69.7769V9.1468H77.4298ZM71.2591 6.36392H75.4334V17.0267C75.4334 17.188 75.4612 17.3241 75.5166 17.4351C75.572 17.5409 75.6578 17.6216 75.7738 17.677C75.8897 17.7274 76.0384 17.7527 76.2199 17.7527C76.3459 17.7527 76.4921 17.7375 76.6585 17.7073C76.8299 17.677 76.9559 17.6518 77.0366 17.6317L77.6416 20.5659C77.4551 20.6213 77.1879 20.6894 76.84 20.77C76.4972 20.8507 76.0888 20.9037 75.6149 20.9288C74.657 20.9792 73.8529 20.8809 73.2026 20.6339C72.5522 20.3818 72.0631 19.9861 71.7355 19.4466C71.4078 18.9072 71.249 18.2316 71.2591 17.42V6.36392Z" fill="%23010507"/>%0A<path d="M79.3223 20.7625V5.27496H83.5268V11.5365H83.7385L88.397 5.27496H93.2973L88.0642 12.1717L93.4183 20.7625H88.397L84.9183 14.9546L83.5268 16.7696V20.7625H79.3223Z" fill="%23010507"/>%0A<path d="M95.3334 20.7625V9.14678H99.5077V20.7625H95.3334ZM97.4206 7.93683C96.8559 7.93683 96.3719 7.75033 95.9686 7.37726C95.5653 7.00419 95.3637 6.55549 95.3637 6.03118C95.3637 5.50686 95.5653 5.05816 95.9686 4.68509C96.3719 4.31202 96.8559 4.12549 97.4206 4.12549C97.9902 4.12549 98.4743 4.31202 98.8725 4.68509C99.2758 5.05816 99.4775 5.50686 99.4775 6.03118C99.4775 6.55549 99.2758 7.00419 98.8725 7.37726C98.4743 7.75033 97.9902 7.93683 97.4206 7.93683Z" fill="%23010507"/>%0A<path d="M108.562 9.1468V12.1717H100.909V9.1468H108.562ZM102.391 6.36392H106.565V17.0267C106.565 17.188 106.593 17.3241 106.648 17.4351C106.704 17.5409 106.789 17.6216 106.905 17.677C107.021 17.7274 107.17 17.7527 107.352 17.7527C107.478 17.7527 107.623 17.7375 107.791 17.7073C107.962 17.677 108.087 17.6518 108.168 17.6317L108.774 20.5659C108.587 20.6213 108.319 20.6894 107.971 20.77C107.629 20.8507 107.22 20.9037 106.747 20.9288C105.789 20.9792 104.985 20.8809 104.334 20.6339C103.684 20.3818 103.195 19.9861 102.867 19.4466C102.54 18.9072 102.381 18.2316 102.391 17.42V6.36392Z" fill="%23010507"/>%0A<path d="M119.539 8.67678C121.648 5.91866 123.398 3.19128 124.071 0.988777C124.089 0.928849 124.159 0.90339 124.212 0.937987C126.553 2.48864 130.818 3.50932 134.591 3.53328C134.656 3.53369 134.7 3.59769 134.677 3.65822C133.423 6.84039 131.891 12.5423 131.831 19.0536C131.831 19.1503 131.695 19.185 131.647 19.1009C129.5 15.3438 122.623 10.0644 119.574 8.81838C119.518 8.79519 119.502 8.7255 119.539 8.67678Z" fill="url(%23paint0_linear_8010_10612)"/>%0A<path d="M126.653 6.98969C123.357 8.03321 120.345 8.61334 119.626 8.74516C119.58 8.75356 119.571 8.81686 119.614 8.83473C122.687 10.1121 129.53 15.3761 131.657 19.118C131.661 19.1262 131.671 19.1292 131.68 19.1255C131.688 19.1214 131.693 19.1108 131.69 19.1016L126.653 6.98969Z" fill="url(%23paint1_linear_8010_10612)"/>%0A<path d="M124.221 0.931179C127.043 2.4702 130.303 3.16142 134.629 3.52564C134.656 3.52796 134.665 3.56437 134.641 3.57702C134.088 3.86136 130.918 5.47409 128.565 6.33784C127.934 6.56926 127.3 6.78394 126.676 6.982C126.662 6.98633 126.647 6.97951 126.641 6.96631L124.156 0.989469C124.139 0.949222 124.183 0.910305 124.221 0.931179Z" fill="url(%23paint2_linear_8010_10612)"/>%0A<path d="M124.171 1.02203L131.742 19.082" stroke="%23513C9F" stroke-width="0.183881" stroke-linecap="round"/>%0A<path d="M119.628 8.74279C119.628 8.74279 123.809 7.99233 127.739 6.63677C131.668 5.28124 134.594 3.6214 134.594 3.6214" stroke="%23513C9F" stroke-width="0.183881" stroke-linecap="round"/>%0A<path d="M125.209 3.30383L122.405 12.6358M122.405 12.6358H129.07M122.405 12.6358L111.874 25.0383" stroke="%23ABABAB" stroke-width="0.321797" stroke-linecap="round"/>%0A<path d="M119.181 22.485L117.94 22.6596C118.584 24.3618 119.904 25.1053 121.479 25.1053C125.341 25.1053 124.163 20.7382 126.4 20.7382C128.023 20.7382 127.364 24.2778 130.857 24.2778C132.989 24.2778 133.201 22.1301 132.837 21.2061C132.835 21.2005 132.833 21.1953 132.83 21.1902L132.259 20.3154C132.222 20.2572 132.131 20.2791 132.125 20.3483L132.018 21.4087C132.011 21.4824 132.013 21.5559 132.021 21.6295C132.109 22.3621 132.165 24.14 130.857 24.14C129.477 24.14 129.145 20.6462 126.4 20.6462C123.181 20.6462 123.594 24.9675 121.618 24.9675C120.313 24.9675 119.319 23.4964 119.181 22.485Z" fill="url(%23paint3_linear_8010_10612)"/>%0A<defs>%0A<linearGradient id="paint0_linear_8010_10612" x1="129.301" y1="2.33848" x2="125.623" y2="12.452" gradientUnits="userSpaceOnUse">%0A<stop stop-color="%236430AB"/>%0A<stop offset="1" stop-color="%23AA89D8"/>%0A</linearGradient>%0A<linearGradient id="paint1_linear_8010_10612" x1="126.451" y1="8.03874" x2="121.717" y2="17.1869" gradientUnits="userSpaceOnUse">%0A<stop stop-color="%23005DBB"/>%0A<stop offset="1" stop-color="%233D92E8"/>%0A</linearGradient>%0A<linearGradient id="paint2_linear_8010_10612" x1="128.565" y1="2.33842" x2="127.139" y2="6.79755" gradientUnits="userSpaceOnUse">%0A<stop stop-color="%231B70C4"/>%0A<stop offset="1" stop-color="%2354A4F2"/>%0A</linearGradient>%0A<linearGradient id="paint3_linear_8010_10612" x1="117.94" y1="22.7838" x2="132.981" y2="22.7838" gradientUnits="userSpaceOnUse">%0A<stop stop-color="%234497EA"/>%0A<stop offset="0.254755" stop-color="%231463B2"/>%0A<stop offset="0.498725" stop-color="%230A437D"/>%0A<stop offset="0.666667" stop-color="%232476C8"/>%0A<stop offset="0.972542" stop-color="%230C549A"/>%0A</linearGradient>%0A</defs>%0A</svg>%0A';
36
+
37
+ // src/assets/inspector-logo-icon.svg
38
+ var inspector_logo_icon_default = 'data:image/svg+xml,<?xml version="1.0" encoding="utf-8"?>%0A<svg xmlns="http://www.w3.org/2000/svg" width="55" height="60" viewBox="0 0 55 60" fill="none">%0A <g stroke="%23FFFFFF" stroke-width="3.3125" stroke-linejoin="round">%0A <path d="M0 21.9336L16.5449 0C40.8483 5.37332 53 8.05998 53 8.05998L43.123 56L0 21.9336Z" />%0A <line x1="16.5828" y1="0" x2="43.2454" y2="56" />%0A <line x1="0" y1="21.9336" x2="53" y2="8.48421" />%0A </g>%0A</svg>%0A';
36
39
 
37
40
  // src/index.ts
38
41
  var import_unsafe_html = require("lit/directives/unsafe-html.js");
42
+ var import_marked = require("marked");
39
43
  var import_lucide = require("lucide");
44
+ var import_core = require("@copilotkitnext/core");
40
45
 
41
46
  // src/lib/context-helpers.ts
42
47
  function updateSizeFromElement(state, element, fallback) {
@@ -103,35 +108,46 @@ function clamp(value, min, max) {
103
108
  }
104
109
 
105
110
  // src/lib/persistence.ts
106
- function loadInspectorState(cookieName) {
107
- if (typeof document === "undefined") {
108
- return null;
109
- }
110
- const prefix = `${cookieName}=`;
111
- const entry = document.cookie.split("; ").find((cookie) => cookie.startsWith(prefix));
112
- if (!entry) {
111
+ function loadInspectorState(storageKey) {
112
+ if (typeof window === "undefined") {
113
113
  return null;
114
114
  }
115
- const raw = entry.substring(prefix.length);
116
- if (!raw) {
117
- return null;
115
+ const raw = window.localStorage.getItem(storageKey);
116
+ if (raw) {
117
+ try {
118
+ const parsed = JSON.parse(raw);
119
+ if (parsed && typeof parsed === "object") {
120
+ return parsed;
121
+ }
122
+ } catch {
123
+ }
118
124
  }
119
- try {
120
- const parsed = JSON.parse(decodeURIComponent(raw));
121
- if (parsed && typeof parsed === "object") {
122
- return parsed;
125
+ if (typeof document !== "undefined") {
126
+ const prefix = `${storageKey}=`;
127
+ const entry = document.cookie.split("; ").find((cookie) => cookie.startsWith(prefix));
128
+ if (entry) {
129
+ const legacyRaw = entry.substring(prefix.length);
130
+ try {
131
+ const parsed = JSON.parse(decodeURIComponent(legacyRaw));
132
+ if (parsed && typeof parsed === "object") {
133
+ return parsed;
134
+ }
135
+ } catch {
136
+ return null;
137
+ }
123
138
  }
124
- } catch (error) {
125
- return null;
126
139
  }
127
140
  return null;
128
141
  }
129
- function saveInspectorState(cookieName, state, maxAgeSeconds) {
130
- if (typeof document === "undefined") {
142
+ function saveInspectorState(storageKey, state) {
143
+ if (typeof window === "undefined") {
131
144
  return;
132
145
  }
133
- const encoded = encodeURIComponent(JSON.stringify(state));
134
- document.cookie = `${cookieName}=${encoded}; path=/; max-age=${maxAgeSeconds}; SameSite=Lax`;
146
+ try {
147
+ window.localStorage.setItem(storageKey, JSON.stringify(state));
148
+ } catch (error) {
149
+ console.warn("Failed to persist inspector state", error);
150
+ }
135
151
  }
136
152
  function isValidAnchor(value) {
137
153
  if (!value || typeof value !== "object") {
@@ -162,25 +178,46 @@ function isValidDockMode(value) {
162
178
  }
163
179
 
164
180
  // src/index.ts
165
- var WEB_INSPECTOR_TAG = "web-inspector";
181
+ var WEB_INSPECTOR_TAG = "cpk-web-inspector";
166
182
  var EDGE_MARGIN = 16;
167
183
  var DRAG_THRESHOLD = 6;
168
184
  var MIN_WINDOW_WIDTH = 600;
169
185
  var MIN_WINDOW_WIDTH_DOCKED_LEFT = 420;
170
186
  var MIN_WINDOW_HEIGHT = 200;
171
- var COOKIE_NAME = "copilotkit_inspector_state";
172
- var COOKIE_MAX_AGE_SECONDS = 60 * 60 * 24 * 30;
187
+ var INSPECTOR_STORAGE_KEY = "cpk:inspector:state";
188
+ var ANNOUNCEMENT_STORAGE_KEY = "cpk:inspector:announcements";
189
+ var ANNOUNCEMENT_URL = "https://cdn.copilotkit.ai/announcements.json";
173
190
  var DEFAULT_BUTTON_SIZE = { width: 48, height: 48 };
174
191
  var DEFAULT_WINDOW_SIZE = { width: 840, height: 560 };
175
192
  var DOCKED_LEFT_WIDTH = 500;
176
193
  var MAX_AGENT_EVENTS = 200;
177
194
  var MAX_TOTAL_EVENTS = 500;
195
+ var AGENT_EVENT_TYPES = [
196
+ "RUN_STARTED",
197
+ "RUN_FINISHED",
198
+ "RUN_ERROR",
199
+ "TEXT_MESSAGE_START",
200
+ "TEXT_MESSAGE_CONTENT",
201
+ "TEXT_MESSAGE_END",
202
+ "TOOL_CALL_START",
203
+ "TOOL_CALL_ARGS",
204
+ "TOOL_CALL_END",
205
+ "TOOL_CALL_RESULT",
206
+ "STATE_SNAPSHOT",
207
+ "STATE_DELTA",
208
+ "MESSAGES_SNAPSHOT",
209
+ "RAW_EVENT",
210
+ "CUSTOM_EVENT"
211
+ ];
178
212
  var WebInspectorElement = class extends import_lit.LitElement {
179
213
  constructor() {
180
214
  super(...arguments);
181
215
  this._core = null;
182
216
  this.coreSubscriber = null;
183
217
  this.coreUnsubscribe = null;
218
+ this.runtimeStatus = null;
219
+ this.coreProperties = {};
220
+ this.lastCoreError = null;
184
221
  this.agentSubscriptions = /* @__PURE__ */ new Map();
185
222
  this.agentEvents = /* @__PURE__ */ new Map();
186
223
  this.agentMessages = /* @__PURE__ */ new Map();
@@ -202,6 +239,21 @@ var WebInspectorElement = class extends import_lit.LitElement {
202
239
  this.previousBodyMargins = null;
203
240
  this.transitionTimeoutId = null;
204
241
  this.pendingSelectedContext = null;
242
+ this.autoAttachCore = true;
243
+ this.attemptedAutoAttach = false;
244
+ this.cachedTools = [];
245
+ this.toolSignature = "";
246
+ this.eventFilterText = "";
247
+ this.eventTypeFilter = "all";
248
+ this.announcementMarkdown = null;
249
+ this.announcementHtml = null;
250
+ this.announcementTimestamp = null;
251
+ this.announcementPreviewText = null;
252
+ this.hasUnseenAnnouncement = false;
253
+ this.announcementLoaded = false;
254
+ this.announcementLoadError = null;
255
+ this.announcementPromise = null;
256
+ this.showAnnouncementPreview = true;
205
257
  this.contextState = {
206
258
  button: {
207
259
  position: { x: EDGE_MARGIN, y: EDGE_MARGIN },
@@ -226,9 +278,9 @@ var WebInspectorElement = class extends import_lit.LitElement {
226
278
  this.isResizing = false;
227
279
  this.menuItems = [
228
280
  { key: "ag-ui-events", label: "AG-UI Events", icon: "Zap" },
229
- { key: "agents", label: "Agents", icon: "Bot" },
281
+ { key: "agents", label: "Agent", icon: "Bot" },
230
282
  { key: "frontend-tools", label: "Frontend Tools", icon: "Hammer" },
231
- { key: "agent-context", label: "Agent Context", icon: "FileText" }
283
+ { key: "agent-context", label: "Context", icon: "FileText" }
232
284
  ];
233
285
  this.handlePointerDown = (event) => {
234
286
  if (this.dockMode !== "floating" && this.isOpen) {
@@ -237,6 +289,10 @@ var WebInspectorElement = class extends import_lit.LitElement {
237
289
  const target = event.currentTarget;
238
290
  const contextAttr = target?.dataset.dragContext;
239
291
  const context = contextAttr === "window" ? "window" : "button";
292
+ const eventTarget = event.target;
293
+ if (context === "window" && eventTarget?.closest("button")) {
294
+ return;
295
+ }
240
296
  this.pointerContext = context;
241
297
  this.measureContext(context);
242
298
  event.preventDefault();
@@ -421,6 +477,19 @@ var WebInspectorElement = class extends import_lit.LitElement {
421
477
  this.copiedEvents = /* @__PURE__ */ new Set();
422
478
  this.expandedTools = /* @__PURE__ */ new Set();
423
479
  this.expandedContextItems = /* @__PURE__ */ new Set();
480
+ this.copiedContextItems = /* @__PURE__ */ new Set();
481
+ this.handleClearEvents = () => {
482
+ if (this.selectedContext === "all-agents") {
483
+ this.agentEvents.clear();
484
+ this.flattenedEvents = [];
485
+ } else {
486
+ this.agentEvents.delete(this.selectedContext);
487
+ this.flattenedEvents = this.flattenedEvents.filter((event) => event.agentId !== this.selectedContext);
488
+ }
489
+ this.expandedRows.clear();
490
+ this.copiedEvents.clear();
491
+ this.requestUpdate();
492
+ };
424
493
  this.handleGlobalPointerDown = (event) => {
425
494
  if (!this.contextMenuOpen) {
426
495
  return;
@@ -433,10 +502,14 @@ var WebInspectorElement = class extends import_lit.LitElement {
433
502
  this.requestUpdate();
434
503
  }
435
504
  };
505
+ this.handleDismissAnnouncement = () => {
506
+ this.markAnnouncementSeen();
507
+ };
436
508
  }
437
509
  static {
438
510
  this.properties = {
439
- core: { attribute: false }
511
+ core: { attribute: false },
512
+ autoAttachCore: { type: Boolean, attribute: "auto-attach-core" }
440
513
  };
441
514
  }
442
515
  get core() {
@@ -455,19 +528,34 @@ var WebInspectorElement = class extends import_lit.LitElement {
455
528
  }
456
529
  }
457
530
  attachToCore(core) {
531
+ this.runtimeStatus = core.runtimeConnectionStatus;
532
+ this.coreProperties = core.properties;
533
+ this.lastCoreError = null;
458
534
  this.coreSubscriber = {
535
+ onRuntimeConnectionStatusChanged: ({ status }) => {
536
+ this.runtimeStatus = status;
537
+ this.requestUpdate();
538
+ },
539
+ onPropertiesChanged: ({ properties }) => {
540
+ this.coreProperties = properties;
541
+ this.requestUpdate();
542
+ },
543
+ onError: ({ code, error }) => {
544
+ this.lastCoreError = { code, message: error.message };
545
+ this.requestUpdate();
546
+ },
459
547
  onAgentsChanged: ({ agents }) => {
460
548
  this.processAgentsChanged(agents);
461
549
  },
462
550
  onContextChanged: ({ context }) => {
463
- this.contextStore = { ...context };
551
+ this.contextStore = this.normalizeContextStore(context);
464
552
  this.requestUpdate();
465
553
  }
466
554
  };
467
555
  this.coreUnsubscribe = core.subscribe(this.coreSubscriber).unsubscribe;
468
556
  this.processAgentsChanged(core.agents);
469
557
  if (core.context) {
470
- this.contextStore = { ...core.context };
558
+ this.contextStore = this.normalizeContextStore(core.context);
471
559
  }
472
560
  }
473
561
  detachFromCore() {
@@ -476,6 +564,11 @@ var WebInspectorElement = class extends import_lit.LitElement {
476
564
  this.coreUnsubscribe = null;
477
565
  }
478
566
  this.coreSubscriber = null;
567
+ this.runtimeStatus = null;
568
+ this.lastCoreError = null;
569
+ this.coreProperties = {};
570
+ this.cachedTools = [];
571
+ this.toolSignature = "";
479
572
  this.teardownAgentSubscriptions();
480
573
  }
481
574
  teardownAgentSubscriptions() {
@@ -507,8 +600,53 @@ var WebInspectorElement = class extends import_lit.LitElement {
507
600
  }
508
601
  }
509
602
  this.updateContextOptions(seenAgentIds);
603
+ this.refreshToolsSnapshot();
510
604
  this.requestUpdate();
511
605
  }
606
+ refreshToolsSnapshot() {
607
+ if (!this._core) {
608
+ if (this.cachedTools.length > 0) {
609
+ this.cachedTools = [];
610
+ this.toolSignature = "";
611
+ this.requestUpdate();
612
+ }
613
+ return;
614
+ }
615
+ const tools = this.extractToolsFromAgents();
616
+ const signature = JSON.stringify(
617
+ tools.map((tool) => ({
618
+ agentId: tool.agentId,
619
+ name: tool.name,
620
+ type: tool.type,
621
+ hasDescription: Boolean(tool.description),
622
+ hasParameters: Boolean(tool.parameters)
623
+ }))
624
+ );
625
+ if (signature !== this.toolSignature) {
626
+ this.toolSignature = signature;
627
+ this.cachedTools = tools;
628
+ this.requestUpdate();
629
+ }
630
+ }
631
+ tryAutoAttachCore() {
632
+ if (this.attemptedAutoAttach || this._core || !this.autoAttachCore || typeof window === "undefined") {
633
+ return;
634
+ }
635
+ this.attemptedAutoAttach = true;
636
+ const globalWindow = window;
637
+ const globalCandidates = [
638
+ // Common app-level globals used during development
639
+ globalWindow.__COPILOTKIT_CORE__,
640
+ globalWindow.copilotkit?.core,
641
+ globalWindow.copilotkitCore
642
+ ];
643
+ const foundCore = globalCandidates.find(
644
+ (candidate) => !!candidate && typeof candidate === "object"
645
+ );
646
+ if (foundCore) {
647
+ this.core = foundCore;
648
+ }
649
+ }
512
650
  subscribeToAgent(agent) {
513
651
  if (!agent.agentId) {
514
652
  return;
@@ -585,25 +723,27 @@ var WebInspectorElement = class extends import_lit.LitElement {
585
723
  }
586
724
  recordAgentEvent(agentId, type, payload) {
587
725
  const eventId = `${agentId}:${++this.eventCounter}`;
726
+ const normalizedPayload = this.normalizeEventPayload(type, payload);
588
727
  const event = {
589
728
  id: eventId,
590
729
  agentId,
591
730
  type,
592
731
  timestamp: Date.now(),
593
- payload
732
+ payload: normalizedPayload
594
733
  };
595
734
  const currentAgentEvents = this.agentEvents.get(agentId) ?? [];
596
735
  const nextAgentEvents = [event, ...currentAgentEvents].slice(0, MAX_AGENT_EVENTS);
597
736
  this.agentEvents.set(agentId, nextAgentEvents);
598
737
  this.flattenedEvents = [event, ...this.flattenedEvents].slice(0, MAX_TOTAL_EVENTS);
738
+ this.refreshToolsSnapshot();
599
739
  this.requestUpdate();
600
740
  }
601
741
  syncAgentMessages(agent) {
602
742
  if (!agent?.agentId) {
603
743
  return;
604
744
  }
605
- const messages = agent.messages;
606
- if (Array.isArray(messages)) {
745
+ const messages = this.normalizeAgentMessages(agent.messages);
746
+ if (messages) {
607
747
  this.agentMessages.set(agent.agentId, messages);
608
748
  } else {
609
749
  this.agentMessages.delete(agent.agentId);
@@ -618,7 +758,7 @@ var WebInspectorElement = class extends import_lit.LitElement {
618
758
  if (state === void 0 || state === null) {
619
759
  this.agentStates.delete(agent.agentId);
620
760
  } else {
621
- this.agentStates.set(agent.agentId, state);
761
+ this.agentStates.set(agent.agentId, this.sanitizeForLogging(state));
622
762
  }
623
763
  this.requestUpdate();
624
764
  }
@@ -665,13 +805,30 @@ var WebInspectorElement = class extends import_lit.LitElement {
665
805
  }
666
806
  return this.agentEvents.get(this.selectedContext) ?? [];
667
807
  }
808
+ filterEvents(events) {
809
+ const query = this.eventFilterText.trim().toLowerCase();
810
+ return events.filter((event) => {
811
+ if (this.eventTypeFilter !== "all" && event.type !== this.eventTypeFilter) {
812
+ return false;
813
+ }
814
+ if (!query) {
815
+ return true;
816
+ }
817
+ const payloadText = this.stringifyPayload(event.payload, false).toLowerCase();
818
+ return event.type.toLowerCase().includes(query) || event.agentId.toLowerCase().includes(query) || payloadText.includes(query);
819
+ });
820
+ }
668
821
  getLatestStateForAgent(agentId) {
669
822
  if (this.agentStates.has(agentId)) {
670
- return this.agentStates.get(agentId);
823
+ const value = this.agentStates.get(agentId);
824
+ return value === void 0 ? null : value;
671
825
  }
672
826
  const events = this.agentEvents.get(agentId) ?? [];
673
827
  const stateEvent = events.find((e) => e.type === "STATE_SNAPSHOT");
674
- return stateEvent?.payload ?? null;
828
+ if (!stateEvent) {
829
+ return null;
830
+ }
831
+ return stateEvent.payload;
675
832
  }
676
833
  getLatestMessagesForAgent(agentId) {
677
834
  const messages = this.agentMessages.get(agentId);
@@ -700,17 +857,8 @@ var WebInspectorElement = class extends import_lit.LitElement {
700
857
  getAgentStats(agentId) {
701
858
  const events = this.agentEvents.get(agentId) ?? [];
702
859
  const messages = this.agentMessages.get(agentId);
703
- const toolCallCount = Array.isArray(messages) ? messages.reduce((count, rawMessage) => {
704
- if (!rawMessage || typeof rawMessage !== "object") {
705
- return count;
706
- }
707
- const toolCalls = rawMessage.toolCalls;
708
- if (!Array.isArray(toolCalls)) {
709
- return count;
710
- }
711
- return count + toolCalls.length;
712
- }, 0) : events.filter((e) => e.type === "TOOL_CALL_END").length;
713
- const messageCount = Array.isArray(messages) ? messages.length : 0;
860
+ const toolCallCount = messages ? messages.reduce((count, message) => count + (message.toolCalls?.length ?? 0), 0) : events.filter((e) => e.type === "TOOL_CALL_END").length;
861
+ const messageCount = messages?.length ?? 0;
714
862
  return {
715
863
  totalEvents: events.length,
716
864
  lastActivity: events[0]?.timestamp ?? null,
@@ -726,10 +874,9 @@ var WebInspectorElement = class extends import_lit.LitElement {
726
874
  return import_lit.html`
727
875
  <div class="mt-2 space-y-2">
728
876
  ${toolCalls.map((call, index) => {
729
- const toolCall = call;
730
- const functionName = typeof toolCall?.function?.name === "string" ? toolCall.function.name : "Unknown function";
731
- const callId = typeof toolCall?.id === "string" ? toolCall.id : `tool-call-${index + 1}`;
732
- const argsString = this.formatToolCallArguments(toolCall?.function?.arguments);
877
+ const functionName = call.function?.name ?? call.toolName ?? "Unknown function";
878
+ const callId = typeof call?.id === "string" ? call.id : `tool-call-${index + 1}`;
879
+ const argsString = this.formatToolCallArguments(call.function?.arguments);
733
880
  return import_lit.html`
734
881
  <div class="rounded-md border border-gray-200 bg-gray-50 p-3 text-xs text-gray-700">
735
882
  <div class="flex flex-wrap items-center justify-between gap-1 font-medium text-gray-900">
@@ -751,14 +898,14 @@ var WebInspectorElement = class extends import_lit.LitElement {
751
898
  try {
752
899
  const parsed = JSON.parse(args);
753
900
  return JSON.stringify(parsed, null, 2);
754
- } catch (error) {
901
+ } catch {
755
902
  return args;
756
903
  }
757
904
  }
758
905
  if (typeof args === "object") {
759
906
  try {
760
907
  return JSON.stringify(args, null, 2);
761
- } catch (error) {
908
+ } catch {
762
909
  return String(args);
763
910
  }
764
911
  }
@@ -912,6 +1059,152 @@ var WebInspectorElement = class extends import_lit.LitElement {
912
1059
  z-index: 50;
913
1060
  background: transparent;
914
1061
  }
1062
+
1063
+ .tooltip-target {
1064
+ position: relative;
1065
+ }
1066
+
1067
+ .tooltip-target::after {
1068
+ content: attr(data-tooltip);
1069
+ position: absolute;
1070
+ top: calc(100% + 6px);
1071
+ left: 50%;
1072
+ transform: translateX(-50%) translateY(-4px);
1073
+ white-space: nowrap;
1074
+ background: rgba(17, 24, 39, 0.95);
1075
+ color: white;
1076
+ padding: 4px 8px;
1077
+ border-radius: 6px;
1078
+ font-size: 10px;
1079
+ line-height: 1.2;
1080
+ box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
1081
+ opacity: 0;
1082
+ pointer-events: none;
1083
+ transition: opacity 120ms ease, transform 120ms ease;
1084
+ z-index: 4000;
1085
+ }
1086
+
1087
+ .tooltip-target:hover::after {
1088
+ opacity: 1;
1089
+ transform: translateX(-50%) translateY(0);
1090
+ }
1091
+
1092
+ .announcement-preview {
1093
+ position: absolute;
1094
+ top: 50%;
1095
+ transform: translateY(-50%);
1096
+ min-width: 300px;
1097
+ max-width: 300px;
1098
+ background: white;
1099
+ color: #111827;
1100
+ font-size: 13px;
1101
+ line-height: 1.4;
1102
+ border-radius: 12px;
1103
+ box-shadow: 0 12px 28px rgba(15, 23, 42, 0.22);
1104
+ padding: 10px 12px;
1105
+ display: inline-flex;
1106
+ align-items: flex-start;
1107
+ gap: 8px;
1108
+ z-index: 4500;
1109
+ animation: fade-slide-in 160ms ease;
1110
+ border: 1px solid rgba(148, 163, 184, 0.35);
1111
+ white-space: normal;
1112
+ word-break: break-word;
1113
+ text-align: left;
1114
+ }
1115
+
1116
+ .announcement-preview[data-side="left"] {
1117
+ right: 100%;
1118
+ margin-right: 10px;
1119
+ }
1120
+
1121
+ .announcement-preview[data-side="right"] {
1122
+ left: 100%;
1123
+ margin-left: 10px;
1124
+ }
1125
+
1126
+ .announcement-preview__arrow {
1127
+ position: absolute;
1128
+ width: 10px;
1129
+ height: 10px;
1130
+ background: white;
1131
+ border: 1px solid rgba(148, 163, 184, 0.35);
1132
+ transform: rotate(45deg);
1133
+ top: 50%;
1134
+ margin-top: -5px;
1135
+ z-index: -1;
1136
+ }
1137
+
1138
+ .announcement-preview[data-side="left"] .announcement-preview__arrow {
1139
+ right: -5px;
1140
+ box-shadow: 6px -6px 10px rgba(15, 23, 42, 0.12);
1141
+ }
1142
+
1143
+ .announcement-preview[data-side="right"] .announcement-preview__arrow {
1144
+ left: -5px;
1145
+ box-shadow: -6px 6px 10px rgba(15, 23, 42, 0.12);
1146
+ }
1147
+
1148
+ .announcement-dismiss {
1149
+ color: #6b7280;
1150
+ font-size: 12px;
1151
+ padding: 2px 8px;
1152
+ border-radius: 8px;
1153
+ border: 1px solid rgba(148, 163, 184, 0.5);
1154
+ background: rgba(248, 250, 252, 0.9);
1155
+ transition: background 120ms ease, color 120ms ease;
1156
+ }
1157
+
1158
+ .announcement-dismiss:hover {
1159
+ background: rgba(241, 245, 249, 1);
1160
+ color: #111827;
1161
+ }
1162
+
1163
+ .announcement-content {
1164
+ color: #111827;
1165
+ font-size: 14px;
1166
+ line-height: 1.6;
1167
+ }
1168
+
1169
+ .announcement-content h1,
1170
+ .announcement-content h2,
1171
+ .announcement-content h3 {
1172
+ font-weight: 700;
1173
+ margin: 0.4rem 0 0.2rem;
1174
+ }
1175
+
1176
+ .announcement-content h1 {
1177
+ font-size: 1.1rem;
1178
+ }
1179
+
1180
+ .announcement-content h2 {
1181
+ font-size: 1rem;
1182
+ }
1183
+
1184
+ .announcement-content h3 {
1185
+ font-size: 0.95rem;
1186
+ }
1187
+
1188
+ .announcement-content p {
1189
+ margin: 0.25rem 0;
1190
+ }
1191
+
1192
+ .announcement-content ul {
1193
+ list-style: disc;
1194
+ padding-left: 1.25rem;
1195
+ margin: 0.3rem 0;
1196
+ }
1197
+
1198
+ .announcement-content ol {
1199
+ list-style: decimal;
1200
+ padding-left: 1.25rem;
1201
+ margin: 0.3rem 0;
1202
+ }
1203
+
1204
+ .announcement-content a {
1205
+ color: #0f766e;
1206
+ text-decoration: underline;
1207
+ }
915
1208
  `
916
1209
  ];
917
1210
  }
@@ -920,7 +1213,9 @@ var WebInspectorElement = class extends import_lit.LitElement {
920
1213
  if (typeof window !== "undefined") {
921
1214
  window.addEventListener("resize", this.handleResize);
922
1215
  window.addEventListener("pointerdown", this.handleGlobalPointerDown);
923
- this.hydrateStateFromCookieEarly();
1216
+ this.hydrateStateFromStorageEarly();
1217
+ this.tryAutoAttachCore();
1218
+ this.ensureAnnouncementLoading();
924
1219
  }
925
1220
  }
926
1221
  disconnectedCallback() {
@@ -936,13 +1231,16 @@ var WebInspectorElement = class extends import_lit.LitElement {
936
1231
  if (typeof window === "undefined") {
937
1232
  return;
938
1233
  }
1234
+ if (!this._core) {
1235
+ this.tryAutoAttachCore();
1236
+ }
939
1237
  this.measureContext("button");
940
1238
  this.measureContext("window");
941
1239
  this.contextState.button.anchor = { horizontal: "right", vertical: "top" };
942
1240
  this.contextState.button.anchorOffset = { x: EDGE_MARGIN, y: EDGE_MARGIN };
943
1241
  this.contextState.window.anchor = { horizontal: "right", vertical: "top" };
944
1242
  this.contextState.window.anchorOffset = { x: EDGE_MARGIN, y: EDGE_MARGIN };
945
- this.hydrateStateFromCookie();
1243
+ this.hydrateStateFromStorage();
946
1244
  if (this.isOpen && this.dockMode !== "floating") {
947
1245
  this.applyDockStyles(true);
948
1246
  }
@@ -954,6 +1252,7 @@ var WebInspectorElement = class extends import_lit.LitElement {
954
1252
  this.centerContext("window");
955
1253
  }
956
1254
  }
1255
+ this.ensureAnnouncementLoading();
957
1256
  this.updateHostTransform(this.isOpen ? "window" : "button");
958
1257
  }
959
1258
  render() {
@@ -963,6 +1262,7 @@ var WebInspectorElement = class extends import_lit.LitElement {
963
1262
  const buttonClasses = [
964
1263
  "console-button",
965
1264
  "group",
1265
+ "relative",
966
1266
  "pointer-events-auto",
967
1267
  "inline-flex",
968
1268
  "h-12",
@@ -1004,7 +1304,8 @@ var WebInspectorElement = class extends import_lit.LitElement {
1004
1304
  @pointercancel=${this.handlePointerCancel}
1005
1305
  @click=${this.handleButtonClick}
1006
1306
  >
1007
- <img src=${logo_mark_default} alt="" class="h-7 w-7" loading="lazy" />
1307
+ ${this.renderAnnouncementPreview()}
1308
+ <img src=${inspector_logo_icon_default} alt="Inspector logo" class="h-5 w-auto" loading="lazy" />
1008
1309
  </button>
1009
1310
  `;
1010
1311
  }
@@ -1012,15 +1313,21 @@ var WebInspectorElement = class extends import_lit.LitElement {
1012
1313
  const windowState = this.contextState.window;
1013
1314
  const isDocked = this.dockMode !== "floating";
1014
1315
  const isTransitioning = this.hasAttribute("data-transitioning");
1015
- const isCollapsed = this.dockMode === "docked-left";
1016
1316
  const windowStyles = isDocked ? this.getDockedWindowStyles() : {
1017
1317
  width: `${Math.round(windowState.size.width)}px`,
1018
1318
  height: `${Math.round(windowState.size.height)}px`,
1019
1319
  minWidth: `${MIN_WINDOW_WIDTH}px`,
1020
1320
  minHeight: `${MIN_WINDOW_HEIGHT}px`
1021
1321
  };
1022
- const contextDropdown = this.renderContextDropdown();
1023
- const hasContextDropdown = contextDropdown !== import_lit.nothing;
1322
+ const hasContextDropdown = this.contextOptions.length > 0;
1323
+ const contextDropdown = hasContextDropdown ? this.renderContextDropdown() : import_lit.nothing;
1324
+ const coreStatus = this.getCoreStatusSummary();
1325
+ const agentSelector = hasContextDropdown ? contextDropdown : import_lit.html`
1326
+ <div class="flex items-center gap-2 rounded-md border border-dashed border-gray-200 px-2 py-1 text-xs text-gray-400">
1327
+ <span>${this.renderIcon("Bot")}</span>
1328
+ <span class="truncate">No agents available</span>
1329
+ </div>
1330
+ `;
1024
1331
  return import_lit.html`
1025
1332
  <section
1026
1333
  class="inspector-window pointer-events-auto relative flex flex-col overflow-hidden rounded-xl border border-gray-200 bg-white text-gray-900 shadow-lg"
@@ -1039,134 +1346,81 @@ var WebInspectorElement = class extends import_lit.LitElement {
1039
1346
  @pointercancel=${this.handleResizePointerCancel}
1040
1347
  ></div>
1041
1348
  ` : import_lit.nothing}
1042
- <div class="flex flex-1 overflow-hidden bg-white text-gray-800">
1043
- <nav
1044
- class="flex ${isCollapsed ? "w-16" : "w-56"} shrink-0 flex-col justify-between border-r border-gray-200 bg-gray-50/50 px-3 pb-3 pt-3 text-xs transition-all duration-300"
1045
- aria-label="Inspector sections"
1349
+ <div class="flex flex-1 flex-col overflow-hidden bg-white text-gray-800">
1350
+ <div
1351
+ class="drag-handle relative z-30 flex flex-col border-b border-gray-200 bg-white/95 backdrop-blur-sm ${isDocked ? "" : this.isDragging && this.pointerContext === "window" ? "cursor-grabbing" : "cursor-grab"}"
1352
+ data-drag-context="window"
1353
+ @pointerdown=${isDocked ? void 0 : this.handlePointerDown}
1354
+ @pointermove=${isDocked ? void 0 : this.handlePointerMove}
1355
+ @pointerup=${isDocked ? void 0 : this.handlePointerUp}
1356
+ @pointercancel=${isDocked ? void 0 : this.handlePointerCancel}
1046
1357
  >
1047
- <div class="flex flex-col gap-4 overflow-y-auto">
1048
- <div
1049
- class="flex items-center ${isCollapsed ? "justify-center" : "gap-2 pl-1"} touch-none select-none ${this.isDragging && this.pointerContext === "window" ? "cursor-grabbing" : "cursor-grab"}"
1050
- data-drag-context="window"
1051
- @pointerdown=${this.handlePointerDown}
1052
- @pointermove=${this.handlePointerMove}
1053
- @pointerup=${this.handlePointerUp}
1054
- @pointercancel=${this.handlePointerCancel}
1055
- title="${isCollapsed ? "Acme Inc - Enterprise" : ""}"
1056
- >
1057
- <span
1058
- class="flex h-8 w-8 items-center justify-center rounded-lg bg-gray-900 text-white pointer-events-none"
1059
- >
1060
- ${this.renderIcon("Building2")}
1061
- </span>
1062
- ${!isCollapsed ? import_lit.html`
1063
- <div class="flex flex-1 flex-col leading-tight pointer-events-none">
1064
- <span class="text-sm font-semibold text-gray-900">Acme Inc</span>
1065
- <span class="text-[10px] text-gray-500">Enterprise</span>
1066
- </div>
1067
- ` : import_lit.nothing}
1358
+ <div class="flex flex-wrap items-center gap-3 px-4 py-3">
1359
+ <div class="flex items-center min-w-0">
1360
+ <img src=${inspector_logo_default} alt="Inspector logo" class="h-6 w-auto" loading="lazy" />
1068
1361
  </div>
1069
-
1070
- <div class="flex flex-col gap-2 pt-2">
1071
- ${!isCollapsed ? import_lit.html`<div class="px-1 text-[10px] font-semibold uppercase tracking-wider text-gray-400">Platform</div>` : import_lit.nothing}
1072
- <div class="flex flex-col gap-0.5">
1073
- ${this.menuItems.map(({ key, label, icon }) => {
1362
+ <div class="ml-auto flex min-w-0 items-center gap-2">
1363
+ <div class="min-w-[160px] max-w-xs">
1364
+ ${agentSelector}
1365
+ </div>
1366
+ <div class="flex items-center gap-1">
1367
+ ${this.renderDockControls()}
1368
+ <button
1369
+ class="flex h-8 w-8 items-center justify-center rounded-md text-gray-400 transition hover:bg-gray-100 hover:text-gray-600 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-gray-400"
1370
+ type="button"
1371
+ aria-label="Close Web Inspector"
1372
+ @pointerdown=${this.handleClosePointerDown}
1373
+ @click=${this.handleCloseClick}
1374
+ >
1375
+ ${this.renderIcon("X")}
1376
+ </button>
1377
+ </div>
1378
+ </div>
1379
+ </div>
1380
+ <div class="flex flex-wrap items-center gap-2 border-t border-gray-100 px-3 py-2 text-xs">
1381
+ ${this.menuItems.map(({ key, label, icon }) => {
1074
1382
  const isSelected = this.selectedMenu === key;
1075
- const buttonClasses = [
1076
- "group flex w-full items-center",
1077
- isCollapsed ? "justify-center p-2" : "gap-2 px-2 py-1.5",
1078
- "rounded-md text-left text-xs transition focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-gray-300",
1079
- isSelected ? "bg-gray-900 text-white" : "text-gray-600 hover:bg-gray-100 hover:text-gray-900"
1383
+ const tabClasses = [
1384
+ "inline-flex items-center gap-2 rounded-md px-3 py-2 transition focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-gray-300",
1385
+ isSelected ? "bg-gray-900 text-white shadow-sm" : "text-gray-600 hover:bg-gray-100 hover:text-gray-900"
1080
1386
  ].join(" ");
1081
- const badgeClasses = isSelected ? "bg-gray-800 text-white" : "bg-white border border-gray-200 text-gray-500 group-hover:border-gray-300 group-hover:text-gray-700";
1082
1387
  return import_lit.html`
1083
- <button
1084
- type="button"
1085
- class=${buttonClasses}
1086
- aria-pressed=${isSelected}
1087
- title="${isCollapsed ? label : ""}"
1088
- @click=${() => this.handleMenuSelect(key)}
1089
- >
1090
- <span
1091
- class="flex h-6 w-6 items-center justify-center rounded ${isCollapsed && isSelected ? "text-white" : isCollapsed ? "text-gray-600" : badgeClasses}"
1092
- aria-hidden="true"
1093
- >
1094
- ${this.renderIcon(icon)}
1095
- </span>
1096
- ${!isCollapsed ? import_lit.html`
1097
- <span class="flex-1">${label}</span>
1098
- <span class="text-gray-400 opacity-60">${this.renderIcon("ChevronRight")}</span>
1099
- ` : import_lit.nothing}
1100
- </button>
1101
- `;
1388
+ <button
1389
+ type="button"
1390
+ class=${tabClasses}
1391
+ aria-pressed=${isSelected}
1392
+ @click=${() => this.handleMenuSelect(key)}
1393
+ >
1394
+ <span class="text-gray-400 ${isSelected ? "text-white" : ""}">
1395
+ ${this.renderIcon(icon)}
1396
+ </span>
1397
+ <span>${label}</span>
1398
+ </button>
1399
+ `;
1102
1400
  })}
1103
- </div>
1104
- </div>
1105
1401
  </div>
1106
-
1107
- <div
1108
- class="relative flex items-center ${isCollapsed ? "justify-center p-1" : ""} rounded-lg border border-gray-200 bg-white ${isCollapsed ? "" : "px-2 py-2"} text-left text-xs text-gray-700 cursor-pointer hover:bg-gray-50 transition"
1109
- title="${isCollapsed ? "John Snow - john@snow.com" : ""}"
1110
- >
1111
- <span
1112
- class="${isCollapsed ? "w-8 h-8 shrink-0" : "w-6 h-6"} flex items-center justify-center overflow-hidden rounded bg-gray-100 text-[10px] font-semibold text-gray-700"
1113
- >
1114
- JS
1115
- </span>
1116
- ${!isCollapsed ? import_lit.html`
1117
- <div class="pl-2 flex flex-1 flex-col leading-tight">
1118
- <span class="font-medium text-gray-900">John Snow</span>
1119
- <span class="text-[10px] text-gray-500">john@snow.com</span>
1120
- </div>
1121
- <span class="text-gray-300">${this.renderIcon("ChevronRight")}</span>
1122
- ` : import_lit.nothing}
1123
- </div>
1124
- </nav>
1125
- <div class="relative flex flex-1 flex-col overflow-hidden">
1126
- <div
1127
- class="drag-handle flex items-center justify-between border-b border-gray-200 px-4 py-3 touch-none select-none ${isDocked ? "" : this.isDragging && this.pointerContext === "window" ? "cursor-grabbing" : "cursor-grab"}"
1128
- data-drag-context="window"
1129
- @pointerdown=${isDocked ? void 0 : this.handlePointerDown}
1130
- @pointermove=${isDocked ? void 0 : this.handlePointerMove}
1131
- @pointerup=${isDocked ? void 0 : this.handlePointerUp}
1132
- @pointercancel=${isDocked ? void 0 : this.handlePointerCancel}
1133
- >
1134
- <div class="flex min-w-0 flex-1 items-center gap-2 text-xs text-gray-500">
1135
- <div class="flex min-w-0 flex-1 items-center text-xs text-gray-600">
1136
- <span class="flex shrink-0 items-center gap-1">
1137
- <span>🪁</span>
1138
- <span class="font-medium whitespace-nowrap">CopilotKit Inspector</span>
1139
- </span>
1140
- <span class="mx-3 h-3 w-px shrink-0 bg-gray-200"></span>
1141
- <span class="shrink-0 text-gray-400">
1142
- ${this.renderIcon(this.getSelectedMenu().icon)}
1143
- </span>
1144
- <span class="ml-2 truncate">${this.getSelectedMenu().label}</span>
1145
- ${hasContextDropdown ? import_lit.html`
1146
- <span class="mx-3 h-3 w-px shrink-0 bg-gray-200"></span>
1147
- <div class="min-w-0">${contextDropdown}</div>
1148
- ` : import_lit.nothing}
1149
- </div>
1402
+ </div>
1403
+ <div class="flex flex-1 flex-col overflow-hidden">
1404
+ <div class="flex-1 overflow-auto">
1405
+ ${this.renderAnnouncementPanel()}
1406
+ ${this.renderCoreWarningBanner()}
1407
+ ${this.renderMainContent()}
1408
+ <slot></slot>
1150
1409
  </div>
1151
- <div class="flex items-center gap-1">
1152
- ${this.renderDockControls()}
1153
- <button
1154
- class="flex h-6 w-6 items-center justify-center rounded text-gray-400 transition hover:bg-gray-100 hover:text-gray-600 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-gray-400"
1155
- type="button"
1156
- aria-label="Close Web Inspector"
1157
- @pointerdown=${this.handleClosePointerDown}
1158
- @click=${this.handleCloseClick}
1410
+ <div class="border-t border-gray-200 bg-gray-50 px-4 py-2">
1411
+ <div
1412
+ class="flex items-center gap-2 rounded-md px-3 py-2 text-xs ${coreStatus.tone} w-full overflow-hidden my-1"
1413
+ title=${coreStatus.description}
1159
1414
  >
1160
- ${this.renderIcon("X")}
1161
- </button>
1415
+ <span class="flex h-6 w-6 items-center justify-center rounded bg-white/60">
1416
+ ${this.renderIcon("Activity")}
1417
+ </span>
1418
+ <span class="font-medium">${coreStatus.label}</span>
1419
+ <span class="truncate text-[11px] opacity-80">${coreStatus.description}</span>
1420
+ </div>
1162
1421
  </div>
1163
1422
  </div>
1164
- <div class="flex-1 overflow-auto">
1165
- ${this.renderMainContent()}
1166
- <slot></slot>
1167
- </div>
1168
1423
  </div>
1169
- </div>
1170
1424
  <div
1171
1425
  class="resize-handle pointer-events-auto absolute bottom-1 right-1 flex h-5 w-5 cursor-nwse-resize items-center justify-center text-gray-400 transition hover:text-gray-600"
1172
1426
  role="presentation"
@@ -1191,11 +1445,11 @@ var WebInspectorElement = class extends import_lit.LitElement {
1191
1445
  </section>
1192
1446
  `;
1193
1447
  }
1194
- hydrateStateFromCookieEarly() {
1448
+ hydrateStateFromStorageEarly() {
1195
1449
  if (typeof document === "undefined" || typeof window === "undefined") {
1196
1450
  return;
1197
1451
  }
1198
- const persisted = loadInspectorState(COOKIE_NAME);
1452
+ const persisted = loadInspectorState(INSPECTOR_STORAGE_KEY);
1199
1453
  if (!persisted) {
1200
1454
  return;
1201
1455
  }
@@ -1216,11 +1470,11 @@ var WebInspectorElement = class extends import_lit.LitElement {
1216
1470
  this.pendingSelectedContext = persisted.selectedContext;
1217
1471
  }
1218
1472
  }
1219
- hydrateStateFromCookie() {
1473
+ hydrateStateFromStorage() {
1220
1474
  if (typeof document === "undefined" || typeof window === "undefined") {
1221
1475
  return;
1222
1476
  }
1223
- const persisted = loadInspectorState(COOKIE_NAME);
1477
+ const persisted = loadInspectorState(INSPECTOR_STORAGE_KEY);
1224
1478
  if (!persisted) {
1225
1479
  return;
1226
1480
  }
@@ -1335,7 +1589,7 @@ var WebInspectorElement = class extends import_lit.LitElement {
1335
1589
  selectedMenu: this.selectedMenu,
1336
1590
  selectedContext: this.selectedContext
1337
1591
  };
1338
- saveInspectorState(COOKIE_NAME, state, COOKIE_MAX_AGE_SECONDS);
1592
+ saveInspectorState(INSPECTOR_STORAGE_KEY, state);
1339
1593
  this.pendingSelectedContext = state.selectedContext ?? null;
1340
1594
  }
1341
1595
  clampWindowSize(size) {
@@ -1355,7 +1609,6 @@ var WebInspectorElement = class extends import_lit.LitElement {
1355
1609
  }
1356
1610
  this.startHostTransition();
1357
1611
  this.removeDockStyles();
1358
- const previousMode = this.dockMode;
1359
1612
  this.dockMode = mode;
1360
1613
  if (mode !== "floating") {
1361
1614
  if (mode === "docked-left") {
@@ -1489,6 +1742,8 @@ var WebInspectorElement = class extends import_lit.LitElement {
1489
1742
  if (this.isOpen) {
1490
1743
  return;
1491
1744
  }
1745
+ this.showAnnouncementPreview = false;
1746
+ this.ensureAnnouncementLoading();
1492
1747
  this.isOpen = true;
1493
1748
  this.persistState();
1494
1749
  if (this.dockMode !== "floating") {
@@ -1547,7 +1802,7 @@ var WebInspectorElement = class extends import_lit.LitElement {
1547
1802
  if (this.dockMode === "floating") {
1548
1803
  return import_lit.html`
1549
1804
  <button
1550
- class="flex h-6 w-6 items-center justify-center rounded text-gray-400 transition hover:bg-gray-100 hover:text-gray-600 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-gray-400"
1805
+ class="flex h-8 w-8 items-center justify-center rounded-md text-gray-400 transition hover:bg-gray-100 hover:text-gray-600 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-gray-400"
1551
1806
  type="button"
1552
1807
  aria-label="Dock to left"
1553
1808
  title="Dock Left"
@@ -1559,7 +1814,7 @@ var WebInspectorElement = class extends import_lit.LitElement {
1559
1814
  } else {
1560
1815
  return import_lit.html`
1561
1816
  <button
1562
- class="flex h-6 w-6 items-center justify-center rounded text-gray-400 transition hover:bg-gray-100 hover:text-gray-600 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-gray-400"
1817
+ class="flex h-8 w-8 items-center justify-center rounded-md text-gray-400 transition hover:bg-gray-100 hover:text-gray-600 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-gray-400"
1563
1818
  type="button"
1564
1819
  aria-label="Float window"
1565
1820
  title="Float"
@@ -1596,10 +1851,197 @@ var WebInspectorElement = class extends import_lit.LitElement {
1596
1851
  serializeAttributes(attributes) {
1597
1852
  return Object.entries(attributes).filter(([key, value]) => key !== "key" && value !== void 0 && value !== null && value !== "").map(([key, value]) => `${key}="${String(value).replace(/"/g, "&quot;")}"`).join(" ");
1598
1853
  }
1854
+ sanitizeForLogging(value, depth = 0, seen = /* @__PURE__ */ new WeakSet()) {
1855
+ if (value === void 0) {
1856
+ return "[undefined]";
1857
+ }
1858
+ if (value === null || typeof value === "number" || typeof value === "boolean") {
1859
+ return value;
1860
+ }
1861
+ if (typeof value === "string") {
1862
+ return value;
1863
+ }
1864
+ if (typeof value === "bigint" || typeof value === "symbol" || typeof value === "function") {
1865
+ return String(value);
1866
+ }
1867
+ if (value instanceof Date) {
1868
+ return value.toISOString();
1869
+ }
1870
+ if (Array.isArray(value)) {
1871
+ if (depth >= 4) {
1872
+ return "[Truncated depth]";
1873
+ }
1874
+ return value.map((item) => this.sanitizeForLogging(item, depth + 1, seen));
1875
+ }
1876
+ if (typeof value === "object") {
1877
+ if (seen.has(value)) {
1878
+ return "[Circular]";
1879
+ }
1880
+ seen.add(value);
1881
+ if (depth >= 4) {
1882
+ return "[Truncated depth]";
1883
+ }
1884
+ const result = {};
1885
+ for (const [key, entry] of Object.entries(value)) {
1886
+ result[key] = this.sanitizeForLogging(entry, depth + 1, seen);
1887
+ }
1888
+ return result;
1889
+ }
1890
+ return String(value);
1891
+ }
1892
+ normalizeEventPayload(_type, payload) {
1893
+ if (payload && typeof payload === "object" && "event" in payload) {
1894
+ const { event, ...rest } = payload;
1895
+ const cleaned = Object.keys(rest).length === 0 ? event : { event, ...rest };
1896
+ return this.sanitizeForLogging(cleaned);
1897
+ }
1898
+ return this.sanitizeForLogging(payload);
1899
+ }
1900
+ normalizeMessageContent(content) {
1901
+ if (typeof content === "string") {
1902
+ return content;
1903
+ }
1904
+ if (content && typeof content === "object" && "text" in content) {
1905
+ const maybeText = content.text;
1906
+ if (typeof maybeText === "string") {
1907
+ return maybeText;
1908
+ }
1909
+ }
1910
+ if (content === null || content === void 0) {
1911
+ return "";
1912
+ }
1913
+ if (typeof content === "object") {
1914
+ try {
1915
+ return JSON.stringify(this.sanitizeForLogging(content));
1916
+ } catch {
1917
+ return "";
1918
+ }
1919
+ }
1920
+ return String(content);
1921
+ }
1922
+ normalizeToolCalls(raw) {
1923
+ if (!Array.isArray(raw)) {
1924
+ return [];
1925
+ }
1926
+ return raw.map((entry) => {
1927
+ if (!entry || typeof entry !== "object") {
1928
+ return null;
1929
+ }
1930
+ const call = entry;
1931
+ const fn = call.function;
1932
+ const functionName = typeof fn?.name === "string" ? fn.name : typeof call.toolName === "string" ? call.toolName : void 0;
1933
+ const args = fn && "arguments" in fn ? fn.arguments : call.arguments;
1934
+ const normalized = {
1935
+ id: typeof call.id === "string" ? call.id : void 0,
1936
+ toolName: typeof call.toolName === "string" ? call.toolName : functionName,
1937
+ status: typeof call.status === "string" ? call.status : void 0
1938
+ };
1939
+ if (functionName) {
1940
+ normalized.function = {
1941
+ name: functionName,
1942
+ arguments: this.sanitizeForLogging(args)
1943
+ };
1944
+ }
1945
+ return normalized;
1946
+ }).filter((call) => Boolean(call));
1947
+ }
1948
+ normalizeAgentMessage(message) {
1949
+ if (!message || typeof message !== "object") {
1950
+ return null;
1951
+ }
1952
+ const raw = message;
1953
+ const role = typeof raw.role === "string" ? raw.role : "unknown";
1954
+ const contentText = this.normalizeMessageContent(raw.content);
1955
+ const toolCalls = this.normalizeToolCalls(raw.toolCalls);
1956
+ return {
1957
+ id: typeof raw.id === "string" ? raw.id : void 0,
1958
+ role,
1959
+ contentText,
1960
+ contentRaw: raw.content !== void 0 ? this.sanitizeForLogging(raw.content) : void 0,
1961
+ toolCalls
1962
+ };
1963
+ }
1964
+ normalizeAgentMessages(messages) {
1965
+ if (!Array.isArray(messages)) {
1966
+ return null;
1967
+ }
1968
+ const normalized = messages.map((message) => this.normalizeAgentMessage(message)).filter((msg) => msg !== null);
1969
+ return normalized;
1970
+ }
1971
+ normalizeContextStore(context) {
1972
+ if (!context || typeof context !== "object") {
1973
+ return {};
1974
+ }
1975
+ const normalized = {};
1976
+ for (const [key, entry] of Object.entries(context)) {
1977
+ if (entry && typeof entry === "object" && "value" in entry) {
1978
+ const candidate = entry;
1979
+ const description = typeof candidate.description === "string" && candidate.description.trim().length > 0 ? candidate.description : void 0;
1980
+ normalized[key] = { description, value: candidate.value };
1981
+ } else {
1982
+ normalized[key] = { value: entry };
1983
+ }
1984
+ }
1985
+ return normalized;
1986
+ }
1599
1987
  getSelectedMenu() {
1600
1988
  const found = this.menuItems.find((item) => item.key === this.selectedMenu);
1601
1989
  return found ?? this.menuItems[0];
1602
1990
  }
1991
+ renderCoreWarningBanner() {
1992
+ if (this._core) {
1993
+ return import_lit.nothing;
1994
+ }
1995
+ return import_lit.html`
1996
+ <div class="mx-4 my-3 flex items-start gap-2 rounded-md border border-amber-200 bg-amber-50 px-3 py-2 text-xs text-amber-800">
1997
+ <span class="mt-0.5 shrink-0 text-amber-600">${this.renderIcon("AlertTriangle")}</span>
1998
+ <div class="space-y-1">
1999
+ <div class="font-semibold text-amber-900">CopilotKit core not attached</div>
2000
+ <p class="text-[11px] leading-snug text-amber-800">
2001
+ Pass a live <code>CopilotKitCore</code> instance to <code>&lt;cpk-web-inspector&gt;</code> or expose it on
2002
+ <code>window.__COPILOTKIT_CORE__</code> for auto-attach.
2003
+ </p>
2004
+ </div>
2005
+ </div>
2006
+ `;
2007
+ }
2008
+ getCoreStatusSummary() {
2009
+ if (!this._core) {
2010
+ return {
2011
+ label: "Core not attached",
2012
+ tone: "border border-amber-200 bg-amber-50 text-amber-800",
2013
+ description: "Pass a CopilotKitCore instance to <cpk-web-inspector> or enable auto-attach."
2014
+ };
2015
+ }
2016
+ const status = this.runtimeStatus ?? import_core.CopilotKitCoreRuntimeConnectionStatus.Disconnected;
2017
+ const lastErrorMessage = this.lastCoreError?.message;
2018
+ if (status === import_core.CopilotKitCoreRuntimeConnectionStatus.Error) {
2019
+ return {
2020
+ label: "Runtime error",
2021
+ tone: "border border-rose-200 bg-rose-50 text-rose-700",
2022
+ description: lastErrorMessage ?? "CopilotKit runtime reported an error."
2023
+ };
2024
+ }
2025
+ if (status === import_core.CopilotKitCoreRuntimeConnectionStatus.Connecting) {
2026
+ return {
2027
+ label: "Connecting",
2028
+ tone: "border border-amber-200 bg-amber-50 text-amber-800",
2029
+ description: "Waiting for CopilotKit runtime to finish connecting."
2030
+ };
2031
+ }
2032
+ if (status === import_core.CopilotKitCoreRuntimeConnectionStatus.Connected) {
2033
+ return {
2034
+ label: "Connected",
2035
+ tone: "border border-emerald-200 bg-emerald-50 text-emerald-700",
2036
+ description: "Live runtime connection established."
2037
+ };
2038
+ }
2039
+ return {
2040
+ label: "Disconnected",
2041
+ tone: "border border-gray-200 bg-gray-50 text-gray-700",
2042
+ description: lastErrorMessage ?? "Waiting for CopilotKit runtime to connect."
2043
+ };
2044
+ }
1603
2045
  renderMainContent() {
1604
2046
  if (this.selectedMenu === "ag-ui-events") {
1605
2047
  return this.renderEventsTable();
@@ -1613,15 +2055,12 @@ var WebInspectorElement = class extends import_lit.LitElement {
1613
2055
  if (this.selectedMenu === "agent-context") {
1614
2056
  return this.renderContextView();
1615
2057
  }
1616
- return import_lit.html`
1617
- <div class="flex flex-col gap-3 p-4">
1618
- <div class="h-24 rounded-lg bg-gray-50"></div>
1619
- <div class="h-20 rounded-lg bg-gray-50"></div>
1620
- </div>
1621
- `;
2058
+ return import_lit.nothing;
1622
2059
  }
1623
2060
  renderEventsTable() {
1624
2061
  const events = this.getEventsForSelectedContext();
2062
+ const filteredEvents = this.filterEvents(events);
2063
+ const selectedLabel = this.selectedContext === "all-agents" ? "all agents" : `agent ${this.selectedContext}`;
1625
2064
  if (events.length === 0) {
1626
2065
  return import_lit.html`
1627
2066
  <div class="flex h-full items-center justify-center px-4 py-8 text-center">
@@ -1635,27 +2074,111 @@ var WebInspectorElement = class extends import_lit.LitElement {
1635
2074
  </div>
1636
2075
  `;
1637
2076
  }
2077
+ if (filteredEvents.length === 0) {
2078
+ return import_lit.html`
2079
+ <div class="flex h-full items-center justify-center px-4 py-8 text-center">
2080
+ <div class="max-w-md space-y-3">
2081
+ <div class="flex justify-center text-gray-300 [&>svg]:!h-8 [&>svg]:!w-8">
2082
+ ${this.renderIcon("Filter")}
2083
+ </div>
2084
+ <p class="text-sm text-gray-600">No events match the current filters.</p>
2085
+ <div>
2086
+ <button
2087
+ type="button"
2088
+ class="inline-flex items-center gap-1 rounded-md bg-gray-900 px-3 py-1.5 text-[11px] font-medium text-white transition hover:bg-gray-800"
2089
+ @click=${this.resetEventFilters}
2090
+ >
2091
+ ${this.renderIcon("RefreshCw")}
2092
+ <span>Reset filters</span>
2093
+ </button>
2094
+ </div>
2095
+ </div>
2096
+ </div>
2097
+ `;
2098
+ }
1638
2099
  return import_lit.html`
1639
- <div class="relative h-full overflow-auto">
1640
- <table class="w-full border-separate border-spacing-0 text-xs">
1641
- <thead class="sticky top-0 z-10">
1642
- <tr class="bg-white">
1643
- <th class="border-b border-gray-200 bg-white px-3 py-2 text-left font-medium text-gray-900">
1644
- Agent
1645
- </th>
1646
- <th class="border-b border-gray-200 bg-white px-3 py-2 text-left font-medium text-gray-900">
1647
- Time
1648
- </th>
1649
- <th class="border-b border-gray-200 bg-white px-3 py-2 text-left font-medium text-gray-900">
1650
- Event Type
1651
- </th>
1652
- <th class="border-b border-gray-200 bg-white px-3 py-2 text-left font-medium text-gray-900">
1653
- AG-UI Event
1654
- </th>
1655
- </tr>
1656
- </thead>
1657
- <tbody>
1658
- ${events.map((event, index) => {
2100
+ <div class="flex h-full flex-col">
2101
+ <div class="flex flex-col gap-1.5 border-b border-gray-200 bg-white px-4 py-2.5">
2102
+ <div class="flex flex-wrap items-center gap-2">
2103
+ <div class="relative min-w-[200px] flex-1">
2104
+ <input
2105
+ type="search"
2106
+ class="w-full rounded-md border border-gray-200 px-3 py-1.5 text-[11px] text-gray-700 shadow-sm outline-none ring-1 ring-transparent transition focus:border-gray-300 focus:ring-gray-200"
2107
+ placeholder="Search agent, type, payload"
2108
+ .value=${this.eventFilterText}
2109
+ @input=${this.handleEventFilterInput}
2110
+ />
2111
+ </div>
2112
+ <select
2113
+ class="w-40 rounded-md border border-gray-200 bg-white px-2 py-1.5 text-[11px] text-gray-700 shadow-sm outline-none transition focus:border-gray-300 focus:ring-2 focus:ring-gray-200"
2114
+ .value=${this.eventTypeFilter}
2115
+ @change=${this.handleEventTypeChange}
2116
+ >
2117
+ <option value="all">All event types</option>
2118
+ ${AGENT_EVENT_TYPES.map(
2119
+ (type) => import_lit.html`<option value=${type}>${type.toLowerCase().replace(/_/g, " ")}</option>`
2120
+ )}
2121
+ </select>
2122
+ <div class="flex items-center gap-1 text-[11px]">
2123
+ <button
2124
+ type="button"
2125
+ class="tooltip-target flex h-8 w-8 items-center justify-center rounded-md border border-gray-200 bg-white text-gray-600 transition hover:bg-gray-50 disabled:cursor-not-allowed disabled:opacity-50"
2126
+ title="Reset filters"
2127
+ data-tooltip="Reset filters"
2128
+ aria-label="Reset filters"
2129
+ @click=${this.resetEventFilters}
2130
+ ?disabled=${!this.eventFilterText && this.eventTypeFilter === "all"}
2131
+ >
2132
+ ${this.renderIcon("RotateCw")}
2133
+ </button>
2134
+ <button
2135
+ type="button"
2136
+ class="tooltip-target flex h-8 w-8 items-center justify-center rounded-md border border-gray-200 bg-white text-gray-600 transition hover:bg-gray-50 disabled:cursor-not-allowed disabled:opacity-50"
2137
+ title="Export JSON"
2138
+ data-tooltip="Export JSON"
2139
+ aria-label="Export JSON"
2140
+ @click=${() => this.exportEvents(filteredEvents)}
2141
+ ?disabled=${filteredEvents.length === 0}
2142
+ >
2143
+ ${this.renderIcon("Download")}
2144
+ </button>
2145
+ <button
2146
+ type="button"
2147
+ class="tooltip-target flex h-8 w-8 items-center justify-center rounded-md border border-gray-200 bg-white text-gray-600 transition hover:bg-gray-50 disabled:cursor-not-allowed disabled:opacity-50"
2148
+ title="Clear events"
2149
+ data-tooltip="Clear events"
2150
+ aria-label="Clear events"
2151
+ @click=${this.handleClearEvents}
2152
+ ?disabled=${events.length === 0}
2153
+ >
2154
+ ${this.renderIcon("Trash2")}
2155
+ </button>
2156
+ </div>
2157
+ </div>
2158
+ <div class="text-[11px] text-gray-500">
2159
+ Showing ${filteredEvents.length} of ${events.length}${this.selectedContext === "all-agents" ? "" : ` for ${selectedLabel}`}
2160
+ </div>
2161
+ </div>
2162
+ <div class="relative h-full w-full overflow-y-auto overflow-x-hidden">
2163
+ <table class="w-full table-fixed border-collapse text-xs box-border">
2164
+ <thead class="sticky top-0 z-10">
2165
+ <tr class="bg-white">
2166
+ <th class="border-b border-gray-200 bg-white px-3 py-2 text-left font-medium text-gray-900">
2167
+ Agent
2168
+ </th>
2169
+ <th class="border-b border-gray-200 bg-white px-3 py-2 text-left font-medium text-gray-900">
2170
+ Time
2171
+ </th>
2172
+ <th class="border-b border-gray-200 bg-white px-3 py-2 text-left font-medium text-gray-900">
2173
+ Event Type
2174
+ </th>
2175
+ <th class="border-b border-gray-200 bg-white px-3 py-2 text-left font-medium text-gray-900">
2176
+ AG-UI Event
2177
+ </th>
2178
+ </tr>
2179
+ </thead>
2180
+ <tbody>
2181
+ ${filteredEvents.map((event, index) => {
1659
2182
  const rowBg = index % 2 === 0 ? "bg-white" : "bg-gray-50/50";
1660
2183
  const badgeClasses = this.getEventBadgeClasses(event.type);
1661
2184
  const extractedEvent = this.extractEventFromPayload(event.payload);
@@ -1663,45 +2186,79 @@ var WebInspectorElement = class extends import_lit.LitElement {
1663
2186
  const prettyEvent = this.stringifyPayload(extractedEvent, true) || inlineEvent;
1664
2187
  const isExpanded = this.expandedRows.has(event.id);
1665
2188
  return import_lit.html`
1666
- <tr
1667
- class="${rowBg} cursor-pointer transition hover:bg-blue-50/50"
1668
- @click=${() => this.toggleRowExpansion(event.id)}
1669
- >
1670
- <td class="border-l border-r border-b border-gray-200 px-3 py-2">
1671
- <span class="font-mono text-[11px] text-gray-600">${event.agentId}</span>
1672
- </td>
1673
- <td class="border-r border-b border-gray-200 px-3 py-2 font-mono text-[11px] text-gray-600">
1674
- <span title=${new Date(event.timestamp).toLocaleString()}>
1675
- ${new Date(event.timestamp).toLocaleTimeString()}
1676
- </span>
1677
- </td>
1678
- <td class="border-r border-b border-gray-200 px-3 py-2">
1679
- <span class=${badgeClasses}>${event.type}</span>
1680
- </td>
1681
- <td class="border-r border-b border-gray-200 px-3 py-2 font-mono text-[10px] text-gray-600 ${isExpanded ? "" : "truncate max-w-xs"}">
1682
- ${isExpanded ? import_lit.html`
1683
- <div class="group relative">
1684
- <pre class="m-0 whitespace-pre-wrap text-[10px] font-mono text-gray-600">${prettyEvent}</pre>
1685
- <button
1686
- class="absolute right-0 top-0 cursor-pointer rounded px-2 py-1 text-[10px] opacity-0 transition group-hover:opacity-100 ${this.copiedEvents.has(event.id) ? "bg-green-100 text-green-700" : "bg-gray-100 text-gray-600 hover:bg-gray-200 hover:text-gray-900"}"
1687
- @click=${(e) => {
2189
+ <tr
2190
+ class="${rowBg} cursor-pointer transition hover:bg-blue-50/50"
2191
+ @click=${() => this.toggleRowExpansion(event.id)}
2192
+ >
2193
+ <td class="border-l border-r border-b border-gray-200 px-3 py-2">
2194
+ <span class="font-mono text-[11px] text-gray-600">${event.agentId}</span>
2195
+ </td>
2196
+ <td class="border-r border-b border-gray-200 px-3 py-2 font-mono text-[11px] text-gray-600">
2197
+ <span title=${new Date(event.timestamp).toLocaleString()}>
2198
+ ${new Date(event.timestamp).toLocaleTimeString()}
2199
+ </span>
2200
+ </td>
2201
+ <td class="border-r border-b border-gray-200 px-3 py-2">
2202
+ <span class=${badgeClasses}>${event.type}</span>
2203
+ </td>
2204
+ <td class="border-r border-b border-gray-200 px-3 py-2 font-mono text-[10px] text-gray-600 ${isExpanded ? "" : "truncate max-w-xs"}">
2205
+ ${isExpanded ? import_lit.html`
2206
+ <div class="group relative">
2207
+ <pre class="m-0 whitespace-pre-wrap break-words text-[10px] font-mono text-gray-600">${prettyEvent}</pre>
2208
+ <button
2209
+ class="absolute right-0 top-0 cursor-pointer rounded px-2 py-1 text-[10px] opacity-0 transition group-hover:opacity-100 ${this.copiedEvents.has(event.id) ? "bg-green-100 text-green-700" : "bg-gray-100 text-gray-600 hover:bg-gray-200 hover:text-gray-900"}"
2210
+ @click=${(e) => {
1688
2211
  e.stopPropagation();
1689
2212
  this.copyToClipboard(prettyEvent, event.id);
1690
2213
  }}
1691
- >
1692
- ${this.copiedEvents.has(event.id) ? import_lit.html`<span>✓ Copied</span>` : import_lit.html`<span>Copy</span>`}
1693
- </button>
1694
- </div>
1695
- ` : inlineEvent}
1696
- </td>
1697
- </tr>
1698
- `;
2214
+ >
2215
+ ${this.copiedEvents.has(event.id) ? import_lit.html`<span>✓ Copied</span>` : import_lit.html`<span>Copy</span>`}
2216
+ </button>
2217
+ </div>
2218
+ ` : inlineEvent}
2219
+ </td>
2220
+ </tr>
2221
+ `;
1699
2222
  })}
1700
- </tbody>
1701
- </table>
2223
+ </tbody>
2224
+ </table>
2225
+ </div>
1702
2226
  </div>
1703
2227
  `;
1704
2228
  }
2229
+ handleEventFilterInput(event) {
2230
+ const target = event.target;
2231
+ this.eventFilterText = target?.value ?? "";
2232
+ this.requestUpdate();
2233
+ }
2234
+ handleEventTypeChange(event) {
2235
+ const target = event.target;
2236
+ const value = target?.value;
2237
+ if (!value) {
2238
+ return;
2239
+ }
2240
+ this.eventTypeFilter = value;
2241
+ this.requestUpdate();
2242
+ }
2243
+ resetEventFilters() {
2244
+ this.eventFilterText = "";
2245
+ this.eventTypeFilter = "all";
2246
+ this.requestUpdate();
2247
+ }
2248
+ exportEvents(events) {
2249
+ try {
2250
+ const payload = JSON.stringify(events, null, 2);
2251
+ const blob = new Blob([payload], { type: "application/json" });
2252
+ const url = URL.createObjectURL(blob);
2253
+ const anchor = document.createElement("a");
2254
+ anchor.href = url;
2255
+ anchor.download = `copilotkit-events-${Date.now()}.json`;
2256
+ anchor.click();
2257
+ URL.revokeObjectURL(url);
2258
+ } catch (error) {
2259
+ console.error("Failed to export events", error);
2260
+ }
2261
+ }
1705
2262
  renderAgentsView() {
1706
2263
  if (this.selectedContext === "all-agents") {
1707
2264
  return import_lit.html`
@@ -1795,7 +2352,7 @@ var WebInspectorElement = class extends import_lit.LitElement {
1795
2352
  <h4 class="text-sm font-semibold text-gray-900">Current Messages</h4>
1796
2353
  </div>
1797
2354
  <div class="overflow-auto">
1798
- ${messages && Array.isArray(messages) && messages.length > 0 ? import_lit.html`
2355
+ ${messages && messages.length > 0 ? import_lit.html`
1799
2356
  <table class="w-full text-xs">
1800
2357
  <thead class="bg-gray-50">
1801
2358
  <tr>
@@ -1804,16 +2361,17 @@ var WebInspectorElement = class extends import_lit.LitElement {
1804
2361
  </tr>
1805
2362
  </thead>
1806
2363
  <tbody class="divide-y divide-gray-200">
1807
- ${messages.map((msg, idx) => {
1808
- const role = msg?.role ?? "unknown";
2364
+ ${messages.map((msg) => {
2365
+ const role = msg.role || "unknown";
1809
2366
  const roleColors = {
1810
2367
  user: "bg-blue-100 text-blue-800",
1811
2368
  assistant: "bg-green-100 text-green-800",
1812
2369
  system: "bg-gray-100 text-gray-800",
2370
+ tool: "bg-amber-100 text-amber-800",
1813
2371
  unknown: "bg-gray-100 text-gray-600"
1814
2372
  };
1815
- const rawContent = typeof msg?.content === "string" ? msg.content : msg?.content != null ? JSON.stringify(msg.content) : "";
1816
- const toolCalls = Array.isArray(msg?.toolCalls) ? msg.toolCalls : [];
2373
+ const rawContent = msg.contentText ?? "";
2374
+ const toolCalls = msg.toolCalls ?? [];
1817
2375
  const hasContent = rawContent.trim().length > 0;
1818
2376
  const contentFallback = toolCalls.length > 0 ? "Invoked tool call" : "\u2014";
1819
2377
  return import_lit.html`
@@ -1846,19 +2404,13 @@ var WebInspectorElement = class extends import_lit.LitElement {
1846
2404
  `;
1847
2405
  }
1848
2406
  renderContextDropdown() {
1849
- if (this.selectedMenu === "agent-context") {
1850
- return import_lit.nothing;
1851
- }
1852
- if (this.selectedMenu !== "ag-ui-events" && this.selectedMenu !== "agents" && this.selectedMenu !== "frontend-tools") {
1853
- return import_lit.nothing;
1854
- }
1855
2407
  const filteredOptions = this.selectedMenu === "agents" ? this.contextOptions.filter((opt) => opt.key !== "all-agents") : this.contextOptions;
1856
2408
  const selectedLabel = filteredOptions.find((opt) => opt.key === this.selectedContext)?.label ?? "";
1857
2409
  return import_lit.html`
1858
- <div class="relative min-w-0 flex-1" data-context-dropdown-root="true">
2410
+ <div class="relative z-40 min-w-0 flex-1" data-context-dropdown-root="true">
1859
2411
  <button
1860
2412
  type="button"
1861
- class="flex w-full min-w-0 max-w-[150px] items-center gap-1.5 rounded-md px-2 py-0.5 text-xs font-medium text-gray-600 transition hover:bg-gray-100 hover:text-gray-900"
2413
+ class="relative z-40 flex w-full min-w-0 max-w-[240px] items-center gap-1.5 rounded-md border border-gray-200 px-2 py-1 text-xs font-medium text-gray-700 transition hover:border-gray-300 hover:bg-gray-50"
1862
2414
  @pointerdown=${this.handleContextDropdownToggle}
1863
2415
  >
1864
2416
  <span class="truncate flex-1 text-left">${selectedLabel}</span>
@@ -1929,7 +2481,8 @@ var WebInspectorElement = class extends import_lit.LitElement {
1929
2481
  </div>
1930
2482
  `;
1931
2483
  }
1932
- const allTools = this.extractToolsFromAgents();
2484
+ this.refreshToolsSnapshot();
2485
+ const allTools = this.cachedTools;
1933
2486
  if (allTools.length === 0) {
1934
2487
  return import_lit.html`
1935
2488
  <div class="flex h-full items-center justify-center px-4 py-8 text-center">
@@ -1943,7 +2496,7 @@ var WebInspectorElement = class extends import_lit.LitElement {
1943
2496
  </div>
1944
2497
  `;
1945
2498
  }
1946
- const filteredTools = this.selectedContext === "all-agents" ? allTools : allTools.filter((tool) => tool.agentId === this.selectedContext);
2499
+ const filteredTools = this.selectedContext === "all-agents" ? allTools : allTools.filter((tool) => !tool.agentId || tool.agentId === this.selectedContext);
1947
2500
  return import_lit.html`
1948
2501
  <div class="flex h-full flex-col overflow-hidden">
1949
2502
  <div class="overflow-auto p-4">
@@ -1959,6 +2512,15 @@ var WebInspectorElement = class extends import_lit.LitElement {
1959
2512
  return [];
1960
2513
  }
1961
2514
  const tools = [];
2515
+ for (const coreTool of this._core.tools ?? []) {
2516
+ tools.push({
2517
+ agentId: coreTool.agentId ?? "",
2518
+ name: coreTool.name,
2519
+ description: coreTool.description,
2520
+ parameters: coreTool.parameters,
2521
+ type: "handler"
2522
+ });
2523
+ }
1962
2524
  for (const [agentId, agent] of Object.entries(this._core.agents)) {
1963
2525
  if (!agent) continue;
1964
2526
  const handlers = agent.toolHandlers;
@@ -1969,8 +2531,8 @@ var WebInspectorElement = class extends import_lit.LitElement {
1969
2531
  tools.push({
1970
2532
  agentId,
1971
2533
  name: toolName,
1972
- description: handlerObj.description || handlerObj.tool?.description,
1973
- parameters: handlerObj.parameters || handlerObj.tool?.parameters,
2534
+ description: typeof handlerObj.description === "string" && handlerObj.description || handlerObj.tool?.description,
2535
+ parameters: handlerObj.parameters ?? handlerObj.tool?.parameters,
1974
2536
  type: "handler"
1975
2537
  });
1976
2538
  }
@@ -1985,8 +2547,8 @@ var WebInspectorElement = class extends import_lit.LitElement {
1985
2547
  tools.push({
1986
2548
  agentId,
1987
2549
  name: toolName,
1988
- description: rendererObj.description || rendererObj.tool?.description,
1989
- parameters: rendererObj.parameters || rendererObj.tool?.parameters,
2550
+ description: typeof rendererObj.description === "string" && rendererObj.description || rendererObj.tool?.description,
2551
+ parameters: rendererObj.parameters ?? rendererObj.tool?.parameters,
1990
2552
  type: "renderer"
1991
2553
  });
1992
2554
  }
@@ -2090,14 +2652,19 @@ var WebInspectorElement = class extends import_lit.LitElement {
2090
2652
  return result;
2091
2653
  }
2092
2654
  const zodDef = parameters._def;
2093
- if (zodDef) {
2655
+ if (zodDef && typeof zodDef === "object") {
2094
2656
  if (zodDef.typeName === "ZodObject") {
2095
- const shape = zodDef.shape?.() || zodDef.shape;
2657
+ const rawShape = zodDef.shape;
2658
+ const shape = typeof rawShape === "function" ? rawShape() : rawShape;
2659
+ if (!shape || typeof shape !== "object") {
2660
+ return result;
2661
+ }
2096
2662
  const requiredKeys = /* @__PURE__ */ new Set();
2097
2663
  if (zodDef.unknownKeys === "strict" || !zodDef.catchall) {
2098
2664
  Object.keys(shape || {}).forEach((key) => {
2099
- const fieldDef = shape[key]?._def;
2100
- if (fieldDef && !this.isZodOptional(shape[key])) {
2665
+ const candidate = shape[key];
2666
+ const fieldDef = candidate?._def;
2667
+ if (fieldDef && !this.isZodOptional(candidate)) {
2101
2668
  requiredKeys.add(key);
2102
2669
  }
2103
2670
  });
@@ -2116,24 +2683,27 @@ var WebInspectorElement = class extends import_lit.LitElement {
2116
2683
  }
2117
2684
  } else if (parameters.type === "object" && parameters.properties) {
2118
2685
  const props = parameters.properties;
2119
- const required = new Set(parameters.required || []);
2120
- for (const [key, value] of Object.entries(props)) {
2686
+ const required = new Set(
2687
+ Array.isArray(parameters.required) ? parameters.required : []
2688
+ );
2689
+ for (const [key, value] of Object.entries(props ?? {})) {
2121
2690
  const prop = value;
2122
2691
  result.properties.push({
2123
2692
  name: key,
2124
2693
  type: prop.type,
2125
- description: prop.description,
2694
+ description: typeof prop.description === "string" ? prop.description : void 0,
2126
2695
  required: required.has(key),
2127
2696
  defaultValue: prop.default,
2128
- enum: prop.enum
2697
+ enum: Array.isArray(prop.enum) ? prop.enum : void 0
2129
2698
  });
2130
2699
  }
2131
2700
  }
2132
2701
  return result;
2133
2702
  }
2134
2703
  isZodOptional(zodSchema) {
2135
- if (!zodSchema?._def) return false;
2136
- const def = zodSchema._def;
2704
+ const schema = zodSchema;
2705
+ if (!schema?._def) return false;
2706
+ const def = schema._def;
2137
2707
  if (def.typeName === "ZodOptional" || def.typeName === "ZodNullable") {
2138
2708
  return true;
2139
2709
  }
@@ -2144,18 +2714,20 @@ var WebInspectorElement = class extends import_lit.LitElement {
2144
2714
  }
2145
2715
  extractZodFieldInfo(zodSchema) {
2146
2716
  const info = {};
2147
- if (!zodSchema?._def) return info;
2148
- let currentSchema = zodSchema;
2717
+ const schema = zodSchema;
2718
+ if (!schema?._def) return info;
2719
+ let currentSchema = schema;
2149
2720
  let def = currentSchema._def;
2150
2721
  while (def.typeName === "ZodOptional" || def.typeName === "ZodNullable" || def.typeName === "ZodDefault") {
2151
2722
  if (def.typeName === "ZodDefault" && def.defaultValue !== void 0) {
2152
2723
  info.defaultValue = typeof def.defaultValue === "function" ? def.defaultValue() : def.defaultValue;
2153
2724
  }
2154
- currentSchema = def.innerType;
2725
+ currentSchema = def.innerType ?? currentSchema;
2155
2726
  if (!currentSchema?._def) break;
2156
2727
  def = currentSchema._def;
2157
2728
  }
2158
- info.description = def.description;
2729
+ info.description = typeof def.description === "string" ? def.description : void 0;
2730
+ const typeName = typeof def.typeName === "string" ? def.typeName : void 0;
2159
2731
  const typeMap = {
2160
2732
  ZodString: "string",
2161
2733
  ZodNumber: "number",
@@ -2168,10 +2740,10 @@ var WebInspectorElement = class extends import_lit.LitElement {
2168
2740
  ZodAny: "any",
2169
2741
  ZodUnknown: "unknown"
2170
2742
  };
2171
- info.type = typeMap[def.typeName] || def.typeName?.replace("Zod", "").toLowerCase();
2172
- if (def.typeName === "ZodEnum" && Array.isArray(def.values)) {
2743
+ info.type = typeName ? typeMap[typeName] || typeName.replace("Zod", "").toLowerCase() : void 0;
2744
+ if (typeName === "ZodEnum" && Array.isArray(def.values)) {
2173
2745
  info.enum = def.values;
2174
- } else if (def.typeName === "ZodLiteral" && def.value !== void 0) {
2746
+ } else if (typeName === "ZodLiteral" && def.value !== void 0) {
2175
2747
  info.enum = [def.value];
2176
2748
  }
2177
2749
  return info;
@@ -2213,6 +2785,7 @@ var WebInspectorElement = class extends import_lit.LitElement {
2213
2785
  const isExpanded = this.expandedContextItems.has(id);
2214
2786
  const valuePreview = this.getContextValuePreview(context.value);
2215
2787
  const hasValue = context.value !== void 0 && context.value !== null;
2788
+ const title = context.description?.trim() || id;
2216
2789
  return import_lit.html`
2217
2790
  <div class="rounded-lg border border-gray-200 bg-white overflow-hidden">
2218
2791
  <button
@@ -2222,9 +2795,9 @@ var WebInspectorElement = class extends import_lit.LitElement {
2222
2795
  >
2223
2796
  <div class="flex items-start justify-between gap-3">
2224
2797
  <div class="flex-1 min-w-0">
2225
- ${context.description ? import_lit.html`<p class="text-sm font-medium text-gray-900 mb-1">${context.description}</p>` : import_lit.html`<p class="text-sm font-medium text-gray-500 italic mb-1">No description</p>`}
2798
+ <p class="text-sm font-medium text-gray-900 mb-1">${title}</p>
2226
2799
  <div class="flex items-center gap-2 text-xs text-gray-500">
2227
- <span class="font-mono">${id.substring(0, 8)}...</span>
2800
+ <span class="font-mono truncate inline-block align-middle" style="max-width: 180px;">${id}</span>
2228
2801
  ${hasValue ? import_lit.html`
2229
2802
  <span class="text-gray-300">•</span>
2230
2803
  <span class="truncate">${valuePreview}</span>
@@ -2244,7 +2817,19 @@ var WebInspectorElement = class extends import_lit.LitElement {
2244
2817
  <code class="block rounded bg-white border border-gray-200 px-2 py-1 text-[10px] font-mono text-gray-600">${id}</code>
2245
2818
  </div>
2246
2819
  ${hasValue ? import_lit.html`
2247
- <h5 class="mb-2 text-xs font-semibold text-gray-700">Value</h5>
2820
+ <div class="mb-2 flex items-center justify-between gap-2">
2821
+ <h5 class="text-xs font-semibold text-gray-700">Value</h5>
2822
+ <button
2823
+ class="flex items-center gap-1 rounded-md border border-gray-200 bg-white px-2 py-1 text-[10px] font-medium text-gray-700 transition hover:bg-gray-50"
2824
+ type="button"
2825
+ @click=${(e) => {
2826
+ e.stopPropagation();
2827
+ void this.copyContextValue(context.value, id);
2828
+ }}
2829
+ >
2830
+ ${this.copiedContextItems.has(id) ? "Copied" : "Copy JSON"}
2831
+ </button>
2832
+ </div>
2248
2833
  <div class="rounded-md border border-gray-200 bg-white p-3">
2249
2834
  <pre class="overflow-auto text-xs text-gray-800 max-h-96"><code>${this.formatContextValue(context.value)}</code></pre>
2250
2835
  </div>
@@ -2292,10 +2877,28 @@ var WebInspectorElement = class extends import_lit.LitElement {
2292
2877
  }
2293
2878
  try {
2294
2879
  return JSON.stringify(value, null, 2);
2295
- } catch (error) {
2880
+ } catch {
2296
2881
  return String(value);
2297
2882
  }
2298
2883
  }
2884
+ async copyContextValue(value, contextId) {
2885
+ if (typeof navigator === "undefined" || !navigator.clipboard?.writeText) {
2886
+ console.warn("Clipboard API is not available in this environment.");
2887
+ return;
2888
+ }
2889
+ const serialized = this.formatContextValue(value);
2890
+ try {
2891
+ await navigator.clipboard.writeText(serialized);
2892
+ this.copiedContextItems.add(contextId);
2893
+ this.requestUpdate();
2894
+ setTimeout(() => {
2895
+ this.copiedContextItems.delete(contextId);
2896
+ this.requestUpdate();
2897
+ }, 1500);
2898
+ } catch (error) {
2899
+ console.error("Failed to copy context value:", error);
2900
+ }
2901
+ }
2299
2902
  toggleContextExpansion(contextId) {
2300
2903
  if (this.expandedContextItems.has(contextId)) {
2301
2904
  this.expandedContextItems.delete(contextId);
@@ -2316,6 +2919,169 @@ var WebInspectorElement = class extends import_lit.LitElement {
2316
2919
  }
2317
2920
  this.requestUpdate();
2318
2921
  }
2922
+ renderAnnouncementPanel() {
2923
+ if (!this.isOpen) {
2924
+ return import_lit.nothing;
2925
+ }
2926
+ this.ensureAnnouncementLoading();
2927
+ if (!this.hasUnseenAnnouncement) {
2928
+ return import_lit.nothing;
2929
+ }
2930
+ if (!this.announcementLoaded && !this.announcementMarkdown) {
2931
+ return import_lit.html`<div class="mx-4 my-3 rounded-xl border border-slate-200 bg-white px-4 py-3 text-sm text-slate-800 shadow-[0_12px_30px_rgba(15,23,42,0.12)]">
2932
+ <div class="flex items-center gap-2 font-semibold">
2933
+ <span class="inline-flex h-6 w-6 items-center justify-center rounded-md bg-slate-900 text-white shadow-sm">
2934
+ ${this.renderIcon("Megaphone")}
2935
+ </span>
2936
+ <span>Loading latest announcement…</span>
2937
+ </div>
2938
+ </div>`;
2939
+ }
2940
+ if (this.announcementLoadError) {
2941
+ return import_lit.html`<div class="mx-4 my-3 rounded-xl border border-rose-200 bg-rose-50 px-4 py-3 text-sm text-rose-900 shadow-[0_12px_30px_rgba(15,23,42,0.12)]">
2942
+ <div class="flex items-center gap-2 font-semibold">
2943
+ <span class="inline-flex h-6 w-6 items-center justify-center rounded-md bg-rose-600 text-white shadow-sm">
2944
+ ${this.renderIcon("Megaphone")}
2945
+ </span>
2946
+ <span>Announcement unavailable</span>
2947
+ </div>
2948
+ <p class="mt-2 text-xs text-rose-800">We couldn’t load the latest notice. Please try opening the inspector again.</p>
2949
+ </div>`;
2950
+ }
2951
+ if (!this.announcementMarkdown) {
2952
+ return import_lit.nothing;
2953
+ }
2954
+ const content = this.announcementHtml ? (0, import_unsafe_html.unsafeHTML)(this.announcementHtml) : import_lit.html`<pre class="whitespace-pre-wrap text-sm text-gray-900">${this.announcementMarkdown}</pre>`;
2955
+ return import_lit.html`<div class="mx-4 my-3 rounded-xl border border-slate-200 bg-white px-4 py-4 shadow-[0_12px_30px_rgba(15,23,42,0.12)]">
2956
+ <div class="mb-3 flex items-center gap-2 text-sm font-semibold text-slate-900">
2957
+ <span class="inline-flex h-7 w-7 items-center justify-center rounded-md bg-slate-900 text-white shadow-sm">
2958
+ ${this.renderIcon("Megaphone")}
2959
+ </span>
2960
+ <span>Announcement</span>
2961
+ <button class="announcement-dismiss ml-auto" type="button" @click=${this.handleDismissAnnouncement} aria-label="Dismiss announcement">
2962
+ Dismiss
2963
+ </button>
2964
+ </div>
2965
+ <div class="announcement-content text-sm leading-relaxed text-gray-900">${content}</div>
2966
+ </div>`;
2967
+ }
2968
+ ensureAnnouncementLoading() {
2969
+ if (this.announcementPromise || typeof window === "undefined" || typeof fetch === "undefined") {
2970
+ return;
2971
+ }
2972
+ this.announcementPromise = this.fetchAnnouncement();
2973
+ }
2974
+ renderAnnouncementPreview() {
2975
+ if (!this.hasUnseenAnnouncement || !this.showAnnouncementPreview || !this.announcementPreviewText) {
2976
+ return import_lit.nothing;
2977
+ }
2978
+ const side = this.contextState.button.anchor.horizontal === "left" ? "right" : "left";
2979
+ return import_lit.html`<div
2980
+ class="announcement-preview"
2981
+ data-side=${side}
2982
+ role="note"
2983
+ @click=${() => this.handleAnnouncementPreviewClick()}
2984
+ >
2985
+ <span>${this.announcementPreviewText}</span>
2986
+ <span class="announcement-preview__arrow"></span>
2987
+ </div>`;
2988
+ }
2989
+ handleAnnouncementPreviewClick() {
2990
+ this.showAnnouncementPreview = false;
2991
+ this.openInspector();
2992
+ }
2993
+ async fetchAnnouncement() {
2994
+ try {
2995
+ const response = await fetch(ANNOUNCEMENT_URL, { cache: "no-cache" });
2996
+ if (!response.ok) {
2997
+ throw new Error(`Failed to load announcement (${response.status})`);
2998
+ }
2999
+ const data = await response.json();
3000
+ const timestamp = typeof data?.timestamp === "string" ? data.timestamp : null;
3001
+ const previewText = typeof data?.previewText === "string" ? data.previewText : null;
3002
+ const markdown = typeof data?.announcement === "string" ? data.announcement : null;
3003
+ if (!timestamp || !markdown) {
3004
+ throw new Error("Malformed announcement payload");
3005
+ }
3006
+ const storedTimestamp = this.loadStoredAnnouncementTimestamp();
3007
+ this.announcementTimestamp = timestamp;
3008
+ this.announcementPreviewText = previewText ?? "";
3009
+ this.announcementMarkdown = markdown;
3010
+ this.hasUnseenAnnouncement = (!storedTimestamp || storedTimestamp !== timestamp) && !!this.announcementPreviewText;
3011
+ this.showAnnouncementPreview = this.hasUnseenAnnouncement;
3012
+ this.announcementHtml = await this.convertMarkdownToHtml(markdown);
3013
+ this.announcementLoaded = true;
3014
+ this.requestUpdate();
3015
+ } catch (error) {
3016
+ this.announcementLoadError = error;
3017
+ this.announcementLoaded = true;
3018
+ this.requestUpdate();
3019
+ }
3020
+ }
3021
+ async convertMarkdownToHtml(markdown) {
3022
+ const renderer = new import_marked.marked.Renderer();
3023
+ renderer.link = (href, title, text) => {
3024
+ const safeHref = this.escapeHtmlAttr(this.appendRefParam(href ?? ""));
3025
+ const titleAttr = title ? ` title="${this.escapeHtmlAttr(title)}"` : "";
3026
+ return `<a href="${safeHref}" target="_blank" rel="noopener"${titleAttr}>${text}</a>`;
3027
+ };
3028
+ return import_marked.marked.parse(markdown, { renderer });
3029
+ }
3030
+ appendRefParam(href) {
3031
+ try {
3032
+ const url = new URL(href, typeof window !== "undefined" ? window.location.href : "https://copilotkit.ai");
3033
+ if (!url.searchParams.has("ref")) {
3034
+ url.searchParams.append("ref", "cpk-inspector");
3035
+ }
3036
+ return url.toString();
3037
+ } catch {
3038
+ return href;
3039
+ }
3040
+ }
3041
+ escapeHtmlAttr(value) {
3042
+ return value.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/\"/g, "&quot;").replace(/'/g, "&#39;");
3043
+ }
3044
+ loadStoredAnnouncementTimestamp() {
3045
+ if (typeof window === "undefined" || !window.localStorage) {
3046
+ return null;
3047
+ }
3048
+ try {
3049
+ const raw = window.localStorage.getItem(ANNOUNCEMENT_STORAGE_KEY);
3050
+ if (!raw) {
3051
+ return null;
3052
+ }
3053
+ const parsed = JSON.parse(raw);
3054
+ if (parsed && typeof parsed.timestamp === "string") {
3055
+ return parsed.timestamp;
3056
+ }
3057
+ return null;
3058
+ } catch {
3059
+ }
3060
+ return null;
3061
+ }
3062
+ persistAnnouncementTimestamp(timestamp) {
3063
+ if (typeof window === "undefined" || !window.localStorage) {
3064
+ return;
3065
+ }
3066
+ try {
3067
+ const payload = JSON.stringify({ timestamp });
3068
+ window.localStorage.setItem(ANNOUNCEMENT_STORAGE_KEY, payload);
3069
+ } catch {
3070
+ }
3071
+ }
3072
+ markAnnouncementSeen() {
3073
+ this.hasUnseenAnnouncement = false;
3074
+ this.showAnnouncementPreview = false;
3075
+ if (!this.announcementTimestamp) {
3076
+ if (this.announcementPromise && !this.announcementLoaded) {
3077
+ void this.announcementPromise.then(() => this.markAnnouncementSeen()).catch(() => void 0);
3078
+ }
3079
+ this.requestUpdate();
3080
+ return;
3081
+ }
3082
+ this.persistAnnouncementTimestamp(this.announcementTimestamp);
3083
+ this.requestUpdate();
3084
+ }
2319
3085
  };
2320
3086
  function defineWebInspector() {
2321
3087
  if (!customElements.get(WEB_INSPECTOR_TAG)) {