@opexa/portal-components 0.0.18 → 0.0.20

package/dist/components/Games/Games.client.js

@@ -1 +1 @@
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),w=require("embla-carousel-react"),j=require("next/image"),v=require("next/link"),i=require("react"),S=require("tailwind-merge");require("@opexa/portal-sdk-core");require("@tanstack/react-query");require("tiny-invariant");require("../../constants/index.js");require("../../utils/capitalize.js");require("../../utils/parseDecimal.js");require("../../utils/getLocaleInfo.js");require("../../utils/getQueryClient.js");require("../../utils/isMobile.js");require("lodash-es");require("@opexa/portal-sdk-core/object-id");const y=require("../../client/hooks/useGamesQuery.js");require("../../client/hooks/useGlobalStore.js");require("../../client/hooks/useInfiniteQueryHelper.js");require("usehooks-ts");const b=require("../../icons/ArrowLeftIcon.js"),P=require("../../icons/ArrowRightIcon.js"),k=require("../../icons/ChevronRightIcon.js"),I=require("../../icons/SpinnerIcon.js");require("../../ui/AlertDialog/AlertDialog.js");require("../../ui/Avatar/Avatar.js");require("../../ui/Badge/Badge.js");const o=require("../../ui/Button/Button.js");require("../../ui/Checkbox/Checkbox.js");require("../../ui/Clipboard/Clipboard.js");require("../../ui/Collapsible/Collapsible.js");require("../../ui/DatePicker/DatePicker.js");require("../../ui/Dialog/Dialog.js");require("../../ui/Drawer/Drawer.js");require("../../ui/Field/Field.js");require("@ark-ui/react");require("../../ui/IconButton/iconButton.recipe.js");require("../../ui/NumberInput/NumberInput.js");require("../../ui/PasswordInput/PasswordInput.js");require("../../ui/PinInput/PinInput.js");require("../../ui/Popover/Popover.js");require("../../ui/Progress/Progress.js");require("../../ui/SegmentGroup/SegmentGroup.js");require("../../ui/Select/Select.js");require("../../ui/Table/Table.js");require("../../ui/Tabs/Tabs.js");require("zustand/shallow");const C=require("../GameLaunch/GameLaunchTrigger.js");function B(n){var l;const a=n.numOfRows??1,t=y.useGamesQuery({first:(a+1)*6,filter:n.filter}),u=((l=t.data)==null?void 0:l.pages.map(s=>s.edges.map(N=>N.node)).flat())??[],[d,e]=w({align:"start",slidesToScroll:3,breakpoints:{"(min-width: 1024px)":{slidesToScroll:6}}}),[q,g]=i.useState(!0),[x,m]=i.useState(!0),h=i.useCallback(()=>e==null?void 0:e.scrollPrev(),[e]),f=i.useCallback(async()=>{!(e!=null&&e.canScrollNext())&&t.hasNextPage&&(await t.fetchNextPage(),e==null||e.reInit(),await new Promise(s=>setTimeout(s,1))),e==null||e.scrollNext()},[e,t]),c=i.useCallback(s=>{g(!(s!=null&&s.canScrollPrev())),m(!(s!=null&&s.canScrollNext()))},[]);return i.useEffect(()=>{e&&(c(e),e.on("reInit",c).on("select",c))},[e,c]),r.jsxs("div",{className:n.className,children:[r.jsxs("div",{className:"flex items-center",children:[r.jsx("h2",{className:"text-lg font-semibold",children:n.heading??"Games"}),r.jsx("div",{className:"grow"}),r.jsxs("div",{className:"flex items-center justify-center gap-xl",children:[r.jsxs(v,{href:n.viewAllUrl??"/games",className:"text-button-tertiary-fg flex gap-sm text-sm font-semibold",children:["See All",r.jsx(k.ChevronRightIcon,{className:"size-5 lg:hidden"})]}),r.jsxs("div",{className:"hidden lg:flex",children:[r.jsx(o.Button,{variant:"outline",colorScheme:"gray",className:"rounded-r-none border-r-0",onClick:h,disabled:q,"aria-label":"Previous",children:r.jsx(b.ArrowLeftIcon,{className:"size-5"})}),r.jsx(o.Button,{variant:"outline",colorScheme:"gray",className:"rounded-l-none",onClick:f,disabled:x&&!t.hasNextPage?!0:t.isFetchingNextPage,"aria-label":"Next",children:t.isFetchingNextPage?r.jsx(I.SpinnerIcon,{className:"size-5"}):r.jsx(P.ArrowRightIcon,{className:"size-5"})})]})]})]}),r.jsx("div",{ref:d,className:"relative mt-lg lg:overflow-hidden",children:r.jsx("div",{className:S.twMerge("grid auto-cols-[calc((100%-(0.375rem*2))/3)] grid-flow-col gap-sm lg:auto-cols-[calc((100%-(0.5rem*5))/6)] lg:gap-md",a===3?"grid-rows-3":a===2?"grid-rows-2":"grid-rows-1"),children:u.map(s=>r.jsxs(C.GameLaunchTrigger,{game:s,className:"block w-full shadow-sm",children:[r.jsx(j,{src:s.image,alt:"",width:200,height:200,priority:!0,className:"aspect-square w-full rounded-t-md object-cover"}),r.jsx("span",{className:"bg-bg-tertiary text-text-primary-brand block w-full truncate rounded-b-md px-2 py-2.5 text-center text-xs font-semibold",children:s.name})]},s.id))})})]})}exports.Games__client=B;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),w=require("embla-carousel-react"),j=require("next/image"),y=require("next/link"),a=require("react"),g=require("tailwind-merge");require("@opexa/portal-sdk-core");require("@tanstack/react-query");require("tiny-invariant");require("../../constants/index.js");require("../../utils/capitalize.js");require("../../utils/parseDecimal.js");require("../../utils/getLocaleInfo.js");require("../../utils/getQueryClient.js");require("../../utils/isMobile.js");require("../../client/services/getSession.js");const k=require("../../client/hooks/useSessionQuery.js");require("lodash-es");require("@opexa/portal-sdk-core/object-id");const S=require("../../client/hooks/useFavoriteGamesQuery.js"),b=require("../../client/hooks/useGamesQuery.js");require("../../client/hooks/useGlobalStore.js");require("../../client/hooks/useInfiniteQueryHelper.js");const G=require("../../client/hooks/useMarkGameAsFavoriteMutation.js");require("usehooks-ts");const P=require("../../client/hooks/useUnmarkGameAsFavoriteMutation.js"),I=require("../../icons/ArrowLeftIcon.js"),M=require("../../icons/ArrowRightIcon.js"),C=require("../../icons/ChevronRightIcon.js"),F=require("../../icons/SpinnerIcon.js"),Q=require("../../icons/Star01Icon.js");require("../../ui/AlertDialog/AlertDialog.js");require("../../ui/Avatar/Avatar.js");require("../../ui/Badge/Badge.js");const x=require("../../ui/Button/Button.js");require("../../ui/Checkbox/Checkbox.js");require("../../ui/Clipboard/Clipboard.js");require("../../ui/Collapsible/Collapsible.js");require("../../ui/Combobox/Combobox.js");require("../../ui/DatePicker/DatePicker.js");require("../../ui/Dialog/Dialog.js");require("../../ui/Drawer/Drawer.js");require("../../ui/Field/Field.js");require("@ark-ui/react");require("../../ui/IconButton/iconButton.recipe.js");require("../../ui/NumberInput/NumberInput.js");require("../../ui/PasswordInput/PasswordInput.js");require("../../ui/PinInput/PinInput.js");require("../../ui/Popover/Popover.js");require("../../ui/Progress/Progress.js");require("../../ui/SegmentGroup/SegmentGroup.js");require("../../ui/Select/Select.js");require("../../ui/Table/Table.js");require("../../ui/Tabs/Tabs.js");require("zustand/shallow");const B=require("../GameLaunch/GameLaunchTrigger.js");function R(s){var q;const u=s.numOfRows??1,i=b.useGamesQuery({first:(u+1)*6,filter:s.filter}),m=((q=i.data)==null?void 0:q.pages.map(t=>t.edges.map(N=>N.node)).flat())??[],[d,e]=w({align:"start",slidesToScroll:3,breakpoints:{"(min-width: 1024px)":{slidesToScroll:6}}}),[o,c]=a.useState(!0),[n,f]=a.useState(!0),h=a.useCallback(()=>e==null?void 0:e.scrollPrev(),[e]),v=a.useCallback(async()=>{!(e!=null&&e.canScrollNext())&&i.hasNextPage&&(await i.fetchNextPage(),e==null||e.reInit(),await new Promise(t=>setTimeout(t,1))),e==null||e.scrollNext()},[e,i]),l=a.useCallback(t=>{c(!(t!=null&&t.canScrollPrev())),f(!(t!=null&&t.canScrollNext()))},[]);return a.useEffect(()=>{e&&(l(e),e.on("reInit",l).on("select",l))},[e,l]),r.jsxs("div",{className:s.className,children:[r.jsxs("div",{className:"flex items-center",children:[r.jsx("h2",{className:"text-lg font-semibold",children:s.heading??"Games"}),r.jsx("div",{className:"grow"}),r.jsxs("div",{className:"flex items-center justify-center gap-xl",children:[r.jsxs(y,{href:s.viewAllUrl??"/games",className:"text-button-tertiary-fg flex gap-sm text-sm font-semibold",children:["See All",r.jsx(C.ChevronRightIcon,{className:"size-5 lg:hidden"})]}),r.jsxs("div",{className:"hidden lg:flex",children:[r.jsx(x.Button,{variant:"outline",colorScheme:"gray",className:"rounded-r-none border-r-0",onClick:h,disabled:o,"aria-label":"Previous",children:r.jsx(I.ArrowLeftIcon,{className:"size-5"})}),r.jsx(x.Button,{variant:"outline",colorScheme:"gray",className:"rounded-l-none",onClick:v,disabled:n&&!i.hasNextPage?!0:i.isFetchingNextPage,"aria-label":"Next",children:i.isFetchingNextPage?r.jsx(F.SpinnerIcon,{className:"size-5"}):r.jsx(M.ArrowRightIcon,{className:"size-5"})})]})]})]}),r.jsx("div",{ref:d,className:"relative mt-lg lg:overflow-hidden",children:r.jsx("div",{className:g.twMerge("grid auto-cols-[calc((100%-(0.375rem*2))/3)] grid-flow-col gap-sm lg:auto-cols-[calc((100%-(0.5rem*5))/6)] lg:gap-md",u===3?"grid-rows-3":u===2?"grid-rows-2":"grid-rows-1"),children:m.map(t=>r.jsx(z,{game:t},t.id))})})]})}function z({game:s}){const i=k.useSessionQuery().data,d=S.useFavoriteGamesQuery().data??[],e=G.useMarkGameAsFavoriteMutation(),o=P.useUnmarkGameAsFavoriteMutation(),c=d.some(n=>n.id===s.id);return r.jsxs(B.GameLaunchTrigger,{game:s,className:"relative block w-full shadow-sm",children:[(i==null?void 0:i.status)==="authenticated"&&r.jsx("div",{role:"button",onClick:n=>{n.preventDefault(),n.stopPropagation(),!e.isPending&&(o.isPending||(c?o.mutate(s.reference):e.mutate(s.reference)))},"aria-disabled":e.isPending||o.isPending,className:"rounded-xs absolute right-2 top-2 flex size-9 items-center justify-center bg-black/65 blur-[0.5px]",children:r.jsx(Q.Star01Icon,{className:g.twMerge("size-5",c?"fill-yellow-400 text-yellow-400":"text-white")})}),r.jsx(j,{src:s.image,alt:"",width:200,height:200,priority:!0,className:"aspect-square w-full rounded-t-md object-cover"}),r.jsx("span",{className:"bg-bg-tertiary text-text-primary-brand block w-full truncate rounded-b-md px-2 py-2.5 text-center text-xs font-semibold",children:s.name})]})}exports.Games__client=R;

