@uipath/apollo-wind 2.68.0 → 2.70.0

package/dist/components/ui/sources.js

@@ -0,0 +1,132 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { ChevronDown, Link2 } from "lucide-react";
+import { createContext, forwardRef, useContext } from "react";
+import { cn, safeHref } from "../../lib/index.js";
+import { Collapsible, CollapsibleContent, CollapsibleTrigger } from "./collapsible.js";
+const DEFAULT_SOURCES_STRINGS = {
+    sourceCount: (count)=>1 === count ? '1 source' : `${count} sources`,
+    opensInNewTab: '(opens in a new tab)'
+};
+const SourcesStringsContext = /*#__PURE__*/ createContext(DEFAULT_SOURCES_STRINGS);
+const Sources = /*#__PURE__*/ forwardRef(({ className, count, strings, children, ...props }, ref)=>{
+    const text = {
+        ...DEFAULT_SOURCES_STRINGS,
+        ...strings
+    };
+    return /*#__PURE__*/ jsx(SourcesStringsContext.Provider, {
+        value: text,
+        children: /*#__PURE__*/ jsxs(Collapsible, {
+            ref: ref,
+            "data-slot": "sources",
+            className: cn('group/sources flex w-full min-w-0 flex-col gap-2', className),
+            ...props,
+            children: [
+                /*#__PURE__*/ jsxs(CollapsibleTrigger, {
+                    "data-slot": "sources-trigger",
+                    className: "inline-flex h-7 w-fit cursor-pointer items-center gap-1.5 rounded-lg border border-border-subtle px-2.5 text-xs font-medium text-muted-foreground transition-colors hover:bg-surface-overlay hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring [&_svg]:size-3.5 [&_svg]:shrink-0",
+                    children: [
+                        /*#__PURE__*/ jsx(Link2, {
+                            "aria-hidden": "true"
+                        }),
+                        text.sourceCount(count),
+                        /*#__PURE__*/ jsx(ChevronDown, {
+                            "aria-hidden": "true",
+                            className: "transition-transform group-data-[state=open]/sources:rotate-180"
+                        })
+                    ]
+                }),
+                /*#__PURE__*/ jsx(CollapsibleContent, {
+                    "data-slot": "sources-content",
+                    className: "overflow-hidden data-[state=closed]:animate-collapsible-up data-[state=open]:animate-collapsible-down",
+                    children: children
+                })
+            ]
+        })
+    });
+});
+Sources.displayName = 'Sources';
+const SourcesList = /*#__PURE__*/ forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ jsx("ol", {
+        ref: ref,
+        "data-slot": "sources-list",
+        className: cn('flex flex-col gap-0.5 rounded-xl border border-border-subtle bg-card p-1', className),
+        ...props
+    }));
+SourcesList.displayName = 'SourcesList';
+const SourceItem = /*#__PURE__*/ forwardRef(({ className, index, title, source, snippet, href, icon, onSelect, onClick, target = '_blank', rel, ...props }, ref)=>{
+    const text = useContext(SourcesStringsContext);
+    const linkHref = safeHref(href);
+    const handleClick = (event)=>{
+        onClick?.(event);
+        if (!event.defaultPrevented) onSelect?.({
+            index,
+            title,
+            source,
+            snippet,
+            href: linkHref
+        }, event);
+    };
+    const itemClassName = cn('flex w-full min-w-0 cursor-pointer items-start gap-2.5 rounded-lg px-2 py-1.5 text-left text-sm transition-colors hover:bg-surface-overlay focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring', className);
+    const newTab = '_blank' === target;
+    const body = /*#__PURE__*/ jsxs(Fragment, {
+        children: [
+            /*#__PURE__*/ jsx("span", {
+                "data-slot": "source-index",
+                className: "mt-0.5 flex h-4.5 min-w-4.5 shrink-0 items-center justify-center rounded-full bg-muted px-1 text-[11px] font-medium leading-none text-muted-foreground tabular-nums",
+                children: index
+            }),
+            icon && /*#__PURE__*/ jsx("span", {
+                "data-slot": "source-icon",
+                className: "mt-0.5 flex size-4 shrink-0 items-center justify-center text-muted-foreground [&_img]:size-4 [&_img]:rounded-sm [&_svg]:size-4",
+                children: icon
+            }),
+            /*#__PURE__*/ jsxs("span", {
+                className: "flex min-w-0 flex-1 flex-col gap-0.5",
+                children: [
+                    /*#__PURE__*/ jsx("span", {
+                        "data-slot": "source-title",
+                        className: "truncate font-medium text-foreground",
+                        children: title
+                    }),
+                    source && /*#__PURE__*/ jsx("span", {
+                        "data-slot": "source-source",
+                        className: "truncate text-xs text-muted-foreground",
+                        children: source
+                    }),
+                    snippet && /*#__PURE__*/ jsx("span", {
+                        "data-slot": "source-snippet",
+                        className: "line-clamp-2 text-xs leading-relaxed text-muted-foreground",
+                        children: snippet
+                    })
+                ]
+            }),
+            linkHref && newTab && /*#__PURE__*/ jsx("span", {
+                className: "sr-only",
+                children: text.opensInNewTab
+            })
+        ]
+    });
+    return /*#__PURE__*/ jsx("li", {
+        "data-slot": "source-item",
+        className: "min-w-0",
+        children: linkHref ? /*#__PURE__*/ jsx("a", {
+            ref: ref,
+            href: linkHref,
+            target: target,
+            rel: rel ?? (newTab ? 'noopener noreferrer' : void 0),
+            className: itemClassName,
+            onClick: handleClick,
+            ...props,
+            children: body
+        }) : /*#__PURE__*/ jsx("button", {
+            ref: ref,
+            type: "button",
+            className: itemClassName,
+            onClick: handleClick,
+            ...props,
+            children: body
+        })
+    });
+});
+SourceItem.displayName = 'SourceItem';
+export { DEFAULT_SOURCES_STRINGS, SourceItem, Sources, SourcesList };

