@constructor-io/constructorio-ui-pia 2.3.0 → 2.6.2

package/lib/types/components/PiaConversation/PiaModal.d.ts

@@ -3,10 +3,13 @@ import { Translations, Question, CioPiaComponentOverrides } from '../../types';
 interface PiaModalProps {
     initialQuestions: Question[];
     handleSubmitQuestion: (question: string) => void;
+    handleQuestionClick: (question: string) => void;
+    containerRef?: (node: HTMLDivElement | null) => void;
     isLoading: boolean;
     componentOverrides?: CioPiaComponentOverrides;
     translations?: Translations;
+    onInputFocus?: () => void;
     onClose?: () => void;
 }
-export default function PiaModal({ initialQuestions, handleSubmitQuestion, isLoading, componentOverrides, translations, onClose, children, }: PropsWithChildren<PiaModalProps>): React.JSX.Element;
+export default function PiaModal({ initialQuestions, handleSubmitQuestion, handleQuestionClick, containerRef, isLoading, componentOverrides, translations, onInputFocus, onClose, children, }: PropsWithChildren<PiaModalProps>): React.JSX.Element;
 export {};

package/lib/types/components/PiaInlineAnswer/PiaInlineAnswer.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+import { Callbacks, CioPiaComponentOverrides, DisclaimerPosition, Translations, Item } from '../../types';
+interface PiaInlineAnswerProps {
+    currentAnswer: string;
+    currentItems: Item[] | null;
+    showFeedback?: boolean;
+    learnMoreUrl?: string;
+    disclaimerPosition?: DisclaimerPosition;
+    translations?: Translations;
+    callbacks?: Callbacks;
+    componentOverrides?: CioPiaComponentOverrides;
+}
+export default function PiaInlineAnswer({ currentAnswer, currentItems, showFeedback, learnMoreUrl, disclaimerPosition, translations, callbacks, componentOverrides, }: PiaInlineAnswerProps): React.JSX.Element;
+export {};

package/lib/types/hooks/mocks/MockConstructorIOClient.d.ts

