cmcts-c-agent-embedding 1.0.27 → 1.0.29-cagent

package/dist/window.d.ts

@@ -9,6 +9,8 @@ type BotProps = {
     theme?: BubbleTheme;
     chatwootUrl?: string;
     roomIds?: Record<string, string>;
+    isUseFAQ?: boolean;
+    onResetChat?: () => Promise<void>;
 };
 export declare const initFull: (props: BotProps & {
     id?: string;

package/dist/window.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"window.d.ts","sourceRoot":"","sources":["../src/window.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AACvD,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAGtD,KAAK,QAAQ,GAAG;IACd,UAAU,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,SAAS,CAAC,EAAE,CAAC,OAAO,EAAE,WAAW,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IACpD,cAAc,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACzC,eAAe,CAAC,EAAE,mBAAmB,CAAC;IACtC,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,OAAO,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;CAClC,CAAC;AAIF,eAAO,MAAM,QAAQ,UAAW,QAAQ,GAAG;IAAE,EAAE,CAAC,EAAE,MAAM,CAAA;CAAE,SAMzD,CAAC;AAEF,eAAO,MAAM,IAAI,UAAW,QAAQ,SAMnC,CAAC;AAEF,eAAO,MAAM,OAAO,YAEnB,CAAC;AAEF,KAAK,OAAO,GAAG;IACb,QAAQ,EAAE,OAAO,QAAQ,CAAC;IAC1B,IAAI,EAAE,OAAO,IAAI,CAAC;IAClB,OAAO,EAAE,OAAO,OAAO,CAAC;CACzB,CAAC;AAQF,eAAO,MAAM,YAAY;sBAhCO,QAAQ,GAAG;QAAE,EAAE,CAAC,EAAE,MAAM,CAAA;KAAE;kBAQ9B,QAAQ;;CA4BlC,CAAC;AAEH,eAAO,MAAM,qBAAqB,QAAS,OAAO,SAGjD,CAAC"}
+{"version":3,"file":"window.d.ts","sourceRoot":"","sources":["../src/window.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AACvD,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAGtD,KAAK,QAAQ,GAAG;IACd,UAAU,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,SAAS,CAAC,EAAE,CAAC,OAAO,EAAE,WAAW,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IACpD,cAAc,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACzC,eAAe,CAAC,EAAE,mBAAmB,CAAC;IACtC,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,OAAO,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACjC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;CACnC,CAAC;AAIF,eAAO,MAAM,QAAQ,UAAW,QAAQ,GAAG;IAAE,EAAE,CAAC,EAAE,MAAM,CAAA;CAAE,SAMzD,CAAC;AAEF,eAAO,MAAM,IAAI,UAAW,QAAQ,SAOnC,CAAC;AAEF,eAAO,MAAM,OAAO,YAEnB,CAAC;AAEF,KAAK,OAAO,GAAG;IACb,QAAQ,EAAE,OAAO,QAAQ,CAAC;IAC1B,IAAI,EAAE,OAAO,IAAI,CAAC;IAClB,OAAO,EAAE,OAAO,OAAO,CAAC;CACzB,CAAC;AAQF,eAAO,MAAM,YAAY;sBAjCO,QAAQ,GAAG;QAAE,EAAE,CAAC,EAAE,MAAM,CAAA;KAAE;kBAQ9B,QAAQ;;CA6BlC,CAAC;AAEH,eAAO,MAAM,qBAAqB,QAAS,OAAO,SAGjD,CAAC"}

package/docs/chart-rendering-implementation-plan.md

@@ -0,0 +1,565 @@
+# Chart Rendering Implementation Plan
+
+## Overview
+
+This document outlines the implementation plan for rendering Chart.js charts by parsing XML tags from SSE streaming API responses in the Flowise chatbot embed.
+
+## Table of Contents
+
+1. [Architecture Overview](#architecture-overview)
+2. [Data Flow](#data-flow)
+3. [New Components and Utilities](#new-components-and-utilities)
+4. [Modifications to Existing Components](#modifications-to-existing-components)
+5. [Implementation Steps](#implementation-steps)
+6. [Edge Cases and Error Handling](#edge-cases-and-error-handling)
+7. [Testing Strategy](#testing-strategy)
+
+---
+
+## Architecture Overview
+
+### Current Architecture
+
+```
+SSE Stream → fetchEventSource → token event → addToStreamBuffer → processTextBuffer → updateLastMessage → BotBubble (Marked.parse) → innerHTML
+```
+
+### Proposed Architecture
+
+```
+SSE Stream → fetchEventSource → token event → ChartTagParser (intercepts) → 
+  ├── Regular text → addToStreamBuffer → processTextBuffer → updateLastMessage
+  └── Chart tags → ChartBuffer (accumulates) → Complete chart → ChartRenderer
+                                                                      ↓
+                                              BotBubble (renders mixed content: text + charts)
+```
+
+### Key Architectural Decisions
+
+1. **Separation of Concerns**: Chart parsing logic is isolated in a dedicated utility (`ChartTagParser`)
+2. **State Machine Approach**: Use a state machine to track whether we're inside a chart tag, parsing text, or in an incomplete state
+3. **Deferred Rendering**: Charts render only when the complete `<chart>...</chart>` tag is received
+4. **Placeholder System**: Show loading skeleton while chart data is streaming
+5. **Chart Instance Management**: Track Chart.js instances for proper cleanup to prevent memory leaks
+
+---
+
+## Data Flow
+
+### Streaming Flow (Detailed)
+
+1. **Token arrives** via SSE `token` event in `Bot.tsx`
+2. **ChartTagParser.processToken(token)** analyzes the token:
+   - If currently inside a chart tag: buffer the token
+   - If token starts a chart tag: start buffering, emit placeholder ID
+   - If token completes a chart tag: parse and emit chart config
+   - Otherwise: pass through as regular text
+3. **Regular text** flows to existing `addToStreamBuffer` → `processTextBuffer` pipeline
+4. **Chart placeholders** are inserted as special markers: `<!--chart:uuid-->`
+5. **BotBubble.updateBotMessageContent()** is modified to:
+   - Parse markdown as usual
+   - Detect chart placeholder markers
+   - Replace markers with chart container elements
+   - Initialize Chart.js instances for completed charts
+
+### State Machine States
+
+```
+IDLE → OPENING_TAG → INSIDE_TAG → CLOSING_TAG → IDLE
+         ↓               ↓            ↓
+      (partial)      (buffering)   (partial)
+```
+
+---
+
+## New Components and Utilities
+
+### 1. `src/utils/chartTagParser.ts`
+
+**Purpose**: Parse and extract chart XML tags from streaming tokens
+
+```typescript
+// Core interfaces
+interface ChartConfig {
+  id: string;
+  type: 'line' | 'bar' | 'pie' | 'doughnut' | 'radar' | 'polarArea' | 'bubble' | 'scatter';
+  title: string;
+  data: ChartData;
+  options?: ChartOptions;
+}
+
+interface ParseResult {
+  textContent: string;        // Regular text to render
+  chartPlaceholders: string[]; // Chart placeholder IDs added
+  completedCharts: ChartConfig[]; // Fully parsed charts
+}
+
+class ChartTagParser {
+  // Parser state
+  private state: ParserState;
+  private buffer: string;
+  private pendingCharts: Map<string, Partial<ChartConfig>>;
+  
+  // Main method called for each token
+  processToken(token: string): ParseResult;
+  
+  // Flush any remaining buffer (called on stream end)
+  flush(): ParseResult;
+  
+  // Reset parser state (called on new message)
+  reset(): void;
+}
+```
+
+**Key Features**:
+- Handles tokens split across tag boundaries
+- Generates unique IDs for each chart placeholder
+- Validates JSON configuration before parsing
+- Supports multiple charts in a single message
+
+### 2. `src/components/bubbles/ChartBubble.tsx`
+
+**Purpose**: SolidJS component that renders a Chart.js chart
+
+```typescript
+interface ChartBubbleProps {
+  config: ChartConfig;
+  backgroundColor?: string;
+  onDestroy?: () => void;
+}
+
+// Component responsibilities:
+// - Creates canvas element
+// - Initializes Chart.js instance
+// - Handles responsive sizing
+// - Cleans up on unmount
+```
+
+### 3. `src/components/bubbles/ChartLoadingPlaceholder.tsx`
+
+**Purpose**: Loading skeleton shown while chart data streams
+
+```typescript
+interface ChartLoadingPlaceholderProps {
+  chartId: string;
+}
+
+// Shows animated skeleton with:
+// - Chart icon
+// - "Loading chart..." text
+// - Pulsing animation
+```
+
+### 4. `src/utils/chartInstanceManager.ts`
+
+**Purpose**: Manage Chart.js instances lifecycle to prevent memory leaks
+
+```typescript
+class ChartInstanceManager {
+  private instances: Map<string, Chart>;
+
+  register(id: string, chart: Chart): void;
+  destroy(id: string): void;
+  destroyAll(): void;
+  get(id: string): Chart | undefined;
+}
+
+// Singleton instance exported for global access
+export const chartManager = new ChartInstanceManager();
+```
+
+---
+
+## Modifications to Existing Components
+
+### 1. `src/components/Bot.tsx`
+
+**Changes Required**:
+
+#### a. Import ChartTagParser
+```typescript
+import { ChartTagParser, ChartConfig } from '@/utils/chartTagParser';
+```
+
+#### b. Add chart parser instance and state
+```typescript
+// Add near other streaming state variables (around line 250)
+let chartParser: ChartTagParser | null = null;
+const [pendingCharts, setPendingCharts] = createSignal<Map<string, Partial<ChartConfig>>>(new Map());
+const [completedCharts, setCompletedCharts] = createSignal<Map<string, ChartConfig>>(new Map());
+```
+
+#### c. Modify token handling in `fetchResponseFromEventStream`
+```typescript
+case 'token':
+  setCurrentStatusMsg('');
+
+  // Process token through chart parser first
+  if (!chartParser) chartParser = new ChartTagParser();
+  const parseResult = chartParser.processToken(payload.data);
+
+  // Handle regular text content
+  if (parseResult.textContent) {
+    addToStreamBuffer(parseResult.textContent);
+  }
+
+  // Track new chart placeholders
+  parseResult.chartPlaceholders.forEach(id => {
+    setPendingCharts(prev => new Map(prev).set(id, { id }));
+  });
+
+  // Handle completed charts
+  parseResult.completedCharts.forEach(chart => {
+    setCompletedCharts(prev => new Map(prev).set(chart.id, chart));
+    setPendingCharts(prev => {
+      const next = new Map(prev);
+      next.delete(chart.id);
+      return next;
+    });
+  });
+  break;
+```
+
+#### d. Modify 'start' event to reset parser
+```typescript
+case 'start':
+  // ... existing code ...
+  chartParser = new ChartTagParser(); // Reset parser for new message
+  setPendingCharts(new Map());
+  setCompletedCharts(new Map());
+  break;
+```
+
+#### e. Modify 'end' event to flush parser
+```typescript
+case 'end':
+  // Flush any remaining chart parser content
+  if (chartParser) {
+    const flushResult = chartParser.flush();
+    if (flushResult.textContent) {
+      addToStreamBuffer(flushResult.textContent);
+    }
+    // Handle any final completed charts
+    flushResult.completedCharts.forEach(chart => {
+      setCompletedCharts(prev => new Map(prev).set(chart.id, chart));
+    });
+  }
+  // ... existing code ...
+  break;
+```
+
+#### f. Pass chart data to BotBubble
+```typescript
+<BotBubble
+  // ... existing props ...
+  pendingCharts={pendingCharts()}
+  completedCharts={completedCharts()}
+/>
+```
+
+### 2. `src/components/bubbles/BotBubble.tsx`
+
+**Changes Required**:
+
+#### a. Add new props
+```typescript
+type Props = {
+  // ... existing props ...
+  pendingCharts?: Map<string, Partial<ChartConfig>>;
+  completedCharts?: Map<string, ChartConfig>;
+};
+```
+
+#### b. Modify updateBotMessageContent function
+```typescript
+function updateBotMessageContent(newMessage: string) {
+  if (botMessageEl) {
+    const safeMessage = convertEmailToMarkdownLink(newMessage);
+    let htmlContent = Marked.parse(safeMessage);
+
+    // Replace chart placeholders with actual chart containers
+    htmlContent = replaceChartPlaceholders(htmlContent, props.completedCharts, props.pendingCharts);
+
+    botMessageEl.innerHTML = htmlContent;
+
+    // Initialize Chart.js instances for completed charts
+    initializeCharts(botMessageEl, props.completedCharts);
+
+    botMessageEl.querySelectorAll('a').forEach((link) => {
+      link.target = '_blank';
+    });
+  }
+}
+```
+
+#### c. Add chart initialization and cleanup
+```typescript
+import { chartManager } from '@/utils/chartInstanceManager';
+
+// In component cleanup
+onCleanup(() => {
+  // Destroy all chart instances for this bubble
+  props.completedCharts?.forEach((_, id) => {
+    chartManager.destroy(id);
+  });
+});
+```
+
+---
+
+## Implementation Steps
+
+### Phase 1: Setup and Dependencies (Priority: High)
+1. **Add Chart.js dependency**: `yarn add chart.js`
+2. **Create type definitions** for chart configurations
+3. **Create chartTagParser.ts** with basic parsing logic
+
+### Phase 2: Core Parser Implementation (Priority: High)
+4. **Implement state machine** in ChartTagParser
+5. **Handle edge cases**: partial tags, malformed JSON, nested content
+6. **Write unit tests** for parser
+
+### Phase 3: Chart Rendering Components (Priority: High)
+7. **Create ChartBubble.tsx** component
+8. **Create ChartLoadingPlaceholder.tsx** component
+9. **Create chartInstanceManager.ts** utility
+
+### Phase 4: Integration with Streaming (Priority: High)
+10. **Modify Bot.tsx** to integrate ChartTagParser
+11. **Modify BotBubble.tsx** to render charts
+12. **Test with live SSE streaming**
+
+### Phase 5: Styling and Polish (Priority: Medium)
+13. **Add responsive chart sizing**
+14. **Style chart containers** to match chat UI
+15. **Add error states** for failed chart rendering
+
+### Phase 6: Testing and Edge Cases (Priority: High)
+16. **Test multiple charts** in single message
+17. **Test chart + text** mixed content
+18. **Test memory cleanup** on message updates
+19. **Test with various chart types**
+
+---
+
+## Edge Cases and Error Handling
+
+### Edge Case 1: Incomplete Chart Tag at Stream End
+**Scenario**: Stream ends while inside a chart tag
+**Solution**: `flush()` method treats incomplete tag as plain text
+```typescript
+flush(): ParseResult {
+  if (this.state !== ParserState.IDLE) {
+    // Emit buffered content as plain text
+    return { textContent: this.buffer, chartPlaceholders: [], completedCharts: [] };
+  }
+  return { textContent: '', chartPlaceholders: [], completedCharts: [] };
+}
+```
+
+### Edge Case 2: Malformed JSON in Chart Tag
+**Scenario**: Chart tag contains invalid JSON
+**Solution**: Render error message inline instead of chart
+```typescript
+try {
+  const config = JSON.parse(jsonContent);
+  return { type: 'chart', config };
+} catch (e) {
+  return { type: 'error', message: 'Invalid chart configuration' };
+}
+```
+
+### Edge Case 3: Token Splits Tag Boundary
+**Scenario**: Token contains partial opening/closing tag
+```
+Token 1: "Here is the data: <cha"
+Token 2: "rt type=\"line\">"
+Token 3: "{\"labels\": [...]}"
+Token 4: "</chart>"
+```
+**Solution**: State machine buffers partial tags until complete
+
+### Edge Case 4: Nested or Escaped Content
+**Scenario**: JSON contains `</chart>` as string value
+**Solution**: Track brace depth to find true closing tag
+```typescript
+// Count braces to find actual JSON end
+let braceDepth = 0;
+for (let i = 0; i < content.length; i++) {
+  if (content[i] === '{') braceDepth++;
+  if (content[i] === '}') braceDepth--;
+  if (braceDepth === 0) {
+    // Found JSON end
+  }
+}
+```
+
+### Edge Case 5: Multiple Charts Back-to-Back
+**Scenario**: `<chart>...</chart><chart>...</chart>`
+**Solution**: Parser resets to IDLE after each complete tag
+
+### Edge Case 6: Chart in Middle of Text
+**Scenario**: "Here's the chart: <chart>...</chart> And here's more text."
+**Solution**: Emit text before chart, placeholder, then text after
+
+### Edge Case 7: Memory Leaks from Chart Instances
+**Scenario**: Charts created but never destroyed
+**Solution**: ChartInstanceManager tracks all instances, cleanup on:
+- Component unmount
+- Message update (chart replaced)
+- Chat clear
+
+### Edge Case 8: Rapid Streaming Updates
+**Scenario**: Chart placeholder created, then immediately completed
+**Solution**: Debounce chart initialization, check if placeholder still exists
+
+---
+
+## Testing Strategy
+
+### Unit Tests
+
+1. **ChartTagParser Tests**
+   - Parse complete chart tag in single token
+   - Parse chart tag split across multiple tokens
+   - Handle malformed JSON gracefully
+   - Handle multiple charts in sequence
+   - Handle chart embedded in text
+   - Handle incomplete tags on flush
+
+2. **ChartInstanceManager Tests**
+   - Register and retrieve instances
+   - Destroy individual instance
+   - Destroy all instances
+   - Handle destroy of non-existent instance
+
+### Integration Tests
+
+1. **Streaming Simulation**
+   - Simulate SSE tokens with chart tags
+   - Verify placeholder appears during streaming
+   - Verify chart renders on completion
+
+2. **BotBubble Rendering**
+   - Render message with chart
+   - Render message with multiple charts
+   - Render mixed text and charts
+   - Verify chart cleanup on unmount
+
+### Manual Testing Checklist
+
+- [ ] Single line chart renders correctly
+- [ ] Bar chart renders correctly
+- [ ] Pie/doughnut chart renders correctly
+- [ ] Chart title displays correctly
+- [ ] Chart is responsive (resizes with container)
+- [ ] Multiple charts in one message
+- [ ] Chart between paragraphs of text
+- [ ] Loading placeholder shows during streaming
+- [ ] Error message for invalid chart config
+- [ ] No console errors on chat clear
+- [ ] No memory leaks (check dev tools)
+
+---
+
+## Chart XML Tag Format Reference
+
+### Basic Structure
+```xml
+<chart type="line" title="Chart Title">
+{
+  "labels": ["Label1", "Label2", ...],
+  "datasets": [
+    {
+      "label": "Dataset Label",
+      "data": [1, 2, 3, ...],
+      "backgroundColor": "rgba(54, 162, 235, 0.2)",
+      "borderColor": "rgba(54, 162, 235, 1)",
+      "borderWidth": 2
+    }
+  ],
+  "options": {
+    "responsive": true,
+    "plugins": {
+      "legend": { "position": "top" }
+    }
+  }
+}
+</chart>
+```
+
+### Supported Chart Types
+- `line` - Line chart
+- `bar` - Bar chart
+- `pie` - Pie chart
+- `doughnut` - Doughnut chart
+- `radar` - Radar chart
+- `polarArea` - Polar area chart
+- `bubble` - Bubble chart
+- `scatter` - Scatter chart
+
+### Required Fields
+- `type` attribute (chart type)
+- `labels` array in JSON body
+- `datasets` array with at least one dataset
+- Each dataset must have `data` array
+
+### Optional Fields
+- `title` attribute (displayed above chart)
+- `options` object (Chart.js options)
+- Dataset styling properties (colors, borders, etc.)
+
+---
+
+## Dependencies to Add
+
+```json
+{
+  "dependencies": {
+    "chart.js": "^4.4.0"
+  }
+}
+```
+
+**Installation Command**: `yarn add chart.js`
+
+---
+
+## File Structure After Implementation
+
+```
+src/
+├── components/
+│   ├── bubbles/
+│   │   ├── BotBubble.tsx          (modified)
+│   │   ├── ChartBubble.tsx        (new)
+│   │   └── ChartLoadingPlaceholder.tsx (new)
+│   └── Bot.tsx                     (modified)
+├── utils/
+│   ├── chartTagParser.ts          (new)
+│   ├── chartInstanceManager.ts    (new)
+│   └── index.ts
+└── types/
+    └── chart.ts                   (new - type definitions)
+```
+
+---
+
+## Performance Considerations
+
+1. **Lazy Loading**: Consider lazy-loading Chart.js to reduce initial bundle size
+2. **Canvas Optimization**: Use `devicePixelRatio` option for crisp rendering
+3. **Animation**: Disable animations during streaming for smoother experience
+4. **Debouncing**: Debounce chart updates if data changes rapidly
+5. **Memory**: Always destroy Chart instances when no longer needed
+
+---
+
+## Future Enhancements (Out of Scope)
+
+1. **Interactive Charts**: Click handlers, tooltips, zoom
+2. **Chart Export**: Download as PNG/SVG
+3. **Chart Editing**: Allow users to modify chart after rendering
+4. **More Chart Types**: Support for additional Chart.js plugins
+5. **Real-time Updates**: Support for updating chart data after initial render
+

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cmcts-c-agent-embedding",
-  "version": "1.0.27",
+  "version": "1.0.29-cagent",
   "description": "Javascript library to display flowise chatbot on your website",
   "type": "module",
   "main": "dist/index.js",
@@ -8,13 +8,15 @@
   "scripts": {
     "dev": "cross-env NODE_ENV=development rollup --watch --config rollup.config.js",
     "build": "cross-env NODE_ENV=production rollup --config rollup.config.js",
-    "lint": "eslint \"src/**/*.ts*\"",
-    "lint-fix": "eslint --fix \"src/**/*.ts*\"",
+    "type-check": "tsc --noEmit",
+    "lint": "eslint --quiet \"src/**/*.ts*\"",
+    "lint-fix": "eslint --quiet --fix \"src/**/*.ts*\"",
     "format": "prettier --write \"**/*.{js,jsx,ts,tsx,md,mdx}\"",
     "format:check": "prettier --check \"**/*.{js,jsx,ts,tsx,md,mdx}\"",
     "prepare": "husky install",
     "start": "node server.js",
-    "build-and-publish": "yarn build && npm login && npm publish"
+    "build-and-publish": "yarn build && npm publish",
+    "prepublishOnly": "yarn build"
   },
   "license": "MIT",
   "dependencies": {
@@ -25,6 +27,8 @@
     "axios": "^1.7.7",
     "c-agent-embedding": "^1.0.4",
     "c-agent-embedding-react": "^1.0.1",
+    "chart.js": "^4.5.1",
+    "chartjs-plugin-datalabels": "^2.2.0",
     "cors": "^2.8.5",
     "cross-env": "^7.0.3",
     "device-detector-js": "^3.0.3",
@@ -77,4 +81,4 @@
     "uuid": "^9.0.1"
   },
   "packageManager": "yarn@1.22.22+sha512.a6b2f7906b721bba3d67d4aff083df04dad64c399707841b7acf00f6b133b7ac24255f2652fa22ae3534329dc6180534e98d17432037ff6fd140556e2bb3137e"
-}
+}