@jolibox/ui 1.0.0

package/README.md

@@ -0,0 +1,93 @@
+# @jolibox/ui
+
+A modern UI component library built with Preact and Shoelace.
+
+## Features
+
+- 🚀 Built with Preact for lightweight and fast performance
+- 🎨 Based on Shoelace web components for consistent design
+- 📦 Tree-shakeable exports
+- 🔧 TypeScript support
+- 📚 Storybook documentation
+- 🎯 Fully customizable components
+
+## Installation
+
+```bash
+# Using npm
+npm install @jolibox/ui
+
+# Using yarn
+yarn add @jolibox/ui
+
+# Using pnpm
+pnpm add @jolibox/ui
+```
+
+## Usage
+
+```jsx
+import { Button } from '@jolibox/ui';
+
+function App() {
+  return (
+    <Button variant="primary" size="large">
+      Click me!
+    </Button>
+  );
+}
+```
+
+## Available Components
+
+### Button
+
+A customizable button component with various styles and states.
+
+```jsx
+<Button
+  variant="primary" // default | primary | success | neutral | warning | danger
+  size="medium" // small | medium | large
+  disabled={false} // true | false
+  loading={false} // true | false
+  outline={false} // true | false
+  pill={false} // true | false
+  circle={false} // true | false
+  onClick={() => {}} // click handler
+>
+  Button Text
+</Button>
+```
+
+## Development
+
+1. Install dependencies:
+
+```bash
+rush update
+```
+
+2. Start Storybook:
+
+```bash
+cd packages/ui
+rush storybook
+```
+
+3. Build the library:
+
+```bash
+rush build
+```
+
+## Contributing
+
+1. Fork the repository
+2. Create your feature branch
+3. Commit your changes
+4. Push to the branch
+5. Create a new Pull Request
+
+## License
+
+MIT

package/dist/bridge/index.d.ts

@@ -0,0 +1 @@
+export { createRecommendModal } from './recommend';

package/dist/bridge/recommend/components/grid/index.d.ts

@@ -0,0 +1,11 @@
+import type { IGame } from '../../types';
+import { h } from 'preact';
+import { PropsWithChildren } from 'preact/compat';
+interface IGameListProps extends PropsWithChildren {
+    list: IGame[];
+    layerName: string;
+    routeMode: 'REDIRECT' | 'NAVIGATE';
+    onGameClick?: (game: IGame) => void;
+}
+export declare const GamesGrid: ({ list, routeMode, layerName, onGameClick, ...restProps }: IGameListProps) => h.JSX.Element;
+export {};

package/dist/bridge/recommend/components/recommend-panel.d.ts

@@ -0,0 +1,10 @@
+import { h } from 'preact';
+import { IRecommendationButton, IGame } from '../types';
+import { RecommendModalOnCloseParams } from '../index';
+declare const RecommendedGuidePanel: (params: {
+    games: IGame[];
+    title: string;
+    buttons: IRecommendationButton[];
+    onClose?: (params: RecommendModalOnCloseParams) => void;
+}) => h.JSX.Element;
+export { RecommendedGuidePanel };

package/dist/bridge/recommend/index.d.ts

@@ -0,0 +1,20 @@
+import { IGame, IRecommendationButton } from './types';
+export type RecommendModalOnCloseParams = {
+    type: 'dismiss' | 'quit' | 'navigate';
+    data?: {
+        game: IGame;
+    };
+};
+export declare const createRecommendModal: (params: {
+    games: IGame[];
+    title: string;
+    buttons: IRecommendationButton[];
+    onClose?: (params: RecommendModalOnCloseParams) => void;
+    onOpen?: () => void;
+}) => {
+    show: () => void;
+    hide: () => void;
+    isOpen: () => boolean;
+    destroy: () => void;
+};
+export type { IGame, IRecommendationButton };

package/dist/bridge/recommend/types.d.ts

@@ -0,0 +1,62 @@
+export interface IGame {
+    gameId: string;
+    url: string;
+    name: string;
+    orientation: 'HORIZONTAL' | 'VERTICAL';
+    logo?: string;
+    cover?: string;
+    splashImage?: string;
+    lastOpenTime?: number;
+    description?: string;
+    externalHost?: boolean;
+}
+export interface IRecommendationData {
+    buttons: IRecommendationButton[];
+    /**
+     * 对应 from = DRAMA_DETAIL
+     */
+    dramaListInfo?: null | DramaListInfo;
+    /**
+     * 对应 from = GAME_DETAIL
+     */
+    gameListInfo?: null | GameListInfo;
+    /**
+     * multi-lang handle by backend
+     */
+    title: string;
+    type: IRecommendationDataType;
+}
+export interface IRecommendationButton {
+    text: string;
+    type: ERecommendationButtonType;
+}
+export declare enum ERecommendationButtonType {
+    Dismiss = "DISMISS",
+    Quit = "QUIT"
+}
+export interface DramaListInfo {
+    dramas: DramaDTO[];
+}
+/**
+ * DramaDTO
+ */
+export interface DramaDTO {
+    /**
+     * homepage banner
+     */
+    cover: string;
+    dramaId: string;
+    name: string;
+    /**
+     * times of play
+     */
+    views: number;
+    [property: string]: any;
+}
+export interface GameListInfo {
+    games: IGame[];
+}
+export declare enum IRecommendationDataType {
+    RamdomDrama = "RANDOM_DRAMA",
+    RandomGame = "RANDOM_GAME"
+}

package/dist/components/create-modal.d.ts

@@ -0,0 +1,25 @@
+import { h } from 'preact';
+export type ModalPlacement = 'top' | 'end' | 'bottom' | 'start';
+export interface ModalOptions {
+    title: string;
+    content: h.JSX.Element | HTMLElement;
+    placement?: ModalPlacement;
+    noHeader?: boolean;
+    padding?: string;
+    onClose?: (...args: any[]) => void;
+    onOpen?: (...args: any[]) => void;
+    backdropColor?: string;
+    footerButtons?: Array<{
+        text: string;
+        variant?: string;
+        onClick?: (e: MouseEvent, utils: {
+            hide: () => void;
+        }) => void;
+    }>;
+}
+export declare const createModal: (options: ModalOptions) => {
+    show: () => void;
+    hide: () => void;
+    isOpen: () => boolean;
+    destroy: () => void;
+};

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

