"use strict";
Object.defineProperty(exports, "__esModule", {
    value: true
});
function _export(target, all) {
    for(var name in all)Object.defineProperty(target, name, {
        enumerable: true,
        get: all[name]
    });
}
_export(exports, {
    DesktopRememberMe: function() {
        return DesktopRememberMe;
    },
    MobileRememberMe: function() {
        return MobileRememberMe;
    },
    RememberMe: function() {
        return RememberMe;
    }
});
const _jsxruntime = require("react/jsx-runtime");
const _icon = require("../../../icon");
const _modal = require("../../../modal");
const _hooks = require("@orderly.network/hooks");
const _types = require("@orderly.network/types");
const _reacttooltip = require("@radix-ui/react-tooltip");
const RememberMe = ()=>{
    const isTable = (0, _hooks.useMediaQuery)(_types.MEDIA_TABLET);
    return isTable ? /*#__PURE__*/ (0, _jsxruntime.jsx)(MobileRememberMe, {}) : /*#__PURE__*/ (0, _jsxruntime.jsx)(DesktopRememberMe, {});
};
const MobileRememberMe = ()=>{
    const showRememberHint = ()=>{
        _modal.modal.alert({
            title: "Remember me",
            message: /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
                className: "orderly-text-3xs orderly-text-base-contrast/60",
                children: "Toggle this option to skip these steps next time you want to trade."
            })
        });
    };
    return /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
        className: "orderly-text-base-contrast-54 orderly-text-xs  desktop:orderly-text-base",
        onClick: showRememberHint,
        children: [
            /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
                children: "Remember me"
            }),
            /*#__PURE__*/ (0, _jsxruntime.jsx)(_icon.InfoIcon, {
                className: "orderly-inline-block orderly-ml-2",
                size: 14
            })
        ]
    });
};
const DesktopRememberMe = ()=>{
    return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_reacttooltip.Tooltip, {
        children: [
            /*#__PURE__*/ (0, _jsxruntime.jsx)(_reacttooltip.TooltipTrigger, {
                asChild: true,
                children: /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
                    className: "orderly-text-base-contrast-54 orderly-text-xs desktop:orderly-text-base orderly-cursor-pointer",
                    children: [
                        /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
                            children: "Remember me"
                        }),
                        /*#__PURE__*/ (0, _jsxruntime.jsx)(_icon.InfoIcon, {
                            className: "orderly-inline-block orderly-ml-2",
                            size: 14
                        })
                    ]
                })
            }),
            /*#__PURE__*/ (0, _jsxruntime.jsxs)(_reacttooltip.TooltipContent, {
                align: "center",
                className: "orderly-max-w-[300px] orderly-z-20 orderly-text-base-contrast orderly-select-none orderly-rounded orderly-bg-base-400 orderly-p-3 orderly-text-4xs",
                children: [
                    /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
                        className: "orderly-text-3xs orderly-text-base-contrast/60",
                        children: "Toggle this option to skip these steps next time you want to trade."
                    }),
                    /*#__PURE__*/ (0, _jsxruntime.jsx)(_reacttooltip.TooltipArrow, {
                        className: "orderly-fill-base-400"
                    })
                ]
            })
        ]
    });
};

//# sourceMappingURL=rememberMe.js.map