package/dist/components/ui/thinking-indicator.cjs

@@ -0,0 +1,146 @@
+"use strict";
+"use client";
+var __webpack_require__ = {};
+(()=>{
+    __webpack_require__.d = (exports1, definition)=>{
+        for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
+            enumerable: true,
+            get: definition[key]
+        });
+    };
+})();
+(()=>{
+    __webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
+})();
+(()=>{
+    __webpack_require__.r = (exports1)=>{
+        if ("u" > typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
+            value: 'Module'
+        });
+        Object.defineProperty(exports1, '__esModule', {
+            value: true
+        });
+    };
+})();
+var __webpack_exports__ = {};
+__webpack_require__.r(__webpack_exports__);
+__webpack_require__.d(__webpack_exports__, {
+    thinkingIndicatorVariants: ()=>thinkingIndicatorVariants,
+    DEFAULT_THINKING_INDICATOR_STRINGS: ()=>DEFAULT_THINKING_INDICATOR_STRINGS,
+    ThinkingIndicator: ()=>ThinkingIndicator
+});
+const jsx_runtime_namespaceObject = require("react/jsx-runtime");
+const external_class_variance_authority_namespaceObject = require("class-variance-authority");
+const external_lucide_react_namespaceObject = require("lucide-react");
+const external_react_namespaceObject = require("react");
+const index_cjs_namespaceObject = require("../../lib/index.cjs");
+const REDUCED_MOTION_QUERY = '(prefers-reduced-motion: reduce)';
+function getPrefersReducedMotion() {
+    if ("u" < typeof window || 'function' != typeof window.matchMedia) return false;
+    return window.matchMedia(REDUCED_MOTION_QUERY).matches;
+}
+function usePrefersReducedMotion() {
+    const [reduced, setReduced] = external_react_namespaceObject.useState(getPrefersReducedMotion);
+    external_react_namespaceObject.useEffect(()=>{
+        if ('function' != typeof window.matchMedia) return;
+        const mql = window.matchMedia(REDUCED_MOTION_QUERY);
+        const onChange = ()=>setReduced(mql.matches);
+        mql.addEventListener('change', onChange);
+        return ()=>mql.removeEventListener('change', onChange);
+    }, []);
+    return reduced;
+}
+const thinkingIndicatorVariants = (0, external_class_variance_authority_namespaceObject.cva)('inline-flex max-w-full min-w-0 items-center text-muted-foreground', {
+    variants: {
+        size: {
+            sm: 'gap-1.5 text-xs [&_[data-slot=thinking-indicator-icon]]:size-3.5',
+            md: 'gap-2 text-sm [&_[data-slot=thinking-indicator-icon]]:size-4'
+        }
+    },
+    defaultVariants: {
+        size: 'md'
+    }
+});
+const DEFAULT_THINKING_INDICATOR_STRINGS = {
+    label: 'Thinking'
+};
+const ThinkingIndicator = /*#__PURE__*/ external_react_namespaceObject.forwardRef(({ className, size = 'md', label, messages, interval = 2500, strings, icon, 'aria-label': ariaLabel, ...props }, ref)=>{
+    const text = {
+        ...DEFAULT_THINKING_INDICATOR_STRINGS,
+        ...strings
+    };
+    const staticLabel = label ?? text.label;
+    const name = ariaLabel ?? staticLabel;
+    const labels = messages && messages.length > 0 ? messages : [
+        staticLabel
+    ];
+    const reducedMotion = usePrefersReducedMotion();
+    const rotates = labels.length > 1 && !reducedMotion && interval > 0;
+    const rotationKey = `${rotates}\u0000${labels.join('\u0000')}`;
+    const [index, setIndex] = external_react_namespaceObject.useState(0);
+    const [prevRotationKey, setPrevRotationKey] = external_react_namespaceObject.useState(rotationKey);
+    if (rotationKey !== prevRotationKey) {
+        setPrevRotationKey(rotationKey);
+        setIndex(0);
+    }
+    external_react_namespaceObject.useEffect(()=>{
+        if (!rotates) return;
+        const id = window.setInterval(()=>{
+            setIndex((current)=>(current + 1) % labels.length);
+        }, interval);
+        return ()=>window.clearInterval(id);
+    }, [
+        rotates,
+        labels.length,
+        interval,
+        rotationKey
+    ]);
+    const activeIndex = index < labels.length ? index : 0;
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
+        ref: ref,
+        "data-slot": "thinking-indicator",
+        "data-size": size,
+        role: "status",
+        "aria-label": name,
+        className: (0, index_cjs_namespaceObject.cn)(thinkingIndicatorVariants({
+            size
+        }), className),
+        ...props,
+        children: [
+            null !== icon && false !== icon && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
+                "data-slot": "thinking-indicator-icon",
+                "aria-hidden": "true",
+                className: "inline-flex shrink-0 items-center justify-center [&>svg]:size-full",
+                children: icon ?? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_lucide_react_namespaceObject.Sparkles, {
+                    className: "text-primary animate-pulse motion-reduce:animate-none"
+                })
+            }),
+            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
+                "data-slot": "thinking-indicator-label",
+                "aria-hidden": "true",
+                className: "grid min-w-0",
+                children: labels.map((item, i)=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
+                        "data-active": i === activeIndex,
+                        className: "shimmer col-start-1 row-start-1 truncate transition-opacity duration-300 data-[active=false]:opacity-0 motion-reduce:transition-none",
+                        children: item
+                    }, i))
+            }),
+            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
+                className: "sr-only",
+                children: name
+            })
+        ]
+    });
+});
+ThinkingIndicator.displayName = 'ThinkingIndicator';
+exports.DEFAULT_THINKING_INDICATOR_STRINGS = __webpack_exports__.DEFAULT_THINKING_INDICATOR_STRINGS;
+exports.ThinkingIndicator = __webpack_exports__.ThinkingIndicator;
+exports.thinkingIndicatorVariants = __webpack_exports__.thinkingIndicatorVariants;
+for(var __rspack_i in __webpack_exports__)if (-1 === [
+    "DEFAULT_THINKING_INDICATOR_STRINGS",
+    "ThinkingIndicator",
+    "thinkingIndicatorVariants"
+].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});

