@opexa/portal-components 0.0.6 → 0.0.8

package/dist/components/SignUp/SignUpForm.jsx

@@ -1,312 +0,0 @@
-'use client';
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
-var __generator = (this && this.__generator) || function (thisArg, body) {
-    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype);
-    return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
-    function verb(n) { return function (v) { return step([n, v]); }; }
-    function step(op) {
-        if (f) throw new TypeError("Generator is already executing.");
-        while (g && (g = 0, op[0] && (_ = 0)), _) try {
-            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
-            if (y = 0, t) op = [op[0] & 2, t.value];
-            switch (op[0]) {
-                case 0: case 1: t = op; break;
-                case 4: _.label++; return { value: op[1], done: false };
-                case 5: _.label++; y = op[1]; op = [0]; continue;
-                case 7: op = _.ops.pop(); _.trys.pop(); continue;
-                default:
-                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
-                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
-                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
-                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
-                    if (t[2]) _.ops.pop();
-                    _.trys.pop(); continue;
-            }
-            op = body.call(thisArg, _);
-        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
-        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
-    }
-};
-import { useDialogContext } from '@ark-ui/react';
-import { zodResolver } from '@hookform/resolvers/zod';
-import { ObjectId, ObjectType } from '@opexa/portal-sdk-core/object-id';
-import { useSearchParams } from 'next/navigation';
-import { useState } from 'react';
-import { Controller, useForm } from 'react-hook-form';
-import { z } from 'zod';
-import { useShallow } from 'zustand/shallow';
-import { useCooldown } from '../../hooks/useCooldown.js';
-import { useGlobalStore } from '../../hooks/useGlobalStore.js';
-import { useLocaleInfo } from '../../hooks/useLocaleInfo.js';
-import { useMobileNumberParser } from '../../hooks/useMobileNumberParser.js';
-import { useSendVerificationCodeMutation } from '../../hooks/useSendVerificationCodeMutation/useSendVerificationCodeMutation.js';
-import { useSignInMutation } from '../../hooks/useSigninMutation/useSignInMutation.js';
-import { useSignUpMutation } from '../../hooks/useSignUpMutation/useSignUpMutation.js';
-import { ArrowLeftIcon } from '../../icons/ArrowLeftIcon.jsx';
-import { CheckIcon } from '../../icons/CheckIcon.jsx';
-import { Button, Checkbox, Field, PinInput } from '../../ui/index.js';
-import { toaster } from '../../utils/toaster.js';
-export function SignUpForm() {
-    var _this = this;
-    var _a;
-    var _b = useState(1), step = _b[0], setStep = _b[1];
-    var dialog = useDialogContext();
-    var search = useSearchParams();
-    var signInStore = useGlobalStore(useShallow(function (popups) { return popups.signIn; }));
-    var signUpMutation = useSignUpMutation();
-    var signInMutation = useSignInMutation();
-    var sendVerificationCodeMutation = useSendVerificationCodeMutation();
-    var localeInfo = useLocaleInfo();
-    var mobileNumberParser = useMobileNumberParser();
-    var Step1Definition = z.object({
-        mobileNumber: z.string().superRefine(function (v, ctx) {
-            if (!mobileNumberParser.validate(v)) {
-                ctx.addIssue({
-                    code: z.ZodIssueCode.custom,
-                    message: 'Invalid mobile number',
-                });
-            }
-        }),
-        termsAccepted: z.boolean().superRefine(function (v, ctx) {
-            if (!v) {
-                ctx.addIssue({
-                    code: z.ZodIssueCode.custom,
-                    message: 'You must accept the terms and conditions',
-                });
-            }
-        }),
-    });
-    var Step2Definition = z.object({
-        verificationCode: z.array(z.string().min(1).max(1).trim()).min(6).max(6),
-    });
-    var step1Form = useForm({
-        resolver: zodResolver(Step1Definition),
-        defaultValues: {
-            mobileNumber: '',
-            termsAccepted: false,
-        },
-    });
-    var step2Form = useForm({
-        resolver: zodResolver(Step2Definition),
-        defaultValues: {
-            verificationCode: Array.from({ length: 6 }).fill(''),
-        },
-    });
-    var cooldown = useCooldown({
-        max: 60,
-        duration: 1000 * 60,
-    });
-    return (<>
-      {step === 1 && (<>
-          <div className="w-full grow">
-            <h2 className="mt-xl text-center text-lg font-semibold">
-              Create an account
-            </h2>
-            <p className="text-gray-600 mt-xs text-center text-sm">
-              Register instantly and start playing!
-            </p>
-
-            <form className="mt-5" onSubmit={step1Form.handleSubmit(function (data) { return __awaiter(_this, void 0, void 0, function () {
-                var e_1;
-                return __generator(this, function (_a) {
-                    switch (_a.label) {
-                        case 0:
-                            _a.trys.push([0, 2, , 3]);
-                            return [4 /*yield*/, sendVerificationCodeMutation.mutateAsync({
-                                    channel: 'SMS',
-                                    recipient: mobileNumberParser.format(data.mobileNumber),
-                                })];
-                        case 1:
-                            _a.sent();
-                            setStep(2);
-                            cooldown.start();
-                            return [3 /*break*/, 3];
-                        case 2:
-                            e_1 = _a.sent();
-                            toaster.error({
-                                description: e_1 instanceof Error
-                                    ? e_1.message
-                                    : 'Failed to send verification code',
-                            });
-                            return [3 /*break*/, 3];
-                        case 3: return [2 /*return*/];
-                    }
-                });
-            }); })}>
-              <Field.Root invalid={!!step1Form.formState.errors.mobileNumber}>
-                <Field.Label>Mobile Number</Field.Label>
-                <div className="relative">
-                  <localeInfo.country.flag className="absolute left-3.5 top-1/2 size-5 shrink-0 -translate-y-1/2"/>
-                  <Field.Input className="pl-11" {...step1Form.register('mobileNumber')}/>
-                </div>
-                <Field.ErrorText>
-                  {(_a = step1Form.formState.errors.mobileNumber) === null || _a === void 0 ? void 0 : _a.message}
-                </Field.ErrorText>
-              </Field.Root>
-
-              <Button type="submit" className="mt-5" disabled={step1Form.formState.isSubmitting}>
-                Create Account
-              </Button>
-
-              <Controller control={step1Form.control} name="termsAccepted" render={function (o) { return (<Checkbox.Root className="mt-xl" invalid={o.fieldState.invalid} checked={o.field.value} onCheckedChange={function (details) {
-                    o.field.onChange(details.checked);
-                }}>
-                    <Checkbox.Control>
-                      <Checkbox.Indicator asChild>
-                        <CheckIcon />
-                      </Checkbox.Indicator>
-                    </Checkbox.Control>
-                    <Checkbox.Label>
-                      I confirm that I am at least 21 years old, not listed in
-                      the PAGCOR NDRP, not a GEL license holder, government
-                      employee, or member of the Armed Forces of the
-                      Philippines. I am not playing in a public space and agree
-                      to the Terms of Use and Privacy Policy. Ineligible
-                      accounts will have their funds forfeited to the
-                      government.
-                    </Checkbox.Label>
-                    <Checkbox.HiddenInput />
-                  </Checkbox.Root>); }}/>
-            </form>
-          </div>
-
-          <div className="flex w-full items-center justify-center gap-xs text-sm">
-            <span className="text-gray-500">Don&apos;t have an account?</span>
-            <button type="submit" className="text-accent-700 font-semibold" onClick={function () {
-                dialog.setOpen(false);
-                signInStore.setOpen(true);
-            }}>
-              Log In
-            </button>
-          </div>
-        </>)}
-
-      {step === 2 && (<div className="w-full grow">
-          <h2 className="mt-xl text-center text-lg font-semibold">
-            Check your Phone
-          </h2>
-          <p className="text-gray-600 mt-xs text-center text-sm">
-            We&rsquo;ve sent a verification code to your mobile number{' '}
-            <span className="font-semibold">
-              {mobileNumberParser.format(step1Form.getValues('mobileNumber'))}
-            </span>{' '}
-            via text
-          </p>
-
-          <form className="mt-5" onSubmit={step2Form.handleSubmit(function (_a) { return __awaiter(_this, [_a], void 0, function (_b) {
-                var id, mobileNumber, name_1, password, _c, _d;
-                var _e, _f, _g;
-                var verificationCode = _b.verificationCode;
-                return __generator(this, function (_h) {
-                    switch (_h.label) {
-                        case 0:
-                            id = ObjectId.generate(ObjectType.MemberAccount).toString();
-                            mobileNumber = step1Form.getValues().mobileNumber;
-                            _h.label = 1;
-                        case 1:
-                            _h.trys.push([1, 7, , 8]);
-                            return [4 /*yield*/, signUpMutation.mutateAsync({
-                                    id: id,
-                                    mobileNumber: mobileNumberParser.format(mobileNumber),
-                                    verificationCode: verificationCode.join(''),
-                                    referralCode: (_e = search.get('referralCode')) !== null && _e !== void 0 ? _e : undefined,
-                                    domain: (_f = search.get('domain')) !== null && _f !== void 0 ? _f : undefined,
-                                    btag: (_g = search.get('btag')) !== null && _g !== void 0 ? _g : undefined,
-                                })];
-                        case 2:
-                            _h.sent();
-                            name_1 = mobileNumberParser.format(mobileNumber);
-                            password = "".concat(name_1).concat(id);
-                            _h.label = 3;
-                        case 3:
-                            _h.trys.push([3, 5, , 6]);
-                            return [4 /*yield*/, signInMutation.mutateAsync({
-                                    type: 'NAME_AND_PASSWORD',
-                                    name: mobileNumberParser.format(mobileNumber),
-                                    password: password,
-                                })];
-                        case 4:
-                            _h.sent();
-                            return [3 /*break*/, 6];
-                        case 5:
-                            _c = _h.sent();
-                            signInStore.setOpen(true);
-                            return [3 /*break*/, 6];
-                        case 6:
-                            dialog.setOpen(false);
-                            step1Form.reset();
-                            step2Form.reset();
-                            setStep(1);
-                            return [3 /*break*/, 8];
-                        case 7:
-                            _d = _h.sent();
-                            toaster.error({
-                                title: 'Invalid Verification Code',
-                            });
-                            return [3 /*break*/, 8];
-                        case 8: return [2 /*return*/];
-                    }
-                });
-            }); })}>
-            <Controller name="verificationCode" control={step2Form.control} render={function (o) { return (<PinInput.Root placeholder="0" invalid={o.fieldState.invalid} value={o.field.value} onValueChange={function (details) {
-                    o.field.onChange(details.value);
-                }}>
-                  <PinInput.Control>
-                    <PinInput.Input index={0}/>
-                    <PinInput.Input index={1}/>
-                    <PinInput.Input index={2}/>
-                    <PinInput.Input index={3}/>
-                    <PinInput.Input index={4}/>
-                    <PinInput.Input index={5}/>
-                  </PinInput.Control>
-                  <PinInput.HiddenInput />
-                </PinInput.Root>); }}/>
-
-            <Button type="submit" className="mt-5" disabled={step2Form.formState.isSubmitting}>
-              Verify and Play
-            </Button>
-
-            <div className="mt-5 flex w-full items-center justify-center gap-xs text-sm">
-              <span className="text-gray-500">
-                Didn&apos;t recieve the code?
-              </span>
-              <button type="button" className="text-accent-700 font-semibold disabled:cursor-not-allowed disabled:opacity-75" disabled={cooldown.cooling} onClick={function () { return __awaiter(_this, void 0, void 0, function () {
-                return __generator(this, function (_a) {
-                    switch (_a.label) {
-                        case 0: return [4 /*yield*/, sendVerificationCodeMutation.mutateAsync({
-                                channel: 'SMS',
-                                recipient: mobileNumberParser.format(step1Form.getValues('mobileNumber')),
-                            })];
-                        case 1:
-                            _a.sent();
-                            cooldown.start();
-                            return [2 /*return*/];
-                    }
-                });
-            }); }}>
-                {cooldown.cooling
-                ? "Resend in ".concat(cooldown.countdown, "s")
-                : 'Resend'}
-              </button>
-            </div>
-
-            <button type="button" className="text-gray-600 mx-auto mt-5 flex w-fit items-center gap-1 text-sm font-semibold" onClick={function () {
-                setStep(1);
-                step2Form.reset();
-                cooldown.stop();
-            }}>
-              <ArrowLeftIcon className="size-5"/>
-              Back
-            </button>
-          </form>
-        </div>)}
-    </>);
-}

