@opexa/portal-components 0.0.565 → 0.0.566

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,3 +1,5 @@
1
- import type { ResponsibleGamingProps } from './ResponsibleGaming.lazy';
2
- export declare function ResponsibleGaming(props: ResponsibleGamingProps): import("react/jsx-runtime").JSX.Element | undefined;
3
- export type { ResponsibleGamingProps };
1
+ import type { ResponsibleGamingProps as LazyProps } from './ResponsibleGaming.lazy';
2
+ export type ResponsibleGamingProps = LazyProps & {
3
+ version?: '1' | '2';
4
+ };
5
+ export declare function ResponsibleGaming({ version, ...props }: ResponsibleGamingProps): import("react/jsx-runtime").JSX.Element | null;
@@ -3,12 +3,21 @@ import { jsx as _jsx } from "react/jsx-runtime";
3
3
  import dynamic from 'next/dynamic';
4
4
  import { useShallow } from 'zustand/shallow';
5
5
  import { useGlobalStore } from '../../client/hooks/useGlobalStore.js';
6
- const Component = dynamic(() => import('./ResponsibleGaming.lazy.js').then((m) => m.ResponsibleGaming), {
6
+ const V1 = dynamic(() => import('./ResponsibleGaming.lazy.js').then((m) => m.ResponsibleGaming), {
7
7
  ssr: false,
8
8
  loading: () => null,
9
9
  });
10
- export function ResponsibleGaming(props) {
10
+ const V2 = dynamic(() => import('./ResponsibleGamingV2.lazy.js').then((m) => m.ResponsibleGamingV2), {
11
+ ssr: false,
12
+ loading: () => null,
13
+ });
14
+ export function ResponsibleGaming({ version = '1', ...props }) {
11
15
  const touched = useGlobalStore(useShallow((ctx) => ctx.responsibleGaming['~touched']));
12
- if (touched)
13
- return _jsx(Component, { ...props });
16
+ if (!touched) {
17
+ return null;
18
+ }
19
+ if (version === '2') {
20
+ return _jsx(V2, { ...props });
21
+ }
22
+ return _jsx(V1, { ...props });
14
23
  }
@@ -1,5 +1,5 @@
1
1
  import { type ImageProps } from 'next/image';
2
- import { type ReactNode } from 'react';
2
+ import type { ReactNode } from 'react';
3
3
  export interface ResponsibleGamingProps {
4
4
  logo: ImageProps['src'];
5
5
  content: string | ReactNode;
@@ -1,18 +1,14 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import Image, {} from 'next/image';
3
- import { useRef } from 'react';
4
3
  import { twMerge } from 'tailwind-merge';
5
4
  import { useShallow } from 'zustand/shallow';
6
5
  import { useGlobalStore } from '../../client/hooks/useGlobalStore.js';
7
- import { ScrollToBottomIcon } from '../../icons/ScrollToBottomIcon.js';
8
- import decorativebackground from '../../images/decorative-patern.png';
9
6
  import pagcorLogo from '../../images/pagcor.png';
10
7
  import responsibleGamingLogo from '../../images/responsible-gaming.png';
11
8
  import { Button } from '../../ui/Button/index.js';
12
9
  import { Dialog } from '../../ui/Dialog/index.js';
13
10
  import { Portal } from '../../ui/Portal/index.js';
14
11
  export function ResponsibleGaming(props) {
15
- const scrollableContentRef = useRef(null);
16
12
  const globalStore = useGlobalStore(useShallow((ctx) => ({
17
13
  signIn: ctx.signIn,
18
14
  signUp: ctx.signUp,
@@ -34,14 +30,7 @@ export function ResponsibleGaming(props) {
34
30
  globalStore.disclaimer.setOpen(true);
35
31
  }
36
32
  globalStore.responsibleGaming.setNext(null);
37
- }, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, { className: "z-popover" }), _jsx(Dialog.Positioner, { className: "z-popover", children: _jsxs(Dialog.Content, { className: twMerge('relative flex h-full w-full flex-col items-start overflow-y-auto p-3xl lg:mx-auto lg:h-auto lg:max-h-[90vh] lg:w-[650px]', 'scrollbar:h-2 scrollbar:w-2 scrollbar-thumb:rounded-full scrollbar-thumb:bg-bg-quaternary scrollbar-track:bg-transparent'), children: [_jsx(Image, { src: decorativebackground, alt: "", width: 200, height: 200, className: "absolute top-0 left-0" }), _jsx(Image, { src: props.logo, alt: "", width: 250, height: 150, className: "h-auto w-[7.5rem]", draggable: false }), _jsxs("div", { className: "relative w-full grow", children: [_jsx(Dialog.Title, { className: "mt-3xl text-center font-semibold text-lg", children: "Responsible Gaming Guidelines" }), _jsxs("div", { ref: scrollableContentRef, className: "mt-xs scrollbar:h-2 max-h-96 scrollbar:w-2 overflow-y-auto rounded-md scrollbar-thumb:rounded-full bg-[#021C25] p-4", children: [_jsxs("div", { className: "flex items-center justify-center gap-3xl", children: [_jsx(Image, { src: pagcorLogo, alt: "", height: 75, width: 88, className: "h-[5.5rem] w-auto shrink-0", draggable: false }), _jsx(Image, { src: props.responsibleGamingLogo ?? responsibleGamingLogo, alt: "", height: 62, width: 186, className: "h-[3.875rem] w-auto shrink-0", draggable: false })] }), _jsx(Dialog.Description, { className: "text-sm leading-2xl", children: props.content }), _jsx(Dialog.Context, { children: (api) => (_jsx("div", { className: "mt-3 flex items-center justify-center gap-x-sm", children: _jsx("div", { className: "w-[80%]", children: _jsx(Button, { type: "button", className: "flex-1 py-2.5", onClick: () => {
38
- api.setOpen(false);
39
- }, children: "I Agree" }) }) })) })] })] }), _jsx(Button, { type: "button", className: 'absolute right-9 bottom-10 w-fit flex-1 rounded-lg bg-bg-active py-2.5', onClick: () => {
40
- if (scrollableContentRef.current) {
41
- scrollableContentRef.current.scrollTo({
42
- top: scrollableContentRef.current.scrollHeight,
43
- behavior: 'smooth',
44
- });
45
- }
46
- }, children: _jsx(ScrollToBottomIcon, {}) })] }) })] }) }));
33
+ }, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, { className: "z-popover" }), _jsx(Dialog.Positioner, { className: "z-popover", children: _jsxs(Dialog.Content, { className: twMerge('flex h-full w-full flex-col items-start overflow-y-auto p-3xl lg:mx-auto lg:h-auto lg:max-h-[80vh] lg:w-[400px]', 'scrollbar:h-2 scrollbar:w-2 scrollbar-thumb:rounded-full scrollbar-thumb:bg-bg-quaternary scrollbar-track:bg-transparent'), children: [_jsx(Image, { src: props.logo, alt: "", width: 200, height: 100, className: "mx-auto h-auto w-[7.5rem]", draggable: false }), _jsxs("div", { className: "w-full grow", children: [_jsx(Dialog.Title, { className: "mt-3xl text-center font-semibold text-brand-400 text-lg", children: "Responsible Gaming" }), _jsx(Dialog.Description, { className: "mt-xs text-sm leading-2xl", children: props.content }), _jsxs("div", { className: "mt-5 flex items-center justify-center gap-3xl", children: [_jsx(Image, { src: pagcorLogo, alt: "", height: 75, width: 88, className: "h-[5.5rem] w-auto shrink-0", draggable: false }), _jsx(Image, { src: props.responsibleGamingLogo ?? responsibleGamingLogo, alt: "", height: 62, width: 186, className: "h-[3.875rem] w-auto shrink-0", draggable: false })] })] }), _jsx(Dialog.Context, { children: (api) => (_jsx(Button, { type: "button", className: "mt-3 py-2.5", onClick: () => {
34
+ api.setOpen(false);
35
+ }, children: "I Agree" })) })] }) })] }) }));
47
36
  }