package/dist/components/Games/Games.client.mjs

@@ -1,10 +1,10 @@
 "use client";
-import { jsxs as i, jsx as r } from "react/jsx-runtime";
-import y from "embla-carousel-react";
+import { jsxs as a, jsx as t } from "react/jsx-runtime";
+import k from "embla-carousel-react";
 import P from "next/image";
-import S from "next/link";
-import { useState as c, useCallback as a, useEffect as k } from "react";
-import { twMerge as b } from "tailwind-merge";
+import b from "next/link";
+import { useState as g, useCallback as u, useEffect as S } from "react";
+import { twMerge as x } from "tailwind-merge";
 import "@opexa/portal-sdk-core";
 import "@tanstack/react-query";
 import "tiny-invariant";
@@ -14,23 +14,30 @@ import "../../utils/parseDecimal.mjs";
 import "../../utils/getLocaleInfo.mjs";
 import "../../utils/getQueryClient.mjs";
 import "../../utils/isMobile.mjs";
+import "../../client/services/getSession.mjs";
+import { useSessionQuery as G } from "../../client/hooks/useSessionQuery.mjs";
 import "lodash-es";
 import "@opexa/portal-sdk-core/object-id";
-import { useGamesQuery as B } from "../../client/hooks/useGamesQuery.mjs";
+import { useFavoriteGamesQuery as I } from "../../client/hooks/useFavoriteGamesQuery.mjs";
+import { useGamesQuery as C } from "../../client/hooks/useGamesQuery.mjs";
 import "../../client/hooks/useGlobalStore.mjs";
 import "../../client/hooks/useInfiniteQueryHelper.mjs";
