> ## Documentation Index
> Fetch the complete documentation index at: https://www.mellowtel.com/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# मेलोटेल सपोर्ट मोडल

मेलोटेल सपोर्ट मोडल एक गैर-घुसपैठ मोडल है जो उपयोगकर्ताओं को मेलोटेल एक्सटेंशन के साथ आपके एक्सटेंशन या वेबसाइट का समर्थन करने के लिए प्रोत्साहित करता है।

## आवश्यकताएँ

मोडल का उपयोग करने से पहले, सुनिश्चित करें कि आपने अपने प्रोजेक्ट में मेलोटेल एलिमेंट्स सेटअप कर लिया है:

<CardGroup cols={2}>
  <Card title="एक्सटेंशन इंटीग्रेशन" icon="puzzle-piece" href="/mellowtel-elements/extension-integration">
    ब्राउज़र एक्सटेंशन्स के लिए सेटअप
  </Card>

  <Card title="वेबसाइट इंटीग्रेशन" icon="atom" href="/mellowtel-elements/website-integration">
    NPM या CDN का उपयोग करके वेबसाइट्स के लिए सेटअप
  </Card>
</CardGroup>

## मुख्य विशेषताएँ

* **क्रॉस-प्लेटफॉर्म** - वेबसाइट्स और एक्सटेंशन कंटेंट स्क्रिप्ट्स में काम करता है
* **स्मार्ट स्नूज़िंग** - उपयोगकर्ता 1 सप्ताह, 2 सप्ताह के लिए स्नूज़ कर सकते हैं या स्थायी रूप से अक्षम कर सकते हैं
* **क्रोम स्टोरेज** - उपलब्ध होने पर क्रोम स्टोरेज API का उपयोग करता है, अन्यथा localStorage का उपयोग करता है
* **शैडो DOM** - स्टाइल आइसोलेशन होस्ट पेज स्टाइल्स के साथ संघर्ष को रोकता है
* **मोबाइल रिस्पॉन्सिव** - सभी स्क्रीन आकारों के लिए अनुकूलित
* **एक्सटेंशन विवरण** - स्वचालित रूप से एक्सटेंशन का नाम और आइकन प्राप्त करता है और प्रदर्शित करता है

## मोडल बनाना

एक बार जब आपने मेलोटेल एलिमेंट्स को इनिशियलाइज़ कर लिया (ऊपर दिए गए इंटीग्रेशन गाइड्स देखें), तो आप सपोर्ट मोडल बना और प्रदर्शित कर सकते हैं:

### बेसिक उपयोग

```javascript theme={null}
// डिफ़ॉल्ट शीर्षक और बॉडी के साथ बेसिक उपयोग
await mellowtel.createModal('your-invite-id-here');

// कस्टम शीर्षक और बॉडी
await mellowtel.createModal(
  'your-invite-id-here',
  'हमारे एक्सटेंशन का समर्थन करें!',
  'हमारी इस मुफ्त सेवा को बनाए रखने में मदद करें हमारे एक्सटेंशन को जोड़कर।'
);
```

### उपयोग के उदाहरण

#### कंटेंट स्क्रिप्ट्स में

```javascript theme={null}
// उपयोगकर्ता के पेज पर 30 सेकंड तक रहने के बाद मोडल दिखाएँ
setTimeout(async () => {
    await mellowtel.createModal(
        'content-script-invite-456',
        'हमारे एक्सटेंशन का उपयोग करने के लिए धन्यवाद!',
        'इस एक्सटेंशन के विकास का समर्थन करके हमें सुधारने में मदद करें।'
    );
}, 30000);
```

#### वेबसाइट्स पर

```javascript theme={null}
// पेज लोड होने के बाद मोडल दिखाएँ
window.addEventListener('load', async () => {
    await mellowtel.createModal(
        'website-invite-123',
        'हमारी सेवा का समर्थन करें',
        'हमारे एक्सटेंशन को इंस्टॉल करें ताकि यह वेबसाइट मुफ्त और विज्ञापन-मुक्त बनी रहे।'
    );
});
```

#### शर्तीय प्रदर्शन

```javascript theme={null}
// केवल कुछ डोमेन पर दिखाएँ
const allowedDomains = ['github.com', 'stackoverflow.com', 'reddit.com'];
const currentDomain = window.location.hostname;

if (allowedDomains.some(domain => currentDomain.includes(domain))) {
    await mellowtel.createModal(
        'conditional-invite-789',
        'हमारे एक्सटेंशन का आनंद ले रहे हैं?',
        'अपना समर्थन दिखाएँ और इस मुफ्त उपकरण को सुधारने में हमारी मदद करें।'
    );
}
```

## API संदर्भ

### `createModal(inviteId, title?, body?)`

सपोर्ट मोडल बनाता और प्रदर्शित करता है।

**पैरामीटर्स:**

* `inviteId` (string, आवश्यक): मोडल इंटरैक्शन्स को ट्रैक करने के लिए यूनिक पहचानकर्ता
* `title` (string, वैकल्पिक): कस्टम मोडल शीर्षक (डिफ़ॉल्ट "मेलोटेल के साथ समर्थन करें")
* `body` (string, वैकल्पिक): कस्टम मोडल बॉडी टेक्स्ट

**वापसी:** `Promise<void>`

## मोडल व्यवहार

### स्नूज़ विकल्प

उपयोगकर्ता तीन स्नूज़ विकल्पों में से चुन सकते हैं:

* **1 सप्ताह**: मोडल 7 दिनों के लिए नहीं दिखाई देगा
* **2 सप्ताह**: मोडल 14 दिनों के लिए नहीं दिखाई देगा
* **अक्षम करें**: मोडल फिर कभी दिखाई नहीं देगा