@@ -0,0 +1,18 @@
+import { ComponentChildren } from 'preact';
+interface DrawerProps {
+    children: ComponentChildren;
+    isOpen?: boolean;
+    onClose?: () => void;
+    height?: string | number;
+    className?: string;
+    backdropColor?: string;
+}
+interface DrawerRef {
+    show: () => void;
+    hide: () => void;
+    isOpen: () => boolean;
+}
+declare const DrawerWithRef: import("preact").FunctionalComponent<import("preact/compat").PropsWithoutRef<DrawerProps> & {
+    ref?: import("preact").Ref<DrawerRef> | undefined;
+}>;
+export default DrawerWithRef;

package/dist/components/expose-elem.d.ts

@@ -0,0 +1,27 @@
+import { h } from 'preact';
+/**
+ * useExposure - 检测元素是否由不可见到可见
+ * @param {Function} onExpose - 元素由不可见到可见时的回调函数
+ * @param {Object} options - IntersectionObserver 配置选项
+ * eg:
+ * const options = {
+    root: null, // 使用视口作为参照物
+    rootMargin: '0px', // 不使用边缘
+    threshold: 0.6 // 曝光比例阈值
+  };
+ * @returns {Object} ref - 传递给需要检测的 DOM 元素的 ref
+ */
+declare const useExposure: (onExpose: () => void, options?: {
+    threshold: number;
+}) => import("preact/hooks").MutableRef<null>;
+declare function ExposeElement({ elementTag, src, children, handleExposure, className, imgStyle, ...restProps }: {
+    className: string;
+    elementTag?: 'Image' | 'View';
+    src?: string;
+    children?: React.ReactNode;
+    onClick?: (p: any) => void;
+    handleExposure: () => void;
+    style?: React.CSSProperties;
+    imgStyle?: React.CSSProperties;
+}): h.JSX.Element;
+export { ExposeElement, useExposure };

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

@@ -0,0 +1,39 @@
+import { ComponentChildren, FunctionComponent } from 'preact';
+import { JSX } from 'preact/jsx-runtime';
+export interface GridProps extends JSX.HTMLAttributes<HTMLDivElement> {
+    children: ComponentChildren;
+    fluid?: boolean;
+    className?: string;
+}
+export interface RowProps extends JSX.HTMLAttributes<HTMLDivElement> {
+    children: ComponentChildren;
+    gutter?: number | [number, number];
+    justify?: 'start' | 'end' | 'center' | 'space-around' | 'space-between';
+    align?: 'top' | 'middle' | 'bottom';
+    className?: string;
+}
+export interface ColProps extends JSX.HTMLAttributes<HTMLDivElement> {
+    children: ComponentChildren;
+    span?: number;
+    offset?: number;
+    xs?: number | ColSize;
+    sm?: number | ColSize;
+    md?: number | ColSize;
+    lg?: number | ColSize;
+    xl?: number | ColSize;
+    className?: string;
+}
+interface ColSize {
+    span?: number;
+    offset?: number;
+}
+export declare const Grid: FunctionComponent<GridProps>;
+export declare const Row: FunctionComponent<RowProps>;
+export declare const Col: FunctionComponent<ColProps>;
+export declare function getResponsiveStyles(props: ColProps): JSX.CSSProperties;
+declare const _default: {
+    Grid: FunctionComponent<GridProps>;
+    Row: FunctionComponent<RowProps>;
+    Col: FunctionComponent<ColProps>;
+};
+export default _default;

package/dist/index.cjs.js