@@ -2,7 +2,7 @@ import { ConstructorClientOptions } from '@constructor-io/constructorio-client-j
 import { Recommendations, Browse, Search, Tracker, Quizzes } from '@constructor-io/constructorio-client-javascript/lib/types/constructorio';
 import MockAgent from './agent';
 declare class MockConstructorIOClient {
-    private options;
+    options: ConstructorClientOptions;
     search: Search;
     browse: Browse;
     recommendations: Recommendations;

package/lib/types/hooks/useCioPia.d.ts

@@ -13,6 +13,7 @@ export interface UseCioPiaProps {
     formatImageUrl?: Formatters['formatImageUrl'];
 }
 export interface UseCioPiaReturn {
+    threadId: string;
     suggestedQuestions: UseSuggestedQuestionsReturn;
     answers: UseAnswerResultsReturn;
 }

package/lib/types/hooks/useConversation.d.ts

@@ -1,4 +1,4 @@
-import { Callbacks, ConversationEntry, Question, Item } from '../types';
+import { Callbacks, ConversationEntry, PiaCallbackContext, Question, Item } from '../types';
 import { UseCioPiaReturn } from './useCioPia';
 export interface UseConversationProps {
     pia: UseCioPiaReturn;
@@ -14,7 +14,10 @@ export interface UseConversationReturn {
     currentItems: Item[] | null;
     isLoading: boolean;
     error: Error | null;
+    context: PiaCallbackContext;
     handleSubmitQuestion: (question: string) => void;
+    handleQuestionClick: (question: string) => void;
+    handleInputFocus: () => void;
     resetState: () => void;
 }
 export default function useConversation({ pia, itemId, isConversation, callbacks, }: UseConversationProps): UseConversationReturn;

package/lib/types/hooks/useViewportCallbacks.d.ts

@@ -0,0 +1,9 @@
+import { Callbacks, PiaCallbackContext } from '../types';
+export interface UseViewportCallbacksProps {
+    callbacks?: Callbacks;
+    context: PiaCallbackContext;
+}
+export interface UseViewportCallbacksReturn {
+    containerRef: (node: HTMLDivElement | null) => void;
+}
+export default function useViewportCallbacks({ callbacks, context, }: UseViewportCallbacksProps): UseViewportCallbacksReturn;

package/lib/types/index.d.ts

@@ -1,5 +1,6 @@
 import CioPia from './components/CioPia';
 export { default as CioPia } from './components/CioPia';
 export type { CioPiaProps } from './components/CioPia';
+export { sanitizeHtml, renderMarkdown } from './utils/contentTransformers';
 export * from './types';
 export default CioPia;

package/lib/types/types.d.ts

@@ -60,13 +60,26 @@ export type Translations = {
     'Learn More.'?: string;
     'Ask about this product'?: string;
 };
+export type QuestionSource = 'user' | 'suggestion';
+export interface PiaCallbackContext {
+    itemId: string;
+    threadId: string;
+}
 export interface Callbacks {
-    /** Called when a question is submitted (via Enter key, Send button, or suggested question click). */
-    onQuestionSubmit?: (question: string) => void;
+    /** Called when a question is submitted (typed or suggested question clicked). */
+    onQuestionSubmit?: (question: string, context: PiaCallbackContext, source: QuestionSource) => void;
     /** Called when a product card in the carousel is clicked. */
     onProductCardClick?: (item: Item) => void;
     /** Called when the user submits positive or negative feedback on an answer. */
     onFeedback?: (type: FeedbackType) => void;
+    /** Called when a new answer is received. Passes the full conversation history. */
+    onAnswer?: (history: ConversationEntry[], context: PiaCallbackContext) => void;
+    /** Called when the user focuses the input field. */
+    onFocus?: (context: PiaCallbackContext) => void;
+    /** Called when the widget enters the viewport. */
+    onView?: (context: PiaCallbackContext) => void;
+    /** Called when the widget leaves the viewport. */
+    onOutOfView?: (context: PiaCallbackContext) => void;
 }
 /** Formatter functions for transforming data before display. */
 export interface Formatters {
@@ -82,7 +95,10 @@ export interface ConversationEntry {
     id: number;
     question: string;
     answer: string;
+    source: QuestionSource;
     items?: Item[] | null;
+    threadId?: string;
+    qnaResultId?: string;
 }
 /**
  * Render props passed to CioPia children function
@@ -113,8 +129,8 @@ export interface FeedbackRenderProps {
     onFeedback?: (type: FeedbackType) => void;
 }
 /**
- * Component overrides for CioPia
- * Allows customization of sub-components via reactNode or render props functions
+ * Component overrides for CioPia.
+ * Allows customization of sub-components via reactNode or render props functions.
  */
 export interface CioPiaComponentOverrides extends ComponentOverrideProps<CioPiaRenderProps> {
     carousel?: CarouselOverrides<Item>;

package/lib/types/utils/contentTransformers.d.ts

@@ -0,0 +1,2 @@
+export declare function sanitizeHtml(html: string): string;
+export declare function renderMarkdown(content: string): string;

package/lib/types/utils/index.d.ts

@@ -1 +1,2 @@
 export * from './styleHelpers';
+export { sanitizeHtml, renderMarkdown } from './contentTransformers';

package/lib/types/version.d.ts

@@ -1,2 +1,2 @@
-declare const _default: "2.3.0";
+declare const _default: "2.6.2";
 export default _default;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@constructor-io/constructorio-ui-pia",
-  "version": "2.3.0",
+  "version": "2.6.2",
   "description": "Constructor.io AI Product Insights Agent UI library for web applications",
   "author": "Constructor.io Corporation",
   "license": "MIT",
@@ -51,7 +51,7 @@
   },
   "types": "lib/types/index.d.ts",
   "scripts": {
-    "lint": "eslint src --ext js,ts,jsx,tsx",
+    "lint": "eslint src",
     "check-types": "npx tsc --noEmit",
     "copy-styles": "rsync -am --include='*/' --include='*.css' --exclude='*' src/ lib/mjs/ && rsync -am --include='*/' --include='*.css' --exclude='*' src/ lib/cjs/",
     "dev": "storybook dev -p 6006",
@@ -64,7 +64,7 @@
     "storybook-docs-dev": "storybook dev --docs -p 6007",
     "serve-built-storybook": "npx http-server docs",
     "compile": "rm -rf lib && tsc -p tsconfig.json && tsc -p tsconfig-cjs.json && npm run copy-styles && vite build",
-    "check-license": "license-checker --production --onlyAllow 'Apache-2.0;BSD-3-Clause;MIT;0BSD;BSD-2-Clause;ISC' --excludePackages 'picocolors@1.0.0;graceful-fs@4.2.11;lightningcss@1.30.2;lightningcss-darwin-arm64@1.30.2;lightningcss-linux-x64-gnu@1.30.2;lightningcss-linux-x64-musl@1.30.2'",
+    "check-license": "license-checker --production --onlyAllow 'Apache-2.0;BSD-3-Clause;MIT;0BSD;BSD-2-Clause;ISC' --excludePackages 'lightningcss@1.32.0;lightningcss-darwin-arm64@1.32.0;lightningcss-linux-x64-gnu@1.32.0;lightningcss-linux-x64-musl@1.32.0'",
     "prepare": "husky"
   },
   "peerDependencies": {
@@ -82,10 +82,11 @@
     "@babel/preset-typescript": "^7.23.3",
     "@chromatic-com/storybook": "^3.2.5",
     "@cspell/eslint-plugin": "^8.17.5",
+    "@eslint/js": "^9.39.4",
     "@storybook/addon-a11y": "^8.6.4",
     "@storybook/addon-actions": "^8.6.4",
-    "@storybook/addon-essentials": "^8.6.4",
-    "@storybook/addon-interactions": "^8.6.4",
+    "@storybook/addon-essentials": "^8.6.18",
+    "@storybook/addon-interactions": "^8.6.18",
     "@storybook/addon-links": "^8.6.4",
     "@storybook/addon-onboarding": "^8.6.4",
     "@storybook/blocks": "^8.6.4",
@@ -97,32 +98,31 @@
     "@storybook/testing-library": "^0.2.1",
     "@testing-library/jest-dom": "^6.6.3",
     "@testing-library/react": "^16.2.0",
-    "@types/jest": "^29.5.14",
+    "@types/dompurify": "^3.0.5",
+    "@types/jest": "^30.0.0",
     "@types/react": "^19.0.10",
     "@types/react-dom": "^19.0.4",
-    "@typescript-eslint/eslint-plugin": "^7.18.0",
-    "@typescript-eslint/parser": "^7.18.0",
     "chromatic": "^11.27.0",
-    "eslint": "^8.57.1",
-    "eslint-config-airbnb": "^19.0.4",
-    "eslint-config-airbnb-typescript": "^18.0.0",
+    "eslint": "^9.39.4",
     "eslint-config-prettier": "^10.1.1",
+    "eslint-import-resolver-typescript": "^4.4.4",
     "eslint-plugin-import": "^2.31.0",
     "eslint-plugin-jsx-a11y": "^6.10.2",
     "eslint-plugin-prettier": "^5.2.3",
     "eslint-plugin-react": "^7.37.4",
-    "eslint-plugin-react-hooks": "^4.3.0",
-    "eslint-plugin-storybook": "^0.11.4",
-    "globals": "^16.0.0",
+    "eslint-plugin-react-hooks": "^7.1.1",
+    "eslint-plugin-storybook": "^0.12.0",
+    "globals": "^16.5.0",
     "husky": "^9.1.7",
-    "jest": "^29.7.0",
+    "jest": "^30.3.0",
     "jest-environment-jsdom": "^30.2.0",
+    "jest-environment-node": "^30.4.1",
     "license-checker": "^25.0.1",
     "prop-types": "^15.8.1",
     "start-server-and-test": "^2.0.10",
     "storybook": "^8.6.4",
     "typescript": "^4.9.4",
-    "typescript-eslint": "^8.26.1",
+    "typescript-eslint": "^8.59.2",
     "vite": "^6.3.5",
     "vite-plugin-css-injected-by-js": "^3.5.2",
     "webpack": "^5.98.0"
@@ -130,5 +130,9 @@
   "volta": {
     "node": "22.18.0",
     "npm": "10.9.3"
+  },
+  "dependencies": {
+    "dompurify": "^3.4.2",
+    "marked": "^15.0.12"
   }
 }