instantsearch-ui-components 0.11.1 → 0.12.0

package/dist/es/components/chat/icons.js

@@ -0,0 +1,355 @@
+export function SparklesIconComponent(_ref) {
+  var createElement = _ref.createElement,
+    _ref$width = _ref.width,
+    width = _ref$width === void 0 ? 20 : _ref$width,
+    _ref$height = _ref.height,
+    height = _ref$height === void 0 ? 20 : _ref$height;
+  return createElement("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: width,
+    height: height,
+    fill: "none",
+    viewBox: "0 0 20 20"
+  }, createElement("path", {
+    fill: "currentColor",
+    fillRule: "evenodd",
+    d: "M10 1.875c.27 0 .51.173.594.43l1.593 4.844a1.043 1.043 0 0 0 .664.664l4.844 1.593a.625.625 0 0 1 0 1.188l-4.844 1.593a1.043 1.043 0 0 0-.664.664l-1.593 4.844a.625.625 0 0 1-1.188 0l-1.593-4.844a1.042 1.042 0 0 0-.664-.664l-4.844-1.593a.625.625 0 0 1 0-1.188l4.844-1.593a1.042 1.042 0 0 0 .664-.664l1.593-4.844a.625.625 0 0 1 .594-.43ZM9 7.539A2.292 2.292 0 0 1 7.54 9L4.5 10l3.04 1A2.292 2.292 0 0 1 9 12.46l1 3.04 1-3.04A2.293 2.293 0 0 1 12.46 11l3.04-1-3.04-1A2.292 2.292 0 0 1 11 7.54L10 4.5 9 7.54ZM4.167 1.875c.345 0 .625.28.625.625v3.333a.625.625 0 0 1-1.25 0V2.5c0-.345.28-.625.625-.625ZM15.833 13.542c.345 0 .625.28.625.625V17.5a.625.625 0 1 1-1.25 0v-3.333c0-.345.28-.625.625-.625Z",
+    clipRule: "evenodd"
+  }), createElement("path", {
+    fill: "currentColor",
+    fillRule: "evenodd",
+    d: "M1.875 4.167c0-.346.28-.625.625-.625h3.333a.625.625 0 1 1 0 1.25H2.5a.625.625 0 0 1-.625-.625ZM13.542 15.833c0-.345.28-.625.625-.625H17.5a.625.625 0 0 1 0 1.25h-3.333a.625.625 0 0 1-.625-.625Z",
+    clipRule: "evenodd"
+  }));
+}
+export function ArrowUpIconComponent(_ref2) {
+  var createElement = _ref2.createElement,
+    _ref2$width = _ref2.width,
+    width = _ref2$width === void 0 ? 16 : _ref2$width,
+    _ref2$height = _ref2.height,
+    height = _ref2$height === void 0 ? 16 : _ref2$height;
+  return createElement("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: width,
+    height: height,
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }, createElement("path", {
+    d: "m5 12 7-7 7 7"
+  }), createElement("path", {
+    d: "M12 19V5"
+  }));
+}
+export function ArrowRightIconComponent(_ref3) {
+  var createElement = _ref3.createElement,
+    _ref3$width = _ref3.width,
+    width = _ref3$width === void 0 ? 16 : _ref3$width,
+    _ref3$height = _ref3.height,
+    height = _ref3$height === void 0 ? 16 : _ref3$height;
+  return createElement("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: width,
+    height: height,
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }, createElement("path", {
+    d: "M5 12h14"
+  }), createElement("path", {
+    d: "m12 5 7 7-7 7"
+  }));
+}
+export function ChevronUpIconComponent(_ref4) {
+  var createElement = _ref4.createElement,
+    _ref4$width = _ref4.width,
+    width = _ref4$width === void 0 ? 16 : _ref4$width,
+    _ref4$height = _ref4.height,
+    height = _ref4$height === void 0 ? 16 : _ref4$height;
+  return createElement("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: width,
+    height: height,
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }, createElement("path", {
+    d: "m18 15-6-6-6 6"
+  }));
+}
+export function ChevronDownIconComponent(_ref5) {
+  var createElement = _ref5.createElement,
+    _ref5$width = _ref5.width,
+    width = _ref5$width === void 0 ? 16 : _ref5$width,
+    _ref5$height = _ref5.height,
+    height = _ref5$height === void 0 ? 16 : _ref5$height;
+  return createElement("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: width,
+    height: height,
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }, createElement("path", {
+    d: "m6 9 6 6 6-6"
+  }));
+}
+export function CloseIconComponent(_ref6) {
+  var createElement = _ref6.createElement,
+    _ref6$width = _ref6.width,
+    width = _ref6$width === void 0 ? 16 : _ref6$width,
+    _ref6$height = _ref6.height,
+    height = _ref6$height === void 0 ? 16 : _ref6$height;
+  return createElement("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: width,
+    height: height,
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }, createElement("path", {
+    d: "M18 6 6 18"
+  }), createElement("path", {
+    d: "m6 6 12 12"
+  }));
+}
+export function MaximizeIconComponent(_ref7) {
+  var createElement = _ref7.createElement,
+    _ref7$width = _ref7.width,
+    width = _ref7$width === void 0 ? 16 : _ref7$width,
+    _ref7$height = _ref7.height,
+    height = _ref7$height === void 0 ? 16 : _ref7$height;
+  return createElement("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: width,
+    height: height,
+    viewBox: "0 0 24 24",
+    fill: "none",
+    strokeWidth: "2",
+    stroke: "currentColor",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }, createElement("path", {
+    d: "M15 3h6v6"
+  }), createElement("path", {
+    d: "m21 3-7 7"
+  }), createElement("path", {
+    d: "m3 21 7-7"
+  }), createElement("path", {
+    d: "M9 21H3v-6"
+  }));
+}
+export function MinimizeIconComponent(_ref8) {
+  var createElement = _ref8.createElement,
+    _ref8$width = _ref8.width,
+    width = _ref8$width === void 0 ? 16 : _ref8$width,
+    _ref8$height = _ref8.height,
+    height = _ref8$height === void 0 ? 16 : _ref8$height;
+  return createElement("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: width,
+    height: height,
+    viewBox: "0 0 24 24",
+    fill: "none",
+    strokeWidth: "2",
+    stroke: "currentColor",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }, createElement("path", {
+    d: "m14 10 7-7"
+  }), createElement("path", {
+    d: "M20 10h-6V4"
+  }), createElement("path", {
+    d: "m3 21 7-7"
+  }), createElement("path", {
+    d: "M4 14h6v6"
+  }));
+}
+export function StopIconComponent(_ref9) {
+  var createElement = _ref9.createElement,
+    _ref9$width = _ref9.width,
+    width = _ref9$width === void 0 ? 16 : _ref9$width,
+    _ref9$height = _ref9.height,
+    height = _ref9$height === void 0 ? 16 : _ref9$height;
+  return createElement("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: width,
+    height: height,
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }, createElement("circle", {
+    cx: "12",
+    cy: "12",
+    r: "10"
+  }), createElement("rect", {
+    x: "9",
+    y: "9",
+    width: "6",
+    height: "6",
+    rx: "1"
+  }));
+}
+export function ReloadIconComponent(_ref10) {
+  var createElement = _ref10.createElement,
+    _ref10$width = _ref10.width,
+    width = _ref10$width === void 0 ? 16 : _ref10$width,
+    _ref10$height = _ref10.height,
+    height = _ref10$height === void 0 ? 16 : _ref10$height;
+  return createElement("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: width,
+    height: height,
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }, createElement("path", {
+    d: "M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"
+  }), createElement("path", {
+    d: "M21 3v5h-5"
+  }), createElement("path", {
+    d: "M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"
+  }), createElement("path", {
+    d: "M3 21v-5h5"
+  }));
+}
+export function CopyIconComponent(_ref11) {
+  var createElement = _ref11.createElement,
+    _ref11$width = _ref11.width,
+    width = _ref11$width === void 0 ? 16 : _ref11$width,
+    _ref11$height = _ref11.height,
+    height = _ref11$height === void 0 ? 16 : _ref11$height;
+  return createElement("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: width,
+    height: height,
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }, createElement("rect", {
+    width: "14",
+    height: "14",
+    x: "8",
+    y: "8",
+    rx: "2",
+    ry: "2"
+  }), createElement("path", {
+    d: "M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2"
+  }));
+}
+export function MenuIconComponent(_ref12) {
+  var createElement = _ref12.createElement,
+    _ref12$width = _ref12.width,
+    width = _ref12$width === void 0 ? 16 : _ref12$width,
+    _ref12$height = _ref12.height,
+    height = _ref12$height === void 0 ? 16 : _ref12$height;
+  return createElement("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: width,
+    height: height,
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }, createElement("circle", {
+    cx: "12",
+    cy: "12",
+    r: "1"
+  }), createElement("circle", {
+    cx: "12",
+    cy: "5",
+    r: "1"
+  }), createElement("circle", {
+    cx: "12",
+    cy: "19",
+    r: "1"
+  }));
+}
+export function LoadingSpinnerIconComponent(_ref13) {
+  var createElement = _ref13.createElement,
+    _ref13$width = _ref13.width,
+    width = _ref13$width === void 0 ? 24 : _ref13$width,
+    _ref13$height = _ref13.height,
+    height = _ref13$height === void 0 ? 24 : _ref13$height;
+  return createElement("svg", {
+    viewBox: "12 12 24 24",
+    width: width,
+    height: height,
+    role: "status",
+    "aria-busy": "true",
+    "aria-live": "polite"
+  }, createElement("title", null, "Loading spinner"), createElement("circle", {
+    cx: "24",
+    cy: "24",
+    r: "11",
+    fill: "none",
+    strokeWidth: "2",
+    stroke: "currentColor"
+  }));
+}
+export function ChevronLeftIconComponent(_ref14) {
+  var createElement = _ref14.createElement,
+    _ref14$width = _ref14.width,
+    width = _ref14$width === void 0 ? 16 : _ref14$width,
+    _ref14$height = _ref14.height,
+    height = _ref14$height === void 0 ? 16 : _ref14$height;
+  return createElement("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: width,
+    height: height,
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }, createElement("path", {
+    d: "m15 18-6-6 6-6"
+  }));
+}
+export function ChevronRightIconComponent(_ref15) {
+  var createElement = _ref15.createElement,
+    _ref15$width = _ref15.width,
+    width = _ref15$width === void 0 ? 16 : _ref15$width,
+    _ref15$height = _ref15.height,
+    height = _ref15$height === void 0 ? 16 : _ref15$height;
+  return createElement("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: width,
+    height: height,
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }, createElement("path", {
+    d: "m9 18 6-6-6-6"
+  }));
+}

