Capacitor Meon IPO SDK

A Capacitor/Ionic 7 SDK for integrating Meon IPO functionality into your mobile and web applications. Works with Angular, React, Vue, and vanilla JavaScript/TypeScript.

Installation

npm install capacitor-meon-ipo

Usage

Framework-agnostic (JavaScript/TypeScript)

import { MeonIPO } from 'capacitor-meon-ipo';

// Open IPO page in iframe mode (default)
await MeonIPO.open({
  companyName: 'ndaindia'
});

// Open in external browser
await MeonIPO.open({
  companyName: 'ndaindia',
  mode: 'external'
});

// Close the viewer
await MeonIPO.close();

// Get URL only
const url = MeonIPO.getUrl({ companyName: 'ndaindia' });

Angular Component

// app.component.ts
import { Component } from '@angular/core';
import { MeonIPO } from 'capacitor-meon-ipo';

@Component({
  selector: 'app-root',
  template: \`
    <ion-header>
      <ion-toolbar>
        <ion-title>Meon IPO</ion-title>
      </ion-toolbar>
    </ion-header>
    
    <ion-content>
      <ion-button (click)="openIPO()">Open IPO</ion-button>
      <ion-button (click)="closeIPO()">Close IPO</ion-button>
    </ion-content>
  \`
})
export class AppComponent {
  async openIPO() {
    await MeonIPO.open({
      companyName: 'ndaindia',
      mode: 'iframe'
    });
  }

  async closeIPO() {
    await MeonIPO.close();
  }
}

React Component

// App.tsx
import React from 'react';
import { IonButton, IonContent, IonHeader, IonPage, IonTitle, IonToolbar } from '@ionic/react';
import { MeonIPO } from 'capacitor-meon-ipo';

const App: React.FC = () => {
  const openIPO = async () => {
    await MeonIPO.open({
      companyName: 'ndaindia',
      mode: 'iframe'
    });
  };

  const closeIPO = async () => {
    await MeonIPO.close();
  };

  return (
    <IonPage>
      <IonHeader>
        <IonToolbar>
          <IonTitle>Meon IPO</IonTitle>
        </IonToolbar>
      </IonHeader>
      <IonContent>
        <IonButton onClick={openIPO}>Open IPO</IonButton>
        <IonButton onClick={closeIPO}>Close IPO</IonButton>
      </IonContent>
    </IonPage>
  );
};

export default App;

Vue Component

<!-- App.vue -->
<template>
  <ion-page>
    <ion-header>
      <ion-toolbar>
        <ion-title>Meon IPO</ion-title>
      </ion-toolbar>
    </ion-header>
    <ion-content>
      <ion-button @click="openIPO">Open IPO</ion-button>
      <ion-button @click="closeIPO">Close IPO</ion-button>
    </ion-content>
  </ion-page>
</template>

<script setup lang="ts">
import { IonPage, IonHeader, IonToolbar, IonTitle, IonContent, IonButton } from '@ionic/vue';
import { MeonIPO } from 'capacitor-meon-ipo';

const openIPO = async () => {
  await MeonIPO.open({
    companyName: 'ndaindia',
    mode: 'iframe'
  });
};

const closeIPO = async () => {
  await MeonIPO.close();
};
</script>

API

`MeonIPO.open(config: MeonIPOConfig)`

Opens the Meon IPO page.

Parameters:

| Parameter | Type | Required | Default | Description | |-----------|------|----------|---------|-------------| | `companyName` | `string` | Yes | - | Company name to load IPO information for | | `baseUrl` | `string` | No | `"https://ipo.meon.co.in"` | Base URL for the Meon IPO service | | `mode` | `'iframe'` | `'external'` | `'inapp'` | No | `'iframe'` | Display mode | | `iframeStyles` | `object` | No | - | Custom CSS styles for iframe mode |

Returns: `Promise<{ url: string }>`

`MeonIPO.close()`

Closes the IPO viewer (for iframe mode).

Returns: `Promise`

`MeonIPO.getUrl(config)`

Gets the full URL for a company without opening it.

Returns: `string`

Features

• ✅ Works with Ionic 7 (Angular, React, Vue)
• ✅ TypeScript support
• ✅ Multiple display modes (iframe, external browser)
• ✅ Customizable styling
• ✅ Simple API
• ✅ Zero native dependencies
• ✅ Works on iOS, Android, and Web

Requirements

• Capacitor >= 6.0.0
• Ionic 7 (optional, but recommended)

License

MIT

Support

For issues, questions, or feature requests: Email: [email protected]