package/dist/components/ui/thinking-indicator.d.ts

@@ -0,0 +1,38 @@
+import { type VariantProps } from 'class-variance-authority';
+import * as React from 'react';
+declare const thinkingIndicatorVariants: (props?: ({
+    size?: "sm" | "md" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export interface ThinkingIndicatorStrings {
+    /** Default visible label, and the accessible name unless `label` or `aria-label` is set. */
+    label: string;
+}
+export declare const DEFAULT_THINKING_INDICATOR_STRINGS: ThinkingIndicatorStrings;
+export interface ThinkingIndicatorProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'children'>, VariantProps<typeof thinkingIndicatorVariants> {
+    /** A single label. Also the accessible name when `messages` rotate. */
+    label?: string;
+    /** Labels to cycle through. The first shows immediately; reduced motion keeps it there. */
+    messages?: string[];
+    /** Milliseconds each of `messages` stays on screen. */
+    interval?: number;
+    /** Overrides for any subset of the English strings. An explicit `aria-label` wins over both. */
+    strings?: Partial<ThinkingIndicatorStrings>;
+    /**
+     * Replaces the pulsing sparkle; `null` or `false` shows the label alone. A custom icon brings
+     * its own colour and animation and is sized by the indicator's `size`.
+     */
+    icon?: React.ReactNode;
+}
+/**
+ * A "the assistant is working" row for a conversation: a pulsing sparkle and a shimmering label.
+ * Pass `messages` to cycle through progress labels ("Searching", "Reading files") every
+ * `interval` ms with a crossfade.
+ *
+ * Screen readers get one stable name (`label`, else `strings.label`) on a `role="status"` root,
+ * and the visual label is `aria-hidden`. Rotating labels are decoration, so announcing each one
+ * would only add noise. Announce real progress with `LiveRegion` instead.
+ *
+ * Under `prefers-reduced-motion` the icon and shimmer are static and the labels do not rotate.
+ */
+declare const ThinkingIndicator: React.ForwardRefExoticComponent<ThinkingIndicatorProps & React.RefAttributes<HTMLDivElement>>;
+export { ThinkingIndicator, thinkingIndicatorVariants };

package/dist/components/ui/thinking-indicator.js

@@ -0,0 +1,106 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { cva } from "class-variance-authority";
+import { Sparkles } from "lucide-react";
+import { forwardRef, useEffect, useState } from "react";
+import { cn } from "../../lib/index.js";
+const REDUCED_MOTION_QUERY = '(prefers-reduced-motion: reduce)';
+function getPrefersReducedMotion() {
+    if ("u" < typeof window || 'function' != typeof window.matchMedia) return false;
+    return window.matchMedia(REDUCED_MOTION_QUERY).matches;
+}
+function usePrefersReducedMotion() {
+    const [reduced, setReduced] = useState(getPrefersReducedMotion);
+    useEffect(()=>{
+        if ('function' != typeof window.matchMedia) return;
+        const mql = window.matchMedia(REDUCED_MOTION_QUERY);
+        const onChange = ()=>setReduced(mql.matches);
+        mql.addEventListener('change', onChange);
+        return ()=>mql.removeEventListener('change', onChange);
+    }, []);
+    return reduced;
+}
+const thinkingIndicatorVariants = cva('inline-flex max-w-full min-w-0 items-center text-muted-foreground', {
+    variants: {
+        size: {
+            sm: 'gap-1.5 text-xs [&_[data-slot=thinking-indicator-icon]]:size-3.5',
+            md: 'gap-2 text-sm [&_[data-slot=thinking-indicator-icon]]:size-4'
+        }
+    },
+    defaultVariants: {
+        size: 'md'
+    }
+});
+const DEFAULT_THINKING_INDICATOR_STRINGS = {
+    label: 'Thinking'
+};
+const ThinkingIndicator = /*#__PURE__*/ forwardRef(({ className, size = 'md', label, messages, interval = 2500, strings, icon, 'aria-label': ariaLabel, ...props }, ref)=>{
+    const text = {
+        ...DEFAULT_THINKING_INDICATOR_STRINGS,
+        ...strings
+    };
+    const staticLabel = label ?? text.label;
+    const name = ariaLabel ?? staticLabel;
+    const labels = messages && messages.length > 0 ? messages : [
+        staticLabel
+    ];
+    const reducedMotion = usePrefersReducedMotion();
+    const rotates = labels.length > 1 && !reducedMotion && interval > 0;
+    const rotationKey = `${rotates}\u0000${labels.join('\u0000')}`;
+    const [index, setIndex] = useState(0);
+    const [prevRotationKey, setPrevRotationKey] = useState(rotationKey);
+    if (rotationKey !== prevRotationKey) {
+        setPrevRotationKey(rotationKey);
+        setIndex(0);
+    }
+    useEffect(()=>{
+        if (!rotates) return;
+        const id = window.setInterval(()=>{
+            setIndex((current)=>(current + 1) % labels.length);
+        }, interval);
+        return ()=>window.clearInterval(id);
+    }, [
+        rotates,
+        labels.length,
+        interval,
+        rotationKey
+    ]);
+    const activeIndex = index < labels.length ? index : 0;
+    return /*#__PURE__*/ jsxs("div", {
+        ref: ref,
+        "data-slot": "thinking-indicator",
+        "data-size": size,
+        role: "status",
+        "aria-label": name,
+        className: cn(thinkingIndicatorVariants({
+            size
+        }), className),
+        ...props,
+        children: [
+            null !== icon && false !== icon && /*#__PURE__*/ jsx("span", {
+                "data-slot": "thinking-indicator-icon",
+                "aria-hidden": "true",
+                className: "inline-flex shrink-0 items-center justify-center [&>svg]:size-full",
+                children: icon ?? /*#__PURE__*/ jsx(Sparkles, {
+                    className: "text-primary animate-pulse motion-reduce:animate-none"
+                })
+            }),
+            /*#__PURE__*/ jsx("span", {
+                "data-slot": "thinking-indicator-label",
+                "aria-hidden": "true",
+                className: "grid min-w-0",
+                children: labels.map((item, i)=>/*#__PURE__*/ jsx("span", {
+                        "data-active": i === activeIndex,
+                        className: "shimmer col-start-1 row-start-1 truncate transition-opacity duration-300 data-[active=false]:opacity-0 motion-reduce:transition-none",
+                        children: item
+                    }, i))
+            }),
+            /*#__PURE__*/ jsx("span", {
+                className: "sr-only",
+                children: name
+            })
+        ]
+    });
+});
+ThinkingIndicator.displayName = 'ThinkingIndicator';
+export { DEFAULT_THINKING_INDICATOR_STRINGS, ThinkingIndicator, thinkingIndicatorVariants };