rampkit-mcp-server 0.1.0

package/dist/resources/index.js

@@ -0,0 +1,236 @@
+/**
+ * MCP Resources
+ *
+ * Exposes RampKit schema, templates, and documentation as MCP resources.
+ */
+import { ONBOARDING_SCHEMA, HTML_SCREEN_DOCS } from './schema.js';
+import { HTML_TEMPLATES } from './templates.js';
+import { BEST_PRACTICES, CSS_VARIABLES } from './best-practices.js';
+import { HTML_AUTHORING_GUIDE, SCREEN_ID_GUIDE } from './authoring-guide.js';
+import { EXPO_SDK_GUIDE, IOS_SDK_GUIDE, ANDROID_SDK_GUIDE } from './sdk-guide.js';
+export function getResources() {
+    return [
+        {
+            uri: 'rampkit://schema.json',
+            name: 'RampKit Onboarding Schema',
+            description: 'JSON schema for HTML-first onboarding format',
+            mimeType: 'application/json',
+        },
+        {
+            uri: 'rampkit://schema/docs',
+            name: 'HTML Screen Documentation',
+            description: 'Documentation for creating HTML screens',
+            mimeType: 'text/markdown',
+        },
+        {
+            uri: 'rampkit://templates/welcome',
+            name: 'Welcome Screen Template',
+            description: 'Ready-to-use welcome screen HTML template',
+            mimeType: 'text/html',
+        },
+        {
+            uri: 'rampkit://templates/features',
+            name: 'Features Screen Template',
+            description: 'Ready-to-use features showcase HTML template',
+            mimeType: 'text/html',
+        },
+        {
+            uri: 'rampkit://templates/permissions',
+            name: 'Permissions Screen Template',
+            description: 'Ready-to-use permission request HTML template',
+            mimeType: 'text/html',
+        },
+        {
+            uri: 'rampkit://templates/personalization',
+            name: 'Personalization Screen Template',
+            description: 'Ready-to-use personalization quiz HTML template',
+            mimeType: 'text/html',
+        },
+        {
+            uri: 'rampkit://templates/paywall',
+            name: 'Paywall Screen Template',
+            description: 'Ready-to-use paywall/subscription HTML template',
+            mimeType: 'text/html',
+        },
+        {
+            uri: 'rampkit://templates/complete',
+            name: 'Completion Screen Template',
+            description: 'Ready-to-use success/completion HTML template',
+            mimeType: 'text/html',
+        },
+        {
+            uri: 'rampkit://best-practices',
+            name: 'Onboarding Best Practices',
+            description: 'Guidelines for designing effective onboardings',
+            mimeType: 'text/markdown',
+        },
+        {
+            uri: 'rampkit://styles/variables',
+            name: 'CSS Variables Reference',
+            description: 'CSS custom properties for theming onboardings',
+            mimeType: 'application/json',
+        },
+        {
+            uri: 'rampkit://authoring-guide',
+            name: 'HTML Authoring Guide',
+            description: 'Comprehensive guide for creating HTML screens including RampKit JS API, CSS patterns, and screen structures',
+            mimeType: 'text/markdown',
+        },
+        {
+            uri: 'rampkit://screen-ids',
+            name: 'Screen ID Conventions',
+            description: 'Naming conventions for screen IDs',
+            mimeType: 'text/markdown',
+        },
+        {
+            uri: 'rampkit://sdk/expo',
+            name: 'Expo SDK Guide',
+            description: 'Complete guide for installing and using the RampKit Expo SDK (rampkit-expo-dev)',
+            mimeType: 'text/markdown',
+        },
+        {
+            uri: 'rampkit://sdk/ios',
+            name: 'iOS SDK Guide',
+            description: 'Guide for installing and using the RampKit iOS SDK',
+            mimeType: 'text/markdown',
+        },
+        {
+            uri: 'rampkit://sdk/android',
+            name: 'Android SDK Guide',
+            description: 'Guide for installing and using the RampKit Android SDK',
+            mimeType: 'text/markdown',
+        },
+    ];
+}
+export function readResource(uri) {
+    const contents = [];
+    switch (uri) {
+        case 'rampkit://schema.json':
+            contents.push({
+                uri,
+                mimeType: 'application/json',
+                text: JSON.stringify(ONBOARDING_SCHEMA, null, 2),
+            });
+            break;
+        case 'rampkit://schema/docs':
+            contents.push({
+                uri,
+                mimeType: 'text/markdown',
+                text: HTML_SCREEN_DOCS,
+            });
+            break;
+        case 'rampkit://templates/welcome':
+            contents.push({
+                uri,
+                mimeType: 'text/html',
+                text: HTML_TEMPLATES.welcome,
+            });
+            break;
+        case 'rampkit://templates/features':
+            contents.push({
+                uri,
+                mimeType: 'text/html',
+                text: HTML_TEMPLATES.features,
+            });
+            break;
+        case 'rampkit://templates/permissions':
+            contents.push({
+                uri,
+                mimeType: 'text/html',
+                text: HTML_TEMPLATES.permissions,
+            });
+            break;
+        case 'rampkit://templates/personalization':
+            contents.push({
+                uri,
+                mimeType: 'text/html',
+                text: HTML_TEMPLATES.personalization,
+            });
+            break;
+        case 'rampkit://templates/paywall':
+            contents.push({
+                uri,
+                mimeType: 'text/html',
+                text: HTML_TEMPLATES.paywall,
+            });
+            break;
+        case 'rampkit://templates/complete':
+            contents.push({
+                uri,
+                mimeType: 'text/html',
+                text: HTML_TEMPLATES.complete,
+            });
+            break;
+        case 'rampkit://best-practices':
+            contents.push({
+                uri,
+                mimeType: 'text/markdown',
+                text: formatBestPractices(),
+            });
+            break;
+        case 'rampkit://styles/variables':
+            contents.push({
+                uri,
+                mimeType: 'application/json',
+                text: JSON.stringify(CSS_VARIABLES, null, 2),
+            });
+            break;
+        case 'rampkit://authoring-guide':
+            contents.push({
+                uri,
+                mimeType: 'text/markdown',
+                text: HTML_AUTHORING_GUIDE,
+            });
+            break;
+        case 'rampkit://screen-ids':
+            contents.push({
+                uri,
+                mimeType: 'text/markdown',
+                text: SCREEN_ID_GUIDE,
+            });
+            break;
+        case 'rampkit://sdk/expo':
+            contents.push({
+                uri,
+                mimeType: 'text/markdown',
+                text: EXPO_SDK_GUIDE,
+            });
+            break;
+        case 'rampkit://sdk/ios':
+            contents.push({
+                uri,
+                mimeType: 'text/markdown',
+                text: IOS_SDK_GUIDE,
+            });
+            break;
+        case 'rampkit://sdk/android':
+            contents.push({
+                uri,
+                mimeType: 'text/markdown',
+                text: ANDROID_SDK_GUIDE,
+            });
+            break;
+        default:
+            throw new Error(`Unknown resource: ${uri}`);
+    }
+    return { contents };
+}
+function formatBestPractices() {
+    const sections = [
+        { title: 'Content Strategy', practices: BEST_PRACTICES.slice(0, 5) },
+        { title: 'Visual Design', practices: BEST_PRACTICES.slice(5, 10) },
+        { title: 'Screen Types', practices: BEST_PRACTICES.slice(10, 15) },
+        { title: 'Technical', practices: BEST_PRACTICES.slice(15, 20) },
+        { title: 'Optimization', practices: BEST_PRACTICES.slice(20, 25) },
+    ];
+    let markdown = '# RampKit Onboarding Best Practices\n\n';
+    for (const section of sections) {
+        markdown += `## ${section.title}\n\n`;
+        for (const practice of section.practices) {
+            markdown += `- ${practice}\n`;
+        }
+        markdown += '\n';
+    }
+    return markdown;
+}
+//# sourceMappingURL=index.js.map

