@kodiak-finance/orderly-ui-scaffold 2.8.15-rc.0 → 2.8.16-rc.0

package/dist/index.d.ts

@@ -1,489 +0,0 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
-import * as react from 'react';
-import react__default, { ReactNode, HTMLAttributeAnchorTarget, FC, PropsWithChildren } from 'react';
-import * as _kodiak_finance_orderly_types from '@kodiak-finance/orderly-types';
-import { NetworkId, API } from '@kodiak-finance/orderly-types';
-import { WsNetworkStatus } from '@kodiak-finance/orderly-hooks';
-import * as _kodiak_finance_orderly_i18n from '@kodiak-finance/orderly-i18n';
-import { LocaleContextState } from '@kodiak-finance/orderly-i18n';
-
-declare const AccountMenuWidget: () => react_jsx_runtime.JSX.Element;
-
-type LeftNavProps = {
-    /** custom leading */
-    leading?: ReactNode;
-    menus?: LeftNavItem[];
-    twitterUrl?: string;
-    telegramUrl?: string;
-    discordUrl?: string;
-    duneUrl?: string;
-    feedbackUrl?: string;
-    customLeftNav?: ReactNode;
-};
-type LeftNavItem = {
-    name: string;
-    href: string;
-    target?: string;
-    icon?: ReactNode;
-    trailing?: ReactNode;
-    customRender?: (option: {
-        name: string;
-        href: string;
-        isActive?: boolean;
-    }) => React.ReactNode;
-    /**
-     * if true, this item will only be shown in the main account
-     * @default false
-     **/
-    onlyInMainAccount?: boolean;
-};
-
-type MainNavItem = {
-    id?: string;
-    testid?: string;
-    name: string;
-    href: string;
-    target?: HTMLAttributeAnchorTarget;
-    icon?: string | react__default.ReactElement;
-    activeIcon?: string | react__default.ReactElement;
-    tag?: string;
-    description?: string;
-    disabled?: boolean;
-    children?: MainNavItem[];
-    className?: string;
-    asChild?: boolean;
-    /**
-     * if true, the item will be shown as a submenu in mobile
-     */
-    isSubMenuInMobile?: boolean;
-    /**
-     * if provided, the item is a submenu in mobile, and this will be the a back nav
-     */
-    subMenuBackNav?: {
-        name: string;
-        href: string;
-    };
-    /**
-     * if true, the item will be shown as a home page in mobile
-     */
-    isHomePageInMobile?: boolean;
-    customRender?: (option: {
-        name: string;
-        href: string;
-        isActive?: boolean;
-    }) => react__default.ReactNode;
-    /**
-     * if true, this item will only be shown in the main account
-     * @default false
-     **/
-    onlyInMainAccount?: boolean;
-    tooltipConfig?: {
-        /**
-         * if true, the tooltip will be shown on first visit
-         */
-        showOnFirstVisit?: boolean;
-        /**
-         * the text to show in the tooltip
-         */
-        text?: string;
-    };
-};
-
-type MainNavClassNames = {
-    root?: string;
-    navItem?: string;
-    subMenu?: string;
-};
-
-declare const LeftNavWidget: FC<LeftNavProps>;
-
-type BottomNavItem = {
-    name: string;
-    href: string;
-    activeIcon: ReactNode;
-    inactiveIcon: ReactNode;
-};
-type BottomNavProps$1 = {
-    mainMenus?: BottomNavItem[];
-    current?: string;
-    onRouteChange?: RouterAdapter["onRouteChange"];
-};
-declare const BottomNavWidget: react__default.FC<BottomNavProps$1>;
-
-type FooterReturns = {
-    wsStatus: WsNetworkStatus;
-};
-
-type FooterProps = {
-    telegramUrl?: string;
-    twitterUrl?: string;
-    discordUrl?: string;
-    trailing?: ReactNode;
-};
-declare const FooterWidget: react__default.FC<FooterProps>;
-
-declare const Footer: FC<FooterReturns & FooterProps>;
-
-type SideMenuItem = {
-    name: string;
-    icon?: react__default.ReactNode;
-    href?: string;
-    disabled?: boolean;
-    onClick?: () => void;
-    hide?: boolean;
-};
-type SideBarProps = {
-    title?: react__default.ReactNode;
-    items?: SideMenuItem[];
-    open?: boolean;
-    onOpenChange?: (open: boolean) => void;
-    onItemSelect?: (item: SideMenuItem) => void;
-    current?: string;
-    className?: string;
-    maxWidth?: number;
-    minWidth?: number;
-    style?: react__default.CSSProperties;
-};
-declare const SideBar: react__default.FC<SideBarProps>;
-
-declare const SideNavbarWidget: react__default.FC<Partial<SideBarProps>>;
-
-type RouteOption = {
-    href: string;
-    name: string;
-    scope?: string;
-    target?: string;
-};
-type RouterAdapter = {
-    onRouteChange: (option: RouteOption) => void;
-    currentPath?: string;
-};
-type ScaffoldState = {
-    routerAdapter?: RouterAdapter;
-    expanded?: boolean;
-    setExpand: (expand: boolean) => void;
-    checkChainSupport: (chainId: number | string) => boolean;
-    topNavbarHeight: number;
-    footerHeight: number;
-    announcementHeight: number;
-};
-declare const ScaffoldContext: react.Context<ScaffoldState>;
-declare const useScaffoldContext: () => ScaffoldState;
-
-type ScaffoldProps = {
-    /**
-     * custom left sidebar component, only works on desktop
-     * if provided, the layout will use this component over the default sidebar component
-     */
-    leftSidebar?: ReactNode;
-    /**
-     * custom left sidebar props, only works on desktop
-     */
-    leftSideProps?: SideBarProps;
-    /**
-     * custom left nav props, only works on mobile
-     */
-    leftNavProps?: LeftNavProps;
-    /**
-     * custom top bar component
-     */
-    topBar?: ReactNode;
-    /**
-     * custom top nav props
-     */
-    mainNavProps?: MainNavWidgetProps;
-    /**
-     * custom bottom nav component, only works on mobile
-     */
-    bottomNav?: ReactNode;
-    /**
-     * custom bottom nav component, only works on mobile
-     */
-    bottomNavProps?: BottomNavProps$1;
-    /**
-     * custom footer component, only works on desktop
-     */
-    footer?: ReactNode;
-    /**
-     * custom footer props, only works on desktop
-     */
-    footerProps?: FooterProps;
-    routerAdapter?: RouterAdapter;
-    classNames?: {
-        root?: string;
-        container?: string;
-        content?: string;
-        body?: string;
-        leftSidebar?: string;
-        topNavbar?: string;
-        footer?: string;
-        bottomNav?: string;
-    };
-};
-declare const Scaffold: react__default.FC<PropsWithChildren<ScaffoldProps>>;
-
-type BottomNavProps = {
-    mainMenus?: BottomNavItem[];
-    current?: string | string[];
-    onRouteChange?: RouterAdapter["onRouteChange"];
-};
-declare const BottomNav: react__default.FC<BottomNavProps>;
-
-declare const useLeftNavState: () => {};
-type LeftNavState = ReturnType<typeof useLeftNavState>;
-
-type LeftNavUIProps = LeftNavProps & LeftNavState & {
-    className?: string;
-    logo?: {
-        src: string;
-        alt: string;
-    };
-    routerAdapter?: RouterAdapter;
-    showSubAccount?: boolean;
-};
-declare const LeftNavUI: FC<LeftNavUIProps>;
-
-declare enum CampaignPositionEnum {
-    menuLeading = "menuLeading",
-    menuTailing = "menuTailing",
-    navTailing = "navTailing"
-}
-
-type MainNavWidgetProps = {
-    leading?: ReactNode;
-    trailing?: ReactNode;
-    logo?: {
-        src: string;
-        alt: string;
-    };
-    mainMenus?: MainNavItem[];
-    /** @deprecated use mainMenus instead */
-    campaigns?: MainNavItem;
-    /** @deprecated use mainMenus instead */
-    campaignPosition?: CampaignPositionEnum;
-    /**
-     * initial menu path, if it has submenus, use array
-     * @type string | string[]
-     */
-    initialMenu?: string | string[];
-    onItemClick?: (options: {
-        href: string;
-        name: string;
-        scope?: string;
-    }) => void;
-    /** only works on mobile */
-    leftNav?: LeftNavProps;
-    customLeftNav?: ReactNode;
-    className?: string;
-    classNames?: {
-        root?: string;
-        mainNav?: MainNavClassNames;
-        logo?: string;
-        account?: string;
-        chains?: string;
-        campaignButton?: string;
-    };
-    /** custom render main nav */
-    customRender?: (components: {
-        /** Logo or title component (desktop & mobile) */
-        title?: ReactNode;
-        /** Language selection component (desktop & mobile) */
-        languageSwitcher?: ReactNode;
-        /** Sub-account component (desktop & mobile) */
-        subAccount?: ReactNode;
-        /** Device linking component (desktop & mobile) */
-        linkDevice?: ReactNode;
-        /** Chain selection menu (desktop & mobile) */
-        chainMenu?: ReactNode;
-        /** Wallet connection component (desktop & mobile) */
-        walletConnect?: ReactNode;
-        /** Main navigation menu (desktop & mobile) */
-        mainNav?: ReactNode;
-        /** Account summary component (desktop only) */
-        accountSummary?: ReactNode;
-        /** Left navigation component (mobile only) */
-        leftNav?: ReactNode;
-        /** QR code scanner component (mobile only) */
-        scanQRCode?: ReactNode;
-    }) => ReactNode;
-};
-declare const MainNavWidget: react__default.FC<PropsWithChildren<MainNavWidgetProps>>;
-
-type MainNavMobileProps = {
-    current?: string;
-    subItems?: {
-        name: string;
-        href: string;
-    }[];
-    routerAdapter?: RouterAdapter;
-} & MainNavWidgetProps;
-declare const MainNavMobile: FC<MainNavMobileProps>;
-
-declare const AccountSummaryWidget: react__default.FC;
-
-declare const ChainMenuWidget: () => react_jsx_runtime.JSX.Element;
-
-type UseChainMenuScriptReturn = ReturnType<typeof useChainMenuScript>;
-declare const useChainMenuScript: () => {
-    isConnected: boolean;
-    currentChainId: number | undefined;
-    wrongNetwork: boolean;
-    disabledConnect: boolean;
-    accountStatus: _kodiak_finance_orderly_types.AccountStatusEnum;
-    networkId: NetworkId;
-    open: boolean;
-    onOpenChange: react.Dispatch<react.SetStateAction<boolean>>;
-    hide: () => void;
-    onChainChangeBefore: () => void;
-    onChainChangeAfter: () => void;
-    loading: boolean;
-    setCurrentChainId: (chainId: number | undefined) => void;
-};
-
-declare const ChainMenu: (props: UseChainMenuScriptReturn) => react_jsx_runtime.JSX.Element;
-
-type SubAccountWidgetProps = {
-    customTrigger?: ReactNode;
-};
-declare const SubAccountWidget: FC<SubAccountWidgetProps>;
-
-type SubAccountScriptReturn = ReturnType<typeof SubAccountScript>;
-declare const SubAccountScript: () => {
-    userAddress: string | undefined;
-    mainAccount: {
-        id: string;
-        userAddress: string;
-        holding: API.Holding[];
-        accountValue: number;
-    } | undefined;
-    currentAccountId: string | undefined;
-    open: boolean;
-    onOpenChange: react.Dispatch<react.SetStateAction<boolean>>;
-    popup: {
-        mode: string;
-    };
-    createSubAccount: (nickName: string) => Promise<any>;
-    subAccounts: {
-        accountValue: number;
-        id: string;
-        description: string;
-        holding: API.Holding[];
-    }[];
-    onSwitch: (accountId: string) => Promise<void>;
-};
-
-declare function SubAccountUI(props: SubAccountScriptReturn & {
-    customTrigger?: ReactNode;
-}): react_jsx_runtime.JSX.Element;
-
-interface MaintenanceTipInterface {
-    tipsContent: string;
-    showTips: boolean;
-    closeTips: () => void;
-    showDialog: boolean;
-    dialogContent?: string;
-}
-
-declare const MaintenanceTipsUI: (props: MaintenanceTipInterface) => react_jsx_runtime.JSX.Element;
-
-declare const MaintenanceTipsWidget: () => react_jsx_runtime.JSX.Element;
-
-type AnnouncementScriptOptions = {
-    hideTips?: boolean;
-};
-type AnnouncementScriptReturn = ReturnType<typeof useAnnouncementScript>;
-declare const useAnnouncementScript: (options?: AnnouncementScriptOptions) => {
-    maintenanceDialogInfo: string | undefined;
-    tips: API.AnnouncementRow[];
-    closeTips: () => void;
-    showAnnouncement: boolean;
-};
-
-type AnnouncementProps = AnnouncementScriptReturn & {
-    style?: react__default.CSSProperties;
-    className?: string;
-    hideTips?: boolean;
-};
-declare const AnnouncementUI: react__default.FC<Readonly<AnnouncementProps>>;
-
-type AnnouncementWidgetProps = Pick<AnnouncementProps, "style" | "className" | "hideTips">;
-declare const AnnouncementWidget: react__default.FC<AnnouncementWidgetProps>;
-
-type UseRestrictedInfoScriptReturn = ReturnType<typeof useRestrictedInfoScript> & {
-    brokerName?: string;
-};
-declare const useRestrictedInfoScript: () => {
-    restrictedInfo: {
-        ip: string;
-        invalidRegions: string[];
-        restrictedOpen: boolean;
-        content: react.ReactNode | ((data: {
-            ip: string;
-            brokerName: string;
-        }) => react.ReactNode);
-        canUnblock: boolean;
-        accessRestricted: any;
-        setAccessRestricted: (value: boolean | undefined) => void;
-    };
-    brokerName: string;
-    container: react.RefObject<HTMLDivElement>;
-    mutiLine: boolean;
-    agree: boolean;
-    setAgree: react.Dispatch<react.SetStateAction<boolean>>;
-};
-
-type RestrictedInfoProps = UseRestrictedInfoScriptReturn & {
-    className?: string;
-};
-declare const RestrictedInfo: FC<RestrictedInfoProps>;
-
-type RestrictedInfoWidgetProps = Pick<RestrictedInfoProps, "className">;
-declare const RestrictedInfoWidget: FC<RestrictedInfoWidgetProps>;
-
-type MainLogoProps = {
-    src?: string;
-    alt?: string;
-};
-declare const MainLogo: FC<MainLogoProps>;
-
-type LanguageSwitcherScriptReturn = ReturnType<typeof useLanguageSwitcherScript>;
-type LanguageSwitcherScriptOptions = Pick<LocaleContextState, "popup"> & {
-    open?: boolean;
-    onOpenChange?: (open: boolean) => void;
-};
-declare const useLanguageSwitcherScript: (options?: LanguageSwitcherScriptOptions) => {
-    open: boolean;
-    onOpenChange: (open: boolean) => void;
-    languages: _kodiak_finance_orderly_i18n.Language[];
-    selectedLang: string;
-    onLangChange: (lang: string, displayName: string) => Promise<void>;
-    loading: boolean;
-    popup: {
-        mode: _kodiak_finance_orderly_i18n.PopupMode;
-        className?: string;
-        style?: React.CSSProperties;
-    };
-};
-
-type LanguageSwitcherWidgetProps = LanguageSwitcherScriptOptions;
-declare const LanguageSwitcherWidget: (props: LanguageSwitcherWidgetProps) => react_jsx_runtime.JSX.Element;
-
-type LanguageSwitcherProps = LanguageSwitcherScriptReturn;
-declare const LanguageSwitcher: FC<LanguageSwitcherProps>;
-
-declare const ScanQRCodeWidget: react__default.FC;
-
-type UseScanQRCodeScriptReturn = ReturnType<typeof useScanQRCodeScript>;
-declare const useScanQRCodeScript: () => {
-    open: boolean;
-    onOpenChange: react.Dispatch<react.SetStateAction<boolean>>;
-    showDialog: () => void;
-    hideDialog: () => void;
-    onScanSuccess: (url: string) => void;
-    showScanTooltip: any;
-};
-
-type ScanQRCodeProps = UseScanQRCodeScriptReturn;
-declare const ScanQRCode: FC<ScanQRCodeProps>;
-
-export { AccountMenuWidget, AccountSummaryWidget, AnnouncementUI, AnnouncementWidget, type AnnouncementWidgetProps, BottomNav, type BottomNavProps$1 as BottomNavProps, BottomNavWidget, CampaignPositionEnum, ChainMenu, ChainMenuWidget, Footer, type FooterProps, FooterWidget, LanguageSwitcher, type LanguageSwitcherProps, type LanguageSwitcherScriptReturn, LanguageSwitcherWidget, type LanguageSwitcherWidgetProps, type LeftNavItem, type LeftNavProps, LeftNavUI, LeftNavWidget, MainLogo, MainNavMobile, MainNavWidget, type MainNavWidgetProps, MaintenanceTipsUI, MaintenanceTipsWidget, RestrictedInfo, RestrictedInfoWidget, type RouteOption, type RouterAdapter, Scaffold, ScaffoldContext, type ScaffoldProps, ScanQRCode, ScanQRCodeWidget, SideBar, type SideBarProps, type SideMenuItem, SideNavbarWidget, SubAccountScript, SubAccountUI, SubAccountWidget, useAnnouncementScript, useLanguageSwitcherScript, useRestrictedInfoScript, useScaffoldContext, useScanQRCodeScript };

