admesh-ui-sdk 0.6.1 → 0.8.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CONVERSATIONAL_GUIDE.md +85 -1
- package/README.md +259 -2
- package/dist/App.d.ts +3 -0
- package/dist/App.d.ts.map +1 -0
- package/dist/components/AdMeshAutoRecommendationWidget.d.ts +17 -0
- package/dist/components/AdMeshAutoRecommendationWidget.d.ts.map +1 -0
- package/dist/components/AdMeshBadge.d.ts +4 -0
- package/dist/components/AdMeshBadge.d.ts.map +1 -0
- package/dist/components/AdMeshChatInput.d.ts +4 -0
- package/dist/components/AdMeshChatInput.d.ts.map +1 -0
- package/dist/components/AdMeshChatInterface.d.ts +4 -0
- package/dist/components/AdMeshChatInterface.d.ts.map +1 -0
- package/dist/components/AdMeshChatMessage.d.ts +4 -0
- package/dist/components/AdMeshChatMessage.d.ts.map +1 -0
- package/dist/components/AdMeshCitationReference.d.ts +4 -0
- package/dist/components/AdMeshCitationReference.d.ts.map +1 -0
- package/dist/components/AdMeshCitationUnit.d.ts +4 -0
- package/dist/components/AdMeshCitationUnit.d.ts.map +1 -0
- package/dist/components/AdMeshCompareTable.d.ts +4 -0
- package/dist/components/AdMeshCompareTable.d.ts.map +1 -0
- package/dist/components/AdMeshConversationSummary.d.ts +4 -0
- package/dist/components/AdMeshConversationSummary.d.ts.map +1 -0
- package/dist/components/AdMeshConversationalUnit.d.ts +4 -0
- package/dist/components/AdMeshConversationalUnit.d.ts.map +1 -0
- package/dist/components/AdMeshFloatingChat.d.ts +4 -0
- package/dist/components/AdMeshFloatingChat.d.ts.map +1 -0
- package/dist/components/AdMeshInlineRecommendation.d.ts +4 -0
- package/dist/components/AdMeshInlineRecommendation.d.ts.map +1 -0
- package/dist/components/AdMeshLayout.d.ts +4 -0
- package/dist/components/AdMeshLayout.d.ts.map +1 -0
- package/dist/components/AdMeshLinkTracker.d.ts +4 -0
- package/dist/components/AdMeshLinkTracker.d.ts.map +1 -0
- package/dist/components/AdMeshProductCard.d.ts +4 -0
- package/dist/components/AdMeshProductCard.d.ts.map +1 -0
- package/dist/components/AdMeshSidebar.d.ts +4 -0
- package/dist/components/AdMeshSidebar.d.ts.map +1 -0
- package/dist/components/AdMeshSidebarContent.d.ts +4 -0
- package/dist/components/AdMeshSidebarContent.d.ts.map +1 -0
- package/dist/components/AdMeshSidebarHeader.d.ts +4 -0
- package/dist/components/AdMeshSidebarHeader.d.ts.map +1 -0
- package/dist/components/index.d.ts +19 -0
- package/dist/components/index.d.ts.map +1 -0
- package/dist/hooks/useAdMeshStyles.d.ts +2 -0
- package/dist/hooks/useAdMeshStyles.d.ts.map +1 -0
- package/dist/hooks/useAdMeshTracker.d.ts +18 -0
- package/dist/hooks/useAdMeshTracker.d.ts.map +1 -0
- package/dist/index.d.ts +14 -391
- package/dist/index.d.ts.map +1 -0
- package/dist/index.js +6 -6
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +1055 -668
- package/dist/index.mjs.map +1 -1
- package/dist/main.d.ts +1 -0
- package/dist/main.d.ts.map +1 -0
- package/dist/stories/Button.d.ts +15 -0
- package/dist/stories/Button.d.ts.map +1 -0
- package/dist/stories/Header.d.ts +12 -0
- package/dist/stories/Header.d.ts.map +1 -0
- package/dist/stories/Page.d.ts +3 -0
- package/dist/stories/Page.d.ts.map +1 -0
- package/dist/types/index.d.ts +314 -0
- package/dist/types/index.d.ts.map +1 -0
- package/examples/auto-recommendation-integration.jsx +311 -0
- package/examples/citation-links-demo.html +167 -0
- package/examples/citation-usage.jsx +229 -0
- package/examples/clickable-product-names-demo.html +196 -0
- package/package.json +19 -3
package/CONVERSATIONAL_GUIDE.md
CHANGED
|
@@ -75,7 +75,7 @@ function ChatInterface() {
|
|
|
75
75
|
### 2. AI Assistant Integration
|
|
76
76
|
|
|
77
77
|
```tsx
|
|
78
|
-
import { AdMeshConversationalUnit, AdMeshConversationSummary } from 'admesh-ui-sdk';
|
|
78
|
+
import { AdMeshConversationalUnit, AdMeshConversationSummary, AdMeshCitationUnit } from 'admesh-ui-sdk';
|
|
79
79
|
|
|
80
80
|
function AIAssistant() {
|
|
81
81
|
const [conversation, setConversation] = useState([]);
|
|
@@ -202,6 +202,90 @@ Best for: End-of-conversation summaries, session wrap-ups
|
|
|
202
202
|
/>
|
|
203
203
|
```
|
|
204
204
|
|
|
205
|
+
### Citation Mode
|
|
206
|
+
Best for: AI assistants, academic-style references, natural product mentions
|
|
207
|
+
- Displays recommendations as numbered citations within text
|
|
208
|
+
- Interactive tooltips on hover
|
|
209
|
+
- Reference list at the bottom
|
|
210
|
+
- Perfect for AI responses that mention products naturally
|
|
211
|
+
|
|
212
|
+
```tsx
|
|
213
|
+
<AdMeshConversationalUnit
|
|
214
|
+
recommendations={recommendations}
|
|
215
|
+
config={{
|
|
216
|
+
displayMode: 'citation',
|
|
217
|
+
context: 'assistant'
|
|
218
|
+
}}
|
|
219
|
+
conversationSummary="Based on your requirements, I recommend HubSpot CRM for its excellent features..."
|
|
220
|
+
/>
|
|
221
|
+
```
|
|
222
|
+
|
|
223
|
+
## 📝 Citation-Based Integration
|
|
224
|
+
|
|
225
|
+
### Using Citation Components Directly
|
|
226
|
+
|
|
227
|
+
For more control over citation placement and styling:
|
|
228
|
+
|
|
229
|
+
```tsx
|
|
230
|
+
import { AdMeshCitationUnit, AdMeshCitationReference } from 'admesh-ui-sdk';
|
|
231
|
+
|
|
232
|
+
function AIResponseWithCitations({ responseText, recommendations }) {
|
|
233
|
+
return (
|
|
234
|
+
<div className="ai-response">
|
|
235
|
+
{/* Use the full citation unit */}
|
|
236
|
+
<AdMeshCitationUnit
|
|
237
|
+
recommendations={recommendations}
|
|
238
|
+
conversationText={responseText}
|
|
239
|
+
citationStyle="numbered"
|
|
240
|
+
showCitationList={true}
|
|
241
|
+
onRecommendationClick={(adId, link) => {
|
|
242
|
+
// Track citation clicks
|
|
243
|
+
analytics.track('citation_clicked', { adId });
|
|
244
|
+
window.open(link, '_blank');
|
|
245
|
+
}}
|
|
246
|
+
onCitationHover={(recommendation) => {
|
|
247
|
+
// Track citation hovers for engagement metrics
|
|
248
|
+
analytics.track('citation_hovered', {
|
|
249
|
+
productId: recommendation.product_id
|
|
250
|
+
});
|
|
251
|
+
}}
|
|
252
|
+
/>
|
|
253
|
+
</div>
|
|
254
|
+
);
|
|
255
|
+
}
|
|
256
|
+
|
|
257
|
+
// Or use individual citation references
|
|
258
|
+
function CustomTextWithCitations() {
|
|
259
|
+
return (
|
|
260
|
+
<p>
|
|
261
|
+
For your CRM needs, I recommend{' '}
|
|
262
|
+
<AdMeshCitationReference
|
|
263
|
+
recommendation={recommendations[0]}
|
|
264
|
+
citationNumber={1}
|
|
265
|
+
citationStyle="bracketed"
|
|
266
|
+
onClick={(adId, link) => window.open(link)}
|
|
267
|
+
/>
|
|
268
|
+
{' '}which offers excellent automation features.
|
|
269
|
+
</p>
|
|
270
|
+
);
|
|
271
|
+
}
|
|
272
|
+
```
|
|
273
|
+
|
|
274
|
+
### Citation Styles
|
|
275
|
+
|
|
276
|
+
Choose the citation style that best fits your application:
|
|
277
|
+
|
|
278
|
+
```tsx
|
|
279
|
+
// Numbered circles (default) - clean and modern
|
|
280
|
+
citationStyle="numbered" // (1)
|
|
281
|
+
|
|
282
|
+
// Bracketed - academic style
|
|
283
|
+
citationStyle="bracketed" // [1]
|
|
284
|
+
|
|
285
|
+
// Superscript - minimal footprint
|
|
286
|
+
citationStyle="superscript" // ¹
|
|
287
|
+
```
|
|
288
|
+
|
|
205
289
|
## 🔧 Advanced Configuration
|
|
206
290
|
|
|
207
291
|
### Delayed Display
|
package/README.md
CHANGED
|
@@ -1,9 +1,10 @@
|
|
|
1
1
|
# AdMesh UI SDK
|
|
2
2
|
|
|
3
|
-
A React + TypeScript component library for displaying AdMesh product recommendations with built-in tracking and theming support.
|
|
3
|
+
A React + TypeScript component library for displaying AdMesh product recommendations with **citation-based conversation ads**, built-in tracking, and theming support.
|
|
4
4
|
|
|
5
5
|
## 🚀 Features
|
|
6
6
|
|
|
7
|
+
- **Citation-Based Conversation Ads** - Display recommendations as numbered references within text, like academic papers or AI assistants
|
|
7
8
|
- **Pre-built UI Components** - Ready-to-use components for product recommendations
|
|
8
9
|
- **Built-in Tracking** - Automatic click, view, and conversion tracking
|
|
9
10
|
- **Intelligent Layouts** - Auto-selects optimal layout based on intent and data
|
|
@@ -84,6 +85,12 @@ End-of-conversation summary with top recommendations and action buttons.
|
|
|
84
85
|
#### AdMeshInlineRecommendation
|
|
85
86
|
Compact inline recommendation component perfect for chat interfaces.
|
|
86
87
|
|
|
88
|
+
#### AdMeshCitationUnit
|
|
89
|
+
Citation-based conversation ad component that displays recommendations as numbered references within text.
|
|
90
|
+
|
|
91
|
+
#### AdMeshCitationReference
|
|
92
|
+
Individual citation reference component for inline use within conversational text.
|
|
93
|
+
|
|
87
94
|
### 📋 Sidebar Components
|
|
88
95
|
|
|
89
96
|
#### AdMeshSidebar
|
|
@@ -109,6 +116,9 @@ Individual chat message component with recommendation support.
|
|
|
109
116
|
#### AdMeshChatInput
|
|
110
117
|
Chat input component with suggestions and auto-resize functionality.
|
|
111
118
|
|
|
119
|
+
#### AdMeshAutoRecommendationWidget
|
|
120
|
+
Standalone widget that automatically appears with recommendations when triggered by AI applications.
|
|
121
|
+
|
|
112
122
|
## 🎨 Theming
|
|
113
123
|
|
|
114
124
|
```tsx
|
|
@@ -205,6 +215,16 @@ End-of-conversation summary with top recommendations:
|
|
|
205
215
|
/>
|
|
206
216
|
```
|
|
207
217
|
|
|
218
|
+
#### Citation Mode
|
|
219
|
+
Display recommendations as inline citations within conversational text:
|
|
220
|
+
```tsx
|
|
221
|
+
<AdMeshConversationalUnit
|
|
222
|
+
recommendations={recommendations}
|
|
223
|
+
config={{ displayMode: 'citation', context: 'assistant' }}
|
|
224
|
+
conversationSummary="Based on your needs, I recommend HubSpot CRM for its excellent features..."
|
|
225
|
+
/>
|
|
226
|
+
```
|
|
227
|
+
|
|
208
228
|
### Individual Conversational Components
|
|
209
229
|
|
|
210
230
|
#### AdMeshConversationSummary
|
|
@@ -236,13 +256,89 @@ import { AdMeshInlineRecommendation } from 'admesh-ui-sdk';
|
|
|
236
256
|
/>
|
|
237
257
|
```
|
|
238
258
|
|
|
259
|
+
#### AdMeshCitationUnit
|
|
260
|
+
Citation-based conversation ads with inline references:
|
|
261
|
+
|
|
262
|
+
```tsx
|
|
263
|
+
import { AdMeshCitationUnit } from 'admesh-ui-sdk';
|
|
264
|
+
|
|
265
|
+
<AdMeshCitationUnit
|
|
266
|
+
recommendations={recommendations}
|
|
267
|
+
conversationText="Based on your requirements, I recommend HubSpot CRM for its features..."
|
|
268
|
+
showCitationList={true}
|
|
269
|
+
citationStyle="numbered" // 'numbered' | 'bracketed' | 'superscript'
|
|
270
|
+
onRecommendationClick={(adId, link) => window.open(link)}
|
|
271
|
+
onCitationHover={(recommendation) => console.log('Hovered:', recommendation.title)}
|
|
272
|
+
/>
|
|
273
|
+
```
|
|
274
|
+
|
|
275
|
+
#### AdMeshCitationReference
|
|
276
|
+
Individual citation references for inline use:
|
|
277
|
+
|
|
278
|
+
```tsx
|
|
279
|
+
import { AdMeshCitationReference } from 'admesh-ui-sdk';
|
|
280
|
+
|
|
281
|
+
<p>
|
|
282
|
+
Check out this great CRM solution{' '}
|
|
283
|
+
<AdMeshCitationReference
|
|
284
|
+
recommendation={recommendation}
|
|
285
|
+
citationNumber={1}
|
|
286
|
+
citationStyle="numbered"
|
|
287
|
+
onClick={(adId, link) => window.open(link)}
|
|
288
|
+
/>
|
|
289
|
+
{' '}for your business needs.
|
|
290
|
+
</p>
|
|
291
|
+
```
|
|
292
|
+
|
|
293
|
+
### 📝 Citation-Based Conversation Ads
|
|
294
|
+
|
|
295
|
+
Citation-based ads display recommendations as numbered references within conversational text, similar to academic papers or AI assistant responses. This format is perfect for AI applications, chatbots, and content that needs to reference products naturally within flowing text.
|
|
296
|
+
|
|
297
|
+
#### Key Features
|
|
298
|
+
|
|
299
|
+
- **Automatic Citation Insertion**: Automatically finds product mentions in text and adds citations
|
|
300
|
+
- **Multiple Citation Styles**: Support for numbered (1), bracketed [1], and superscript¹ formats
|
|
301
|
+
- **Interactive Tooltips**: Hover over citations to see product details
|
|
302
|
+
- **Reference List**: Optional list of all cited products at the bottom
|
|
303
|
+
- **Smart Matching**: Uses product titles and keywords to find optimal insertion points
|
|
304
|
+
|
|
305
|
+
#### Basic Usage
|
|
306
|
+
|
|
307
|
+
```tsx
|
|
308
|
+
import { AdMeshCitationUnit } from 'admesh-ui-sdk';
|
|
309
|
+
|
|
310
|
+
function AIAssistantResponse() {
|
|
311
|
+
const conversationText = `
|
|
312
|
+
Based on your requirements for a CRM system, I'd recommend HubSpot CRM
|
|
313
|
+
for its excellent free tier and collaboration features. For enterprise needs,
|
|
314
|
+
Salesforce offers the most comprehensive feature set with extensive customization.
|
|
315
|
+
`;
|
|
316
|
+
|
|
317
|
+
return (
|
|
318
|
+
<AdMeshCitationUnit
|
|
319
|
+
recommendations={recommendations}
|
|
320
|
+
conversationText={conversationText}
|
|
321
|
+
citationStyle="numbered"
|
|
322
|
+
showCitationList={true}
|
|
323
|
+
onRecommendationClick={(adId, link) => window.open(link)}
|
|
324
|
+
/>
|
|
325
|
+
);
|
|
326
|
+
}
|
|
327
|
+
```
|
|
328
|
+
|
|
329
|
+
#### Citation Styles
|
|
330
|
+
|
|
331
|
+
- **Numbered**: `(1)` - Clean numbered circles
|
|
332
|
+
- **Bracketed**: `[1]` - Traditional academic style
|
|
333
|
+
- **Superscript**: `¹` - Minimal superscript numbers
|
|
334
|
+
|
|
239
335
|
### Configuration Options
|
|
240
336
|
|
|
241
337
|
#### ConversationalAdConfig
|
|
242
338
|
|
|
243
339
|
```tsx
|
|
244
340
|
interface ConversationalAdConfig {
|
|
245
|
-
displayMode: 'inline' | 'summary' | 'floating' | 'minimal';
|
|
341
|
+
displayMode: 'inline' | 'summary' | 'floating' | 'minimal' | 'citation';
|
|
246
342
|
context: 'chat' | 'assistant' | 'agent' | 'support';
|
|
247
343
|
maxRecommendations?: number; // Default: 3
|
|
248
344
|
showPoweredBy?: boolean; // Default: true
|
|
@@ -552,6 +648,167 @@ function ChatPage() {
|
|
|
552
648
|
/>
|
|
553
649
|
```
|
|
554
650
|
|
|
651
|
+
## 🤖 Auto-Recommendations (AI Integration)
|
|
652
|
+
|
|
653
|
+
Perfect for AI applications that want to automatically show recommendations without user input.
|
|
654
|
+
|
|
655
|
+
### Quick Start - Auto-Recommendation Widget
|
|
656
|
+
|
|
657
|
+
```tsx
|
|
658
|
+
import React, { useState } from 'react';
|
|
659
|
+
import { AdMeshAutoRecommendationWidget } from 'admesh-ui-sdk';
|
|
660
|
+
|
|
661
|
+
function AIApplicationWithAutoRecommendations() {
|
|
662
|
+
const [autoRecommendations, setAutoRecommendations] = useState([]);
|
|
663
|
+
const [triggerQuery, setTriggerQuery] = useState('');
|
|
664
|
+
|
|
665
|
+
// This would be called when your AI detects a relevant query
|
|
666
|
+
const handleAIQuery = (userQuery, detectedRecommendations) => {
|
|
667
|
+
setTriggerQuery(userQuery);
|
|
668
|
+
setAutoRecommendations(detectedRecommendations);
|
|
669
|
+
};
|
|
670
|
+
|
|
671
|
+
return (
|
|
672
|
+
<div>
|
|
673
|
+
{/* Your AI application interface */}
|
|
674
|
+
<main>
|
|
675
|
+
<h1>Your AI Assistant</h1>
|
|
676
|
+
{/* Your chat interface, AI responses, etc. */}
|
|
677
|
+
</main>
|
|
678
|
+
|
|
679
|
+
{/* Auto-Recommendation Widget */}
|
|
680
|
+
<AdMeshAutoRecommendationWidget
|
|
681
|
+
recommendations={autoRecommendations}
|
|
682
|
+
trigger={triggerQuery}
|
|
683
|
+
autoShow={true}
|
|
684
|
+
showDelay={1000}
|
|
685
|
+
position="bottom-right"
|
|
686
|
+
size="md"
|
|
687
|
+
title="AI Recommendations"
|
|
688
|
+
onRecommendationClick={(adId, admeshLink) => {
|
|
689
|
+
window.open(admeshLink, '_blank');
|
|
690
|
+
}}
|
|
691
|
+
onDismiss={() => {
|
|
692
|
+
setAutoRecommendations([]);
|
|
693
|
+
}}
|
|
694
|
+
/>
|
|
695
|
+
</div>
|
|
696
|
+
);
|
|
697
|
+
}
|
|
698
|
+
```
|
|
699
|
+
|
|
700
|
+
### Floating Chat with Auto-Recommendations
|
|
701
|
+
|
|
702
|
+
```tsx
|
|
703
|
+
import React, { useState } from 'react';
|
|
704
|
+
import { AdMeshFloatingChat } from 'admesh-ui-sdk';
|
|
705
|
+
|
|
706
|
+
function AppWithAutoFloatingChat() {
|
|
707
|
+
const [autoRecommendations, setAutoRecommendations] = useState([]);
|
|
708
|
+
const [triggerQuery, setTriggerQuery] = useState('');
|
|
709
|
+
|
|
710
|
+
// Called when AI detects relevant queries
|
|
711
|
+
const handleAIDetection = (query, recommendations) => {
|
|
712
|
+
setTriggerQuery(query);
|
|
713
|
+
setAutoRecommendations(recommendations);
|
|
714
|
+
};
|
|
715
|
+
|
|
716
|
+
return (
|
|
717
|
+
<div>
|
|
718
|
+
{/* Your application */}
|
|
719
|
+
|
|
720
|
+
{/* Floating Chat with Auto-Recommendations */}
|
|
721
|
+
<AdMeshFloatingChat
|
|
722
|
+
autoRecommendations={autoRecommendations}
|
|
723
|
+
autoRecommendationTrigger={triggerQuery}
|
|
724
|
+
autoShowRecommendations={true}
|
|
725
|
+
showInputField={false} // Hide input since it's auto-triggered
|
|
726
|
+
config={{
|
|
727
|
+
position: 'bottom-right',
|
|
728
|
+
size: 'md',
|
|
729
|
+
autoOpen: true
|
|
730
|
+
}}
|
|
731
|
+
title="AI Recommendations"
|
|
732
|
+
subtitle="Based on your conversation"
|
|
733
|
+
onRecommendationClick={(adId, link) => window.open(link)}
|
|
734
|
+
onAutoRecommendationDismiss={() => {
|
|
735
|
+
setAutoRecommendations([]);
|
|
736
|
+
}}
|
|
737
|
+
/>
|
|
738
|
+
</div>
|
|
739
|
+
);
|
|
740
|
+
}
|
|
741
|
+
```
|
|
742
|
+
|
|
743
|
+
### Integration with AI Applications
|
|
744
|
+
|
|
745
|
+
#### ChatGPT Plugin Integration
|
|
746
|
+
```tsx
|
|
747
|
+
// When ChatGPT detects software-related queries
|
|
748
|
+
const handleChatGPTResponse = (userQuery, gptResponse) => {
|
|
749
|
+
if (containsSoftwareQuery(userQuery)) {
|
|
750
|
+
const recommendations = await getAdMeshRecommendations(userQuery);
|
|
751
|
+
showAutoRecommendations(recommendations, userQuery);
|
|
752
|
+
}
|
|
753
|
+
};
|
|
754
|
+
```
|
|
755
|
+
|
|
756
|
+
#### Claude Integration
|
|
757
|
+
```tsx
|
|
758
|
+
// When Claude processes business queries
|
|
759
|
+
const handleClaudeQuery = async (query) => {
|
|
760
|
+
const intent = await detectIntent(query);
|
|
761
|
+
if (intent.category === 'software' || intent.category === 'tools') {
|
|
762
|
+
const recommendations = await fetchRecommendations(intent);
|
|
763
|
+
triggerAutoWidget(recommendations, query);
|
|
764
|
+
}
|
|
765
|
+
};
|
|
766
|
+
```
|
|
767
|
+
|
|
768
|
+
### Auto-Recommendation Features
|
|
769
|
+
|
|
770
|
+
- **Zero User Input**: Automatically appears based on AI detection
|
|
771
|
+
- **Contextual Triggers**: Shows why recommendations appeared
|
|
772
|
+
- **Smart Positioning**: Non-intrusive placement options
|
|
773
|
+
- **Auto-Dismiss**: Configurable auto-hide after time or interaction
|
|
774
|
+
- **Delay Control**: Customizable appearance timing
|
|
775
|
+
- **Theme Integration**: Matches your application's design
|
|
776
|
+
- **Analytics Ready**: Built-in tracking for recommendation performance
|
|
777
|
+
|
|
778
|
+
### Configuration Examples
|
|
779
|
+
|
|
780
|
+
```tsx
|
|
781
|
+
// Minimal auto-widget
|
|
782
|
+
<AdMeshAutoRecommendationWidget
|
|
783
|
+
recommendations={recommendations}
|
|
784
|
+
trigger="I need a CRM system"
|
|
785
|
+
autoShow={true}
|
|
786
|
+
/>
|
|
787
|
+
|
|
788
|
+
// Advanced configuration
|
|
789
|
+
<AdMeshAutoRecommendationWidget
|
|
790
|
+
recommendations={recommendations}
|
|
791
|
+
trigger={userQuery}
|
|
792
|
+
position="bottom-left"
|
|
793
|
+
size="lg"
|
|
794
|
+
autoShow={true}
|
|
795
|
+
showDelay={2000}
|
|
796
|
+
title="Smart Recommendations"
|
|
797
|
+
theme={{ mode: 'dark', accentColor: '#3b82f6' }}
|
|
798
|
+
onRecommendationClick={handleClick}
|
|
799
|
+
onDismiss={handleDismiss}
|
|
800
|
+
/>
|
|
801
|
+
|
|
802
|
+
// Floating chat without input
|
|
803
|
+
<AdMeshFloatingChat
|
|
804
|
+
autoRecommendations={recommendations}
|
|
805
|
+
autoRecommendationTrigger={query}
|
|
806
|
+
autoShowRecommendations={true}
|
|
807
|
+
showInputField={false}
|
|
808
|
+
config={{ position: 'bottom-right', autoOpen: true }}
|
|
809
|
+
/>
|
|
810
|
+
```
|
|
811
|
+
|
|
555
812
|
## 📊 Tracking
|
|
556
813
|
|
|
557
814
|
All components include built-in view and click tracking:
|
package/dist/App.d.ts
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"App.d.ts","sourceRoot":"","sources":["../src/App.tsx"],"names":[],"mappings":"AAGA,OAAO,WAAW,CAAA;AAElB,iBAAS,GAAG,4CA2BX;AAED,eAAe,GAAG,CAAA"}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
import { AdMeshRecommendation, AdMeshTheme } from '../types/index';
|
|
3
|
+
export interface AdMeshAutoRecommendationWidgetProps {
|
|
4
|
+
recommendations: AdMeshRecommendation[];
|
|
5
|
+
trigger?: string;
|
|
6
|
+
theme?: AdMeshTheme;
|
|
7
|
+
title?: string;
|
|
8
|
+
position?: 'bottom-right' | 'bottom-left' | 'top-right' | 'top-left';
|
|
9
|
+
size?: 'sm' | 'md' | 'lg';
|
|
10
|
+
autoShow?: boolean;
|
|
11
|
+
showDelay?: number;
|
|
12
|
+
onRecommendationClick?: (adId: string, admeshLink: string) => void;
|
|
13
|
+
onDismiss?: () => void;
|
|
14
|
+
className?: string;
|
|
15
|
+
}
|
|
16
|
+
export declare const AdMeshAutoRecommendationWidget: React.FC<AdMeshAutoRecommendationWidgetProps>;
|
|
17
|
+
//# sourceMappingURL=AdMeshAutoRecommendationWidget.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AdMeshAutoRecommendationWidget.d.ts","sourceRoot":"","sources":["../../src/components/AdMeshAutoRecommendationWidget.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAEnD,OAAO,KAAK,EAAE,oBAAoB,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAGxE,MAAM,WAAW,mCAAmC;IAClD,eAAe,EAAE,oBAAoB,EAAE,CAAC;IACxC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,cAAc,GAAG,aAAa,GAAG,WAAW,GAAG,UAAU,CAAC;IACrE,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,qBAAqB,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IACnE,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,eAAO,MAAM,8BAA8B,EAAE,KAAK,CAAC,EAAE,CAAC,mCAAmC,CAwJxF,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AdMeshBadge.d.ts","sourceRoot":"","sources":["../../src/components/AdMeshBadge.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,KAAK,EAAE,gBAAgB,EAAa,MAAM,gBAAgB,CAAC;AAsBlE,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CAuBlD,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AdMeshChatInput.d.ts","sourceRoot":"","sources":["../../src/components/AdMeshChatInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA0C,MAAM,OAAO,CAAC;AAE/D,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,gBAAgB,CAAC;AAE3D,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CA2J1D,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AdMeshChatInterface.d.ts","sourceRoot":"","sources":["../../src/components/AdMeshChatInterface.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4B,MAAM,OAAO,CAAC;AAEjD,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,gBAAgB,CAAC;AAI/D,eAAO,MAAM,mBAAmB,EAAE,KAAK,CAAC,EAAE,CAAC,wBAAwB,CA6HlE,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AdMeshChatMessage.d.ts","sourceRoot":"","sources":["../../src/components/AdMeshChatMessage.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,gBAAgB,CAAC;AAG7D,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,sBAAsB,CA4G9D,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AdMeshCitationReference.d.ts","sourceRoot":"","sources":["../../src/components/AdMeshCitationReference.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAExC,OAAO,KAAK,EAAE,4BAA4B,EAAE,MAAM,gBAAgB,CAAC;AAGnE,eAAO,MAAM,uBAAuB,EAAE,KAAK,CAAC,EAAE,CAAC,4BAA4B,CAkH1E,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AdMeshCitationUnit.d.ts","sourceRoot":"","sources":["../../src/components/AdMeshCitationUnit.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4B,MAAM,OAAO,CAAC;AAEjD,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,gBAAgB,CAAC;AAI9D,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CAqLhE,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AdMeshCompareTable.d.ts","sourceRoot":"","sources":["../../src/components/AdMeshCompareTable.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkB,MAAM,OAAO,CAAC;AAEvC,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,gBAAgB,CAAC;AAG9D,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CA8LhE,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AdMeshConversationSummary.d.ts","sourceRoot":"","sources":["../../src/components/AdMeshConversationSummary.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,KAAK,EAAE,8BAA8B,EAAE,MAAM,gBAAgB,CAAC;AAGrE,eAAO,MAAM,yBAAyB,EAAE,KAAK,CAAC,EAAE,CAAC,8BAA8B,CAuJ9E,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AdMeshConversationalUnit.d.ts","sourceRoot":"","sources":["../../src/components/AdMeshConversationalUnit.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAEnD,OAAO,KAAK,EAAE,6BAA6B,EAAE,MAAM,gBAAgB,CAAC;AAMpE,eAAO,MAAM,wBAAwB,EAAE,KAAK,CAAC,EAAE,CAAC,6BAA6B,CAyM5E,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AdMeshFloatingChat.d.ts","sourceRoot":"","sources":["../../src/components/AdMeshFloatingChat.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAEnD,OAAO,KAAK,EAAE,uBAAuB,EAAe,MAAM,gBAAgB,CAAC;AAG3E,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CA2PhE,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AdMeshInlineRecommendation.d.ts","sourceRoot":"","sources":["../../src/components/AdMeshInlineRecommendation.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,KAAK,EAAE,+BAA+B,EAAE,MAAM,gBAAgB,CAAC;AAGtE,eAAO,MAAM,0BAA0B,EAAE,KAAK,CAAC,EAAE,CAAC,+BAA+B,CA4IhF,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AdMeshLayout.d.ts","sourceRoot":"","sources":["../../src/components/AdMeshLayout.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkB,MAAM,OAAO,CAAC;AAEvC,OAAO,KAAK,EAAE,iBAAiB,EAAc,MAAM,gBAAgB,CAAC;AA0CpE,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAyFpD,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AdMeshLinkTracker.d.ts","sourceRoot":"","sources":["../../src/components/AdMeshLinkTracker.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAyC,MAAM,OAAO,CAAC;AAC9D,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,gBAAgB,CAAC;AAG7D,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,sBAAsB,CAoF9D,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AdMeshProductCard.d.ts","sourceRoot":"","sources":["../../src/components/AdMeshProductCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkB,MAAM,OAAO,CAAC;AAEvC,OAAO,KAAK,EAAE,sBAAsB,EAAa,MAAM,gBAAgB,CAAC;AAGxE,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,sBAAsB,CA4M9D,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AdMeshSidebar.d.ts","sourceRoot":"","sources":["../../src/components/AdMeshSidebar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAuC,MAAM,OAAO,CAAC;AAE5D,OAAO,KAAK,EAAE,kBAAkB,EAAkB,MAAM,gBAAgB,CAAC;AAIzE,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAuMtD,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AdMeshSidebarContent.d.ts","sourceRoot":"","sources":["../../src/components/AdMeshSidebarContent.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAExC,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,gBAAgB,CAAC;AAIhE,eAAO,MAAM,oBAAoB,EAAE,KAAK,CAAC,EAAE,CAAC,yBAAyB,CAkPpE,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AdMeshSidebarHeader.d.ts","sourceRoot":"","sources":["../../src/components/AdMeshSidebarHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAExC,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,gBAAgB,CAAC;AAE/D,eAAO,MAAM,mBAAmB,EAAE,KAAK,CAAC,EAAE,CAAC,wBAAwB,CA2IlE,CAAC"}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
export { AdMeshProductCard } from './AdMeshProductCard';
|
|
2
|
+
export { AdMeshCompareTable } from './AdMeshCompareTable';
|
|
3
|
+
export { AdMeshBadge } from './AdMeshBadge';
|
|
4
|
+
export { AdMeshLayout } from './AdMeshLayout';
|
|
5
|
+
export { AdMeshLinkTracker } from './AdMeshLinkTracker';
|
|
6
|
+
export { AdMeshConversationalUnit } from './AdMeshConversationalUnit';
|
|
7
|
+
export { AdMeshConversationSummary } from './AdMeshConversationSummary';
|
|
8
|
+
export { AdMeshInlineRecommendation } from './AdMeshInlineRecommendation';
|
|
9
|
+
export { AdMeshCitationUnit } from './AdMeshCitationUnit';
|
|
10
|
+
export { AdMeshCitationReference } from './AdMeshCitationReference';
|
|
11
|
+
export { AdMeshSidebar } from './AdMeshSidebar';
|
|
12
|
+
export { AdMeshSidebarHeader } from './AdMeshSidebarHeader';
|
|
13
|
+
export { AdMeshSidebarContent } from './AdMeshSidebarContent';
|
|
14
|
+
export { AdMeshFloatingChat } from './AdMeshFloatingChat';
|
|
15
|
+
export { AdMeshChatInterface } from './AdMeshChatInterface';
|
|
16
|
+
export { AdMeshChatMessage } from './AdMeshChatMessage';
|
|
17
|
+
export { AdMeshChatInput } from './AdMeshChatInput';
|
|
18
|
+
export { AdMeshAutoRecommendationWidget } from './AdMeshAutoRecommendationWidget';
|
|
19
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACxD,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAGxD,OAAO,EAAE,wBAAwB,EAAE,MAAM,4BAA4B,CAAC;AACtE,OAAO,EAAE,yBAAyB,EAAE,MAAM,6BAA6B,CAAC;AACxE,OAAO,EAAE,0BAA0B,EAAE,MAAM,8BAA8B,CAAC;AAC1E,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EAAE,uBAAuB,EAAE,MAAM,2BAA2B,CAAC;AAGpE,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAC5D,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAG9D,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAC5D,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACxD,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,8BAA8B,EAAE,MAAM,kCAAkC,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useAdMeshStyles.d.ts","sourceRoot":"","sources":["../../src/hooks/useAdMeshStyles.ts"],"names":[],"mappings":"AAiQA,eAAO,MAAM,eAAe,YAwB3B,CAAC"}
|