@eventlook/sdk

A simple and modular SDK package for integrating an event order form into Next.js or any React application.

This SDK enables you to embed a fully functional and customizable ticketing form into any React app. It is designed for the Eventlook platform.

📦 Installation

npm install @eventlook/sdk
# or
yarn add @eventlook/sdk

Peer dependencies

The SDK bundles most of its dependencies internally. You only need to install the following peer dependencies:

npm install @emotion/react @emotion/styled @mui/material @mui/x-date-pickers motion react react-dom
# or
yarn add @emotion/react @emotion/styled @mui/material @mui/x-date-pickers motion react react-dom

🚀 Usage

import { OrderFormSdk } from '@eventlook/sdk';

<OrderFormSdk
  eventSlug="some-slug"
  apiUrl="https://api.eventlook.cz"
  lang="cs" // Options: 'cs' | 'en' | 'de' | 'es' | 'fr' | 'pl' | 'uk' | 'sk'
  selectedReleaseId={1} // Optional, preselects a specific release
  callbacks={{
    homepage: () => router.replace('/'),
    tickets: () => router.replace(`/events/some-slug/tickets`),
    detail: () => router.replace(`/events/some-slug`),
  }}
  links={{
    termsAndConditions: '/terms-and-conditions',
    gdpr: '/gdpr',
  }}
  options={{
    packetaApiKey: process.env.NEXT_PUBLIC_PACKETA_API_KEY,
    stickyHeaderTop: 80,
  }}
/>;

🧩 Props

| Name | Type | Description | | ------------------- | --------------------------------------------------------------------------------- | -------------------------------------------------------------- | | eventSlug | string | Event slug (e.g., some-slug) | | apiUrl | string | API endpoint for fetching data | | seatingIframeUrl | string (optional) | URL for the seating iframe | | callbacks | IGlobalContextCallbacks | Navigation callbacks | | links | IGlobalContextLinks | Links to documents like Terms & Conditions, GDPR, etc. | | lang | Languages (optional) | Language code (cs, en, de, es, fr, pl, uk, sk) | | options | IGlobalContextOptions (optional) | Optional SDK settings (e.g., sticky header, Packeta API key) | | slots | { showSnackbar: (text, options?) => void, headerSlot?: ReactNode } (optional) | Notifications and optional header slot | | selectedReleaseId | number (optional) | Preselect default release | | content | IContent (optional) | Content customization |

🔁 Callbacks

interface IGlobalContextCallbacks {
  homepage: () => void;
  tickets: () => void;
  detail: () => void;
}

🔗 Links

interface IGlobalContextLinks {
  termsAndConditions: string;
  gdpr: string;
}

⚙️ Options

interface IGlobalContextOptions {
  packetaApiKey?: string;
  isIframe?: boolean;
  stickyHeaderTop?: number;
  termsAndConditionsCompanies?: string[];
  autoscrollAfterViewChange?: boolean;
  hasGopayId?: boolean;
}

📝 Content

export interface IContent {
  form?: {
    disableBirthDate?: boolean;
    disableGender?: boolean;
  };
  orderConfirmation?: {
    title?: string;
    image?: IContentImage;
  };
  paymentConfirmation?: {
    title?: string;
    status?: string;
    subtitle?: string;
    image?: IContentImage;
  };
}

export interface IContentImage {
  src: string;
  maxWidth?: string;
}

📝 License

MIT

📮 Contact

If you have any questions or suggestions for improvements, feel free to contact us at [email protected].