@@ -0,0 +1,8 @@
1
+ import { type ImageProps } from 'next/image';
2
+ import { type ReactNode } from 'react';
3
+ export interface ResponsibleGamingV2Props {
4
+ logo: ImageProps['src'];
5
+ content: string | ReactNode;
6
+ responsibleGamingLogo?: ImageProps['src'];
7
+ }
8
+ export declare function ResponsibleGamingV2(props: ResponsibleGamingV2Props): import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,47 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import Image, {} from 'next/image';
3
+ import { useRef } from 'react';
4
+ import { twMerge } from 'tailwind-merge';
5
+ import { useShallow } from 'zustand/shallow';
6
+ import { useGlobalStore } from '../../client/hooks/useGlobalStore.js';
7
+ import { ScrollToBottomIcon } from '../../icons/ScrollToBottomIcon.js';
8
+ import decorativebackground from '../../images/decorative-patern.png';
9
+ import pagcorLogo from '../../images/pagcor.png';
10
+ import responsibleGamingLogo from '../../images/responsible-gaming.png';
11
+ import { Button } from '../../ui/Button/index.js';
12
+ import { Dialog } from '../../ui/Dialog/index.js';
13
+ import { Portal } from '../../ui/Portal/index.js';
14
+ export function ResponsibleGamingV2(props) {
15
+ const scrollableContentRef = useRef(null);
16
+ const globalStore = useGlobalStore(useShallow((ctx) => ({
17
+ signIn: ctx.signIn,
18
+ signUp: ctx.signUp,
19
+ disclaimer: ctx.disclaimer,
20
+ responsibleGaming: ctx.responsibleGaming,
21
+ })));
22
+ return (_jsx(Dialog.Root, { open: globalStore.responsibleGaming.open, onOpenChange: (details) => {
23
+ globalStore.responsibleGaming.setOpen(details.open);
24
+ if (!details.open)
25
+ globalStore.responsibleGaming.setAccepted(true);
26
+ }, lazyMount: true, unmountOnExit: true, closeOnEscape: false, closeOnInteractOutside: false, onExitComplete: () => {
27
+ if (globalStore.responsibleGaming.next === 'SIGN_IN') {
28
+ globalStore.signIn.setOpen(true);
29
+ }
30
+ if (globalStore.responsibleGaming.next === 'SIGN_UP') {
31
+ globalStore.signUp.setOpen(true);
32
+ }
33
+ if (globalStore.responsibleGaming.next === 'DISCLAIMER') {
34
+ globalStore.disclaimer.setOpen(true);
35
+ }
36
+ globalStore.responsibleGaming.setNext(null);
37
+ }, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, { className: "z-popover" }), _jsx(Dialog.Positioner, { className: "z-popover", children: _jsxs(Dialog.Content, { className: twMerge('relative flex h-full w-full flex-col items-start overflow-y-auto p-3xl lg:mx-auto lg:h-auto lg:max-h-[90vh] lg:w-[650px]', 'scrollbar:h-2 scrollbar:w-2 scrollbar-thumb:rounded-full scrollbar-thumb:bg-bg-quaternary scrollbar-track:bg-transparent'), children: [_jsx(Image, { src: decorativebackground, alt: "", width: 200, height: 200, className: "absolute top-0 left-0" }), _jsx(Image, { src: props.logo, alt: "", width: 250, height: 150, className: "h-auto w-[7.5rem]", draggable: false }), _jsxs("div", { className: "relative w-full grow", children: [_jsx(Dialog.Title, { className: "mt-3xl text-center font-semibold text-lg", children: "Responsible Gaming Guidelines" }), _jsxs("div", { ref: scrollableContentRef, className: "mt-xs scrollbar:h-2 max-h-96 scrollbar:w-2 overflow-y-auto rounded-md scrollbar-thumb:rounded-full bg-[#021C25] p-4", children: [_jsxs("div", { className: "flex items-center justify-center gap-3xl", children: [_jsx(Image, { src: pagcorLogo, alt: "", height: 75, width: 88, className: "h-[5.5rem] w-auto shrink-0", draggable: false }), _jsx(Image, { src: props.responsibleGamingLogo ?? responsibleGamingLogo, alt: "", height: 62, width: 186, className: "h-[3.875rem] w-auto shrink-0", draggable: false })] }), _jsx(Dialog.Description, { className: "text-sm leading-2xl", children: props.content }), _jsx(Dialog.Context, { children: (api) => (_jsx("div", { className: "mt-3 flex items-center justify-center gap-x-sm", children: _jsx("div", { className: "w-[80%]", children: _jsx(Button, { type: "button", className: "flex-1 py-2.5", onClick: () => {
38
+ api.setOpen(false);
39
+ }, children: "I Agree" }) }) })) })] })] }), _jsx(Button, { type: "button", className: "absolute right-9 bottom-10 w-fit flex-1 rounded-lg bg-bg-active py-2.5", onClick: () => {
40
+ if (scrollableContentRef.current) {
41
+ scrollableContentRef.current.scrollTo({
42
+ top: scrollableContentRef.current.scrollHeight,
43
+ behavior: 'smooth',
44
+ });
45
+ }
46
+ }, children: _jsx(ScrollToBottomIcon, {}) })] }) })] }) }));
47
+ }
@@ -1,3 +1,5 @@
1
- import type { TermsOfUseProps } from './TermsOfUse.lazy';
2
- export declare function TermsOfUse(props: TermsOfUseProps): import("react/jsx-runtime").JSX.Element | undefined;
3
- export type { TermsOfUseProps };
1
+ import type { TermsOfUseProps as LazyProps } from './TermsOfUse.lazy';
2
+ export type TermsOfUseProps = LazyProps & {
3
+ version?: '1' | '2';
4
+ };
5
+ export declare function TermsOfUse({ version, ...props }: TermsOfUseProps): import("react/jsx-runtime").JSX.Element | null;
@@ -3,12 +3,21 @@ import { jsx as _jsx } from "react/jsx-runtime";
3
3
  import dynamic from 'next/dynamic';