package/dist/styles.css

@@ -1 +0,0 @@
-.oui-custom-scrollbar::-webkit-scrollbar{width:6px;height:6px}.oui-custom-scrollbar::-webkit-scrollbar-track{background-color:transparent;border-radius:4px;padding-top:20px}.oui-custom-scrollbar::-webkit-scrollbar-thumb{border-radius:3px;border:1px dashed transparent;background-color:rgb(var(--oui-color-base-7));background-clip:padding-box}.oui-custom-scrollbar::-webkit-scrollbar-thumb:hover{background:rgb(var(--oui-color-base-5));border-radius:3px}.oui-custom-scrollbar::-webkit-scrollbar-corner{background-color:transparent}.oui-pointer-events-none{pointer-events:none}.oui-invisible{visibility:hidden}.oui-fixed{position:fixed}.oui-absolute{position:absolute}.oui-relative{position:relative}.oui-sticky{position:sticky}.oui-inset-0{inset:0}.-oui-right-\[1px\]{right:-1px}.-oui-top-\[1px\]{top:-1px}.oui-bottom-0{bottom:0}.oui-bottom-6{bottom:1.5rem}.oui-bottom-\[-1\.5px\]{bottom:-1.5px}.oui-left-0{left:0}.oui-left-6{left:1.5rem}.oui-left-\[-1\.5px\]{left:-1.5px}.oui-left-\[30px\]{left:30px}.oui-right-0{right:0}.oui-right-1{right:.25rem}.oui-right-2{right:.5rem}.oui-right-\[-1\.5px\]{right:-1.5px}.oui-top-0{top:0}.oui-top-1{top:.25rem}.oui-top-2\/4{top:50%}.oui-top-\[-1\.5px\]{top:-1.5px}.oui-z-0{z-index:0}.oui-z-10{z-index:10}.oui-z-50{z-index:50}.oui-z-\[1\]{z-index:1}.oui-z-\[2\]{z-index:2}.oui-mx-1{margin-left:.25rem;margin-right:.25rem}.oui-mx-4{margin-left:1rem;margin-right:1rem}.oui-mx-auto{margin-left:auto;margin-right:auto}.oui-my-3{margin-top:.75rem;margin-bottom:.75rem}.-oui-ml-2{margin-left:-.5rem}.oui-mb-1{margin-bottom:.25rem}.oui-mb-4{margin-bottom:1rem}.oui-ml-1{margin-left:.25rem}.oui-ml-2{margin-left:.5rem}.oui-ml-auto{margin-left:auto}.oui-mr-1{margin-right:.25rem}.oui-mt-2{margin-top:.5rem}.oui-mt-3{margin-top:.75rem}.oui-mt-5{margin-top:1.25rem}.oui-mt-\[6px\]{margin-top:6px}.oui-box-content{box-sizing:content-box}.oui-inline-block{display:inline-block}.oui-flex{display:flex}.oui-inline-flex{display:inline-flex}.oui-grid{display:grid}.oui-hidden{display:none}.oui-size-4{width:1rem;height:1rem}.oui-size-6{width:1.5rem;height:1.5rem}.oui-size-8{width:2rem;height:2rem}.oui-size-\[18px\]{width:18px;height:18px}.oui-size-\[20px\]{width:20px;height:20px}.oui-h-10{height:2.5rem}.oui-h-4{height:1rem}.oui-h-6{height:1.5rem}.oui-h-8{height:2rem}.oui-h-\[120px\]{height:120px}.oui-h-\[18px\]{height:18px}.oui-h-\[220px\]{height:220px}.oui-h-\[240px\]{height:240px}.oui-h-\[2px\]{height:2px}.oui-h-\[32px\]{height:32px}.oui-h-\[34px\]{height:34px}.oui-h-\[44px\]{height:44px}.oui-h-\[calc\(100vh-260px\)\]{height:calc(100vh - 260px)}.oui-h-full{height:100%}.oui-max-h-\[200px\]{max-height:200px}.oui-max-h-\[348px\]{max-height:348px}.oui-max-h-full{max-height:100%}.oui-min-h-10{min-height:2.5rem}.oui-min-h-\[20px\]{min-height:20px}.oui-min-h-\[48px\]{min-height:48px}.oui-min-h-\[50px\]{min-height:50px}.oui-min-h-full{min-height:100%}.oui-w-10{width:2.5rem}.oui-w-11{width:2.75rem}.oui-w-4{width:1rem}.oui-w-6{width:1.5rem}.oui-w-64{width:16rem}.oui-w-8{width:2rem}.oui-w-\[180px\]{width:180px}.oui-w-\[18px\]{width:18px}.oui-w-\[220px\]{width:220px}.oui-w-\[240px\]{width:240px}.oui-w-\[260px\]{width:260px}.oui-w-\[276px\]{width:276px}.oui-w-\[300px\]{width:300px}.oui-w-\[320px\]{width:320px}.oui-w-\[360px\]{width:360px}.oui-w-\[456px\]{width:456px}.oui-w-\[calc\(\(100\%_-_4px\)\/2\)\]{width:calc(50% - 2px)}.oui-w-\[calc\(100\%-60px\)\]{width:calc(100% - 60px)}.oui-w-fit{width:-moz-fit-content;width:fit-content}.oui-w-full{width:100%}.oui-min-w-\[1018px\]{min-width:1018px}.oui-min-w-\[120px\]{min-width:120px}.oui-min-w-\[994px\]{min-width:994px}.oui-max-w-64{max-width:16rem}.oui-max-w-\[188px\]{max-width:188px}.oui-max-w-full{max-width:100%}.oui-flex-1{flex:1 1 0%}.oui-flex-none{flex:none}.oui-flex-shrink-0,.oui-shrink-0{flex-shrink:0}.oui-basis-full{flex-basis:100%}.-oui-translate-x-1\/2{--tw-translate-x:-50%}.-oui-translate-x-1\/2,.-oui-translate-y-2\/4{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-oui-translate-y-2\/4{--tw-translate-y:-50%}.oui-translate-x-3{--tw-translate-x:0.75rem}.oui-translate-x-3,.oui-translate-y-1{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.oui-translate-y-1{--tw-translate-y:0.25rem}.-oui-rotate-180{--tw-rotate:-180deg}.-oui-rotate-180,.-oui-rotate-90{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-oui-rotate-90{--tw-rotate:-90deg}.oui-rotate-90{--tw-rotate:90deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.oui-transform-gpu{transform:translate3d(var(--tw-translate-x),var(--tw-translate-y),0) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}@keyframes oui-scan-qr-code{0%{transform:translateY(0)}50%{transform:translateY(320px)}to{transform:translateY(0)}}.oui-animate-scan-qr-code{animation:oui-scan-qr-code 6s linear infinite}@keyframes oui-spin{to{transform:rotate(1turn)}}.oui-animate-spin{animation:oui-spin 1s linear infinite}.oui-cursor-not-allowed{cursor:not-allowed}.oui-cursor-pointer{cursor:pointer}.oui-flex-row{flex-direction:row}.oui-flex-col{flex-direction:column}.oui-flex-wrap{flex-wrap:wrap}.oui-flex-nowrap{flex-wrap:nowrap}.oui-items-start{align-items:flex-start}.oui-items-center{align-items:center}.oui-justify-start{justify-content:flex-start}.oui-justify-center{justify-content:center}.oui-justify-between{justify-content:space-between}.oui-justify-around{justify-content:space-around}.oui-gap-0{gap:0}.oui-gap-1{gap:.25rem}.oui-gap-2{gap:.5rem}.oui-gap-3{gap:.75rem}.oui-gap-4{gap:1rem}.oui-gap-6{gap:1.5rem}.oui-gap-\[2px\]{gap:2px}.oui-gap-x-1\.5{-moz-column-gap:.375rem;column-gap:.375rem}.oui-gap-x-\[6px\]{-moz-column-gap:6px;column-gap:6px}.oui-gap-x-px{-moz-column-gap:1px;column-gap:1px}.oui-space-x-2>:not([hidden])~:not([hidden]){--tw-space-x-reverse:0;margin-right:calc(.5rem*var(--tw-space-x-reverse));margin-left:calc(.5rem*(1 - var(--tw-space-x-reverse)))}.oui-space-y-4>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(1rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1rem*var(--tw-space-y-reverse))}.oui-space-y-\[2px\]>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(2px*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(2px*var(--tw-space-y-reverse))}.oui-overflow-auto{overflow:auto}.oui-overflow-hidden{overflow:hidden}.oui-overflow-y-auto{overflow-y:auto}.oui-whitespace-nowrap{white-space:nowrap}.oui-break-normal{overflow-wrap:normal;word-break:normal}.oui-break-words{overflow-wrap:break-word}.oui-break-all{word-break:break-all}.oui-rounded{border-radius:var(--oui-rounded,.25rem)}.oui-rounded-2xl{border-radius:var(--oui-rounded-2xl,1rem)}.oui-rounded-\[6px\]{border-radius:6px}.oui-rounded-full{border-radius:var(--oui-rounded-full,9999px)}.oui-rounded-lg{border-radius:var(--oui-rounded-lg,.5rem)}.oui-rounded-md{border-radius:var(--oui-rounded-md,.375rem)}.oui-rounded-xl{border-radius:var(--oui-rounded-xl,.75rem)}.oui-rounded-t-\[6px\]{border-top-left-radius:6px;border-top-right-radius:6px}.oui-rounded-bl-\[6px\]{border-bottom-left-radius:6px}.oui-rounded-br-\[3px\]{border-bottom-right-radius:3px}.oui-rounded-br-none{border-bottom-right-radius:0}.oui-rounded-tl-none{border-top-left-radius:0}.oui-border{border-width:1px}.oui-border-t{border-top-width:1px}.oui-border-\[\#38E2FE\]{--tw-border-opacity:1;border-color:rgb(56 226 254/var(--tw-border-opacity,1))}.oui-border-base-6{--tw-border-opacity:1;border-color:rgb(var(--oui-color-base-6)/var(--tw-border-opacity,1))}.oui-border-base-contrast-20{border-color:rgb(var(--oui-color-base-foreground)/.2)}.oui-border-line{border-color:rgb(var(--oui-color-line,255 255 255)/.08)}.oui-border-line-12{border-color:rgb(var(--oui-color-line,255 255 255)/.12)}.oui-border-line-6{border-color:rgb(var(--oui-color-line,255 255 255)/.06)}.oui-bg-\[\#38E2FE\]{--tw-bg-opacity:1;background-color:rgb(56 226 254/var(--tw-bg-opacity,1))}.oui-bg-\[rgba\(232\,136\,0\,0\.15\)\]{background-color:rgba(232,136,0,.15)}.oui-bg-base-10{--tw-bg-opacity:1;background-color:rgb(var(--oui-color-base-10)/var(--tw-bg-opacity,1))}.oui-bg-base-5{--tw-bg-opacity:1;background-color:rgb(var(--oui-color-base-5)/var(--tw-bg-opacity,1))}.oui-bg-base-6{--tw-bg-opacity:1;background-color:rgb(var(--oui-color-base-6)/var(--tw-bg-opacity,1))}.oui-bg-base-7{--tw-bg-opacity:1;background-color:rgb(var(--oui-color-base-7)/var(--tw-bg-opacity,1))}.oui-bg-base-8{--tw-bg-opacity:1;background-color:rgb(var(--oui-color-base-8)/var(--tw-bg-opacity,1))}.oui-bg-base-9{--tw-bg-opacity:1;background-color:rgb(var(--oui-color-base-9)/var(--tw-bg-opacity,1))}.oui-bg-primary\/15{background-color:rgb(var(--oui-color-primary)/.15)}.oui-bg-warning-darken\/10{background-color:rgb(var(--oui-color-warning-darken)/.1)}.oui-bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1))}.oui-bg-\[linear-gradient\(270deg\,rgb\(var\(--oui-gradient-brand-end\)\)_0\%\,rgb\(var\(--oui-gradient-brand-start\)\)_100\%\)\]{background-image:linear-gradient(270deg,rgb(var(--oui-gradient-brand-end)) 0,rgb(var(--oui-gradient-brand-start)) 100%)}.oui-bg-gradient-to-r{background-image:linear-gradient(to right,var(--tw-gradient-stops))}.oui-from-\[rgb\(var\(--oui-gradient-brand-start\)_\/_0\.12\)\]{--tw-gradient-from:rgb(var(--oui-gradient-brand-start)/0.12) var(--tw-gradient-from-position);--tw-gradient-to:rgb(var(--oui-gradient-brand-start)/0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}.oui-to-\[rgb\(var\(--oui-gradient-brand-end\)_\/_0\.12\)\]{--tw-gradient-to:rgb(var(--oui-gradient-brand-end)/0.12) var(--tw-gradient-to-position)}.\!oui-fill-base-6{fill:rgb(var(--oui-color-base-6)/1)!important}.oui-fill-\[rgba\(255\,255\,255\,0\.36\)\]{fill:hsla(0,0%,100%,.36)}.oui-fill-base-5{fill:rgb(var(--oui-color-base-5)/1)}.oui-fill-base-contrast-20{fill:rgb(var(--oui-color-base-foreground)/.2)}.oui-fill-base-contrast-36{fill:rgb(var(--oui-color-base-foreground)/.36)}.oui-fill-base-contrast-54{fill:rgb(var(--oui-color-base-foreground)/.54)}.oui-fill-danger-light{fill:rgb(var(--oui-color-danger-light)/1)}.oui-fill-success-light{fill:rgb(var(--oui-color-success-light)/1)}.oui-fill-warning-light{fill:rgb(var(--oui-color-warning-light)/1)}.oui-fill-white\/\[\.54\]{fill:hsla(0,0%,100%,.54)}.oui-p-0{padding:0}.oui-p-1{padding:.25rem}.oui-p-3{padding:.75rem}.oui-p-4{padding:1rem}.oui-p-5{padding:1.25rem}.oui-p-\[7px\]{padding:7px}.oui-px-1{padding-left:.25rem;padding-right:.25rem}.oui-px-2{padding-left:.5rem;padding-right:.5rem}.oui-px-3{padding-left:.75rem;padding-right:.75rem}.oui-px-4{padding-left:1rem;padding-right:1rem}.oui-px-5{padding-left:1.25rem;padding-right:1.25rem}.oui-px-\[6px\]{padding-left:6px;padding-right:6px}.oui-px-px{padding-left:1px;padding-right:1px}.oui-py-0\.5{padding-top:.125rem;padding-bottom:.125rem}.oui-py-1{padding-top:.25rem;padding-bottom:.25rem}.oui-py-2{padding-top:.5rem;padding-bottom:.5rem}.oui-py-4{padding-top:1rem;padding-bottom:1rem}.oui-py-5{padding-top:1.25rem;padding-bottom:1.25rem}.\!oui-pt-8{padding-top:2rem!important}.oui-pb-5{padding-bottom:1.25rem}.oui-pb-\[calc\(env\(safe-area-inset-bottom\)\)\]{padding-bottom:calc(env(safe-area-inset-bottom))}.oui-pb-\[env\(safe-area-inset-bottom\)\]{padding-bottom:env(safe-area-inset-bottom)}.oui-pl-1{padding-left:.25rem}.oui-pl-2{padding-left:.5rem}.oui-pr-9{padding-right:2.25rem}.oui-pr-\[5px\]{padding-right:5px}.oui-pr-\[6px\]{padding-right:6px}.oui-pt-2{padding-top:.5rem}.oui-text-left{text-align:left}.oui-text-center{text-align:center}.oui-text-2xl{font-size:var(--oui-font-size-2xl,1.5rem);line-height:2rem}.oui-text-2xs{font-size:var(--oui-font-size-2xs,.75rem);line-height:1.125rem}.oui-text-\[10px\]{font-size:10px}.oui-text-base{font-size:var(--oui-font-size-base,1rem);line-height:1.5rem}.oui-text-sm{font-size:var(--oui-font-size-sm,.875rem);line-height:1.25rem}.oui-text-xs{font-size:var(--oui-font-size-xs,calc(.875rem - 1px));line-height:1.25rem}.oui-font-bold{font-weight:700}.oui-font-medium{font-weight:500}.oui-font-semibold{font-weight:600}.oui-tabular-nums{--tw-numeric-spacing:tabular-nums;font-variant-numeric:var(--tw-ordinal) var(--tw-slashed-zero) var(--tw-numeric-figure) var(--tw-numeric-spacing) var(--tw-numeric-fraction)}.oui-leading-3{line-height:.75rem}.oui-leading-4{line-height:1rem}.oui-leading-\[18px\]{line-height:18px}.oui-leading-\[34px\]{line-height:34px}.oui-text-\[rgba\(0\,0\,0\,\.88\)\]{color:rgba(0,0,0,.88)}.oui-text-base-contrast{color:rgb(var(--oui-color-base-foreground)/.98)}.oui-text-base-contrast-20{color:rgb(var(--oui-color-base-foreground)/.2)}.oui-text-base-contrast-36{color:rgb(var(--oui-color-base-foreground)/.36)}.oui-text-base-contrast-54{color:rgb(var(--oui-color-base-foreground)/.54)}.oui-text-base-contrast-80{color:rgb(var(--oui-color-base-foreground)/.8)}.oui-text-black{--tw-text-opacity:1;color:rgb(0 0 0/var(--tw-text-opacity,1))}.oui-text-danger-light{--tw-text-opacity:1;color:rgb(var(--oui-color-danger-light)/var(--tw-text-opacity,1))}.oui-text-primary{--tw-text-opacity:1;color:rgb(var(--oui-color-primary)/var(--tw-text-opacity,1))}.oui-text-primary-light{--tw-text-opacity:1;color:rgb(var(--oui-color-primary-light)/var(--tw-text-opacity,1))}.oui-text-secondary\/\[0\.36\]{color:rgb(var(--oui-color-secondary)/.36)}.oui-text-success-light{--tw-text-opacity:1;color:rgb(var(--oui-color-success-light)/var(--tw-text-opacity,1))}.oui-text-warning-darken{--tw-text-opacity:1;color:rgb(var(--oui-color-warning-darken)/var(--tw-text-opacity,1))}.oui-text-warning-light{--tw-text-opacity:1;color:rgb(var(--oui-color-warning-light)/var(--tw-text-opacity,1))}.oui-underline{text-decoration-line:underline}.oui-opacity-0{opacity:0}.oui-shadow-\[0_0_8px_4px_rgba\(var\(--oui-gradient-brand-start\)\/0\.12\)\]{--tw-shadow:0 0 8px 4px rgba(var(--oui-gradient-brand-start)/0.12);--tw-shadow-colored:0 0 8px 4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.oui-transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.oui-transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.oui-transition-transform{transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.oui-will-change-transform{will-change:transform}@keyframes enter{0%{opacity:var(--tw-enter-opacity,1);transform:translate3d(var(--tw-enter-translate-x,0),var(--tw-enter-translate-y,0),0) scale3d(var(--tw-enter-scale,1),var(--tw-enter-scale,1),var(--tw-enter-scale,1)) rotate(var(--tw-enter-rotate,0))}}@keyframes exit{to{opacity:var(--tw-exit-opacity,1);transform:translate3d(var(--tw-exit-translate-x,0),var(--tw-exit-translate-y,0),0) scale3d(var(--tw-exit-scale,1),var(--tw-exit-scale,1),var(--tw-exit-scale,1)) rotate(var(--tw-exit-rotate,0))}}.oui-animate-in{animation-name:enter;animation-duration:.15s;--tw-enter-opacity:initial;--tw-enter-scale:initial;--tw-enter-rotate:initial;--tw-enter-translate-x:initial;--tw-enter-translate-y:initial}.oui-fade-in{--tw-enter-opacity:0}.placeholder\:oui-text-sm::-moz-placeholder{font-size:var(--oui-font-size-sm,.875rem);line-height:1.25rem}.placeholder\:oui-text-sm::placeholder{font-size:var(--oui-font-size-sm,.875rem);line-height:1.25rem}.placeholder\:oui-text-base-contrast-20::-moz-placeholder{color:rgb(var(--oui-color-base-foreground)/.2)}.placeholder\:oui-text-base-contrast-20::placeholder{color:rgb(var(--oui-color-base-foreground)/.2)}.hover\:oui-border-base-contrast-16:hover{border-color:rgb(var(--oui-color-base-foreground)/.16)}.hover\:oui-bg-base-5:hover{--tw-bg-opacity:1;background-color:rgb(var(--oui-color-base-5)/var(--tw-bg-opacity,1))}.hover\:oui-bg-base-6:hover{--tw-bg-opacity:1;background-color:rgb(var(--oui-color-base-6)/var(--tw-bg-opacity,1))}.hover\:oui-bg-base-7:hover{--tw-bg-opacity:1;background-color:rgb(var(--oui-color-base-7)/var(--tw-bg-opacity,1))}.hover\:oui-bg-base-8:hover{--tw-bg-opacity:1;background-color:rgb(var(--oui-color-base-8)/var(--tw-bg-opacity,1))}.hover\:oui-fill-base-contrast:hover{fill:rgb(var(--oui-color-base-foreground)/.98)}.hover\:oui-fill-primary-darken:hover{fill:rgb(var(--oui-color-primary-darken)/1)}.hover\:oui-fill-primary-light:hover{fill:rgb(var(--oui-color-primary-light)/1)}.hover\:oui-fill-white\/\[\.98\]:hover{fill:hsla(0,0%,100%,.98)}.hover\:oui-text-base-contrast:hover{color:rgb(var(--oui-color-base-foreground)/.98)}.hover\:oui-text-base-contrast-80:hover{color:rgb(var(--oui-color-base-foreground)/.8)}.hover\:oui-text-secondary\/80:hover{color:rgb(var(--oui-color-secondary)/.8)}.oui-group:hover .group-hover\:oui-visible{visibility:visible}.oui-group:hover .group-hover\:oui-invisible{visibility:hidden}.oui-group:hover .group-hover\:-oui-translate-x-5{--tw-translate-x:-1.25rem}.oui-group:hover .group-hover\:-oui-translate-x-5,.oui-group:hover .group-hover\:oui-translate-x-0{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.oui-group:hover .group-hover\:oui-translate-x-0{--tw-translate-x:0px}.oui-group:hover .group-hover\:oui-text-base-contrast{color:rgb(var(--oui-color-base-foreground)/.98)}.oui-group:hover .group-hover\:oui-text-base-contrast-80{color:rgb(var(--oui-color-base-foreground)/.8)}.oui-group:hover .group-hover\:oui-opacity-100{opacity:1}.data-\[active\=true\]\:oui-bg-base-5[data-active=true]{--tw-bg-opacity:1;background-color:rgb(var(--oui-color-base-5)/var(--tw-bg-opacity,1))}.oui-group[data-active=true] .group-data-\[active\=true\]\:oui-visible{visibility:visible}.oui-group[data-active=true] .group-data-\[active\=true\]\:oui-invisible{visibility:hidden}.oui-group\/bar[data-state=closed] .group-data-\[state\=closed\]\/bar\:oui-w-\[42px\]{width:42px}.oui-group[data-open=true] .group-data-\[open\=true\]\:oui-rotate-180{--tw-rotate:180deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.oui-group[data-state=open] .group-data-\[state\=open\]\:oui-fill-primary-light{fill:rgb(var(--oui-color-primary-light)/1)}@media (min-width:480px){.md\:oui-right-4{right:1rem}.md\:oui-mx-0{margin-left:0;margin-right:0}.md\:oui-h-5{height:1.25rem}.md\:oui-w-5{width:1.25rem}.md\:oui-w-auto{width:auto}.md\:oui-w-full{width:100%}.md\:oui-rounded-none{border-radius:0}.md\:oui-py-3{padding-top:.75rem;padding-bottom:.75rem}.md\:oui-pl-4{padding-left:1rem}.md\:oui-pr-\[60px\]{padding-right:60px}.md\:oui-text-sm{font-size:var(--oui-font-size-sm,.875rem)}.md\:oui-text-sm,.md\:oui-text-xs{line-height:1.25rem}.md\:oui-text-xs{font-size:var(--oui-font-size-xs,calc(.875rem - 1px))}}@media (min-width:768px){.lg\:oui-size-5{width:1.25rem;height:1.25rem}.lg\:oui-w-\[360px\]{width:360px}.lg\:oui-w-\[calc\(\(100\%_-_8px\)\/3\)\]{width:calc(33.33333% - 2.66667px)}.lg\:oui-w-auto{width:auto}.lg\:oui-items-start{align-items:flex-start}.lg\:oui-items-center{align-items:center}.lg\:oui-justify-center{justify-content:center}.lg\:oui-text-xs{font-size:var(--oui-font-size-xs,calc(.875rem - 1px));line-height:1.25rem}}@media (min-width:1024px){.xl\:oui-grid{display:grid}.xl\:oui-items-center{align-items:center}.xl\:oui-justify-center{justify-content:center}.xl\:oui-px-4{padding-left:1rem;padding-right:1rem}}.\[\&_img\]\:\!oui-h-\[18px\] img{height:18px!important}