package/dist/resources/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/resources/index.ts"],"names":[],"mappings":"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"}

package/dist/resources/schema.d.ts

@@ -0,0 +1,42 @@
+/**
+ * RampKit Onboarding Schema
+ *
+ * Defines the JSON schema for HTML-first onboardings.
+ */
+import type { OnboardingSchema } from '../types.js';
+export declare const ONBOARDING_SCHEMA: OnboardingSchema;
+/**
+ * HTML Screen Format Documentation
+ *
+ * Each screen's HTML should be a complete, self-contained document that renders
+ * inside the RampKit WebView. Key patterns:
+ *
+ * 1. DATA ATTRIBUTES:
+ *    - data-ramp-id="element-name": Marks elements for targeting in overrides/analytics
+ *    - data-ramp-action="next|back|dismiss|finish": Button actions
+ *    - data-ramp-screen="screen-id": Navigate to specific screen
+ *
+ * 2. CSS VARIABLES:
+ *    - --ramp-primary: Primary brand color
+ *    - --ramp-background: Background color
+ *    - --ramp-text: Text color
+ *    - --ramp-text-secondary: Secondary text color
+ *    - --ramp-safe-area-top: Safe area inset top
+ *    - --ramp-safe-area-bottom: Safe area inset bottom
+ *
+ * 3. JAVASCRIPT:
+ *    - RampKit.navigate('next'): Go to next screen
+ *    - RampKit.navigate('back'): Go to previous screen
+ *    - RampKit.navigate('screen-id'): Go to specific screen
+ *    - RampKit.dismiss(): Dismiss onboarding
+ *    - RampKit.finish(): Complete onboarding
+ *    - RampKit.track('event', {data}): Track custom event
+ *
+ * 4. STRUCTURE:
+ *    - Use flexbox for vertical layouts
+ *    - Include safe area padding at top/bottom
+ *    - Put CTA buttons at bottom with safe area padding
+ *    - Use relative units (rem, %) for responsiveness
+ */
+export declare const HTML_SCREEN_DOCS = "\n## HTML Screen Format\n\nEach screen is a complete HTML document rendered in a WebView.\n\n### Required Structure\n\n```html\n<!DOCTYPE html>\n<html>\n<head>\n  <meta charset=\"utf-8\">\n  <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, viewport-fit=cover\">\n  <style>\n    /* Reset and base styles */\n    * { margin: 0; padding: 0; box-sizing: border-box; }\n\n    :root {\n      --ramp-primary: #007AFF;\n      --ramp-background: #FFFFFF;\n      --ramp-text: #1C1C1E;\n      --ramp-text-secondary: #8E8E93;\n      --ramp-safe-area-top: env(safe-area-inset-top, 44px);\n      --ramp-safe-area-bottom: env(safe-area-inset-bottom, 34px);\n    }\n\n    body {\n      font-family: -apple-system, BlinkMacSystemFont, 'SF Pro', 'Segoe UI', sans-serif;\n      background: var(--ramp-background);\n      color: var(--ramp-text);\n      min-height: 100vh;\n      display: flex;\n      flex-direction: column;\n    }\n\n    .screen {\n      flex: 1;\n      display: flex;\n      flex-direction: column;\n      padding: calc(var(--ramp-safe-area-top) + 20px) 24px calc(var(--ramp-safe-area-bottom) + 20px);\n    }\n\n    .content {\n      flex: 1;\n      display: flex;\n      flex-direction: column;\n      justify-content: center;\n      align-items: center;\n      text-align: center;\n    }\n\n    .actions {\n      display: flex;\n      flex-direction: column;\n      gap: 12px;\n    }\n\n    .btn-primary {\n      background: var(--ramp-primary);\n      color: white;\n      border: none;\n      padding: 16px 32px;\n      border-radius: 12px;\n      font-size: 17px;\n      font-weight: 600;\n      cursor: pointer;\n    }\n  </style>\n</head>\n<body>\n  <div class=\"screen\">\n    <div class=\"content\">\n      <h1 data-ramp-id=\"title\">Welcome</h1>\n      <p data-ramp-id=\"subtitle\">Get started with our app</p>\n    </div>\n    <div class=\"actions\">\n      <button class=\"btn-primary\" data-ramp-action=\"next\" data-ramp-id=\"cta\">\n        Get Started\n      </button>\n    </div>\n  </div>\n\n  <script>\n    // RampKit SDK will inject the RampKit global object\n    document.querySelectorAll('[data-ramp-action]').forEach(el => {\n      el.addEventListener('click', () => {\n        const action = el.dataset.rampAction;\n        const screen = el.dataset.rampScreen;\n        if (action === 'next') RampKit.navigate('next');\n        else if (action === 'back') RampKit.navigate('back');\n        else if (action === 'dismiss') RampKit.dismiss();\n        else if (action === 'finish') RampKit.finish();\n        else if (screen) RampKit.navigate(screen);\n      });\n    });\n  </script>\n</body>\n</html>\n```\n\n### Data Attributes\n\n- `data-ramp-id=\"name\"`: Identifies element for analytics and overrides\n- `data-ramp-action=\"next|back|dismiss|finish\"`: Button navigation action\n- `data-ramp-screen=\"screen-id\"`: Navigate to specific screen\n\n### CSS Variables\n\n- `--ramp-primary`: Primary brand color (buttons, links)\n- `--ramp-background`: Screen background color\n- `--ramp-text`: Primary text color\n- `--ramp-text-secondary`: Secondary/muted text color\n- `--ramp-safe-area-top`: Safe area inset (notch, status bar)\n- `--ramp-safe-area-bottom`: Safe area inset (home indicator)\n\n### JavaScript API\n\n- `RampKit.navigate('next')`: Go to next screen\n- `RampKit.navigate('back')`: Go to previous screen\n- `RampKit.navigate('screen-id')`: Go to specific screen\n- `RampKit.dismiss()`: Dismiss onboarding (if dismissible)\n- `RampKit.finish()`: Complete onboarding successfully\n- `RampKit.track(event, data)`: Track custom analytics event\n";
+//# sourceMappingURL=schema.d.ts.map