4
4
  import { useShallow } from 'zustand/shallow';
5
5
  import { useGlobalStore } from '../../client/hooks/useGlobalStore.js';
6
- const Component = dynamic(() => import('./TermsOfUse.lazy.js').then((m) => m.TermsOfUse), {
6
+ const V1 = dynamic(() => import('./TermsOfUse.lazy.js').then((m) => m.TermsOfUse), {
7
7
  ssr: false,
8
8
  loading: () => null,
9
9
  });
10
- export function TermsOfUse(props) {
10
+ const V2 = dynamic(() => import('./TermsOfUseV2.lazy.js').then((m) => m.TermsOfUseV2), {
11
+ ssr: false,
12
+ loading: () => null,
13
+ });
14
+ export function TermsOfUse({ version = '1', ...props }) {
11
15
  const touched = useGlobalStore(useShallow((ctx) => ctx.termsOfUse['~touched']));
12
- if (touched)
13
- return _jsx(Component, { ...props });
16
+ if (!touched) {
17
+ return null;
18
+ }
19
+ if (version === '2') {
20
+ return _jsx(V2, { ...props });
21
+ }
22
+ return _jsx(V1, { ...props });
14
23
  }
@@ -1,5 +1,5 @@
1
1
  import { type ImageProps } from 'next/image';
2
- import { type ReactNode } from 'react';
2
+ import type { ReactNode } from 'react';
3
3
  export interface TermsOfUseProps {
4
4
  logo: ImageProps['src'];
5
5
  content: string | ReactNode;
@@ -1,18 +1,14 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import Image, {} from 'next/image';
3
- import { useRef } from 'react';
4
3
  import { twMerge } from 'tailwind-merge';
5
4
  import { useShallow } from 'zustand/shallow';
6
5
  import { useGlobalStore } from '../../client/hooks/useGlobalStore.js';
7
- import { ScrollToBottomIcon } from '../../icons/ScrollToBottomIcon.js';
8
- import decorativebackground from '../../images/decorative-patern.png';
9
6
  import pagcorLogo from '../../images/pagcor.png';
10
7
  import responsibleGamingLogo from '../../images/responsible-gaming.png';
11
8
  import { Button } from '../../ui/Button/index.js';
12
9
  import { Dialog } from '../../ui/Dialog/index.js';
13
10
  import { Portal } from '../../ui/Portal/index.js';
14
11
  export function TermsOfUse({ logo, siteName, content, ...props }) {
15
- const scrollableContentRef = useRef(null);
16
12
  const globalStore = useGlobalStore(useShallow((ctx) => ({
17
13
  signIn: ctx.signIn,
18
14
  signUp: ctx.signUp,
@@ -34,14 +30,7 @@ export function TermsOfUse({ logo, siteName, content, ...props }) {
34
30
  globalStore.disclaimer.setOpen(true);
35
31
  }
36
32
  globalStore.termsOfUse.setNext(null);
37
- }, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, { className: "z-popover" }), _jsx(Dialog.Positioner, { className: "z-popover", children: _jsxs(Dialog.Content, { className: twMerge('relative flex h-full w-full flex-col items-start overflow-y-auto p-3xl lg:mx-auto lg:h-auto lg:max-h-[90vh] lg:w-[650px]', 'scrollbar:h-2 scrollbar:w-2 scrollbar-thumb:rounded-full scrollbar-thumb:bg-bg-quaternary scrollbar-track:bg-transparent'), children: [_jsx(Image, { src: decorativebackground, alt: "", width: 200, height: 200, className: "absolute top-0 left-0" }), _jsx(Image, { src: logo, alt: "", width: 250, height: 150, className: "h-auto w-[7.5rem]", draggable: false }), _jsxs("div", { className: "w-full grow", children: [_jsxs(Dialog.Title, { className: "mt-3xl text-center font-semibold text-brand-400 text-lg", children: [siteName, " Terms of Use"] }), _jsxs("div", { ref: scrollableContentRef, className: "mt-xs scrollbar:h-2 max-h-96 scrollbar:w-2 overflow-y-auto rounded-md scrollbar-thumb:rounded-full bg-[#021C25] p-4", children: [_jsxs("div", { className: "mt-5 flex items-center justify-center gap-3xl", children: [_jsx(Image, { src: pagcorLogo, alt: "", height: 75, width: 88, className: "h-[5.5rem] w-auto shrink-0", draggable: false }), _jsx(Image, { src: props.responsibleGamingLogo ?? responsibleGamingLogo, alt: "", height: 62, width: 186, className: "h-[3.875rem] w-auto shrink-0", draggable: false })] }), _jsx(Dialog.Description, { className: "mt-xs text-sm leading-2xl", children: content }), _jsx(Dialog.Context, { children: (api) => (_jsx("div", { className: "mt-3 flex items-center justify-center gap-x-sm", children: _jsx("div", { className: "w-[80%]", children: _jsx(Button, { type: "button", className: "flex-1 py-2.5", onClick: () => {
38
- api.setOpen(false);
39
- }, children: "I Agree" }) }) })) })] })] }), _jsx(Button, { type: "button", className: "absolute right-9 bottom-10 w-fit flex-1 rounded-lg bg-bg-active py-2.5", onClick: () => {
40
- if (scrollableContentRef.current) {
41
- scrollableContentRef.current.scrollTo({
42
- top: scrollableContentRef.current.scrollHeight,
43
- behavior: 'smooth',
44
- });
45
- }
46
- }, children: _jsx(ScrollToBottomIcon, {}) })] }) })] }) }));
33
+ }, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, { className: "z-popover" }), _jsx(Dialog.Positioner, { className: "z-popover", children: _jsxs(Dialog.Content, { className: twMerge('flex h-full w-full flex-col items-start overflow-y-auto p-3xl lg:mx-auto lg:h-auto lg:max-h-[80vh] lg:w-[400px]', 'scrollbar:h-2 scrollbar:w-2 scrollbar-thumb:rounded-full scrollbar-thumb:bg-bg-quaternary scrollbar-track:bg-transparent'), children: [_jsx(Image, { src: logo, alt: "", width: 200, height: 100, className: "mx-auto h-auto w-[120px]", draggable: false }), _jsxs("div", { className: "w-full grow", children: [_jsxs(Dialog.Title, { className: "mt-3xl text-center font-semibold text-brand-400 text-lg", children: [siteName, " Terms of Use"] }), _jsx(Dialog.Description, { className: "mt-xs text-sm leading-2xl", children: content }), _jsxs("div", { className: "mt-5 flex items-center justify-center gap-3xl", children: [_jsx(Image, { src: pagcorLogo, alt: "", height: 75, width: 88, className: "h-[5.5rem] w-auto shrink-0", draggable: false }), _jsx(Image, { src: props.responsibleGamingLogo ?? responsibleGamingLogo, alt: "", height: 62, width: 186, className: "h-[3.875rem] w-auto shrink-0", draggable: false })] })] }), _jsx(Dialog.Context, { children: (api) => (_jsx(Button, { type: "button", className: "mt-3 py-2.5", onClick: () => {
34
+ api.setOpen(false);
35
+ }, children: "I Agree" })) })] }) })] }) }));
47
36
  }
