@eventlook/sdk 1.5.0-beta.6 → 1.5.0-beta.7

package/dist/types/components/hook-form/FormProvider.d.ts

@@ -4,6 +4,7 @@ type Props = {
     children: React.ReactNode;
     methods: UseFormReturn<any>;
     onSubmit?: VoidFunction;
+    formId?: string;
 };
-export default function FormProvider({ children, onSubmit, methods }: Props): React.JSX.Element;
+export default function FormProvider({ children, onSubmit, methods, formId }: Props): React.JSX.Element;
 export {};

package/dist/types/form/PaymentOverviewBox.d.ts

@@ -2,6 +2,8 @@ import React from 'react';
 import { IEvent } from '@utils/types/event.type';
 interface Props {
     event: IEvent;
+    withoutPadding?: boolean;
+    hideBuyButton?: boolean;
 }
 declare const PaymentOverviewBox: React.FC<Props>;
 export default PaymentOverviewBox;

package/dist/types/form/PaymentOverviewDrawer.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import { IEvent } from '@utils/types/event.type';
+interface Props {
+    event: IEvent;
+    totalPrice: number;
+    termsAndConditionsRef?: React.RefObject<HTMLElement | null>;
+    onOpenChange?: (open: boolean) => void;
+}
+declare const PaymentOverviewDrawer: React.FC<Props>;
+export default PaymentOverviewDrawer;

package/dist/types/form/TicketForm.d.ts

@@ -6,6 +6,7 @@ interface Props {
     selectedReleaseId?: number;
     isIframe?: boolean;
     isInline?: boolean;
+    headerSlot?: React.ReactNode;
 }
 declare const TicketForm: React.FC<Props>;
 export default TicketForm;

package/dist/types/form/index.d.ts

@@ -4,7 +4,7 @@ import 'dayjs/locale/de';
 import 'dayjs/locale/es';
 import 'dayjs/locale/uk';
 import 'dayjs/locale/sk';
-import React from 'react';
+import React, { ReactNode } from 'react';
 import { Languages } from '@utils/data/language';
 import { IContent, IGlobalContext, IGlobalContextOptions } from '@utils/types/global.type';
 import { IUser } from '@utils/types/user.type';
