@skippr/live-agent-sdk 0.39.0 → 0.41.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/dist/esm/lib-exports.js +257 -254
  2. package/dist/skippr-sdk.css +1 -1
  3. package/dist/skippr-sdk.js +101 -98
  4. package/dist/types/components/ShadowHost.d.ts +5 -0
  5. package/package.json +1 -1
package/dist/esm/lib-exports.js CHANGED
@@ -8,7 +8,7 @@ var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require
8
8
 
9
9
  // src/components/LiveAgent.tsx
10
10
  import { LiveKitRoom, RoomAudioRenderer } from "@livekit/components-react";
11
- import { useCallback as useCallback8, useMemo as useMemo5, useRef as useRef10, useState as useState11 } from "react";
11
+ import { useCallback as useCallback8, useMemo as useMemo5, useRef as useRef11, useState as useState12 } from "react";
12
12
 
13
13
  // src/context/LiveAgentContext.tsx
14
14
  import { createContext } from "react";
@@ -2292,80 +2292,34 @@ function ThinkingDots() {
2292
2292
  }
2293
2293
 
2294
2294
  // src/components/Logo.tsx
2295
- import { useId } from "react";
2296
2295
  import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
2297
2296
  function Logo({ className }) {
2298
- const reactId = useId().replace(/:/g, "");
2299
- const clipId = `skippr-logo-clip-${reactId}`;
2300
- const gradientId = `skippr-logo-gradient-${reactId}`;
2301
2297
  return /* @__PURE__ */ jsxs3("svg", {
2302
2298
  width: "1em",
2303
2299
  height: "1em",
2304
- viewBox: "0 0 30 30",
2300
+ viewBox: "0 0 200 200",
2305
2301
  fill: "none",
2306
2302
  xmlns: "http://www.w3.org/2000/svg",
2307
2303
  role: "img",
2308
2304
  "aria-label": "Skippr",
2309
2305
  className,
2310
2306
  children: [
2307
+ /* @__PURE__ */ jsx3("rect", {
2308
+ width: "200",
2309
+ height: "200",
2310
+ rx: "40",
2311
+ fill: "#2D2D3F"
2312
+ }),
2311
2313
  /* @__PURE__ */ jsxs3("g", {
2312
- clipPath: `url(#${clipId})`,
2314
+ transform: "translate(100 100) scale(0.8) translate(-100 -100)",
2313
2315
  children: [
2314
2316
  /* @__PURE__ */ jsx3("path", {
2315
- d: "M0 10C0 4.47715 4.47715 0 10 0H20C25.5228 0 30 4.47715 30 10V20C30 25.5228 25.5228 30 20 30H10C4.47715 30 0 25.5228 0 20V10Z",
2316
- fill: "#2D2D3F"
2317
- }),
2318
- /* @__PURE__ */ jsx3("rect", {
2319
- x: "7.83325",
2320
- y: "14.9404",
2321
- width: "12.4083",
2322
- height: "4.72833",
2323
- rx: "2.36417",
2324
- transform: "rotate(-45 7.83325 14.9404)",
2325
- fill: "#52FFF9"
2326
- }),
2327
- /* @__PURE__ */ jsx3("path", {
2328
- d: "M18.8975 12.5928C20.2728 12.5928 21.3877 13.647 21.3877 14.9474C21.3877 16.2479 20.2728 17.3021 18.8975 17.3021L11.4269 17.3021C10.0516 17.3021 8.93665 16.2479 8.93665 14.9474C8.93665 13.647 10.0516 12.5928 11.4269 12.5928L18.8975 12.5928Z",
2329
- fill: `url(#${gradientId})`
2330
- }),
2331
- /* @__PURE__ */ jsx3("rect", {
2332
- x: "10.1665",
2333
- y: "20.4404",
2334
- width: "12.4083",
2335
- height: "4.72833",
2336
- rx: "2.36417",
2337
- transform: "rotate(-45 10.1665 20.4404)",
2317
+ d: "M144.497 59C149.193 59 153 62.8071 153 67.5033V116.397C153 118.034 152.536 119.562 151.735 120.859L114.894 92.4811L114.894 92.4804C105.42 85.1648 91.2971 91.7058 91.297 104.015V124.901H54.5033C49.8071 124.901 46 121.094 46 116.397V67.5033C46 62.8071 49.8071 59 54.5033 59H144.497ZM101.272 104.015C101.272 100.172 105.736 98.0111 108.798 100.375L140.637 124.901H101.272V104.015Z",
2338
2318
  fill: "white"
2339
- })
2340
- ]
2341
- }),
2342
- /* @__PURE__ */ jsxs3("defs", {
2343
- children: [
2344
- /* @__PURE__ */ jsxs3("linearGradient", {
2345
- id: gradientId,
2346
- x1: "18.9237",
2347
- y1: "16.9997",
2348
- x2: "11.4129",
2349
- y2: "14.1904",
2350
- gradientUnits: "userSpaceOnUse",
2351
- children: [
2352
- /* @__PURE__ */ jsx3("stop", {
2353
- offset: "0.473958",
2354
- stopColor: "white"
2355
- }),
2356
- /* @__PURE__ */ jsx3("stop", {
2357
- offset: "1",
2358
- stopColor: "#52FFF9"
2359
- })
2360
- ]
2361
2319
  }),
2362
- /* @__PURE__ */ jsx3("clipPath", {
2363
- id: clipId,
2364
- children: /* @__PURE__ */ jsx3("rect", {
2365
- width: "30",
2366
- height: "30",
2367
- fill: "white"
2368
- })
2320
+ /* @__PURE__ */ jsx3("path", {
2321
+ d: "M108.798 99.8856C105.736 97.5211 101.271 99.6824 101.271 103.525V155.892C101.271 160.27 106.852 162.191 109.594 158.755L122.619 142.437C123.1 141.836 123.712 141.35 124.409 141.016C125.106 140.683 125.871 140.51 126.645 140.51H147.946C152.386 140.51 154.316 134.944 150.81 132.247L108.798 99.8856Z",
2322
+ fill: "#2BC0AE"
2369
2323
  })
2370
2324
  ]
2371
2325
  })
@@ -2462,9 +2416,9 @@ function IdleLauncher() {
2462
2416
  type: "button",
2463
2417
  onClick: expandPanel,
2464
2418
  "aria-label": "Skippr assistant",
2465
- className: cn("skippr:flex skippr:size-12 skippr:items-center skippr:justify-center", "skippr:rounded-[14px] skippr:bg-bubble skippr:cursor-pointer", "skippr:shadow-[0_4px_16px_rgba(45,43,61,0.45),0_2px_4px_rgba(0,0,0,0.1)]", "skippr:transition-all skippr:hover:-translate-y-0.5 skippr:active:translate-y-0"),
2419
+ className: cn("skippr:flex skippr:size-12 skippr:items-center skippr:justify-center", "skippr:rounded-[10px] skippr:overflow-hidden skippr:cursor-pointer", "skippr:shadow-[0_4px_16px_rgba(45,43,61,0.45),0_2px_4px_rgba(0,0,0,0.1)]", "skippr:transition-all skippr:hover:brightness-110 skippr:hover:-translate-y-0.5 skippr:active:translate-y-0"),
2466
2420
  children: /* @__PURE__ */ jsx4(Logo, {
2467
- className: "skippr:size-7"
2421
+ className: "skippr:size-12"
2468
2422
  })
2469
2423
  });
2470
2424
  }
@@ -2515,6 +2469,51 @@ function MinimizedBubble({
2515
2469
  });
2516
2470
  }
2517
2471
 
2472
+ // src/components/ShadowHost.tsx
2473
+ import { useLayoutEffect, useRef as useRef5, useState as useState5 } from "react";
2474
+ import { createPortal } from "react-dom";
2475
+ import { jsx as jsx5, Fragment as Fragment3 } from "react/jsx-runtime";
2476
+ var PROPERTIES_STYLE_ID = "skippr-tw-properties";
2477
+ var PROPERTY_RULE = /@property\s+[^{]+\{[^}]*\}/g;
2478
+ function hoistTailwindProperties(css) {
2479
+ const propertyRules = css.match(PROPERTY_RULE);
2480
+ if (propertyRules && !document.getElementById(PROPERTIES_STYLE_ID)) {
2481
+ const propertiesStyle = document.createElement("style");
2482
+ propertiesStyle.id = PROPERTIES_STYLE_ID;
2483
+ propertiesStyle.textContent = propertyRules.join(`
2484
+ `);
2485
+ document.head.appendChild(propertiesStyle);
2486
+ }
2487
+ return css.replace(PROPERTY_RULE, "");
2488
+ }
2489
+ function ShadowHost({ children }) {
2490
+ const hostRef = useRef5(null);
2491
+ const [shadowRoot, setShadowRoot] = useState5(null);
2492
+ const css = `/*! tailwindcss v4.1.18 | MIT License | https://tailwindcss.com */
2493
+ @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-scale-x:1;--tw-scale-y:1;--tw-scale-z:1;--tw-space-y-reverse:0;--tw-border-style:solid;--tw-gradient-position:initial;--tw-gradient-from:#0000;--tw-gradient-via:#0000;--tw-gradient-to:#0000;--tw-gradient-stops:initial;--tw-gradient-via-stops:initial;--tw-gradient-from-position:0%;--tw-gradient-via-position:50%;--tw-gradient-to-position:100%;--tw-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-ease:initial;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial}}}@layer theme{:root,:host{--skippr-font-sans:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--skippr-font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--skippr-color-red-50:oklch(97.1% .013 17.38);--skippr-color-red-400:oklch(70.4% .191 22.216);--skippr-color-red-700:oklch(50.5% .213 27.518);--skippr-color-amber-400:oklch(82.8% .189 84.429);--skippr-color-emerald-400:oklch(76.5% .177 163.223);--skippr-color-cyan-400:oklch(78.9% .154 211.53);--skippr-color-cyan-900:oklch(39.8% .07 227.392);--skippr-color-white:#fff;--skippr-spacing:.25rem;--skippr-text-xs:.75rem;--skippr-text-xs--line-height:calc(1/.75);--skippr-text-sm:.875rem;--skippr-text-sm--line-height:calc(1.25/.875);--skippr-font-weight-medium:500;--skippr-font-weight-semibold:600;--skippr-tracking-wide:.025em;--skippr-tracking-wider:.05em;--skippr-leading-tight:1.25;--skippr-leading-snug:1.375;--skippr-leading-relaxed:1.625;--skippr-ease-in-out:cubic-bezier(.4,0,.2,1);--skippr-animate-spin:spin 1s linear infinite;--skippr-animate-ping:ping 1s cubic-bezier(0,0,.2,1)infinite;--skippr-animate-bounce:bounce 1s infinite;--skippr-blur-sm:8px;--skippr-default-transition-duration:.15s;--skippr-default-transition-timing-function:cubic-bezier(.4,0,.2,1);--skippr-default-font-family:var(--skippr-font-sans);--skippr-default-mono-font-family:var(--skippr-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(--skippr-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(--skippr-default-font-feature-settings,normal);font-variation-settings:var(--skippr-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(--skippr-default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-feature-settings:var(--skippr-default-mono-font-feature-settings,normal);font-variation-settings:var(--skippr-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}}@layer components;@layer utilities{.skippr\\:pointer-events-none{pointer-events:none}.skippr\\:absolute{position:absolute}.skippr\\:fixed{position:fixed}.skippr\\:relative{position:relative}.skippr\\:sticky{position:sticky}.skippr\\:inset-0{inset:calc(var(--skippr-spacing)*0)}.skippr\\:top-0{top:calc(var(--skippr-spacing)*0)}.skippr\\:top-full{top:100%}.skippr\\:right-0{right:calc(var(--skippr-spacing)*0)}.skippr\\:right-3{right:calc(var(--skippr-spacing)*3)}.skippr\\:right-5{right:calc(var(--skippr-spacing)*5)}.skippr\\:right-6{right:calc(var(--skippr-spacing)*6)}.skippr\\:-bottom-2{bottom:calc(var(--skippr-spacing)*-2)}.skippr\\:-bottom-9{bottom:calc(var(--skippr-spacing)*-9)}.skippr\\:bottom-0{bottom:calc(var(--skippr-spacing)*0)}.skippr\\:bottom-6{bottom:calc(var(--skippr-spacing)*6)}.skippr\\:bottom-20{bottom:calc(var(--skippr-spacing)*20)}.skippr\\:bottom-\\[88px\\]{bottom:88px}.skippr\\:bottom-full{bottom:100%}.skippr\\:left-0{left:calc(var(--skippr-spacing)*0)}.skippr\\:left-1\\/2{left:50%}.skippr\\:left-3{left:calc(var(--skippr-spacing)*3)}.skippr\\:left-5{left:calc(var(--skippr-spacing)*5)}.skippr\\:left-6{left:calc(var(--skippr-spacing)*6)}.skippr\\:z-10{z-index:10}.skippr\\:z-\\[9998\\]{z-index:9998}.skippr\\:z-\\[9999\\]{z-index:9999}.skippr\\:col-span-2{grid-column:span 2/span 2}.skippr\\:mx-auto{margin-inline:auto}.skippr\\:-mt-\\[5px\\]{margin-top:-5px}.skippr\\:mt-0\\.5{margin-top:calc(var(--skippr-spacing)*.5)}.skippr\\:mt-1{margin-top:calc(var(--skippr-spacing)*1)}.skippr\\:mt-1\\.5{margin-top:calc(var(--skippr-spacing)*1.5)}.skippr\\:mt-3{margin-top:calc(var(--skippr-spacing)*3)}.skippr\\:mb-1\\.5{margin-bottom:calc(var(--skippr-spacing)*1.5)}.skippr\\:mb-2{margin-bottom:calc(var(--skippr-spacing)*2)}.skippr\\:mb-3{margin-bottom:calc(var(--skippr-spacing)*3)}.skippr\\:mb-4{margin-bottom:calc(var(--skippr-spacing)*4)}.skippr\\:line-clamp-1{-webkit-line-clamp:1;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.skippr\\:line-clamp-2{-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.skippr\\:flex{display:flex}.skippr\\:grid{display:grid}.skippr\\:inline-flex{display:inline-flex}.skippr\\:size-1{width:calc(var(--skippr-spacing)*1);height:calc(var(--skippr-spacing)*1)}.skippr\\:size-1\\.5{width:calc(var(--skippr-spacing)*1.5);height:calc(var(--skippr-spacing)*1.5)}.skippr\\:size-2{width:calc(var(--skippr-spacing)*2);height:calc(var(--skippr-spacing)*2)}.skippr\\:size-2\\.5{width:calc(var(--skippr-spacing)*2.5);height:calc(var(--skippr-spacing)*2.5)}.skippr\\:size-3\\.5{width:calc(var(--skippr-spacing)*3.5);height:calc(var(--skippr-spacing)*3.5)}.skippr\\:size-4{width:calc(var(--skippr-spacing)*4);height:calc(var(--skippr-spacing)*4)}.skippr\\:size-5{width:calc(var(--skippr-spacing)*5);height:calc(var(--skippr-spacing)*5)}.skippr\\:size-6{width:calc(var(--skippr-spacing)*6);height:calc(var(--skippr-spacing)*6)}.skippr\\:size-7{width:calc(var(--skippr-spacing)*7);height:calc(var(--skippr-spacing)*7)}.skippr\\:size-8{width:calc(var(--skippr-spacing)*8);height:calc(var(--skippr-spacing)*8)}.skippr\\:size-9{width:calc(var(--skippr-spacing)*9);height:calc(var(--skippr-spacing)*9)}.skippr\\:size-10{width:calc(var(--skippr-spacing)*10);height:calc(var(--skippr-spacing)*10)}.skippr\\:size-11{width:calc(var(--skippr-spacing)*11);height:calc(var(--skippr-spacing)*11)}.skippr\\:size-12{width:calc(var(--skippr-spacing)*12);height:calc(var(--skippr-spacing)*12)}.skippr\\:size-full{width:100%;height:100%}.skippr\\:h-0{height:calc(var(--skippr-spacing)*0)}.skippr\\:h-0\\.5{height:calc(var(--skippr-spacing)*.5)}.skippr\\:h-1{height:calc(var(--skippr-spacing)*1)}.skippr\\:h-1\\.5{height:calc(var(--skippr-spacing)*1.5)}.skippr\\:h-2{height:calc(var(--skippr-spacing)*2)}.skippr\\:h-3{height:calc(var(--skippr-spacing)*3)}.skippr\\:h-3\\.5{height:calc(var(--skippr-spacing)*3.5)}.skippr\\:h-4{height:calc(var(--skippr-spacing)*4)}.skippr\\:h-6{height:calc(var(--skippr-spacing)*6)}.skippr\\:h-8{height:calc(var(--skippr-spacing)*8)}.skippr\\:h-9{height:calc(var(--skippr-spacing)*9)}.skippr\\:h-10{height:calc(var(--skippr-spacing)*10)}.skippr\\:h-12{height:calc(var(--skippr-spacing)*12)}.skippr\\:h-\\[min\\(460px\\,calc\\(100vh-200px\\)\\)\\]{height:min(460px,100vh - 200px)}.skippr\\:h-full{height:100%}.skippr\\:min-h-0{min-height:calc(var(--skippr-spacing)*0)}.skippr\\:w-0{width:calc(var(--skippr-spacing)*0)}.skippr\\:w-3{width:calc(var(--skippr-spacing)*3)}.skippr\\:w-4{width:calc(var(--skippr-spacing)*4)}.skippr\\:w-9{width:calc(var(--skippr-spacing)*9)}.skippr\\:w-10{width:calc(var(--skippr-spacing)*10)}.skippr\\:w-\\[2px\\]{width:2px}.skippr\\:w-full{width:100%}.skippr\\:max-w-64{max-width:calc(var(--skippr-spacing)*64)}.skippr\\:max-w-\\[80\\%\\]{max-width:80%}.skippr\\:min-w-0{min-width:calc(var(--skippr-spacing)*0)}.skippr\\:flex-1{flex:1}.skippr\\:shrink-0{flex-shrink:0}.skippr\\:origin-bottom-left{transform-origin:0 100%}.skippr\\:origin-bottom-right{transform-origin:100% 100%}.skippr\\:origin-center{transform-origin:50%}.skippr\\:-translate-x-1\\/2{--tw-translate-x:calc(calc(1/2*100%)*-1);translate:var(--tw-translate-x)var(--tw-translate-y)}.skippr\\:scale-0{--tw-scale-x:0%;--tw-scale-y:0%;--tw-scale-z:0%;scale:var(--tw-scale-x)var(--tw-scale-y)}.skippr\\:scale-95{--tw-scale-x:95%;--tw-scale-y:95%;--tw-scale-z:95%;scale:var(--tw-scale-x)var(--tw-scale-y)}.skippr\\:scale-100{--tw-scale-x:100%;--tw-scale-y:100%;--tw-scale-z:100%;scale:var(--tw-scale-x)var(--tw-scale-y)}.skippr\\:rotate-\\[225deg\\]{rotate:225deg}.skippr\\:animate-\\[skippr-banner-look_2\\.4s_ease-in-out_infinite\\]{animation:2.4s ease-in-out infinite skippr-banner-look}.skippr\\:animate-\\[skippr-bubble-in_0\\.28s_ease-out\\]{animation:.28s ease-out skippr-bubble-in}.skippr\\:animate-\\[skippr-fade-in_0\\.3s_ease-out\\]{animation:.3s ease-out skippr-fade-in}.skippr\\:animate-\\[skippr-pill-content_0\\.22s_ease-out\\]{animation:.22s ease-out skippr-pill-content}.skippr\\:animate-\\[skippr-speak_1\\.1s_ease-in-out_0\\.3s_infinite\\]{animation:1.1s ease-in-out .3s infinite skippr-speak}.skippr\\:animate-\\[skippr-speak_1\\.1s_ease-in-out_0\\.6s_infinite\\]{animation:1.1s ease-in-out .6s infinite skippr-speak}.skippr\\:animate-\\[skippr-speak_1\\.1s_ease-in-out_0\\.15s_infinite\\]{animation:1.1s ease-in-out .15s infinite skippr-speak}.skippr\\:animate-\\[skippr-speak_1\\.1s_ease-in-out_0\\.45s_infinite\\]{animation:1.1s ease-in-out .45s infinite skippr-speak}.skippr\\:animate-\\[skippr-speak_1\\.1s_ease-in-out_infinite\\]{animation:1.1s ease-in-out infinite skippr-speak}.skippr\\:animate-bounce{animation:var(--skippr-animate-bounce)}.skippr\\:animate-ping{animation:var(--skippr-animate-ping)}.skippr\\:animate-skippr-annotation-pulse{animation:1.8s ease-in-out infinite skippr-annotation-pulse}.skippr\\:animate-skippr-tab-fade{animation:.2s ease-out skippr-tab-fade}.skippr\\:animate-skippr-thinking-dot{animation:1.2s ease-in-out infinite skippr-thinking-dot}.skippr\\:animate-spin{animation:var(--skippr-animate-spin)}.skippr\\:cursor-pointer{cursor:pointer}.skippr\\:resize-none{resize:none}.skippr\\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.skippr\\:flex-col{flex-direction:column}.skippr\\:items-center{align-items:center}.skippr\\:items-end{align-items:flex-end}.skippr\\:items-start{align-items:flex-start}.skippr\\:justify-between{justify-content:space-between}.skippr\\:justify-center{justify-content:center}.skippr\\:justify-end{justify-content:flex-end}.skippr\\:gap-0\\.5{gap:calc(var(--skippr-spacing)*.5)}.skippr\\:gap-1{gap:calc(var(--skippr-spacing)*1)}.skippr\\:gap-1\\.5{gap:calc(var(--skippr-spacing)*1.5)}.skippr\\:gap-2{gap:calc(var(--skippr-spacing)*2)}.skippr\\:gap-2\\.5{gap:calc(var(--skippr-spacing)*2.5)}.skippr\\:gap-3{gap:calc(var(--skippr-spacing)*3)}.skippr\\:gap-\\[2px\\]{gap:2px}.skippr\\:gap-\\[3px\\]{gap:3px}:where(.skippr\\:space-y-0\\.5>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--skippr-spacing)*.5)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--skippr-spacing)*.5)*calc(1 - var(--tw-space-y-reverse)))}:where(.skippr\\:space-y-1>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--skippr-spacing)*1)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--skippr-spacing)*1)*calc(1 - var(--tw-space-y-reverse)))}:where(.skippr\\:space-y-4>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--skippr-spacing)*4)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--skippr-spacing)*4)*calc(1 - var(--tw-space-y-reverse)))}.skippr\\:overflow-hidden{overflow:hidden}.skippr\\:overflow-y-auto{overflow-y:auto}.skippr\\:rounded-2xl{border-radius:1.125rem}.skippr\\:rounded-\\[1rem\\]{border-radius:1rem}.skippr\\:rounded-\\[10px\\]{border-radius:10px}.skippr\\:rounded-\\[14px\\]{border-radius:14px}.skippr\\:rounded-full{border-radius:3.40282e38px}.skippr\\:rounded-lg{border-radius:.625rem}.skippr\\:rounded-md{border-radius:.5rem}.skippr\\:rounded-sm{border-radius:.375rem}.skippr\\:rounded-xl{border-radius:.875rem}.skippr\\:border{border-style:var(--tw-border-style);border-width:1px}.skippr\\:border-0{border-style:var(--tw-border-style);border-width:0}.skippr\\:border-2{border-style:var(--tw-border-style);border-width:2px}.skippr\\:border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.skippr\\:border-r{border-right-style:var(--tw-border-style);border-right-width:1px}.skippr\\:border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.skippr\\:border-l{border-left-style:var(--tw-border-style);border-left-width:1px}.skippr\\:border-border{border-color:oklch(92.3% .003 48.717)}.skippr\\:border-cyan-400{border-color:var(--skippr-color-cyan-400)}.skippr\\:border-destructive\\/20{border-color:oklab(61.4357% .15892 .0698893/.2)}.skippr\\:border-input{border-color:oklch(92.3% .003 48.717)}.skippr\\:border-primary\\/20{border-color:oklab(29.9244% .0107414 -.0305411/.2)}.skippr\\:border-r-border{border-right-color:oklch(92.3% .003 48.717)}.skippr\\:border-l-border{border-left-color:oklch(92.3% .003 48.717)}.skippr\\:bg-amber-400{background-color:var(--skippr-color-amber-400)}.skippr\\:bg-background{background-color:oklch(100% 0 0)}.skippr\\:bg-bubble{background-color:#2d2b3d}.skippr\\:bg-bubble\\/15{background-color:oklab(29.9244% .0107414 -.0305411/.15)}.skippr\\:bg-bubble\\/95{background-color:oklab(29.9244% .0107414 -.0305411/.95)}.skippr\\:bg-card{background-color:oklch(100% 0 0)}.skippr\\:bg-current{background-color:currentColor}.skippr\\:bg-cyan-400{background-color:var(--skippr-color-cyan-400)}.skippr\\:bg-destructive{background-color:#d94f4f}.skippr\\:bg-destructive\\/10{background-color:oklab(61.4357% .15892 .0698893/.1)}.skippr\\:bg-destructive\\/15{background-color:oklab(61.4357% .15892 .0698893/.15)}.skippr\\:bg-emerald-400{background-color:var(--skippr-color-emerald-400)}.skippr\\:bg-foreground{background-color:oklch(14.7% .004 49.25)}.skippr\\:bg-muted{background-color:oklch(97% .001 106.424)}.skippr\\:bg-muted-foreground\\/20{background-color:oklab(55.3% .00687528 .0110332/.2)}.skippr\\:bg-muted-foreground\\/40{background-color:oklab(55.3% .00687528 .0110332/.4)}.skippr\\:bg-muted\\/50{background-color:oklab(97% -.000282743 .000959196/.5)}.skippr\\:bg-primary{background-color:#2d2b3d}.skippr\\:bg-primary-foreground\\/15{background-color:oklab(100% 0 5.96046e-8/.15)}.skippr\\:bg-primary-foreground\\/20{background-color:oklab(100% 0 5.96046e-8/.2)}.skippr\\:bg-primary\\/10{background-color:oklab(29.9244% .0107414 -.0305411/.1)}.skippr\\:bg-red-50{background-color:var(--skippr-color-red-50)}.skippr\\:bg-red-400{background-color:var(--skippr-color-red-400)}.skippr\\:bg-secondary{background-color:#ffdfb5}.skippr\\:bg-transparent{background-color:#0000}.skippr\\:bg-white{background-color:var(--skippr-color-white)}.skippr\\:bg-gradient-to-t{--tw-gradient-position:to top in oklab;background-image:linear-gradient(var(--tw-gradient-stops))}.skippr\\:from-background{--tw-gradient-from:oklch(100% 0 0);--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position),var(--tw-gradient-from)var(--tw-gradient-from-position),var(--tw-gradient-to)var(--tw-gradient-to-position))}.skippr\\:to-transparent{--tw-gradient-to:transparent;--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position),var(--tw-gradient-from)var(--tw-gradient-from-position),var(--tw-gradient-to)var(--tw-gradient-to-position))}.skippr\\:fill-primary\\/30{fill:oklab(29.9244% .0107414 -.0305411/.3)}.skippr\\:p-2{padding:calc(var(--skippr-spacing)*2)}.skippr\\:p-3{padding:calc(var(--skippr-spacing)*3)}.skippr\\:p-3\\.5{padding:calc(var(--skippr-spacing)*3.5)}.skippr\\:p-4{padding:calc(var(--skippr-spacing)*4)}.skippr\\:p-6{padding:calc(var(--skippr-spacing)*6)}.skippr\\:px-1{padding-inline:calc(var(--skippr-spacing)*1)}.skippr\\:px-1\\.5{padding-inline:calc(var(--skippr-spacing)*1.5)}.skippr\\:px-2{padding-inline:calc(var(--skippr-spacing)*2)}.skippr\\:px-2\\.5{padding-inline:calc(var(--skippr-spacing)*2.5)}.skippr\\:px-3{padding-inline:calc(var(--skippr-spacing)*3)}.skippr\\:px-4{padding-inline:calc(var(--skippr-spacing)*4)}.skippr\\:px-6{padding-inline:calc(var(--skippr-spacing)*6)}.skippr\\:px-8{padding-inline:calc(var(--skippr-spacing)*8)}.skippr\\:py-0\\.5{padding-block:calc(var(--skippr-spacing)*.5)}.skippr\\:py-1{padding-block:calc(var(--skippr-spacing)*1)}.skippr\\:py-1\\.5{padding-block:calc(var(--skippr-spacing)*1.5)}.skippr\\:py-2{padding-block:calc(var(--skippr-spacing)*2)}.skippr\\:py-2\\.5{padding-block:calc(var(--skippr-spacing)*2.5)}.skippr\\:py-3{padding-block:calc(var(--skippr-spacing)*3)}.skippr\\:py-4{padding-block:calc(var(--skippr-spacing)*4)}.skippr\\:pt-3{padding-top:calc(var(--skippr-spacing)*3)}.skippr\\:pb-5{padding-bottom:calc(var(--skippr-spacing)*5)}.skippr\\:text-center{text-align:center}.skippr\\:text-left{text-align:left}.skippr\\:font-mono{font-family:var(--skippr-font-mono)}.skippr\\:text-sm{font-size:var(--skippr-text-sm);line-height:var(--tw-leading,var(--skippr-text-sm--line-height))}.skippr\\:text-xs{font-size:var(--skippr-text-xs);line-height:var(--tw-leading,var(--skippr-text-xs--line-height))}.skippr\\:text-\\[9px\\]{font-size:9px}.skippr\\:text-\\[10px\\]{font-size:10px}.skippr\\:text-\\[11px\\]{font-size:11px}.skippr\\:leading-5{--tw-leading:calc(var(--skippr-spacing)*5);line-height:calc(var(--skippr-spacing)*5)}.skippr\\:leading-relaxed{--tw-leading:var(--skippr-leading-relaxed);line-height:var(--skippr-leading-relaxed)}.skippr\\:leading-snug{--tw-leading:var(--skippr-leading-snug);line-height:var(--skippr-leading-snug)}.skippr\\:leading-tight{--tw-leading:var(--skippr-leading-tight);line-height:var(--skippr-leading-tight)}.skippr\\:font-medium{--tw-font-weight:var(--skippr-font-weight-medium);font-weight:var(--skippr-font-weight-medium)}.skippr\\:font-semibold{--tw-font-weight:var(--skippr-font-weight-semibold);font-weight:var(--skippr-font-weight-semibold)}.skippr\\:tracking-wide{--tw-tracking:var(--skippr-tracking-wide);letter-spacing:var(--skippr-tracking-wide)}.skippr\\:tracking-wider{--tw-tracking:var(--skippr-tracking-wider);letter-spacing:var(--skippr-tracking-wider)}.skippr\\:whitespace-nowrap{white-space:nowrap}.skippr\\:text-background{color:oklch(100% 0 0)}.skippr\\:text-bubble{color:#2d2b3d}.skippr\\:text-chart-3{color:oklch(66.6% .179 58.318)}.skippr\\:text-cyan-900{color:var(--skippr-color-cyan-900)}.skippr\\:text-destructive{color:#d94f4f}.skippr\\:text-destructive-foreground{color:oklch(100% 0 0)}.skippr\\:text-foreground{color:oklch(14.7% .004 49.25)}.skippr\\:text-muted-foreground{color:oklch(55.3% .013 58.071)}.skippr\\:text-muted-foreground\\/30{color:oklab(55.3% .00687528 .0110332/.3)}.skippr\\:text-muted-foreground\\/40{color:oklab(55.3% .00687528 .0110332/.4)}.skippr\\:text-muted-foreground\\/60{color:oklab(55.3% .00687528 .0110332/.6)}.skippr\\:text-muted-foreground\\/70{color:oklab(55.3% .00687528 .0110332/.7)}.skippr\\:text-primary{color:#2d2b3d}.skippr\\:text-primary-foreground{color:#fff}.skippr\\:text-primary-foreground\\/70{color:oklab(100% 0 5.96046e-8/.7)}.skippr\\:text-red-700{color:var(--skippr-color-red-700)}.skippr\\:text-secondary-foreground{color:#613700}.skippr\\:text-white{color:var(--skippr-color-white)}.skippr\\:uppercase{text-transform:uppercase}.skippr\\:line-through{text-decoration-line:line-through}.skippr\\:placeholder-muted-foreground::placeholder{color:oklch(55.3% .013 58.071)}.skippr\\:opacity-0{opacity:0}.skippr\\:opacity-75{opacity:.75}.skippr\\:opacity-100{opacity:1}.skippr\\:shadow-2xl{--tw-shadow:0 25px 50px -12px var(--tw-shadow-color,#00000040);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-\\[0_4px_12px_rgba\\(0\\,0\\,0\\,0\\.12\\)\\]{--tw-shadow:0 4px 12px var(--tw-shadow-color,#0000001f);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-\\[0_4px_16px_rgba\\(0\\,0\\,0\\,0\\.15\\)\\,0_2px_4px_rgba\\(0\\,0\\,0\\,0\\.1\\)\\]{--tw-shadow:0 4px 16px var(--tw-shadow-color,#00000026),0 2px 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)}.skippr\\:shadow-\\[0_4px_16px_rgba\\(45\\,43\\,61\\,0\\.45\\)\\,0_2px_4px_rgba\\(0\\,0\\,0\\,0\\.1\\)\\]{--tw-shadow:0 4px 16px var(--tw-shadow-color,#2d2b3d73),0 2px 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)}.skippr\\:shadow-\\[0_4px_16px_rgba\\(217\\,79\\,79\\,0\\.45\\)\\,0_2px_4px_rgba\\(0\\,0\\,0\\,0\\.1\\)\\]{--tw-shadow:0 4px 16px var(--tw-shadow-color,#d94f4f73),0 2px 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)}.skippr\\:shadow-\\[0_8px_24px_rgba\\(45\\,43\\,61\\,0\\.35\\)\\]{--tw-shadow:0 8px 24px var(--tw-shadow-color,#2d2b3d59);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:shadow-\\[0_8px_30px_rgba\\(0\\,0\\,0\\,0\\.16\\)\\,0_4px_12px_rgba\\(0\\,0\\,0\\,0\\.08\\)\\]{--tw-shadow:0 8px 30px var(--tw-shadow-color,#00000029),0 4px 12px var(--tw-shadow-color,#00000014);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\: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)}.skippr\\:shadow-xs{--tw-shadow:0 1px 2px 0 var(--tw-shadow-color,#0000000d);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\: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)}.skippr\\:ring-foreground\\/10{--tw-ring-color:oklab(14.7% .00261104 .00303026/.1)}.skippr\\:ring-offset-background{--tw-ring-offset-color:oklch(100% 0 0)}.skippr\\:backdrop-blur-sm{--tw-backdrop-blur:blur(var(--skippr-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,)}.skippr\\:transition-\\[opacity\\,transform\\]{transition-property:opacity,transform;transition-timing-function:var(--tw-ease,var(--skippr-default-transition-timing-function));transition-duration:var(--tw-duration,var(--skippr-default-transition-duration))}.skippr\\:transition-\\[width\\]{transition-property:width;transition-timing-function:var(--tw-ease,var(--skippr-default-transition-timing-function));transition-duration:var(--tw-duration,var(--skippr-default-transition-duration))}.skippr\\:transition-all{transition-property:all;transition-timing-function:var(--tw-ease,var(--skippr-default-transition-timing-function));transition-duration:var(--tw-duration,var(--skippr-default-transition-duration))}.skippr\\:transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--skippr-default-transition-timing-function));transition-duration:var(--tw-duration,var(--skippr-default-transition-duration))}.skippr\\:transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease,var(--skippr-default-transition-timing-function));transition-duration:var(--tw-duration,var(--skippr-default-transition-duration))}.skippr\\:transition-shadow{transition-property:box-shadow;transition-timing-function:var(--tw-ease,var(--skippr-default-transition-timing-function));transition-duration:var(--tw-duration,var(--skippr-default-transition-duration))}.skippr\\:duration-150{--tw-duration:.15s;transition-duration:.15s}.skippr\\:duration-300{--tw-duration:.3s;transition-duration:.3s}.skippr\\:ease-in-out{--tw-ease:var(--skippr-ease-in-out);transition-timing-function:var(--skippr-ease-in-out)}.skippr\\:outline-none{--tw-outline-style:none;outline-style:none}.skippr\\:\\[animation-delay\\:0ms\\]{animation-delay:0s}.skippr\\:\\[animation-delay\\:150ms\\]{animation-delay:.15s}.skippr\\:\\[animation-delay\\:200ms\\]{animation-delay:.2s}.skippr\\:\\[animation-delay\\:300ms\\]{animation-delay:.3s}.skippr\\:\\[animation-delay\\:400ms\\]{animation-delay:.4s}.skippr\\:group-focus-within\\:scale-100:is(:where(.skippr\\:group):focus-within *){--tw-scale-x:100%;--tw-scale-y:100%;--tw-scale-z:100%;scale:var(--tw-scale-x)var(--tw-scale-y)}.skippr\\:group-focus-within\\:opacity-100:is(:where(.skippr\\:group):focus-within *){opacity:1}@media (hover:hover){.skippr\\:group-hover\\:scale-100:is(:where(.skippr\\:group):hover *){--tw-scale-x:100%;--tw-scale-y:100%;--tw-scale-z:100%;scale:var(--tw-scale-x)var(--tw-scale-y)}.skippr\\:group-hover\\:opacity-100:is(:where(.skippr\\:group):hover *){opacity:1}}.skippr\\:placeholder\\:text-muted-foreground::placeholder{color:oklch(55.3% .013 58.071)}@media (hover:hover){.skippr\\:hover\\:-translate-y-0\\.5:hover{--tw-translate-y:calc(var(--skippr-spacing)*-.5);translate:var(--tw-translate-x)var(--tw-translate-y)}.skippr\\:hover\\:bg-accent:hover{background-color:#e7e5e4}.skippr\\:hover\\:bg-bubble:hover{background-color:#2d2b3d}.skippr\\:hover\\:bg-destructive\\/20:hover{background-color:oklab(61.4357% .15892 .0698893/.2)}.skippr\\:hover\\:bg-destructive\\/25:hover{background-color:oklab(61.4357% .15892 .0698893/.25)}.skippr\\:hover\\:bg-destructive\\/90:hover{background-color:oklab(61.4357% .15892 .0698893/.9)}.skippr\\:hover\\:bg-muted:hover{background-color:oklch(97% .001 106.424)}.skippr\\:hover\\:bg-muted\\/50:hover{background-color:oklab(97% -.000282743 .000959196/.5)}.skippr\\:hover\\:bg-muted\\/80:hover{background-color:oklab(97% -.000282743 .000959196/.8)}.skippr\\:hover\\:bg-primary-foreground\\/10:hover{background-color:oklab(100% 0 5.96046e-8/.1)}.skippr\\:hover\\:bg-primary\\/90:hover{background-color:oklab(29.9244% .0107414 -.0305411/.9)}.skippr\\:hover\\:bg-secondary\\/80:hover{background-color:oklab(91.9963% .0175391 .0626889/.8)}.skippr\\:hover\\:text-accent-foreground:hover{color:oklch(21.6% .006 56.043)}.skippr\\:hover\\:text-foreground:hover{color:oklch(14.7% .004 49.25)}.skippr\\:hover\\:text-primary-foreground:hover{color:#fff}.skippr\\:hover\\:shadow-\\[0_6px_24px_rgba\\(45\\,43\\,61\\,0\\.55\\)\\,0_4px_8px_rgba\\(0\\,0\\,0\\,0\\.1\\)\\]:hover{--tw-shadow:0 6px 24px var(--tw-shadow-color,#2d2b3d8c),0 4px 8px 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)}.skippr\\:hover\\:brightness-110:hover{--tw-brightness:brightness(110%);filter:var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)}}.skippr\\:focus-visible\\:ring-2:focus-visible{--tw-ring-shadow:var(--tw-ring-inset,)0 0 0 calc(2px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.skippr\\:focus-visible\\:ring-ring:focus-visible{--tw-ring-color:oklch(70.9% .01 56.259)}.skippr\\:focus-visible\\:ring-offset-2:focus-visible{--tw-ring-offset-width:2px;--tw-ring-offset-shadow:var(--tw-ring-inset,)0 0 0 var(--tw-ring-offset-width)var(--tw-ring-offset-color)}.skippr\\:focus-visible\\:outline-none:focus-visible{--tw-outline-style:none;outline-style:none}.skippr\\:active\\:translate-y-0:active{--tw-translate-y:calc(var(--skippr-spacing)*0);translate:var(--tw-translate-x)var(--tw-translate-y)}.skippr\\:disabled\\:pointer-events-none:disabled{pointer-events:none}.skippr\\:disabled\\:cursor-not-allowed:disabled{cursor:not-allowed}.skippr\\:disabled\\:opacity-50:disabled{opacity:.5}.skippr\\:disabled\\:opacity-60:disabled{opacity:.6}.skippr\\:\\[\\&_svg\\]\\:pointer-events-none svg{pointer-events:none}.skippr\\:\\[\\&_svg\\]\\:shrink-0 svg{flex-shrink:0}.skippr\\:\\[\\&_svg\\:not\\(\\[class\\*\\=\\'size-\\'\\]\\)\\]\\:size-4 svg:not([class*=size-]){width:calc(var(--skippr-spacing)*4);height:calc(var(--skippr-spacing)*4)}}@keyframes skippr-tab-fade{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}@keyframes skippr-speak{0%,to{opacity:.6;transform:scaleY(.4)}50%{opacity:1;transform:scaleY(1)}}@keyframes skippr-thinking-dot{0%,80%,to{opacity:.2;transform:translateY(0)}40%{opacity:1;transform:translateY(-2px)}}@keyframes skippr-pulse-ring{0%,to{box-shadow:0 0 #2d2b3d66}50%{box-shadow:0 0 0 10px #2d2b3d00}}@keyframes skippr-annotation-pulse{0%,to{box-shadow:0 0 #22d3ee73}50%{box-shadow:0 0 0 10px #22d3ee00}}@keyframes skippr-speak-ripple{0%{opacity:.6;transform:scale(1)}to{opacity:0;transform:scale(1.8)}}@keyframes skippr-bar{0%,to{transform:scaleY(.35)}50%{transform:scaleY(1)}}@keyframes skippr-breathe{0%,to{opacity:.85;transform:scale(1)}50%{opacity:1;transform:scale(1.08)}}@keyframes skippr-fade-in{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}@keyframes skippr-wave{0%,to{opacity:.4;transform:scaleY(.4)}50%{opacity:1;transform:scaleY(1)}}@keyframes skippr-bubble-in{0%{opacity:0;transform:translateY(12px)scale(.96)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes skippr-pill-content{0%{opacity:0;transform:scale(.92)}to{opacity:1;transform:scale(1)}}@keyframes skippr-banner-look{0%,to{transform:translate(0)}25%{transform:translate(-2px)}75%{transform:translate(2px)}}.skippr-no-scrollbar{scrollbar-width:none;-ms-overflow-style:none}.skippr-no-scrollbar::-webkit-scrollbar{display:none}:host{color:var(--color-foreground)}@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-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-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-gradient-position{syntax:"*";inherits:false}@property --tw-gradient-from{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-via{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-to{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-stops{syntax:"*";inherits:false}@property --tw-gradient-via-stops{syntax:"*";inherits:false}@property --tw-gradient-from-position{syntax:"<length-percentage>";inherits:false;initial-value:0%}@property --tw-gradient-via-position{syntax:"<length-percentage>";inherits:false;initial-value:50%}@property --tw-gradient-to-position{syntax:"<length-percentage>";inherits:false;initial-value:100%}@property --tw-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-ease{syntax:"*";inherits:false}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@keyframes spin{to{transform:rotate(360deg)}}@keyframes ping{75%,to{opacity:0;transform:scale(2)}}@keyframes bounce{0%,to{animation-timing-function:cubic-bezier(.8,0,1,1);transform:translateY(-25%)}50%{animation-timing-function:cubic-bezier(0,0,.2,1);transform:none}}`;
2494
+ useLayoutEffect(() => {
2495
+ const host = hostRef.current;
2496
+ if (!host || !css)
2497
+ return;
2498
+ const root = host.shadowRoot ?? (() => {
2499
+ const created = host.attachShadow({ mode: "open" });
2500
+ const style = document.createElement("style");
2501
+ style.textContent = hoistTailwindProperties(css);
2502
+ created.appendChild(style);
2503
+ return created;
2504
+ })();
2505
+ setShadowRoot(root);
2506
+ }, [css]);
2507
+ if (!css)
2508
+ return /* @__PURE__ */ jsx5(Fragment3, {
2509
+ children
2510
+ });
2511
+ return /* @__PURE__ */ jsx5("div", {
2512
+ ref: hostRef,
2513
+ children: shadowRoot && createPortal(children, shadowRoot)
2514
+ });
2515
+ }
2516
+
2518
2517
  // src/components/Sidebar.tsx
2519
2518
  import { useEffect as useEffect16 } from "react";
2520
2519
 
@@ -2609,9 +2608,9 @@ import { useCallback as useCallback6, useEffect as useEffect9 } from "react";
2609
2608
 
2610
2609
  // src/hooks/useAgentState.ts
2611
2610
  import { useRemoteParticipants } from "@livekit/components-react/hooks";
2612
- import { useEffect as useEffect8, useState as useState5 } from "react";
2611
+ import { useEffect as useEffect8, useState as useState6 } from "react";
2613
2612
  function useAgentState(attributeKey, parse, initial) {
2614
- const [value, setValue] = useState5(initial);
2613
+ const [value, setValue] = useState6(initial);
2615
2614
  const remoteParticipants = useRemoteParticipants();
2616
2615
  useEffect8(() => {
2617
2616
  const agentParticipant = remoteParticipants.find((p) => p.attributes?.[attributeKey]);
@@ -2671,7 +2670,7 @@ function usePhaseUpdates() {
2671
2670
  }
2672
2671
 
2673
2672
  // src/hooks/useSessionRemaining.ts
2674
- import { useEffect as useEffect10, useRef as useRef5, useState as useState6 } from "react";
2673
+ import { useEffect as useEffect10, useRef as useRef6, useState as useState7 } from "react";
2675
2674
 
2676
2675
  // src/lib/format.ts
2677
2676
  function formatTime(seconds) {
@@ -2687,8 +2686,8 @@ function parseNumber(s) {
2687
2686
  // src/hooks/useSessionRemaining.ts
2688
2687
  function useSessionRemaining() {
2689
2688
  const maxCallDuration = useAgentState("maxCallDuration", parseNumber, null);
2690
- const endTimeRef = useRef5(null);
2691
- const [remaining, setRemaining] = useState6(null);
2689
+ const endTimeRef = useRef6(null);
2690
+ const [remaining, setRemaining] = useState7(null);
2692
2691
  useEffect10(() => {
2693
2692
  if (maxCallDuration === null || endTimeRef.current !== null)
2694
2693
  return;
@@ -2706,9 +2705,9 @@ function useSessionRemaining() {
2706
2705
  }
2707
2706
 
2708
2707
  // src/hooks/useElapsedSeconds.ts
2709
- import { useEffect as useEffect11, useState as useState7 } from "react";
2708
+ import { useEffect as useEffect11, useState as useState8 } from "react";
2710
2709
  function useElapsedSeconds(isRunning) {
2711
- const [elapsed, setElapsed] = useState7(0);
2710
+ const [elapsed, setElapsed] = useState8(0);
2712
2711
  useEffect11(() => {
2713
2712
  if (!isRunning) {
2714
2713
  setElapsed(0);
@@ -2725,14 +2724,14 @@ function useElapsedSeconds(isRunning) {
2725
2724
  }
2726
2725
 
2727
2726
  // src/components/ChatHeader.tsx
2728
- import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
2727
+ import { jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
2729
2728
  function ChatHeader() {
2730
2729
  const { isConnected, minimizePanel, minimizable } = useLiveAgent();
2731
2730
  const elapsed = useElapsedSeconds(isConnected);
2732
2731
  return /* @__PURE__ */ jsxs5("header", {
2733
2732
  className: "skippr:sticky skippr:top-0 skippr:z-10 skippr:flex skippr:shrink-0 skippr:items-center skippr:justify-between skippr:border-b skippr:border-border skippr:bg-primary skippr:px-4 skippr:py-3",
2734
2733
  children: [
2735
- /* @__PURE__ */ jsx5("p", {
2734
+ /* @__PURE__ */ jsx6("p", {
2736
2735
  className: "skippr:text-sm skippr:font-semibold skippr:text-primary-foreground",
2737
2736
  children: "Skippr"
2738
2737
  }),
@@ -2745,30 +2744,30 @@ function ChatHeader() {
2745
2744
  /* @__PURE__ */ jsxs5("span", {
2746
2745
  className: "skippr:relative skippr:flex skippr:size-1.5",
2747
2746
  children: [
2748
- /* @__PURE__ */ jsx5("span", {
2747
+ /* @__PURE__ */ jsx6("span", {
2749
2748
  className: "skippr:absolute skippr:inline-flex skippr:h-full skippr:w-full skippr:animate-ping skippr:rounded-full skippr:bg-red-400 skippr:opacity-75"
2750
2749
  }),
2751
- /* @__PURE__ */ jsx5("span", {
2750
+ /* @__PURE__ */ jsx6("span", {
2752
2751
  className: "skippr:relative skippr:inline-flex skippr:size-1.5 skippr:rounded-full skippr:bg-red-400"
2753
2752
  })
2754
2753
  ]
2755
2754
  }),
2756
- /* @__PURE__ */ jsx5("span", {
2755
+ /* @__PURE__ */ jsx6("span", {
2757
2756
  className: "skippr:text-[10px] skippr:font-medium skippr:text-primary-foreground",
2758
2757
  children: "REC"
2759
2758
  }),
2760
- /* @__PURE__ */ jsx5("span", {
2759
+ /* @__PURE__ */ jsx6("span", {
2761
2760
  className: "skippr:text-[10px] skippr:font-mono skippr:text-primary-foreground",
2762
2761
  children: formatTime(elapsed)
2763
2762
  })
2764
2763
  ]
2765
2764
  }),
2766
- minimizable && /* @__PURE__ */ jsx5("button", {
2765
+ minimizable && /* @__PURE__ */ jsx6("button", {
2767
2766
  type: "button",
2768
2767
  onClick: minimizePanel,
2769
2768
  "aria-label": "Minimize",
2770
2769
  className: "skippr:flex skippr:size-6 skippr:cursor-pointer skippr:items-center skippr:justify-center skippr:rounded-md skippr:text-primary-foreground/70 skippr:transition-colors skippr:hover:bg-primary-foreground/10 skippr:hover:text-primary-foreground",
2771
- children: /* @__PURE__ */ jsx5(Minimize2, {
2770
+ children: /* @__PURE__ */ jsx6(Minimize2, {
2772
2771
  className: "skippr:size-3.5"
2773
2772
  })
2774
2773
  })
@@ -2779,7 +2778,7 @@ function ChatHeader() {
2779
2778
  }
2780
2779
 
2781
2780
  // src/components/LoadingDots.tsx
2782
- import { jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
2781
+ import { jsx as jsx7, jsxs as jsxs6 } from "react/jsx-runtime";
2783
2782
  function LoadingDots({ label }) {
2784
2783
  return /* @__PURE__ */ jsxs6("div", {
2785
2784
  className: "skippr:flex skippr:items-center skippr:gap-2 skippr:py-4",
@@ -2787,18 +2786,18 @@ function LoadingDots({ label }) {
2787
2786
  /* @__PURE__ */ jsxs6("div", {
2788
2787
  className: "skippr:flex skippr:gap-1",
2789
2788
  children: [
2790
- /* @__PURE__ */ jsx6("span", {
2789
+ /* @__PURE__ */ jsx7("span", {
2791
2790
  className: "skippr:size-1.5 skippr:rounded-full skippr:bg-muted-foreground/40 skippr:animate-bounce skippr:[animation-delay:0ms]"
2792
2791
  }),
2793
- /* @__PURE__ */ jsx6("span", {
2792
+ /* @__PURE__ */ jsx7("span", {
2794
2793
  className: "skippr:size-1.5 skippr:rounded-full skippr:bg-muted-foreground/40 skippr:animate-bounce skippr:[animation-delay:150ms]"
2795
2794
  }),
2796
- /* @__PURE__ */ jsx6("span", {
2795
+ /* @__PURE__ */ jsx7("span", {
2797
2796
  className: "skippr:size-1.5 skippr:rounded-full skippr:bg-muted-foreground/40 skippr:animate-bounce skippr:[animation-delay:300ms]"
2798
2797
  })
2799
2798
  ]
2800
2799
  }),
2801
- /* @__PURE__ */ jsx6("p", {
2800
+ /* @__PURE__ */ jsx7("p", {
2802
2801
  className: "skippr:text-xs skippr:text-muted-foreground",
2803
2802
  children: label
2804
2803
  })
@@ -2807,11 +2806,11 @@ function LoadingDots({ label }) {
2807
2806
  }
2808
2807
 
2809
2808
  // src/components/LoginFlow.tsx
2810
- import { useCallback as useCallback7, useEffect as useEffect12, useRef as useRef6, useState as useState8 } from "react";
2809
+ import { useCallback as useCallback7, useEffect as useEffect12, useRef as useRef7, useState as useState9 } from "react";
2811
2810
 
2812
2811
  // src/components/ui/button.tsx
2813
2812
  import { forwardRef as forwardRef3 } from "react";
2814
- import { jsx as jsx7 } from "react/jsx-runtime";
2813
+ import { jsx as jsx8 } from "react/jsx-runtime";
2815
2814
  var variantClasses = {
2816
2815
  default: "skippr:bg-primary skippr:text-primary-foreground skippr:hover:bg-primary/90",
2817
2816
  destructive: "skippr:bg-destructive skippr:text-white skippr:hover:bg-destructive/90",
@@ -2830,7 +2829,7 @@ var sizeClasses = {
2830
2829
  "icon-lg": "skippr:size-10"
2831
2830
  };
2832
2831
  var Button = forwardRef3(({ className, variant = "default", size = "default", ...props }, ref) => {
2833
- return /* @__PURE__ */ jsx7("button", {
2832
+ return /* @__PURE__ */ jsx8("button", {
2834
2833
  className: cn("skippr:inline-flex skippr:items-center skippr:justify-center skippr:gap-2 skippr:whitespace-nowrap skippr:rounded-md skippr:text-sm skippr:font-medium skippr:ring-offset-background skippr:transition-all skippr:cursor-pointer skippr:focus-visible:outline-none skippr:focus-visible:ring-2 skippr:focus-visible:ring-ring skippr:focus-visible:ring-offset-2 skippr:disabled:pointer-events-none skippr:disabled:opacity-50 skippr:shrink-0 skippr:[&_svg]:pointer-events-none skippr:[&_svg:not([class*='size-'])]:size-4 skippr:[&_svg]:shrink-0", variantClasses[variant], sizeClasses[size], className),
2835
2834
  ref,
2836
2835
  ...props
@@ -2839,12 +2838,12 @@ var Button = forwardRef3(({ className, variant = "default", size = "default", ..
2839
2838
  Button.displayName = "Button";
2840
2839
 
2841
2840
  // src/components/LoginFlow.tsx
2842
- import { jsx as jsx8, jsxs as jsxs7 } from "react/jsx-runtime";
2841
+ import { jsx as jsx9, jsxs as jsxs7 } from "react/jsx-runtime";
2843
2842
  var OTP_LENGTH = 6;
2844
2843
  var DIGIT_KEYS = ["d0", "d1", "d2", "d3", "d4", "d5"];
2845
2844
  function LoginFlow({ requestOtp, verifyOtp, error, isSubmitting }) {
2846
- const [step, setStep] = useState8("email");
2847
- const [email, setEmail] = useState8("");
2845
+ const [step, setStep] = useState9("email");
2846
+ const [email, setEmail] = useState9("");
2848
2847
  const handleRequestOtp = useCallback7(async (emailValue) => {
2849
2848
  const success = await requestOtp(emailValue);
2850
2849
  if (success)
@@ -2860,7 +2859,7 @@ function LoginFlow({ requestOtp, verifyOtp, error, isSubmitting }) {
2860
2859
  await requestOtp(email);
2861
2860
  }, [requestOtp, email]);
2862
2861
  if (step === "otp") {
2863
- return /* @__PURE__ */ jsx8(OtpStep, {
2862
+ return /* @__PURE__ */ jsx9(OtpStep, {
2864
2863
  email,
2865
2864
  onSubmit: handleVerifyOtp,
2866
2865
  onResend: handleResend,
@@ -2869,7 +2868,7 @@ function LoginFlow({ requestOtp, verifyOtp, error, isSubmitting }) {
2869
2868
  isSubmitting
2870
2869
  });
2871
2870
  }
2872
- return /* @__PURE__ */ jsx8(EmailStep, {
2871
+ return /* @__PURE__ */ jsx9(EmailStep, {
2873
2872
  email,
2874
2873
  onEmailChange: setEmail,
2875
2874
  onSubmit: handleRequestOtp,
@@ -2889,14 +2888,14 @@ function EmailStep({ email, onEmailChange, onSubmit, error, isSubmitting }) {
2889
2888
  /* @__PURE__ */ jsxs7("div", {
2890
2889
  className: "skippr:mb-4 skippr:text-center",
2891
2890
  children: [
2892
- /* @__PURE__ */ jsx8(Mail, {
2891
+ /* @__PURE__ */ jsx9(Mail, {
2893
2892
  className: "skippr:mx-auto skippr:mb-2 skippr:size-6 skippr:text-primary"
2894
2893
  }),
2895
- /* @__PURE__ */ jsx8("p", {
2894
+ /* @__PURE__ */ jsx9("p", {
2896
2895
  className: "skippr:text-sm skippr:font-medium skippr:text-foreground",
2897
2896
  children: "Sign in to continue"
2898
2897
  }),
2899
- /* @__PURE__ */ jsx8("p", {
2898
+ /* @__PURE__ */ jsx9("p", {
2900
2899
  className: "skippr:mt-1 skippr:text-xs skippr:text-muted-foreground",
2901
2900
  children: "Your email will be used to identify you across sessions"
2902
2901
  })
@@ -2906,7 +2905,7 @@ function EmailStep({ email, onEmailChange, onSubmit, error, isSubmitting }) {
2906
2905
  onSubmit: handleSubmit,
2907
2906
  className: "skippr:flex skippr:flex-col skippr:gap-3",
2908
2907
  children: [
2909
- /* @__PURE__ */ jsx8("input", {
2908
+ /* @__PURE__ */ jsx9("input", {
2910
2909
  type: "email",
2911
2910
  placeholder: "you@example.com",
2912
2911
  value: email,
@@ -2915,15 +2914,15 @@ function EmailStep({ email, onEmailChange, onSubmit, error, isSubmitting }) {
2915
2914
  required: true,
2916
2915
  className: "skippr:w-full skippr:rounded-md skippr:border skippr:border-border skippr:bg-background skippr:px-3 skippr:py-2 skippr:text-sm skippr:text-foreground skippr:placeholder-muted-foreground skippr:outline-none focus:skippr:ring-2 focus:skippr:ring-primary/30 focus:skippr:border-primary disabled:skippr:opacity-50"
2917
2916
  }),
2918
- /* @__PURE__ */ jsx8(Button, {
2917
+ /* @__PURE__ */ jsx9(Button, {
2919
2918
  type: "submit",
2920
2919
  disabled: isSubmitting || !email.trim(),
2921
2920
  className: "skippr:w-full",
2922
- children: isSubmitting ? /* @__PURE__ */ jsx8(LoaderCircle, {
2921
+ children: isSubmitting ? /* @__PURE__ */ jsx9(LoaderCircle, {
2923
2922
  className: "skippr:size-4 skippr:animate-spin"
2924
2923
  }) : "Continue"
2925
2924
  }),
2926
- error && /* @__PURE__ */ jsx8("p", {
2925
+ error && /* @__PURE__ */ jsx9("p", {
2927
2926
  className: "skippr:text-xs skippr:text-center skippr:text-destructive",
2928
2927
  children: error
2929
2928
  })
@@ -2933,10 +2932,10 @@ function EmailStep({ email, onEmailChange, onSubmit, error, isSubmitting }) {
2933
2932
  });
2934
2933
  }
2935
2934
  function OtpStep({ email, onSubmit, onResend, onBack, error, isSubmitting }) {
2936
- const [digits, setDigits] = useState8(Array(OTP_LENGTH).fill(""));
2937
- const [resendCooldown, setResendCooldown] = useState8(0);
2938
- const inputRefs = useRef6([]);
2939
- const submittedRef = useRef6(false);
2935
+ const [digits, setDigits] = useState9(Array(OTP_LENGTH).fill(""));
2936
+ const [resendCooldown, setResendCooldown] = useState9(0);
2937
+ const inputRefs = useRef7([]);
2938
+ const submittedRef = useRef7(false);
2940
2939
  useEffect12(() => {
2941
2940
  inputRefs.current[0]?.focus();
2942
2941
  }, []);
@@ -3009,7 +3008,7 @@ function OtpStep({ email, onSubmit, onResend, onBack, error, isSubmitting }) {
3009
3008
  /* @__PURE__ */ jsxs7("div", {
3010
3009
  className: "skippr:mb-4 skippr:text-center",
3011
3010
  children: [
3012
- /* @__PURE__ */ jsx8("p", {
3011
+ /* @__PURE__ */ jsx9("p", {
3013
3012
  className: "skippr:text-sm skippr:font-medium skippr:text-foreground",
3014
3013
  children: "Enter verification code"
3015
3014
  }),
@@ -3018,7 +3017,7 @@ function OtpStep({ email, onSubmit, onResend, onBack, error, isSubmitting }) {
3018
3017
  children: [
3019
3018
  "We sent a 6-digit code to",
3020
3019
  " ",
3021
- /* @__PURE__ */ jsx8("span", {
3020
+ /* @__PURE__ */ jsx9("span", {
3022
3021
  className: "skippr:font-medium skippr:text-foreground",
3023
3022
  children: email
3024
3023
  })
@@ -3030,9 +3029,9 @@ function OtpStep({ email, onSubmit, onResend, onBack, error, isSubmitting }) {
3030
3029
  onSubmit: handleSubmit,
3031
3030
  className: "skippr:flex skippr:flex-col skippr:gap-3",
3032
3031
  children: [
3033
- /* @__PURE__ */ jsx8("div", {
3032
+ /* @__PURE__ */ jsx9("div", {
3034
3033
  className: "skippr:flex skippr:justify-center skippr:gap-1.5",
3035
- children: digits.map((digit, index2) => /* @__PURE__ */ jsx8("input", {
3034
+ children: digits.map((digit, index2) => /* @__PURE__ */ jsx9("input", {
3036
3035
  ref: (el) => {
3037
3036
  inputRefs.current[index2] = el;
3038
3037
  },
@@ -3047,29 +3046,29 @@ function OtpStep({ email, onSubmit, onResend, onBack, error, isSubmitting }) {
3047
3046
  className: "skippr:h-10 skippr:w-10 skippr:rounded-md skippr:border skippr:border-border skippr:bg-background skippr:text-center skippr:text-sm skippr:font-semibold skippr:text-foreground skippr:outline-none focus:skippr:ring-2 focus:skippr:ring-primary/30 focus:skippr:border-primary disabled:skippr:opacity-50"
3048
3047
  }, DIGIT_KEYS[index2]))
3049
3048
  }),
3050
- error && /* @__PURE__ */ jsx8("p", {
3049
+ error && /* @__PURE__ */ jsx9("p", {
3051
3050
  className: "skippr:text-xs skippr:text-center skippr:text-destructive",
3052
3051
  children: error
3053
3052
  }),
3054
- /* @__PURE__ */ jsx8(Button, {
3053
+ /* @__PURE__ */ jsx9(Button, {
3055
3054
  type: "submit",
3056
3055
  disabled: isSubmitting || digits.join("").length !== OTP_LENGTH,
3057
3056
  className: "skippr:w-full",
3058
- children: isSubmitting ? /* @__PURE__ */ jsx8(LoaderCircle, {
3057
+ children: isSubmitting ? /* @__PURE__ */ jsx9(LoaderCircle, {
3059
3058
  className: "skippr:size-4 skippr:animate-spin"
3060
3059
  }) : "Verify"
3061
3060
  }),
3062
3061
  /* @__PURE__ */ jsxs7("div", {
3063
3062
  className: "skippr:flex skippr:items-center skippr:justify-between skippr:text-xs",
3064
3063
  children: [
3065
- /* @__PURE__ */ jsx8("button", {
3064
+ /* @__PURE__ */ jsx9("button", {
3066
3065
  type: "button",
3067
3066
  onClick: onBack,
3068
3067
  disabled: isSubmitting,
3069
3068
  className: "skippr:text-muted-foreground hover:skippr:text-foreground skippr:transition-colors disabled:skippr:opacity-50",
3070
3069
  children: "Change email"
3071
3070
  }),
3072
- /* @__PURE__ */ jsx8("button", {
3071
+ /* @__PURE__ */ jsx9("button", {
3073
3072
  type: "button",
3074
3073
  onClick: handleResend,
3075
3074
  disabled: isSubmitting || resendCooldown > 0,
@@ -3085,7 +3084,7 @@ function OtpStep({ email, onSubmit, onResend, onBack, error, isSubmitting }) {
3085
3084
  }
3086
3085
 
3087
3086
  // src/components/MeetingControls.tsx
3088
- import { jsx as jsx9, jsxs as jsxs8, Fragment as Fragment3 } from "react/jsx-runtime";
3087
+ import { jsx as jsx10, jsxs as jsxs8, Fragment as Fragment4 } from "react/jsx-runtime";
3089
3088
  var CONTROL_BUTTON2 = "skippr:flex skippr:size-11 skippr:cursor-pointer skippr:items-center skippr:justify-center skippr:rounded-full skippr:transition-colors skippr:disabled:cursor-not-allowed skippr:disabled:opacity-60";
3090
3089
  var MUTED_BUTTON = "skippr:bg-muted skippr:text-foreground skippr:hover:bg-muted/80";
3091
3090
  function MeetingControls({
@@ -3104,62 +3103,62 @@ function MeetingControls({
3104
3103
  /* @__PURE__ */ jsxs8("div", {
3105
3104
  className: "skippr:flex skippr:items-center skippr:justify-center skippr:gap-3",
3106
3105
  children: [
3107
- !showPaused && /* @__PURE__ */ jsxs8(Fragment3, {
3106
+ !showPaused && /* @__PURE__ */ jsxs8(Fragment4, {
3108
3107
  children: [
3109
- /* @__PURE__ */ jsx9("button", {
3108
+ /* @__PURE__ */ jsx10("button", {
3110
3109
  type: "button",
3111
3110
  onClick: toggleMute,
3112
3111
  "aria-label": isMuted ? "Unmute" : "Mute",
3113
3112
  className: cn(CONTROL_BUTTON2, isMuted ? "skippr:bg-destructive/15 skippr:text-destructive skippr:hover:bg-destructive/25" : MUTED_BUTTON),
3114
- children: isMuted ? /* @__PURE__ */ jsx9(MicOff, {
3113
+ children: isMuted ? /* @__PURE__ */ jsx10(MicOff, {
3115
3114
  className: "skippr:size-5"
3116
- }) : /* @__PURE__ */ jsx9(Mic, {
3115
+ }) : /* @__PURE__ */ jsx10(Mic, {
3117
3116
  className: "skippr:size-5"
3118
3117
  })
3119
3118
  }),
3120
- showScreenShareToggle && /* @__PURE__ */ jsx9("button", {
3119
+ showScreenShareToggle && /* @__PURE__ */ jsx10("button", {
3121
3120
  type: "button",
3122
3121
  onClick: toggleScreenShare,
3123
3122
  "aria-label": isScreenSharing ? "Stop sharing screen" : "Share screen",
3124
3123
  className: cn(CONTROL_BUTTON2, isScreenSharing ? "skippr:bg-bubble skippr:text-white skippr:hover:brightness-110" : MUTED_BUTTON),
3125
- children: isScreenSharing ? /* @__PURE__ */ jsx9(MonitorOff, {
3124
+ children: isScreenSharing ? /* @__PURE__ */ jsx10(MonitorOff, {
3126
3125
  className: "skippr:size-5"
3127
- }) : /* @__PURE__ */ jsx9(Monitor, {
3126
+ }) : /* @__PURE__ */ jsx10(Monitor, {
3128
3127
  className: "skippr:size-5"
3129
3128
  })
3130
3129
  })
3131
3130
  ]
3132
3131
  }),
3133
- showPaused ? onResume && /* @__PURE__ */ jsx9("button", {
3132
+ showPaused ? onResume && /* @__PURE__ */ jsx10("button", {
3134
3133
  type: "button",
3135
3134
  onClick: onResume,
3136
3135
  disabled: isPausing,
3137
3136
  "aria-label": "Resume session",
3138
3137
  className: cn(CONTROL_BUTTON2, MUTED_BUTTON),
3139
- children: /* @__PURE__ */ jsx9(Play, {
3138
+ children: /* @__PURE__ */ jsx10(Play, {
3140
3139
  className: "skippr:size-5"
3141
3140
  })
3142
- }) : onPause && /* @__PURE__ */ jsx9("button", {
3141
+ }) : onPause && /* @__PURE__ */ jsx10("button", {
3143
3142
  type: "button",
3144
3143
  onClick: onPause,
3145
3144
  "aria-label": "Pause session",
3146
3145
  className: cn(CONTROL_BUTTON2, MUTED_BUTTON),
3147
- children: /* @__PURE__ */ jsx9(Pause, {
3146
+ children: /* @__PURE__ */ jsx10(Pause, {
3148
3147
  className: "skippr:size-5"
3149
3148
  })
3150
3149
  }),
3151
- /* @__PURE__ */ jsx9("button", {
3150
+ /* @__PURE__ */ jsx10("button", {
3152
3151
  type: "button",
3153
3152
  onClick: onHangUp,
3154
3153
  "aria-label": "End session",
3155
3154
  className: cn(CONTROL_BUTTON2, "skippr:bg-destructive skippr:text-destructive-foreground skippr:hover:bg-destructive/90"),
3156
- children: /* @__PURE__ */ jsx9(PhoneOff, {
3155
+ children: /* @__PURE__ */ jsx10(PhoneOff, {
3157
3156
  className: "skippr:size-5"
3158
3157
  })
3159
3158
  })
3160
3159
  ]
3161
3160
  }),
3162
- /* @__PURE__ */ jsx9("p", {
3161
+ /* @__PURE__ */ jsx10("p", {
3163
3162
  className: "skippr:mt-3 skippr:text-center skippr:text-[10px] skippr:text-muted-foreground",
3164
3163
  children: "Powered by Skippr"
3165
3164
  })
@@ -3168,15 +3167,15 @@ function MeetingControls({
3168
3167
  }
3169
3168
 
3170
3169
  // src/components/MessageList.tsx
3171
- import { useEffect as useEffect14, useRef as useRef8 } from "react";
3170
+ import { useEffect as useEffect14, useRef as useRef9 } from "react";
3172
3171
 
3173
3172
  // src/components/ChatInput.tsx
3174
- import { useEffect as useEffect13, useRef as useRef7, useState as useState9 } from "react";
3175
- import { jsx as jsx10, jsxs as jsxs9 } from "react/jsx-runtime";
3173
+ import { useEffect as useEffect13, useRef as useRef8, useState as useState10 } from "react";
3174
+ import { jsx as jsx11, jsxs as jsxs9 } from "react/jsx-runtime";
3176
3175
  var MAX_INPUT_HEIGHT = 60;
3177
3176
  function ChatInput({ sendChatMessage, isSendingChat, autoFocus = false }) {
3178
- const [inputText, setInputText] = useState9("");
3179
- const textareaRef = useRef7(null);
3177
+ const [inputText, setInputText] = useState10("");
3178
+ const textareaRef = useRef8(null);
3180
3179
  const canSend = inputText.trim().length > 0 && !isSendingChat;
3181
3180
  useEffect13(() => {
3182
3181
  if (autoFocus)
@@ -3209,13 +3208,13 @@ function ChatInput({ sendChatMessage, isSendingChat, autoFocus = false }) {
3209
3208
  handleSubmit(e);
3210
3209
  }
3211
3210
  }
3212
- return /* @__PURE__ */ jsx10("form", {
3211
+ return /* @__PURE__ */ jsx11("form", {
3213
3212
  onSubmit: handleSubmit,
3214
3213
  className: "skippr:border-t skippr:border-border skippr:p-3",
3215
3214
  children: /* @__PURE__ */ jsxs9("div", {
3216
3215
  className: "skippr:flex skippr:items-center skippr:gap-2 skippr:rounded-xl skippr:bg-background skippr:ring-1 skippr:ring-foreground/10 skippr:px-3 skippr:py-2",
3217
3216
  children: [
3218
- /* @__PURE__ */ jsx10("textarea", {
3217
+ /* @__PURE__ */ jsx11("textarea", {
3219
3218
  ref: textareaRef,
3220
3219
  rows: 1,
3221
3220
  value: inputText,
@@ -3225,12 +3224,12 @@ function ChatInput({ sendChatMessage, isSendingChat, autoFocus = false }) {
3225
3224
  className: "skippr:flex-1 skippr:resize-none skippr:overflow-y-auto skippr:bg-transparent skippr:text-sm skippr:leading-5 skippr:text-foreground skippr:placeholder:text-muted-foreground skippr:outline-none",
3226
3225
  style: { maxHeight: `${MAX_INPUT_HEIGHT}px` }
3227
3226
  }),
3228
- /* @__PURE__ */ jsx10("button", {
3227
+ /* @__PURE__ */ jsx11("button", {
3229
3228
  type: "submit",
3230
3229
  disabled: !canSend,
3231
3230
  "aria-label": "Send message",
3232
3231
  className: cn("skippr:flex skippr:size-8 skippr:shrink-0 skippr:items-center skippr:justify-center skippr:rounded-lg skippr:transition-colors", canSend ? "skippr:bg-primary skippr:text-primary-foreground skippr:hover:bg-primary/90" : "skippr:bg-muted-foreground/20 skippr:text-muted-foreground/60"),
3233
- children: /* @__PURE__ */ jsx10(Send, {
3232
+ children: /* @__PURE__ */ jsx11(Send, {
3234
3233
  className: "skippr:size-3.5"
3235
3234
  })
3236
3235
  })
@@ -3240,7 +3239,7 @@ function ChatInput({ sendChatMessage, isSendingChat, autoFocus = false }) {
3240
3239
  }
3241
3240
 
3242
3241
  // src/components/ChatMessage.tsx
3243
- import { jsx as jsx11, jsxs as jsxs10 } from "react/jsx-runtime";
3242
+ import { jsx as jsx12, jsxs as jsxs10 } from "react/jsx-runtime";
3244
3243
  function formatTimestamp(ts) {
3245
3244
  return new Date(ts).toLocaleTimeString("en-US", {
3246
3245
  hour: "numeric",
@@ -3253,20 +3252,20 @@ function ChatMessage({ message }) {
3253
3252
  return /* @__PURE__ */ jsxs10("div", {
3254
3253
  className: cn("skippr:flex skippr:gap-2", isAgent ? "skippr:items-start" : "skippr:justify-end"),
3255
3254
  children: [
3256
- isAgent && /* @__PURE__ */ jsx11("div", {
3255
+ isAgent && /* @__PURE__ */ jsx12("div", {
3257
3256
  className: "skippr:mt-0.5 skippr:flex skippr:size-7 skippr:shrink-0 skippr:items-center skippr:justify-center skippr:rounded-md skippr:bg-primary",
3258
- children: /* @__PURE__ */ jsx11(Sparkles, {
3257
+ children: /* @__PURE__ */ jsx12(Sparkles, {
3259
3258
  className: "skippr:size-3.5 skippr:text-primary-foreground"
3260
3259
  })
3261
3260
  }),
3262
3261
  /* @__PURE__ */ jsxs10("div", {
3263
3262
  className: cn("skippr:flex skippr:max-w-[80%] skippr:flex-col", isAgent ? "skippr:items-start" : "skippr:items-end"),
3264
3263
  children: [
3265
- /* @__PURE__ */ jsx11("div", {
3264
+ /* @__PURE__ */ jsx12("div", {
3266
3265
  className: cn("skippr:rounded-2xl skippr:px-4 skippr:py-2.5 skippr:text-sm skippr:leading-relaxed", isAgent ? "skippr:border skippr:border-border skippr:bg-card skippr:text-foreground" : "skippr:bg-primary skippr:text-primary-foreground"),
3267
3266
  children: message.content
3268
3267
  }),
3269
- message.timestamp && /* @__PURE__ */ jsx11("span", {
3268
+ message.timestamp && /* @__PURE__ */ jsx12("span", {
3270
3269
  className: "skippr:mt-1 skippr:px-1 skippr:text-[10px] skippr:text-muted-foreground/60",
3271
3270
  children: formatTimestamp(message.timestamp)
3272
3271
  })
@@ -3277,33 +3276,33 @@ function ChatMessage({ message }) {
3277
3276
  }
3278
3277
 
3279
3278
  // src/components/TypingIndicator.tsx
3280
- import { jsx as jsx12, jsxs as jsxs11 } from "react/jsx-runtime";
3279
+ import { jsx as jsx13, jsxs as jsxs11 } from "react/jsx-runtime";
3281
3280
  function TypingIndicator() {
3282
3281
  return /* @__PURE__ */ jsxs11("div", {
3283
3282
  className: "skippr:flex skippr:items-start skippr:gap-2 skippr:animate-skippr-tab-fade",
3284
3283
  children: [
3285
- /* @__PURE__ */ jsx12("div", {
3284
+ /* @__PURE__ */ jsx13("div", {
3286
3285
  className: "skippr:mt-0.5 skippr:flex skippr:size-7 skippr:shrink-0 skippr:items-center skippr:justify-center skippr:rounded-md skippr:bg-primary",
3287
- children: /* @__PURE__ */ jsx12(Sparkles, {
3286
+ children: /* @__PURE__ */ jsx13(Sparkles, {
3288
3287
  className: "skippr:size-3.5 skippr:text-primary-foreground"
3289
3288
  })
3290
3289
  }),
3291
3290
  /* @__PURE__ */ jsxs11("div", {
3292
3291
  className: "skippr:inline-flex skippr:items-center skippr:gap-1 skippr:rounded-2xl skippr:border skippr:border-primary/20 skippr:bg-primary/10 skippr:px-4 skippr:py-2 skippr:text-xs skippr:text-primary",
3293
3292
  children: [
3294
- /* @__PURE__ */ jsx12("span", {
3293
+ /* @__PURE__ */ jsx13("span", {
3295
3294
  children: "Agent is analyzing your screen"
3296
3295
  }),
3297
3296
  /* @__PURE__ */ jsxs11("span", {
3298
3297
  className: "skippr:inline-flex skippr:items-center skippr:gap-[2px]",
3299
3298
  children: [
3300
- /* @__PURE__ */ jsx12("span", {
3299
+ /* @__PURE__ */ jsx13("span", {
3301
3300
  className: "skippr:size-1 skippr:rounded-full skippr:bg-primary skippr:animate-skippr-thinking-dot skippr:[animation-delay:0ms]"
3302
3301
  }),
3303
- /* @__PURE__ */ jsx12("span", {
3302
+ /* @__PURE__ */ jsx13("span", {
3304
3303
  className: "skippr:size-1 skippr:rounded-full skippr:bg-primary skippr:animate-skippr-thinking-dot skippr:[animation-delay:200ms]"
3305
3304
  }),
3306
- /* @__PURE__ */ jsx12("span", {
3305
+ /* @__PURE__ */ jsx13("span", {
3307
3306
  className: "skippr:size-1 skippr:rounded-full skippr:bg-primary skippr:animate-skippr-thinking-dot skippr:[animation-delay:400ms]"
3308
3307
  })
3309
3308
  ]
@@ -3315,7 +3314,7 @@ function TypingIndicator() {
3315
3314
  }
3316
3315
 
3317
3316
  // src/components/MessageList.tsx
3318
- import { jsx as jsx13, jsxs as jsxs12 } from "react/jsx-runtime";
3317
+ import { jsx as jsx14, jsxs as jsxs12 } from "react/jsx-runtime";
3319
3318
  function MessageList({
3320
3319
  messages,
3321
3320
  isStreaming,
@@ -3323,7 +3322,7 @@ function MessageList({
3323
3322
  isSendingChat,
3324
3323
  autoFocus = false
3325
3324
  }) {
3326
- const scrollRef = useRef8(null);
3325
+ const scrollRef = useRef9(null);
3327
3326
  const lastMessage = messages.length > 0 ? messages[messages.length - 1] : undefined;
3328
3327
  useEffect14(() => {
3329
3328
  scrollRef.current?.scrollIntoView({ behavior: "smooth" });
@@ -3335,19 +3334,19 @@ function MessageList({
3335
3334
  /* @__PURE__ */ jsxs12("div", {
3336
3335
  className: "skippr:min-h-0 skippr:flex-1 skippr:space-y-4 skippr:overflow-y-auto skippr:p-4",
3337
3336
  children: [
3338
- messages.length === 0 && !showTyping && /* @__PURE__ */ jsx13(LoadingDots, {
3337
+ messages.length === 0 && !showTyping && /* @__PURE__ */ jsx14(LoadingDots, {
3339
3338
  label: "Waiting for conversation to begin..."
3340
3339
  }),
3341
- messages.map((message) => /* @__PURE__ */ jsx13(ChatMessage, {
3340
+ messages.map((message) => /* @__PURE__ */ jsx14(ChatMessage, {
3342
3341
  message
3343
3342
  }, message.id)),
3344
- showTyping && /* @__PURE__ */ jsx13(TypingIndicator, {}),
3345
- /* @__PURE__ */ jsx13("div", {
3343
+ showTyping && /* @__PURE__ */ jsx14(TypingIndicator, {}),
3344
+ /* @__PURE__ */ jsx14("div", {
3346
3345
  ref: scrollRef
3347
3346
  })
3348
3347
  ]
3349
3348
  }),
3350
- /* @__PURE__ */ jsx13(ChatInput, {
3349
+ /* @__PURE__ */ jsx14(ChatInput, {
3351
3350
  sendChatMessage,
3352
3351
  isSendingChat,
3353
3352
  autoFocus
@@ -3357,8 +3356,8 @@ function MessageList({
3357
3356
  }
3358
3357
 
3359
3358
  // src/components/ModuleSelector.tsx
3360
- import { useEffect as useEffect15, useRef as useRef9, useState as useState10 } from "react";
3361
- import { jsx as jsx14, jsxs as jsxs13 } from "react/jsx-runtime";
3359
+ import { useEffect as useEffect15, useRef as useRef10, useState as useState11 } from "react";
3360
+ import { jsx as jsx15, jsxs as jsxs13 } from "react/jsx-runtime";
3362
3361
  var AGENT_TYPE_ICONS = {
3363
3362
  onboarding: UserPlus,
3364
3363
  demo: Rocket,
@@ -3380,9 +3379,9 @@ function ModuleSelector() {
3380
3379
  error
3381
3380
  } = useLiveAgent();
3382
3381
  const isBusy = isStarting || isDisconnecting;
3383
- const scrollRef = useRef9(null);
3384
- const [showScrollHint, setShowScrollHint] = useState10(false);
3385
- const [isScrolled, setIsScrolled] = useState10(false);
3382
+ const scrollRef = useRef10(null);
3383
+ const [showScrollHint, setShowScrollHint] = useState11(false);
3384
+ const [isScrolled, setIsScrolled] = useState11(false);
3386
3385
  useEffect15(() => {
3387
3386
  const el = scrollRef.current;
3388
3387
  if (!el)
@@ -3405,9 +3404,9 @@ function ModuleSelector() {
3405
3404
  };
3406
3405
  }, []);
3407
3406
  if (isLoadingModules && availableModules.length === 0) {
3408
- return /* @__PURE__ */ jsx14("div", {
3407
+ return /* @__PURE__ */ jsx15("div", {
3409
3408
  className: "skippr:flex skippr:flex-1 skippr:items-center skippr:justify-center skippr:p-6",
3410
- children: /* @__PURE__ */ jsx14(LoadingDots, {
3409
+ children: /* @__PURE__ */ jsx15(LoadingDots, {
3411
3410
  label: "Loading modules..."
3412
3411
  })
3413
3412
  });
@@ -3416,15 +3415,15 @@ function ModuleSelector() {
3416
3415
  return /* @__PURE__ */ jsxs13("div", {
3417
3416
  className: "skippr:flex skippr:flex-1 skippr:flex-col skippr:items-center skippr:justify-center skippr:gap-3 skippr:p-6 skippr:text-center",
3418
3417
  children: [
3419
- /* @__PURE__ */ jsx14("p", {
3418
+ /* @__PURE__ */ jsx15("p", {
3420
3419
  className: "skippr:text-sm skippr:text-foreground",
3421
3420
  children: "Couldn't load modules."
3422
3421
  }),
3423
- /* @__PURE__ */ jsx14("p", {
3422
+ /* @__PURE__ */ jsx15("p", {
3424
3423
  className: "skippr:text-xs skippr:text-muted-foreground",
3425
3424
  children: modulesError
3426
3425
  }),
3427
- /* @__PURE__ */ jsx14("button", {
3426
+ /* @__PURE__ */ jsx15("button", {
3428
3427
  type: "button",
3429
3428
  onClick: () => void refetchModules(),
3430
3429
  className: "skippr:cursor-pointer skippr:rounded-lg skippr:bg-foreground skippr:px-3 skippr:py-1.5 skippr:text-xs skippr:font-medium skippr:text-background",
@@ -3434,9 +3433,9 @@ function ModuleSelector() {
3434
3433
  });
3435
3434
  }
3436
3435
  if (availableModules.length === 0) {
3437
- return /* @__PURE__ */ jsx14("div", {
3436
+ return /* @__PURE__ */ jsx15("div", {
3438
3437
  className: "skippr:flex skippr:flex-1 skippr:items-center skippr:justify-center skippr:p-6 skippr:text-center",
3439
- children: /* @__PURE__ */ jsx14("p", {
3438
+ children: /* @__PURE__ */ jsx15("p", {
3440
3439
  className: "skippr:text-sm skippr:text-muted-foreground",
3441
3440
  children: "No experts available."
3442
3441
  })
@@ -3449,19 +3448,19 @@ function ModuleSelector() {
3449
3448
  ref: scrollRef,
3450
3449
  className: "skippr-no-scrollbar skippr:flex-1 skippr:overflow-y-auto",
3451
3450
  children: [
3452
- /* @__PURE__ */ jsx14("h3", {
3451
+ /* @__PURE__ */ jsx15("h3", {
3453
3452
  className: `skippr:sticky skippr:top-0 skippr:z-10 skippr:bg-background skippr:px-4 skippr:py-3 skippr:text-xs skippr:font-medium skippr:uppercase skippr:tracking-wider skippr:text-muted-foreground skippr:transition-shadow ${isScrolled ? "skippr:border-b skippr:border-border" : ""}`,
3454
3453
  children: "Choose an agent"
3455
3454
  }),
3456
3455
  /* @__PURE__ */ jsxs13("div", {
3457
3456
  className: "skippr:px-4 skippr:pt-3 skippr:pb-5",
3458
3457
  children: [
3459
- error && /* @__PURE__ */ jsx14("div", {
3458
+ error && /* @__PURE__ */ jsx15("div", {
3460
3459
  role: "alert",
3461
3460
  className: "skippr:mb-3 skippr:rounded-lg skippr:border skippr:border-destructive/20 skippr:bg-destructive/10 skippr:px-3 skippr:py-2 skippr:text-xs skippr:text-destructive",
3462
3461
  children: error
3463
3462
  }),
3464
- /* @__PURE__ */ jsx14("div", {
3463
+ /* @__PURE__ */ jsx15("div", {
3465
3464
  className: "skippr:grid skippr:grid-cols-2 skippr:gap-2.5",
3466
3465
  children: availableModules.map((module, index2) => {
3467
3466
  const isFeatured = index2 === 0;
@@ -3479,9 +3478,9 @@ function ModuleSelector() {
3479
3478
  onClick: () => selectModule(module.id),
3480
3479
  className: `${base} ${layout} ${variant} ${span}`,
3481
3480
  children: [
3482
- /* @__PURE__ */ jsx14("div", {
3481
+ /* @__PURE__ */ jsx15("div", {
3483
3482
  className: isFeatured ? "skippr:flex skippr:h-9 skippr:w-9 skippr:shrink-0 skippr:items-center skippr:justify-center skippr:rounded-lg skippr:bg-primary-foreground/15" : "skippr:flex skippr:h-9 skippr:w-9 skippr:shrink-0 skippr:items-center skippr:justify-center skippr:rounded-lg skippr:bg-muted",
3484
- children: /* @__PURE__ */ jsx14(Icon2, {
3483
+ children: /* @__PURE__ */ jsx15(Icon2, {
3485
3484
  className: isFeatured ? "skippr:h-4 skippr:w-4" : "skippr:h-4 skippr:w-4 skippr:text-muted-foreground"
3486
3485
  })
3487
3486
  }),
@@ -3491,14 +3490,14 @@ function ModuleSelector() {
3491
3490
  /* @__PURE__ */ jsxs13("div", {
3492
3491
  className: "skippr:flex skippr:items-center skippr:gap-1.5",
3493
3492
  children: [
3494
- /* @__PURE__ */ jsx14("p", {
3493
+ /* @__PURE__ */ jsx15("p", {
3495
3494
  className: "skippr:line-clamp-1 skippr:text-sm skippr:font-semibold",
3496
3495
  children: module.name
3497
3496
  }),
3498
3497
  sessionState === "resume" && /* @__PURE__ */ jsxs13("span", {
3499
3498
  className: `skippr:inline-flex skippr:shrink-0 skippr:items-center skippr:gap-0.5 skippr:rounded-full skippr:px-1.5 skippr:py-0.5 skippr:text-[9px] skippr:font-medium skippr:uppercase skippr:tracking-wide ${isFeatured ? "skippr:bg-primary-foreground/20 skippr:text-primary-foreground" : "skippr:bg-bubble/15 skippr:text-bubble"}`,
3500
3499
  children: [
3501
- /* @__PURE__ */ jsx14(Play, {
3500
+ /* @__PURE__ */ jsx15(Play, {
3502
3501
  className: "skippr:size-2.5"
3503
3502
  }),
3504
3503
  "Resume"
@@ -3507,7 +3506,7 @@ function ModuleSelector() {
3507
3506
  sessionState === "completed" && /* @__PURE__ */ jsxs13("span", {
3508
3507
  className: "skippr:inline-flex skippr:shrink-0 skippr:items-center skippr:gap-0.5 skippr:rounded-full skippr:bg-muted skippr:px-1.5 skippr:py-0.5 skippr:text-[9px] skippr:font-medium skippr:uppercase skippr:tracking-wide skippr:text-muted-foreground",
3509
3508
  children: [
3510
- /* @__PURE__ */ jsx14(CircleCheck, {
3509
+ /* @__PURE__ */ jsx15(CircleCheck, {
3511
3510
  className: "skippr:size-2.5"
3512
3511
  }),
3513
3512
  "Completed"
@@ -3516,7 +3515,7 @@ function ModuleSelector() {
3516
3515
  sessionState === "expired" && /* @__PURE__ */ jsxs13("span", {
3517
3516
  className: "skippr:inline-flex skippr:shrink-0 skippr:items-center skippr:gap-0.5 skippr:rounded-full skippr:bg-muted skippr:px-1.5 skippr:py-0.5 skippr:text-[9px] skippr:font-medium skippr:uppercase skippr:tracking-wide skippr:text-muted-foreground",
3518
3517
  children: [
3519
- /* @__PURE__ */ jsx14(Clock, {
3518
+ /* @__PURE__ */ jsx15(Clock, {
3520
3519
  className: "skippr:size-2.5"
3521
3520
  }),
3522
3521
  "Expired"
@@ -3524,7 +3523,7 @@ function ModuleSelector() {
3524
3523
  })
3525
3524
  ]
3526
3525
  }),
3527
- module.description && /* @__PURE__ */ jsx14("p", {
3526
+ module.description && /* @__PURE__ */ jsx15("p", {
3528
3527
  className: isFeatured ? "skippr:line-clamp-2 skippr:text-[11px] skippr:leading-snug skippr:text-primary-foreground/70" : "skippr:line-clamp-2 skippr:text-[11px] skippr:leading-snug skippr:text-muted-foreground",
3529
3528
  children: module.description
3530
3529
  })
@@ -3538,7 +3537,7 @@ function ModuleSelector() {
3538
3537
  })
3539
3538
  ]
3540
3539
  }),
3541
- showScrollHint && /* @__PURE__ */ jsx14("div", {
3540
+ showScrollHint && /* @__PURE__ */ jsx15("div", {
3542
3541
  className: "skippr:pointer-events-none skippr:absolute skippr:bottom-0 skippr:left-0 skippr:right-0 skippr:h-12 skippr:bg-gradient-to-t skippr:from-background skippr:to-transparent"
3543
3542
  })
3544
3543
  ]
@@ -3546,19 +3545,19 @@ function ModuleSelector() {
3546
3545
  }
3547
3546
 
3548
3547
  // src/components/SessionAgenda.tsx
3549
- import { jsx as jsx15, jsxs as jsxs14 } from "react/jsx-runtime";
3548
+ import { jsx as jsx16, jsxs as jsxs14 } from "react/jsx-runtime";
3550
3549
  function SessionAgenda({ phases, hasStarted }) {
3551
3550
  if (phases.length === 0 || !hasStarted) {
3552
- return /* @__PURE__ */ jsx15("div", {
3551
+ return /* @__PURE__ */ jsx16("div", {
3553
3552
  className: "skippr:flex skippr:flex-1 skippr:items-center skippr:justify-center",
3554
- children: /* @__PURE__ */ jsx15(LoadingDots, {
3553
+ children: /* @__PURE__ */ jsx16(LoadingDots, {
3555
3554
  label: "Waiting for agenda to load..."
3556
3555
  })
3557
3556
  });
3558
3557
  }
3559
- return /* @__PURE__ */ jsx15("div", {
3558
+ return /* @__PURE__ */ jsx16("div", {
3560
3559
  className: "skippr:flex-1 skippr:overflow-y-auto skippr:px-4 skippr:py-4",
3561
- children: /* @__PURE__ */ jsx15("div", {
3560
+ children: /* @__PURE__ */ jsx16("div", {
3562
3561
  className: "skippr:space-y-1",
3563
3562
  children: phases.map((phase) => {
3564
3563
  const isActive = phase.status === "active";
@@ -3566,29 +3565,29 @@ function SessionAgenda({ phases, hasStarted }) {
3566
3565
  return /* @__PURE__ */ jsxs14("div", {
3567
3566
  className: cn("skippr:flex skippr:items-start skippr:gap-2.5 skippr:rounded-lg skippr:p-2 skippr:transition-colors", isActive && "skippr:bg-primary/10"),
3568
3567
  children: [
3569
- /* @__PURE__ */ jsx15("div", {
3568
+ /* @__PURE__ */ jsx16("div", {
3570
3569
  className: "skippr:mt-0.5",
3571
- children: isCompleted ? /* @__PURE__ */ jsx15(CircleCheck, {
3570
+ children: isCompleted ? /* @__PURE__ */ jsx16(CircleCheck, {
3572
3571
  className: "skippr:size-4 skippr:text-chart-3"
3573
- }) : isActive ? /* @__PURE__ */ jsx15(Circle, {
3572
+ }) : isActive ? /* @__PURE__ */ jsx16(Circle, {
3574
3573
  className: "skippr:size-4 skippr:fill-primary/30 skippr:text-primary"
3575
- }) : /* @__PURE__ */ jsx15(Circle, {
3574
+ }) : /* @__PURE__ */ jsx16(Circle, {
3576
3575
  className: "skippr:size-4 skippr:text-muted-foreground/30"
3577
3576
  })
3578
3577
  }),
3579
3578
  /* @__PURE__ */ jsxs14("div", {
3580
3579
  className: "skippr:min-w-0 skippr:flex-1",
3581
3580
  children: [
3582
- /* @__PURE__ */ jsx15("p", {
3581
+ /* @__PURE__ */ jsx16("p", {
3583
3582
  className: cn("skippr:text-sm", isCompleted && "skippr:text-muted-foreground skippr:line-through", isActive && "skippr:font-medium skippr:text-foreground", phase.status === "pending" && "skippr:text-muted-foreground"),
3584
3583
  children: phase.name
3585
3584
  }),
3586
- phase.highlights.length > 0 && /* @__PURE__ */ jsx15("ul", {
3585
+ phase.highlights.length > 0 && /* @__PURE__ */ jsx16("ul", {
3587
3586
  className: "skippr:mt-1 skippr:space-y-0.5",
3588
3587
  children: phase.highlights.map((text) => /* @__PURE__ */ jsxs14("li", {
3589
3588
  className: cn("skippr:flex skippr:items-center skippr:gap-1.5 skippr:text-[11px] skippr:leading-tight", isCompleted ? "skippr:text-muted-foreground/40 skippr:line-through" : "skippr:text-muted-foreground/70"),
3590
3589
  children: [
3591
- /* @__PURE__ */ jsx15("span", {
3590
+ /* @__PURE__ */ jsx16("span", {
3592
3591
  className: "skippr:size-1 skippr:shrink-0 skippr:rounded-full skippr:bg-current"
3593
3592
  }),
3594
3593
  text
@@ -3605,12 +3604,12 @@ function SessionAgenda({ phases, hasStarted }) {
3605
3604
  }
3606
3605
 
3607
3606
  // src/components/SessionWarningBanner.tsx
3608
- import { jsx as jsx16 } from "react/jsx-runtime";
3607
+ import { jsx as jsx17 } from "react/jsx-runtime";
3609
3608
  var SESSION_WARNING_THRESHOLD_SECS = 60;
3610
3609
  function SessionWarningBanner({ remaining }) {
3611
3610
  if (remaining === null || remaining <= 0 || remaining > SESSION_WARNING_THRESHOLD_SECS)
3612
3611
  return null;
3613
- return /* @__PURE__ */ jsx16("div", {
3612
+ return /* @__PURE__ */ jsx17("div", {
3614
3613
  "data-testid": "session-warning-banner",
3615
3614
  className: "skippr:bg-red-50 skippr:px-4 skippr:py-1.5 skippr:text-center skippr:text-xs skippr:font-medium skippr:text-red-700",
3616
3615
  children: "Session ending soon"
@@ -3618,7 +3617,7 @@ function SessionWarningBanner({ remaining }) {
3618
3617
  }
3619
3618
 
3620
3619
  // src/components/StartSessionPrompt.tsx
3621
- import { jsx as jsx17, jsxs as jsxs15 } from "react/jsx-runtime";
3620
+ import { jsx as jsx18, jsxs as jsxs15 } from "react/jsx-runtime";
3622
3621
  var PROMPT_BUTTON = "skippr:cursor-pointer skippr:rounded-xl skippr:bg-primary skippr:px-8 skippr:py-3 skippr:text-sm skippr:font-medium skippr:text-primary-foreground skippr:transition-all skippr:hover:bg-primary/90 skippr:disabled:cursor-not-allowed skippr:disabled:opacity-60";
3623
3622
  function StartSessionPrompt({
3624
3623
  onStartSession,
@@ -3633,13 +3632,13 @@ function StartSessionPrompt({
3633
3632
  return /* @__PURE__ */ jsxs15("div", {
3634
3633
  className: "skippr:flex skippr:flex-1 skippr:flex-col skippr:items-center skippr:justify-center skippr:gap-3 skippr:px-4",
3635
3634
  children: [
3636
- canResume && onResume ? /* @__PURE__ */ jsx17("button", {
3635
+ canResume && onResume ? /* @__PURE__ */ jsx18("button", {
3637
3636
  type: "button",
3638
3637
  onClick: onResume,
3639
3638
  disabled: isStarting,
3640
3639
  className: PROMPT_BUTTON,
3641
3640
  children: isStarting ? "Resuming..." : "Resume session"
3642
- }) : /* @__PURE__ */ jsx17("button", {
3641
+ }) : /* @__PURE__ */ jsx18("button", {
3643
3642
  type: "button",
3644
3643
  onClick: () => {
3645
3644
  if (!agentId)
@@ -3650,7 +3649,7 @@ function StartSessionPrompt({
3650
3649
  className: PROMPT_BUTTON,
3651
3650
  children: isStarting ? "Starting..." : label
3652
3651
  }),
3653
- error && /* @__PURE__ */ jsx17("p", {
3652
+ error && /* @__PURE__ */ jsx18("p", {
3654
3653
  className: "skippr:text-xs skippr:text-destructive",
3655
3654
  children: error
3656
3655
  })
@@ -3659,7 +3658,7 @@ function StartSessionPrompt({
3659
3658
  }
3660
3659
 
3661
3660
  // src/components/Sidebar.tsx
3662
- import { jsx as jsx18, jsxs as jsxs16, Fragment as Fragment4 } from "react/jsx-runtime";
3661
+ import { jsx as jsx19, jsxs as jsxs16, Fragment as Fragment5 } from "react/jsx-runtime";
3663
3662
  function Sidebar({
3664
3663
  hideControls = false,
3665
3664
  hideHeader = false,
@@ -3719,8 +3718,8 @@ function Sidebar({
3719
3718
  className: cn("skippr:fixed skippr:z-[9999]", "skippr:bg-card", "skippr:flex skippr:flex-col", "skippr:overflow-hidden", isFloating && "skippr:border skippr:border-border skippr:bottom-[88px] skippr:h-[min(460px,calc(100vh-200px))] skippr:rounded-2xl skippr:shadow-[0_8px_30px_rgba(0,0,0,0.16),0_4px_12px_rgba(0,0,0,0.08)]", isFloating && (position === "right" ? "skippr:right-6" : "skippr:left-6"), isFloating && "skippr:transition-[opacity,transform] skippr:duration-300 skippr:ease-in-out", isFloating && (position === "right" ? "skippr:origin-bottom-right" : "skippr:origin-bottom-left"), isFloating && !isPanelOpen && "skippr:scale-0 skippr:opacity-0 skippr:pointer-events-none", isFloating && isPanelOpen && "skippr:scale-100 skippr:opacity-100", isSidebar && "skippr:top-0 skippr:h-full", isSidebar && "skippr:transition-[width] skippr:duration-300 skippr:ease-in-out", isSidebar && position === "right" && "skippr:right-0 skippr:border-l skippr:border-l-border", isSidebar && position === "left" && "skippr:left-0 skippr:border-r skippr:border-r-border", isSidebar && !isPanelOpen && "skippr:w-0 skippr:border-0"),
3720
3719
  style: { width: isPanelOpen ? SIDEBAR_WIDTH : undefined },
3721
3720
  children: [
3722
- !hideHeader && /* @__PURE__ */ jsx18(ChatHeader, {}),
3723
- authFailed ? /* @__PURE__ */ jsx18(AuthError, {}) : isAuthenticated ? /* @__PURE__ */ jsx18(AuthenticatedContent, {
3721
+ !hideHeader && /* @__PURE__ */ jsx19(ChatHeader, {}),
3722
+ authFailed ? /* @__PURE__ */ jsx19(AuthError, {}) : isAuthenticated ? /* @__PURE__ */ jsx19(AuthenticatedContent, {
3724
3723
  isConnected,
3725
3724
  isPaused,
3726
3725
  isPausing,
@@ -3742,12 +3741,12 @@ function Sidebar({
3742
3741
  agentId,
3743
3742
  agentControls,
3744
3743
  showAgenda
3745
- }) : usesHostAuth || isValidating ? /* @__PURE__ */ jsx18("div", {
3744
+ }) : usesHostAuth || isValidating ? /* @__PURE__ */ jsx19("div", {
3746
3745
  className: "skippr:flex skippr:flex-1 skippr:items-center skippr:justify-center",
3747
- children: /* @__PURE__ */ jsx18(LoadingDots, {
3746
+ children: /* @__PURE__ */ jsx19(LoadingDots, {
3748
3747
  label: "Loading..."
3749
3748
  })
3750
- }) : /* @__PURE__ */ jsx18(LoginFlow, {
3749
+ }) : /* @__PURE__ */ jsx19(LoginFlow, {
3751
3750
  requestOtp,
3752
3751
  verifyOtp,
3753
3752
  error: authError,
@@ -3791,9 +3790,9 @@ function AuthenticatedContent({
3791
3790
  } else if (isPaused) {
3792
3791
  transitionLabel = "Paused";
3793
3792
  }
3794
- return /* @__PURE__ */ jsxs16(Fragment4, {
3793
+ return /* @__PURE__ */ jsxs16(Fragment5, {
3795
3794
  children: [
3796
- isConnected && /* @__PURE__ */ jsx18(ConnectedBanner, {}),
3795
+ isConnected && /* @__PURE__ */ jsx19(ConnectedBanner, {}),
3797
3796
  showTabBar && /* @__PURE__ */ jsxs16("div", {
3798
3797
  className: "skippr:flex skippr:items-center skippr:gap-2 skippr:border-b skippr:border-border skippr:px-3 skippr:py-2",
3799
3798
  children: [
@@ -3802,11 +3801,11 @@ function AuthenticatedContent({
3802
3801
  className: cn("skippr:relative skippr:inline-flex skippr:cursor-pointer skippr:items-center skippr:gap-1.5 skippr:rounded-lg skippr:px-3 skippr:py-2 skippr:text-sm skippr:font-medium skippr:transition-all", activeTab === "chat" ? "skippr:text-foreground" : "skippr:text-muted-foreground skippr:hover:text-foreground"),
3803
3802
  onClick: () => onTabChange("chat"),
3804
3803
  children: [
3805
- /* @__PURE__ */ jsx18(MessageCircle, {
3804
+ /* @__PURE__ */ jsx19(MessageCircle, {
3806
3805
  className: "skippr:size-3.5"
3807
3806
  }),
3808
3807
  "Chat",
3809
- activeTab === "chat" && /* @__PURE__ */ jsx18("span", {
3808
+ activeTab === "chat" && /* @__PURE__ */ jsx19("span", {
3810
3809
  className: "skippr:absolute skippr:-bottom-2 skippr:left-3 skippr:right-3 skippr:h-0.5 skippr:rounded-full skippr:bg-foreground"
3811
3810
  })
3812
3811
  ]
@@ -3816,38 +3815,38 @@ function AuthenticatedContent({
3816
3815
  className: cn("skippr:relative skippr:inline-flex skippr:cursor-pointer skippr:items-center skippr:gap-1.5 skippr:rounded-lg skippr:px-3 skippr:py-2 skippr:text-sm skippr:font-medium skippr:transition-all", activeTab === "agenda" ? "skippr:text-foreground" : "skippr:text-muted-foreground skippr:hover:text-foreground"),
3817
3816
  onClick: () => onTabChange("agenda"),
3818
3817
  children: [
3819
- /* @__PURE__ */ jsx18(Calendar, {
3818
+ /* @__PURE__ */ jsx19(Calendar, {
3820
3819
  className: "skippr:size-3.5"
3821
3820
  }),
3822
3821
  "Agenda",
3823
- activeTab === "agenda" && /* @__PURE__ */ jsx18("span", {
3822
+ activeTab === "agenda" && /* @__PURE__ */ jsx19("span", {
3824
3823
  className: "skippr:absolute skippr:-bottom-2 skippr:left-3 skippr:right-3 skippr:h-0.5 skippr:rounded-full skippr:bg-foreground"
3825
3824
  })
3826
3825
  ]
3827
3826
  })
3828
3827
  ]
3829
3828
  }),
3830
- /* @__PURE__ */ jsx18("div", {
3829
+ /* @__PURE__ */ jsx19("div", {
3831
3830
  className: "skippr:flex skippr:min-h-0 skippr:flex-1 skippr:flex-col",
3832
- children: isDisconnecting ? /* @__PURE__ */ jsx18("div", {
3831
+ children: isDisconnecting ? /* @__PURE__ */ jsx19("div", {
3833
3832
  className: "skippr:flex skippr:flex-1 skippr:items-center skippr:justify-center",
3834
- children: /* @__PURE__ */ jsx18(LoadingDots, {
3833
+ children: /* @__PURE__ */ jsx19(LoadingDots, {
3835
3834
  label: "Ending session..."
3836
3835
  })
3837
- }) : showSelectorAsPrompt ? /* @__PURE__ */ jsx18(ModuleSelector, {}) : inSession ? /* @__PURE__ */ jsxs16(Fragment4, {
3836
+ }) : showSelectorAsPrompt ? /* @__PURE__ */ jsx19(ModuleSelector, {}) : inSession ? /* @__PURE__ */ jsxs16(Fragment5, {
3838
3837
  children: [
3839
- transitionLabel && /* @__PURE__ */ jsx18("div", {
3838
+ transitionLabel && /* @__PURE__ */ jsx19("div", {
3840
3839
  className: "skippr:shrink-0 skippr:border-b skippr:border-border skippr:bg-muted/50 skippr:px-3 skippr:py-1.5 skippr:text-center skippr:text-xs skippr:text-muted-foreground",
3841
3840
  children: transitionLabel
3842
3841
  }),
3843
- /* @__PURE__ */ jsx18(ConnectedBody, {
3842
+ /* @__PURE__ */ jsx19(ConnectedBody, {
3844
3843
  activeTab: effectiveTab,
3845
3844
  autoFocusChat
3846
3845
  })
3847
3846
  ]
3848
- }) : /* @__PURE__ */ jsx18("div", {
3847
+ }) : /* @__PURE__ */ jsx19("div", {
3849
3848
  className: "skippr:flex skippr:min-h-0 skippr:flex-1 skippr:flex-col skippr:animate-skippr-tab-fade",
3850
- children: /* @__PURE__ */ jsx18(StartSessionPrompt, {
3849
+ children: /* @__PURE__ */ jsx19(StartSessionPrompt, {
3851
3850
  onStartSession,
3852
3851
  agentId,
3853
3852
  agentControls,
@@ -3859,7 +3858,7 @@ function AuthenticatedContent({
3859
3858
  })
3860
3859
  }, `${activeTab}-empty`)
3861
3860
  }),
3862
- (isConnected || isPaused) && !isDisconnecting && !hideControls && /* @__PURE__ */ jsx18(MeetingControls, {
3861
+ (isConnected || isPaused) && !isDisconnecting && !hideControls && /* @__PURE__ */ jsx19(MeetingControls, {
3863
3862
  onHangUp: onDisconnect,
3864
3863
  onPause,
3865
3864
  onResume,
@@ -3874,14 +3873,14 @@ function AuthError() {
3874
3873
  return /* @__PURE__ */ jsxs16("div", {
3875
3874
  className: "skippr:flex skippr:flex-1 skippr:flex-col skippr:items-center skippr:justify-center skippr:px-6 skippr:py-4 skippr:text-center",
3876
3875
  children: [
3877
- /* @__PURE__ */ jsx18(CircleAlert, {
3876
+ /* @__PURE__ */ jsx19(CircleAlert, {
3878
3877
  className: "skippr:mb-3 skippr:size-7 skippr:text-destructive"
3879
3878
  }),
3880
- /* @__PURE__ */ jsx18("p", {
3879
+ /* @__PURE__ */ jsx19("p", {
3881
3880
  className: "skippr:text-sm skippr:font-medium skippr:text-foreground",
3882
3881
  children: "We couldn't verify your session"
3883
3882
  }),
3884
- /* @__PURE__ */ jsx18("p", {
3883
+ /* @__PURE__ */ jsx19("p", {
3885
3884
  className: "skippr:mt-1 skippr:text-xs skippr:text-muted-foreground",
3886
3885
  children: "Please contact administrator."
3887
3886
  })
@@ -3890,7 +3889,7 @@ function AuthError() {
3890
3889
  }
3891
3890
  function ConnectedBanner() {
3892
3891
  const remaining = useSessionRemaining();
3893
- return /* @__PURE__ */ jsx18(SessionWarningBanner, {
3892
+ return /* @__PURE__ */ jsx19(SessionWarningBanner, {
3894
3893
  remaining
3895
3894
  });
3896
3895
  }
@@ -3901,17 +3900,17 @@ function ConnectedBody({
3901
3900
  const { allMessages, agentState, sendChatMessage, isSendingChat } = useCombinedMessages();
3902
3901
  const { phases } = usePhaseUpdates();
3903
3902
  if (activeTab === "agenda") {
3904
- return /* @__PURE__ */ jsx18("div", {
3903
+ return /* @__PURE__ */ jsx19("div", {
3905
3904
  className: "skippr:min-h-0 skippr:flex-1 skippr:overflow-y-auto skippr:animate-skippr-tab-fade",
3906
- children: /* @__PURE__ */ jsx18(SessionAgenda, {
3905
+ children: /* @__PURE__ */ jsx19(SessionAgenda, {
3907
3906
  phases,
3908
3907
  hasStarted: allMessages.length > 0 || agentState === "speaking"
3909
3908
  })
3910
3909
  }, "agenda");
3911
3910
  }
3912
- return /* @__PURE__ */ jsx18("div", {
3911
+ return /* @__PURE__ */ jsx19("div", {
3913
3912
  className: "skippr:flex skippr:min-h-0 skippr:flex-1 skippr:flex-col skippr:animate-skippr-tab-fade",
3914
- children: /* @__PURE__ */ jsx18(MessageList, {
3913
+ children: /* @__PURE__ */ jsx19(MessageList, {
3915
3914
  messages: allMessages,
3916
3915
  isStreaming: agentState === "speaking",
3917
3916
  sendChatMessage,
@@ -3922,28 +3921,28 @@ function ConnectedBody({
3922
3921
  }
3923
3922
 
3924
3923
  // src/components/SidebarTrigger.tsx
3925
- import { jsx as jsx19 } from "react/jsx-runtime";
3924
+ import { jsx as jsx20 } from "react/jsx-runtime";
3926
3925
  function SidebarTrigger() {
3927
3926
  const { isPanelOpen, togglePanel, minimizePanel, minimizable, position, isMinimized } = useLiveAgent();
3928
3927
  if (isMinimized)
3929
3928
  return null;
3930
3929
  const handleClick = isPanelOpen && minimizable ? minimizePanel : togglePanel;
3931
- return /* @__PURE__ */ jsx19("button", {
3930
+ return /* @__PURE__ */ jsx20("button", {
3932
3931
  type: "button",
3933
3932
  onClick: handleClick,
3934
3933
  title: isPanelOpen ? "Close chat" : "Open chat",
3935
3934
  "aria-label": isPanelOpen ? "Close chat" : "Open chat",
3936
- className: cn("skippr:fixed skippr:bottom-6 skippr:z-[9998]", "skippr:flex skippr:size-12 skippr:items-center skippr:justify-center", "skippr:rounded-[14px] skippr:bg-bubble skippr:text-white", "skippr:shadow-[0_4px_16px_rgba(45,43,61,0.45),0_2px_4px_rgba(0,0,0,0.1)] skippr:transition-all", "skippr:cursor-pointer skippr:hover:brightness-110 skippr:hover:-translate-y-0.5 skippr:active:translate-y-0", position === "right" ? "skippr:right-6" : "skippr:left-6"),
3937
- children: isPanelOpen ? /* @__PURE__ */ jsx19(ChevronDown, {
3935
+ className: cn("skippr:fixed skippr:bottom-6 skippr:z-[9998]", "skippr:flex skippr:size-12 skippr:items-center skippr:justify-center", "skippr:shadow-[0_4px_16px_rgba(45,43,61,0.45),0_2px_4px_rgba(0,0,0,0.1)] skippr:transition-all", "skippr:cursor-pointer skippr:hover:brightness-110 skippr:hover:-translate-y-0.5 skippr:active:translate-y-0", isPanelOpen ? "skippr:rounded-[14px] skippr:bg-bubble skippr:text-white" : "skippr:rounded-[10px] skippr:overflow-hidden", position === "right" ? "skippr:right-6" : "skippr:left-6"),
3936
+ children: isPanelOpen ? /* @__PURE__ */ jsx20(ChevronDown, {
3938
3937
  className: "skippr:size-5"
3939
- }) : /* @__PURE__ */ jsx19(Logo, {
3940
- className: "skippr:size-7"
3938
+ }) : /* @__PURE__ */ jsx20(Logo, {
3939
+ className: "skippr:size-12"
3941
3940
  })
3942
3941
  });
3943
3942
  }
3944
3943
 
3945
3944
  // src/components/LiveAgent.tsx
3946
- import { jsx as jsx20, jsxs as jsxs17 } from "react/jsx-runtime";
3945
+ import { jsx as jsx21, jsxs as jsxs17 } from "react/jsx-runtime";
3947
3946
  function LiveAgent(props) {
3948
3947
  const {
3949
3948
  agentId: hostAgentId,
@@ -3975,7 +3974,7 @@ function LiveAgent(props) {
3975
3974
  const usesHostAuth = !!getUserToken || !!userToken || !!authTokenProp;
3976
3975
  const effectiveAuthToken = usesHostAuth ? authTokenProp : auth.authToken ?? undefined;
3977
3976
  const hasModuleSelector = !hostAgentId;
3978
- const [activeModule, setActiveModule] = useState11(null);
3977
+ const [activeModule, setActiveModule] = useState12(null);
3979
3978
  const agentId = hasModuleSelector ? activeModule?.id ?? null : hostAgentId;
3980
3979
  const agentControls = hasModuleSelector ? activeModule?.controls : hostAgentControls;
3981
3980
  const minimizeOnSessionStart = useCallback8(() => {
@@ -4024,17 +4023,17 @@ function LiveAgent(props) {
4024
4023
  onStartError: expandOnSessionStartError,
4025
4024
  onDisconnect: minimizeOnSessionDisconnect
4026
4025
  });
4027
- const teardownInFlightRef = useRef10(false);
4026
+ const teardownInFlightRef = useRef11(false);
4028
4027
  teardownInFlightRef.current = isPaused || isPausing || isDisconnecting;
4029
4028
  const handleRoomDisconnected = useCallback8(() => {
4030
4029
  if (teardownInFlightRef.current)
4031
4030
  return;
4032
4031
  disconnect();
4033
4032
  }, [disconnect]);
4034
- const [isPanelOpen, setIsPanelOpen] = useState11(defaultOpen);
4035
- const [isMinimized, setIsMinimized] = useState11(minimizable && !defaultOpen);
4036
- const [sidebarTab, setSidebarTab] = useState11("agenda");
4037
- const [phasesSnapshot, setPhasesSnapshot] = useState11([]);
4033
+ const [isPanelOpen, setIsPanelOpen] = useState12(defaultOpen);
4034
+ const [isMinimized, setIsMinimized] = useState12(minimizable && !defaultOpen);
4035
+ const [sidebarTab, setSidebarTab] = useState12("agenda");
4036
+ const [phasesSnapshot, setPhasesSnapshot] = useState12([]);
4038
4037
  const {
4039
4038
  modules: availableModules,
4040
4039
  isLoading: isLoadingModules,
@@ -4074,9 +4073,9 @@ function LiveAgent(props) {
4074
4073
  existingSessionId: getResumableSessionId(found.currentSession, found.mode)
4075
4074
  });
4076
4075
  }, [availableModules, startSession]);
4077
- const [welcomeDismissed, setWelcomeDismissed] = useState11(false);
4076
+ const [welcomeDismissed, setWelcomeDismissed] = useState12(false);
4078
4077
  const dismissWelcome = useCallback8(() => setWelcomeDismissed(true), []);
4079
- const [currentPosition, setCurrentPosition] = useState11(() => {
4078
+ const [currentPosition, setCurrentPosition] = useState12(() => {
4080
4079
  try {
4081
4080
  const saved = localStorage.getItem("skippr_widget_position");
4082
4081
  if (saved === "left" || saved === "right")
@@ -4208,7 +4207,7 @@ function LiveAgent(props) {
4208
4207
  refetchModules,
4209
4208
  selectModule
4210
4209
  ]);
4211
- return /* @__PURE__ */ jsx20(LiveAgentContext.Provider, {
4210
+ return /* @__PURE__ */ jsx21(LiveAgentContext.Provider, {
4212
4211
  value: ctx,
4213
4212
  children: /* @__PURE__ */ jsxs17(LiveKitRoom, {
4214
4213
  serverUrl: connection?.livekitUrl,
@@ -4217,25 +4216,29 @@ function LiveAgent(props) {
4217
4216
  audio: true,
4218
4217
  onDisconnected: handleRoomDisconnected,
4219
4218
  children: [
4220
- connection && /* @__PURE__ */ jsx20(RoomAudioRenderer, {}),
4221
- connection && captureMode === "screenshare" && /* @__PURE__ */ jsx20(AutoStartMedia, {
4219
+ connection && /* @__PURE__ */ jsx21(RoomAudioRenderer, {}),
4220
+ connection && captureMode === "screenshare" && /* @__PURE__ */ jsx21(AutoStartMedia, {
4222
4221
  pendingScreenStream
4223
4222
  }),
4224
- connection && captureMode === "auto" && /* @__PURE__ */ jsx20(DomCapture, {}),
4225
- connection && captureMode === "auto" && agentControls?.highlight && /* @__PURE__ */ jsx20(HighlightOverlay, {}),
4226
- /* @__PURE__ */ jsxs17("div", {
4227
- id: WIDGET_ROOT_ID,
4223
+ connection && captureMode === "auto" && /* @__PURE__ */ jsx21(DomCapture, {}),
4224
+ /* @__PURE__ */ jsxs17(ShadowHost, {
4228
4225
  children: [
4229
- isMinimized && /* @__PURE__ */ jsx20(MinimizedBubble, {
4230
- welcomeMessage,
4231
- welcomeDismissed,
4232
- onDismissWelcome: dismissWelcome
4233
- }),
4234
- /* @__PURE__ */ jsx20(SidebarTrigger, {}),
4235
- /* @__PURE__ */ jsx20(Sidebar, {
4236
- hideControls,
4237
- hideHeader,
4238
- startSessionLabel
4226
+ connection && captureMode === "auto" && agentControls?.highlight && /* @__PURE__ */ jsx21(HighlightOverlay, {}),
4227
+ /* @__PURE__ */ jsxs17("div", {
4228
+ id: WIDGET_ROOT_ID,
4229
+ children: [
4230
+ isMinimized && /* @__PURE__ */ jsx21(MinimizedBubble, {
4231
+ welcomeMessage,
4232
+ welcomeDismissed,
4233
+ onDismissWelcome: dismissWelcome
4234
+ }),
4235
+ /* @__PURE__ */ jsx21(SidebarTrigger, {}),
4236
+ /* @__PURE__ */ jsx21(Sidebar, {
4237
+ hideControls,
4238
+ hideHeader,
4239
+ startSessionLabel
4240
+ })
4241
+ ]
4239
4242
  })
4240
4243
  ]
4241
4244
  }),