@repzo/widget-react-native 1.0.4 → 1.0.6

package/lib/typescript/module/ui/screens/chat/ChatView.types.d.ts

@@ -1,9 +1,10 @@
 import type { TeamAvatar } from '../../../types';
 /** Props and label bundle for the chat thread. */
 import type { DraftAttachment, PickResult } from '../../../attachments/pickers';
-import type { AgentUiAction, AttachmentSource, Message, OutgoingAttachment } from '../../../types';
+import type { AgentUiAction, AttachmentSource, ConversationRatingResult, Message, OutgoingAttachment } from '../../../types';
 import type { AgentUiBlockLabels } from '../../components/AgentUiBlocks';
 import type { ImageViewerLabels } from '../../components/ImageViewer';
+import type { RatingCardLabels } from '../../components/RatingCard';
 export interface ChatLabels {
     back: string;
     loading: string;
@@ -27,6 +28,7 @@ export interface ChatLabels {
     procedureSend: string;
     procedureSent: string;
     blocks: AgentUiBlockLabels;
+    rating: RatingCardLabels;
     attach: AttachLabels;
     viewer: ImageViewerLabels;
 }
@@ -79,6 +81,14 @@ export interface ChatViewProps {
         name?: string;
         phone?: string;
     }) => Promise<void>;
+    /** Answers a rating card; rejects with the server error (409 locked, 410 expired). */
+    onRateConversation?: (messageId: string, ratingId: string, data: {
+        rating: number;
+        reason?: string;
+        comment?: string;
+    }) => Promise<ConversationRatingResult>;
+    /** The widget's default language — rating reasons fall back to it. */
+    defaultLocale?: string;
     onLoadMore: () => void;
     onTyping: (isTyping: boolean) => void;
     onBack: () => void;

package/lib/typescript/module/ui/screens/chat/ChatView.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ChatView.types.d.ts","sourceRoot":"","sources":["../../../../../../src/ui/screens/chat/ChatView.types.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"ChatView.types.d.ts","sourceRoot":"","sources":["../../../../../../src/ui/screens/chat/ChatView.types.ts"],"names":[],"mappings":"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"}

package/lib/typescript/module/ui/screens/home/HomeView.d.ts

@@ -12,6 +12,13 @@
  * the visitor already has; nothing here assumes a field the backend does not
  * send today.
  */
+import type { WidgetConfig } from '../../../types';
 import type { HomeViewProps } from './HomeView.types';
+/**
+ * The admin's explicit black/white toggle always wins. Older configs can omit
+ * it, and defaulting to dark text over a dark brand header is unreadable, so
+ * derive something legible from the background instead.
+ */
+export declare function resolveHeaderTextColor(config: WidgetConfig | null, fallbackColor: string): string;
 export declare function HomeView({ config, color, visitorName, conversationCount, recentConversations, unreadByConversation, teamAgents, isOnline, offlineMessage, startConversationLabel, replyTimeLabel, allowNewConversations, showPreviousConversations, labels, onClose, onStartConversation, onViewConversations, onOpenConversation, }: HomeViewProps): import("react").JSX.Element;
 //# sourceMappingURL=HomeView.d.ts.map