@@ -17,6 +17,7 @@ export interface OrderFormProps {
     lang?: Languages;
     slots?: {
         showSnackbar: IGlobalContext['showSnackbar'];
+        headerSlot?: ReactNode;
     };
     user?: IUser;
     selectedReleaseId?: number;

package/dist/types/form/merchandise/MerchandiseSelection.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+import { IEventProduct } from '@utils/types/event-product.type';
+interface Props {
+    eventProducts: IEventProduct[];
+    eventId: number;
+    isLoading?: boolean;
+}
+declare const MerchandiseSelection: React.FC<Props>;
+export default MerchandiseSelection;

package/dist/types/form/merchandise/MerchandiseSlider.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import { SxProps } from '@mui/material';
+import { IEventProduct } from '@utils/types/event-product.type';
+interface Props {
+    sx?: SxProps;
+    eventProducts: IEventProduct[];
+    eventId: number;
+}
+declare const MerchandiseSlider: React.FC<Props>;
+export default MerchandiseSlider;

package/dist/types/form/payment/PaymentOverviewCheckbox.d.ts

@@ -3,10 +3,6 @@ interface Props {
     checkboxName: string;
     label: string;
     value: string | JSX.Element;
-    modal: {
-        title: string;
-        description: string | JSX.Element;
-    };
 }
 declare const PaymentOverviewCheckbox: React.FC<Props>;
 export default PaymentOverviewCheckbox;

package/dist/types/form/product/ProductVariantsDialog.d.ts

@@ -5,10 +5,11 @@ interface Props {
     eventProduct: IEventProduct;
     eventId: number;
     openDialog: boolean;
-    callback: (variant: IEventProductForm) => void;
+    callback: (variants: IEventProductForm[]) => void;
     onClose?: () => void;
     selectedQuantityByVariant?: Record<number, number>;
     isOnlyMerchandise?: boolean;
+    canAddOnlyOneAtATime?: boolean;
 }
 declare const ProductVariantsDialog: React.FC<Props>;
 export default ProductVariantsDialog;

package/dist/types/form/services/index.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { IEvent } from '@utils/types/event.type';
+interface Props {
+    event: IEvent;
+}
+declare const Services: React.FC<Props>;
+export default Services;

package/dist/types/form/style.d.ts

@@ -3,6 +3,7 @@ export declare const OverviewCard: import("@emotion/styled").StyledComponent<imp
 }, {}, {}>;
 export declare const ShippingMethodItem: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & {
     active: boolean;
+    hasError?: boolean;
 }, {}, {}>;
 export declare const PaymentWrapper: import("@emotion/styled").StyledComponent<import("@mui/material").FormControlOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "className" | "style" | "classes" | "color" | "margin" | "children" | "sx" | "size" | "disabled" | "fullWidth" | "variant" | "error" | "focused" | "hiddenLabel" | "required"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
 export declare const PaymentItem: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & {

package/dist/types/form/tickets/ReleaseDescription.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+interface ReleaseDescriptionProps {
+    description?: string | null;
+    isExpanded: boolean;
+    onToggle: () => void;
+    moreInfoLabel: string;
+    showCollapse?: boolean;
+}
+declare const ReleaseDescription: React.FC<ReleaseDescriptionProps>;
+export default ReleaseDescription;

package/dist/types/form/tickets/ReleaseWithMerchandise.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+import { IReleaseShort } from '@utils/types/release.type';
+import { Currencies } from '@utils/data/currency';
+interface Props {
+    eventId: number;
+    release: IReleaseShort;
+    activeReleases: IReleaseShort[];
+    currency: Currencies;
+    index: number;
+}
+declare const ReleaseWithMerchandise: React.FC<Props>;
+export default ReleaseWithMerchandise;

package/dist/types/form/tickets/TicketQuantityControl.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+interface TicketQuantityControlProps {
+    quantity: number;
+    isDisabled: boolean;
+    canAddFirst: boolean;
+    canAddMore: boolean;
+    addLabel: string;
+    onDecrement: () => void;
+    onIncrement: () => void;
+    onAddFirst: () => void;
+}
+declare const TicketQuantityControl: React.FC<TicketQuantityControlProps>;
+export default TicketQuantityControl;

package/dist/types/form/tickets/TicketSelectionMobile.d.ts

@@ -0,0 +1,17 @@
+import React from 'react';
+import { IEvent } from '@utils/types/event.type';
+import { IReleaseShort } from '@utils/types/release.type';
+import { ITicketFormTicket } from '@utils/types/ticket.type';
+interface Props {
+    event: IEvent;
+    activeReleases?: IReleaseShort[];
+    showLoading: boolean;
+    soldOutReleaseCategoryNames: string[];
+    tickets: ITicketFormTicket[];
+    isQuantityDisabled: (value: number, releaseId: number | '') => boolean;
+    setValue: (name: string, value: any) => void;
+    removeTicket: (indexToRemove: number) => void;
+    getExtraFields: (releaseId: number | '', index: number) => React.ReactNode;
+}
+declare const TicketSelectionMobile: React.FC<Props>;
+export default TicketSelectionMobile;

package/dist/types/hooks/useScrollToFirstError.d.ts

@@ -0,0 +1,4 @@
+import { FieldErrors, FieldValues, UseFormReturn } from 'react-hook-form';
+type ScrollToFirstErrorMethods<T extends FieldValues> = Pick<UseFormReturn<T, object, undefined>, 'setFocus'>;
+export default function useScrollToFirstError<T extends FieldValues>({ setFocus, }: ScrollToFirstErrorMethods<T>): (errors: FieldErrors<T>) => void;
+export {};

package/dist/types/locales/cs.d.ts

@@ -7,6 +7,8 @@ declare const cs: {
     add: string;
     confirm: string;
     cancel: string;
+    close: string;
+    remove: string;
     pay: string;
     change: string;
     free: string;
@@ -52,6 +54,10 @@ declare const cs: {
             category: string;
             sms_notification: string;
             open_map: string;
+            payment_overview_open: string;
+            payment_overview_close: string;
+            ticket_quantity_decrease: string;
+            ticket_quantity_increase: string;
         };
         validation: {
             required: string;
@@ -102,6 +108,10 @@ declare const cs: {
                 7: {
                     title: string;
                 };
+                8: {
+                    title: string;
+                    additional_info: string;
+                };
             };
             terms_and_conditions: string;
             insurance: {
@@ -120,6 +130,16 @@ declare const cs: {
                     price: string;
                 };
             };
+            merchandise: {
+                show_sizes: string;
+                show_added: string;
+            };
+            services: {
+                add_tickets_first: string;
+            };
+            shipping: {
+                choose_address: string;
+            };
             order_success: {
                 title: string;
                 description: string;
@@ -151,6 +171,8 @@ declare const cs: {
     components: {
         product_variant_dialog: {
             select_variant: string;
+            decrease_quantity: string;
+            increase_quantity: string;
         };
     };
 };

package/dist/types/locales/en.d.ts

@@ -7,6 +7,8 @@ declare const en: {
     add: string;
     confirm: string;
     cancel: string;
+    close: string;
+    remove: string;
     pay: string;
     change: string;
     free: string;
@@ -52,6 +54,10 @@ declare const en: {
             category: string;
             sms_notification: string;
             open_map: string;
+            payment_overview_open: string;
+            payment_overview_close: string;
+            ticket_quantity_decrease: string;
+            ticket_quantity_increase: string;
         };
         validation: {
             required: string;
@@ -102,6 +108,10 @@ declare const en: {
                 7: {
                     title: string;
                 };
+                8: {
+                    title: string;
+                    additional_info: string;
+                };
             };
             terms_and_conditions: string;
             insurance: {
@@ -121,6 +131,16 @@ declare const en: {
                     price: string;
                 };
             };
+            merchandise: {
+                show_sizes: string;
+                show_added: string;
+            };
+            services: {
+                add_tickets_first: string;
+            };
+            shipping: {
+                choose_address: string;
+            };
             order_success: {
                 title: string;
                 description: string;
@@ -152,6 +172,8 @@ declare const en: {
     components: {
         product_variant_dialog: {
             select_variant: string;
+            decrease_quantity: string;
+            increase_quantity: string;
         };
     };
 };

package/dist/types/locales/es.d.ts

@@ -7,6 +7,8 @@ declare const es: {
     add: string;
     confirm: string;
     cancel: string;
+    close: string;
+    remove: string;
     pay: string;
     change: string;
     free: string;
@@ -52,6 +54,10 @@ declare const es: {
             category: string;
             sms_notification: string;
             open_map: string;
+            payment_overview_open: string;
+            payment_overview_close: string;
+            ticket_quantity_decrease: string;
+            ticket_quantity_increase: string;
         };
         validation: {
             required: string;
@@ -102,6 +108,10 @@ declare const es: {
                 7: {
                     title: string;
                 };
+                8: {
+                    title: string;
+                    additional_info: string;
+                };
             };
             terms_and_conditions: string;
             insurance: {
@@ -121,6 +131,16 @@ declare const es: {
                     price: string;
                 };
             };
+            merchandise: {
+                show_sizes: string;
+                show_added: string;
+            };
+            services: {
+                add_tickets_first: string;
+            };
+            shipping: {
+                choose_address: string;
+            };
             order_success: {
                 title: string;
                 description: string;
@@ -152,6 +172,8 @@ declare const es: {
     components: {
         product_variant_dialog: {
             select_variant: string;
+            decrease_quantity: string;
+            increase_quantity: string;
         };
     };
 };

package/dist/types/locales/pl.d.ts

@@ -7,6 +7,8 @@ declare const pl: {
     add: string;
     confirm: string;
     cancel: string;
+    close: string;
+    remove: string;
     pay: string;
     change: string;
     free: string;
@@ -52,6 +54,10 @@ declare const pl: {
             category: string;
             sms_notification: string;
             open_map: string;
+            payment_overview_open: string;
+            payment_overview_close: string;
+            ticket_quantity_decrease: string;
+            ticket_quantity_increase: string;
         };
         validation: {
             required: string;
@@ -102,6 +108,10 @@ declare const pl: {
                 7: {
                     title: string;
                 };
+                8: {
+                    title: string;
+                    additional_info: string;
+                };
             };
             terms_and_conditions: string;
             insurance: {
@@ -121,6 +131,16 @@ declare const pl: {
                     price: string;
                 };
             };
+            merchandise: {
+                show_sizes: string;
+                show_added: string;
+            };
+            services: {
+                add_tickets_first: string;
+            };
+            shipping: {
+                choose_address: string;
+            };
             order_success: {
                 title: string;
                 description: string;
@@ -152,6 +172,8 @@ declare const pl: {
     components: {
         product_variant_dialog: {
             select_variant: string;
+            decrease_quantity: string;
+            increase_quantity: string;
         };
     };
 };

package/dist/types/locales/sk.d.ts

@@ -7,6 +7,8 @@ declare const sk: {
     add: string;
     confirm: string;
     cancel: string;
+    close: string;
+    remove: string;
     pay: string;
     change: string;
     free: string;
@@ -52,6 +54,10 @@ declare const sk: {
             category: string;
             sms_notification: string;
             open_map: string;
+            payment_overview_open: string;
+            payment_overview_close: string;
+            ticket_quantity_decrease: string;
+            ticket_quantity_increase: string;
         };
         validation: {
             required: string;
@@ -102,6 +108,10 @@ declare const sk: {
                 7: {
                     title: string;
                 };
+                8: {
+                    title: string;
+                    additional_info: string;
+                };
             };
             terms_and_conditions: string;
             insurance: {
@@ -121,6 +131,16 @@ declare const sk: {
                     price: string;
                 };
             };
+            merchandise: {
+                show_sizes: string;
+                show_added: string;
+            };
+            services: {
+                add_tickets_first: string;
+            };
+            shipping: {
+                choose_address: string;
+            };
             order_success: {
                 title: string;
                 description: string;
@@ -152,6 +172,8 @@ declare const sk: {
     components: {
         product_variant_dialog: {
             select_variant: string;
+            decrease_quantity: string;
+            increase_quantity: string;
         };
     };
 };

package/dist/types/locales/uk.d.ts

@@ -7,6 +7,8 @@ declare const uk: {
     add: string;
     confirm: string;
     cancel: string;
+    close: string;
+    remove: string;
     pay: string;
     change: string;
     free: string;
@@ -52,6 +54,10 @@ declare const uk: {
             category: string;
             sms_notification: string;
             open_map: string;
+            payment_overview_open: string;
+            payment_overview_close: string;
+            ticket_quantity_decrease: string;
+            ticket_quantity_increase: string;
         };
         validation: {
             required: string;
@@ -102,6 +108,10 @@ declare const uk: {
                 7: {
                     title: string;
                 };
+                8: {
+                    title: string;
+                    additional_info: string;
+                };
             };
             terms_and_conditions: string;
             insurance: {
@@ -121,6 +131,16 @@ declare const uk: {
                     price: string;
                 };
             };
+            merchandise: {
+                show_sizes: string;
+                show_added: string;
+            };
+            services: {
+                add_tickets_first: string;
+            };
+            shipping: {
+                choose_address: string;
+            };
             order_success: {
                 title: string;
                 description: string;
@@ -152,6 +172,8 @@ declare const uk: {
     components: {
         product_variant_dialog: {
             select_variant: string;
+            decrease_quantity: string;
+            increase_quantity: string;
         };
     };
 };

package/dist/types/utils/data/global.d.ts

@@ -1 +1,2 @@
+export declare const EVENTLOOK_ORDER_FORM_CONTAINER_ID = "eventlook-order-form-container";
 export declare const EVENTLOOK_ORDER_FORM_ID = "eventlook-order-form";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eventlook/sdk",
-  "version": "1.5.0-beta.6",
+  "version": "1.5.0-beta.7",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",
   "types": "dist/types/index.d.ts",
@@ -40,12 +40,14 @@
   "devDependencies": {
     "@emotion/react": "^11.14.0",
     "@emotion/styled": "^11.14.1",
-    "@eslint/js": "^9",
+    "@eslint/js": "^10",
     "@hookform/resolvers": "^5.2.2",
     "@iconify/icons-carbon": "^1.2.20",
     "@iconify/react": "^6.0.2",
     "@mui/material": "^7.3.8",
+    "@mui/system": "^7.3.9",
     "@mui/x-date-pickers": "^8.27.2",
+    "@rollup/plugin-alias": "^6.0.0",
     "@rollup/plugin-commonjs": "^29.0.0",
     "@rollup/plugin-json": "^6.1.0",
     "@rollup/plugin-node-resolve": "^16.0.3",
@@ -60,6 +62,7 @@
     "chokidar-cli": "^3.0.0",
     "concurrently": "^9.2.1",
     "dayjs": "^1.11.19",
+    "embla-carousel-react": "^8.6.0",
     "eslint": "^9.39.3",
     "eslint-config-prettier": "^10.1.8",
     "eslint-import-resolver-typescript": "^4.4.4",
@@ -67,12 +70,12 @@
     "eslint-plugin-jsx-a11y": "^6.10.2",
     "eslint-plugin-prettier": "^5.5.5",
     "eslint-plugin-react": "^7.37.5",
-    "eslint-plugin-react-hooks": "^5",
-    "motion": "^12.34.4",
+    "eslint-plugin-react-hooks": "^7",
     "globals": "^17.4.0",
     "js-cookie": "^3.0.5",
     "lodash": "^4.17.23",
     "lottie-react": "^2.4.1",
+    "motion": "^12.35.0",
     "mui-tel-input": "^9.0.1",
     "numeral": "^2.0.6",
     "prettier": "^3.8.1",
@@ -89,6 +92,9 @@
   "engines": {
     "node": ">=22"
   },
+  "resolutions": {
+    "@mui/system": "^7.3.9"
+  },
   "browser": {
     "fs": false,
     "path": false,

package/rollup.config.mjs

@@ -3,6 +3,7 @@ import resolve from '@rollup/plugin-node-resolve';
 import commonjs from '@rollup/plugin-commonjs';
 import json from '@rollup/plugin-json';
 import replace from '@rollup/plugin-replace';
+import alias from '@rollup/plugin-alias';
 
 const peerDeps = [
   'react',
@@ -11,7 +12,7 @@ const peerDeps = [
   '@emotion/styled',
   '@mui/material',
   '@mui/x-date-pickers',
-  'framer-motion',
+  'motion',
 ];
 
 const nodeBuiltins = ['fs', 'path', 'http', 'https', 'stream', 'os', 'zlib'];
@@ -44,17 +45,11 @@ export default {
     warn(warning);
   },
   plugins: [
-    {
-      name: 'lottie-light',
-      resolveId(source) {
-        if (source === 'lottie-web') {
-          return this.resolve('lottie-web/build/player/lottie_light.js', undefined, {
-            skipSelf: true,
-          });
-        }
-        return null;
-      },
-    },
+    alias({
+      entries: [
+        { find: 'lottie-web', replacement: 'lottie-web/build/player/lottie_light.js' },
+      ],
+    }),
     json({
       compact: true,
       preferConst: true,

package/src/components/hook-form/FormProvider.tsx

@@ -7,12 +7,15 @@ type Props = {
   children: React.ReactNode;
   methods: UseFormReturn<any>;
   onSubmit?: VoidFunction;
+  formId?: string;
 };
 
-export default function FormProvider({ children, onSubmit, methods }: Props) {
+export default function FormProvider({ children, onSubmit, methods, formId }: Props) {
   return (
     <Form {...methods}>
-      <form onSubmit={onSubmit}>{children}</form>
+      <form id={formId} onSubmit={onSubmit}>
+        {children}
+      </form>
     </Form>
   );
 }

package/src/form/ChildEventDialog.tsx

@@ -2,10 +2,10 @@ import useActiveEventProducts from '@hooks/data/useActiveEventProducts';
 import { Dialog, DialogContent, Stack, Step, StepContent, StepLabel, Stepper } from '@mui/material';
 import { IEvent } from '@utils/types/event.type';
 import React from 'react';
-import TicketWithMerchandiseSelection from './TicketWithMerchandiseSelection';
-import TicketSelection from './TicketSelection';
+import TicketWithMerchandiseSelection from './tickets/TicketWithMerchandiseSelection';
+import TicketSelection from './tickets/TicketSelection';
 import useGlobal from '@hooks/useGlobal';
-import MerchandiseSelection from './MerchandiseSelection';
+import MerchandiseSelection from './merchandise/MerchandiseSelection';
 
 interface Props {
   event: IEvent;

package/src/form/ContactPerson.tsx

@@ -18,7 +18,7 @@ const ContactPerson: React.FC<Props> = ({ event }) => {
   const { t, content } = useGlobal();
 
   return (
-    <Grid container spacing={3}>
+    <Grid container spacing={{ xs: 1, md: 2 }}>
       <Grid size={{ xs: 12, md: 6 }}>
         <RHFTextField name="firstName" label={t('form.labels.first_name')} />
       </Grid>