@promptbook/components 0.112.0-28 → 0.112.0-29

package/esm/src/_packages/components.index.d.ts

@@ -17,6 +17,7 @@ import type { AgentChatProps } from '../book-components/Chat/AgentChat/AgentChat
 import { Chat } from '../book-components/Chat/Chat/Chat';
 import type { ChatFeedbackResponse } from '../book-components/Chat/Chat/ChatProps';
 import type { ChatFeedbackMode } from '../book-components/Chat/Chat/ChatProps';
+import type { ChatFeedbackTranslations } from '../book-components/Chat/Chat/ChatProps';
 import type { ChatSoundSystem } from '../book-components/Chat/Chat/ChatProps';
 import type { ChatProps } from '../book-components/Chat/Chat/ChatProps';
 import { ChatSoundToggle } from '../book-components/Chat/Chat/ChatSoundToggle';
@@ -94,6 +95,7 @@ export type { AgentChatProps };
 export { Chat };
 export type { ChatFeedbackResponse };
 export type { ChatFeedbackMode };
+export type { ChatFeedbackTranslations };
 export type { ChatSoundSystem };
 export type { ChatProps };
 export { ChatSoundToggle };

package/esm/src/_packages/types.index.d.ts

@@ -18,6 +18,7 @@ import type { AgentChipData } from '../book-components/Chat/AgentChip/AgentChip'
 import type { AgentChipProps } from '../book-components/Chat/AgentChip/AgentChip';
 import type { ChatFeedbackResponse } from '../book-components/Chat/Chat/ChatProps';
 import type { ChatFeedbackMode } from '../book-components/Chat/Chat/ChatProps';
+import type { ChatFeedbackTranslations } from '../book-components/Chat/Chat/ChatProps';
 import type { ChatSoundSystem } from '../book-components/Chat/Chat/ChatProps';
 import type { ChatProps } from '../book-components/Chat/Chat/ChatProps';
 import type { ChatSoundToggleProps } from '../book-components/Chat/Chat/ChatSoundToggle';
@@ -442,6 +443,7 @@ export type { AgentChipData };
 export type { AgentChipProps };
 export type { ChatFeedbackResponse };
 export type { ChatFeedbackMode };
+export type { ChatFeedbackTranslations };
 export type { ChatSoundSystem };
 export type { ChatProps };
 export type { ChatSoundToggleProps };

package/esm/src/book-components/Chat/Chat/ChatMessageItem.d.ts

@@ -30,6 +30,10 @@ type ChatMessageItemProps = Pick<ChatProps, 'onMessage' | 'onActionButton' | 'pa
      * Chooses which feedback controls should be rendered.
      */
     feedbackMode?: ChatProps['feedbackMode'];
+    /**
+     * Optional localized labels used by feedback controls.
+     */
+    feedbackTranslations?: ChatProps['feedbackTranslations'];
     /**
      * Called when the copy button is pressed.
      */

package/esm/src/book-components/Chat/Chat/ChatMessageList.d.ts