@@ -0,0 +1,38 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});var J,d,De,H,fe,Me,Oe,Ue,ie,ne,re,W={},We=[],tt=/acit|ex(?:s|g|n|p|$)|rph|grid|ows|mnc|ntw|ine[ch]|zoo|^ord|itera/i,I=Array.isArray;function N(e,t){for(var n in t)e[n]=t[n];return e}function le(e){e&&e.parentNode&&e.parentNode.removeChild(e)}function R(e,t,n){var r,o,_,i={};for(_ in t)_=="key"?r=t[_]:_=="ref"?o=t[_]:i[_]=t[_];if(arguments.length>2&&(i.children=arguments.length>3?J.call(arguments,2):n),typeof e=="function"&&e.defaultProps!=null)for(_ in e.defaultProps)i[_]===void 0&&(i[_]=e.defaultProps[_]);return G(e,i,r,o,null)}function G(e,t,n,r,o){var _={type:e,props:t,key:n,ref:r,__k:null,__:null,__b:0,__e:null,__c:null,constructor:void 0,__v:o??++De,__i:-1,__u:0};return o==null&&d.vnode!=null&&d.vnode(_),_}function A(e){return e.children}function E(e,t){this.props=e,this.context=t}function M(e,t){if(t==null)return e.__?M(e.__,e.__i+1):null;for(var n;t<e.__k.length;t++)if((n=e.__k[t])!=null&&n.__e!=null)return n.__e;return typeof e.type=="function"?M(e):null}function Le(e){var t,n;if((e=e.__)!=null&&e.__c!=null){for(e.__e=e.__c.base=null,t=0;t<e.__k.length;t++)if((n=e.__k[t])!=null&&n.__e!=null){e.__e=e.__c.base=n.__e;break}return Le(e)}}function pe(e){(!e.__d&&(e.__d=!0)&&H.push(e)&&!Q.__r++||fe!==d.debounceRendering)&&((fe=d.debounceRendering)||Me)(Q)}function Q(){for(var e,t,n,r,o,_,i,a=1;H.length;)H.length>a&&H.sort(Oe),e=H.shift(),a=H.length,e.__d&&(n=void 0,o=(r=(t=e).__v).__e,_=[],i=[],t.__P&&((n=N({},r)).__v=r.__v+1,d.vnode&&d.vnode(n),ae(t.__P,n,r,t.__n,t.__P.namespaceURI,32&r.__u?[o]:null,_,o??M(r),!!(32&r.__u),i),n.__v=r.__v,n.__.__k[n.__i]=n,je(_,n,i),n.__e!=o&&Le(n)));Q.__r=0}function Fe(e,t,n,r,o,_,i,a,s,u,p){var l,c,f,x,k,y,v=r&&r.__k||We,m=t.length;for(s=nt(n,t,v,s,m),l=0;l<m;l++)(f=n.__k[l])!=null&&(c=f.__i===-1?W:v[f.__i]||W,f.__i=l,y=ae(e,f,c,o,_,i,a,s,u,p),x=f.__e,f.ref&&c.ref!=f.ref&&(c.ref&&ue(c.ref,null,f),p.push(f.ref,f.__c||x,f)),k==null&&x!=null&&(k=x),4&f.__u||c.__k===f.__k?s=Ie(f,s,e):typeof f.type=="function"&&y!==void 0?s=y:x&&(s=x.nextSibling),f.__u&=-7);return n.__e=k,s}function nt(e,t,n,r,o){var _,i,a,s,u,p=n.length,l=p,c=0;for(e.__k=new Array(o),_=0;_<o;_++)(i=t[_])!=null&&typeof i!="boolean"&&typeof i!="function"?(s=_+c,(i=e.__k[_]=typeof i=="string"||typeof i=="number"||typeof i=="bigint"||i.constructor==String?G(null,i,null,null,null):I(i)?G(A,{children:i},null,null,null):i.constructor===void 0&&i.__b>0?G(i.type,i.props,i.key,i.ref?i.ref:null,i.__v):i).__=e,i.__b=e.__b+1,a=null,(u=i.__i=rt(i,n,s,l))!==-1&&(l--,(a=n[u])&&(a.__u|=2)),a==null||a.__v===null?(u==-1&&(o>p?c--:o<p&&c++),typeof i.type!="function"&&(i.__u|=4)):u!=s&&(u==s-1?c--:u==s+1?c++:(u>s?c--:c++,i.__u|=4))):e.__k[_]=null;if(l)for(_=0;_<p;_++)(a=n[_])!=null&&!(2&a.__u)&&(a.__e==r&&(r=M(a)),ze(a,a));return r}function Ie(e,t,n){var r,o;if(typeof e.type=="function"){for(r=e.__k,o=0;r&&o<r.length;o++)r[o]&&(r[o].__=e,t=Ie(r[o],t,n));return t}e.__e!=t&&(t&&e.type&&!n.contains(t)&&(t=M(e)),n.insertBefore(e.__e,t||null),t=e.__e);do t=t&&t.nextSibling;while(t!=null&&t.nodeType==8);return t}function Y(e,t){return t=t||[],e==null||typeof e=="boolean"||(I(e)?e.some(function(n){Y(n,t)}):t.push(e)),t}function rt(e,t,n,r){var o,_,i=e.key,a=e.type,s=t[n];if(s===null&&e.key==null||s&&i==s.key&&a===s.type&&!(2&s.__u))return n;if(r>(s!=null&&!(2&s.__u)?1:0))for(o=n-1,_=n+1;o>=0||_<t.length;){if(o>=0){if((s=t[o])&&!(2&s.__u)&&i==s.key&&a===s.type)return o;o--}if(_<t.length){if((s=t[_])&&!(2&s.__u)&&i==s.key&&a===s.type)return _;_++}}return-1}function de(e,t,n){t[0]=="-"?e.setProperty(t,n??""):e[t]=n==null?"":typeof n!="number"||tt.test(t)?n:n+"px"}function B(e,t,n,r,o){var _;e:if(t=="style")if(typeof n=="string")e.style.cssText=n;else{if(typeof r=="string"&&(e.style.cssText=r=""),r)for(t in r)n&&t in n||de(e.style,t,"");if(n)for(t in n)r&&n[t]===r[t]||de(e.style,t,n[t])}else if(t[0]=="o"&&t[1]=="n")_=t!=(t=t.replace(Ue,"$1")),t=t.toLowerCase()in e||t=="onFocusOut"||t=="onFocusIn"?t.toLowerCase().slice(2):t.slice(2),e.l||(e.l={}),e.l[t+_]=n,n?r?n.t=r.t:(n.t=ie,e.addEventListener(t,_?re:ne,_)):e.removeEventListener(t,_?re:ne,_);else{if(o=="http://www.w3.org/2000/svg")t=t.replace(/xlink(H|:h)/,"h").replace(/sName$/,"s");else if(t!="width"&&t!="height"&&t!="href"&&t!="list"&&t!="form"&&t!="tabIndex"&&t!="download"&&t!="rowSpan"&&t!="colSpan"&&t!="role"&&t!="popover"&&t in e)try{e[t]=n??"";break e}catch{}typeof n=="function"||(n==null||n===!1&&t[4]!="-"?e.removeAttribute(t):e.setAttribute(t,t=="popover"&&n==1?"":n))}}function he(e){return function(t){if(this.l){var n=this.l[t.type+e];if(t.u==null)t.u=ie++;else if(t.u<n.t)return;return n(d.event?d.event(t):t)}}}function ae(e,t,n,r,o,_,i,a,s,u){var p,l,c,f,x,k,y,v,m,P,C,T,b,ce,j,O,K,$=t.type;if(t.constructor!==void 0)return null;128&n.__u&&(s=!!(32&n.__u),_=[a=t.__e=n.__e]),(p=d.__b)&&p(t);e:if(typeof $=="function")try{if(v=t.props,m="prototype"in $&&$.prototype.render,P=(p=$.contextType)&&r[p.__c],C=p?P?P.props.value:p.__:r,n.__c?y=(l=t.__c=n.__c).__=l.__E:(m?t.__c=l=new $(v,C):(t.__c=l=new E(v,C),l.constructor=$,l.render=_t),P&&P.sub(l),l.props=v,l.state||(l.state={}),l.context=C,l.__n=r,c=l.__d=!0,l.__h=[],l._sb=[]),m&&l.__s==null&&(l.__s=l.state),m&&$.getDerivedStateFromProps!=null&&(l.__s==l.state&&(l.__s=N({},l.__s)),N(l.__s,$.getDerivedStateFromProps(v,l.__s))),f=l.props,x=l.state,l.__v=t,c)m&&$.getDerivedStateFromProps==null&&l.componentWillMount!=null&&l.componentWillMount(),m&&l.componentDidMount!=null&&l.__h.push(l.componentDidMount);else{if(m&&$.getDerivedStateFromProps==null&&v!==f&&l.componentWillReceiveProps!=null&&l.componentWillReceiveProps(v,C),!l.__e&&(l.shouldComponentUpdate!=null&&l.shouldComponentUpdate(v,l.__s,C)===!1||t.__v==n.__v)){for(t.__v!=n.__v&&(l.props=v,l.state=l.__s,l.__d=!1),t.__e=n.__e,t.__k=n.__k,t.__k.some(function(U){U&&(U.__=t)}),T=0;T<l._sb.length;T++)l.__h.push(l._sb[T]);l._sb=[],l.__h.length&&i.push(l);break e}l.componentWillUpdate!=null&&l.componentWillUpdate(v,l.__s,C),m&&l.componentDidUpdate!=null&&l.__h.push(function(){l.componentDidUpdate(f,x,k)})}if(l.context=C,l.props=v,l.__P=e,l.__e=!1,b=d.__r,ce=0,m){for(l.state=l.__s,l.__d=!1,b&&b(t),p=l.render(l.props,l.state,l.context),j=0;j<l._sb.length;j++)l.__h.push(l._sb[j]);l._sb=[]}else do l.__d=!1,b&&b(t),p=l.render(l.props,l.state,l.context),l.state=l.__s;while(l.__d&&++ce<25);l.state=l.__s,l.getChildContext!=null&&(r=N(N({},r),l.getChildContext())),m&&!c&&l.getSnapshotBeforeUpdate!=null&&(k=l.getSnapshotBeforeUpdate(f,x)),O=p,p!=null&&p.type===A&&p.key==null&&(O=Be(p.props.children)),a=Fe(e,I(O)?O:[O],t,n,r,o,_,i,a,s,u),l.base=t.__e,t.__u&=-161,l.__h.length&&i.push(l),y&&(l.__E=l.__=null)}catch(U){if(t.__v=null,s||_!=null)if(U.then){for(t.__u|=s?160:128;a&&a.nodeType==8&&a.nextSibling;)a=a.nextSibling;_[_.indexOf(a)]=null,t.__e=a}else for(K=_.length;K--;)le(_[K]);else t.__e=n.__e,t.__k=n.__k;d.__e(U,t,n)}else _==null&&t.__v==n.__v?(t.__k=n.__k,t.__e=n.__e):a=t.__e=ot(n.__e,t,n,r,o,_,i,s,u);return(p=d.diffed)&&p(t),128&t.__u?void 0:a}function je(e,t,n){for(var r=0;r<n.length;r++)ue(n[r],n[++r],n[++r]);d.__c&&d.__c(t,e),e.some(function(o){try{e=o.__h,o.__h=[],e.some(function(_){_.call(o)})}catch(_){d.__e(_,o.__v)}})}function Be(e){return typeof e!="object"||e==null?e:I(e)?e.map(Be):N({},e)}function ot(e,t,n,r,o,_,i,a,s){var u,p,l,c,f,x,k,y=n.props,v=t.props,m=t.type;if(m=="svg"?o="http://www.w3.org/2000/svg":m=="math"?o="http://www.w3.org/1998/Math/MathML":o||(o="http://www.w3.org/1999/xhtml"),_!=null){for(u=0;u<_.length;u++)if((f=_[u])&&"setAttribute"in f==!!m&&(m?f.localName==m:f.nodeType==3)){e=f,_[u]=null;break}}if(e==null){if(m==null)return document.createTextNode(v);e=document.createElementNS(o,m,v.is&&v),a&&(d.__m&&d.__m(t,_),a=!1),_=null}if(m===null)y===v||a&&e.data===v||(e.data=v);else{if(_=_&&J.call(e.childNodes),y=n.props||W,!a&&_!=null)for(y={},u=0;u<e.attributes.length;u++)y[(f=e.attributes[u]).name]=f.value;for(u in y)if(f=y[u],u!="children"){if(u=="dangerouslySetInnerHTML")l=f;else if(!(u in v)){if(u=="value"&&"defaultValue"in v||u=="checked"&&"defaultChecked"in v)continue;B(e,u,null,f,o)}}for(u in v)f=v[u],u=="children"?c=f:u=="dangerouslySetInnerHTML"?p=f:u=="value"?x=f:u=="checked"?k=f:a&&typeof f!="function"||y[u]===f||B(e,u,f,y[u],o);if(p)a||l&&(p.__html===l.__html||p.__html===e.innerHTML)||(e.innerHTML=p.__html),t.__k=[];else if(l&&(e.innerHTML=""),Fe(t.type==="template"?e.content:e,I(c)?c:[c],t,n,r,m=="foreignObject"?"http://www.w3.org/1999/xhtml":o,_,i,_?_[0]:n.__k&&M(n,0),a,s),_!=null)for(u=_.length;u--;)le(_[u]);a||(u="value",m=="progress"&&x==null?e.removeAttribute("value"):x!==void 0&&(x!==e[u]||m=="progress"&&!x||m=="option"&&x!==y[u])&&B(e,u,x,y[u],o),u="checked",k!==void 0&&k!==e[u]&&B(e,u,k,y[u],o))}return e}function ue(e,t,n){try{if(typeof e=="function"){var r=typeof e.__u=="function";r&&e.__u(),r&&t==null||(e.__u=e(t))}else e.current=t}catch(o){d.__e(o,n)}}function ze(e,t,n){var r,o;if(d.unmount&&d.unmount(e),(r=e.ref)&&(r.current&&r.current!==e.__e||ue(r,null,t)),(r=e.__c)!=null){if(r.componentWillUnmount)try{r.componentWillUnmount()}catch(_){d.__e(_,t)}r.base=r.__P=null}if(r=e.__k)for(o=0;o<r.length;o++)r[o]&&ze(r[o],t,n||typeof e.type!="function");n||le(e.__e),e.__c=e.__=e.__e=void 0}function _t(e,t,n){return this.constructor(e,n)}function ve(e,t,n){var r,o,_,i;t==document&&(t=document.documentElement),d.__&&d.__(e,t),o=(r=!1)?null:t.__k,_=[],i=[],ae(t,e=t.__k=R(A,null,[e]),o||W,W,t.namespaceURI,o?null:t.firstChild?J.call(t.childNodes):null,_,o?o.__e:t.firstChild,r,i),je(_,e,i)}J=We.slice,d={__e:function(e,t,n,r){for(var o,_,i;t=t.__;)if((o=t.__c)&&!o.__)try{if((_=o.constructor)&&_.getDerivedStateFromError!=null&&(o.setState(_.getDerivedStateFromError(e)),i=o.__d),o.componentDidCatch!=null&&(o.componentDidCatch(e,r||{}),i=o.__d),i)return o.__E=o}catch(a){e=a}throw e}},De=0,E.prototype.setState=function(e,t){var n;n=this.__s!=null&&this.__s!==this.state?this.__s:this.__s=N({},this.state),typeof e=="function"&&(e=e(N({},n),this.props)),e&&N(n,e),e!=null&&this.__v&&(t&&this._sb.push(t),pe(this))},E.prototype.forceUpdate=function(e){this.__v&&(this.__e=!0,e&&this.__h.push(e),pe(this))},E.prototype.render=A,H=[],Me=typeof Promise=="function"?Promise.prototype.then.bind(Promise.resolve()):setTimeout,Oe=function(e,t){return e.__v.__b-t.__v.__b},Q.__r=0,Ue=/(PointerCapture)$|Capture$/i,ie=0,ne=he(!1),re=he(!0);var L,g,X,me,F=0,Ge=[],w=d,ye=w.__b,ge=w.__r,xe=w.diffed,be=w.__c,we=w.unmount,ke=w.__;function se(e,t){w.__h&&w.__h(g,e,F||t),F=0;var n=g.__H||(g.__H={__:[],__h:[]});return e>=n.__.length&&n.__.push({}),n.__[e]}function Ce(e){return F=1,it(Qe,e)}function it(e,t,n){var r=se(L++,2);if(r.t=e,!r.__c&&(r.__=[n?n(t):Qe(void 0,t),function(a){var s=r.__N?r.__N[0]:r.__[0],u=r.t(s,a);s!==u&&(r.__N=[u,r.__[1]],r.__c.setState({}))}],r.__c=g,!g.__f)){var o=function(a,s,u){if(!r.__c.__H)return!0;var p=r.__c.__H.__.filter(function(c){return!!c.__c});if(p.every(function(c){return!c.__N}))return!_||_.call(this,a,s,u);var l=r.__c.props!==a;return p.forEach(function(c){if(c.__N){var f=c.__[0];c.__=c.__N,c.__N=void 0,f!==c.__[0]&&(l=!0)}}),_&&_.call(this,a,s,u)||l};g.__f=!0;var _=g.shouldComponentUpdate,i=g.componentWillUpdate;g.componentWillUpdate=function(a,s,u){if(this.__e){var p=_;_=void 0,o(a,s,u),_=p}i&&i.call(this,a,s,u)},g.shouldComponentUpdate=o}return r.__N||r.__}function q(e,t){var n=se(L++,3);!w.__s&&Ve(n.__H,t)&&(n.__=e,n.u=t,g.__H.__h.push(n))}function Z(e){return F=5,qe(function(){return{current:e}},[])}function qe(e,t){var n=se(L++,7);return Ve(n.__H,t)&&(n.__=e(),n.__H=t,n.__h=e),n.__}function S(e,t){return F=8,qe(function(){return e},t)}function lt(){for(var e;e=Ge.shift();)if(e.__P&&e.__H)try{e.__H.__h.forEach(V),e.__H.__h.forEach(oe),e.__H.__h=[]}catch(t){e.__H.__h=[],w.__e(t,e.__v)}}w.__b=function(e){g=null,ye&&ye(e)},w.__=function(e,t){e&&t.__k&&t.__k.__m&&(e.__m=t.__k.__m),ke&&ke(e,t)},w.__r=function(e){ge&&ge(e),L=0;var t=(g=e.__c).__H;t&&(X===g?(t.__h=[],g.__h=[],t.__.forEach(function(n){n.__N&&(n.__=n.__N),n.u=n.__N=void 0})):(t.__h.forEach(V),t.__h.forEach(oe),t.__h=[],L=0)),X=g},w.diffed=function(e){xe&&xe(e);var t=e.__c;t&&t.__H&&(t.__H.__h.length&&(Ge.push(t)!==1&&me===w.requestAnimationFrame||((me=w.requestAnimationFrame)||at)(lt)),t.__H.__.forEach(function(n){n.u&&(n.__H=n.u),n.u=void 0})),X=g=null},w.__c=function(e,t){t.some(function(n){try{n.__h.forEach(V),n.__h=n.__h.filter(function(r){return!r.__||oe(r)})}catch(r){t.some(function(o){o.__h&&(o.__h=[])}),t=[],w.__e(r,n.__v)}}),be&&be(e,t)},w.unmount=function(e){we&&we(e);var t,n=e.__c;n&&n.__H&&(n.__H.__.forEach(function(r){try{V(r)}catch(o){t=o}}),n.__H=void 0,t&&w.__e(t,n.__v))};var $e=typeof requestAnimationFrame=="function";function at(e){var t,n=function(){clearTimeout(r),$e&&cancelAnimationFrame(t),setTimeout(e)},r=setTimeout(n,100);$e&&(t=requestAnimationFrame(n))}function V(e){var t=g,n=e.__c;typeof n=="function"&&(e.__c=void 0,n()),g=t}function oe(e){var t=g;e.__c=e.__(),g=t}function Ve(e,t){return!e||e.length!==t.length||t.some(function(n,r){return n!==e[r]})}function Qe(e,t){return typeof t=="function"?t(e):t}function Ye(e,t){for(var n in t)e[n]=t[n];return e}function _e(e,t){for(var n in e)if(n!=="__source"&&!(n in t))return!0;for(var r in t)if(r!=="__source"&&e[r]!==t[r])return!0;return!1}function Se(e,t){this.props=e,this.context=t}function ut(e,t){function n(o){var _=this.props.ref,i=_==o.ref;return!i&&_&&(_.call?_(null):_.current=null),t?!t(this.props,o)||!i:_e(this.props,o)}function r(o){return this.shouldComponentUpdate=n,R(e,o)}return r.displayName="Memo("+(e.displayName||e.name)+")",r.prototype.isReactComponent=!0,r.__f=!0,r}(Se.prototype=new E).isPureReactComponent=!0,Se.prototype.shouldComponentUpdate=function(e,t){return _e(this.props,e)||_e(this.state,t)};var Ne=d.__b;d.__b=function(e){e.type&&e.type.__f&&e.ref&&(e.props.ref=e.ref,e.ref=null),Ne&&Ne(e)};var st=typeof Symbol<"u"&&Symbol.for&&Symbol.for("react.forward_ref")||3911;function ct(e){function t(n){var r=Ye({},n);return delete r.ref,e(r,n.ref||null)}return t.$$typeof=st,t.render=t,t.prototype.isReactComponent=t.__f=!0,t.displayName="ForwardRef("+(e.displayName||e.name)+")",t}var ft=d.__e;d.__e=function(e,t,n,r){if(e.then){for(var o,_=t;_=_.__;)if((o=_.__c)&&o.__c)return t.__e==null&&(t.__e=n.__e,t.__k=n.__k),o.__c(e,t)}ft(e,t,n,r)};var Ee=d.unmount;function Ze(e,t,n){return e&&(e.__c&&e.__c.__H&&(e.__c.__H.__.forEach(function(r){typeof r.__c=="function"&&r.__c()}),e.__c.__H=null),(e=Ye({},e)).__c!=null&&(e.__c.__P===n&&(e.__c.__P=t),e.__c=null),e.__k=e.__k&&e.__k.map(function(r){return Ze(r,t,n)})),e}function Je(e,t,n){return e&&n&&(e.__v=null,e.__k=e.__k&&e.__k.map(function(r){return Je(r,t,n)}),e.__c&&e.__c.__P===t&&(e.__e&&n.appendChild(e.__e),e.__c.__e=!0,e.__c.__P=n)),e}function ee(){this.__u=0,this.o=null,this.__b=null}function Ke(e){var t=e.__.__c;return t&&t.__a&&t.__a(e)}function z(){this.i=null,this.l=null}d.unmount=function(e){var t=e.__c;t&&t.__R&&t.__R(),t&&32&e.__u&&(e.type=null),Ee&&Ee(e)},(ee.prototype=new E).__c=function(e,t){var n=t.__c,r=this;r.o==null&&(r.o=[]),r.o.push(n);var o=Ke(r.__v),_=!1,i=function(){_||(_=!0,n.__R=null,o?o(a):a())};n.__R=i;var a=function(){if(!--r.__u){if(r.state.__a){var s=r.state.__a;r.__v.__k[0]=Je(s,s.__c.__P,s.__c.__O)}var u;for(r.setState({__a:r.__b=null});u=r.o.pop();)u.forceUpdate()}};r.__u++||32&t.__u||r.setState({__a:r.__b=r.__v.__k[0]}),e.then(i,i)},ee.prototype.componentWillUnmount=function(){this.o=[]},ee.prototype.render=function(e,t){if(this.__b){if(this.__v.__k){var n=document.createElement("div"),r=this.__v.__k[0].__c;this.__v.__k[0]=Ze(this.__b,n,r.__O=r.__P)}this.__b=null}var o=t.__a&&R(A,null,e.fallback);return o&&(o.__u&=-33),[R(A,null,t.__a?null:e.children),o]};var Pe=function(e,t,n){if(++n[1]===n[0]&&e.l.delete(t),e.props.revealOrder&&(e.props.revealOrder[0]!=="t"||!e.l.size))for(n=e.i;n;){for(;n.length>3;)n.pop()();if(n[1]<n[0])break;e.i=n=n[2]}};(z.prototype=new E).__a=function(e){var t=this,n=Ke(t.__v),r=t.l.get(e);return r[0]++,function(o){var _=function(){t.props.revealOrder?(r.push(o),Pe(t,e,r)):o()};n?n(_):_()}},z.prototype.render=function(e){this.i=null,this.l=new Map;var t=Y(e.children);e.revealOrder&&e.revealOrder[0]==="b"&&t.reverse();for(var n=t.length;n--;)this.l.set(t[n],this.i=[1,0,this.i]);return e.children},z.prototype.componentDidUpdate=z.prototype.componentDidMount=function(){var e=this;this.l.forEach(function(t,n){Pe(e,n,t)})};var pt=typeof Symbol<"u"&&Symbol.for&&Symbol.for("react.element")||60103,dt=/^(?:accent|alignment|arabic|baseline|cap|clip(?!PathU)|color|dominant|fill|flood|font|glyph(?!R)|horiz|image(!S)|letter|lighting|marker(?!H|W|U)|overline|paint|pointer|shape|stop|strikethrough|stroke|text(?!L)|transform|underline|unicode|units|v|vector|vert|word|writing|x(?!C))[A-Z]/,ht=/^on(Ani|Tra|Tou|BeforeInp|Compo)/,vt=/[A-Z0-9]/g,mt=typeof document<"u",yt=function(e){return(typeof Symbol<"u"&&typeof Symbol()=="symbol"?/fil|che|rad/:/fil|che|ra/).test(e)};E.prototype.isReactComponent={},["componentWillMount","componentWillReceiveProps","componentWillUpdate"].forEach(function(e){Object.defineProperty(E.prototype,e,{configurable:!0,get:function(){return this["UNSAFE_"+e]},set:function(t){Object.defineProperty(this,e,{configurable:!0,writable:!0,value:t})}})});var He=d.event;function gt(){}function xt(){return this.cancelBubble}function bt(){return this.defaultPrevented}d.event=function(e){return He&&(e=He(e)),e.persist=gt,e.isPropagationStopped=xt,e.isDefaultPrevented=bt,e.nativeEvent=e};var wt={enumerable:!1,configurable:!0,get:function(){return this.class}},Re=d.vnode;d.vnode=function(e){typeof e.type=="string"&&function(t){var n=t.props,r=t.type,o={},_=r.indexOf("-")===-1;for(var i in n){var a=n[i];if(!(i==="value"&&"defaultValue"in n&&a==null||mt&&i==="children"&&r==="noscript"||i==="class"||i==="className")){var s=i.toLowerCase();i==="defaultValue"&&"value"in n&&n.value==null?i="value":i==="download"&&a===!0?a="":s==="translate"&&a==="no"?a=!1:s[0]==="o"&&s[1]==="n"?s==="ondoubleclick"?i="ondblclick":s!=="onchange"||r!=="input"&&r!=="textarea"||yt(n.type)?s==="onfocus"?i="onfocusin":s==="onblur"?i="onfocusout":ht.test(i)&&(i=s):s=i="oninput":_&&dt.test(i)?i=i.replace(vt,"-$&").toLowerCase():a===null&&(a=void 0),s==="oninput"&&o[i=s]&&(i="oninputCapture"),o[i]=a}}r=="select"&&o.multiple&&Array.isArray(o.value)&&(o.value=Y(n.children).forEach(function(u){u.props.selected=o.value.indexOf(u.props.value)!=-1})),r=="select"&&o.defaultValue!=null&&(o.value=Y(n.children).forEach(function(u){u.props.selected=o.multiple?o.defaultValue.indexOf(u.props.value)!=-1:o.defaultValue==u.props.value})),n.class&&!n.className?(o.class=n.class,Object.defineProperty(o,"className",wt)):(n.className&&!n.class||n.class&&n.className)&&(o.class=o.className=n.className),t.props=o}(e),e.$$typeof=pt,Re&&Re(e)};var Ae=d.__r;d.__r=function(e){Ae&&Ae(e),e.__c};var Te=d.diffed;d.diffed=function(e){Te&&Te(e);var t=e.props,n=e.__e;n!=null&&e.type==="textarea"&&"value"in t&&t.value!==n.value&&(n.value=t.value==null?"":t.value)};var kt=0;function h(e,t,n,r,o,_){t||(t={});var i,a,s=t;if("ref"in s)for(a in s={},t)a=="ref"?i=t[a]:s[a]=t[a];var u={type:e,props:s,key:n,ref:i,__k:null,__:null,__b:0,__e:null,__c:null,constructor:void 0,__v:--kt,__i:-1,__u:0,__source:o,__self:_};if(typeof e=="function"&&(i=e.defaultProps))for(a in i)s[a]===void 0&&(s[a]=i[a]);return d.vnode&&d.vnode(u),u}const te={drawerBackdrop:{position:"fixed",top:0,left:0,right:0,bottom:0,backgroundColor:"rgba(0, 0, 0, 0.5)",display:"flex",justifyContent:"center",alignItems:"flex-end",zIndex:1e3,overflow:"hidden",touchAction:"none"},drawer:{backgroundColor:"white",borderRadius:"16px 16px 0 0",width:"100%",maxWidth:"100%",overflowY:"auto",position:"relative",boxShadow:"0 -2px 10px rgba(0, 0, 0, 0.1)",display:"flex",flexDirection:"column",margin:"0 auto"},drawerContent:{flex:1,width:"100%",height:"100%",overflow:"auto",margin:"0 auto"}},Ct=`
+  @keyframes fadeIn {
+    from { opacity: 0; }
+    to { opacity: 1; }
+  }
+  
+  @keyframes fadeOut {
+    from { opacity: 1; }
+    to { opacity: 0; }
+  }
+  
+  @keyframes slideUp {
+    from { transform: translateY(100%); }
+    to { transform: translateY(0); }
+  }
+  
+  @keyframes slideDown {
+    from { transform: translateY(0); }
+    to { transform: translateY(100%); }
+  }
+  
+  .backdrop-enter {
+    animation: fadeIn 0.3s ease forwards;
+  }
+  
+  .backdrop-leave {
+    animation: fadeOut 0.3s ease forwards;
+  }
+  
+  .drawer-enter {
+    animation: slideUp 0.3s ease forwards;
+  }
+  
+  .drawer-leave {
+    animation: slideDown 0.3s ease forwards;
+  }
+`,$t=({children:e,isOpen:t=!1,onClose:n,height:r="50%",className:o="",backdropColor:_},i)=>{const[a,s]=Ce(t),[u,p]=Ce(null),l=Z(null),c=Z(!1);q(()=>{const b=document.createElement("style");return b.innerHTML=Ct,document.head.appendChild(b),()=>{document.head.removeChild(b)}},[]),q(()=>{t!==a&&!c.current&&(s(t),p(t?"enter":"leave"))},[t,a]);const f=S(()=>{u==="leave"&&(p(null),s(!1),c.current=!1)},[u]),x=S(b=>{b.preventDefault(),b.stopPropagation(),b.target===l.current&&y()},[]),k=S(()=>{c.current=!1,s(!0),p("enter")},[]),y=S(()=>{c.current=!0,p("leave"),n&&n()},[n]),v=S(()=>a&&!c.current,[a]);if(q(()=>{if(i){const b={show:k,hide:y,isOpen:v};typeof i=="function"?i(b):i&&(i.current=b)}},[k,y,v,i]),!a&&!u)return null;const m={...te.drawer,height:typeof r=="number"?`${r}px`:r,backgroundColor:_||"rgba(255, 255, 255, 1)"},P={...te.drawerBackdrop},C=u?`drawer-${u}`:"",T=u?`backdrop-${u}`:"";return h("div",{ref:l,style:P,className:T,onClick:x,onTouchMove:b=>b.preventDefault(),children:h("div",{style:m,className:`${C} ${o}`,onAnimationEnd:f,onTouchMove:b=>b.stopPropagation(),children:h("div",{style:te.drawerContent,children:e})})})},St=ct($t),Nt=({title:e,content:t,noHeader:n,padding:r="16px",footerButtons:o,onClose:_})=>{const i={container:{display:"flex",flexDirection:"column",height:"100%",width:"100%",maxWidth:"440px",margin:"0 auto"},header:{padding:"16px",borderBottom:"1px solid #eee",display:"flex",justifyContent:"space-between",alignItems:"center"},content:{padding:r,flex:1,overflow:"auto"},footer:{padding:"16px",borderTop:"1px solid #eee",display:"flex",justifyContent:"flex-end",gap:"8px"},closeButton:{background:"none",border:"none",cursor:"pointer",fontSize:"20px"},button:{padding:"8px 16px",borderRadius:"4px",border:"1px solid #ddd",cursor:"pointer"}};return h("div",{style:i.container,children:[!n&&h("div",{style:i.header,children:[h("h3",{children:e}),h("button",{style:i.closeButton,onClick:_,children:"×"})]}),h("div",{style:i.content,children:t}),o&&o.length>0&&h("div",{style:i.footer,children:o.map((a,s)=>h("button",{style:{...i.button,backgroundColor:a.variant==="primary"?"#1677ff":"#fff",color:a.variant==="primary"?"#fff":"#333"},onClick:u=>a.onClick?.(u,{hide:_}),children:a.text},s))})]})},Et=(()=>{let e=null;return()=>(e||(e=document.createElement("div"),e.id=`jolibox-ui-modal-container-${Math.random().toString(36).substring(2,15)}`,document.body.appendChild(e)),e)})(),Pt=e=>{const t=Et();let n=null,r=!1,o=!1;const _=()=>{o||(r=!1,e.onClose&&e.onClose(),a())},i=()=>window.innerWidth>window.innerHeight,a=()=>{ve(h(St,{ref:u=>{n=u},isOpen:r,onClose:_,height:i()?"90vh":"50vh",backdropColor:e.backdropColor,children:h(Nt,{...e,onClose:_})}),t)},s=()=>{!o&&r&&a()};return window.addEventListener("resize",s),a(),{show:()=>{o||(r=!0,a(),setTimeout(()=>{n&&(n.show(),e.onOpen&&e.onOpen())},0))},hide:()=>{o||n&&n.hide()},isOpen:()=>r,destroy:()=>{o=!0,window.removeEventListener("resize",s),n&&n.hide(),setTimeout(()=>{t.parentNode&&(ve(null,t),t.remove())},300)}}},Ht=(e,t={threshold:.6})=>{const n=Z(null),r=Z(!1),o=S(_=>{const[i]=_;i.isIntersecting&&!r.current?(r.current=!0,e()):i.isIntersecting||(r.current=!1)},[e]);return q(()=>{if(n.current){const _=new IntersectionObserver(o,t);return _.observe(n.current),()=>{n.current&&_.unobserve(n.current)}}},[o,t]),n};function Rt({elementTag:e="Image",src:t="",children:n,handleExposure:r,className:o,imgStyle:_,...i}){const a=Ht(()=>{t&&r()});return e==="Image"?h("div",{className:o,style:{borderRadius:"8px"},children:R("img",{...i,ref:a,src:t??"",style:{display:"block",width:"100%",height:"100%",objectFit:"cover",maxWidth:"100%",maxHeight:"100%",borderRadius:"8px",..._||{}}})}):h("div",{...i,ref:a,className:o,children:n})}const Xe=({children:e,fluid:t=!1,className:n="",style:r={},...o})=>{const _={width:"100%",marginLeft:"auto",marginRight:"auto",paddingLeft:"15px",paddingRight:"15px",boxSizing:"border-box",maxWidth:t?"100%":void 0,...r};return h("div",{className:n,style:_,...o,children:e})},et=({children:e,gutter:t=0,justify:n="start",align:r="top",className:o="",style:_={},...i})=>{const a={start:"flex-start",end:"flex-end",center:"center","space-around":"space-around","space-between":"space-between"},s={top:"flex-start",middle:"center",bottom:"flex-end"},u={display:"flex",flexWrap:"wrap",boxSizing:"border-box",justifyContent:a[n],alignItems:s[r],..._};if(t){const l=Array.isArray(t)?t[0]:t,c=Array.isArray(t)?t[1]:0;l>0&&(u.marginLeft=`-${l/2}px`,u.marginRight=`-${l/2}px`),c>0&&(u.marginTop=`-${c/2}px`,u.marginBottom=`-${c/2}px`)}const p=t?At(e,t):e;return h("div",{className:o,style:u,...i,children:p})};function At(e,t){if(!e)return null;const n=Array.isArray(t)?t[0]:t,r=Array.isArray(t)?t[1]:0;return Array.isArray(e)?e.map((o,_)=>o&&typeof o=="object"&&"type"in o?R(o.type,{...o.props,style:{...o.props.style||{},paddingLeft:n>0?`${n/2}px`:void 0,paddingRight:n>0?`${n/2}px`:void 0,paddingTop:r>0?`${r/2}px`:void 0,paddingBottom:r>0?`${r/2}px`:void 0},key:o.key||_}):o):e&&typeof e=="object"&&"type"in e?R(e.type,{...e.props,style:{...e.props.style||{},paddingLeft:n>0?`${n/2}px`:void 0,paddingRight:n>0?`${n/2}px`:void 0,paddingTop:r>0?`${r/2}px`:void 0,paddingBottom:r>0?`${r/2}px`:void 0}}):e}const Tt=({children:e,span:t,offset:n,xs:r,sm:o,md:_,lg:i,xl:a,className:s="",style:u={},...p})=>{const l={position:"relative",width:"100%",paddingLeft:"15px",paddingRight:"15px",boxSizing:"border-box",...u};if(t!==void 0){const c=t/24*100;l.flex=`0 0 ${c}%`,l.maxWidth=`${c}%`}return n!==void 0&&(l.marginLeft=`${n/24*100}%`),h("div",{className:s,style:l,...p,children:e})},Dt=({game:e,layerName:t,routeMode:n,onGameClick:r})=>{const o=S(i=>{i.preventDefault(),r?.(e)},[r,e]),_=S(()=>{},[e,t]);return h(Tt,{span:8,className:"relative px-[4px] box-border mb-[8px]",style:{marginBottom:"8px"},onClick:o,role:"button",tabIndex:0,onTouchEnd:o,children:[h("div",{className:"relative w-full mb-[2px] ion-no-margin",children:h(Rt,{src:e.logo??e.cover??"",className:"w-full h-full absolute top-0 left-0 aspect-square rounded-[8px] object-cover",style:{display:"block",objectFit:"cover"},handleExposure:_})}),h("div",{className:"block text-white max-w-full text-[15px] leading-[1.2] overflow-hidden whitespace-nowrap text-ellipsis font-normal break-words",style:{display:"block",overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap",wordBreak:"break-word",color:"white",maxWidth:"100%",fontSize:"15px",lineHeight:1.2,fontWeight:"normal"},children:e.name})]},e.gameId)},Mt=({list:e,routeMode:t,layerName:n,onGameClick:r,...o})=>h(Xe,{className:"w-full max-w-[440px] mx-auto flex-grow overflow-y-auto",children:h(et,{gutter:8,className:"flex-wrap",children:e?.map(_=>h(Dt,{game:_,routeMode:t,layerName:n,onGameClick:r},_.gameId))})}),Ot=ut(Mt);var D=(e=>(e.Dismiss="DISMISS",e.Quit="QUIT",e))(D||{});const Ut=e=>{const{games:t,title:n,buttons:r,onClose:o}=e,_=S(a=>{o?.({type:a.type===D.Quit?"quit":"dismiss"})},[]),i=S(a=>{o?.({type:"navigate",data:{game:a}})},[o]);return t.length?h("div",{className:"recommend-panel",style:{backgroundColor:"#1a1a1a",width:"100%",height:"100%"},children:h("div",{className:"container",style:{height:"100%",display:"flex",flexDirection:"column",position:"relative"},children:[h("p",{className:"text-white text-[18px] leading-[24px] text-center py-[20px] px-[10px]",style:{color:"#ffffff",fontSize:"18px",lineHeight:"24px",textAlign:"center",paddingTop:"20px",paddingBottom:"20px",paddingLeft:"10px",paddingRight:"10px"},children:n}),h("div",{style:{flex:1,overflow:"auto",marginBottom:"88px"},children:h(Ot,{list:t||[],routeMode:"REDIRECT",layerName:"RecommendedGuide",onGameClick:i})}),h("div",{className:"pb-[16px] px-[16px] w-full",style:{position:"fixed",bottom:"32px",left:"0",right:"0",width:"100%",maxWidth:"440px",margin:"0 auto",background:"inherit",paddingTop:"16px"},children:h(Xe,{children:h(et,{gutter:10,children:(r??[]).map((a,s)=>h("div",{style:{flex:"0 0 50%",boxSizing:"border-box"},children:h("button",{style:{width:"100%",height:"40px",borderRadius:"21px",whiteSpace:"nowrap",lineHeight:"40px",paddingLeft:"8px",paddingRight:"8px",border:"1px solid",borderColor:a.type===D.Quit?"#ffffff30":"#7817FF",backgroundColor:a.type===D.Quit?"#ffffff2c":"#7817FF",color:(a.type===D.Quit,"#fff"),cursor:"pointer",flex:1,textAlign:"center",fontSize:"14px",fontWeight:"normal",outline:"none",overflow:"hidden",textOverflow:"ellipsis"},className:`h-[40px] rounded-[21px] whitespace-nowrap leading-[40px] px-[8px] border-solid border-[1px] flex-1 bg-[#ffffff2c] ${a.type===D.Quit,"active:border-[#7E41FF] border-[#ffffff30]"}`,onClick:()=>_(a),children:a.text})},s))})})})]})}):h(A,{})},Wt=e=>{const t=Pt({title:e.title,content:h(Ut,{games:e.games,title:e.title,buttons:e.buttons,onClose:e.onClose}),backdropColor:"#1a1a1a",placement:"bottom",noHeader:!0,padding:"0px",onClose:()=>{console.log("onClose")},onOpen:e.onOpen});return t.show(),t};exports.createRecommendModal=Wt;
+//# sourceMappingURL=index.cjs.js.map