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

# Figma प्लगइन बॉयलरप्लेट

> Dodo Payments लाइसेंस कुंजी सत्यापन और सक्रियण के साथ Figma प्लगइन बनाएं

यह एक उदाहरण कार्यान्वयन और बॉयलरप्लेट है जिसे उन Figma प्लगइन डेवलपर्स के लिए एक प्रारंभिक बिंदु के रूप में डिज़ाइन किया गया है जो Dodo Payments लाइसेंस कुंजी API को अपने प्लगइनों तक पहुँच प्रदान करने के लिए एकीकृत करना चाहते हैं। यह टेम्पलेट पूर्ण लाइसेंस कुंजी सत्यापन और सक्रियण कार्यक्षमता का प्रदर्शन करता है, जो आपको प्रीमियम Figma प्लगइनों को अंतर्निहित लाइसेंसिंग के साथ बनाने के लिए आवश्यक सब कुछ प्रदान करता है।

## विशेषताएँ

* **लाइसेंस कुंजी सत्यापन**: Dodo Payments API के खिलाफ लाइसेंस कुंजी की सत्यापन करता है
* **लाइसेंस कुंजी सक्रियण**: उपयोगकर्ता पहचान के साथ लाइसेंस कुंजी को सक्रिय करता है
* **पर्यावरण समर्थन**: परीक्षण और लाइव वातावरण के लिए कॉन्फ़िगर करने योग्य
* **CORS प्रॉक्सी**: CORS प्रतिबंधों को संभालने के लिए Cloudflare वर्कर प्रॉक्सी का उपयोग करता है
* **TypeScript समर्थन**: उचित त्रुटि हैंडलिंग के साथ पूरी तरह से टाइप किया गया कार्यान्वयन

## प्रारंभ करना

