@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.d.cts
CHANGED
|
@@ -182,6 +182,21 @@ interface WidgetConfigResponse {
|
|
|
182
182
|
copilotStyles: CopilotStyleConfig;
|
|
183
183
|
}
|
|
184
184
|
|
|
185
|
+
/** Identity data passed to the identify function */
|
|
186
|
+
interface IdentifyData {
|
|
187
|
+
/** JWT token from your backend */
|
|
188
|
+
token: string;
|
|
189
|
+
/** User's display name */
|
|
190
|
+
name?: string;
|
|
191
|
+
/** Additional metadata */
|
|
192
|
+
[key: string]: unknown;
|
|
193
|
+
}
|
|
194
|
+
/** Function to identify a user */
|
|
195
|
+
type IdentifyFunction = (data: IdentifyData) => void;
|
|
196
|
+
/** Client-side tool handler */
|
|
197
|
+
type ToolHandler = (args: Record<string, unknown>) => Promise<unknown> | unknown;
|
|
198
|
+
/** Map of tool names to handlers */
|
|
199
|
+
type ToolsMap = Record<string, ToolHandler>;
|
|
185
200
|
interface CrowWidgetProps {
|
|
186
201
|
/** Product ID for this widget */
|
|
187
202
|
productId: string;
|
|
@@ -195,8 +210,15 @@ interface CrowWidgetProps {
|
|
|
195
210
|
previewMode?: boolean;
|
|
196
211
|
/** Callback when widget is ready */
|
|
197
212
|
onReady?: () => void;
|
|
213
|
+
/**
|
|
214
|
+
* Callback to identify the user. Called with an identify function
|
|
215
|
+
* that you should call with the user's token when available.
|
|
216
|
+
*/
|
|
217
|
+
onIdentify?: (identify: IdentifyFunction) => void;
|
|
218
|
+
/** Client-side tools the agent can call */
|
|
219
|
+
tools?: ToolsMap;
|
|
198
220
|
}
|
|
199
|
-
declare function CrowWidget({ productId, apiUrl, variant, styles: propStyles, previewMode, onReady, }: CrowWidgetProps): react_jsx_runtime.JSX.Element;
|
|
221
|
+
declare function CrowWidget({ productId, apiUrl, variant, styles: propStyles, previewMode, onReady, onIdentify, tools, }: CrowWidgetProps): react_jsx_runtime.JSX.Element;
|
|
200
222
|
|
|
201
223
|
interface CrowCopilotProps {
|
|
202
224
|
/** Product ID for this copilot */
|
|
@@ -291,6 +313,112 @@ declare function mergeCopilotStyles(dbStyles?: CopilotStyleConfig, propStyles?:
|
|
|
291
313
|
*/
|
|
292
314
|
declare function stylesToCSSVariables(styles: ResolvedWidgetStyles | ResolvedCopilotStyles): Record<string, string | number>;
|
|
293
315
|
|
|
316
|
+
/**
|
|
317
|
+
* CSS Custom Properties Utility
|
|
318
|
+
*
|
|
319
|
+
* Converts the nested style configuration to CSS custom properties (variables).
|
|
320
|
+
* These variables are applied to the widget root element and consumed by
|
|
321
|
+
* component-specific CSS classes.
|
|
322
|
+
*/
|
|
323
|
+
|
|
324
|
+
/**
|
|
325
|
+
* CSS variable names used by the widget.
|
|
326
|
+
* Components reference these via var(--crow-*) in CSS.
|
|
327
|
+
*/
|
|
328
|
+
declare const CSS_VAR_NAMES: {
|
|
329
|
+
readonly colors: {
|
|
330
|
+
readonly primary: "--crow-colors-primary";
|
|
331
|
+
readonly background: "--crow-colors-background";
|
|
332
|
+
readonly border: "--crow-colors-border";
|
|
333
|
+
readonly text: "--crow-colors-text";
|
|
334
|
+
readonly botBubble: "--crow-colors-bot-bubble";
|
|
335
|
+
readonly botText: "--crow-colors-bot-text";
|
|
336
|
+
readonly userBubble: "--crow-colors-user-bubble";
|
|
337
|
+
readonly userText: "--crow-colors-user-text";
|
|
338
|
+
readonly userBorder: "--crow-colors-user-border";
|
|
339
|
+
readonly messagesBackground: "--crow-colors-messages-background";
|
|
340
|
+
readonly bubbleBackground: "--crow-colors-bubble-background";
|
|
341
|
+
readonly bubbleBorder: "--crow-colors-bubble-border";
|
|
342
|
+
readonly bubbleIcon: "--crow-colors-bubble-icon";
|
|
343
|
+
};
|
|
344
|
+
readonly dimensions: {
|
|
345
|
+
readonly width: "--crow-dimensions-width";
|
|
346
|
+
readonly maxHeight: "--crow-dimensions-max-height";
|
|
347
|
+
readonly messagesMaxHeight: "--crow-dimensions-messages-max-height";
|
|
348
|
+
readonly borderRadius: "--crow-dimensions-border-radius";
|
|
349
|
+
readonly padding: "--crow-dimensions-padding";
|
|
350
|
+
};
|
|
351
|
+
readonly typography: {
|
|
352
|
+
readonly fontFamily: "--crow-typography-font-family";
|
|
353
|
+
readonly fontSize: "--crow-typography-font-size";
|
|
354
|
+
readonly headerFontSize: "--crow-typography-header-font-size";
|
|
355
|
+
readonly fontWeight: "--crow-typography-font-weight";
|
|
356
|
+
readonly lineHeight: "--crow-typography-line-height";
|
|
357
|
+
readonly letterSpacing: "--crow-typography-letter-spacing";
|
|
358
|
+
};
|
|
359
|
+
readonly position: {
|
|
360
|
+
readonly right: "--crow-position-right";
|
|
361
|
+
readonly bottom: "--crow-position-bottom";
|
|
362
|
+
readonly bubbleRight: "--crow-position-bubble-right";
|
|
363
|
+
readonly bubbleBottom: "--crow-position-bubble-bottom";
|
|
364
|
+
};
|
|
365
|
+
readonly bubble: {
|
|
366
|
+
readonly size: "--crow-bubble-size";
|
|
367
|
+
readonly iconSize: "--crow-bubble-icon-size";
|
|
368
|
+
};
|
|
369
|
+
readonly shadows: {
|
|
370
|
+
readonly widget: "--crow-shadows-widget";
|
|
371
|
+
readonly bubble: "--crow-shadows-bubble";
|
|
372
|
+
};
|
|
373
|
+
readonly animations: {
|
|
374
|
+
readonly duration: "--crow-animations-duration";
|
|
375
|
+
};
|
|
376
|
+
};
|
|
377
|
+
/**
|
|
378
|
+
* Convert a resolved widget style configuration to CSS custom properties.
|
|
379
|
+
*
|
|
380
|
+
* @param styles - The fully resolved widget styles (with all defaults applied)
|
|
381
|
+
* @returns An object of CSS variable name to value, suitable for use as React inline styles
|
|
382
|
+
*
|
|
383
|
+
* @example
|
|
384
|
+
* const cssVars = stylesToCssVars(resolvedStyles);
|
|
385
|
+
* // Returns: { '--crow-colors-background': 'rgba(255,255,255,0.95)', ... }
|
|
386
|
+
* <div style={cssVars}>...</div>
|
|
387
|
+
*/
|
|
388
|
+
declare function stylesToCssVars(styles: ResolvedWidgetStyles): Record<string, string>;
|
|
389
|
+
/**
|
|
390
|
+
* Get a specific CSS variable value from the widget root element.
|
|
391
|
+
* Useful for JavaScript that needs to read current style values.
|
|
392
|
+
*
|
|
393
|
+
* @param varName - The CSS variable name (e.g., '--crow-colors-primary')
|
|
394
|
+
* @param element - The element to read from (defaults to document.documentElement)
|
|
395
|
+
* @returns The computed value of the CSS variable
|
|
396
|
+
*/
|
|
397
|
+
declare function getCssVar(varName: string, element?: Element): string;
|
|
398
|
+
|
|
399
|
+
/**
|
|
400
|
+
* CSS Styles for Crow Widget
|
|
401
|
+
*
|
|
402
|
+
* Exports the compiled CSS as a string for Shadow DOM injection.
|
|
403
|
+
* Auto-injection is disabled to prevent CSS leaking to host pages.
|
|
404
|
+
*
|
|
405
|
+
* DO NOT EDIT THE CSS_CONTENT - Generated by scripts/inject-css.js
|
|
406
|
+
*/
|
|
407
|
+
/**
|
|
408
|
+
* Compiled CSS content including Tailwind utilities with crow- prefix
|
|
409
|
+
* This should be injected into the Shadow DOM, not document.head
|
|
410
|
+
*/
|
|
411
|
+
declare const 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: }\n\n/*! 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}";
|
|
412
|
+
/**
|
|
413
|
+
* Inject styles into a target (document.head or ShadowRoot)
|
|
414
|
+
*
|
|
415
|
+
* For Shadow DOM usage, prefer passing the CSS string directly to ShadowContainer.
|
|
416
|
+
* This function is kept for backwards compatibility and non-Shadow DOM use cases.
|
|
417
|
+
*
|
|
418
|
+
* @param target - Where to inject styles (defaults to document.head)
|
|
419
|
+
*/
|
|
420
|
+
declare function injectStyles(target?: Document | ShadowRoot): void;
|
|
421
|
+
|
|
294
422
|
/**
|
|
295
423
|
* Shared TypeScript interfaces for the widget and copilot
|
|
296
424
|
*/
|
|
@@ -637,14 +765,6 @@ declare const DEFAULT_MODEL = "claude-sonnet-4-5-20250929";
|
|
|
637
765
|
declare const DEFAULT_WELCOME_MESSAGE = "Hi! How can I help you today?";
|
|
638
766
|
declare const MESSAGES_CONTAINER_ID = "crow-messages-container";
|
|
639
767
|
|
|
640
|
-
/**
|
|
641
|
-
* GlassCard - Glassmorphism card component
|
|
642
|
-
*/
|
|
643
|
-
interface GlassCardProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
644
|
-
children: React.ReactNode;
|
|
645
|
-
}
|
|
646
|
-
declare const GlassCard: react.ForwardRefExoticComponent<GlassCardProps & react.RefAttributes<HTMLDivElement>>;
|
|
647
|
-
|
|
648
768
|
/**
|
|
649
769
|
* StreamingText - Simple streaming text with blinking cursor
|
|
650
770
|
*/
|
|
@@ -689,7 +809,6 @@ declare function MessageList({ messages, activeToolCalls, isLoadingHistory, isGe
|
|
|
689
809
|
|
|
690
810
|
interface MessagesContainerProps {
|
|
691
811
|
children: ReactNode;
|
|
692
|
-
maxHeight?: number;
|
|
693
812
|
}
|
|
694
813
|
declare const MessagesContainer: react.ForwardRefExoticComponent<MessagesContainerProps & react.RefAttributes<HTMLDivElement>>;
|
|
695
814
|
|
|
@@ -743,6 +862,21 @@ interface PromptInputBoxProps {
|
|
|
743
862
|
}
|
|
744
863
|
declare const PromptInputBox: react__default.ForwardRefExoticComponent<PromptInputBoxProps & react__default.RefAttributes<HTMLDivElement>>;
|
|
745
864
|
|
|
865
|
+
interface ShadowContainerProps {
|
|
866
|
+
/** Content to render inside the Shadow DOM */
|
|
867
|
+
children: ReactNode;
|
|
868
|
+
/** CSS string to inject into the Shadow DOM */
|
|
869
|
+
styles: string;
|
|
870
|
+
/** Optional ID for the host element */
|
|
871
|
+
hostId?: string;
|
|
872
|
+
/** Optional class name for the host element */
|
|
873
|
+
hostClassName?: string;
|
|
874
|
+
}
|
|
875
|
+
declare function ShadowContainer({ children, styles, hostId, hostClassName, }: ShadowContainerProps): react_jsx_runtime.JSX.Element;
|
|
876
|
+
declare namespace ShadowContainer {
|
|
877
|
+
var displayName: string;
|
|
878
|
+
}
|
|
879
|
+
|
|
746
880
|
/**
|
|
747
881
|
* ChatBubble - Floating button to toggle widget
|
|
748
882
|
*/
|
|
@@ -772,4 +906,4 @@ interface WidgetHeaderProps {
|
|
|
772
906
|
}
|
|
773
907
|
declare function WidgetHeader({ isVerifiedUser, showConversationList, onNewChat, onToggleHistory, showMinimize, isMinimized, onToggleMinimize, }: WidgetHeaderProps): react_jsx_runtime.JSX.Element;
|
|
774
908
|
|
|
775
|
-
export { AVAILABLE_MODELS, type ActiveWorkflow, type AnimationsConfig, ChatBubble, type Citation, type ClientToolHandler, type ColorsConfig, type Conversation, ConversationList, type CopilotBrandingConfig, type CopilotDimensionsConfig, type CopilotPositionConfig, type CopilotStyleConfig, CopilotStyleProvider, CrowCopilot, type CrowCopilotProps, CrowProvider, CrowWidget, type CrowWidgetProps, DEFAULT_COPILOT_STYLES, DEFAULT_MODEL, DEFAULT_WELCOME_MESSAGE, DEFAULT_WIDGET_STYLES,
|
|
909
|
+
export { AVAILABLE_MODELS, type ActiveWorkflow, type AnimationsConfig, CSS_VAR_NAMES, ChatBubble, type Citation, type ClientToolHandler, type ColorsConfig, type Conversation, ConversationList, type CopilotBrandingConfig, type CopilotDimensionsConfig, type CopilotPositionConfig, type CopilotStyleConfig, CopilotStyleProvider, CrowCopilot, type CrowCopilotProps, CrowProvider, CrowWidget, type CrowWidgetProps, DEFAULT_COPILOT_STYLES, DEFAULT_MODEL, DEFAULT_WELCOME_MESSAGE, DEFAULT_WIDGET_STYLES, type IdentifyData, type IdentifyFunction, type JourneyEvent, LoadingHistory, MESSAGES_CONTAINER_ID, type Message, MessageBubble, MessageList, MessagesContainer, type Model, ModelSelector, PoweredByBadge, PromptInputBox, ReasoningTrace, type ResolvedCopilotStyles, type ResolvedWidgetStyles, ShadowContainer, StreamingText, ThinkingIndicator, type ToolCall, type ToolHandler, type ToolsMap, type TypographyConfig, WIDGET_CSS, type WidgetBrandingConfig, type WidgetBubbleConfig, type WidgetConfigResponse, type WidgetDimensionsConfig, WidgetHeader, type WidgetPositionConfig, type WidgetProps, type WidgetShadowsConfig, WidgetShell, type WidgetStyleConfig, WidgetStyleProvider, WorkflowPanel, type WorkflowTodo, clearStyleCache, getCssVar, injectStyles, mergeCopilotStyles, mergeWidgetStyles, stylesToCSSVariables, stylesToCssVars, useChat, useConversations, useCopilotStyleContext, useCopilotStyles$1 as useCopilotStyles, useCopilotStyles as useCopilotStylesContext, useCrowAPI, usePreviewCopilotStyles, usePreviewWidgetStyles, useWidgetStyleContext, useWidgetStyles$1 as useWidgetStyles, useWidgetStyles as useWidgetStylesContext, useWorkflow };
|
package/dist/index.d.ts
CHANGED
|
@@ -182,6 +182,21 @@ interface WidgetConfigResponse {
|
|
|
182
182
|
copilotStyles: CopilotStyleConfig;
|
|
183
183
|
}
|
|
184
184
|
|
|
185
|
+
/** Identity data passed to the identify function */
|
|
186
|
+
interface IdentifyData {
|
|
187
|
+
/** JWT token from your backend */
|
|
188
|
+
token: string;
|
|
189
|
+
/** User's display name */
|
|
190
|
+
name?: string;
|
|
191
|
+
/** Additional metadata */
|
|
192
|
+
[key: string]: unknown;
|
|
193
|
+
}
|
|
194
|
+
/** Function to identify a user */
|
|
195
|
+
type IdentifyFunction = (data: IdentifyData) => void;
|
|
196
|
+
/** Client-side tool handler */
|
|
197
|
+
type ToolHandler = (args: Record<string, unknown>) => Promise<unknown> | unknown;
|
|
198
|
+
/** Map of tool names to handlers */
|
|
199
|
+
type ToolsMap = Record<string, ToolHandler>;
|
|
185
200
|
interface CrowWidgetProps {
|
|
186
201
|
/** Product ID for this widget */
|
|
187
202
|
productId: string;
|
|
@@ -195,8 +210,15 @@ interface CrowWidgetProps {
|
|
|
195
210
|
previewMode?: boolean;
|
|
196
211
|
/** Callback when widget is ready */
|
|
197
212
|
onReady?: () => void;
|
|
213
|
+
/**
|
|
214
|
+
* Callback to identify the user. Called with an identify function
|
|
215
|
+
* that you should call with the user's token when available.
|
|
216
|
+
*/
|
|
217
|
+
onIdentify?: (identify: IdentifyFunction) => void;
|
|
218
|
+
/** Client-side tools the agent can call */
|
|
219
|
+
tools?: ToolsMap;
|
|
198
220
|
}
|
|
199
|
-
declare function CrowWidget({ productId, apiUrl, variant, styles: propStyles, previewMode, onReady, }: CrowWidgetProps): react_jsx_runtime.JSX.Element;
|
|
221
|
+
declare function CrowWidget({ productId, apiUrl, variant, styles: propStyles, previewMode, onReady, onIdentify, tools, }: CrowWidgetProps): react_jsx_runtime.JSX.Element;
|
|
200
222
|
|
|
201
223
|
interface CrowCopilotProps {
|
|
202
224
|
/** Product ID for this copilot */
|
|
@@ -291,6 +313,112 @@ declare function mergeCopilotStyles(dbStyles?: CopilotStyleConfig, propStyles?:
|
|
|
291
313
|
*/
|
|
292
314
|
declare function stylesToCSSVariables(styles: ResolvedWidgetStyles | ResolvedCopilotStyles): Record<string, string | number>;
|
|
293
315
|
|
|
316
|
+
/**
|
|
317
|
+
* CSS Custom Properties Utility
|
|
318
|
+
*
|
|
319
|
+
* Converts the nested style configuration to CSS custom properties (variables).
|
|
320
|
+
* These variables are applied to the widget root element and consumed by
|
|
321
|
+
* component-specific CSS classes.
|
|
322
|
+
*/
|
|
323
|
+
|
|
324
|
+
/**
|
|
325
|
+
* CSS variable names used by the widget.
|
|
326
|
+
* Components reference these via var(--crow-*) in CSS.
|
|
327
|
+
*/
|
|
328
|
+
declare const CSS_VAR_NAMES: {
|
|
329
|
+
readonly colors: {
|
|
330
|
+
readonly primary: "--crow-colors-primary";
|
|
331
|
+
readonly background: "--crow-colors-background";
|
|
332
|
+
readonly border: "--crow-colors-border";
|
|
333
|
+
readonly text: "--crow-colors-text";
|
|
334
|
+
readonly botBubble: "--crow-colors-bot-bubble";
|
|
335
|
+
readonly botText: "--crow-colors-bot-text";
|
|
336
|
+
readonly userBubble: "--crow-colors-user-bubble";
|
|
337
|
+
readonly userText: "--crow-colors-user-text";
|
|
338
|
+
readonly userBorder: "--crow-colors-user-border";
|
|
339
|
+
readonly messagesBackground: "--crow-colors-messages-background";
|
|
340
|
+
readonly bubbleBackground: "--crow-colors-bubble-background";
|
|
341
|
+
readonly bubbleBorder: "--crow-colors-bubble-border";
|
|
342
|
+
readonly bubbleIcon: "--crow-colors-bubble-icon";
|
|
343
|
+
};
|
|
344
|
+
readonly dimensions: {
|
|
345
|
+
readonly width: "--crow-dimensions-width";
|
|
346
|
+
readonly maxHeight: "--crow-dimensions-max-height";
|
|
347
|
+
readonly messagesMaxHeight: "--crow-dimensions-messages-max-height";
|
|
348
|
+
readonly borderRadius: "--crow-dimensions-border-radius";
|
|
349
|
+
readonly padding: "--crow-dimensions-padding";
|
|
350
|
+
};
|
|
351
|
+
readonly typography: {
|
|
352
|
+
readonly fontFamily: "--crow-typography-font-family";
|
|
353
|
+
readonly fontSize: "--crow-typography-font-size";
|
|
354
|
+
readonly headerFontSize: "--crow-typography-header-font-size";
|
|
355
|
+
readonly fontWeight: "--crow-typography-font-weight";
|
|
356
|
+
readonly lineHeight: "--crow-typography-line-height";
|
|
357
|
+
readonly letterSpacing: "--crow-typography-letter-spacing";
|
|
358
|
+
};
|
|
359
|
+
readonly position: {
|
|
360
|
+
readonly right: "--crow-position-right";
|
|
361
|
+
readonly bottom: "--crow-position-bottom";
|
|
362
|
+
readonly bubbleRight: "--crow-position-bubble-right";
|
|
363
|
+
readonly bubbleBottom: "--crow-position-bubble-bottom";
|
|
364
|
+
};
|
|
365
|
+
readonly bubble: {
|
|
366
|
+
readonly size: "--crow-bubble-size";
|
|
367
|
+
readonly iconSize: "--crow-bubble-icon-size";
|
|
368
|
+
};
|
|
369
|
+
readonly shadows: {
|
|
370
|
+
readonly widget: "--crow-shadows-widget";
|
|
371
|
+
readonly bubble: "--crow-shadows-bubble";
|
|
372
|
+
};
|
|
373
|
+
readonly animations: {
|
|
374
|
+
readonly duration: "--crow-animations-duration";
|
|
375
|
+
};
|
|
376
|
+
};
|
|
377
|
+
/**
|
|
378
|
+
* Convert a resolved widget style configuration to CSS custom properties.
|
|
379
|
+
*
|
|
380
|
+
* @param styles - The fully resolved widget styles (with all defaults applied)
|
|
381
|
+
* @returns An object of CSS variable name to value, suitable for use as React inline styles
|
|
382
|
+
*
|
|
383
|
+
* @example
|
|
384
|
+
* const cssVars = stylesToCssVars(resolvedStyles);
|
|
385
|
+
* // Returns: { '--crow-colors-background': 'rgba(255,255,255,0.95)', ... }
|
|
386
|
+
* <div style={cssVars}>...</div>
|
|
387
|
+
*/
|
|
388
|
+
declare function stylesToCssVars(styles: ResolvedWidgetStyles): Record<string, string>;
|
|
389
|
+
/**
|
|
390
|
+
* Get a specific CSS variable value from the widget root element.
|
|
391
|
+
* Useful for JavaScript that needs to read current style values.
|
|
392
|
+
*
|
|
393
|
+
* @param varName - The CSS variable name (e.g., '--crow-colors-primary')
|
|
394
|
+
* @param element - The element to read from (defaults to document.documentElement)
|
|
395
|
+
* @returns The computed value of the CSS variable
|
|
396
|
+
*/
|
|
397
|
+
declare function getCssVar(varName: string, element?: Element): string;
|
|
398
|
+
|
|
399
|
+
/**
|
|
400
|
+
* CSS Styles for Crow Widget
|
|
401
|
+
*
|
|
402
|
+
* Exports the compiled CSS as a string for Shadow DOM injection.
|
|
403
|
+
* Auto-injection is disabled to prevent CSS leaking to host pages.
|
|
404
|
+
*
|
|
405
|
+
* DO NOT EDIT THE CSS_CONTENT - Generated by scripts/inject-css.js
|
|
406
|
+
*/
|
|
407
|
+
/**
|
|
408
|
+
* Compiled CSS content including Tailwind utilities with crow- prefix
|
|
409
|
+
* This should be injected into the Shadow DOM, not document.head
|
|
410
|
+
*/
|
|
411
|
+
declare const 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: }\n\n/*! 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}";
|
|
412
|
+
/**
|
|
413
|
+
* Inject styles into a target (document.head or ShadowRoot)
|
|
414
|
+
*
|
|
415
|
+
* For Shadow DOM usage, prefer passing the CSS string directly to ShadowContainer.
|
|
416
|
+
* This function is kept for backwards compatibility and non-Shadow DOM use cases.
|
|
417
|
+
*
|
|
418
|
+
* @param target - Where to inject styles (defaults to document.head)
|
|
419
|
+
*/
|
|
420
|
+
declare function injectStyles(target?: Document | ShadowRoot): void;
|
|
421
|
+
|
|
294
422
|
/**
|
|
295
423
|
* Shared TypeScript interfaces for the widget and copilot
|
|
296
424
|
*/
|
|
@@ -637,14 +765,6 @@ declare const DEFAULT_MODEL = "claude-sonnet-4-5-20250929";
|
|
|
637
765
|
declare const DEFAULT_WELCOME_MESSAGE = "Hi! How can I help you today?";
|
|
638
766
|
declare const MESSAGES_CONTAINER_ID = "crow-messages-container";
|
|
639
767
|
|
|
640
|
-
/**
|
|
641
|
-
* GlassCard - Glassmorphism card component
|
|
642
|
-
*/
|
|
643
|
-
interface GlassCardProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
644
|
-
children: React.ReactNode;
|
|
645
|
-
}
|
|
646
|
-
declare const GlassCard: react.ForwardRefExoticComponent<GlassCardProps & react.RefAttributes<HTMLDivElement>>;
|
|
647
|
-
|
|
648
768
|
/**
|
|
649
769
|
* StreamingText - Simple streaming text with blinking cursor
|
|
650
770
|
*/
|
|
@@ -689,7 +809,6 @@ declare function MessageList({ messages, activeToolCalls, isLoadingHistory, isGe
|
|
|
689
809
|
|
|
690
810
|
interface MessagesContainerProps {
|
|
691
811
|
children: ReactNode;
|
|
692
|
-
maxHeight?: number;
|
|
693
812
|
}
|
|
694
813
|
declare const MessagesContainer: react.ForwardRefExoticComponent<MessagesContainerProps & react.RefAttributes<HTMLDivElement>>;
|
|
695
814
|
|
|
@@ -743,6 +862,21 @@ interface PromptInputBoxProps {
|
|
|
743
862
|
}
|
|
744
863
|
declare const PromptInputBox: react__default.ForwardRefExoticComponent<PromptInputBoxProps & react__default.RefAttributes<HTMLDivElement>>;
|
|
745
864
|
|
|
865
|
+
interface ShadowContainerProps {
|
|
866
|
+
/** Content to render inside the Shadow DOM */
|
|
867
|
+
children: ReactNode;
|
|
868
|
+
/** CSS string to inject into the Shadow DOM */
|
|
869
|
+
styles: string;
|
|
870
|
+
/** Optional ID for the host element */
|
|
871
|
+
hostId?: string;
|
|
872
|
+
/** Optional class name for the host element */
|
|
873
|
+
hostClassName?: string;
|
|
874
|
+
}
|
|
875
|
+
declare function ShadowContainer({ children, styles, hostId, hostClassName, }: ShadowContainerProps): react_jsx_runtime.JSX.Element;
|
|
876
|
+
declare namespace ShadowContainer {
|
|
877
|
+
var displayName: string;
|
|
878
|
+
}
|
|
879
|
+
|
|
746
880
|
/**
|
|
747
881
|
* ChatBubble - Floating button to toggle widget
|
|
748
882
|
*/
|
|
@@ -772,4 +906,4 @@ interface WidgetHeaderProps {
|
|
|
772
906
|
}
|
|
773
907
|
declare function WidgetHeader({ isVerifiedUser, showConversationList, onNewChat, onToggleHistory, showMinimize, isMinimized, onToggleMinimize, }: WidgetHeaderProps): react_jsx_runtime.JSX.Element;
|
|
774
908
|
|
|
775
|
-
export { AVAILABLE_MODELS, type ActiveWorkflow, type AnimationsConfig, ChatBubble, type Citation, type ClientToolHandler, type ColorsConfig, type Conversation, ConversationList, type CopilotBrandingConfig, type CopilotDimensionsConfig, type CopilotPositionConfig, type CopilotStyleConfig, CopilotStyleProvider, CrowCopilot, type CrowCopilotProps, CrowProvider, CrowWidget, type CrowWidgetProps, DEFAULT_COPILOT_STYLES, DEFAULT_MODEL, DEFAULT_WELCOME_MESSAGE, DEFAULT_WIDGET_STYLES,
|
|
909
|
+
export { AVAILABLE_MODELS, type ActiveWorkflow, type AnimationsConfig, CSS_VAR_NAMES, ChatBubble, type Citation, type ClientToolHandler, type ColorsConfig, type Conversation, ConversationList, type CopilotBrandingConfig, type CopilotDimensionsConfig, type CopilotPositionConfig, type CopilotStyleConfig, CopilotStyleProvider, CrowCopilot, type CrowCopilotProps, CrowProvider, CrowWidget, type CrowWidgetProps, DEFAULT_COPILOT_STYLES, DEFAULT_MODEL, DEFAULT_WELCOME_MESSAGE, DEFAULT_WIDGET_STYLES, type IdentifyData, type IdentifyFunction, type JourneyEvent, LoadingHistory, MESSAGES_CONTAINER_ID, type Message, MessageBubble, MessageList, MessagesContainer, type Model, ModelSelector, PoweredByBadge, PromptInputBox, ReasoningTrace, type ResolvedCopilotStyles, type ResolvedWidgetStyles, ShadowContainer, StreamingText, ThinkingIndicator, type ToolCall, type ToolHandler, type ToolsMap, type TypographyConfig, WIDGET_CSS, type WidgetBrandingConfig, type WidgetBubbleConfig, type WidgetConfigResponse, type WidgetDimensionsConfig, WidgetHeader, type WidgetPositionConfig, type WidgetProps, type WidgetShadowsConfig, WidgetShell, type WidgetStyleConfig, WidgetStyleProvider, WorkflowPanel, type WorkflowTodo, clearStyleCache, getCssVar, injectStyles, mergeCopilotStyles, mergeWidgetStyles, stylesToCSSVariables, stylesToCssVars, useChat, useConversations, useCopilotStyleContext, useCopilotStyles$1 as useCopilotStyles, useCopilotStyles as useCopilotStylesContext, useCrowAPI, usePreviewCopilotStyles, usePreviewWidgetStyles, useWidgetStyleContext, useWidgetStyles$1 as useWidgetStyles, useWidgetStyles as useWidgetStylesContext, useWorkflow };
|