package/dist/resources/schema.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"schema.d.ts","sourceRoot":"","sources":["../../src/resources/schema.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAEpD,eAAO,MAAM,iBAAiB,EAAE,gBA2E/B,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AAEH,eAAO,MAAM,gBAAgB,0hHA2H5B,CAAC"}

package/dist/resources/schema.js

@@ -0,0 +1,239 @@
+/**
+ * RampKit Onboarding Schema
+ *
+ * Defines the JSON schema for HTML-first onboardings.
+ */
+export const ONBOARDING_SCHEMA = {
+    $schema: 'https://json-schema.org/draft/2020-12/schema',
+    title: 'RampKit Onboarding',
+    description: 'Schema for RampKit HTML-first onboarding flows',
+    type: 'object',
+    properties: {
+        name: {
+            type: 'string',
+            description: 'Human-readable name for the onboarding (e.g., "Welcome Flow v2")',
+        },
+        screens: {
+            type: 'array',
+            description: 'Ordered array of screens in the onboarding flow',
+            items: {
+                type: 'object',
+                description: 'A single screen in the onboarding',
+                properties: {
+                    id: {
+                        type: 'string',
+                        description: 'Unique identifier for the screen (e.g., "screen-welcome")',
+                    },
+                    label: {
+                        type: 'string',
+                        description: 'Display name shown in the editor (e.g., "Welcome")',
+                    },
+                    html: {
+                        type: 'string',
+                        description: 'Complete HTML content for the screen including inline CSS and JavaScript',
+                    },
+                    overrides: {
+                        type: 'object',
+                        description: 'Runtime overrides for dynamic content',
+                        properties: {
+                            elements: {
+                                type: 'object',
+                                description: 'Element-specific overrides keyed by data-ramp-id',
+                            },
+                            colors: {
+                                type: 'object',
+                                description: 'CSS variable color overrides',
+                            },
+                        },
+                    },
+                },
+            },
+        },
+        settings: {
+            type: 'object',
+            description: 'Global onboarding settings',
+            properties: {
+                dismissible: {
+                    type: 'boolean',
+                    description: 'Whether users can dismiss the onboarding',
+                    default: false,
+                },
+                showProgressBar: {
+                    type: 'boolean',
+                    description: 'Show progress indicator',
+                    default: true,
+                },
+                showBackButton: {
+                    type: 'boolean',
+                    description: 'Show back navigation button',
+                    default: true,
+                },
+                animationType: {
+                    type: 'string',
+                    description: 'Screen transition animation',
+                    enum: ['slide', 'fade', 'none'],
+                    default: 'slide',
+                },
+            },
+        },
+    },
+    required: ['name', 'screens'],
+};
+/**
+ * HTML Screen Format Documentation
+ *
+ * Each screen's HTML should be a complete, self-contained document that renders
+ * inside the RampKit WebView. Key patterns:
+ *
+ * 1. DATA ATTRIBUTES:
+ *    - data-ramp-id="element-name": Marks elements for targeting in overrides/analytics
+ *    - data-ramp-action="next|back|dismiss|finish": Button actions
+ *    - data-ramp-screen="screen-id": Navigate to specific screen
+ *
+ * 2. CSS VARIABLES:
+ *    - --ramp-primary: Primary brand color
+ *    - --ramp-background: Background color
+ *    - --ramp-text: Text color
+ *    - --ramp-text-secondary: Secondary text color
+ *    - --ramp-safe-area-top: Safe area inset top
+ *    - --ramp-safe-area-bottom: Safe area inset bottom
+ *
+ * 3. JAVASCRIPT:
+ *    - RampKit.navigate('next'): Go to next screen
+ *    - RampKit.navigate('back'): Go to previous screen
+ *    - RampKit.navigate('screen-id'): Go to specific screen
+ *    - RampKit.dismiss(): Dismiss onboarding
+ *    - RampKit.finish(): Complete onboarding
+ *    - RampKit.track('event', {data}): Track custom event
+ *
+ * 4. STRUCTURE:
+ *    - Use flexbox for vertical layouts
+ *    - Include safe area padding at top/bottom
+ *    - Put CTA buttons at bottom with safe area padding
+ *    - Use relative units (rem, %) for responsiveness
+ */
+export const HTML_SCREEN_DOCS = `
+## HTML Screen Format
+
+Each screen is a complete HTML document rendered in a WebView.
+
+### Required Structure
+
+\`\`\`html
+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
+  <style>
+    /* Reset and base styles */
+    * { margin: 0; padding: 0; box-sizing: border-box; }
+
+    :root {
+      --ramp-primary: #007AFF;
+      --ramp-background: #FFFFFF;
+      --ramp-text: #1C1C1E;
+      --ramp-text-secondary: #8E8E93;
+      --ramp-safe-area-top: env(safe-area-inset-top, 44px);
+      --ramp-safe-area-bottom: env(safe-area-inset-bottom, 34px);
+    }
+
+    body {
+      font-family: -apple-system, BlinkMacSystemFont, 'SF Pro', 'Segoe UI', sans-serif;
+      background: var(--ramp-background);
+      color: var(--ramp-text);
+      min-height: 100vh;
+      display: flex;
+      flex-direction: column;
+    }
+
+    .screen {
+      flex: 1;
+      display: flex;
+      flex-direction: column;
+      padding: calc(var(--ramp-safe-area-top) + 20px) 24px calc(var(--ramp-safe-area-bottom) + 20px);
+    }
+
+    .content {
+      flex: 1;
+      display: flex;
+      flex-direction: column;
+      justify-content: center;
+      align-items: center;
+      text-align: center;
+    }
+
+    .actions {
+      display: flex;
+      flex-direction: column;
+      gap: 12px;
+    }
+
+    .btn-primary {
+      background: var(--ramp-primary);
+      color: white;
+      border: none;
+      padding: 16px 32px;
+      border-radius: 12px;
+      font-size: 17px;
+      font-weight: 600;
+      cursor: pointer;
+    }
+  </style>
+</head>
+<body>
+  <div class="screen">
+    <div class="content">
+      <h1 data-ramp-id="title">Welcome</h1>
+      <p data-ramp-id="subtitle">Get started with our app</p>
+    </div>
+    <div class="actions">
+      <button class="btn-primary" data-ramp-action="next" data-ramp-id="cta">
+        Get Started
+      </button>
+    </div>
+  </div>
+
+  <script>
+    // RampKit SDK will inject the RampKit global object
+    document.querySelectorAll('[data-ramp-action]').forEach(el => {
+      el.addEventListener('click', () => {
+        const action = el.dataset.rampAction;
+        const screen = el.dataset.rampScreen;
+        if (action === 'next') RampKit.navigate('next');
+        else if (action === 'back') RampKit.navigate('back');
+        else if (action === 'dismiss') RampKit.dismiss();
+        else if (action === 'finish') RampKit.finish();
+        else if (screen) RampKit.navigate(screen);
+      });
+    });
+  </script>
+</body>
+</html>
+\`\`\`
+
+### Data Attributes
+
+- \`data-ramp-id="name"\`: Identifies element for analytics and overrides
+- \`data-ramp-action="next|back|dismiss|finish"\`: Button navigation action
+- \`data-ramp-screen="screen-id"\`: Navigate to specific screen
+
+### CSS Variables
+
+- \`--ramp-primary\`: Primary brand color (buttons, links)
+- \`--ramp-background\`: Screen background color
+- \`--ramp-text\`: Primary text color
+- \`--ramp-text-secondary\`: Secondary/muted text color
+- \`--ramp-safe-area-top\`: Safe area inset (notch, status bar)
+- \`--ramp-safe-area-bottom\`: Safe area inset (home indicator)
+
+### JavaScript API
+
+- \`RampKit.navigate('next')\`: Go to next screen
+- \`RampKit.navigate('back')\`: Go to previous screen
+- \`RampKit.navigate('screen-id')\`: Go to specific screen
+- \`RampKit.dismiss()\`: Dismiss onboarding (if dismissible)
+- \`RampKit.finish()\`: Complete onboarding successfully
+- \`RampKit.track(event, data)\`: Track custom analytics event
+`;
+//# sourceMappingURL=schema.js.map