@@ -24,6 +24,10 @@ export type ChatMessageListProps = {
      * Chooses which feedback controls should be rendered.
      */
     feedbackMode?: ChatProps['feedbackMode'];
+    /**
+     * Optional localized labels used by feedback controls.
+     */
+    feedbackTranslations?: ChatProps['feedbackTranslations'];
     onCopy?: () => void;
     onMessage?: (messageContent: string) => Promisable<void>;
     onActionButton?: ChatProps['onActionButton'];

package/esm/src/book-components/Chat/Chat/ChatProps.d.ts

@@ -24,6 +24,85 @@ export type ChatFeedbackResponse = {
  * @public exported from `@promptbook/components`
  */
 export type ChatFeedbackMode = 'off' | 'stars' | 'report_issue';
+/**
+ * Optional text overrides for feedback UI copy.
+ *
+ * @public exported from `@promptbook/components`
+ */
+export type ChatFeedbackTranslations = {
+    /**
+     * Tooltip shown on the report-issue quick action button.
+     */
+    readonly reportIssueButtonTitle?: string;
+    /**
+     * Accessible label shown on the report-issue quick action button.
+     */
+    readonly reportIssueButtonAriaLabel?: string;
+    /**
+     * Modal heading shown when user reports an issue.
+     */
+    readonly reportIssueModalTitle?: string;
+    /**
+     * Modal heading shown when user rates a response with stars.
+     */
+    readonly rateResponseModalTitle?: string;
+    /**
+     * Label shown above the original user question preview.
+     */
+    readonly userQuestionLabel?: string;
+    /**
+     * Label for expected-answer field in report-issue mode.
+     */
+    readonly reportIssueExpectedAnswerLabel?: string;
+    /**
+     * Label for expected-answer field in stars mode.
+     */
+    readonly expectedAnswerLabel?: string;
+    /**
+     * Placeholder for expected-answer input.
+     */
+    readonly expectedAnswerPlaceholder?: string;
+    /**
+     * Label for free-form issue details in report-issue mode.
+     */
+    readonly reportIssueDetailsLabel?: string;
+    /**
+     * Label for free-form note input in stars mode.
+     */
+    readonly noteLabel?: string;
+    /**
+     * Placeholder for free-form issue details input.
+     */
+    readonly reportIssueDetailsPlaceholder?: string;
+    /**
+     * Placeholder for free-form note input.
+     */
+    readonly notePlaceholder?: string;
+    /**
+     * Cancel button label shown in the feedback modal.
+     */
+    readonly cancelLabel?: string;
+    /**
+     * Submit button label shown in report-issue mode.
+     */
+    readonly reportIssueSubmitLabel?: string;
+    /**
+     * Submit button label shown in stars mode.
+     */
+    readonly submitLabel?: string;
+    /**
+     * Toast message shown when generic feedback is stored.
+     */
+    readonly feedbackSuccessMessage?: string;
+    /**
+     * Toast message shown when issue report is stored.
+     */
+    readonly reportIssueSuccessMessage?: string;
+    /**
+     * Toast message shown when feedback storage fails.
+     */
+    readonly feedbackErrorMessage?: string;
+};
 /**
  * Interface for sound system that can be passed to Chat component
  * This allows the chat to trigger sounds without tight coupling
@@ -305,6 +384,10 @@ export type ChatProps = {
      * @default 'stars'
      */
     readonly feedbackMode?: ChatFeedbackMode;
+    /**
+     * Optional localized feedback labels for buttons, modal copy, and status toasts.
+     */
+    readonly feedbackTranslations?: ChatFeedbackTranslations;
     /**
      * Optional callback for handling file uploads
      * When provided, enables file upload functionality via drag-and-drop and file button

package/esm/src/book-components/Chat/Chat/ChatRatingModal.d.ts

@@ -1,6 +1,6 @@
 import type { id } from '../../../types/typeAliases';
 import type { ChatMessage } from '../types/ChatMessage';
-import type { ChatFeedbackMode } from './ChatProps';
+import type { ChatFeedbackMode, ChatProps } from './ChatProps';
 /**
  * Props for the rating modal used in Chat.
  *
@@ -18,6 +18,10 @@ export type ChatRatingModalProps = {
      * Chooses which feedback flow the modal should render.
      */
     feedbackMode: ChatFeedbackMode;
+    /**
+     * Optional localized labels used by feedback controls.
+     */
+    feedbackTranslations?: ChatProps['feedbackTranslations'];
     mode: 'LIGHT' | 'DARK';
     isMobile: boolean;
     onClose: () => void;

package/esm/src/book-components/Chat/hooks/useChatRatings.d.ts

@@ -1,7 +1,7 @@
 import type { Promisable } from 'type-fest';
 import type { id } from '../../../types/typeAliases';
 import type { ChatMessage } from '../types/ChatMessage';
-import type { ChatFeedbackMode, ChatFeedbackResponse } from '../Chat/ChatProps';
+import type { ChatFeedbackMode, ChatFeedbackResponse, ChatProps } from '../Chat/ChatProps';
 /**
  * Input parameters for the chat rating hook.
  *
@@ -27,6 +27,10 @@ export type UseChatRatingsOptions = {
      * Feedback mode currently used by the chat UI.
      */
     feedbackMode: ChatFeedbackMode;
+    /**
+     * Optional localized labels and status messages used by the feedback UI.
+     */
+    feedbackTranslations?: ChatProps['feedbackTranslations'];
     /**
      * Whether the UI should apply mobile-specific behavior.
      */

package/esm/src/version.d.ts

@@ -15,7 +15,7 @@ export declare const BOOK_LANGUAGE_VERSION: string_semantic_version;
 export declare const PROMPTBOOK_ENGINE_VERSION: string_promptbook_version;
 /**
  * Represents the version string of the Promptbook engine.
- * It follows semantic versioning (e.g., `0.112.0-27`).
+ * It follows semantic versioning (e.g., `0.112.0-26`).
  *
  * @generated
  */

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@promptbook/components",
-    "version": "0.112.0-28",
+    "version": "0.112.0-29",
     "description": "Promptbook: Turn your company's scattered knowledge into AI ready books",
     "private": false,
     "sideEffects": false,

package/umd/index.umd.js

@@ -30,7 +30,7 @@
      * @generated
      * @see https://github.com/webgptorg/promptbook
      */
-    const PROMPTBOOK_ENGINE_VERSION = '0.112.0-28';
+    const PROMPTBOOK_ENGINE_VERSION = '0.112.0-29';
     /**
      * TODO: string_promptbook_version should be constrained to the all versions of Promptbook engine
      * Note: [💞] Ignore a discrepancy between file name and entity name
@@ -21666,7 +21666,7 @@
      * @private component of `<Chat/>`
      */
     function useChatRatings(options) {
-        const { messages, onFeedback, feedbackMode, isMobile } = options;
+        const { messages, onFeedback, feedbackMode, feedbackTranslations, isMobile } = options;
         const [ratingModalOpen, setRatingModalOpen] = react.useState(false);
         const [selectedMessage, setSelectedMessage] = react.useState(null);
         const [messageRatings, setMessageRatings] = react.useState(new Map());
@@ -21709,7 +21709,7 @@
             };
         }, []);
         const submitRating = react.useCallback(async () => {
-            var _a;
+            var _a, _b, _c, _d, _e, _f;
             if (!selectedMessage) {
                 return;
             }
@@ -21733,14 +21733,16 @@
                     const feedbackResponse = await onFeedback(feedbackData);
                     showFeedbackStatus({
                         message: (_a = feedbackResponse === null || feedbackResponse === void 0 ? void 0 : feedbackResponse.message) !== null && _a !== void 0 ? _a : (feedbackMode === 'report_issue'
-                            ? DEFAULT_REPORT_ISSUE_SUCCESS_MESSAGE
-                            : DEFAULT_FEEDBACK_SUCCESS_MESSAGE),
+                            ? ((_b = feedbackTranslations === null || feedbackTranslations === void 0 ? void 0 : feedbackTranslations.reportIssueSuccessMessage) !== null && _b !== void 0 ? _b : DEFAULT_REPORT_ISSUE_SUCCESS_MESSAGE)
+                            : ((_c = feedbackTranslations === null || feedbackTranslations === void 0 ? void 0 : feedbackTranslations.feedbackSuccessMessage) !== null && _c !== void 0 ? _c : DEFAULT_FEEDBACK_SUCCESS_MESSAGE)),
                         variant: 'success',
                     });
                 }
                 catch (error) {
                     console.error('Error submitting feedback:', error);
-                    const message = error instanceof Error ? error.message : DEFAULT_FEEDBACK_ERROR_MESSAGE;
+                    const message = error instanceof Error
+                        ? error.message
+                        : ((_d = feedbackTranslations === null || feedbackTranslations === void 0 ? void 0 : feedbackTranslations.feedbackErrorMessage) !== null && _d !== void 0 ? _d : DEFAULT_FEEDBACK_ERROR_MESSAGE);
                     showFeedbackStatus({ message, variant: 'error' });
                     return;
                 }