@@ -0,0 +1,9 @@
1
+ import { type ImageProps } from 'next/image';
2
+ import { type ReactNode } from 'react';
3
+ export interface TermsOfUseV2Props {
4
+ logo: ImageProps['src'];
5
+ content: string | ReactNode;
6
+ siteName: string;
7
+ responsibleGamingLogo?: ImageProps['src'];
8
+ }
9
+ export declare function TermsOfUseV2({ logo, siteName, content, ...props }: TermsOfUseV2Props): import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,47 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import Image, {} from 'next/image';
3
+ import { useRef } from 'react';
4
+ import { twMerge } from 'tailwind-merge';
5
+ import { useShallow } from 'zustand/shallow';
6
+ import { useGlobalStore } from '../../client/hooks/useGlobalStore.js';
7
+ import { ScrollToBottomIcon } from '../../icons/ScrollToBottomIcon.js';
8
+ import decorativebackground from '../../images/decorative-patern.png';
9
+ import pagcorLogo from '../../images/pagcor.png';
10
+ import responsibleGamingLogo from '../../images/responsible-gaming.png';
11
+ import { Button } from '../../ui/Button/index.js';
12
+ import { Dialog } from '../../ui/Dialog/index.js';
13
+ import { Portal } from '../../ui/Portal/index.js';
14
+ export function TermsOfUseV2({ logo, siteName, content, ...props }) {
15
+ const scrollableContentRef = useRef(null);
16
+ const globalStore = useGlobalStore(useShallow((ctx) => ({
17
+ signIn: ctx.signIn,
18
+ signUp: ctx.signUp,
19
+ disclaimer: ctx.disclaimer,
20
+ termsOfUse: ctx.termsOfUse,
21
+ })));
22
+ return (_jsx(Dialog.Root, { open: globalStore.termsOfUse.open, onOpenChange: (details) => {
23
+ globalStore.termsOfUse.setOpen(details.open);
24
+ if (!details.open)
25
+ globalStore.termsOfUse.setAccepted(true);
26
+ }, lazyMount: true, unmountOnExit: true, closeOnEscape: false, closeOnInteractOutside: false, onExitComplete: () => {
27
+ if (globalStore.termsOfUse.next === 'SIGN_IN') {
28
+ globalStore.signIn.setOpen(true);
29
+ }
30
+ if (globalStore.termsOfUse.next === 'SIGN_UP') {
31
+ globalStore.signUp.setOpen(true);
32
+ }
33
+ if (globalStore.termsOfUse.next === 'DISCLAIMER') {
34
+ globalStore.disclaimer.setOpen(true);
35
+ }
36
+ globalStore.termsOfUse.setNext(null);
37
+ }, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, { className: "z-popover" }), _jsx(Dialog.Positioner, { className: "z-popover", children: _jsxs(Dialog.Content, { className: twMerge('relative flex h-full w-full flex-col items-start overflow-y-auto p-3xl lg:mx-auto lg:h-auto lg:max-h-[90vh] lg:w-[650px]', 'scrollbar:h-2 scrollbar:w-2 scrollbar-thumb:rounded-full scrollbar-thumb:bg-bg-quaternary scrollbar-track:bg-transparent'), children: [_jsx(Image, { src: decorativebackground, alt: "", width: 200, height: 200, className: "absolute top-0 left-0" }), _jsx(Image, { src: logo, alt: "", width: 250, height: 150, className: "h-auto w-[7.5rem]", draggable: false }), _jsxs("div", { className: "w-full grow", children: [_jsxs(Dialog.Title, { className: "mt-3xl text-center font-semibold text-brand-400 text-lg", children: [siteName, " Terms of Use"] }), _jsxs("div", { ref: scrollableContentRef, className: "mt-xs scrollbar:h-2 max-h-96 scrollbar:w-2 overflow-y-auto rounded-md scrollbar-thumb:rounded-full bg-[#021C25] p-4", children: [_jsxs("div", { className: "mt-5 flex items-center justify-center gap-3xl", children: [_jsx(Image, { src: pagcorLogo, alt: "", height: 75, width: 88, className: "h-[5.5rem] w-auto shrink-0", draggable: false }), _jsx(Image, { src: props.responsibleGamingLogo ?? responsibleGamingLogo, alt: "", height: 62, width: 186, className: "h-[3.875rem] w-auto shrink-0", draggable: false })] }), _jsx(Dialog.Description, { className: "mt-xs text-sm leading-2xl", children: content }), _jsx(Dialog.Context, { children: (api) => (_jsx("div", { className: "mt-3 flex items-center justify-center gap-x-sm", children: _jsx("div", { className: "w-[80%]", children: _jsx(Button, { type: "button", className: "flex-1 py-2.5", onClick: () => {
38
+ api.setOpen(false);
39
+ }, children: "I Agree" }) }) })) })] })] }), _jsx(Button, { type: "button", className: "absolute right-9 bottom-10 w-fit flex-1 rounded-lg bg-bg-active py-2.5", onClick: () => {
40
+ if (scrollableContentRef.current) {
41
+ scrollableContentRef.current.scrollTo({
42
+ top: scrollableContentRef.current.scrollHeight,
43
+ behavior: 'smooth',
44
+ });
45
+ }
46
+ }, children: _jsx(ScrollToBottomIcon, {}) })] }) })] }) }));
47
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@opexa/portal-components",
3
- "version": "0.0.565",
3
+ "version": "0.0.566",
4
4
  "exports": {
5
5
  "./ui/*": {
6
6
  "types": "./dist/ui/*/index.d.ts",