+import { useMarkGameAsFavoriteMutation as F } from "../../client/hooks/useMarkGameAsFavoriteMutation.mjs";
 import "usehooks-ts";
-import { ArrowLeftIcon as C } from "../../icons/ArrowLeftIcon.mjs";
-import { ArrowRightIcon as I } from "../../icons/ArrowRightIcon.mjs";
-import { ChevronRightIcon as R } from "../../icons/ChevronRightIcon.mjs";
+import { useUnmarkGameAsFavoriteMutation as Q } from "../../client/hooks/useUnmarkGameAsFavoriteMutation.mjs";
+import { ArrowLeftIcon as B } from "../../icons/ArrowLeftIcon.mjs";
+import { ArrowRightIcon as z } from "../../icons/ArrowRightIcon.mjs";
+import { ChevronRightIcon as M } from "../../icons/ChevronRightIcon.mjs";
 import { SpinnerIcon as j } from "../../icons/SpinnerIcon.mjs";
+import { Star01Icon as D } from "../../icons/Star01Icon.mjs";
 import "../../ui/AlertDialog/AlertDialog.mjs";
 import "../../ui/Avatar/Avatar.mjs";
 import "../../ui/Badge/Badge.mjs";
-import { Button as d } from "../../ui/Button/Button.mjs";
+import { Button as h } from "../../ui/Button/Button.mjs";
 import "../../ui/Checkbox/Checkbox.mjs";
 import "../../ui/Clipboard/Clipboard.mjs";
 import "../../ui/Collapsible/Collapsible.mjs";
+import "../../ui/Combobox/Combobox.mjs";
 import "../../ui/DatePicker/DatePicker.mjs";
 import "../../ui/Dialog/Dialog.mjs";
 import "../../ui/Drawer/Drawer.mjs";
@@ -47,13 +54,13 @@ import "../../ui/Select/Select.mjs";
 import "../../ui/Table/Table.mjs";
 import "../../ui/Tabs/Tabs.mjs";
 import "zustand/shallow";