package/dist/components/SignUp/index.js

@@ -1 +0,0 @@
-export * from './SignUp.jsx';

package/dist/components/TopWins/TopWins.jsx

@@ -1,45 +0,0 @@
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
-var __generator = (this && this.__generator) || function (thisArg, body) {
-    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype);
-    return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
-    function verb(n) { return function (v) { return step([n, v]); }; }
-    function step(op) {
-        if (f) throw new TypeError("Generator is already executing.");
-        while (g && (g = 0, op[0] && (_ = 0)), _) try {
-            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
-            if (y = 0, t) op = [op[0] & 2, t.value];
-            switch (op[0]) {
-                case 0: case 1: t = op; break;
-                case 4: _.label++; return { value: op[1], done: false };
-                case 5: _.label++; y = op[1]; op = [0]; continue;
-                case 7: op = _.ops.pop(); _.trys.pop(); continue;
-                default:
-                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
-                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
-                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
-                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
-                    if (t[2]) _.ops.pop();
-                    _.trys.pop(); continue;
-            }
-            op = body.call(thisArg, _);
-        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
-        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
-    }
-};
-import { TopWinsContent } from './TopWinsContent.jsx';
-export function TopWins(props) {
-    return __awaiter(this, void 0, void 0, function () {
-        return __generator(this, function (_a) {
-            /* await prefetchTopWinsQuery(); */
-            return [2 /*return*/, <TopWinsContent {...props}/>];
-        });
-    });
-}