package/dist/es/components/chat/types.d.ts

@@ -0,0 +1,29 @@
+import type { AbstractChat, ChatInit, UIMessage } from 'ai';
+export type ChatStatus = 'ready' | 'submitted' | 'streaming' | 'error';
+export type ChatRole = 'data' | 'user' | 'assistant' | 'system';
+export type ChatMessageBase = UIMessage;
+export type ChatToolMessage = Extract<ChatMessageBase['parts'][number], {
+    type: `tool-${string}`;
+}>;
+export type ChatToolType = ChatToolMessage['type'];
+export type { ChatInit } from 'ai';
+export type AddToolResult = AbstractChat<UIMessage>['addToolResult'];
+export type AddToolResultWithOutput = (params: Pick<Parameters<AddToolResult>[0], 'output'>) => ReturnType<AddToolResult>;
+export type ClientSideToolComponentProps = {
+    message: ChatToolMessage;
+    indexUiState: object;
+    setIndexUiState: (state: object) => void;
+    onClose: () => void;
+    addToolResult: AddToolResultWithOutput;
+};
+export type ClientSideToolComponent = (props: ClientSideToolComponentProps) => JSX.Element;
+export type ClientSideTool = {
+    layoutComponent: ClientSideToolComponent;
+    addToolResult: AddToolResult;
+    onToolCall?: (params: Parameters<NonNullable<ChatInit<UIMessage>['onToolCall']>>[0]['toolCall'] & {
+        addToolResult: AddToolResultWithOutput;
+    }) => void;
+};
+export type ClientSideTools = Record<string, ClientSideTool>;
+export type UserClientSideTool = Omit<ClientSideTool, 'addToolResult'>;
+export type UserClientSideTools = Record<string, UserClientSideTool>;

