@launchbase/core

The Launchbase SDK for HTML and JavaScript

Usage no npm install needed!

<script type="module">
  import launchbaseCore from 'https://cdn.skypack.dev/@launchbase/core';
</script>

README

Launchbase's SDK for JavaScript and HTML.
The SDK is also documented in the Launchbase Docs.

Install

# yarn
yarn add @launchbase/core

# npm
npm install @launchbase/core

Usage

HTML

<html>
  <head>
    <!-- head content -->
  </head>
  <body>
    <!-- body content -->

    <!-- 
      Place this element wherever you want to. 
      You can style and customize it however you want, 
      just make sure it has the `data-launchbase` attribute. 
    -->
    <button data-launchbase>Get Early Access</button>

    <!-- 
      Make sure to replace the scripts at the bottom of the body.
    -->
    <script async src="https://unpkg.com/@launchbase/core"></script>
    <script>
      window.launchbaseConfig = {
        integrationKey: '{{integrationKey}}'
      };
    </script>
  </body>
</html>

Make sure the replace {{integrationKey}} with the integration key of your Launchbase project.

Launchbase will automatically attach to any element with the data-launchbase attribute. The button above is just an example.

JavaScript

The JavaScript SDK can be used to programmatically open and close a launchbase widget.

import { open, close, toggle, setup } from '@launchbase/core';

// Before you can use the Launchbase SDK, you have to set it up.
launchbase.setup({
  integrationKey: '{{integrationKey}}'
});

// After setting everything up, you can open the Launchbase widget.
launchbase.open();

// Close the widget
launchbase.close();

// Toggle the widget
launchbase.toggle();

API

launchbase.setup(config: LaunchbaseConfig)

Setup launchbase to work with your project

config: LaunchbaseConfig

This configuration object can be passed to launchbase.setup or set as window.launchbaseConfig.

{
  // A Launchbase integration key (required)
  integrationKey: string;

  // Optional theming settings
  theme?: {
    color?: string;
    textColor?: string;
  };

  // Optionally prefill name or email
  prefill?: {
    email?: string;
    name?: string;
  };
}

launchbase.open()

Open the Launchbase widget

launchbase.close()

Close the Launchbase widget

launchbase.toggle()

Toggle the Launchbase widget

License

MIT © Tobias Herber at Varld