package/dist/components/TopWins/TopWinsContent.d.ts

@@ -1,2 +0,0 @@
-import type { TopWinsProps } from './TopWins.jsx';
-export declare function TopWinsContent(props: TopWinsProps): import("react").JSX.Element | null;

package/dist/components/TopWins/TopWinsContent.jsx

@@ -1,51 +0,0 @@
-'use client';
-import useEmblaCarousel from 'embla-carousel-react';
-import Image from 'next/image';
-import { useLocaleInfo } from '../../hooks/useLocaleInfo.js';
-import { useTopWinsQuery } from '../../hooks/useTopWinsQuery/useTopWinsQuery.js';
-import { formatNumber } from '../../utils/formatNumber.js';
-import { getGameImageUrl } from '../../utils/getGameImageUrl.js';
-export function TopWinsContent(props) {
-    var _a;
-    var localeInfo = useLocaleInfo();
-    var topWinsQuery = useTopWinsQuery();
-    var topWins = (_a = topWinsQuery.data) !== null && _a !== void 0 ? _a : [];
-    var emblaRef = useEmblaCarousel({
-        align: 'start',
-        slidesToScroll: 1,
-    })[0];
-    if (!(topWins === null || topWins === void 0 ? void 0 : topWins.length))
-        return null;
-    return (<div className={props.className}>
-      <div className="text-gray-600 mb-3 text-lg font-semibold md:mb-4">
-        {props.heading}
-      </div>
-
-      <div ref={emblaRef} className="relative lg:overflow-hidden">
-        <div className="flex gap-sm lg:gap-md">
-          {topWins.map(function (topWin) { return (<div key={topWin.id} className="bg-gray-50 border-gray-200 flex w-[calc((100%-(0.375rem*2))/3)] shrink-0 flex-col space-y-2 rounded-sm border p-2 text-center lg:w-[calc((100%-(0.5rem*5))/6)] xl:w-[calc((100%-(0.5rem*9))/10)]">
-              <div className="mx-auto aspect-square w-full">
-                {topWin.game && (<Image width={100} height={100} src={getGameImageUrl(topWin.game)} alt="" className="size-full rounded-sm object-cover"/>)}
-              </div>
-
-              <div className="space-y-0.5">
-                <div className="text-gray-600 text-xs">
-                  {topWin.member.name}
-                </div>
-                <div className="text-gray-800 text-sm font-semibold">
-                  {formatNumber(topWin.payout, {
-                currency: localeInfo.currency.code,
-                minDecimalPlaces: 2,
-            })}
-                </div>
-                <div className="text-gray-600 text-xs">
-                  {formatNumber(topWin.multiplier, {
-                minDecimalPlaces: 2,
-            })}
-                </div>
-              </div>
-            </div>); })}
-        </div>
-      </div>
-    </div>);
-}