<Steps>
  <Step title="Create Base Plugin">
    अपने स्वयं के Figma plugin परियोजना को [Figma's plugin quickstart guide](https://www.figma.com/plugin-docs/plugin-quickstart-guide/) का उपयोग करके बनाएँ। यह `manifest.json` फ़ाइल के साथ एक scaffold बनाएगा।

    <Tip>
      यह चरण केवल आपके plugin के लिए एक अद्वितीय नाम और ID प्राप्त करने के लिए है। आप अगले चरण में ID और नाम को git repository में commit करने के बाद उत्पन्न फ़ाइलों को हटाकर अनदेखा कर सकते हैं।
    </Tip>
  </Step>

  <Step title="Clone the Example Implementation">
    [dodopayments-figma repository](https://github.com/dodopayments/dodopayments-figma) को clone करें और इसके `manifest.json` को अपने उत्पन्न plugin फ़ोल्डर से प्राप्त नाम और ID से अपडेट करें।

    ```bash theme={null}
    git clone https://github.com/dodopayments/dodopayments-figma.git
    cd dodopayments-figma
    ```

    यह उदाहरण आपके एकीकरण के लिए प्रारंभिक बिंदु के रूप में कार्य करता है।

    <Tip>
      Version control के लिए आपको remote origin URL को अपने repository में बदलने की आवश्यकता है।
    </Tip>
  </Step>

  <Step title="Install Dependencies">
    अपने project root में निम्न कमांड चलाएँ:

    ```bash theme={null}
    npm install
    ```
  </Step>

  <Step title="Configure Environment">
    `API_MODE` को `src/ui/api.ts` में सेट करें:

    ```typescript theme={null}
    const API_MODE = "test_mode"; // for development
    // const API_MODE = "live_mode"; // for production
    ```

    <Warning>
      वास्तविक भुगतान संसाधित करने से बचने के लिए विकास के दौरान हमेशा `test_mode` का उपयोग करें।
    </Warning>
  </Step>

  <Step title="Customize Components">
    अपनी आवश्यकताओं के अनुसार plugin घटकों को अनुकूलित करें:

    * `Authenticated.tsx` को अपडेट करें ताकि मान्य license keys वाले उपयोगकर्ताओं के लिए कार्यक्षमता उपलब्ध हो
    * `LicenseKeyInput.tsx` को अपने डिज़ाइन प्राथमिकताओं के अनुसार अनुकूलित करें

    <Note>
      `Authenticated.tsx` घटक वह स्थान है जहाँ आप अपने plugin की वे प्रीमियम सुविधाएँ जोड़ेंगे जिन्हें मान्य license की आवश्यकता होती है।
    </Note>
  </Step>
</Steps>

## कॉन्फ़िगरेशन

<Steps>
  <Step title="Configure Network Access">
    CORS proxy के साथ संचार करने के लिए plugin को नेटवर्क एक्सेस की आवश्यकता है। अपने `manifest.json` में निम्नलिखित जोड़ें:

    ```json theme={null}
    {
      "networkAccess": {
        "allowedDomains": ["https://dodo-payments-proxy.aagarwal9782.workers.dev"]
      }
    }
    ```

    यह प्लगइन को Dodo Payments API का उपयोग करके लाइसेंस कुंजी को मान्य और सक्रिय करने की अनुमति देता है।

    <Info>
      CORS proxy आवश्यक है क्योंकि Dodo Payments API वर्तमान में browser-आधारित अनुप्रयोगों से API कॉल की अनुमति नहीं देता है।
    </Info>
  </Step>

  <Step title="Configure API Mode">
    `src/ui/api.ts` में API मोड कॉन्फ़िगर करें:

    ```typescript theme={null}
    const API_MODE = "test_mode"; // or "live_mode"
    ```

    <Tip>
      केवल तब `live_mode` में स्विच करें जब आप production के लिए तैयार हों और test mode में पूरी तरह परीक्षण कर चुके हों।
    </Tip>
  </Step>
</Steps>

## विकास

<Steps>
  <Step title="Import Plugin">
    Figma डेस्कटॉप ऐप से "Import Manifest" का उपयोग करके plugin को इम्पोर्ट करें।

    <Note>
      स्थानीय रूप से plugin विकसित और परीक्षण करने के लिए आपके पास Figma डेस्कटॉप ऐप इंस्टॉल होना चाहिए।
    </Note>
  </Step>

  <Step title="Start Development Server">
    ```bash theme={null}
    npm run dev
    ```

    यह स्वचालित पुनर्निर्माण के लिए फ़ाइल देखना के साथ विकास सर्वर शुरू करता है।

    <Check>
      जब आप स्रोत कोड में परिवर्तन करेंगे, तो आपका plugin स्वचालित रूप से फिर से बन जाएगा।
    </Check>
  </Step>
</Steps>

## निर्माण आदेश

| Command          | Description                                      |
| ---------------- | ------------------------------------------------ |
| `npm run build`  | production के लिए plugin बनाएं                   |
| `npm run dev`    | फ़ाइल निगरानी के साथ development सर्वर शुरू करें |
| `npm run lint`   | कोड शैली और त्रुटियों की जांच करें               |
| `npm run format` | Prettier से कोड को स्वरूपित करें                 |

## लाइसेंस कुंजी एकीकरण

उदाहरण कार्यान्वयन में पूर्ण लाइसेंस कुंजी सत्यापन और सक्रियण शामिल है जिसे आप अपने प्लगइन के लिए अनुकूलित कर सकते हैं:

1. **उपयोगकर्ता इनपुट**: उपयोगकर्ता अपने लाइसेंस कुंजी को प्लगइन UI में दर्ज करते हैं
2. **सत्यापन**: प्लगइन कुंजी को Dodo Payments API के खिलाफ सत्यापित करता है
3. **सक्रियण**: मान्य कुंजी उपयोगकर्ता पहचान के साथ सक्रिय होती हैं
4. **एक्सेस नियंत्रण**: मान्य लाइसेंस धारकों के लिए प्लगइन कार्यक्षमता अनलॉक होती है

## प्रकाशन

जब आपका प्लगइन तैयार हो:

1. production के लिए बिल्ड करें: `npm run build`
2. test और live मोड दोनों में पूरी तरह परीक्षण करें
3. [Figma's plugin publishing guidelines](https://www.figma.com/plugin-docs/publishing-plugins/) का पालन करें
4. Figma Community के माध्यम से समीक्षा के लिए सबमिट करें

## रिपॉजिटरी

पूर्ण उदाहरण कार्यान्वयन उपलब्ध है: [github.com/dodopayments/dodopayments-figma](https://github.com/dodopayments/dodopayments-figma)

इसे Dodo Payments लाइसेंस कुंजी एकीकरण के साथ अपना खुद का प्रीमियम Figma प्लगइन बनाने के लिए प्रारंभिक बिंदु के रूप में उपयोग करें.