@usecrow/ui 0.1.7 → 0.1.9
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs +333 -273
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +145 -11
- package/dist/index.d.ts +145 -11
- package/dist/index.js +328 -273
- package/dist/index.js.map +1 -1
- package/package.json +2 -2
package/dist/index.cjs
CHANGED
|
@@ -3,6 +3,7 @@
|
|
|
3
3
|
var React3 = require('react');
|
|
4
4
|
var framerMotion = require('framer-motion');
|
|
5
5
|
var jsxRuntime = require('react/jsx-runtime');
|
|
6
|
+
var reactDom = require('react-dom');
|
|
6
7
|
var lucideReact = require('lucide-react');
|
|
7
8
|
var ReactMarkdown = require('react-markdown');
|
|
8
9
|
var TooltipPrimitive = require('@radix-ui/react-tooltip');
|
|
@@ -32,26 +33,6 @@ var React3__default = /*#__PURE__*/_interopDefault(React3);
|
|
|
32
33
|
var ReactMarkdown__default = /*#__PURE__*/_interopDefault(ReactMarkdown);
|
|
33
34
|
var TooltipPrimitive__namespace = /*#__PURE__*/_interopNamespace(TooltipPrimitive);
|
|
34
35
|
|
|
35
|
-
// src/styles/inject.ts
|
|
36
|
-
var STYLE_ID = "crow-ui-styles";
|
|
37
|
-
var CSS_CONTENT = `*,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }
|
|
38
|
-
|
|
39
|
-
/*! tailwindcss v3.4.19 | MIT License | https://tailwindcss.com*/*,:after,:before{box-sizing:border-box;border:0 solid #e5e7eb}:after,:before{--tw-content:""}:host,html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}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;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}.crow-pointer-events-none{pointer-events:none}.crow-pointer-events-auto{pointer-events:auto}.crow-fixed{position:fixed}.crow-absolute{position:absolute}.crow-relative{position:relative}.crow-sticky{position:sticky}.crow-bottom-0{bottom:0}.crow-bottom-full{bottom:100%}.crow-left-0{left:0}.crow-right-0{right:0}.crow-top-0{top:0}.crow-z-50{z-index:50}.crow-z-\\[999999\\]{z-index:999999}.crow-m-0{margin:0}.crow-my-1{margin-top:.25rem}.crow-mb-1,.crow-my-1{margin-bottom:.25rem}.crow-mb-2{margin-bottom:.5rem}.crow-mb-3{margin-bottom:.75rem}.crow-ml-0{margin-left:0}.crow-ml-0\\.5{margin-left:.125rem}.crow-ml-2{margin-left:.5rem}.crow-ml-4{margin-left:1rem}.crow-mt-0{margin-top:0}.crow-mt-0\\.5{margin-top:.125rem}.crow-mt-1{margin-top:.25rem}.crow-mt-2{margin-top:.5rem}.crow-mt-auto{margin-top:auto}.crow-inline-block{display:inline-block}.crow-flex{display:flex}.crow-inline-flex{display:inline-flex}.crow-h-10{height:2.5rem}.crow-h-12{height:3rem}.crow-h-2{height:.5rem}.crow-h-3{height:.75rem}.crow-h-3\\.5{height:.875rem}.crow-h-4{height:1rem}.crow-h-7{height:1.75rem}.crow-h-8{height:2rem}.crow-h-full{height:100%}.crow-max-h-32{max-height:8rem}.crow-max-h-\\[200px\\]{max-height:200px}.crow-min-h-0{min-height:0}.crow-min-h-\\[32px\\]{min-height:32px}.crow-w-0{width:0}.crow-w-0\\.5{width:.125rem}.crow-w-2{width:.5rem}.crow-w-3{width:.75rem}.crow-w-3\\.5{width:.875rem}.crow-w-4{width:1rem}.crow-w-7{width:1.75rem}.crow-w-8{width:2rem}.crow-w-full{width:100%}.crow-min-w-0{min-width:0}.crow-min-w-\\[180px\\]{min-width:180px}.crow-max-w-\\[80\\%\\]{max-width:80%}.crow-max-w-\\[90\\%\\]{max-width:90%}.crow-max-w-full{max-width:100%}.crow-flex-1{flex:1 1 0%}.crow-flex-shrink-0{flex-shrink:0}.crow-rotate-180{--tw-rotate:180deg}.crow-rotate-180,.crow-scale-100{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.crow-scale-100{--tw-scale-x:1;--tw-scale-y:1}.crow-scale-110{--tw-scale-x:1.1;--tw-scale-y:1.1;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.crow-animate-fade-in{animation:crow-fadeIn .2s ease-out}.crow-animate-pulse{animation:crow-pulse 2s cubic-bezier(.4,0,.6,1) infinite}.crow-animate-slide-up{animation:crow-slideUp .3s ease-out}@keyframes crow-spin{to{transform:rotate(1turn)}}.crow-animate-spin{animation:crow-spin 1s linear infinite}.crow-cursor-default{cursor:default}.crow-cursor-not-allowed{cursor:not-allowed}.crow-cursor-pointer{cursor:pointer}.crow-select-none{-webkit-user-select:none;-moz-user-select:none;user-select:none}.crow-resize-none{resize:none}.crow-list-decimal{list-style-type:decimal}.crow-list-disc{list-style-type:disc}.crow-flex-row{flex-direction:row}.crow-flex-col{flex-direction:column}.crow-items-start{align-items:flex-start}.crow-items-end{align-items:flex-end}.crow-items-center{align-items:center}.crow-justify-start{justify-content:flex-start}.crow-justify-end{justify-content:flex-end}.crow-justify-center{justify-content:center}.crow-justify-between{justify-content:space-between}.crow-gap-1{gap:.25rem}.crow-gap-1\\.5{gap:.375rem}.crow-gap-2{gap:.5rem}.crow-gap-3{gap:.75rem}.crow-gap-4{gap:1rem}.crow-gap-6{gap:1.5rem}.crow-space-y-1>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(.25rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.25rem*var(--tw-space-y-reverse))}.crow-space-y-1\\.5>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(.375rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.375rem*var(--tw-space-y-reverse))}.crow-space-y-2>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(.5rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.5rem*var(--tw-space-y-reverse))}.crow-space-y-3>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(.75rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.75rem*var(--tw-space-y-reverse))}.crow-space-y-4>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(1rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1rem*var(--tw-space-y-reverse))}.crow-overflow-hidden{overflow:hidden}.crow-overflow-visible{overflow:visible}.crow-overflow-x-auto{overflow-x:auto}.crow-overflow-y-auto{overflow-y:auto}.crow-truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.crow-whitespace-pre-wrap{white-space:pre-wrap}.crow-break-words{overflow-wrap:break-word}.crow-rounded{border-radius:.25rem}.crow-rounded-2xl{border-radius:1rem}.crow-rounded-3xl{border-radius:1.5rem}.crow-rounded-full{border-radius:9999px}.crow-rounded-lg{border-radius:.5rem}.crow-rounded-md{border-radius:.375rem}.crow-rounded-xl{border-radius:.75rem}.crow-border{border-width:1px}.crow-border-b{border-bottom-width:1px}.crow-border-l{border-left-width:1px}.crow-border-l-2{border-left-width:2px}.crow-border-r{border-right-width:1px}.crow-border-t{border-top-width:1px}.crow-border-none{border-style:none}.crow-border-gray-100{--tw-border-opacity:1;border-color:rgb(243 244 246/var(--tw-border-opacity,1))}.crow-border-gray-200{--tw-border-opacity:1;border-color:rgb(229 231 235/var(--tw-border-opacity,1))}.crow-border-gray-300{--tw-border-opacity:1;border-color:rgb(209 213 219/var(--tw-border-opacity,1))}.crow-border-red-500{--tw-border-opacity:1;border-color:rgb(239 68 68/var(--tw-border-opacity,1))}.crow-bg-black{--tw-bg-opacity:1;background-color:rgb(0 0 0/var(--tw-bg-opacity,1))}.crow-bg-blue-50{--tw-bg-opacity:1;background-color:rgb(239 246 255/var(--tw-bg-opacity,1))}.crow-bg-gray-100{--tw-bg-opacity:1;background-color:rgb(243 244 246/var(--tw-bg-opacity,1))}.crow-bg-gray-200{--tw-bg-opacity:1;background-color:rgb(229 231 235/var(--tw-bg-opacity,1))}.crow-bg-gray-400{--tw-bg-opacity:1;background-color:rgb(156 163 175/var(--tw-bg-opacity,1))}.crow-bg-gray-50{--tw-bg-opacity:1;background-color:rgb(249 250 251/var(--tw-bg-opacity,1))}.crow-bg-gray-700{--tw-bg-opacity:1;background-color:rgb(55 65 81/var(--tw-bg-opacity,1))}.crow-bg-gray-800{--tw-bg-opacity:1;background-color:rgb(31 41 55/var(--tw-bg-opacity,1))}.crow-bg-gray-900{--tw-bg-opacity:1;background-color:rgb(17 24 39/var(--tw-bg-opacity,1))}.crow-bg-transparent{background-color:transparent}.crow-bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1))}.crow-p-0{padding:0}.crow-p-1{padding:.25rem}.crow-p-1\\.5{padding:.375rem}.crow-p-2{padding:.5rem}.crow-p-3{padding:.75rem}.crow-p-4{padding:1rem}.crow-p-6{padding:1.5rem}.crow-px-1{padding-left:.25rem;padding-right:.25rem}.crow-px-2{padding-left:.5rem;padding-right:.5rem}.crow-px-3{padding-left:.75rem;padding-right:.75rem}.crow-px-4{padding-left:1rem;padding-right:1rem}.crow-px-6{padding-left:1.5rem;padding-right:1.5rem}.crow-py-0{padding-top:0;padding-bottom:0}.crow-py-0\\.5{padding-top:.125rem;padding-bottom:.125rem}.crow-py-1{padding-top:.25rem;padding-bottom:.25rem}.crow-py-1\\.5{padding-top:.375rem;padding-bottom:.375rem}.crow-py-2{padding-top:.5rem;padding-bottom:.5rem}.crow-py-3{padding-top:.75rem;padding-bottom:.75rem}.crow-py-6{padding-top:1.5rem;padding-bottom:1.5rem}.crow-py-8{padding-top:2rem;padding-bottom:2rem}.crow-pb-2{padding-bottom:.5rem}.crow-pl-3{padding-left:.75rem}.crow-pl-4{padding-left:1rem}.crow-pl-5{padding-left:1.25rem}.crow-pr-4{padding-right:1rem}.crow-pt-1{padding-top:.25rem}.crow-text-left{text-align:left}.crow-text-center{text-align:center}.crow-text-right{text-align:right}.crow-align-text-bottom{vertical-align:text-bottom}.crow-font-mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}.crow-text-base{font-size:1rem;line-height:1.5rem}.crow-text-lg{font-size:1.125rem;line-height:1.75rem}.crow-text-sm{font-size:.875rem;line-height:1.25rem}.crow-text-xs{font-size:.75rem;line-height:1rem}.crow-font-bold{font-weight:700}.crow-font-medium{font-weight:500}.crow-font-semibold{font-weight:600}.crow-uppercase{text-transform:uppercase}.crow-leading-relaxed{line-height:1.625}.crow-tracking-wide{letter-spacing:.025em}.crow-text-black{--tw-text-opacity:1;color:rgb(0 0 0/var(--tw-text-opacity,1))}.crow-text-blue-300{--tw-text-opacity:1;color:rgb(147 197 253/var(--tw-text-opacity,1))}.crow-text-blue-500{--tw-text-opacity:1;color:rgb(59 130 246/var(--tw-text-opacity,1))}.crow-text-gray-400{--tw-text-opacity:1;color:rgb(156 163 175/var(--tw-text-opacity,1))}.crow-text-gray-500{--tw-text-opacity:1;color:rgb(107 114 128/var(--tw-text-opacity,1))}.crow-text-gray-600{--tw-text-opacity:1;color:rgb(75 85 99/var(--tw-text-opacity,1))}.crow-text-gray-700{--tw-text-opacity:1;color:rgb(55 65 81/var(--tw-text-opacity,1))}.crow-text-gray-800{--tw-text-opacity:1;color:rgb(31 41 55/var(--tw-text-opacity,1))}.crow-text-gray-900{--tw-text-opacity:1;color:rgb(17 24 39/var(--tw-text-opacity,1))}.crow-text-green-500{--tw-text-opacity:1;color:rgb(34 197 94/var(--tw-text-opacity,1))}.crow-text-red-500{--tw-text-opacity:1;color:rgb(239 68 68/var(--tw-text-opacity,1))}.crow-text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.crow-underline{text-decoration-line:underline}.crow-opacity-0{opacity:0}.crow-opacity-100{opacity:1}.crow-opacity-50{opacity:.5}.crow-opacity-60{opacity:.6}.crow-shadow-2xl{--tw-shadow:0 25px 50px -12px rgba(0,0,0,.25);--tw-shadow-colored:0 25px 50px -12px var(--tw-shadow-color)}.crow-shadow-2xl,.crow-shadow-lg{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.crow-shadow-lg{--tw-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color),0 4px 6px -4px var(--tw-shadow-color)}.crow-shadow-md{--tw-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -2px rgba(0,0,0,.1);--tw-shadow-colored:0 4px 6px -1px var(--tw-shadow-color),0 2px 4px -2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.crow-backdrop-blur-md{--tw-backdrop-blur:blur(12px)}.crow-backdrop-blur-md,.crow-backdrop-blur-sm{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)}.crow-backdrop-blur-sm{--tw-backdrop-blur:blur(4px)}.crow-transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.crow-transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.crow-transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.crow-transition-opacity{transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.crow-transition-transform{transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.crow-duration-150{transition-duration:.15s}.crow-duration-200{transition-duration:.2s}.crow-duration-300{transition-duration:.3s}.crow-duration-500{transition-duration:.5s}.crow-ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}.crow-animate-fade-in{animation:crow-fadeIn .2s ease-out}.crow-animate-slide-up{animation:crow-slideUp .3s ease-out}.crow-animate-pulse{animation:crow-pulse 1.5s ease-in-out infinite}.crow-animation-delay-100{animation-delay:.1s}.crow-animation-delay-200{animation-delay:.2s}@keyframes crow-fadeIn{0%{opacity:0}to{opacity:1}}@keyframes crow-slideUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes crow-pulse{0%,to{opacity:1}50%{opacity:.4}}.crow-overflow-y-auto::-webkit-scrollbar{width:6px}.crow-overflow-y-auto::-webkit-scrollbar-track{background:transparent}.crow-overflow-y-auto::-webkit-scrollbar-thumb{background-color:#d1d5db;border-radius:3px}.crow-overflow-y-auto::-webkit-scrollbar-thumb:hover{background-color:#9ca3af}.crow-focus-visible\\:crow-outline-none:focus-visible{outline:none}.crow-focus-visible\\:crow-ring-2:focus-visible{box-shadow:0 0 0 2px var(--crow-primary,#6366f1)}:root{--crow-primary:#6366f1;--crow-primary-dark:#4f46e5;--crow-secondary:#f1f5f9;--crow-accent:#10b981}@media (prefers-color-scheme:dark){:root{--crow-primary:#818cf8;--crow-primary-dark:#6366f1}}.placeholder\\:crow-text-gray-500::-moz-placeholder{--tw-text-opacity:1;color:rgb(107 114 128/var(--tw-text-opacity,1))}.placeholder\\:crow-text-gray-500::placeholder{--tw-text-opacity:1;color:rgb(107 114 128/var(--tw-text-opacity,1))}.last\\:crow-mb-0:last-child{margin-bottom:0}.last\\:crow-border-0:last-child{border-width:0}.hover\\:crow-scale-110:hover{--tw-scale-x:1.1;--tw-scale-y:1.1;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.hover\\:crow-bg-gray-100:hover{--tw-bg-opacity:1;background-color:rgb(243 244 246/var(--tw-bg-opacity,1))}.hover\\:crow-bg-gray-200:hover{--tw-bg-opacity:1;background-color:rgb(229 231 235/var(--tw-bg-opacity,1))}.hover\\:crow-bg-gray-700:hover{--tw-bg-opacity:1;background-color:rgb(55 65 81/var(--tw-bg-opacity,1))}.hover\\:crow-bg-gray-800:hover{--tw-bg-opacity:1;background-color:rgb(31 41 55/var(--tw-bg-opacity,1))}.hover\\:crow-text-blue-300:hover{--tw-text-opacity:1;color:rgb(147 197 253/var(--tw-text-opacity,1))}.hover\\:crow-text-gray-700:hover{--tw-text-opacity:1;color:rgb(55 65 81/var(--tw-text-opacity,1))}.hover\\:crow-text-gray-800:hover{--tw-text-opacity:1;color:rgb(31 41 55/var(--tw-text-opacity,1))}.hover\\:crow-opacity-100:hover{opacity:1}.focus\\:crow-outline-none:focus{outline:2px solid transparent;outline-offset:2px}.focus\\:crow-ring-0:focus{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(var(--tw-ring-offset-width)) var(--tw-ring-color)}.focus\\:crow-ring-0:focus,.focus\\:crow-ring-2:focus{box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.focus\\:crow-ring-2:focus{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color)}.focus\\:crow-ring-offset-2:focus{--tw-ring-offset-width:2px}.focus-visible\\:crow-outline-none:focus-visible{outline:2px solid transparent;outline-offset:2px}.focus-visible\\:crow-ring-0:focus-visible{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.disabled\\:crow-pointer-events-none:disabled{pointer-events:none}.disabled\\:crow-cursor-not-allowed:disabled{cursor:not-allowed}.disabled\\:crow-opacity-50:disabled{opacity:.5}`;
|
|
40
|
-
var injected = false;
|
|
41
|
-
function injectStyles() {
|
|
42
|
-
if (injected || typeof document === "undefined") return;
|
|
43
|
-
if (document.getElementById(STYLE_ID)) {
|
|
44
|
-
injected = true;
|
|
45
|
-
return;
|
|
46
|
-
}
|
|
47
|
-
const style = document.createElement("style");
|
|
48
|
-
style.id = STYLE_ID;
|
|
49
|
-
style.textContent = CSS_CONTENT;
|
|
50
|
-
document.head.appendChild(style);
|
|
51
|
-
injected = true;
|
|
52
|
-
}
|
|
53
|
-
injectStyles();
|
|
54
|
-
|
|
55
36
|
// src/utils.ts
|
|
56
37
|
var cn = (...classes) => classes.filter(Boolean).join(" ");
|
|
57
38
|
var formatTime = (date) => date.toLocaleTimeString("en-US", {
|
|
@@ -979,29 +960,29 @@ function mergeCopilotStyles(dbStyles, propStyles) {
|
|
|
979
960
|
}
|
|
980
961
|
return result;
|
|
981
962
|
}
|
|
982
|
-
function stylesToCSSVariables(
|
|
963
|
+
function stylesToCSSVariables(styles) {
|
|
983
964
|
return {
|
|
984
965
|
// Colors
|
|
985
|
-
"--crow-color-primary":
|
|
986
|
-
"--crow-color-background":
|
|
987
|
-
"--crow-color-text":
|
|
988
|
-
"--crow-color-border":
|
|
989
|
-
"--crow-color-bot-bubble":
|
|
990
|
-
"--crow-color-bot-text":
|
|
991
|
-
"--crow-color-user-bubble":
|
|
992
|
-
"--crow-color-user-text":
|
|
993
|
-
"--crow-color-user-border":
|
|
994
|
-
"--crow-color-messages-bg":
|
|
966
|
+
"--crow-color-primary": styles.colors.primary,
|
|
967
|
+
"--crow-color-background": styles.colors.background,
|
|
968
|
+
"--crow-color-text": styles.colors.text,
|
|
969
|
+
"--crow-color-border": styles.colors.border,
|
|
970
|
+
"--crow-color-bot-bubble": styles.colors.botBubble,
|
|
971
|
+
"--crow-color-bot-text": styles.colors.botText,
|
|
972
|
+
"--crow-color-user-bubble": styles.colors.userBubble,
|
|
973
|
+
"--crow-color-user-text": styles.colors.userText,
|
|
974
|
+
"--crow-color-user-border": styles.colors.userBorder,
|
|
975
|
+
"--crow-color-messages-bg": styles.colors.messagesBackground,
|
|
995
976
|
// Typography
|
|
996
|
-
"--crow-font-family":
|
|
997
|
-
"--crow-font-size": `${
|
|
998
|
-
"--crow-header-font-size": `${
|
|
999
|
-
"--crow-font-weight": `${
|
|
1000
|
-
"--crow-line-height": `${
|
|
1001
|
-
"--crow-letter-spacing": `${
|
|
977
|
+
"--crow-font-family": styles.typography.fontFamily,
|
|
978
|
+
"--crow-font-size": `${styles.typography.fontSize}px`,
|
|
979
|
+
"--crow-header-font-size": `${styles.typography.headerFontSize}px`,
|
|
980
|
+
"--crow-font-weight": `${styles.typography.fontWeight}`,
|
|
981
|
+
"--crow-line-height": `${styles.typography.lineHeight}`,
|
|
982
|
+
"--crow-letter-spacing": `${styles.typography.letterSpacing}px`,
|
|
1002
983
|
// Animations
|
|
1003
|
-
"--crow-animation-duration": `${
|
|
1004
|
-
"--crow-animation-easing":
|
|
984
|
+
"--crow-animation-duration": `${styles.animations.duration}s`,
|
|
985
|
+
"--crow-animation-easing": styles.animations.easing
|
|
1005
986
|
};
|
|
1006
987
|
}
|
|
1007
988
|
|
|
@@ -1061,9 +1042,9 @@ function useWidgetStyles({
|
|
|
1061
1042
|
hasFetchedRef.current = true;
|
|
1062
1043
|
fetchStyles();
|
|
1063
1044
|
}, [productId, apiUrl, skip, key]);
|
|
1064
|
-
const
|
|
1045
|
+
const styles = mergeWidgetStyles(dbStyles, propStyles);
|
|
1065
1046
|
return {
|
|
1066
|
-
styles
|
|
1047
|
+
styles,
|
|
1067
1048
|
isLoading,
|
|
1068
1049
|
error,
|
|
1069
1050
|
agentName,
|
|
@@ -1115,9 +1096,9 @@ function useCopilotStyles({
|
|
|
1115
1096
|
hasFetchedRef.current = true;
|
|
1116
1097
|
fetchStyles();
|
|
1117
1098
|
}, [productId, apiUrl, skip, key]);
|
|
1118
|
-
const
|
|
1099
|
+
const styles = mergeCopilotStyles(dbStyles, propStyles);
|
|
1119
1100
|
return {
|
|
1120
|
-
styles
|
|
1101
|
+
styles,
|
|
1121
1102
|
isLoading,
|
|
1122
1103
|
error,
|
|
1123
1104
|
agentName,
|
|
@@ -1144,14 +1125,14 @@ function usePreviewCopilotStyles(previewStyles) {
|
|
|
1144
1125
|
var WidgetStyleContext = React3.createContext(null);
|
|
1145
1126
|
function WidgetStyleProvider({
|
|
1146
1127
|
children,
|
|
1147
|
-
styles
|
|
1128
|
+
styles,
|
|
1148
1129
|
agentName = "Assistant",
|
|
1149
1130
|
isLoading = false,
|
|
1150
1131
|
variant = "floating"
|
|
1151
1132
|
}) {
|
|
1152
1133
|
const value = React3.useMemo(
|
|
1153
|
-
() => ({ styles
|
|
1154
|
-
[
|
|
1134
|
+
() => ({ styles, agentName, isLoading, variant }),
|
|
1135
|
+
[styles, agentName, isLoading, variant]
|
|
1155
1136
|
);
|
|
1156
1137
|
return /* @__PURE__ */ jsxRuntime.jsx(WidgetStyleContext.Provider, { value, children });
|
|
1157
1138
|
}
|
|
@@ -1171,13 +1152,13 @@ function useWidgetStyles2() {
|
|
|
1171
1152
|
var CopilotStyleContext = React3.createContext(null);
|
|
1172
1153
|
function CopilotStyleProvider({
|
|
1173
1154
|
children,
|
|
1174
|
-
styles
|
|
1155
|
+
styles,
|
|
1175
1156
|
agentName = "Assistant",
|
|
1176
1157
|
isLoading = false
|
|
1177
1158
|
}) {
|
|
1178
1159
|
const value = React3.useMemo(
|
|
1179
|
-
() => ({ styles
|
|
1180
|
-
[
|
|
1160
|
+
() => ({ styles, agentName, isLoading }),
|
|
1161
|
+
[styles, agentName, isLoading]
|
|
1181
1162
|
);
|
|
1182
1163
|
return /* @__PURE__ */ jsxRuntime.jsx(CopilotStyleContext.Provider, { value, children });
|
|
1183
1164
|
}
|
|
@@ -1194,46 +1175,51 @@ function useCopilotStyles2() {
|
|
|
1194
1175
|
const context = React3.useContext(CopilotStyleContext);
|
|
1195
1176
|
return context?.styles ?? DEFAULT_COPILOT_STYLES;
|
|
1196
1177
|
}
|
|
1178
|
+
function ShadowContainer({
|
|
1179
|
+
children,
|
|
1180
|
+
styles,
|
|
1181
|
+
hostId = "crow-widget-host",
|
|
1182
|
+
hostClassName
|
|
1183
|
+
}) {
|
|
1184
|
+
const hostRef = React3.useRef(null);
|
|
1185
|
+
const [shadowRoot, setShadowRoot] = React3.useState(null);
|
|
1186
|
+
React3.useEffect(() => {
|
|
1187
|
+
if (hostRef.current && !hostRef.current.shadowRoot) {
|
|
1188
|
+
const shadow = hostRef.current.attachShadow({ mode: "open" });
|
|
1189
|
+
setShadowRoot(shadow);
|
|
1190
|
+
}
|
|
1191
|
+
}, []);
|
|
1192
|
+
return /* @__PURE__ */ jsxRuntime.jsx("div", { ref: hostRef, id: hostId, className: hostClassName, children: shadowRoot && reactDom.createPortal(
|
|
1193
|
+
/* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
1194
|
+
/* @__PURE__ */ jsxRuntime.jsx("style", { children: styles }),
|
|
1195
|
+
children
|
|
1196
|
+
] }),
|
|
1197
|
+
shadowRoot
|
|
1198
|
+
) });
|
|
1199
|
+
}
|
|
1200
|
+
ShadowContainer.displayName = "ShadowContainer";
|
|
1197
1201
|
function ChatBubble({ isExpanded, onClick }) {
|
|
1198
|
-
const { styles
|
|
1202
|
+
const { styles } = useWidgetStyleContext();
|
|
1199
1203
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
1200
1204
|
"button",
|
|
1201
1205
|
{
|
|
1202
1206
|
onClick,
|
|
1203
1207
|
className: "crow-fixed crow-z-[999999] crow-rounded-full crow-flex crow-items-center crow-justify-center crow-shadow-2xl hover:crow-scale-110 crow-transition-all crow-duration-500 crow-border crow-backdrop-blur-md",
|
|
1204
1208
|
style: {
|
|
1205
|
-
width:
|
|
1206
|
-
height:
|
|
1207
|
-
right:
|
|
1208
|
-
bottom:
|
|
1209
|
-
background:
|
|
1210
|
-
borderColor:
|
|
1211
|
-
boxShadow:
|
|
1212
|
-
color:
|
|
1209
|
+
width: styles.bubble.size,
|
|
1210
|
+
height: styles.bubble.size,
|
|
1211
|
+
right: styles.position.bubbleRight,
|
|
1212
|
+
bottom: styles.position.bubbleBottom,
|
|
1213
|
+
background: styles.colors.bubbleBackground,
|
|
1214
|
+
borderColor: styles.colors.bubbleBorder,
|
|
1215
|
+
boxShadow: styles.shadows.bubble,
|
|
1216
|
+
color: styles.colors.bubbleIcon
|
|
1213
1217
|
},
|
|
1214
1218
|
"aria-label": isExpanded ? "Close Chat" : "Open Chat",
|
|
1215
|
-
children: isExpanded ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, { size:
|
|
1219
|
+
children: isExpanded ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, { size: styles.bubble.iconSize, strokeWidth: 2 }) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.MessageCircle, { size: styles.bubble.iconSize, strokeWidth: 2 })
|
|
1216
1220
|
}
|
|
1217
1221
|
);
|
|
1218
1222
|
}
|
|
1219
|
-
var GlassCard = React3.forwardRef(
|
|
1220
|
-
({ className, children, ...props }, ref) => {
|
|
1221
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
1222
|
-
"div",
|
|
1223
|
-
{
|
|
1224
|
-
ref,
|
|
1225
|
-
className: cn(
|
|
1226
|
-
"crow-border crow-flex crow-flex-col crow-gap-6 crow-rounded-2xl crow-py-6 crow-backdrop-blur-md",
|
|
1227
|
-
className
|
|
1228
|
-
),
|
|
1229
|
-
style: { background: "rgba(255, 255, 255, 0.3)", borderColor: "rgba(229, 231, 235, 0.3)", ...props.style },
|
|
1230
|
-
...props,
|
|
1231
|
-
children
|
|
1232
|
-
}
|
|
1233
|
-
);
|
|
1234
|
-
}
|
|
1235
|
-
);
|
|
1236
|
-
GlassCard.displayName = "GlassCard";
|
|
1237
1223
|
var GOOGLE_FONTS_MAP = {
|
|
1238
1224
|
'"Inter", sans-serif': "Inter:wght@300;400;500;600;700",
|
|
1239
1225
|
'"Roboto", sans-serif': "Roboto:wght@300;400;500;700",
|
|
@@ -1243,9 +1229,9 @@ var GOOGLE_FONTS_MAP = {
|
|
|
1243
1229
|
};
|
|
1244
1230
|
var WidgetShell = React3.forwardRef(
|
|
1245
1231
|
({ children, className }, ref) => {
|
|
1246
|
-
const { styles
|
|
1232
|
+
const { styles, variant } = useWidgetStyleContext();
|
|
1247
1233
|
React3.useEffect(() => {
|
|
1248
|
-
const fontParam = GOOGLE_FONTS_MAP[
|
|
1234
|
+
const fontParam = GOOGLE_FONTS_MAP[styles.typography.fontFamily];
|
|
1249
1235
|
if (!fontParam) return;
|
|
1250
1236
|
const linkId = `crow-google-font-${fontParam.split(":")[0]}`;
|
|
1251
1237
|
if (document.getElementById(linkId)) return;
|
|
@@ -1254,46 +1240,46 @@ var WidgetShell = React3.forwardRef(
|
|
|
1254
1240
|
link.rel = "stylesheet";
|
|
1255
1241
|
link.href = `https://fonts.googleapis.com/css2?family=${fontParam}&display=swap`;
|
|
1256
1242
|
document.head.appendChild(link);
|
|
1257
|
-
}, [
|
|
1243
|
+
}, [styles.typography.fontFamily]);
|
|
1258
1244
|
const baseStyle = {
|
|
1259
|
-
borderRadius:
|
|
1260
|
-
padding:
|
|
1261
|
-
background:
|
|
1262
|
-
borderColor:
|
|
1263
|
-
color:
|
|
1264
|
-
boxShadow:
|
|
1265
|
-
fontFamily:
|
|
1266
|
-
fontSize:
|
|
1267
|
-
fontWeight:
|
|
1268
|
-
lineHeight:
|
|
1269
|
-
letterSpacing:
|
|
1245
|
+
borderRadius: styles.dimensions.borderRadius,
|
|
1246
|
+
padding: styles.dimensions.padding,
|
|
1247
|
+
background: styles.colors.background,
|
|
1248
|
+
borderColor: styles.colors.border,
|
|
1249
|
+
color: styles.colors.text,
|
|
1250
|
+
boxShadow: styles.shadows.widget,
|
|
1251
|
+
fontFamily: styles.typography.fontFamily,
|
|
1252
|
+
fontSize: styles.typography.fontSize,
|
|
1253
|
+
fontWeight: styles.typography.fontWeight,
|
|
1254
|
+
lineHeight: styles.typography.lineHeight,
|
|
1255
|
+
letterSpacing: styles.typography.letterSpacing
|
|
1270
1256
|
};
|
|
1271
1257
|
if (variant === "embedded") {
|
|
1272
1258
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
1273
|
-
|
|
1259
|
+
"div",
|
|
1274
1260
|
{
|
|
1275
1261
|
ref,
|
|
1276
|
-
className: `crow-flex crow-flex-col crow-shadow-2xl crow-gap-3 ${className ?? ""}`,
|
|
1262
|
+
className: `crow-flex crow-flex-col crow-shadow-2xl crow-gap-3 crow-border crow-backdrop-blur-md crow-overflow-hidden ${className ?? ""}`,
|
|
1277
1263
|
style: {
|
|
1278
1264
|
...baseStyle,
|
|
1279
|
-
width: `min(${
|
|
1280
|
-
height: `min(${
|
|
1265
|
+
width: `min(${styles.dimensions.width}px, calc(100vw - 32px))`,
|
|
1266
|
+
height: `min(${styles.dimensions.maxHeight}px, calc(100vh - 120px))`
|
|
1281
1267
|
},
|
|
1282
1268
|
children
|
|
1283
1269
|
}
|
|
1284
1270
|
);
|
|
1285
1271
|
}
|
|
1286
1272
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
1287
|
-
|
|
1273
|
+
"div",
|
|
1288
1274
|
{
|
|
1289
1275
|
ref,
|
|
1290
|
-
className: `crow-fixed crow-z-[999999] crow-shadow-2xl crow-gap-3 crow-transition-all crow-duration-500 crow-flex crow-flex-col ${className ?? ""}`,
|
|
1276
|
+
className: `crow-fixed crow-z-[999999] crow-shadow-2xl crow-gap-3 crow-transition-all crow-duration-500 crow-flex crow-flex-col crow-border crow-backdrop-blur-md crow-overflow-hidden ${className ?? ""}`,
|
|
1291
1277
|
style: {
|
|
1292
1278
|
...baseStyle,
|
|
1293
|
-
width: `min(${
|
|
1294
|
-
height: `min(${
|
|
1295
|
-
right:
|
|
1296
|
-
bottom:
|
|
1279
|
+
width: `min(${styles.dimensions.width}px, calc(100vw - 32px))`,
|
|
1280
|
+
height: `min(${styles.dimensions.maxHeight}px, calc(100vh - 120px))`,
|
|
1281
|
+
right: styles.position.right,
|
|
1282
|
+
bottom: styles.position.bottom
|
|
1297
1283
|
},
|
|
1298
1284
|
children
|
|
1299
1285
|
}
|
|
@@ -1310,20 +1296,20 @@ function WidgetHeader({
|
|
|
1310
1296
|
isMinimized = false,
|
|
1311
1297
|
onToggleMinimize
|
|
1312
1298
|
}) {
|
|
1313
|
-
const { agentName, styles
|
|
1299
|
+
const { agentName, styles } = useWidgetStyleContext();
|
|
1314
1300
|
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
1315
1301
|
"div",
|
|
1316
1302
|
{
|
|
1317
1303
|
className: "crow-flex crow-items-center crow-justify-between crow-mb-3 crow-pb-2 crow-border-b",
|
|
1318
|
-
style: { borderColor:
|
|
1304
|
+
style: { borderColor: styles.colors.border },
|
|
1319
1305
|
children: [
|
|
1320
1306
|
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "crow-flex crow-items-center crow-gap-2", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
1321
1307
|
"span",
|
|
1322
1308
|
{
|
|
1323
1309
|
className: "crow-text-sm crow-font-semibold",
|
|
1324
1310
|
style: {
|
|
1325
|
-
color:
|
|
1326
|
-
fontSize:
|
|
1311
|
+
color: styles.colors.text,
|
|
1312
|
+
fontSize: styles.typography.headerFontSize
|
|
1327
1313
|
},
|
|
1328
1314
|
children: agentName
|
|
1329
1315
|
}
|
|
@@ -1625,7 +1611,7 @@ function MessageBubble({
|
|
|
1625
1611
|
toolCalls = [],
|
|
1626
1612
|
isLoading = false
|
|
1627
1613
|
}) {
|
|
1628
|
-
const
|
|
1614
|
+
const styles = useWidgetStyles2();
|
|
1629
1615
|
const isWaiting = message.content === "Thinking..." || message.isBot && isLoading && !message.content;
|
|
1630
1616
|
const hasThinking = message.isBot && message.thinking;
|
|
1631
1617
|
const hasContent = message.content && message.content !== "Thinking...";
|
|
@@ -1652,12 +1638,12 @@ function MessageBubble({
|
|
|
1652
1638
|
{
|
|
1653
1639
|
className: "crow-max-w-[80%] crow-rounded-2xl crow-px-4 crow-py-2 crow-transition-all crow-duration-150",
|
|
1654
1640
|
style: message.isBot ? {
|
|
1655
|
-
background:
|
|
1656
|
-
color:
|
|
1641
|
+
background: styles.colors.botBubble,
|
|
1642
|
+
color: styles.colors.botText
|
|
1657
1643
|
} : {
|
|
1658
|
-
background:
|
|
1659
|
-
color:
|
|
1660
|
-
border: `1px solid ${
|
|
1644
|
+
background: styles.colors.userBubble,
|
|
1645
|
+
color: styles.colors.userText,
|
|
1646
|
+
border: `1px solid ${styles.colors.userBorder}`
|
|
1661
1647
|
},
|
|
1662
1648
|
children: [
|
|
1663
1649
|
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "crow-whitespace-pre-wrap", children: message.isBot ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -1721,8 +1707,8 @@ function MessageList({
|
|
|
1721
1707
|
)) });
|
|
1722
1708
|
}
|
|
1723
1709
|
var MessagesContainer = React3.forwardRef(
|
|
1724
|
-
({ children
|
|
1725
|
-
const
|
|
1710
|
+
({ children }, ref) => {
|
|
1711
|
+
const styles = useWidgetStyles2();
|
|
1726
1712
|
const internalRef = React3.useRef(null);
|
|
1727
1713
|
const lastScrollHeightRef = React3.useRef(0);
|
|
1728
1714
|
const isUserScrollingRef = React3.useRef(false);
|
|
@@ -1770,12 +1756,9 @@ var MessagesContainer = React3.forwardRef(
|
|
|
1770
1756
|
initial: { opacity: 0 },
|
|
1771
1757
|
animate: { opacity: 1 },
|
|
1772
1758
|
exit: { opacity: 0 },
|
|
1773
|
-
transition: { duration:
|
|
1759
|
+
transition: { duration: styles.animations.duration },
|
|
1774
1760
|
className: "crow-relative crow-flex-1 crow-min-h-0 crow-rounded-2xl crow-mb-3 crow-overflow-y-auto crow-p-4 crow-space-y-3 crow-pointer-events-auto",
|
|
1775
|
-
style: {
|
|
1776
|
-
background: styles2.colors.messagesBackground,
|
|
1777
|
-
...maxHeight && { maxHeight }
|
|
1778
|
-
},
|
|
1761
|
+
style: { background: styles.colors.messagesBackground },
|
|
1779
1762
|
children
|
|
1780
1763
|
}
|
|
1781
1764
|
);
|
|
@@ -1840,8 +1823,8 @@ function WorkflowPanel({ workflow, onExit }) {
|
|
|
1840
1823
|
);
|
|
1841
1824
|
}
|
|
1842
1825
|
function PoweredByBadge({ apiUrl = "" }) {
|
|
1843
|
-
const
|
|
1844
|
-
const branding =
|
|
1826
|
+
const styles = useWidgetStyles2();
|
|
1827
|
+
const branding = styles.branding;
|
|
1845
1828
|
if (!branding.showPoweredBy) return null;
|
|
1846
1829
|
const logoUrl = branding.logoUrl?.startsWith("http") ? branding.logoUrl : `${apiUrl}${branding.logoUrl}`;
|
|
1847
1830
|
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "crow-flex crow-items-center crow-justify-center crow-gap-1.5 crow-mb-3 crow-text-xs crow-text-gray-400", children: [
|
|
@@ -1932,30 +1915,6 @@ var ModelSelector = ({
|
|
|
1932
1915
|
] }, provider)) })
|
|
1933
1916
|
] });
|
|
1934
1917
|
};
|
|
1935
|
-
var styles = `
|
|
1936
|
-
*:focus-visible {
|
|
1937
|
-
outline-offset: 0 !important;
|
|
1938
|
-
--ring-offset: 0 !important;
|
|
1939
|
-
}
|
|
1940
|
-
textarea::-webkit-scrollbar {
|
|
1941
|
-
width: 6px;
|
|
1942
|
-
}
|
|
1943
|
-
textarea::-webkit-scrollbar-track {
|
|
1944
|
-
background: transparent;
|
|
1945
|
-
}
|
|
1946
|
-
textarea::-webkit-scrollbar-thumb {
|
|
1947
|
-
background-color: #d1d5db;
|
|
1948
|
-
border-radius: 3px;
|
|
1949
|
-
}
|
|
1950
|
-
textarea::-webkit-scrollbar-thumb:hover {
|
|
1951
|
-
background-color: #9ca3af;
|
|
1952
|
-
}
|
|
1953
|
-
`;
|
|
1954
|
-
if (typeof document !== "undefined") {
|
|
1955
|
-
const styleSheet = document.createElement("style");
|
|
1956
|
-
styleSheet.innerText = styles;
|
|
1957
|
-
document.head.appendChild(styleSheet);
|
|
1958
|
-
}
|
|
1959
1918
|
var Textarea = React3__default.default.forwardRef(
|
|
1960
1919
|
({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
1961
1920
|
"textarea",
|
|
@@ -1980,10 +1939,9 @@ var TooltipContent = React3__default.default.forwardRef(({ className, sideOffset
|
|
|
1980
1939
|
ref,
|
|
1981
1940
|
sideOffset,
|
|
1982
1941
|
className: cn(
|
|
1983
|
-
"crow-z-50 crow-overflow-hidden crow-rounded-md crow-border crow-px-3 crow-py-1.5 crow-text-sm crow-shadow-md",
|
|
1942
|
+
"crow-z-50 crow-overflow-hidden crow-rounded-md crow-border crow-border-gray-300 crow-bg-white crow-text-gray-900 crow-px-3 crow-py-1.5 crow-text-sm crow-shadow-md",
|
|
1984
1943
|
className
|
|
1985
1944
|
),
|
|
1986
|
-
style: { borderColor: "#d1d5db", background: "#ffffff", color: "#111827" },
|
|
1987
1945
|
...props
|
|
1988
1946
|
}
|
|
1989
1947
|
));
|
|
@@ -2065,11 +2023,10 @@ var PromptInput = React3__default.default.forwardRef(
|
|
|
2065
2023
|
{
|
|
2066
2024
|
ref,
|
|
2067
2025
|
className: cn(
|
|
2068
|
-
"crow-rounded-3xl crow-border crow-p-1.5 crow-shadow-lg crow-transition-all crow-duration-300",
|
|
2026
|
+
"crow-rounded-3xl crow-border crow-border-gray-300 crow-bg-white crow-p-1.5 crow-shadow-lg crow-transition-all crow-duration-300",
|
|
2069
2027
|
isLoading && "crow-border-red-500",
|
|
2070
2028
|
className
|
|
2071
2029
|
),
|
|
2072
|
-
style: { borderColor: isLoading ? void 0 : "#d1d5db", background: "#ffffff" },
|
|
2073
2030
|
children
|
|
2074
2031
|
}
|
|
2075
2032
|
)
|
|
@@ -2179,12 +2136,11 @@ var PromptInputBox = React3__default.default.forwardRef(
|
|
|
2179
2136
|
variant: "default",
|
|
2180
2137
|
size: "icon",
|
|
2181
2138
|
className: cn(
|
|
2182
|
-
"crow-h-7 crow-w-7 crow-rounded-full crow-transition-all crow-duration-200"
|
|
2139
|
+
"crow-h-7 crow-w-7 crow-rounded-full crow-transition-all crow-duration-200",
|
|
2140
|
+
isLoading && "crow-bg-red-500 hover:crow-bg-red-500",
|
|
2141
|
+
hasContent && !isLoading && "crow-bg-black hover:crow-bg-gray-800",
|
|
2142
|
+
!hasContent && !isLoading && "crow-bg-transparent"
|
|
2183
2143
|
),
|
|
2184
|
-
style: {
|
|
2185
|
-
background: isLoading ? "#ef4444" : hasContent ? "#000000" : "transparent",
|
|
2186
|
-
color: isLoading ? "#ffffff" : "#ffffff"
|
|
2187
|
-
},
|
|
2188
2144
|
onClick: () => {
|
|
2189
2145
|
if (isLoading && onStop) {
|
|
2190
2146
|
onStop();
|
|
@@ -2192,7 +2148,10 @@ var PromptInputBox = React3__default.default.forwardRef(
|
|
|
2192
2148
|
handleSubmit();
|
|
2193
2149
|
}
|
|
2194
2150
|
},
|
|
2195
|
-
children: isLoading ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Square, { className: "crow-h-3.5 crow-w-3.5", style: { fill: "white"
|
|
2151
|
+
children: isLoading ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Square, { className: "crow-h-3.5 crow-w-3.5 crow-text-white", style: { fill: "white" } }) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ArrowUp, { className: cn(
|
|
2152
|
+
"crow-h-3.5 crow-w-3.5",
|
|
2153
|
+
hasContent ? "crow-text-white" : "crow-text-gray-400"
|
|
2154
|
+
) })
|
|
2196
2155
|
}
|
|
2197
2156
|
)
|
|
2198
2157
|
}
|
|
@@ -2204,20 +2163,146 @@ var PromptInputBox = React3__default.default.forwardRef(
|
|
|
2204
2163
|
}
|
|
2205
2164
|
);
|
|
2206
2165
|
PromptInputBox.displayName = "PromptInputBox";
|
|
2166
|
+
|
|
2167
|
+
// src/styles/cssVars.ts
|
|
2168
|
+
var CSS_VAR_NAMES = {
|
|
2169
|
+
// Colors
|
|
2170
|
+
colors: {
|
|
2171
|
+
primary: "--crow-colors-primary",
|
|
2172
|
+
background: "--crow-colors-background",
|
|
2173
|
+
border: "--crow-colors-border",
|
|
2174
|
+
text: "--crow-colors-text",
|
|
2175
|
+
botBubble: "--crow-colors-bot-bubble",
|
|
2176
|
+
botText: "--crow-colors-bot-text",
|
|
2177
|
+
userBubble: "--crow-colors-user-bubble",
|
|
2178
|
+
userText: "--crow-colors-user-text",
|
|
2179
|
+
userBorder: "--crow-colors-user-border",
|
|
2180
|
+
messagesBackground: "--crow-colors-messages-background",
|
|
2181
|
+
bubbleBackground: "--crow-colors-bubble-background",
|
|
2182
|
+
bubbleBorder: "--crow-colors-bubble-border",
|
|
2183
|
+
bubbleIcon: "--crow-colors-bubble-icon"
|
|
2184
|
+
},
|
|
2185
|
+
// Dimensions
|
|
2186
|
+
dimensions: {
|
|
2187
|
+
width: "--crow-dimensions-width",
|
|
2188
|
+
maxHeight: "--crow-dimensions-max-height",
|
|
2189
|
+
messagesMaxHeight: "--crow-dimensions-messages-max-height",
|
|
2190
|
+
borderRadius: "--crow-dimensions-border-radius",
|
|
2191
|
+
padding: "--crow-dimensions-padding"
|
|
2192
|
+
},
|
|
2193
|
+
// Typography
|
|
2194
|
+
typography: {
|
|
2195
|
+
fontFamily: "--crow-typography-font-family",
|
|
2196
|
+
fontSize: "--crow-typography-font-size",
|
|
2197
|
+
headerFontSize: "--crow-typography-header-font-size",
|
|
2198
|
+
fontWeight: "--crow-typography-font-weight",
|
|
2199
|
+
lineHeight: "--crow-typography-line-height",
|
|
2200
|
+
letterSpacing: "--crow-typography-letter-spacing"
|
|
2201
|
+
},
|
|
2202
|
+
// Position
|
|
2203
|
+
position: {
|
|
2204
|
+
right: "--crow-position-right",
|
|
2205
|
+
bottom: "--crow-position-bottom",
|
|
2206
|
+
bubbleRight: "--crow-position-bubble-right",
|
|
2207
|
+
bubbleBottom: "--crow-position-bubble-bottom"
|
|
2208
|
+
},
|
|
2209
|
+
// Bubble
|
|
2210
|
+
bubble: {
|
|
2211
|
+
size: "--crow-bubble-size",
|
|
2212
|
+
iconSize: "--crow-bubble-icon-size"
|
|
2213
|
+
},
|
|
2214
|
+
// Shadows
|
|
2215
|
+
shadows: {
|
|
2216
|
+
widget: "--crow-shadows-widget",
|
|
2217
|
+
bubble: "--crow-shadows-bubble"
|
|
2218
|
+
},
|
|
2219
|
+
// Animations
|
|
2220
|
+
animations: {
|
|
2221
|
+
duration: "--crow-animations-duration"
|
|
2222
|
+
}
|
|
2223
|
+
};
|
|
2224
|
+
function stylesToCssVars(styles) {
|
|
2225
|
+
const vars = {};
|
|
2226
|
+
vars[CSS_VAR_NAMES.colors.primary] = styles.colors.primary;
|
|
2227
|
+
vars[CSS_VAR_NAMES.colors.background] = styles.colors.background;
|
|
2228
|
+
vars[CSS_VAR_NAMES.colors.border] = styles.colors.border;
|
|
2229
|
+
vars[CSS_VAR_NAMES.colors.text] = styles.colors.text;
|
|
2230
|
+
vars[CSS_VAR_NAMES.colors.botBubble] = styles.colors.botBubble;
|
|
2231
|
+
vars[CSS_VAR_NAMES.colors.botText] = styles.colors.botText;
|
|
2232
|
+
vars[CSS_VAR_NAMES.colors.userBubble] = styles.colors.userBubble;
|
|
2233
|
+
vars[CSS_VAR_NAMES.colors.userText] = styles.colors.userText;
|
|
2234
|
+
vars[CSS_VAR_NAMES.colors.userBorder] = styles.colors.userBorder;
|
|
2235
|
+
vars[CSS_VAR_NAMES.colors.messagesBackground] = styles.colors.messagesBackground;
|
|
2236
|
+
vars[CSS_VAR_NAMES.colors.bubbleBackground] = styles.colors.bubbleBackground;
|
|
2237
|
+
vars[CSS_VAR_NAMES.colors.bubbleBorder] = styles.colors.bubbleBorder;
|
|
2238
|
+
vars[CSS_VAR_NAMES.colors.bubbleIcon] = styles.colors.bubbleIcon;
|
|
2239
|
+
vars[CSS_VAR_NAMES.dimensions.width] = `${styles.dimensions.width}px`;
|
|
2240
|
+
vars[CSS_VAR_NAMES.dimensions.maxHeight] = `${styles.dimensions.maxHeight}px`;
|
|
2241
|
+
vars[CSS_VAR_NAMES.dimensions.messagesMaxHeight] = `${styles.dimensions.messagesMaxHeight}px`;
|
|
2242
|
+
vars[CSS_VAR_NAMES.dimensions.borderRadius] = `${styles.dimensions.borderRadius}px`;
|
|
2243
|
+
vars[CSS_VAR_NAMES.dimensions.padding] = `${styles.dimensions.padding}px`;
|
|
2244
|
+
vars[CSS_VAR_NAMES.typography.fontFamily] = styles.typography.fontFamily;
|
|
2245
|
+
vars[CSS_VAR_NAMES.typography.fontSize] = `${styles.typography.fontSize}px`;
|
|
2246
|
+
vars[CSS_VAR_NAMES.typography.headerFontSize] = `${styles.typography.headerFontSize}px`;
|
|
2247
|
+
vars[CSS_VAR_NAMES.typography.fontWeight] = String(styles.typography.fontWeight);
|
|
2248
|
+
vars[CSS_VAR_NAMES.typography.lineHeight] = String(styles.typography.lineHeight);
|
|
2249
|
+
vars[CSS_VAR_NAMES.typography.letterSpacing] = `${styles.typography.letterSpacing}px`;
|
|
2250
|
+
vars[CSS_VAR_NAMES.position.right] = `${styles.position.right}px`;
|
|
2251
|
+
vars[CSS_VAR_NAMES.position.bottom] = `${styles.position.bottom}px`;
|
|
2252
|
+
vars[CSS_VAR_NAMES.position.bubbleRight] = `${styles.position.bubbleRight}px`;
|
|
2253
|
+
vars[CSS_VAR_NAMES.position.bubbleBottom] = `${styles.position.bubbleBottom}px`;
|
|
2254
|
+
vars[CSS_VAR_NAMES.bubble.size] = `${styles.bubble.size}px`;
|
|
2255
|
+
vars[CSS_VAR_NAMES.bubble.iconSize] = `${styles.bubble.iconSize}px`;
|
|
2256
|
+
vars[CSS_VAR_NAMES.shadows.widget] = styles.shadows.widget;
|
|
2257
|
+
vars[CSS_VAR_NAMES.shadows.bubble] = styles.shadows.bubble;
|
|
2258
|
+
vars[CSS_VAR_NAMES.animations.duration] = `${styles.animations.duration}s`;
|
|
2259
|
+
return vars;
|
|
2260
|
+
}
|
|
2261
|
+
function getCssVar(varName, element = document.documentElement) {
|
|
2262
|
+
return getComputedStyle(element).getPropertyValue(varName).trim();
|
|
2263
|
+
}
|
|
2264
|
+
|
|
2265
|
+
// src/styles/inject.ts
|
|
2266
|
+
var STYLE_ID = "crow-ui-styles";
|
|
2267
|
+
var WIDGET_CSS = `*,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }
|
|
2268
|
+
|
|
2269
|
+
/*! tailwindcss v3.4.19 | MIT License | https://tailwindcss.com*/*,:after,:before{box-sizing:border-box;border:0 solid #e5e7eb}:after,:before{--tw-content:""}:host,html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}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;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}.crow-pointer-events-none{pointer-events:none}.crow-pointer-events-auto{pointer-events:auto}.crow-fixed{position:fixed}.crow-absolute{position:absolute}.crow-relative{position:relative}.crow-sticky{position:sticky}.crow-bottom-0{bottom:0}.crow-bottom-full{bottom:100%}.crow-left-0{left:0}.crow-right-0{right:0}.crow-top-0{top:0}.crow-z-50{z-index:50}.crow-z-\\[999999\\]{z-index:999999}.crow-m-0{margin:0}.crow-my-1{margin-top:.25rem}.crow-mb-1,.crow-my-1{margin-bottom:.25rem}.crow-mb-2{margin-bottom:.5rem}.crow-mb-3{margin-bottom:.75rem}.crow-ml-0{margin-left:0}.crow-ml-0\\.5{margin-left:.125rem}.crow-ml-2{margin-left:.5rem}.crow-ml-4{margin-left:1rem}.crow-mt-0{margin-top:0}.crow-mt-0\\.5{margin-top:.125rem}.crow-mt-1{margin-top:.25rem}.crow-mt-2{margin-top:.5rem}.crow-mt-auto{margin-top:auto}.crow-inline-block{display:inline-block}.crow-flex{display:flex}.crow-inline-flex{display:inline-flex}.crow-h-10{height:2.5rem}.crow-h-12{height:3rem}.crow-h-2{height:.5rem}.crow-h-3{height:.75rem}.crow-h-3\\.5{height:.875rem}.crow-h-4{height:1rem}.crow-h-7{height:1.75rem}.crow-h-8{height:2rem}.crow-h-full{height:100%}.crow-max-h-32{max-height:8rem}.crow-max-h-\\[200px\\]{max-height:200px}.crow-min-h-0{min-height:0}.crow-min-h-\\[32px\\]{min-height:32px}.crow-w-0{width:0}.crow-w-0\\.5{width:.125rem}.crow-w-2{width:.5rem}.crow-w-3{width:.75rem}.crow-w-3\\.5{width:.875rem}.crow-w-4{width:1rem}.crow-w-7{width:1.75rem}.crow-w-8{width:2rem}.crow-w-full{width:100%}.crow-min-w-0{min-width:0}.crow-min-w-\\[180px\\]{min-width:180px}.crow-max-w-\\[80\\%\\]{max-width:80%}.crow-max-w-\\[90\\%\\]{max-width:90%}.crow-max-w-full{max-width:100%}.crow-flex-1{flex:1 1 0%}.crow-flex-shrink-0{flex-shrink:0}.crow-rotate-180{--tw-rotate:180deg}.crow-rotate-180,.crow-scale-100{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.crow-scale-100{--tw-scale-x:1;--tw-scale-y:1}.crow-scale-110{--tw-scale-x:1.1;--tw-scale-y:1.1;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.crow-animate-fade-in{animation:crow-fadeIn .2s ease-out}.crow-animate-pulse{animation:crow-pulse 2s cubic-bezier(.4,0,.6,1) infinite}.crow-animate-slide-up{animation:crow-slideUp .3s ease-out}@keyframes crow-spin{to{transform:rotate(1turn)}}.crow-animate-spin{animation:crow-spin 1s linear infinite}.crow-cursor-default{cursor:default}.crow-cursor-not-allowed{cursor:not-allowed}.crow-cursor-pointer{cursor:pointer}.crow-select-none{-webkit-user-select:none;-moz-user-select:none;user-select:none}.crow-resize-none{resize:none}.crow-list-decimal{list-style-type:decimal}.crow-list-disc{list-style-type:disc}.crow-flex-row{flex-direction:row}.crow-flex-col{flex-direction:column}.crow-items-start{align-items:flex-start}.crow-items-end{align-items:flex-end}.crow-items-center{align-items:center}.crow-justify-start{justify-content:flex-start}.crow-justify-end{justify-content:flex-end}.crow-justify-center{justify-content:center}.crow-justify-between{justify-content:space-between}.crow-gap-1{gap:.25rem}.crow-gap-1\\.5{gap:.375rem}.crow-gap-2{gap:.5rem}.crow-gap-3{gap:.75rem}.crow-gap-4{gap:1rem}.crow-gap-6{gap:1.5rem}.crow-space-y-1>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(.25rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.25rem*var(--tw-space-y-reverse))}.crow-space-y-1\\.5>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(.375rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.375rem*var(--tw-space-y-reverse))}.crow-space-y-2>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(.5rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.5rem*var(--tw-space-y-reverse))}.crow-space-y-3>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(.75rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.75rem*var(--tw-space-y-reverse))}.crow-space-y-4>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(1rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1rem*var(--tw-space-y-reverse))}.crow-overflow-hidden{overflow:hidden}.crow-overflow-visible{overflow:visible}.crow-overflow-x-auto{overflow-x:auto}.crow-overflow-y-auto{overflow-y:auto}.crow-truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.crow-whitespace-pre-wrap{white-space:pre-wrap}.crow-break-words{overflow-wrap:break-word}.crow-rounded{border-radius:.25rem}.crow-rounded-2xl{border-radius:1rem}.crow-rounded-3xl{border-radius:1.5rem}.crow-rounded-full{border-radius:9999px}.crow-rounded-lg{border-radius:.5rem}.crow-rounded-md{border-radius:.375rem}.crow-rounded-xl{border-radius:.75rem}.crow-border{border-width:1px}.crow-border-b{border-bottom-width:1px}.crow-border-l{border-left-width:1px}.crow-border-l-2{border-left-width:2px}.crow-border-r{border-right-width:1px}.crow-border-t{border-top-width:1px}.crow-border-none{border-style:none}.crow-border-gray-100{--tw-border-opacity:1;border-color:rgb(243 244 246/var(--tw-border-opacity,1))}.crow-border-gray-200{--tw-border-opacity:1;border-color:rgb(229 231 235/var(--tw-border-opacity,1))}.crow-border-gray-300{--tw-border-opacity:1;border-color:rgb(209 213 219/var(--tw-border-opacity,1))}.crow-border-red-500{--tw-border-opacity:1;border-color:rgb(239 68 68/var(--tw-border-opacity,1))}.crow-bg-black{--tw-bg-opacity:1;background-color:rgb(0 0 0/var(--tw-bg-opacity,1))}.crow-bg-blue-50{--tw-bg-opacity:1;background-color:rgb(239 246 255/var(--tw-bg-opacity,1))}.crow-bg-gray-100{--tw-bg-opacity:1;background-color:rgb(243 244 246/var(--tw-bg-opacity,1))}.crow-bg-gray-200{--tw-bg-opacity:1;background-color:rgb(229 231 235/var(--tw-bg-opacity,1))}.crow-bg-gray-400{--tw-bg-opacity:1;background-color:rgb(156 163 175/var(--tw-bg-opacity,1))}.crow-bg-gray-50{--tw-bg-opacity:1;background-color:rgb(249 250 251/var(--tw-bg-opacity,1))}.crow-bg-gray-700{--tw-bg-opacity:1;background-color:rgb(55 65 81/var(--tw-bg-opacity,1))}.crow-bg-gray-800{--tw-bg-opacity:1;background-color:rgb(31 41 55/var(--tw-bg-opacity,1))}.crow-bg-gray-900{--tw-bg-opacity:1;background-color:rgb(17 24 39/var(--tw-bg-opacity,1))}.crow-bg-red-500{--tw-bg-opacity:1;background-color:rgb(239 68 68/var(--tw-bg-opacity,1))}.crow-bg-transparent{background-color:transparent}.crow-bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1))}.crow-p-0{padding:0}.crow-p-1{padding:.25rem}.crow-p-1\\.5{padding:.375rem}.crow-p-2{padding:.5rem}.crow-p-3{padding:.75rem}.crow-p-4{padding:1rem}.crow-p-6{padding:1.5rem}.crow-px-1{padding-left:.25rem;padding-right:.25rem}.crow-px-2{padding-left:.5rem;padding-right:.5rem}.crow-px-3{padding-left:.75rem;padding-right:.75rem}.crow-px-4{padding-left:1rem;padding-right:1rem}.crow-px-6{padding-left:1.5rem;padding-right:1.5rem}.crow-py-0{padding-top:0;padding-bottom:0}.crow-py-0\\.5{padding-top:.125rem;padding-bottom:.125rem}.crow-py-1{padding-top:.25rem;padding-bottom:.25rem}.crow-py-1\\.5{padding-top:.375rem;padding-bottom:.375rem}.crow-py-2{padding-top:.5rem;padding-bottom:.5rem}.crow-py-3{padding-top:.75rem;padding-bottom:.75rem}.crow-py-6{padding-top:1.5rem;padding-bottom:1.5rem}.crow-py-8{padding-top:2rem;padding-bottom:2rem}.crow-pb-2{padding-bottom:.5rem}.crow-pl-3{padding-left:.75rem}.crow-pl-4{padding-left:1rem}.crow-pl-5{padding-left:1.25rem}.crow-pr-4{padding-right:1rem}.crow-pt-1{padding-top:.25rem}.crow-text-left{text-align:left}.crow-text-center{text-align:center}.crow-text-right{text-align:right}.crow-align-text-bottom{vertical-align:text-bottom}.crow-font-mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}.crow-text-base{font-size:1rem;line-height:1.5rem}.crow-text-lg{font-size:1.125rem;line-height:1.75rem}.crow-text-sm{font-size:.875rem;line-height:1.25rem}.crow-text-xs{font-size:.75rem;line-height:1rem}.crow-font-bold{font-weight:700}.crow-font-medium{font-weight:500}.crow-font-semibold{font-weight:600}.crow-uppercase{text-transform:uppercase}.crow-leading-relaxed{line-height:1.625}.crow-tracking-wide{letter-spacing:.025em}.crow-text-black{--tw-text-opacity:1;color:rgb(0 0 0/var(--tw-text-opacity,1))}.crow-text-blue-300{--tw-text-opacity:1;color:rgb(147 197 253/var(--tw-text-opacity,1))}.crow-text-blue-500{--tw-text-opacity:1;color:rgb(59 130 246/var(--tw-text-opacity,1))}.crow-text-gray-400{--tw-text-opacity:1;color:rgb(156 163 175/var(--tw-text-opacity,1))}.crow-text-gray-500{--tw-text-opacity:1;color:rgb(107 114 128/var(--tw-text-opacity,1))}.crow-text-gray-600{--tw-text-opacity:1;color:rgb(75 85 99/var(--tw-text-opacity,1))}.crow-text-gray-700{--tw-text-opacity:1;color:rgb(55 65 81/var(--tw-text-opacity,1))}.crow-text-gray-800{--tw-text-opacity:1;color:rgb(31 41 55/var(--tw-text-opacity,1))}.crow-text-gray-900{--tw-text-opacity:1;color:rgb(17 24 39/var(--tw-text-opacity,1))}.crow-text-green-500{--tw-text-opacity:1;color:rgb(34 197 94/var(--tw-text-opacity,1))}.crow-text-red-500{--tw-text-opacity:1;color:rgb(239 68 68/var(--tw-text-opacity,1))}.crow-text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.crow-underline{text-decoration-line:underline}.crow-opacity-0{opacity:0}.crow-opacity-100{opacity:1}.crow-opacity-50{opacity:.5}.crow-opacity-60{opacity:.6}.crow-shadow-2xl{--tw-shadow:0 25px 50px -12px rgba(0,0,0,.25);--tw-shadow-colored:0 25px 50px -12px var(--tw-shadow-color)}.crow-shadow-2xl,.crow-shadow-lg{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.crow-shadow-lg{--tw-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color),0 4px 6px -4px var(--tw-shadow-color)}.crow-shadow-md{--tw-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -2px rgba(0,0,0,.1);--tw-shadow-colored:0 4px 6px -1px var(--tw-shadow-color),0 2px 4px -2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.crow-backdrop-blur-md{--tw-backdrop-blur:blur(12px)}.crow-backdrop-blur-md,.crow-backdrop-blur-sm{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)}.crow-backdrop-blur-sm{--tw-backdrop-blur:blur(4px)}.crow-transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.crow-transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.crow-transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.crow-transition-opacity{transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.crow-transition-transform{transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.crow-duration-150{transition-duration:.15s}.crow-duration-200{transition-duration:.2s}.crow-duration-300{transition-duration:.3s}.crow-duration-500{transition-duration:.5s}.crow-ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}.crow-animate-fade-in{animation:crow-fadeIn .2s ease-out}.crow-animate-slide-up{animation:crow-slideUp .3s ease-out}.crow-animate-pulse{animation:crow-pulse 1.5s ease-in-out infinite}.crow-animation-delay-100{animation-delay:.1s}.crow-animation-delay-200{animation-delay:.2s}@keyframes crow-fadeIn{0%{opacity:0}to{opacity:1}}@keyframes crow-slideUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes crow-pulse{0%,to{opacity:1}50%{opacity:.4}}.crow-overflow-y-auto::-webkit-scrollbar{width:6px}.crow-overflow-y-auto::-webkit-scrollbar-track{background:transparent}.crow-overflow-y-auto::-webkit-scrollbar-thumb{background-color:#d1d5db;border-radius:3px}.crow-overflow-y-auto::-webkit-scrollbar-thumb:hover{background-color:#9ca3af}.crow-focus-visible\\:crow-outline-none:focus-visible{outline:none}.crow-focus-visible\\:crow-ring-2:focus-visible{box-shadow:0 0 0 2px var(--crow-primary,#6366f1)}:host{--crow-primary:#6366f1;--crow-primary-dark:#4f46e5;--crow-secondary:#f1f5f9;--crow-accent:#10b981}@media (prefers-color-scheme:dark){:host{--crow-primary:#818cf8;--crow-primary-dark:#6366f1}}.placeholder\\:crow-text-gray-500::-moz-placeholder{--tw-text-opacity:1;color:rgb(107 114 128/var(--tw-text-opacity,1))}.placeholder\\:crow-text-gray-500::placeholder{--tw-text-opacity:1;color:rgb(107 114 128/var(--tw-text-opacity,1))}.last\\:crow-mb-0:last-child{margin-bottom:0}.last\\:crow-border-0:last-child{border-width:0}.hover\\:crow-scale-110:hover{--tw-scale-x:1.1;--tw-scale-y:1.1;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.hover\\:crow-bg-gray-100:hover{--tw-bg-opacity:1;background-color:rgb(243 244 246/var(--tw-bg-opacity,1))}.hover\\:crow-bg-gray-200:hover{--tw-bg-opacity:1;background-color:rgb(229 231 235/var(--tw-bg-opacity,1))}.hover\\:crow-bg-gray-700:hover{--tw-bg-opacity:1;background-color:rgb(55 65 81/var(--tw-bg-opacity,1))}.hover\\:crow-bg-gray-800:hover{--tw-bg-opacity:1;background-color:rgb(31 41 55/var(--tw-bg-opacity,1))}.hover\\:crow-bg-red-500:hover{--tw-bg-opacity:1;background-color:rgb(239 68 68/var(--tw-bg-opacity,1))}.hover\\:crow-text-blue-300:hover{--tw-text-opacity:1;color:rgb(147 197 253/var(--tw-text-opacity,1))}.hover\\:crow-text-gray-700:hover{--tw-text-opacity:1;color:rgb(55 65 81/var(--tw-text-opacity,1))}.hover\\:crow-text-gray-800:hover{--tw-text-opacity:1;color:rgb(31 41 55/var(--tw-text-opacity,1))}.hover\\:crow-opacity-100:hover{opacity:1}.focus\\:crow-outline-none:focus{outline:2px solid transparent;outline-offset:2px}.focus\\:crow-ring-0:focus{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(var(--tw-ring-offset-width)) var(--tw-ring-color)}.focus\\:crow-ring-0:focus,.focus\\:crow-ring-2:focus{box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.focus\\:crow-ring-2:focus{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color)}.focus\\:crow-ring-offset-2:focus{--tw-ring-offset-width:2px}.focus-visible\\:crow-outline-none:focus-visible{outline:2px solid transparent;outline-offset:2px}.focus-visible\\:crow-ring-0:focus-visible{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.disabled\\:crow-pointer-events-none:disabled{pointer-events:none}.disabled\\:crow-cursor-not-allowed:disabled{cursor:not-allowed}.disabled\\:crow-opacity-50:disabled{opacity:.5}`;
|
|
2270
|
+
var injected = false;
|
|
2271
|
+
function injectStyles(target = document) {
|
|
2272
|
+
if (target === document && injected) return;
|
|
2273
|
+
if (typeof document === "undefined") return;
|
|
2274
|
+
const existingStyle = target === document ? document.getElementById(STYLE_ID) : target.querySelector(`#${STYLE_ID}`);
|
|
2275
|
+
if (existingStyle) {
|
|
2276
|
+
if (target === document) injected = true;
|
|
2277
|
+
return;
|
|
2278
|
+
}
|
|
2279
|
+
const style = document.createElement("style");
|
|
2280
|
+
style.id = STYLE_ID;
|
|
2281
|
+
style.textContent = WIDGET_CSS;
|
|
2282
|
+
if (target === document) {
|
|
2283
|
+
document.head.appendChild(style);
|
|
2284
|
+
injected = true;
|
|
2285
|
+
} else {
|
|
2286
|
+
target.prepend(style);
|
|
2287
|
+
}
|
|
2288
|
+
}
|
|
2207
2289
|
function CrowWidget({
|
|
2208
2290
|
productId,
|
|
2209
2291
|
apiUrl = "",
|
|
2210
2292
|
variant = "floating",
|
|
2211
2293
|
styles: propStyles,
|
|
2212
2294
|
previewMode = false,
|
|
2213
|
-
onReady
|
|
2295
|
+
onReady,
|
|
2296
|
+
onIdentify,
|
|
2297
|
+
tools
|
|
2214
2298
|
}) {
|
|
2215
|
-
const { styles
|
|
2299
|
+
const { styles, isLoading: isLoadingStyles, agentName } = useWidgetStyles({
|
|
2216
2300
|
productId,
|
|
2217
2301
|
apiUrl,
|
|
2218
2302
|
propStyles,
|
|
2219
2303
|
skip: previewMode
|
|
2220
2304
|
});
|
|
2305
|
+
const cssVars = stylesToCssVars(styles);
|
|
2221
2306
|
const messagesContainerRef = React3.useRef(null);
|
|
2222
2307
|
const executeClientToolRef = React3.useRef(null);
|
|
2223
2308
|
const submitToolResultRef = React3.useRef(null);
|
|
@@ -2342,6 +2427,23 @@ function CrowWidget({
|
|
|
2342
2427
|
onReady?.();
|
|
2343
2428
|
}
|
|
2344
2429
|
}, [isLoadingStyles, onReady]);
|
|
2430
|
+
React3.useEffect(() => {
|
|
2431
|
+
if (!isLoadingStyles && onIdentify) {
|
|
2432
|
+
const identify = (data) => {
|
|
2433
|
+
if (!data.token) {
|
|
2434
|
+
console.error("[Crow] identify() requires a token");
|
|
2435
|
+
return;
|
|
2436
|
+
}
|
|
2437
|
+
window.crow?.("identify", data);
|
|
2438
|
+
};
|
|
2439
|
+
onIdentify(identify);
|
|
2440
|
+
}
|
|
2441
|
+
}, [isLoadingStyles, onIdentify]);
|
|
2442
|
+
React3.useEffect(() => {
|
|
2443
|
+
if (tools && Object.keys(tools).length > 0) {
|
|
2444
|
+
window.crow?.("registerTools", tools);
|
|
2445
|
+
}
|
|
2446
|
+
}, [tools]);
|
|
2345
2447
|
const handleSend = (message) => {
|
|
2346
2448
|
if (!message.trim()) return;
|
|
2347
2449
|
setIsCollapsed(false);
|
|
@@ -2376,118 +2478,71 @@ function CrowWidget({
|
|
|
2376
2478
|
const handleBubbleClick = () => {
|
|
2377
2479
|
setIsCollapsed(!isCollapsed);
|
|
2378
2480
|
};
|
|
2379
|
-
|
|
2481
|
+
const renderWidgetContent = () => /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
2482
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2483
|
+
WidgetHeader,
|
|
2484
|
+
{
|
|
2485
|
+
isVerifiedUser,
|
|
2486
|
+
showConversationList,
|
|
2487
|
+
onNewChat: handleNewChat,
|
|
2488
|
+
onToggleHistory: handleToggleHistory
|
|
2489
|
+
}
|
|
2490
|
+
),
|
|
2491
|
+
/* @__PURE__ */ jsxRuntime.jsx(framerMotion.AnimatePresence, { children: showConversationList && isVerifiedUser && /* @__PURE__ */ jsxRuntime.jsx(
|
|
2492
|
+
ConversationList,
|
|
2493
|
+
{
|
|
2494
|
+
conversations: conversations.conversations,
|
|
2495
|
+
currentConversationId: chat.conversationId,
|
|
2496
|
+
onSelect: handleSelectConversation,
|
|
2497
|
+
onClose: handleCloseConversationList
|
|
2498
|
+
}
|
|
2499
|
+
) }),
|
|
2500
|
+
/* @__PURE__ */ jsxRuntime.jsx(framerMotion.AnimatePresence, { children: activeWorkflow && /* @__PURE__ */ jsxRuntime.jsx(
|
|
2501
|
+
WorkflowPanel,
|
|
2502
|
+
{
|
|
2503
|
+
workflow: activeWorkflow,
|
|
2504
|
+
onExit: handleExitWorkflow
|
|
2505
|
+
}
|
|
2506
|
+
) }),
|
|
2507
|
+
/* @__PURE__ */ jsxRuntime.jsx(framerMotion.AnimatePresence, { children: (chat.messages.length > 0 || conversations.isLoadingHistory) && /* @__PURE__ */ jsxRuntime.jsx(MessagesContainer, { ref: messagesContainerRef, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
2508
|
+
MessageList,
|
|
2509
|
+
{
|
|
2510
|
+
messages: chat.messages,
|
|
2511
|
+
activeToolCalls: chat.activeToolCalls,
|
|
2512
|
+
isLoadingHistory: conversations.isLoadingHistory,
|
|
2513
|
+
isGenerating: chat.isLoading
|
|
2514
|
+
}
|
|
2515
|
+
) }) }),
|
|
2516
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "crow-mt-auto crow-w-full", children: [
|
|
2517
|
+
/* @__PURE__ */ jsxRuntime.jsx(PoweredByBadge, { apiUrl }),
|
|
2518
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2519
|
+
PromptInputBox,
|
|
2520
|
+
{
|
|
2521
|
+
onSend: handleSend,
|
|
2522
|
+
onStop: chat.stopGeneration,
|
|
2523
|
+
placeholder: "Type your message...",
|
|
2524
|
+
isLoading: chat.isLoading,
|
|
2525
|
+
className: "crow-backdrop-blur-md"
|
|
2526
|
+
}
|
|
2527
|
+
)
|
|
2528
|
+
] })
|
|
2529
|
+
] });
|
|
2530
|
+
return /* @__PURE__ */ jsxRuntime.jsx(ShadowContainer, { styles: WIDGET_CSS, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "crow-widget-root", style: cssVars, children: /* @__PURE__ */ jsxRuntime.jsxs(
|
|
2380
2531
|
WidgetStyleProvider,
|
|
2381
2532
|
{
|
|
2382
|
-
styles
|
|
2533
|
+
styles,
|
|
2383
2534
|
agentName,
|
|
2384
2535
|
isLoading: isLoadingStyles,
|
|
2385
2536
|
variant,
|
|
2386
2537
|
children: [
|
|
2387
2538
|
variant === "floating" && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
2388
2539
|
/* @__PURE__ */ jsxRuntime.jsx(ChatBubble, { isExpanded: !isCollapsed, onClick: handleBubbleClick }),
|
|
2389
|
-
!isCollapsed && /* @__PURE__ */ jsxRuntime.
|
|
2390
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2391
|
-
WidgetHeader,
|
|
2392
|
-
{
|
|
2393
|
-
isVerifiedUser,
|
|
2394
|
-
showConversationList,
|
|
2395
|
-
onNewChat: handleNewChat,
|
|
2396
|
-
onToggleHistory: handleToggleHistory
|
|
2397
|
-
}
|
|
2398
|
-
),
|
|
2399
|
-
/* @__PURE__ */ jsxRuntime.jsx(framerMotion.AnimatePresence, { children: showConversationList && isVerifiedUser && /* @__PURE__ */ jsxRuntime.jsx(
|
|
2400
|
-
ConversationList,
|
|
2401
|
-
{
|
|
2402
|
-
conversations: conversations.conversations,
|
|
2403
|
-
currentConversationId: chat.conversationId,
|
|
2404
|
-
onSelect: handleSelectConversation,
|
|
2405
|
-
onClose: handleCloseConversationList
|
|
2406
|
-
}
|
|
2407
|
-
) }),
|
|
2408
|
-
/* @__PURE__ */ jsxRuntime.jsx(framerMotion.AnimatePresence, { children: activeWorkflow && /* @__PURE__ */ jsxRuntime.jsx(
|
|
2409
|
-
WorkflowPanel,
|
|
2410
|
-
{
|
|
2411
|
-
workflow: activeWorkflow,
|
|
2412
|
-
onExit: handleExitWorkflow
|
|
2413
|
-
}
|
|
2414
|
-
) }),
|
|
2415
|
-
/* @__PURE__ */ jsxRuntime.jsx(framerMotion.AnimatePresence, { children: (chat.messages.length > 0 || conversations.isLoadingHistory) && /* @__PURE__ */ jsxRuntime.jsx(MessagesContainer, { ref: messagesContainerRef, maxHeight: styles2.dimensions.messagesMaxHeight, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
2416
|
-
MessageList,
|
|
2417
|
-
{
|
|
2418
|
-
messages: chat.messages,
|
|
2419
|
-
activeToolCalls: chat.activeToolCalls,
|
|
2420
|
-
isLoadingHistory: conversations.isLoadingHistory,
|
|
2421
|
-
isGenerating: chat.isLoading
|
|
2422
|
-
}
|
|
2423
|
-
) }) }),
|
|
2424
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "crow-mt-auto", children: [
|
|
2425
|
-
/* @__PURE__ */ jsxRuntime.jsx(PoweredByBadge, { apiUrl }),
|
|
2426
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2427
|
-
PromptInputBox,
|
|
2428
|
-
{
|
|
2429
|
-
onSend: handleSend,
|
|
2430
|
-
onStop: chat.stopGeneration,
|
|
2431
|
-
placeholder: "Type your message...",
|
|
2432
|
-
isLoading: chat.isLoading,
|
|
2433
|
-
className: "crow-backdrop-blur-md"
|
|
2434
|
-
}
|
|
2435
|
-
)
|
|
2436
|
-
] })
|
|
2437
|
-
] })
|
|
2540
|
+
!isCollapsed && /* @__PURE__ */ jsxRuntime.jsx(WidgetShell, { children: renderWidgetContent() })
|
|
2438
2541
|
] }),
|
|
2439
|
-
variant === "embedded" && /* @__PURE__ */ jsxRuntime.
|
|
2440
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2441
|
-
WidgetHeader,
|
|
2442
|
-
{
|
|
2443
|
-
isVerifiedUser,
|
|
2444
|
-
showConversationList,
|
|
2445
|
-
onNewChat: handleNewChat,
|
|
2446
|
-
onToggleHistory: handleToggleHistory
|
|
2447
|
-
}
|
|
2448
|
-
),
|
|
2449
|
-
/* @__PURE__ */ jsxRuntime.jsx(framerMotion.AnimatePresence, { children: showConversationList && isVerifiedUser && /* @__PURE__ */ jsxRuntime.jsx(
|
|
2450
|
-
ConversationList,
|
|
2451
|
-
{
|
|
2452
|
-
conversations: conversations.conversations,
|
|
2453
|
-
currentConversationId: chat.conversationId,
|
|
2454
|
-
onSelect: handleSelectConversation,
|
|
2455
|
-
onClose: handleCloseConversationList
|
|
2456
|
-
}
|
|
2457
|
-
) }),
|
|
2458
|
-
/* @__PURE__ */ jsxRuntime.jsx(framerMotion.AnimatePresence, { children: activeWorkflow && /* @__PURE__ */ jsxRuntime.jsx(
|
|
2459
|
-
WorkflowPanel,
|
|
2460
|
-
{
|
|
2461
|
-
workflow: activeWorkflow,
|
|
2462
|
-
onExit: handleExitWorkflow
|
|
2463
|
-
}
|
|
2464
|
-
) }),
|
|
2465
|
-
/* @__PURE__ */ jsxRuntime.jsx(framerMotion.AnimatePresence, { children: (chat.messages.length > 0 || conversations.isLoadingHistory) && /* @__PURE__ */ jsxRuntime.jsx(MessagesContainer, { ref: messagesContainerRef, maxHeight: styles2.dimensions.messagesMaxHeight, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
2466
|
-
MessageList,
|
|
2467
|
-
{
|
|
2468
|
-
messages: chat.messages,
|
|
2469
|
-
activeToolCalls: chat.activeToolCalls,
|
|
2470
|
-
isLoadingHistory: conversations.isLoadingHistory,
|
|
2471
|
-
isGenerating: chat.isLoading
|
|
2472
|
-
}
|
|
2473
|
-
) }) }),
|
|
2474
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "crow-mt-auto", children: [
|
|
2475
|
-
/* @__PURE__ */ jsxRuntime.jsx(PoweredByBadge, { apiUrl }),
|
|
2476
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2477
|
-
PromptInputBox,
|
|
2478
|
-
{
|
|
2479
|
-
onSend: handleSend,
|
|
2480
|
-
onStop: chat.stopGeneration,
|
|
2481
|
-
placeholder: "Type your message...",
|
|
2482
|
-
isLoading: chat.isLoading,
|
|
2483
|
-
className: "crow-backdrop-blur-md"
|
|
2484
|
-
}
|
|
2485
|
-
)
|
|
2486
|
-
] })
|
|
2487
|
-
] })
|
|
2542
|
+
variant === "embedded" && /* @__PURE__ */ jsxRuntime.jsx(WidgetShell, { children: renderWidgetContent() })
|
|
2488
2543
|
]
|
|
2489
2544
|
}
|
|
2490
|
-
);
|
|
2545
|
+
) }) });
|
|
2491
2546
|
}
|
|
2492
2547
|
function CrowCopilot({
|
|
2493
2548
|
productId,
|
|
@@ -2502,7 +2557,7 @@ function CrowCopilot({
|
|
|
2502
2557
|
className,
|
|
2503
2558
|
onReady
|
|
2504
2559
|
}) {
|
|
2505
|
-
const { styles
|
|
2560
|
+
const { styles, isLoading: isLoadingStyles, agentName } = useCopilotStyles({
|
|
2506
2561
|
productId,
|
|
2507
2562
|
apiUrl,
|
|
2508
2563
|
propStyles,
|
|
@@ -2591,7 +2646,7 @@ function CrowCopilot({
|
|
|
2591
2646
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
2592
2647
|
CopilotStyleProvider,
|
|
2593
2648
|
{
|
|
2594
|
-
styles
|
|
2649
|
+
styles,
|
|
2595
2650
|
agentName: agentName || title,
|
|
2596
2651
|
isLoading: isLoadingStyles,
|
|
2597
2652
|
children: /* @__PURE__ */ jsxRuntime.jsxs(
|
|
@@ -2600,13 +2655,13 @@ function CrowCopilot({
|
|
|
2600
2655
|
className: `crow-flex crow-flex-col crow-h-full ${position === "left" ? "crow-border-r" : "crow-border-l"} ${className || ""}`,
|
|
2601
2656
|
style: {
|
|
2602
2657
|
width: widthStyle,
|
|
2603
|
-
fontFamily:
|
|
2604
|
-
fontSize:
|
|
2605
|
-
fontWeight:
|
|
2606
|
-
lineHeight:
|
|
2607
|
-
letterSpacing:
|
|
2608
|
-
background:
|
|
2609
|
-
borderColor:
|
|
2658
|
+
fontFamily: styles.typography.fontFamily,
|
|
2659
|
+
fontSize: styles.typography.fontSize,
|
|
2660
|
+
fontWeight: styles.typography.fontWeight,
|
|
2661
|
+
lineHeight: styles.typography.lineHeight,
|
|
2662
|
+
letterSpacing: styles.typography.letterSpacing,
|
|
2663
|
+
background: styles.colors.background,
|
|
2664
|
+
borderColor: styles.colors.border
|
|
2610
2665
|
},
|
|
2611
2666
|
children: [
|
|
2612
2667
|
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
@@ -2614,8 +2669,8 @@ function CrowCopilot({
|
|
|
2614
2669
|
{
|
|
2615
2670
|
className: "crow-flex crow-items-center crow-justify-between crow-px-4 crow-py-3 crow-border-b",
|
|
2616
2671
|
style: {
|
|
2617
|
-
height:
|
|
2618
|
-
borderColor:
|
|
2672
|
+
height: styles.dimensions.headerHeight,
|
|
2673
|
+
borderColor: styles.colors.border
|
|
2619
2674
|
},
|
|
2620
2675
|
children: [
|
|
2621
2676
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -2623,8 +2678,8 @@ function CrowCopilot({
|
|
|
2623
2678
|
{
|
|
2624
2679
|
className: "crow-font-semibold",
|
|
2625
2680
|
style: {
|
|
2626
|
-
color:
|
|
2627
|
-
fontSize:
|
|
2681
|
+
color: styles.colors.text,
|
|
2682
|
+
fontSize: styles.typography.headerFontSize
|
|
2628
2683
|
},
|
|
2629
2684
|
children: agentName || title
|
|
2630
2685
|
}
|
|
@@ -2681,8 +2736,8 @@ function CrowCopilot({
|
|
|
2681
2736
|
isGenerating: chat.isLoading
|
|
2682
2737
|
}
|
|
2683
2738
|
) }),
|
|
2684
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "crow-p-3 crow-border-t", style: { borderColor:
|
|
2685
|
-
|
|
2739
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "crow-p-3 crow-border-t", style: { borderColor: styles.colors.border }, children: [
|
|
2740
|
+
styles.branding.showPoweredBy && /* @__PURE__ */ jsxRuntime.jsx(PoweredByBadge, { apiUrl }),
|
|
2686
2741
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2687
2742
|
PromptInputBox,
|
|
2688
2743
|
{
|
|
@@ -2785,6 +2840,7 @@ function CrowProvider({
|
|
|
2785
2840
|
}
|
|
2786
2841
|
|
|
2787
2842
|
exports.AVAILABLE_MODELS = AVAILABLE_MODELS;
|
|
2843
|
+
exports.CSS_VAR_NAMES = CSS_VAR_NAMES;
|
|
2788
2844
|
exports.ChatBubble = ChatBubble;
|
|
2789
2845
|
exports.ConversationList = ConversationList;
|
|
2790
2846
|
exports.CopilotStyleProvider = CopilotStyleProvider;
|
|
@@ -2795,7 +2851,6 @@ exports.DEFAULT_COPILOT_STYLES = DEFAULT_COPILOT_STYLES;
|
|
|
2795
2851
|
exports.DEFAULT_MODEL = DEFAULT_MODEL;
|
|
2796
2852
|
exports.DEFAULT_WELCOME_MESSAGE = DEFAULT_WELCOME_MESSAGE;
|
|
2797
2853
|
exports.DEFAULT_WIDGET_STYLES = DEFAULT_WIDGET_STYLES;
|
|
2798
|
-
exports.GlassCard = GlassCard;
|
|
2799
2854
|
exports.LoadingHistory = LoadingHistory;
|
|
2800
2855
|
exports.MESSAGES_CONTAINER_ID = MESSAGES_CONTAINER_ID;
|
|
2801
2856
|
exports.MessageBubble = MessageBubble;
|
|
@@ -2805,16 +2860,21 @@ exports.ModelSelector = ModelSelector;
|
|
|
2805
2860
|
exports.PoweredByBadge = PoweredByBadge;
|
|
2806
2861
|
exports.PromptInputBox = PromptInputBox;
|
|
2807
2862
|
exports.ReasoningTrace = ReasoningTrace;
|
|
2863
|
+
exports.ShadowContainer = ShadowContainer;
|
|
2808
2864
|
exports.StreamingText = StreamingText;
|
|
2809
2865
|
exports.ThinkingIndicator = ThinkingIndicator;
|
|
2866
|
+
exports.WIDGET_CSS = WIDGET_CSS;
|
|
2810
2867
|
exports.WidgetHeader = WidgetHeader;
|
|
2811
2868
|
exports.WidgetShell = WidgetShell;
|
|
2812
2869
|
exports.WidgetStyleProvider = WidgetStyleProvider;
|
|
2813
2870
|
exports.WorkflowPanel = WorkflowPanel;
|
|
2814
2871
|
exports.clearStyleCache = clearStyleCache;
|
|
2872
|
+
exports.getCssVar = getCssVar;
|
|
2873
|
+
exports.injectStyles = injectStyles;
|
|
2815
2874
|
exports.mergeCopilotStyles = mergeCopilotStyles;
|
|
2816
2875
|
exports.mergeWidgetStyles = mergeWidgetStyles;
|
|
2817
2876
|
exports.stylesToCSSVariables = stylesToCSSVariables;
|
|
2877
|
+
exports.stylesToCssVars = stylesToCssVars;
|
|
2818
2878
|
exports.useChat = useChat;
|
|
2819
2879
|
exports.useConversations = useConversations;
|
|
2820
2880
|
exports.useCopilotStyleContext = useCopilotStyleContext;
|