package/dist/resources/schema.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"schema.js","sourceRoot":"","sources":["../../src/resources/schema.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAIH,MAAM,CAAC,MAAM,iBAAiB,GAAqB;IACjD,OAAO,EAAE,8CAA8C;IACvD,KAAK,EAAE,oBAAoB;IAC3B,WAAW,EAAE,gDAAgD;IAC7D,IAAI,EAAE,QAAQ;IACd,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,IAAI,EAAE,QAAQ;YACd,WAAW,EAAE,kEAAkE;SAChF;QACD,OAAO,EAAE;YACP,IAAI,EAAE,OAAO;YACb,WAAW,EAAE,iDAAiD;YAC9D,KAAK,EAAE;gBACL,IAAI,EAAE,QAAQ;gBACd,WAAW,EAAE,mCAAmC;gBAChD,UAAU,EAAE;oBACV,EAAE,EAAE;wBACF,IAAI,EAAE,QAAQ;wBACd,WAAW,EAAE,2DAA2D;qBACzE;oBACD,KAAK,EAAE;wBACL,IAAI,EAAE,QAAQ;wBACd,WAAW,EAAE,oDAAoD;qBAClE;oBACD,IAAI,EAAE;wBACJ,IAAI,EAAE,QAAQ;wBACd,WAAW,EAAE,0EAA0E;qBACxF;oBACD,SAAS,EAAE;wBACT,IAAI,EAAE,QAAQ;wBACd,WAAW,EAAE,uCAAuC;wBACpD,UAAU,EAAE;4BACV,QAAQ,EAAE;gCACR,IAAI,EAAE,QAAQ;gCACd,WAAW,EAAE,kDAAkD;6BAChE;4BACD,MAAM,EAAE;gCACN,IAAI,EAAE,QAAQ;gCACd,WAAW,EAAE,8BAA8B;6BAC5C;yBACF;qBACF;iBACF;aACF;SACF;QACD,QAAQ,EAAE;YACR,IAAI,EAAE,QAAQ;YACd,WAAW,EAAE,4BAA4B;YACzC,UAAU,EAAE;gBACV,WAAW,EAAE;oBACX,IAAI,EAAE,SAAS;oBACf,WAAW,EAAE,0CAA0C;oBACvD,OAAO,EAAE,KAAK;iBACf;gBACD,eAAe,EAAE;oBACf,IAAI,EAAE,SAAS;oBACf,WAAW,EAAE,yBAAyB;oBACtC,OAAO,EAAE,IAAI;iBACd;gBACD,cAAc,EAAE;oBACd,IAAI,EAAE,SAAS;oBACf,WAAW,EAAE,6BAA6B;oBAC1C,OAAO,EAAE,IAAI;iBACd;gBACD,aAAa,EAAE;oBACb,IAAI,EAAE,QAAQ;oBACd,WAAW,EAAE,6BAA6B;oBAC1C,IAAI,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,MAAM,CAAC;oBAC/B,OAAO,EAAE,OAAO;iBACjB;aACF;SACF;KACF;IACD,QAAQ,EAAE,CAAC,MAAM,EAAE,SAAS,CAAC;CAC9B,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AAEH,MAAM,CAAC,MAAM,gBAAgB,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2H/B,CAAC"}