@@ -21755,15 +21757,26 @@
                 });
                 showFeedbackStatus({
                     message: feedbackMode === 'report_issue'
-                        ? DEFAULT_REPORT_ISSUE_SUCCESS_MESSAGE
-                        : DEFAULT_FEEDBACK_SUCCESS_MESSAGE,
+                        ? ((_e = feedbackTranslations === null || feedbackTranslations === void 0 ? void 0 : feedbackTranslations.reportIssueSuccessMessage) !== null && _e !== void 0 ? _e : DEFAULT_REPORT_ISSUE_SUCCESS_MESSAGE)
+                        : ((_f = feedbackTranslations === null || feedbackTranslations === void 0 ? void 0 : feedbackTranslations.feedbackSuccessMessage) !== null && _f !== void 0 ? _f : DEFAULT_FEEDBACK_SUCCESS_MESSAGE),
                     variant: 'success',
                 });
             }
             setRatingModalOpen(false);
             setTextRating('');
             setSelectedMessage(null);
-        }, [feedbackMode, messages, messageRatings, onFeedback, selectedMessage, showFeedbackStatus, textRating]);
+        }, [
+            feedbackMode,
+            feedbackTranslations === null || feedbackTranslations === void 0 ? void 0 : feedbackTranslations.feedbackErrorMessage,
+            feedbackTranslations === null || feedbackTranslations === void 0 ? void 0 : feedbackTranslations.feedbackSuccessMessage,
+            feedbackTranslations === null || feedbackTranslations === void 0 ? void 0 : feedbackTranslations.reportIssueSuccessMessage,
+            messages,
+            messageRatings,
+            onFeedback,
+            selectedMessage,
+            showFeedbackStatus,
+            textRating,
+        ]);
         react.useEffect(() => {
             if (ratingModalOpen && isMobile) {
                 document.body.style.overflow = 'hidden';
@@ -40279,7 +40292,7 @@
     //                                          Or make normal function from this?
     (props) => {
         var _a;
-        const { message, participant, participants, isLastMessage, onMessage, onActionButton, setExpandedMessageId, isExpanded, currentRating, handleRating, mode, isCopyButtonEnabled, isFeedbackEnabled, feedbackMode = 'stars', onCopy, onCreateAgent, teammates, teamAgentProfiles, onToolCallClick, onCitationClick, soundSystem, isSpeechPlaybackEnabled, elevenLabsVoiceId, } = props;
+        const { message, participant, participants, isLastMessage, onMessage, onActionButton, setExpandedMessageId, isExpanded, currentRating, handleRating, mode, isCopyButtonEnabled, isFeedbackEnabled, feedbackMode = 'stars', feedbackTranslations, onCopy, onCreateAgent, teammates, teamAgentProfiles, onToolCallClick, onCitationClick, soundSystem, isSpeechPlaybackEnabled, elevenLabsVoiceId, } = props;
         const { isComplete = true,
         // <- TODO: Destruct all `messages` properties like `isComplete`
          } = message;
@@ -40698,7 +40711,8 @@
                                         : () => {
                                             setExpandedMessageId(null);
                                             setLocalHoveredRating(0);
-                                        }, children: isReportIssueFeedbackMode ? (jsxRuntime.jsx("button", { type: "button", onClick: () => handleRating(message, 1), className: styles$5.feedbackIssueButton, "aria-label": "Report issue with this response", title: "Report issue", children: "\u26A0" })) : isExpanded ? ([1, 2, 3, 4, 5].map((star) => (jsxRuntime.jsx("span", { onClick: () => handleRating(message, star), onMouseEnter: () => setLocalHoveredRating(star), className: classNames(styles$5.ratingStar, star <= (localHoveredRating || currentRating || 0) && styles$5.active), style: {
+                                        }, children: isReportIssueFeedbackMode ? (jsxRuntime.jsx("button", { type: "button", onClick: () => handleRating(message, 1), className: styles$5.feedbackIssueButton, "aria-label": (feedbackTranslations === null || feedbackTranslations === void 0 ? void 0 : feedbackTranslations.reportIssueButtonAriaLabel) ||
+                                            'Report issue with this response', title: (feedbackTranslations === null || feedbackTranslations === void 0 ? void 0 : feedbackTranslations.reportIssueButtonTitle) || 'Report issue', children: "\u26A0" })) : isExpanded ? ([1, 2, 3, 4, 5].map((star) => (jsxRuntime.jsx("span", { onClick: () => handleRating(message, star), onMouseEnter: () => setLocalHoveredRating(star), className: classNames(styles$5.ratingStar, star <= (localHoveredRating || currentRating || 0) && styles$5.active), style: {
                                             '--star-inactive-color': mode === 'LIGHT' ? '#ccc' : '#555',
                                         }, children: "\u2B50" }, star)))) : (jsxRuntime.jsx("span", { onClick: () => handleRating(message, currentRating || 1), className: classNames(styles$5.ratingStar, currentRating && styles$5.active), style: {
                                             '--star-inactive-color': mode === 'LIGHT' ? '#888' : '#666',
@@ -40780,6 +40794,9 @@
         if (prev.feedbackMode !== next.feedbackMode) {
             return false;
         }
+        if (prev.feedbackTranslations !== next.feedbackTranslations) {
+            return false;
+        }
         if (prev.handleRating !== next.handleRating) {
             return false;
         }
@@ -40805,7 +40822,7 @@
      * @private component of `<Chat/>`
      */
     function ChatMessageList(props) {
-        const { messages, participants, expandedMessageId, messageRatings, setExpandedMessageId, handleRating, mode, isCopyButtonEnabled, isFeedbackEnabled, feedbackMode, onCopy, onMessage, onActionButton, onCreateAgent, toolTitles, teammates, onToolCallClick, onCitationClick, soundSystem, isSpeechPlaybackEnabled, elevenLabsVoiceId, teamAgentProfiles, setChatMessagesElement, onScroll, chatMessagesClassName, hasActions, } = props;
+        const { messages, participants, expandedMessageId, messageRatings, setExpandedMessageId, handleRating, mode, isCopyButtonEnabled, isFeedbackEnabled, feedbackMode, feedbackTranslations, onCopy, onMessage, onActionButton, onCreateAgent, toolTitles, teammates, onToolCallClick, onCitationClick, soundSystem, isSpeechPlaybackEnabled, elevenLabsVoiceId, teamAgentProfiles, setChatMessagesElement, onScroll, chatMessagesClassName, hasActions, } = props;
         const firstMessage = messages[0];
         const firstMsgContent = (firstMessage === null || firstMessage === void 0 ? void 0 : firstMessage.content) || '';
         const firstMsgLines = firstMsgContent.split(/\r?\n/).length;
@@ -40817,7 +40834,7 @@
                     const isLastMessage = index === messages.length - 1;
                     const isExpanded = expandedMessageId === message.id;
                     const currentRating = messageRatings.get(message.id || message.content /* <-[??] */) || 0;
-                    return (jsxRuntime.jsx(ChatMessageItem, { message: message, participant: participant, participants: participants, isLastMessage: isLastMessage, onMessage: onMessage, onActionButton: onActionButton, setExpandedMessageId: setExpandedMessageId, isExpanded: isExpanded, currentRating: currentRating, handleRating: handleRating, mode: mode, isCopyButtonEnabled: isCopyButtonEnabled, isFeedbackEnabled: isFeedbackEnabled, feedbackMode: feedbackMode, onCopy: onCopy, onCreateAgent: onCreateAgent, toolTitles: toolTitles, teammates: teammates, teamAgentProfiles: teamAgentProfiles, onToolCallClick: onToolCallClick, onCitationClick: onCitationClick, soundSystem: soundSystem, isSpeechPlaybackEnabled: isSpeechPlaybackEnabled, elevenLabsVoiceId: elevenLabsVoiceId }, resolveRenderedMessageKey(message)));
+                    return (jsxRuntime.jsx(ChatMessageItem, { message: message, participant: participant, participants: participants, isLastMessage: isLastMessage, onMessage: onMessage, onActionButton: onActionButton, setExpandedMessageId: setExpandedMessageId, isExpanded: isExpanded, currentRating: currentRating, handleRating: handleRating, mode: mode, isCopyButtonEnabled: isCopyButtonEnabled, isFeedbackEnabled: isFeedbackEnabled, feedbackMode: feedbackMode, feedbackTranslations: feedbackTranslations, onCopy: onCopy, onCreateAgent: onCreateAgent, toolTitles: toolTitles, teammates: teammates, teamAgentProfiles: teamAgentProfiles, onToolCallClick: onToolCallClick, onCitationClick: onCitationClick, soundSystem: soundSystem, isSpeechPlaybackEnabled: isSpeechPlaybackEnabled, elevenLabsVoiceId: elevenLabsVoiceId }, resolveRenderedMessageKey(message)));
                 }), jsxRuntime.jsx("div", { style: { height: 100 } })] }));
     }
     /**
@@ -40842,7 +40859,8 @@
      * @private component of `<Chat/>`
      */
     function ChatRatingModal(props) {
-        const { isOpen, selectedMessage, postprocessedMessages, messages, hoveredRating, messageRatings, textRating, feedbackMode, mode, isMobile, onClose, setHoveredRating, setMessageRatings, setSelectedMessage, setTextRating, submitRating, } = props;
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
+        const { isOpen, selectedMessage, postprocessedMessages, messages, hoveredRating, messageRatings, textRating, feedbackMode, feedbackTranslations, mode, isMobile, onClose, setHoveredRating, setMessageRatings, setSelectedMessage, setTextRating, submitRating, } = props;
         if (!isOpen || !selectedMessage) {
             return null;
         }
@@ -40867,7 +40885,9 @@
                 if (event.target === event.currentTarget && isMobile) {
                     onClose();
                 }
-            }, children: jsxRuntime.jsxs("div", { className: styles$5.ratingModalContent, children: [jsxRuntime.jsx("h3", { children: isReportIssueMode ? 'Report issue' : 'Rate this response' }), !isReportIssueMode && (jsxRuntime.jsx("div", { className: styles$5.stars, children: [1, 2, 3, 4, 5].map((star) => (jsxRuntime.jsx("span", { onClick: () => setMessageRatings((previousRatings) => {
+            }, children: jsxRuntime.jsxs("div", { className: styles$5.ratingModalContent, children: [jsxRuntime.jsx("h3", { children: isReportIssueMode
+                            ? ((_a = feedbackTranslations === null || feedbackTranslations === void 0 ? void 0 : feedbackTranslations.reportIssueModalTitle) !== null && _a !== void 0 ? _a : 'Report issue')
+                            : ((_b = feedbackTranslations === null || feedbackTranslations === void 0 ? void 0 : feedbackTranslations.rateResponseModalTitle) !== null && _b !== void 0 ? _b : 'Rate this response') }), !isReportIssueMode && (jsxRuntime.jsx("div", { className: styles$5.stars, children: [1, 2, 3, 4, 5].map((star) => (jsxRuntime.jsx("span", { onClick: () => setMessageRatings((previousRatings) => {
                                 const nextRatings = new Map(previousRatings);
                                 nextRatings.set(selectedMessage.id || selectedMessage.content /* <-[??] */, star);
                                 return nextRatings;
@@ -40880,11 +40900,21 @@
                                     : mode === 'LIGHT'
                                         ? '#ccc'
                                         : '#555',
-                            }, children: "\u2B50" }, star))) })), "Your question:", jsxRuntime.jsx("textarea", { readOnly: true, value: userQuestion, className: styles$5.ratingInput }), isReportIssueMode ? 'What should the answer include?' : 'Expected answer:', jsxRuntime.jsx("textarea", { placeholder: selectedMessage.content || 'Expected answer (optional)', defaultValue: selectedMessage.expectedAnswer || selectedMessage.content, onChange: (event) => {
+                            }, children: "\u2B50" }, star))) })), (_c = feedbackTranslations === null || feedbackTranslations === void 0 ? void 0 : feedbackTranslations.userQuestionLabel) !== null && _c !== void 0 ? _c : 'Your question:', jsxRuntime.jsx("textarea", { readOnly: true, value: userQuestion, className: styles$5.ratingInput }), isReportIssueMode
+                        ? ((_d = feedbackTranslations === null || feedbackTranslations === void 0 ? void 0 : feedbackTranslations.reportIssueExpectedAnswerLabel) !== null && _d !== void 0 ? _d : 'What should the answer include?')
+                        : ((_e = feedbackTranslations === null || feedbackTranslations === void 0 ? void 0 : feedbackTranslations.expectedAnswerLabel) !== null && _e !== void 0 ? _e : 'Expected answer:'), jsxRuntime.jsx("textarea", { placeholder: selectedMessage.content ||
+                            (feedbackTranslations === null || feedbackTranslations === void 0 ? void 0 : feedbackTranslations.expectedAnswerPlaceholder) ||
+                            'Expected answer (optional)', defaultValue: selectedMessage.expectedAnswer || selectedMessage.content, onChange: (event) => {
                             if (selectedMessage) {
                                 setSelectedMessage({ ...selectedMessage, expectedAnswer: event.target.value });
                             }
-                        }, className: styles$5.ratingInput }), isReportIssueMode ? 'Issue details:' : 'Note:', jsxRuntime.jsx("textarea", { placeholder: isReportIssueMode ? 'Describe what went wrong (optional)' : 'Add a note (optional)', defaultValue: textRating, onChange: (event) => setTextRating(event.target.value), className: styles$5.ratingInput }), jsxRuntime.jsxs("div", { className: styles$5.ratingActions, children: [jsxRuntime.jsx("button", { onClick: onClose, children: "Cancel" }), jsxRuntime.jsx("button", { onClick: submitRating, children: isReportIssueMode ? 'Report issue' : 'Submit' })] })] }) }));
+                        }, className: styles$5.ratingInput }), isReportIssueMode
+                        ? ((_f = feedbackTranslations === null || feedbackTranslations === void 0 ? void 0 : feedbackTranslations.reportIssueDetailsLabel) !== null && _f !== void 0 ? _f : 'Issue details:')
+                        : ((_g = feedbackTranslations === null || feedbackTranslations === void 0 ? void 0 : feedbackTranslations.noteLabel) !== null && _g !== void 0 ? _g : 'Note:'), jsxRuntime.jsx("textarea", { placeholder: isReportIssueMode
+                            ? ((_h = feedbackTranslations === null || feedbackTranslations === void 0 ? void 0 : feedbackTranslations.reportIssueDetailsPlaceholder) !== null && _h !== void 0 ? _h : 'Describe what went wrong (optional)')
+                            : ((_j = feedbackTranslations === null || feedbackTranslations === void 0 ? void 0 : feedbackTranslations.notePlaceholder) !== null && _j !== void 0 ? _j : 'Add a note (optional)'), defaultValue: textRating, onChange: (event) => setTextRating(event.target.value), className: styles$5.ratingInput }), jsxRuntime.jsxs("div", { className: styles$5.ratingActions, children: [jsxRuntime.jsx("button", { onClick: onClose, children: (feedbackTranslations === null || feedbackTranslations === void 0 ? void 0 : feedbackTranslations.cancelLabel) || 'Cancel' }), jsxRuntime.jsx("button", { onClick: submitRating, children: isReportIssueMode
+                                    ? ((_k = feedbackTranslations === null || feedbackTranslations === void 0 ? void 0 : feedbackTranslations.reportIssueSubmitLabel) !== null && _k !== void 0 ? _k : 'Report issue')
+                                    : ((_l = feedbackTranslations === null || feedbackTranslations === void 0 ? void 0 : feedbackTranslations.submitLabel) !== null && _l !== void 0 ? _l : 'Submit') })] })] }) }));
     }
 
     /**
@@ -42844,7 +42874,7 @@
      * @public exported from `@promptbook/components`
      */
     function Chat(props) {
-        const { title = 'Chat', messages, onChange, onMessage, onActionButton, onReset, resetRequiresConfirmation = true, onFeedback, feedbackMode = 'stars', onFileUpload, speechRecognition, placeholderMessageContent, defaultMessage, enterBehavior, resolveEnterBehavior, children, className, style, isAiTextHumanizedAndPromptbookified = true, isVoiceCalling = false, isFocusedOnLoad, participants = [], extraActions, actionsContainer, saveFormats, isSaveButtonEnabled = true, isCopyButtonEnabled = true, buttonColor: buttonColorRaw, onUseTemplate, onCreateAgent, toolTitles, teammates, teamAgentProfiles, visual, effectConfigs, soundSystem, speechRecognitionLanguage, isSpeechPlaybackEnabled = true, elevenLabsVoiceId, } = props;
+        const { title = 'Chat', messages, onChange, onMessage, onActionButton, onReset, resetRequiresConfirmation = true, onFeedback, feedbackMode = 'stars', feedbackTranslations, onFileUpload, speechRecognition, placeholderMessageContent, defaultMessage, enterBehavior, resolveEnterBehavior, children, className, style, isAiTextHumanizedAndPromptbookified = true, isVoiceCalling = false, isFocusedOnLoad, participants = [], extraActions, actionsContainer, saveFormats, isSaveButtonEnabled = true, isCopyButtonEnabled = true, buttonColor: buttonColorRaw, onUseTemplate, onCreateAgent, toolTitles, teammates, teamAgentProfiles, visual, effectConfigs, soundSystem, speechRecognitionLanguage, isSpeechPlaybackEnabled = true, elevenLabsVoiceId, } = props;
         const buttonColor = react.useMemo(() => Color.from(buttonColorRaw || '#0066cc'), [buttonColorRaw]);
         const agentParticipant = react.useMemo(() => participants.find((participant) => participant.name === 'AGENT'), [participants]);
         const postprocessedMessages = react.useMemo(() => {
@@ -42915,7 +42945,13 @@
         const shouldShowScrollToBottom = !isAutoScrolling && !isLatestMessageInView;
         const lastMessage = postprocessedMessages[postprocessedMessages.length - 1];
         const isStreamingAgentMessage = Boolean(lastMessage && lastMessage.sender !== 'USER' && !lastMessage.isComplete);
-        const { state: { ratingModalOpen, selectedMessage, messageRatings, textRating, hoveredRating, expandedMessageId, feedbackStatus, }, actions: { setRatingModalOpen, setSelectedMessage, setMessageRatings, setTextRating, setHoveredRating, setExpandedMessageId, handleRating, submitRating, }, } = useChatRatings({ messages, onFeedback, feedbackMode, isMobile: isMobileFromHook });
+        const { state: { ratingModalOpen, selectedMessage, messageRatings, textRating, hoveredRating, expandedMessageId, feedbackStatus, }, actions: { setRatingModalOpen, setSelectedMessage, setMessageRatings, setTextRating, setHoveredRating, setExpandedMessageId, handleRating, submitRating, }, } = useChatRatings({
+            messages,
+            onFeedback,
+            feedbackMode,
+            feedbackTranslations,
+            isMobile: isMobileFromHook,
+        });
         const [toolCallModalOpen, setToolCallModalOpen] = react.useState(false);
         const [selectedToolCallState, setSelectedToolCallState] = react.useState(null);
         const [citationModalOpen, setCitationModalOpen] = react.useState(false);
@@ -43014,7 +43050,7 @@
         }, [postprocessedMessages, soundSystem]);
         return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [feedbackStatus && (jsxRuntime.jsx("div", { className: classNames(styles$5.feedbackStatus, feedbackStatus.variant === 'success'
                         ? styles$5.feedbackStatusSuccess
-                        : styles$5.feedbackStatusError), "aria-live": "polite", role: "status", children: feedbackStatus.message })), effectConfigs && effectConfigs.length > 0 && (jsxRuntime.jsx(ChatEffectsSystem, { messages: postprocessedMessages, effectConfigs: effectConfigs, soundSystem: soundSystem })), jsxRuntime.jsx("div", { className: classNames(className, styles$5.Chat, visual === 'STANDALONE' && styles$5.standaloneVisual, visual === 'FULL_PAGE' && styles$5.fullPageVisual, getChatCssClassName('Chat'), chatCssClassNames.chat), style, children: jsxRuntime.jsxs("div", { className: classNames(className, styles$5.chatMainFlow, getChatCssClassName('chatMainFlow'), chatCssClassNames.chatMainFlow), children: [children && jsxRuntime.jsx("div", { className: classNames(styles$5.chatChildren), children: children }), shouldShowScrollToBottom && (jsxRuntime.jsx("div", { className: styles$5.scrollToBottomContainer, children: jsxRuntime.jsxs("div", { className: styles$5.scrollToBottomWrapper, children: [jsxRuntime.jsx(SolidArrowButton, { "data-button-type": "custom", direction: "down", iconSize: 33, className: classNames(styles$5.scrollToBottom, scrollToBottomCssClassName), onClick: handleButtonClick(scrollToBottom), "aria-label": ariaLabel, title: ariaLabel }), badgeLabel && (jsxRuntime.jsx("span", { className: styles$5.scrollToBottomBadge, "aria-live": "polite", role: "status", children: badgeLabel }))] }) })), isVoiceCalling && (jsxRuntime.jsx("div", { className: styles$5.voiceCallIndicatorBar, children: jsxRuntime.jsxs("div", { className: styles$5.voiceCallIndicator, children: [jsxRuntime.jsx("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "currentColor", children: jsxRuntime.jsx("path", { d: "M6.62 10.79c1.44 2.83 3.76 5.14 6.59 6.59l2.2-2.2c.27-.27.67-.36 1.02-.24 1.12.37 2.33.57 3.57.57.55 0 1 .45 1 1V20c0 .55-.45 1-1 1-9.39 0-17-7.61-17-17 0-.55.45-1 1-1h3.5c.55 0 1 .45 1 1 0 1.25.2 2.45.57 3.57.11.35.03.74-.25 1.02l-2.2 2.2z" }) }), jsxRuntime.jsx("span", { children: "Voice call active" }), jsxRuntime.jsx("div", { className: styles$5.voiceCallPulse })] }) })), jsxRuntime.jsx(ChatActionsBar, { actionsRef: actionsRef, actionsContainer: actionsContainer, messages: postprocessedMessages, participants: participants, title: title, onReset: onReset, resetRequiresConfirmation: resetRequiresConfirmation, onUseTemplate: onUseTemplate, extraActions: extraActions, saveFormats: saveFormats, isSaveButtonEnabled: isSaveButtonEnabled, shouldFadeActions: shouldFadeActions, shouldDisableActions: shouldDisableActions, onButtonClick: handleButtonClick }), jsxRuntime.jsx(ChatMessageList, { messages: postprocessedMessages, participants: participants, expandedMessageId: expandedMessageId, messageRatings: messageRatings, setExpandedMessageId: setExpandedMessageId, handleRating: handleRating, mode: mode, isCopyButtonEnabled: isCopyButtonEnabled, isFeedbackEnabled: isFeedbackEnabled, feedbackMode: feedbackMode, onCopy: handleCopy, onMessage: onMessage, onActionButton: onActionButton, onCreateAgent: onCreateAgent, toolTitles: toolTitles, teammates: teammates, teamAgentProfiles: teamAgentProfiles, soundSystem: soundSystem, onToolCallClick: (toolCall) => {
+                        : styles$5.feedbackStatusError), "aria-live": "polite", role: "status", children: feedbackStatus.message })), effectConfigs && effectConfigs.length > 0 && (jsxRuntime.jsx(ChatEffectsSystem, { messages: postprocessedMessages, effectConfigs: effectConfigs, soundSystem: soundSystem })), jsxRuntime.jsx("div", { className: classNames(className, styles$5.Chat, visual === 'STANDALONE' && styles$5.standaloneVisual, visual === 'FULL_PAGE' && styles$5.fullPageVisual, getChatCssClassName('Chat'), chatCssClassNames.chat), style, children: jsxRuntime.jsxs("div", { className: classNames(className, styles$5.chatMainFlow, getChatCssClassName('chatMainFlow'), chatCssClassNames.chatMainFlow), children: [children && jsxRuntime.jsx("div", { className: classNames(styles$5.chatChildren), children: children }), shouldShowScrollToBottom && (jsxRuntime.jsx("div", { className: styles$5.scrollToBottomContainer, children: jsxRuntime.jsxs("div", { className: styles$5.scrollToBottomWrapper, children: [jsxRuntime.jsx(SolidArrowButton, { "data-button-type": "custom", direction: "down", iconSize: 33, className: classNames(styles$5.scrollToBottom, scrollToBottomCssClassName), onClick: handleButtonClick(scrollToBottom), "aria-label": ariaLabel, title: ariaLabel }), badgeLabel && (jsxRuntime.jsx("span", { className: styles$5.scrollToBottomBadge, "aria-live": "polite", role: "status", children: badgeLabel }))] }) })), isVoiceCalling && (jsxRuntime.jsx("div", { className: styles$5.voiceCallIndicatorBar, children: jsxRuntime.jsxs("div", { className: styles$5.voiceCallIndicator, children: [jsxRuntime.jsx("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "currentColor", children: jsxRuntime.jsx("path", { d: "M6.62 10.79c1.44 2.83 3.76 5.14 6.59 6.59l2.2-2.2c.27-.27.67-.36 1.02-.24 1.12.37 2.33.57 3.57.57.55 0 1 .45 1 1V20c0 .55-.45 1-1 1-9.39 0-17-7.61-17-17 0-.55.45-1 1-1h3.5c.55 0 1 .45 1 1 0 1.25.2 2.45.57 3.57.11.35.03.74-.25 1.02l-2.2 2.2z" }) }), jsxRuntime.jsx("span", { children: "Voice call active" }), jsxRuntime.jsx("div", { className: styles$5.voiceCallPulse })] }) })), jsxRuntime.jsx(ChatActionsBar, { actionsRef: actionsRef, actionsContainer: actionsContainer, messages: postprocessedMessages, participants: participants, title: title, onReset: onReset, resetRequiresConfirmation: resetRequiresConfirmation, onUseTemplate: onUseTemplate, extraActions: extraActions, saveFormats: saveFormats, isSaveButtonEnabled: isSaveButtonEnabled, shouldFadeActions: shouldFadeActions, shouldDisableActions: shouldDisableActions, onButtonClick: handleButtonClick }), jsxRuntime.jsx(ChatMessageList, { messages: postprocessedMessages, participants: participants, expandedMessageId: expandedMessageId, messageRatings: messageRatings, setExpandedMessageId: setExpandedMessageId, handleRating: handleRating, mode: mode, isCopyButtonEnabled: isCopyButtonEnabled, isFeedbackEnabled: isFeedbackEnabled, feedbackMode: feedbackMode, feedbackTranslations: feedbackTranslations, onCopy: handleCopy, onMessage: onMessage, onActionButton: onActionButton, onCreateAgent: onCreateAgent, toolTitles: toolTitles, teammates: teammates, teamAgentProfiles: teamAgentProfiles, soundSystem: soundSystem, onToolCallClick: (toolCall) => {
                                     setSelectedToolCallState({
                                         identity: getToolCallIdentity(toolCall),
                                         fallbackToolCall: toolCall,
@@ -43026,7 +43062,7 @@
                                 }, setChatMessagesElement: setChatMessagesElement, onScroll: handleChatScroll, isSpeechPlaybackEnabled: isSpeechPlaybackEnabled, elevenLabsVoiceId: elevenLabsVoiceId, chatMessagesClassName: classNames(getChatCssClassName('chatMessages'), chatCssClassNames.chatMessages), hasActions: hasActions }), onMessage && (jsxRuntime.jsx(ChatInputArea, { onMessage: onMessage, onChange: onChange, onFileUpload: onFileUpload, speechRecognition: speechRecognition, speechRecognitionLanguage: speechRecognitionLanguage, defaultMessage: defaultMessage, enterBehavior: enterBehavior, resolveEnterBehavior: resolveEnterBehavior, placeholderMessageContent: placeholderMessageContent, isFocusedOnLoad: isFocusedOnLoad, isMobile: isMobileFromHook, isVoiceCalling: isVoiceCalling, participants: participants, buttonColor: buttonColor, soundSystem: soundSystem, onButtonClick: handleButtonClick, chatInputClassName: classNames(getChatCssClassName('chatInput'), chatCssClassNames.chatInput) }))] }) }), jsxRuntime.jsx(ChatToolCallModal, { isOpen: toolCallModalOpen, toolCall: selectedToolCall, toolCallIdentity: (selectedToolCallState === null || selectedToolCallState === void 0 ? void 0 : selectedToolCallState.identity) || null, onClose: () => {
                         setToolCallModalOpen(false);
                         setSelectedToolCallState(null);
-                    }, toolTitles: toolTitles, agentParticipant: agentParticipant, buttonColor: buttonColor, teamAgentProfiles: teamAgentProfiles }), jsxRuntime.jsx(ChatCitationModal, { isOpen: citationModalOpen, citation: selectedCitation, participants: participants, soundSystem: soundSystem, onClose: () => setCitationModalOpen(false) }), jsxRuntime.jsx(ChatRatingModal, { isOpen: ratingModalOpen, selectedMessage: selectedMessage, postprocessedMessages: postprocessedMessages, messages: messages, hoveredRating: hoveredRating, messageRatings: messageRatings, textRating: textRating, feedbackMode: feedbackMode, mode: mode, isMobile: isMobileFromHook, onClose: () => setRatingModalOpen(false), setHoveredRating: setHoveredRating, setMessageRatings: setMessageRatings, setSelectedMessage: setSelectedMessage, setTextRating: setTextRating, submitRating: submitRating })] }));
+                    }, toolTitles: toolTitles, agentParticipant: agentParticipant, buttonColor: buttonColor, teamAgentProfiles: teamAgentProfiles }), jsxRuntime.jsx(ChatCitationModal, { isOpen: citationModalOpen, citation: selectedCitation, participants: participants, soundSystem: soundSystem, onClose: () => setCitationModalOpen(false) }), jsxRuntime.jsx(ChatRatingModal, { isOpen: ratingModalOpen, selectedMessage: selectedMessage, postprocessedMessages: postprocessedMessages, messages: messages, hoveredRating: hoveredRating, messageRatings: messageRatings, textRating: textRating, feedbackMode: feedbackMode, feedbackTranslations: feedbackTranslations, mode: mode, isMobile: isMobileFromHook, onClose: () => setRatingModalOpen(false), setHoveredRating: setHoveredRating, setMessageRatings: setMessageRatings, setSelectedMessage: setSelectedMessage, setTextRating: setTextRating, submitRating: submitRating })] }));
     }
 
     /**