package/dist/components/TopWins/index.js

@@ -1 +0,0 @@
-export * from './TopWins.jsx';

package/dist/components/TournamentCounter/TournamentCounter.jsx

@@ -1,54 +0,0 @@
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
-var __generator = (this && this.__generator) || function (thisArg, body) {
-    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype);
-    return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
-    function verb(n) { return function (v) { return step([n, v]); }; }
-    function step(op) {
-        if (f) throw new TypeError("Generator is already executing.");
-        while (g && (g = 0, op[0] && (_ = 0)), _) try {
-            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
-            if (y = 0, t) op = [op[0] & 2, t.value];
-            switch (op[0]) {
-                case 0: case 1: t = op; break;
-                case 4: _.label++; return { value: op[1], done: false };
-                case 5: _.label++; y = op[1]; op = [0]; continue;
-                case 7: op = _.ops.pop(); _.trys.pop(); continue;
-                default:
-                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
-                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
-                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
-                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
-                    if (t[2]) _.ops.pop();
-                    _.trys.pop(); continue;
-            }
-            op = body.call(thisArg, _);
-        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
-        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
-    }
-};
-import { TournamentCounterContent } from './TournamentCounterContent.jsx';
-export function TournamentCounter(props) {
-    return __awaiter(this, void 0, void 0, function () {
-        return __generator(this, function (_a) {
-            /*
-            await prefetchTournamentsQuery({
-              first: 100,
-              filter: {
-                status: {
-                  equal: 'ACTIVE',
-                },
-              },
-            });
-            */
-            return [2 /*return*/, <TournamentCounterContent {...props}/>];
-        });
-    });
-}