package/dist/es/components/chat/types.js

@@ -0,0 +1 @@
+export {};

package/dist/es/components/index.d.ts

@@ -1,4 +1,16 @@
+export * from './autocomplete';
+export * from './Button';
 export * from './Carousel';
+export * from './chat/Chat';
+export * from './chat/ChatHeader';
+export * from './chat/ChatMessage';
+export * from './chat/ChatMessages';
+export * from './chat/ChatMessageLoader';
+export * from './chat/ChatMessageError';
+export * from './chat/ChatPrompt';
+export * from './chat/ChatToggleButton';
+export * from './chat/icons';
+export * from './chat/types';
 export * from './FrequentlyBoughtTogether';
 export * from './Highlight';
 export * from './Hits';

package/dist/es/components/index.js

@@ -1,4 +1,16 @@
+export * from "./autocomplete/index.js";
+export * from "./Button.js";
 export * from "./Carousel.js";
+export * from "./chat/Chat.js";
+export * from "./chat/ChatHeader.js";
+export * from "./chat/ChatMessage.js";
+export * from "./chat/ChatMessages.js";
+export * from "./chat/ChatMessageLoader.js";
+export * from "./chat/ChatMessageError.js";
+export * from "./chat/ChatPrompt.js";
+export * from "./chat/ChatToggleButton.js";
+export * from "./chat/icons.js";
+export * from "./chat/types.js";
 export * from "./FrequentlyBoughtTogether.js";
 export * from "./Highlight.js";
 export * from "./Hits.js";