package/lib/typescript/module/ui/screens/home/HomeView.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"HomeView.d.ts","sourceRoot":"","sources":["../../../../../../src/ui/screens/home/HomeView.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;GAaG;AAqCH,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAiBtD,wBAAgB,QAAQ,CAAC,EACvB,MAAM,EACN,KAAK,EACL,WAAW,EACX,iBAAiB,EACjB,mBAAmB,EACnB,oBAAoB,EACpB,UAAU,EACV,QAAQ,EACR,cAAc,EACd,sBAAsB,EACtB,cAAc,EACd,qBAAqB,EACrB,yBAAyB,EACzB,MAAM,EACN,OAAO,EACP,mBAAmB,EACnB,mBAAmB,EACnB,kBAAkB,GACnB,EAAE,aAAa,+BAkNf"}
+{"version":3,"file":"HomeView.d.ts","sourceRoot":"","sources":["../../../../../../src/ui/screens/home/HomeView.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;GAaG;AAcH,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AA2BnD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAEtD;;;;GAIG;AACH,wBAAgB,sBAAsB,CAAC,MAAM,EAAE,YAAY,GAAG,IAAI,EAAE,aAAa,EAAE,MAAM,GAAG,MAAM,CAQjG;AAED,wBAAgB,QAAQ,CAAC,EACvB,MAAM,EACN,KAAK,EACL,WAAW,EACX,iBAAiB,EACjB,mBAAmB,EACnB,oBAAoB,EACpB,UAAU,EACV,QAAQ,EACR,cAAc,EACd,sBAAsB,EACtB,cAAc,EACd,qBAAqB,EACrB,yBAAyB,EACzB,MAAM,EACN,OAAO,EACP,mBAAmB,EACnB,mBAAmB,EACnB,kBAAkB,GACnB,EAAE,aAAa,+BAmNf"}

package/lib/typescript/module/ui/screens/home/HomeView.styles.d.ts

@@ -16,6 +16,9 @@ export declare const START_CARD_LIFT = 28;
 export declare const START_CARD_MIN_HEIGHT = 76;
 export declare const HEADER_FADE_HEIGHT = 90;
 export declare const CLOSE_BUTTON_SIZE = 28;
+/** The logo keeps its own shape at this height, up to the web widget's max width. */
+export declare const LOGO_HEIGHT = 40;
+export declare const LOGO_MAX_WIDTH = 152;
 export declare const CLOSE_ICON_SIZE = 14;
 export declare const styles: {
     contentContainer: {
@@ -47,7 +50,6 @@ export declare const styles: {
         minHeight: number;
     };
     logo: {
-        width: number;
         height: number;
     };
     closeButton: {

package/lib/typescript/module/ui/screens/home/HomeView.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"HomeView.styles.d.ts","sourceRoot":"","sources":["../../../../../../src/ui/screens/home/HomeView.styles.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAQH;;;;;;GAMG;AACH,eAAO,MAAM,iBAAiB,MAAM,CAAC;AACrC,iFAAiF;AACjF,eAAO,MAAM,qBAAqB,KAAK,CAAC;AACxC,eAAO,MAAM,eAAe,KAAK,CAAC;AAClC,eAAO,MAAM,qBAAqB,KAAK,CAAC;AACxC,eAAO,MAAM,kBAAkB,KAAK,CAAC;AACrC,eAAO,MAAM,iBAAiB,KAAK,CAAC;AACpC,eAAO,MAAM,eAAe,KAAK,CAAC;AAElC,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA0NjB,CAAC"}
+{"version":3,"file":"HomeView.styles.d.ts","sourceRoot":"","sources":["../../../../../../src/ui/screens/home/HomeView.styles.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAQH;;;;;;GAMG;AACH,eAAO,MAAM,iBAAiB,MAAM,CAAC;AACrC,iFAAiF;AACjF,eAAO,MAAM,qBAAqB,KAAK,CAAC;AACxC,eAAO,MAAM,eAAe,KAAK,CAAC;AAClC,eAAO,MAAM,qBAAqB,KAAK,CAAC;AACxC,eAAO,MAAM,kBAAkB,KAAK,CAAC;AACrC,eAAO,MAAM,iBAAiB,KAAK,CAAC;AACpC,qFAAqF;AACrF,eAAO,MAAM,WAAW,KAAK,CAAC;AAC9B,eAAO,MAAM,cAAc,MAAM,CAAC;AAClC,eAAO,MAAM,eAAe,KAAK,CAAC;AAElC,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAyNjB,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@repzo/widget-react-native",
-  "version": "1.0.4",
+  "version": "1.0.6",
   "description": "Repzo chat widget for React Native \u2014 pure JavaScript, no native modules",
   "source": "./src/index.tsx",
   "main": "./lib/commonjs/index.js",

package/src/api/client.ts

@@ -12,6 +12,7 @@ import { SecureStorage, TOKEN_KEY } from '../storage';
 import type {
   AgentUiAction,
   Conversation,
+  ConversationRatingResult,
   InitResponse,
   Message,
   OutboundMessage,
@@ -285,6 +286,18 @@ export class WidgetApiClient {
     );
   }
 
+  /** Answers (or changes) the rating card posted after a teammate closed the chat. */
+  rateConversation(
+    conversationId: string,
+    ratingId: string,
+    data: { rating: number; reason?: string | null; comment?: string | null }
+  ): Promise<ConversationRatingResult> {
+    return this.request(
+      `/api/widget/conversations/${encodeURIComponent(conversationId)}/ratings/${encodeURIComponent(ratingId)}`,
+      { method: 'POST', body: data }
+    );
+  }
+
   identify(data: {
     email?: string;
     name?: string;

package/src/i18n.ts

@@ -118,6 +118,20 @@ export const DEFAULT_LABELS = {
   messageSeen: 'Seen',
   waitingForTeammate: 'Waiting for a teammate',
   joinedConversation: 'joined the conversation',
+  // Conversation rating card, posted after a teammate closes the chat.
+  ratingQuestion: 'How would you rate this conversation?',
+  ratingReasonPrompt: 'What went wrong?',
+  ratingCommentPlaceholder: 'Tell us more (optional)',
+  ratingSubmit: 'Submit',
+  ratingThanks: 'Thanks for your feedback!',
+  ratingLocked: 'This rating can no longer be changed',
+  ratingExpired: 'This conversation can no longer be rated',
+  ratingFailed: "Couldn't save your rating. Please try again.",
+  rating1: 'Terrible',
+  rating2: 'Bad',
+  rating3: 'OK',
+  rating4: 'Great',
+  rating5: 'Amazing',
   // Forms.
   procedureSend: 'Send details',
   procedureSent: 'Sent',

package/src/locales.ts

@@ -74,6 +74,19 @@ const ar: LabelMap = {
   messageSeen: 'تمت المشاهدة',
   waitingForTeammate: 'بانتظار أحد أعضاء الفريق',
   joinedConversation: 'انضم إلى المحادثة',
+  ratingQuestion: 'كيف تقيّم هذه المحادثة؟',
+  ratingReasonPrompt: 'ما الذي لم يكن جيداً؟',
+  ratingCommentPlaceholder: 'أخبرنا المزيد (اختياري)',
+  ratingSubmit: 'إرسال',
+  ratingThanks: 'شكراً على ملاحظاتك!',
+  ratingLocked: 'لم يعد بالإمكان تغيير هذا التقييم',
+  ratingExpired: 'لم يعد بالإمكان تقييم هذه المحادثة',
+  ratingFailed: 'تعذّر حفظ تقييمك. حاول مرة أخرى.',
+  rating1: 'سيئ جداً',
+  rating2: 'سيئ',
+  rating3: 'مقبول',
+  rating4: 'جيد',
+  rating5: 'ممتاز',
   procedureSend: 'إرسال التفاصيل',
   procedureSent: 'تم الإرسال',
   fieldRequired: '{field} مطلوب',

package/src/state/widget-store.ts

@@ -22,6 +22,7 @@ import type {
   AgentUiAction,
   BootOptions,
   Conversation,
+  ConversationRatingResult,
   Message,
   OutgoingAttachment,
   RepzoWidgetErrorCode,
@@ -35,7 +36,7 @@ import type {
 } from '../types';
 import { setOpenUrlHandler } from '../ui/utils/safe-url';
 
-const SDK_VERSION = '@repzo/widget-react-native@1.0.4';
+const SDK_VERSION = '@repzo/widget-react-native@1.0.5';
 
 /** The platform this session reports — mobile sessions get the Mobile SDKs overrides. */
 function sessionPlatform(): 'ios' | 'android' | 'web' {
@@ -489,7 +490,7 @@ export class WidgetStore {
       loading: false,
       error: null,
       errorCode: null,
-      config: result.config,
+      config: this.hydrateConfig(result.config),
       identityId: result.identityId,
       conversations,
       // Also seeds the launcher badge, so a reply that landed while the app
@@ -512,7 +513,7 @@ export class WidgetStore {
       },
     }));
 
-    this.persistConfig(result.config);
+    this.persistConfig(this.hydrateConfig(result.config));
     this.connectRealtime(result.token);
     this.watchAppState();
     this.loadOutboundMessage();
@@ -558,13 +559,28 @@ export class WidgetStore {
         cached.platform === sessionPlatform() &&
         !this.state.config
       ) {
-        this.setState({ config: cached.config });
+        this.setState({ config: this.hydrateConfig(cached.config) });
       }
     } catch {
       // Corrupt cache — the network config overwrites it shortly.
     }
   }
 
+  /**
+   * The server sends the home logo and background image as paths relative to
+   * Workstation (`/api/media/:id/download`), which a React Native Image can't
+   * load. Resolved against the boot `baseUrl` they become full links (public
+   * media redirects to the CDN). Absolute URLs pass through unchanged.
+   */
+  private hydrateConfig(config: WidgetConfig): WidgetConfig {
+    if (!config) return config;
+    return {
+      ...config,
+      homeLogoUrl: this.client.resolveUrl(config.homeLogoUrl),
+      homeBackgroundImageUrl: this.client.resolveUrl(config.homeBackgroundImageUrl),
+    };
+  }
+
   private persistConfig(config: WidgetConfig): void {
     if (!this.bootConfig) return;
     const entry: CachedConfig = {
@@ -1835,6 +1851,39 @@ export class WidgetStore {
     await this.client.identify(data);
   }
 
+  /**
+   * Answers a rating card in the thread on screen and mirrors the answer onto
+   * its message, so the card keeps it across a re-render. Rejects with the
+   * server's error (409 locked, 410 expired) for the card to show.
+   */
+  async rateConversation(
+    messageId: string,
+    ratingId: string,
+    data: { rating: number; reason?: string | null; comment?: string | null }
+  ): Promise<ConversationRatingResult> {
+    const conversationId = this.state.activeConversationId;
+    if (!conversationId) throw new RepzoWidgetError('No conversation is open', 0, 'http');
+    const result = await this.client.rateConversation(conversationId, ratingId, data);
+    if (this.state.activeConversationId === conversationId) {
+      this.setState((current) => ({
+        messages: current.messages.map((message) =>
+          message.id === messageId
+            ? {
+                ...message,
+                metadata: {
+                  ...message.metadata,
+                  rating: result.rating,
+                  ratingReason: result.reason,
+                  ratingComment: result.comment,
+                },
+              }
+            : message
+        ),
+      }));
+    }
+    return result;
+  }
+
   /** Fire-and-forget visitor typing ping, throttled well under the 30/min cap. */
   notifyTyping(isTyping: boolean): void {
     const conversationId = this.state.activeConversationId;

package/src/types.ts

@@ -480,6 +480,25 @@ export interface RepzoWidgetStorageAdapter {
  * - `identity_verification_failed` — `userHash` missing/wrong while the
  *   channel enforces identity verification.
  */
+/** A bad-rating reason on the rating card, labelled per language. */
+export interface RatingReason {
+  id: string;
+  /** Locale code → label. */
+  labels: Record<string, string>;
+}
+
+/** The visitor's answer to a conversation rating card. */
+export interface ConversationRatingResult {
+  id: string;
+  /** 1 (Terrible) … 5 (Amazing). */
+  rating: number;
+  /** Id of the reason picked after a bad rating (1–2), if any. */
+  reason: string | null;
+  comment: string | null;
+  /** A comment was left: the rating can't change any more. */
+  locked: boolean;
+}
+
 export type RepzoWidgetErrorCode =
   | 'network'
   | 'http'

package/src/ui/WidgetProvider.tsx

@@ -12,6 +12,7 @@ import {
   Modal,
   Platform,
   Pressable,
+  StatusBar,
   StyleSheet,
   Text,
   View,
@@ -35,13 +36,22 @@ import { InAppNotification } from './components/InAppNotification';
 import { OutboundMessageCard } from './components/OutboundMessageCard';
 import { WidgetPanel } from './components/WidgetPanel';
 import { useKeyboardOverlap } from './hooks/use-keyboard-overlap';
+import { TopInsetContext } from './hooks/use-top-inset';
 import { useWidgetInsets } from './hooks/use-widget-insets';
 import { ChatView } from './screens/chat/ChatView';
 import { ConversationsList } from './screens/conversations/ConversationsList';
-import { HomeView } from './screens/home/HomeView';
+import { HomeView, resolveHeaderTextColor } from './screens/home/HomeView';
 import { PreChatForm } from './screens/pre-chat/PreChatForm';
 import { globalStyles } from './styles/global';
-import { buildTheme, palette, radius, spacing, fontSize, withAlpha } from './styles/theme';
+import {
+  buildTheme,
+  contrastingTextColor,
+  palette,
+  radius,
+  spacing,
+  fontSize,
+  withAlpha,
+} from './styles/theme';
 import { pickRecentConversations, pickTeamAgents } from './utils/conversations';
 
 export interface RepzoWidgetProviderProps {
@@ -192,6 +202,21 @@ export function RepzoWidgetProvider({
     : null;
   const isHomeSurface = state.view === 'home';
 
+  // Home and chat paint their brand header under the status bar; every other
+  // screen (and an outbound card stacked above home) keeps a plain white top.
+  const outboundVisible =
+    !!state.outboundMessage && !blockingError && state.view !== 'chat' && state.view !== 'prechat';
+  const headerOwnsTopInset =
+    !blockingError &&
+    !(state.loading && !state.config) &&
+    !outboundVisible &&
+    (state.view === 'chat' || isHomeSurface);
+  const topBarColor = !headerOwnsTopInset
+    ? palette.ink
+    : state.view === 'chat'
+      ? contrastingTextColor(theme.primaryColor)
+      : resolveHeaderTextColor(localizedConfig, theme.primaryColor);
+
   const renderContent = () => {
     if (state.loading && !state.config) {
       return (
@@ -270,6 +295,7 @@ export function RepzoWidgetProvider({
           teamAvatars={teamAvatars}
           replyTimeLabel={theme.replyTimeLabel}
           locale={state.locale}
+          defaultLocale={state.config?.defaultLocale}
           prefillText={state.prefillText}
           offlineMessage={theme.offlineMessage}
           labels={{
@@ -295,6 +321,17 @@ export function RepzoWidgetProvider({
             procedureSend: labels.procedureSend,
             procedureSent: labels.procedureSent,
             blocks: blockLabels,
+            rating: {
+              question: labels.ratingQuestion,
+              reasonPrompt: labels.ratingReasonPrompt,
+              commentPlaceholder: labels.ratingCommentPlaceholder,
+              submit: labels.ratingSubmit,
+              thanks: labels.ratingThanks,
+              locked: labels.ratingLocked,
+              expired: labels.ratingExpired,
+              failed: labels.ratingFailed,
+              scale: [labels.rating1, labels.rating2, labels.rating3, labels.rating4, labels.rating5],
+            },
             attach: attachLabels,
             viewer: {
               close: labels.close,
@@ -306,6 +343,7 @@ export function RepzoWidgetProvider({
           onPickAttachments={pickAttachments}
           onSendMessage={handleSendMessage}
           onIdentifyVisitor={(data) => store.identifyVisitor(data)}
+          onRateConversation={(messageId, ratingId, data) => store.rateConversation(messageId, ratingId, data)}
           onLoadMore={() => store.loadMoreMessages()}
           onTyping={(isTyping) => store.notifyTyping(isTyping)}
           onBack={handleBack}
@@ -405,8 +443,19 @@ export function RepzoWidgetProvider({
         animationType="slide"
         presentationStyle={Platform.OS === 'ios' ? presentationStyle : undefined}
         onRequestClose={handleClose}
-        statusBarTranslucent={false}>
-        <View style={[globalStyles.screen, { paddingTop: topInset, paddingBottom: insets.bottom }]}>
+        // Edge to edge on every Android version, so the insets below are the
+        // only top spacing (a non-translucent modal used to add a second one).
+        statusBarTranslucent>
+        <StatusBar
+          barStyle={topBarColor === palette.white ? 'light-content' : 'dark-content'}
+          animated
+        />
+        <View
+          style={[
+            globalStyles.screen,
+            { paddingTop: headerOwnsTopInset ? 0 : topInset, paddingBottom: insets.bottom },
+          ]}>
+          <TopInsetContext.Provider value={headerOwnsTopInset ? topInset : 0}>
           <View
             onLayout={keyboard.onLayout}
             style={[globalStyles.fill, { paddingBottom: keyboard.overlap }]}>
@@ -463,6 +512,7 @@ export function RepzoWidgetProvider({
               </WidgetPanel>
             </WidgetErrorBoundary>
           </View>
+          </TopInsetContext.Provider>
         </View>
       </Modal>
     </>

package/src/ui/components/Gradient.tsx

@@ -104,6 +104,22 @@ function GradientFill({ colors, bands }: { colors: string[]; bands?: number }) {
   );
 }
 
+/**
+ * Alpha at evenly spaced points down the fade. An eased curve instead of a
+ * straight line: a linear ramp shows a visible edge where it starts and goes
+ * opaque too late, so the brand colour reads as a band rather than melting
+ * into the page. Shared with the web widget's fade so both look the same.
+ */
+const FADE_STOPS = [0, 0.04, 0.12, 0.26, 0.46, 0.68, 0.86, 0.96, 1];
+
+function fadeAlphaAt(progress: number): number {
+  const scaled = Math.min(Math.max(progress, 0), 1) * (FADE_STOPS.length - 1);
+  const index = Math.min(Math.floor(scaled), FADE_STOPS.length - 2);
+  const from = FADE_STOPS[index] as number;
+  const to = FADE_STOPS[index + 1] as number;
+  return from + (to - from) * (scaled - index);
+}
+
 /**
  * Washes the bottom of a header out into the page colour: a straight ramp from
  * fully transparent at the top to opaque at the bottom edge, the same
@@ -129,7 +145,8 @@ export function FadeOverlay({
     <View style={[styles.fadeOverlay, { height }, style]} pointerEvents="none">
       {NativeGradient ? (
         <NativeGradient
-          colors={[withAlpha(color, 0), color]}
+          colors={FADE_STOPS.map((alpha) => withAlpha(color, alpha))}
+          locations={FADE_STOPS.map((_, index) => index / (FADE_STOPS.length - 1))}
           start={VERTICAL.start}
           end={VERTICAL.end}
           style={StyleSheet.absoluteFill}
@@ -144,7 +161,7 @@ export function FadeOverlay({
           // body colour, with no hairline where the two meet.
           <View
             key={index}
-            style={[styles.band, { backgroundColor: withAlpha(color, (index + 1) / all.length) }]}
+            style={[styles.band, { backgroundColor: withAlpha(color, fadeAlphaAt((index + 1) / all.length)) }]}
           />
         ))
       )}