@waniwani/sdk 0.16.0 → 0.17.0

package/dist/chat/index.d.ts

@@ -357,6 +357,13 @@ interface ChatAppearance {
     theme?: ThemePreset;
     /** Per-property overrides applied on top of the preset. */
     variables?: ChatTheme;
+    /**
+     * Render assistant messages inside a filled bubble (background + padding +
+     * radius), styled by `variables.assistantBubbleColor` /
+     * `assistantBubbleTextColor`. Defaults to `false` — assistant messages
+     * render as plain text. Opt in for a "both sides bubbled" chat style.
+     */
+    assistantBubble?: boolean;
 }
 /**
  * Tool-call activity rendering mode. Steps are grouped into one collapsible
@@ -406,6 +413,20 @@ interface ChatTheme {
     statusColor?: string;
     /** Tool call JSON section background. Defaults to light gray / #262626 in dark. */
     toolCardColor?: string;
+    /** Text color inside the user message bubble. Falls back to `primaryForeground`. */
+    userBubbleTextColor?: string;
+    /** Text color inside the assistant message bubble (only visible when `appearance.assistantBubble` is enabled). Falls back to `textColor`. */
+    assistantBubbleTextColor?: string;
+    /** Horizontal padding inside message bubbles (px). Defaults to 16. */
+    messagePaddingX?: number;
+    /** Vertical padding inside message bubbles (px). Defaults to 12. */
+    messagePaddingY?: number;
+    /** Max width of a message bubble as a CSS length/percentage. Defaults to `"80%"`. */
+    messageMaxWidth?: string;
+    /** Base font size for message text (px). When unset, messages use the CSS default of `1rem` (16px at the standard root font size). */
+    fontSize?: number;
+    /** Base line height for message text (unitless string, e.g. `"1.5"`). Defaults to `"1.5"`. */
+    lineHeight?: string;
 }
 interface WelcomeConfig {
     /** Icon displayed above the title. Accepts any React node (e.g. an SVG or img). */
@@ -429,6 +450,27 @@ interface SuggestionsConfig {
      */
     dynamic?: boolean;
 }
+/**
+ * Per-slot class name overrides for the chat widget. Each string is appended
+ * to the slot's own classes (merged with `tailwind-merge`, `ww` prefix). Use
+ * with your own (prefixed or plain) CSS to restyle any element. In the React
+ * path these reach into internals directly; in the `<script>` embed, prefer
+ * the stable `.ww-*` semantic classes with a `data-css` stylesheet.
+ */
+interface ChatClassNames {
+    /** Root chat container. */
+    root?: string;
+    /** Sticky header bar. */
+    header?: string;
+    /** Every message wrapper (both roles). */
+    message?: string;
+    /** The user message bubble content. */
+    userBubble?: string;
+    /** The assistant message bubble content. */
+    assistantBubble?: string;
+    /** The input bar container. */
+    input?: string;
+}
 interface ChatBaseProps {
     /** Waniwani project API key */
     apiKey?: string;
@@ -450,6 +492,8 @@ interface ChatBaseProps {
      * See `ChatAppearance` for the shape.
      */
     appearance?: ChatAppearance;
+    /** Per-slot class name overrides. See {@link ChatClassNames}. */
+    classNames?: ChatClassNames;
     /** Additional headers to send with chat API requests */
     headers?: Record<string, string>;
     /** Additional body fields to send with each chat request */
@@ -826,6 +870,8 @@ interface WaniwaniChatOverrides {
      * ```
      */
     appearance?: ChatAppearance;
+    /** Per-slot class name overrides. See `ChatClassNames`. */
+    classNames?: ChatClassNames;
     /** Chat API URL. Defaults to `https://app.waniwani.ai/api/mcp/chat`. */
     api?: string;
     /** Override the MCP server URL (rarely needed). */