package/dist/es/lib/index.d.ts

@@ -1 +1,3 @@
 export * from './cx';
+export * from './stickToBottom';
+export * from './utils';

package/dist/es/lib/index.js

@@ -1 +1,3 @@
-export * from "./cx.js";
+export * from "./cx.js";
+export * from "./stickToBottom.js";
+export * from "./utils/index.js";

package/dist/es/lib/stickToBottom.d.ts

@@ -0,0 +1,114 @@
+export interface StickToBottomState {
+    scrollTop: number;
+    lastScrollTop?: number;
+    ignoreScrollToTop?: number;
+    targetScrollTop: number;
+    calculatedTargetScrollTop: number;
+    scrollDifference: number;
+    resizeDifference: number;
+    animation?: {
+        behavior: 'instant' | Required<SpringAnimation>;
+        ignoreEscapes: boolean;
+        promise: Promise<boolean>;
+    };
+    lastTick?: number;
+    velocity: number;
+    accumulated: number;
+    escapedFromLock: boolean;
+    isAtBottom: boolean;
+    isNearBottom: boolean;
+    resizeObserver?: ResizeObserver;
+}
+declare const DEFAULT_SPRING_ANIMATION: {
+    /**
+     * A value from 0 to 1, on how much to damp the animation.
+     * 0 means no damping, 1 means full damping.
+     *
+     * @default 0.7
+     */
+    damping: number;
+    /**
+     * The stiffness of how fast/slow the animation gets up to speed.
+     *
+     * @default 0.05
+     */
+    stiffness: number;
+    /**
+     * The inertial mass associated with the animation.
+     * Higher numbers make the animation slower.
+     *
+     * @default 1.25
+     */
+    mass: number;
+};
+export type SpringAnimation = Partial<typeof DEFAULT_SPRING_ANIMATION>;
+export type Animation = ScrollBehavior | SpringAnimation;
+export interface ScrollElements {
+    scrollElement: HTMLElement;
+    contentElement: HTMLElement;
+}
+export type GetTargetScrollTop = (targetScrollTop: number, context: ScrollElements) => number;
+export interface StickToBottomOptions extends SpringAnimation {
+    resize?: Animation;
+    initial?: Animation | boolean;
+    targetScrollTop?: GetTargetScrollTop;
+}
+export type ScrollToBottomOptions = ScrollBehavior | {
+    animation?: Animation;
+    /**
+     * Whether to wait for any existing scrolls to finish before
+     * performing this one. Or if a millisecond is passed,
+     * it will wait for that duration before performing the scroll.
+     *
+     * @default false
+     */
+    wait?: boolean | number;
+    /**
+     * Whether to prevent the user from escaping the scroll,
+     * by scrolling up with their mouse.
+     */
+    ignoreEscapes?: boolean;
+    /**
+     * Only scroll to the bottom if we're already at the bottom.
+     *
+     * @default false
+     */
+    preserveScrollPosition?: boolean;
+    /**
+     * The extra duration in ms that this scroll event should persist for.
+     * (in addition to the time that it takes to get to the bottom)
+     *
+     * Not to be confused with the duration of the animation -
+     * for that you should adjust the animation option.
+     *
+     * @default 0
+     */
+    duration?: number | Promise<void>;
+};
+export type ScrollToBottom = (scrollOptions?: ScrollToBottomOptions) => Promise<boolean> | boolean;
+export type StopScroll = () => void;
+export interface StickToBottomInstance {
+    contentRef: {
+        current: HTMLDivElement | null;
+    };
+    scrollRef: {
+        current: HTMLDivElement | null;
+    };
+    scrollToBottom: ScrollToBottom;
+    stopScroll: StopScroll;
+    isAtBottom: boolean;
+    isNearBottom: boolean;
+    escapedFromLock: boolean;
+    state: StickToBottomState;
+}
+type CreateStickToBottomParams = {
+    useCallback: <T extends (...args: any[]) => any>(callback: T, deps: readonly unknown[]) => T;
+    useEffect: (effect: () => void | (() => void), deps?: readonly unknown[]) => void;
+    useMemo: <TType>(factory: () => TType, deps: readonly unknown[]) => TType;
+    useRef: <TType>(initialValue: TType) => {
+        current: TType;
+    };
+    useState: <TType>(initialState: TType) => [TType, (newState: TType) => void];
+};
+export declare function createStickToBottom({ useCallback, useEffect, useMemo, useRef, useState, }: CreateStickToBottomParams): (options?: StickToBottomOptions) => StickToBottomInstance;
+export {};