-import { GameLaunchTrigger as z } from "../GameLaunch/GameLaunchTrigger.mjs";
-function Ce(s) {
-  var n;
-  const m = s.numOfRows ?? 1, o = B({
+import { GameLaunchTrigger as R } from "../GameLaunch/GameLaunchTrigger.mjs";
+function Oe(o) {
+  var p;
+  const m = o.numOfRows ?? 1, i = C({
     first: (m + 1) * 6,
-    filter: s.filter
-  }), p = ((n = o.data) == null ? void 0 : n.pages.map((t) => t.edges.map((v) => v.node)).flat()) ?? [], [f, e] = y({
+    filter: o.filter
+  }), f = ((p = i.data) == null ? void 0 : p.pages.map((r) => r.edges.map((y) => y.node)).flat()) ?? [], [d, e] = k({
     align: "start",
     slidesToScroll: 3,
     breakpoints: {
@@ -61,93 +68,111 @@ function Ce(s) {
         slidesToScroll: 6
       }
     }
-  }), [g, u] = c(!0), [h, x] = c(!0), N = a(
+  }), [n, l] = g(!0), [s, v] = g(!0), N = u(
     () => e == null ? void 0 : e.scrollPrev(),
     [e]
-  ), w = a(async () => {
-    !(e != null && e.canScrollNext()) && o.hasNextPage && (await o.fetchNextPage(), e == null || e.reInit(), await new Promise((t) => setTimeout(t, 1))), e == null || e.scrollNext();
-  }, [e, o]), l = a((t) => {
-    u(!(t != null && t.canScrollPrev())), x(!(t != null && t.canScrollNext()));
+  ), w = u(async () => {
+    !(e != null && e.canScrollNext()) && i.hasNextPage && (await i.fetchNextPage(), e == null || e.reInit(), await new Promise((r) => setTimeout(r, 1))), e == null || e.scrollNext();
+  }, [e, i]), c = u((r) => {
+    l(!(r != null && r.canScrollPrev())), v(!(r != null && r.canScrollNext()));
   }, []);
-  return k(() => {
-    e && (l(e), e.on("reInit", l).on("select", l));
-  }, [e, l]), /* @__PURE__ */ i("div", { className: s.className, children: [
-    /* @__PURE__ */ i("div", { className: "flex items-center", children: [
-      /* @__PURE__ */ r("h2", { className: "text-lg font-semibold", children: s.heading ?? "Games" }),
-      /* @__PURE__ */ r("div", { className: "grow" }),
-      /* @__PURE__ */ i("div", { className: "flex items-center justify-center gap-xl", children: [
-        /* @__PURE__ */ i(
-          S,
+  return S(() => {
+    e && (c(e), e.on("reInit", c).on("select", c));
+  }, [e, c]), /* @__PURE__ */ a("div", { className: o.className, children: [
+    /* @__PURE__ */ a("div", { className: "flex items-center", children: [
+      /* @__PURE__ */ t("h2", { className: "text-lg font-semibold", children: o.heading ?? "Games" }),
+      /* @__PURE__ */ t("div", { className: "grow" }),
+      /* @__PURE__ */ a("div", { className: "flex items-center justify-center gap-xl", children: [
+        /* @__PURE__ */ a(
+          b,
           {
-            href: s.viewAllUrl ?? "/games",
+            href: o.viewAllUrl ?? "/games",
             className: "text-button-tertiary-fg flex gap-sm text-sm font-semibold",
             children: [
               "See All",
-              /* @__PURE__ */ r(R, { className: "size-5 lg:hidden" })
+              /* @__PURE__ */ t(M, { className: "size-5 lg:hidden" })
             ]
           }
         ),
-        /* @__PURE__ */ i("div", { className: "hidden lg:flex", children: [
-          /* @__PURE__ */ r(
-            d,
+        /* @__PURE__ */ a("div", { className: "hidden lg:flex", children: [
+          /* @__PURE__ */ t(
+            h,
             {
               variant: "outline",
               colorScheme: "gray",
               className: "rounded-r-none border-r-0",
               onClick: N,
-              disabled: g,
+              disabled: n,
               "aria-label": "Previous",
-              children: /* @__PURE__ */ r(C, { className: "size-5" })
+              children: /* @__PURE__ */ t(B, { className: "size-5" })
             }
           ),
-          /* @__PURE__ */ r(
-            d,
+          /* @__PURE__ */ t(
+            h,
             {
               variant: "outline",
               colorScheme: "gray",
               className: "rounded-l-none",
               onClick: w,
-              disabled: h && !o.hasNextPage ? !0 : o.isFetchingNextPage,
+              disabled: s && !i.hasNextPage ? !0 : i.isFetchingNextPage,
               "aria-label": "Next",
-              children: o.isFetchingNextPage ? /* @__PURE__ */ r(j, { className: "size-5" }) : /* @__PURE__ */ r(I, { className: "size-5" })
+              children: i.isFetchingNextPage ? /* @__PURE__ */ t(j, { className: "size-5" }) : /* @__PURE__ */ t(z, { className: "size-5" })
             }
           )
         ] })
       ] })
     ] }),
-    /* @__PURE__ */ r("div", { ref: f, className: "relative mt-lg lg:overflow-hidden", children: /* @__PURE__ */ r(
+    /* @__PURE__ */ t("div", { ref: d, className: "relative mt-lg lg:overflow-hidden", children: /* @__PURE__ */ t(
       "div",
       {
-        className: b(
+        className: x(
           "grid auto-cols-[calc((100%-(0.375rem*2))/3)] grid-flow-col gap-sm lg:auto-cols-[calc((100%-(0.5rem*5))/6)] lg:gap-md",
           m === 3 ? "grid-rows-3" : m === 2 ? "grid-rows-2" : "grid-rows-1"
         ),
-        children: p.map((t) => /* @__PURE__ */ i(
-          z,
-          {
-            game: t,
-            className: "block w-full shadow-sm",
-            children: [
-              /* @__PURE__ */ r(
-                P,
-                {
-                  src: t.image,
-                  alt: "",
-                  width: 200,
-                  height: 200,
-                  priority: !0,
-                  className: "aspect-square w-full rounded-t-md object-cover"
-                }
-              ),
-              /* @__PURE__ */ r("span", { className: "bg-bg-tertiary text-text-primary-brand block w-full truncate rounded-b-md px-2 py-2.5 text-center text-xs font-semibold", children: t.name })
-            ]
-          },
-          t.id
-        ))
+        children: f.map((r) => /* @__PURE__ */ t(T, { game: r }, r.id))
       }
     ) })
   ] });
 }
+function T({ game: o }) {
+  const i = G().data, d = I().data ?? [], e = F(), n = Q(), l = d.some(
+    (s) => s.id === o.id
+  );
+  return /* @__PURE__ */ a(R, { game: o, className: "relative block w-full shadow-sm", children: [
+    (i == null ? void 0 : i.status) === "authenticated" && /* @__PURE__ */ t(
+      "div",
+      {
+        role: "button",
+        onClick: (s) => {
+          s.preventDefault(), s.stopPropagation(), !e.isPending && (n.isPending || (l ? n.mutate(o.reference) : e.mutate(o.reference)));
+        },
+        "aria-disabled": e.isPending || n.isPending,
+        className: "rounded-xs absolute right-2 top-2 flex size-9 items-center justify-center bg-black/65 blur-[0.5px]",
+        children: /* @__PURE__ */ t(
+          D,
+          {
+            className: x(
+              "size-5",
+              l ? "fill-yellow-400 text-yellow-400" : "text-white"
+            )
+          }
+        )
+      }
+    ),
+    /* @__PURE__ */ t(
+      P,
+      {
+        src: o.image,
+        alt: "",
+        width: 200,
+        height: 200,
+        priority: !0,
+        className: "aspect-square w-full rounded-t-md object-cover"
+      }
+    ),
+    /* @__PURE__ */ t("span", { className: "bg-bg-tertiary text-text-primary-brand block w-full truncate rounded-b-md px-2 py-2.5 text-center text-xs font-semibold", children: o.name })
+  ] });
+}
 export {
-  Ce as Games__client
+  Oe as Games__client
 };

package/dist/components/Games/Games.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime");require("@opexa/portal-sdk-core");require("../../constants/index.js");require("../../utils/capitalize.js");require("../../utils/parseDecimal.js");require("../../utils/getLocaleInfo.js");require("../../utils/getQueryClient.js");require("../../utils/isMobile.js");require("next/headers");const t=require("../../server/utils/prefetchGamesQuery.js"),u=require("./Games.client.js");async function s(e){const r=e.numOfRows??1;return await t.prefetchGamesQuery({first:(r+1)*6,filter:e.filter}),i.jsx(u.Games__client,{...e})}exports.Games=s;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime");require("@opexa/portal-sdk-core");require("../../constants/index.js");require("../../utils/capitalize.js");require("../../utils/parseDecimal.js");require("../../utils/getLocaleInfo.js");require("../../utils/getQueryClient.js");require("../../utils/isMobile.js");require("../../server/services/getSession.js");require("date-fns");require("next/headers");const u=require("../../server/utils/prefetchGamesQuery.js"),t=require("./Games.client.js");async function s(e){const r=e.numOfRows??1;return await u.prefetchGamesQuery({first:(r+1)*6,filter:e.filter}),i.jsx(t.Games__client,{...e})}exports.Games=s;

package/dist/components/Games/Games.mjs

@@ -6,10 +6,12 @@ import "../../utils/parseDecimal.mjs";
 import "../../utils/getLocaleInfo.mjs";
 import "../../utils/getQueryClient.mjs";
 import "../../utils/isMobile.mjs";
+import "../../server/services/getSession.mjs";
+import "date-fns";
 import "next/headers";
 import { prefetchGamesQuery as i } from "../../server/utils/prefetchGamesQuery.mjs";
 import { Games__client as o } from "./Games.client.mjs";
-async function x(t) {
+async function O(t) {
   const r = t.numOfRows ?? 1;
   return await i({
     first: (r + 1) * 6,
@@ -17,5 +19,5 @@ async function x(t) {
   }), /* @__PURE__ */ m(o, { ...t });
 }
 export {
-  x as Games
+  O as Games
 };

package/dist/components/GamesSearch/GamesSearch.d.ts

@@ -0,0 +1,6 @@
+import { ImageProps } from 'next/image';
+interface GamesSearchProps {
+    logo: ImageProps['src'];
+}
+export declare function GamesSearch(props: GamesSearchProps): import("react").JSX.Element;
+export {};

package/dist/components/GamesSearch/GamesSearch.js

@@ -0,0 +1 @@
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),j=require("@ark-ui/react"),c=require("next/image"),x=require("react"),b=require("zustand/shallow");require("@opexa/portal-sdk-core");require("@tanstack/react-query");require("tiny-invariant");require("../../constants/index.js");require("../../utils/capitalize.js");require("../../utils/parseDecimal.js");require("../../utils/getLocaleInfo.js");require("../../utils/getQueryClient.js");require("../../utils/isMobile.js");require("../../client/services/getSession.js");require("lodash-es");require("@opexa/portal-sdk-core/object-id");const f=require("../../client/hooks/useGamesQuery.js"),y=require("../../client/hooks/useGlobalStore.js");require("../../client/hooks/useInfiniteQueryHelper.js");require("usehooks-ts");const p=require("../../icons/SearchLgIcon.js"),g=require("../../icons/XIcon.js"),N=require("../../images/hacksaw-gaming.png.js");require("../../ui/AlertDialog/AlertDialog.js");require("../../ui/Avatar/Avatar.js");require("../../ui/Badge/Badge.js");const S=require("../../ui/Button/Button.js");require("../../ui/Checkbox/Checkbox.js");require("../../ui/Clipboard/Clipboard.js");require("../../ui/Collapsible/Collapsible.js");require("../../ui/Combobox/Combobox.js");require("../../ui/DatePicker/DatePicker.js");const t=require("../../ui/Dialog/Dialog.js");require("../../ui/Drawer/Drawer.js");const v=require("../../ui/Field/Field.js"),w=require("../../ui/IconButton/IconButton.js");require("../../ui/NumberInput/NumberInput.js");require("../../ui/PasswordInput/PasswordInput.js");require("../../ui/PinInput/PinInput.js");require("../../ui/Popover/Popover.js");const h=require("../../ui/Presence.js");require("../../ui/Progress/Progress.js");require("tailwind-merge");require("../../ui/SegmentGroup/SegmentGroup.js");require("../../ui/Select/Select.js");require("../../ui/Table/Table.js");require("../../ui/Tabs/Tabs.js");const C=require("../GameLaunch/GameLaunchTrigger.js");function G(a){var m;const l=y.useGlobalStore(b.useShallow(r=>({gamesSearch:r.gamesSearch}))),u=x.useRef(null),[s,d]=x.useState(""),i=f.useGamesQuery({first:18,search:s},{enabled:s.length>=3}),n=((m=i.data)==null?void 0:m.pages.map(r=>r.edges.map(q=>q.node)).flat())??[];return e.jsx(t.Root,{open:l.gamesSearch.open,onOpenChange:r=>l.gamesSearch.setOpen(r.open),lazyMount:!0,unmountOnExit:!0,children:e.jsxs(j.Portal,{children:[e.jsx(t.Backdrop,{}),e.jsx(t.Positioner,{children:e.jsxs(t.Content,{className:"bg-bg-primary lg:min-h-auto mx-auto min-h-full w-full pt-xl lg:mt-[132px] lg:max-w-[1136px] lg:bg-unset lg:pt-0",children:[e.jsx(t.Context,{children:r=>e.jsxs("div",{className:"flex items-center justify-between px-4 lg:hidden",children:[e.jsx(c,{src:a.logo,alt:"",width:200,height:40,className:"h-8 w-auto"}),e.jsx(w.IconButton,{size:"sm",colorScheme:"gray",onClick:()=>r.setOpen(!1),children:e.jsx(g.XIcon,{className:"text-text-quinary size-6"})})]})}),e.jsx("div",{className:"flex justify-end",children:e.jsx(t.Context,{children:r=>e.jsx("button",{type:"button",onClick:()=>r.setOpen(!1),className:"hidden size-9 items-center justify-center rounded-md bg-white/20 lg:flex",children:e.jsx(g.XIcon,{className:"size-5 text-white"})})})}),e.jsx("div",{className:"mt-2xl px-4 lg:mt-xl lg:px-0",children:e.jsxs("div",{className:"relative",children:[e.jsx(p.SearchLgIcon,{className:"text-text-quinary pointer-events-none absolute left-3.5 top-1/2 size-5 -translate-y-1/2"}),e.jsx(v.Input,{ref:u,type:"search",value:s,onChange:r=>{d(r.target.value)},className:"pl-10 pr-16",placeholder:"Search",autoComplete:"off"}),e.jsx(h.Presence,{present:s.length>0,asChild:!0,lazyMount:!0,children:e.jsx("button",{type:"button",className:"text-text-secondary-700 absolute right-3.5 top-1/2 -translate-y-1/2 font-semibold",onClick:()=>{var r;d(""),(r=u.current)==null||r.focus()},children:"Clear"})})]})}),e.jsx("div",{className:"lg:bg-bg-primary lg:border-border-primary mt-2xl p-xl pb-3xl lg:mt-2 lg:rounded-xl lg:border",children:s.length<=0?e.jsx(o,{message:"Search for your favorite game or provider."}):s.length>=1&&s.length<=2?e.jsx(o,{message:"Search requires at least 3 characters."}):e.jsxs(e.Fragment,{children:[n.length<=0&&e.jsx(o,{message:"No results found"}),n.length>0&&e.jsxs(e.Fragment,{children:[e.jsx("h2",{className:"text-lg font-semibold",children:"Providers"}),e.jsx("div",{className:"mb-3xl mt-3.5 grid grid-cols-3 gap-1.5 lg:grid-cols-9 lg:gap-3.5",children:e.jsx("div",{className:"bg-gray-800 flex h-14 w-full items-center rounded-md",children:e.jsx(c,{src:N,alt:"",width:100,height:50,className:"mx-auto h-auto w-full"})})}),e.jsx("h2",{className:"text-lg font-semibold",children:"Games"}),e.jsx("div",{className:"mt-3.5 grid grid-cols-3 gap-1.5 lg:grid-cols-9 lg:gap-3.5",children:n.map(r=>e.jsxs(C.GameLaunchTrigger,{game:r,className:"block w-full shadow-sm",onClick:()=>{l.gamesSearch.setOpen(!1)},children:[e.jsx(c,{src:r.image,alt:"",width:200,height:200,priority:!0,className:"aspect-square w-full rounded-t-md object-cover"}),e.jsx("span",{className:"bg-bg-tertiary text-text-primary-brand block w-full truncate rounded-b-md px-2 py-2.5 text-center text-xs font-semibold",children:r.name})]},r.id))}),e.jsx(h.Presence,{present:i.hasNextPage,children:e.jsx(S.Button,{variant:"outline",className:"mx-auto mt-12 w-fit",onClick:()=>i.fetchNextPage(),children:"Load More"})})]})]})})]})})]})})}function o({message:a}){return e.jsxs("div",{className:"py-lg",role:"alert","aria-live":"polite",children:[e.jsx("div",{className:"bg-bg-secondary shadow-xs border-border-primary mx-auto flex size-12 items-center justify-center rounded-lg border",children:e.jsx(p.SearchLgIcon,{className:"text-text-secondary-700 size-6"})}),e.jsx("p",{className:"text-text-secondary-700 mt-4 text-center",children:a})]})}exports.GamesSearch=G;

package/dist/components/GamesSearch/GamesSearch.mjs

@@ -0,0 +1,199 @@
+"use client";
+import { jsx as e, jsxs as r, Fragment as h } from "react/jsx-runtime";
+import { Portal as y } from "@ark-ui/react";
+import m from "next/image";
+import { useRef as N, useState as v } from "react";
+import { useShallow as w } from "zustand/shallow";
+import "@opexa/portal-sdk-core";
+import "@tanstack/react-query";
+import "tiny-invariant";
+import "../../constants/index.mjs";
+import "../../utils/capitalize.mjs";
+import "../../utils/parseDecimal.mjs";
+import "../../utils/getLocaleInfo.mjs";
+import "../../utils/getQueryClient.mjs";
+import "../../utils/isMobile.mjs";
+import "../../client/services/getSession.mjs";
+import "lodash-es";
+import "@opexa/portal-sdk-core/object-id";
+import { useGamesQuery as S } from "../../client/hooks/useGamesQuery.mjs";
+import { useGlobalStore as C } from "../../client/hooks/useGlobalStore.mjs";
+import "../../client/hooks/useInfiniteQueryHelper.mjs";
+import "usehooks-ts";
+import { SearchLgIcon as x } from "../../icons/SearchLgIcon.mjs";
+import { XIcon as g } from "../../icons/XIcon.mjs";
+import k from "../../images/hacksaw-gaming.png.mjs";
+import "../../ui/AlertDialog/AlertDialog.mjs";
+import "../../ui/Avatar/Avatar.mjs";
+import "../../ui/Badge/Badge.mjs";
+import { Button as z } from "../../ui/Button/Button.mjs";
+import "../../ui/Checkbox/Checkbox.mjs";
+import "../../ui/Clipboard/Clipboard.mjs";
+import "../../ui/Collapsible/Collapsible.mjs";
+import "../../ui/Combobox/Combobox.mjs";
+import "../../ui/DatePicker/DatePicker.mjs";
+import { Root as j, Backdrop as O, Positioner as P, Content as G, Context as u } from "../../ui/Dialog/Dialog.mjs";
+import "../../ui/Drawer/Drawer.mjs";
+import { Input as I } from "../../ui/Field/Field.mjs";
+import { IconButton as q } from "../../ui/IconButton/IconButton.mjs";
+import "../../ui/NumberInput/NumberInput.mjs";
+import "../../ui/PasswordInput/PasswordInput.mjs";
+import "../../ui/PinInput/PinInput.mjs";
+import "../../ui/Popover/Popover.mjs";
+import { Presence as f } from "../../ui/Presence.mjs";
+import "../../ui/Progress/Progress.mjs";
+import "tailwind-merge";
+import "../../ui/SegmentGroup/SegmentGroup.mjs";
+import "../../ui/Select/Select.mjs";
+import "../../ui/Table/Table.mjs";
+import "../../ui/Tabs/Tabs.mjs";
+import { GameLaunchTrigger as B } from "../GameLaunch/GameLaunchTrigger.mjs";
+function Pe(a) {
+  var d;
+  const l = C(
+    w((t) => ({
+      gamesSearch: t.gamesSearch
+    }))
+  ), c = N(null), [o, p] = v(""), i = S(
+    {
+      first: 18,
+      search: o
+    },
+    {
+      enabled: o.length >= 3
+    }
+  ), s = ((d = i.data) == null ? void 0 : d.pages.map((t) => t.edges.map((b) => b.node)).flat()) ?? [];
+  return /* @__PURE__ */ e(
+    j,
+    {
+      open: l.gamesSearch.open,
+      onOpenChange: (t) => l.gamesSearch.setOpen(t.open),
+      lazyMount: !0,
+      unmountOnExit: !0,
+      children: /* @__PURE__ */ r(y, { children: [
+        /* @__PURE__ */ e(O, {}),
+        /* @__PURE__ */ e(P, { children: /* @__PURE__ */ r(G, { className: "bg-bg-primary lg:min-h-auto mx-auto min-h-full w-full pt-xl lg:mt-[132px] lg:max-w-[1136px] lg:bg-unset lg:pt-0", children: [
+          /* @__PURE__ */ e(u, { children: (t) => /* @__PURE__ */ r("div", { className: "flex items-center justify-between px-4 lg:hidden", children: [
+            /* @__PURE__ */ e(
+              m,
+              {
+                src: a.logo,
+                alt: "",
+                width: 200,
+                height: 40,
+                className: "h-8 w-auto"
+              }
+            ),
+            /* @__PURE__ */ e(
+              q,
+              {
+                size: "sm",
+                colorScheme: "gray",
+                onClick: () => t.setOpen(!1),
+                children: /* @__PURE__ */ e(g, { className: "text-text-quinary size-6" })
+              }
+            )
+          ] }) }),
+          /* @__PURE__ */ e("div", { className: "flex justify-end", children: /* @__PURE__ */ e(u, { children: (t) => /* @__PURE__ */ e(
+            "button",
+            {
+              type: "button",
+              onClick: () => t.setOpen(!1),
+              className: "hidden size-9 items-center justify-center rounded-md bg-white/20 lg:flex",
+              children: /* @__PURE__ */ e(g, { className: "size-5 text-white" })
+            }
+          ) }) }),
+          /* @__PURE__ */ e("div", { className: "mt-2xl px-4 lg:mt-xl lg:px-0", children: /* @__PURE__ */ r("div", { className: "relative", children: [
+            /* @__PURE__ */ e(x, { className: "text-text-quinary pointer-events-none absolute left-3.5 top-1/2 size-5 -translate-y-1/2" }),
+            /* @__PURE__ */ e(
+              I,
+              {
+                ref: c,
+                type: "search",
+                value: o,
+                onChange: (t) => {
+                  p(t.target.value);
+                },
+                className: "pl-10 pr-16",
+                placeholder: "Search",
+                autoComplete: "off"
+              }
+            ),
+            /* @__PURE__ */ e(f, { present: o.length > 0, asChild: !0, lazyMount: !0, children: /* @__PURE__ */ e(
+              "button",
+              {
+                type: "button",
+                className: "text-text-secondary-700 absolute right-3.5 top-1/2 -translate-y-1/2 font-semibold",
+                onClick: () => {
+                  var t;
+                  p(""), (t = c.current) == null || t.focus();
+                },
+                children: "Clear"
+              }
+            ) })
+          ] }) }),
+          /* @__PURE__ */ e("div", { className: "lg:bg-bg-primary lg:border-border-primary mt-2xl p-xl pb-3xl lg:mt-2 lg:rounded-xl lg:border", children: o.length <= 0 ? /* @__PURE__ */ e(n, { message: "Search for your favorite game or provider." }) : o.length >= 1 && o.length <= 2 ? /* @__PURE__ */ e(n, { message: "Search requires at least 3 characters." }) : /* @__PURE__ */ r(h, { children: [
+            s.length <= 0 && /* @__PURE__ */ e(n, { message: "No results found" }),
+            s.length > 0 && /* @__PURE__ */ r(h, { children: [
+              /* @__PURE__ */ e("h2", { className: "text-lg font-semibold", children: "Providers" }),
+              /* @__PURE__ */ e("div", { className: "mb-3xl mt-3.5 grid grid-cols-3 gap-1.5 lg:grid-cols-9 lg:gap-3.5", children: /* @__PURE__ */ e("div", { className: "bg-gray-800 flex h-14 w-full items-center rounded-md", children: /* @__PURE__ */ e(
+                m,
+                {
+                  src: k,
+                  alt: "",
+                  width: 100,
+                  height: 50,
+                  className: "mx-auto h-auto w-full"
+                }
+              ) }) }),
+              /* @__PURE__ */ e("h2", { className: "text-lg font-semibold", children: "Games" }),
+              /* @__PURE__ */ e("div", { className: "mt-3.5 grid grid-cols-3 gap-1.5 lg:grid-cols-9 lg:gap-3.5", children: s.map((t) => /* @__PURE__ */ r(
+                B,
+                {
+                  game: t,
+                  className: "block w-full shadow-sm",
+                  onClick: () => {
+                    l.gamesSearch.setOpen(!1);
+                  },
+                  children: [
+                    /* @__PURE__ */ e(
+                      m,
+                      {
+                        src: t.image,
+                        alt: "",
+                        width: 200,
+                        height: 200,
+                        priority: !0,
+                        className: "aspect-square w-full rounded-t-md object-cover"
+                      }
+                    ),
+                    /* @__PURE__ */ e("span", { className: "bg-bg-tertiary text-text-primary-brand block w-full truncate rounded-b-md px-2 py-2.5 text-center text-xs font-semibold", children: t.name })
+                  ]
+                },
+                t.id
+              )) }),
+              /* @__PURE__ */ e(f, { present: i.hasNextPage, children: /* @__PURE__ */ e(
+                z,
+                {
+                  variant: "outline",
+                  className: "mx-auto mt-12 w-fit",
+                  onClick: () => i.fetchNextPage(),
+                  children: "Load More"
+                }
+              ) })
+            ] })
+          ] }) })
+        ] }) })
+      ] })
+    }
+  );
+}
+function n({ message: a }) {
+  return /* @__PURE__ */ r("div", { className: "py-lg", role: "alert", "aria-live": "polite", children: [
+    /* @__PURE__ */ e("div", { className: "bg-bg-secondary shadow-xs border-border-primary mx-auto flex size-12 items-center justify-center rounded-lg border", children: /* @__PURE__ */ e(x, { className: "text-text-secondary-700 size-6" }) }),
+    /* @__PURE__ */ e("p", { className: "text-text-secondary-700 mt-4 text-center", children: a })
+  ] });
+}
+export {
+  Pe as GamesSearch
+};

package/dist/components/GamesSearch/GamesSearchTrigger.d.ts

@@ -0,0 +1,4 @@
+import { ComponentPropsWithRef } from 'react';
+export interface GamesSearchTriggerProps extends ComponentPropsWithRef<'button'> {
+}
+export declare function GamesSearchTrigger({ children, ...props }: GamesSearchTriggerProps): import("react").JSX.Element;

package/dist/components/GamesSearch/GamesSearchTrigger.js

@@ -0,0 +1 @@
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),u=require("@ark-ui/react"),a=require("zustand/shallow");require("@opexa/portal-sdk-core");require("@tanstack/react-query");require("tiny-invariant");require("../../constants/index.js");require("../../utils/capitalize.js");require("../../utils/parseDecimal.js");require("../../utils/getLocaleInfo.js");require("../../utils/getQueryClient.js");require("../../utils/isMobile.js");require("../../client/services/getSession.js");require("react");require("lodash-es");require("@opexa/portal-sdk-core/object-id");const c=require("../../client/hooks/useGlobalStore.js");require("../../client/hooks/useInfiniteQueryHelper.js");require("usehooks-ts");const o=require("../../icons/SearchLgIcon.js");function n({children:t,...i}){const r=c.useGlobalStore(a.useShallow(s=>({gamesSearch:s.gamesSearch})));return e.jsx(u.ark.button,{type:"button",onClick:()=>{r.gamesSearch.setOpen(!0)},"data-state":r.gamesSearch.open?"open":"closed",...i,asChild:!0,children:t??e.jsxs("button",{className:"bg-bg-primary text-text-secondary-700 flex size-10 items-center gap-lg rounded-sm px-lg",children:[e.jsx(o.SearchLgIcon,{className:"text-text-quinary size-6"}),"Search"]})})}exports.GamesSearchTrigger=n;

package/dist/components/GamesSearch/GamesSearchTrigger.mjs

@@ -0,0 +1,50 @@
+"use client";
+import { jsx as t, jsxs as i } from "react/jsx-runtime";
+import { ark as a } from "@ark-ui/react";
+import { useShallow as p } from "zustand/shallow";
+import "@opexa/portal-sdk-core";
+import "@tanstack/react-query";
+import "tiny-invariant";
+import "../../constants/index.mjs";
+import "../../utils/capitalize.mjs";
+import "../../utils/parseDecimal.mjs";
+import "../../utils/getLocaleInfo.mjs";
+import "../../utils/getQueryClient.mjs";
+import "../../utils/isMobile.mjs";
+import "../../client/services/getSession.mjs";
+import "react";
+import "lodash-es";
+import "@opexa/portal-sdk-core/object-id";
+import { useGlobalStore as s } from "../../client/hooks/useGlobalStore.mjs";
+import "../../client/hooks/useInfiniteQueryHelper.mjs";
+import "usehooks-ts";
+import { SearchLgIcon as c } from "../../icons/SearchLgIcon.mjs";
+function L({
+  children: e,
+  ...o
+}) {
+  const r = s(
+    p((m) => ({
+      gamesSearch: m.gamesSearch
+    }))
+  );
+  return /* @__PURE__ */ t(
+    a.button,
+    {
+      type: "button",
+      onClick: () => {
+        r.gamesSearch.setOpen(!0);
+      },
+      "data-state": r.gamesSearch.open ? "open" : "closed",
+      ...o,
+      asChild: !0,
+      children: e ?? /* @__PURE__ */ i("button", { className: "bg-bg-primary text-text-secondary-700 flex size-10 items-center gap-lg rounded-sm px-lg", children: [
+        /* @__PURE__ */ t(c, { className: "text-text-quinary size-6" }),
+        "Search"
+      ] })
+    }
+  );
+}
+export {
+  L as GamesSearchTrigger
+};

package/dist/components/GamesSearch/index.d.ts

@@ -0,0 +1,2 @@
+export * from './GamesSearch';
+export * from './GamesSearchTrigger';

package/dist/components/InfiniteScroll.d.ts

@@ -0,0 +1,10 @@
+import { ReactNode } from 'react';
+export interface InfiniteScrollProps {
+    loader?: ReactNode;
+    hasMore?: boolean;
+    loadMore: () => Promise<void> | void;
+    children?: ReactNode;
+    style?: React.CSSProperties;
+    className?: string;
+}
+export declare function InfiniteScroll(props: InfiniteScrollProps): import("react").JSX.Element;

package/dist/components/InfiniteScroll.js

@@ -0,0 +1 @@
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),r=require("react"),s=require("usehooks-ts");function d(e){const{value:a,setValue:l}=s.useBoolean(!1),o=e.loader??null,n=e.hasMore??!1,i=s.useDebounceCallback(async()=>{a||n&&(l(!0),await e.loadMore(),l(!1))},300),[c]=s.useIntersectionObserver({onChange(u){u&&i()}});return t.jsxs(r.Fragment,{children:[e.children,t.jsx("div",{ref:c,role:"presentation",style:e.style,className:e.className,hidden:!n,children:!!n&&t.jsx(r.Fragment,{children:o})})]})}exports.InfiniteScroll=d;

package/dist/components/InfiniteScroll.mjs

@@ -0,0 +1,30 @@
+"use client";
+import { jsxs as d, jsx as r } from "react/jsx-runtime";
+import { Fragment as a } from "react";
+import { useBoolean as u, useDebounceCallback as f, useIntersectionObserver as m } from "usehooks-ts";
+function b(e) {
+  const { value: o, setValue: l } = u(!1), t = e.loader ?? null, n = e.hasMore ?? !1, s = f(async () => {
+    o || n && (l(!0), await e.loadMore(), l(!1));
+  }, 300), [i] = m({
+    onChange(c) {
+      c && s();
+    }
+  });
+  return /* @__PURE__ */ d(a, { children: [
+    e.children,
+    /* @__PURE__ */ r(
+      "div",
+      {
+        ref: i,
+        role: "presentation",
+        style: e.style,
+        className: e.className,
+        hidden: !n,
+        children: !!n && /* @__PURE__ */ r(a, { children: t })
+      }
+    )
+  ] });
+}
+export {
+  b as InfiniteScroll
+};