package/dist/resources/sdk-guide.d.ts

@@ -0,0 +1,7 @@
+/**
+ * SDK Installation and Usage Guides
+ */
+export declare const EXPO_SDK_GUIDE = "# RampKit Expo SDK Guide\n\n## Minimum Requirements\n\n- **iOS 14.0+** (StoreKit 2 transactions automatically tracked on iOS 15+)\n- **Expo SDK 51+**\n\n## Installation\n\n```bash\nnpm install rampkit-expo-dev\n```\n\n## Required Peer Dependencies\n\nInstall these in your app:\n\n```bash\nnpx expo install react-native-webview react-native-pager-view react-native-root-siblings\n```\n\n## Setup\n\nWrap your app with RootSiblingParent (required for the overlay):\n\n```tsx\n// App.tsx\nimport { RootSiblingParent } from 'react-native-root-siblings';\n\nexport default function App() {\n  return (\n    <RootSiblingParent>\n      {/* Your app content */}\n    </RootSiblingParent>\n  );\n}\n```\n\n## Initialize the SDK\n\n```typescript\nimport { RampKit } from 'rampkit-expo-dev';\n\n// Call once at app startup (e.g., in useEffect or before rendering)\nawait RampKit.configure({\n  appId: 'YOUR_APP_ID',\n  environment: 'production',        // or 'development'\n  autoShowOnboarding: false,        // true = show immediately after configure\n  appUserID: 'your-user-123',       // optional: link to your user system\n  verboseLogging: false,            // true for debug logs\n  onOnboardingFinished: (payload) => {\n    console.log('Onboarding finished', payload);\n  },\n  onShowPaywall: (payload) => {\n    // Called when onboarding triggers paywall\n    // Present your paywall here\n  },\n});\n```\n\n## Show Onboarding Manually\n\n```typescript\nRampKit.showOnboarding();\n\n// Or with custom paywall handler:\nRampKit.showOnboarding({\n  onShowPaywall: (payload) => { /* show paywall */ }\n});\n```\n\n## Close Onboarding\n\n```typescript\nRampKit.closeOnboarding();\n```\n\n## Get User ID\n\n```typescript\nconst userId = RampKit.getUserId();\n```\n\n## Get User Answers (from onboarding questions)\n\n```typescript\n// All answers\nconst answers = await RampKit.getAnswers();\n\n// Single answer\nconst name = await RampKit.getAnswer('userName');\n```\n\n## Set Custom User ID (after configure)\n\n```typescript\nawait RampKit.setAppUserID('user-abc-123');\n```\n\n## Track Custom Events\n\n```typescript\nRampKit.trackEvent('button_tapped', { buttonId: 'cta-1' });\n```\n\n## Check Initialization\n\n```typescript\nif (RampKit.isInitialized()) {\n  RampKit.showOnboarding();\n}\n```\n\n## Reset SDK (logout/clear state)\n\n```typescript\nawait RampKit.reset();\n```\n\n## Complete Example\n\n```tsx\n// App.tsx\nimport { useEffect, useState } from 'react';\nimport { RootSiblingParent } from 'react-native-root-siblings';\nimport { RampKit } from 'rampkit-expo-dev';\n\nexport default function App() {\n  const [isReady, setIsReady] = useState(false);\n\n  useEffect(() => {\n    async function init() {\n      await RampKit.configure({\n        appId: 'YOUR_APP_ID',\n        environment: 'production',\n        autoShowOnboarding: true, // Show onboarding automatically\n        onOnboardingFinished: (payload) => {\n          console.log('User completed onboarding', payload);\n        },\n        onShowPaywall: (payload) => {\n          // Handle paywall presentation\n          console.log('Show paywall', payload);\n        },\n      });\n      setIsReady(true);\n    }\n    init();\n  }, []);\n\n  if (!isReady) return null;\n\n  return (\n    <RootSiblingParent>\n      {/* Your app content */}\n    </RootSiblingParent>\n  );\n}\n```\n";
+export declare const IOS_SDK_GUIDE = "# RampKit iOS SDK Guide\n\n## Requirements\n\n- **iOS 14.0+**\n- StoreKit 2 transactions are automatically tracked on iOS 15+\n\n## Installation (Swift Package Manager)\n\nIn Xcode:\n1. File \u2192 Add Package Dependencies\n2. Enter: `https://github.com/getrampkit/rampkit-ios.git`\n3. Select version 1.0.0 or \"Up to Next Major\"\n4. Add to your target\n\nOr in Package.swift:\n\n```swift\ndependencies: [\n    .package(url: \"https://github.com/getrampkit/rampkit-ios.git\", from: \"1.0.0\")\n]\n```\n\n## Initialize the SDK\n\n```swift\nimport RampKit\n\n// Call once at app launch (e.g., in AppDelegate or @main App init)\nTask {\n    await RampKit.configure(config: RampKitConfig(\n        appId: \"YOUR_APP_ID\",\n        environment: \"production\",\n        autoShowOnboarding: false,\n        appUserID: \"your-user-123\",        // optional\n        verboseLogging: false,\n        onOnboardingFinished: { payload in\n            print(\"Onboarding finished\", payload ?? \"\")\n        },\n        onShowPaywall: { payload in\n            // Present your paywall here\n        }\n    ))\n}\n```\n\n## Show Onboarding\n\n```swift\nRampKit.showOnboarding()\n\n// Or with custom paywall handler:\nRampKit.showOnboarding(options: ShowOnboardingOptions(\n    onShowPaywall: { payload in /* show paywall */ }\n))\n```\n\n## Close Onboarding\n\n```swift\nRampKit.closeOnboarding()\n```\n\n## Get User ID\n\n```swift\nlet userId = RampKit.getUserId()\n```\n\n## Get User Answers (from onboarding questions)\n\n```swift\n// All answers\nlet answers = RampKit.getAnswers()\n\n// Single answer\nlet name = RampKit.getAnswer(\"userName\")\n```\n\n## Set Custom User ID (after configure)\n\n```swift\nTask {\n    await RampKit.setAppUserID(\"user-abc-123\")\n}\n```\n\n## Reset SDK (logout/clear state)\n\n```swift\nTask {\n    await RampKit.reset()\n}\n```\n\n## Complete SwiftUI Example\n\n```swift\nimport SwiftUI\nimport RampKit\n\n@main\nstruct MyApp: App {\n    init() {\n        Task {\n            await RampKit.configure(config: RampKitConfig(\n                appId: \"YOUR_APP_ID\",\n                environment: \"production\",\n                autoShowOnboarding: true,\n                onOnboardingFinished: { payload in\n                    print(\"Onboarding finished\", payload ?? \"\")\n                },\n                onShowPaywall: { payload in\n                    // Present your paywall\n                }\n            ))\n        }\n    }\n\n    var body: some Scene {\n        WindowGroup {\n            ContentView()\n        }\n    }\n}\n```\n\n## Complete UIKit Example\n\n```swift\nimport UIKit\nimport RampKit\n\n@main\nclass AppDelegate: UIResponder, UIApplicationDelegate {\n    func application(\n        _ application: UIApplication,\n        didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?\n    ) -> Bool {\n        Task {\n            await RampKit.configure(config: RampKitConfig(\n                appId: \"YOUR_APP_ID\",\n                environment: \"production\",\n                autoShowOnboarding: false,\n                onOnboardingFinished: { payload in\n                    print(\"Onboarding finished\", payload ?? \"\")\n                },\n                onShowPaywall: { payload in\n                    // Present your paywall\n                }\n            ))\n        }\n        return true\n    }\n}\n```\n";
+export declare const ANDROID_SDK_GUIDE = "# RampKit Android SDK Guide\n\n## Installation via Gradle\n\nAdd to your app's build.gradle:\n\n```gradle\nimplementation \"com.rampkit:sdk:1.0.0\"\n```\n\n## Initialize the SDK\n\n```kotlin\nimport com.rampkit.RampKit\n\n// In your Application class or MainActivity\nRampKit.configure(\n  context = this,\n  appId = \"YOUR_APP_ID\"\n)\n```\n\n## Show Onboarding\n\n```kotlin\nRampKit.showOnboarding(activity)\n```\n\n## Configuration Options\n\n```kotlin\nRampKit.configure(\n  context = this,\n  appId = \"YOUR_APP_ID\",\n  environment = RampKit.Environment.PRODUCTION,\n  autoShowOnboarding = false,\n  listener = object : RampKitListener {\n    override fun onOnboardingFinished(payload: Map<String, Any>) {\n      // Handle completion\n    }\n\n    override fun onPaywallRequested(payload: Map<String, Any>) {\n      // Present your paywall\n    }\n  }\n)\n```\n";
+//# sourceMappingURL=sdk-guide.d.ts.map

package/dist/resources/sdk-guide.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sdk-guide.d.ts","sourceRoot":"","sources":["../../src/resources/sdk-guide.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,eAAO,MAAM,cAAc,kyGA8J1B,CAAC;AAEF,eAAO,MAAM,aAAa,80GA4JzB,CAAC;AAEF,eAAO,MAAM,iBAAiB,w2BA+C7B,CAAC"}