package/dist/components/TournamentCounter/TournamentCounterContent.d.ts

@@ -1,2 +0,0 @@
-import type { TournamentCounterProps } from './TournamentCounter.jsx';
-export declare function TournamentCounterContent(props: TournamentCounterProps): import("react").JSX.Element | null;

package/dist/components/TournamentCounter/TournamentCounterContent.jsx

@@ -1,79 +0,0 @@
-'use client';
-import useEmblaCarousel from 'embla-carousel-react';
-import Link from 'next/link';
-import { useCallback, useEffect, useState } from 'react';
-import { useTournamentsQuery } from '../../hooks/useTournamentsQuery/useTournamentsQuery.js';
-import { ArrowLeftIcon } from '../../icons/ArrowLeftIcon.jsx';
-import { ArrowRightIcon } from '../../icons/ArrowRightIcon.jsx';
-import { ChevronRightIcon } from '../../icons/ChevronRightIcon.jsx';
-import { Button } from '../../ui/index.js';
-import { TournamentCounterItem } from './TournamentCounterItem.jsx';
-export function TournamentCounterContent(props) {
-    var _a, _b;
-    var _c = useEmblaCarousel({
-        align: 'start',
-        slidesToScroll: 1,
-    }), emblaRef = _c[0], emblaApi = _c[1];
-    var scrollPrev = useCallback(function () {
-        if (emblaApi)
-            emblaApi.scrollPrev();
-    }, [emblaApi]);
-    var scrollNext = useCallback(function () {
-        if (emblaApi)
-            emblaApi.scrollNext();
-    }, [emblaApi]);
-    var _d = useState(false), canScrollPrev = _d[0], setCanScrollPrev = _d[1];
-    var _e = useState(false), canScrollNext = _e[0], setCanScrollNext = _e[1];
-    var onSelect = useCallback(function () {
-        if (!emblaApi)
-            return;
-        setCanScrollPrev(emblaApi.canScrollPrev());
-        setCanScrollNext(emblaApi.canScrollNext());
-    }, [emblaApi]);
-    useEffect(function () {
-        if (!emblaApi)
-            return;
-        onSelect(); // set initial state
-        emblaApi.on('select', onSelect);
-        emblaApi.on('reInit', onSelect); // handles responsive changes
-    }, [emblaApi, onSelect]);
-    var tournamentsQuery = useTournamentsQuery({
-        first: 100,
-        filter: {
-            status: {
-                equal: 'ACTIVE',
-            },
-        },
-    });
-    var tournaments = (_b = (_a = tournamentsQuery.data) === null || _a === void 0 ? void 0 : _a.pages[0].edges.map(function (edge) { return edge.node; })) !== null && _b !== void 0 ? _b : [];
-    if (tournaments.length <= 0)
-        return null;
-    return (<div className={props.className}>
-      <div className="mb-3 flex items-center justify-between md:mb-4">
-        <div className="text-lg font-semibold">{props.heading}</div>
-        <div className="flex items-center md:gap-3xl">
-          <Link href={props.seeAllUrl} className="flex gap-sm text-sm font-semibold">
-            See All
-            <ChevronRightIcon className="size-5 lg:hidden"/>
-          </Link>
-
-          <div className="hidden lg:flex">
-            <Button disabled={!canScrollPrev} onClick={scrollPrev} variant="outline" colorScheme="gray" className="rounded-r-none border-r-0" aria-label="Previous">
-              <ArrowLeftIcon className="size-5"/>
-            </Button>
-            <Button disabled={!canScrollNext} onClick={scrollNext} variant="outline" colorScheme="gray" className="rounded-l-none" aria-label="Next">
-              <ArrowRightIcon className="size-5"/>
-            </Button>
-          </div>
-        </div>
-      </div>
-
-      <div className="w-full overflow-hidden" ref={emblaRef}>
-        <div className="flex gap-2.5">
-          {tournaments.map(function (tournament, index) { return (<TournamentCounterItem key={tournament.id} index={index} tournament={tournament} className={tournaments.length < 2
-                ? 'w-full'
-                : 'w-full lg:w-[calc((100%-0.75rem)/2)]'}/>); })}
-        </div>
-      </div>
-    </div>);
-}