@n1xyz/wallet-widget 0.0.32 → 0.0.33-alpha.1

package/dist/Modal/Sidebar/NordTradingView/TradeForm/AmountInput.d.ts

@@ -1,7 +0,0 @@
-interface AmountInputProps {
-    amount: string;
-    onChange: (amount: string) => void;
-    marketInfo?: any;
-}
-export default function AmountInput({ amount, onChange, marketInfo, }: AmountInputProps): JSX.Element;
-export {};

package/dist/Modal/Sidebar/NordTradingView/TradeForm/AmountInput.js

@@ -1,20 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-export default function AmountInput(_a) {
-    var amount = _a.amount, onChange = _a.onChange, marketInfo = _a.marketInfo;
-    // Handle amount change
-    var handleAmountChange = function (e) {
-        var value = e.target.value;
-        // Allow only numbers and decimal point
-        if (/^[0-9]*\.?[0-9]*$/.test(value) || value === '') {
-            onChange(value);
-        }
-    };
-    // Calculate percentage of available balance
-    var handlePercentClick = function (percent) {
-        // This is a placeholder. In a real implementation, you would calculate
-        // the percentage of the available balance based on marketInfo
-        onChange((percent * 0.01).toString());
-    };
-    return (_jsxs("div", { className: "relative z-20", children: [_jsx("label", { className: "block text-xs font-medium text-n1-ww-gray-700 dark:text-n1-ww-gray-300 mb-1", children: "Amount" }), _jsx("div", { className: "relative", children: _jsx("input", { type: "text", value: amount, onChange: handleAmountChange, className: "w-full px-3 py-2 border border-n1-ww-gray-200 dark:border-n1-ww-gray-800 rounded-sm text-sm text-n1-ww-gray-900 dark:text-n1-ww-gray-100 focus:outline-none focus:ring-1 focus:ring-n1-ww-gray-400 dark:focus:ring-n1-ww-gray-600 focus:border-n1-ww-gray-400 dark:focus:border-n1-ww-gray-600 bg-white dark:bg-n1-ww-gray-950 font-mono transition-colors duration-200", placeholder: "Enter amount" }) }), _jsx("div", { className: "grid grid-cols-4 gap-1 mt-1", children: [25, 50, 75, 100].map(function (percent) { return (_jsxs("button", { type: "button", onClick: function () { return handlePercentClick(percent); }, className: "text-[10px] px-1 py-0.5 border border-n1-ww-gray-200 dark:border-n1-ww-gray-800 hover:bg-emerald-600 hover:border-emerald-600 hover:text-white dark:hover:bg-emerald-600 dark:hover:border-emerald-600 dark:hover:text-white rounded-sm text-n1-ww-gray-700 dark:text-n1-ww-gray-300 transition-colors duration-200 bg-white dark:bg-n1-ww-dark-950", children: [percent, "%"] }, percent)); }) })] }));
-}
-//# sourceMappingURL=AmountInput.js.map

package/dist/Modal/Sidebar/NordTradingView/TradeForm/AmountInput.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"AmountInput.js","sourceRoot":"","sources":["../../../../../src/Modal/Sidebar/NordTradingView/TradeForm/AmountInput.tsx"],"names":[],"mappings":";AAQA,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,EAIjB;QAHjB,MAAM,YAAA,EACN,QAAQ,cAAA,EACR,UAAU,gBAAA;IAEV,uBAAuB;IACvB,IAAM,kBAAkB,GAAG,UAAC,CAAsC;QAChE,IAAM,KAAK,GAAG,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC;QAE7B,uCAAuC;QACvC,IAAI,mBAAmB,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,KAAK,KAAK,EAAE,EAAE,CAAC;YACpD,QAAQ,CAAC,KAAK,CAAC,CAAC;QAClB,CAAC;IACH,CAAC,CAAC;IAEF,4CAA4C;IAC5C,IAAM,kBAAkB,GAAG,UAAC,OAAe;QACzC,uEAAuE;QACvE,8DAA8D;QAC9D,QAAQ,CAAC,CAAC,OAAO,GAAG,IAAI,CAAC,CAAC,QAAQ,EAAE,CAAC,CAAC;IACxC,CAAC,CAAC;IAEF,OAAO,CACL,eAAK,SAAS,EAAC,eAAe,aAC5B,gBAAO,SAAS,EAAC,6EAA6E,uBAEtF,EACR,cAAK,SAAS,EAAC,UAAU,YACvB,gBACE,IAAI,EAAC,MAAM,EACX,KAAK,EAAE,MAAM,EACb,QAAQ,EAAE,kBAAkB,EAC5B,SAAS,EAAC,yWAAyW,EACnX,WAAW,EAAC,cAAc,GAC1B,GACE,EACN,cAAK,SAAS,EAAC,6BAA6B,YACzC,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,GAAG,CAAC,CAAC,GAAG,CAAC,UAAC,OAAO,IAAK,OAAA,CAClC,kBAEE,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,cAAM,OAAA,kBAAkB,CAAC,OAAO,CAAC,EAA3B,CAA2B,EAC1C,SAAS,EAAC,qVAAqV,aAE9V,OAAO,UALH,OAAO,CAML,CACV,EATmC,CASnC,CAAC,GACE,IACF,CACP,CAAC;AACJ,CAAC","sourcesContent":["import React from 'react';\n\ninterface AmountInputProps {\n  amount: string;\n  onChange: (amount: string) => void;\n  marketInfo?: any;\n}\n\nexport default function AmountInput({\n  amount,\n  onChange,\n  marketInfo,\n}: AmountInputProps) {\n  // Handle amount change\n  const handleAmountChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    const value = e.target.value;\n\n    // Allow only numbers and decimal point\n    if (/^[0-9]*\\.?[0-9]*$/.test(value) || value === '') {\n      onChange(value);\n    }\n  };\n\n  // Calculate percentage of available balance\n  const handlePercentClick = (percent: number) => {\n    // This is a placeholder. In a real implementation, you would calculate\n    // the percentage of the available balance based on marketInfo\n    onChange((percent * 0.01).toString());\n  };\n\n  return (\n    <div className=\"relative z-20\">\n      <label className=\"block text-xs font-medium text-n1-ww-gray-700 dark:text-n1-ww-gray-300 mb-1\">\n        Amount\n      </label>\n      <div className=\"relative\">\n        <input\n          type=\"text\"\n          value={amount}\n          onChange={handleAmountChange}\n          className=\"w-full px-3 py-2 border border-n1-ww-gray-200 dark:border-n1-ww-gray-800 rounded-sm text-sm text-n1-ww-gray-900 dark:text-n1-ww-gray-100 focus:outline-none focus:ring-1 focus:ring-n1-ww-gray-400 dark:focus:ring-n1-ww-gray-600 focus:border-n1-ww-gray-400 dark:focus:border-n1-ww-gray-600 bg-white dark:bg-n1-ww-gray-950 font-mono transition-colors duration-200\"\n          placeholder=\"Enter amount\"\n        />\n      </div>\n      <div className=\"grid grid-cols-4 gap-1 mt-1\">\n        {[25, 50, 75, 100].map((percent) => (\n          <button\n            key={percent}\n            type=\"button\"\n            onClick={() => handlePercentClick(percent)}\n            className=\"text-[10px] px-1 py-0.5 border border-n1-ww-gray-200 dark:border-n1-ww-gray-800 hover:bg-emerald-600 hover:border-emerald-600 hover:text-white dark:hover:bg-emerald-600 dark:hover:border-emerald-600 dark:hover:text-white rounded-sm text-n1-ww-gray-700 dark:text-n1-ww-gray-300 transition-colors duration-200 bg-white dark:bg-n1-ww-dark-950\"\n          >\n            {percent}%\n          </button>\n        ))}\n      </div>\n    </div>\n  );\n}\n"]}

package/dist/Modal/Sidebar/NordTradingView/TradeForm/BuySellTabs.d.ts

@@ -1,7 +0,0 @@
-import { OrderSide } from './TradeForm';
-interface BuySellTabsProps {
-    side: OrderSide;
-    onChange: (side: OrderSide) => void;
-}
-export default function BuySellTabs({ side, onChange }: BuySellTabsProps): JSX.Element;
-export {};

package/dist/Modal/Sidebar/NordTradingView/TradeForm/BuySellTabs.js

@@ -1,24 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useState } from 'react';
-export default function BuySellTabs(_a) {
-    var side = _a.side, onChange = _a.onChange;
-    var _b = useState(null), hoveredSide = _b[0], setHoveredSide = _b[1];
-    var _c = useState(false), animating = _c[0], setAnimating = _c[1];
-    var handleSideChange = function (newSide) {
-        if (side !== newSide) {
-            setAnimating(true);
-            onChange(newSide);
-            setTimeout(function () { return setAnimating(false); }, 300);
-        }
-    };
-    return (_jsxs("div", { className: "flex rounded-sm overflow-hidden border border-n1-ww-gray-200 dark:border-n1-ww-gray-700 relative", children: [_jsx("div", { className: "absolute top-0 bottom-0 w-1/2 transition-all duration-300 ease-in-out ".concat(side === 'BUY'
-                    ? 'left-0 bg-emerald-600 dark:bg-emerald-600 rounded-r-sm'
-                    : 'left-1/2 bg-red-700 dark:bg-red-700 rounded-l-sm') }), _jsxs("button", { type: "button", onClick: function () { return handleSideChange('BUY'); }, onMouseEnter: function () { return setHoveredSide('BUY'); }, onMouseLeave: function () { return setHoveredSide(null); }, className: "flex-1 py-2 text-center text-sm font-medium transition-colors duration-200 relative overflow-hidden z-10", children: [_jsx("span", { className: "relative transition-colors duration-300 ".concat(side === 'BUY' ? 'text-white' : 'text-n1-ww-gray-700 dark:text-n1-ww-gray-300'), children: "Buy" }), side === 'BUY' && hoveredSide === 'BUY' && !animating && (_jsx("span", { className: "absolute inset-0 bg-gradient-to-r from-transparent via-white to-transparent opacity-25 pointer-events-none translate-x-[-200%] n1-ww-animate-shimmer", style: {
-                            backgroundSize: '200% 100%',
-                            animationDuration: '1.5s',
-                        } }))] }), _jsxs("button", { type: "button", onClick: function () { return handleSideChange('SELL'); }, onMouseEnter: function () { return setHoveredSide('SELL'); }, onMouseLeave: function () { return setHoveredSide(null); }, className: "flex-1 py-2 text-center text-sm font-medium transition-colors duration-200 relative overflow-hidden z-10", children: [_jsx("span", { className: "relative transition-colors duration-300 ".concat(side === 'SELL' ? 'text-white' : 'text-n1-ww-gray-700 dark:text-n1-ww-gray-300'), children: "Sell" }), side === 'SELL' && hoveredSide === 'SELL' && !animating && (_jsx("span", { className: "absolute inset-0 bg-gradient-to-r from-transparent via-white to-transparent opacity-25 pointer-events-none translate-x-[-200%] n1-ww-animate-shimmer", style: {
-                            backgroundSize: '200% 100%',
-                            animationDuration: '1.5s',
-                        } }))] })] }));
-}
-//# sourceMappingURL=BuySellTabs.js.map

package/dist/Modal/Sidebar/NordTradingView/TradeForm/BuySellTabs.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"BuySellTabs.js","sourceRoot":"","sources":["../../../../../src/Modal/Sidebar/NordTradingView/TradeForm/BuySellTabs.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAQjC,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,EAAoC;QAAlC,IAAI,UAAA,EAAE,QAAQ,cAAA;IAC5C,IAAA,KAAgC,QAAQ,CAAmB,IAAI,CAAC,EAA/D,WAAW,QAAA,EAAE,cAAc,QAAoC,CAAC;IACjE,IAAA,KAA4B,QAAQ,CAAC,KAAK,CAAC,EAA1C,SAAS,QAAA,EAAE,YAAY,QAAmB,CAAC;IAElD,IAAM,gBAAgB,GAAG,UAAC,OAAkB;QAC1C,IAAI,IAAI,KAAK,OAAO,EAAE,CAAC;YACrB,YAAY,CAAC,IAAI,CAAC,CAAC;YACnB,QAAQ,CAAC,OAAO,CAAC,CAAC;YAClB,UAAU,CAAC,cAAM,OAAA,YAAY,CAAC,KAAK,CAAC,EAAnB,CAAmB,EAAE,GAAG,CAAC,CAAC;QAC7C,CAAC;IACH,CAAC,CAAC;IAEF,OAAO,CACL,eAAK,SAAS,EAAC,kGAAkG,aAE/G,cACE,SAAS,EAAE,gFACT,IAAI,KAAK,KAAK;oBACZ,CAAC,CAAC,wDAAwD;oBAC1D,CAAC,CAAC,kDAAkD,CACtD,GACF,EAGF,kBACE,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,cAAM,OAAA,gBAAgB,CAAC,KAAK,CAAC,EAAvB,CAAuB,EACtC,YAAY,EAAE,cAAM,OAAA,cAAc,CAAC,KAAK,CAAC,EAArB,CAAqB,EACzC,YAAY,EAAE,cAAM,OAAA,cAAc,CAAC,IAAI,CAAC,EAApB,CAAoB,EACxC,SAAS,EAAC,0GAA0G,aAEpH,eACE,SAAS,EAAE,kDACT,IAAI,KAAK,KAAK,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,8CAA8C,CAC9E,oBAGG,EAEN,IAAI,KAAK,KAAK,IAAI,WAAW,KAAK,KAAK,IAAI,CAAC,SAAS,IAAI,CACxD,eACE,SAAS,EAAC,sJAAsJ,EAChK,KAAK,EAAE;4BACL,cAAc,EAAE,WAAW;4BAC3B,iBAAiB,EAAE,MAAM;yBAC1B,GACD,CACH,IACM,EAGT,kBACE,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,cAAM,OAAA,gBAAgB,CAAC,MAAM,CAAC,EAAxB,CAAwB,EACvC,YAAY,EAAE,cAAM,OAAA,cAAc,CAAC,MAAM,CAAC,EAAtB,CAAsB,EAC1C,YAAY,EAAE,cAAM,OAAA,cAAc,CAAC,IAAI,CAAC,EAApB,CAAoB,EACxC,SAAS,EAAC,0GAA0G,aAEpH,eACE,SAAS,EAAE,kDACT,IAAI,KAAK,MAAM,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,8CAA8C,CAC/E,qBAGG,EAEN,IAAI,KAAK,MAAM,IAAI,WAAW,KAAK,MAAM,IAAI,CAAC,SAAS,IAAI,CAC1D,eACE,SAAS,EAAC,sJAAsJ,EAChK,KAAK,EAAE;4BACL,cAAc,EAAE,WAAW;4BAC3B,iBAAiB,EAAE,MAAM;yBAC1B,GACD,CACH,IACM,IACL,CACP,CAAC;AACJ,CAAC","sourcesContent":["import { useState } from 'react';\nimport { OrderSide } from './TradeForm';\n\ninterface BuySellTabsProps {\n  side: OrderSide;\n  onChange: (side: OrderSide) => void;\n}\n\nexport default function BuySellTabs({ side, onChange }: BuySellTabsProps) {\n  const [hoveredSide, setHoveredSide] = useState<OrderSide | null>(null);\n  const [animating, setAnimating] = useState(false);\n\n  const handleSideChange = (newSide: OrderSide) => {\n    if (side !== newSide) {\n      setAnimating(true);\n      onChange(newSide);\n      setTimeout(() => setAnimating(false), 300);\n    }\n  };\n\n  return (\n    <div className=\"flex rounded-sm overflow-hidden border border-n1-ww-gray-200 dark:border-n1-ww-gray-700 relative\">\n      {/* Background Slider */}\n      <div\n        className={`absolute top-0 bottom-0 w-1/2 transition-all duration-300 ease-in-out ${\n          side === 'BUY'\n            ? 'left-0 bg-emerald-600 dark:bg-emerald-600 rounded-r-sm'\n            : 'left-1/2 bg-red-700 dark:bg-red-700 rounded-l-sm'\n        }`}\n      />\n\n      {/* Buy Button */}\n      <button\n        type=\"button\"\n        onClick={() => handleSideChange('BUY')}\n        onMouseEnter={() => setHoveredSide('BUY')}\n        onMouseLeave={() => setHoveredSide(null)}\n        className=\"flex-1 py-2 text-center text-sm font-medium transition-colors duration-200 relative overflow-hidden z-10\"\n      >\n        <span\n          className={`relative transition-colors duration-300 ${\n            side === 'BUY' ? 'text-white' : 'text-n1-ww-gray-700 dark:text-n1-ww-gray-300'\n          }`}\n        >\n          Buy\n        </span>\n\n        {side === 'BUY' && hoveredSide === 'BUY' && !animating && (\n          <span\n            className=\"absolute inset-0 bg-gradient-to-r from-transparent via-white to-transparent opacity-25 pointer-events-none translate-x-[-200%] n1-ww-animate-shimmer\"\n            style={{\n              backgroundSize: '200% 100%',\n              animationDuration: '1.5s',\n            }}\n          />\n        )}\n      </button>\n\n      {/* Sell Button */}\n      <button\n        type=\"button\"\n        onClick={() => handleSideChange('SELL')}\n        onMouseEnter={() => setHoveredSide('SELL')}\n        onMouseLeave={() => setHoveredSide(null)}\n        className=\"flex-1 py-2 text-center text-sm font-medium transition-colors duration-200 relative overflow-hidden z-10\"\n      >\n        <span\n          className={`relative transition-colors duration-300 ${\n            side === 'SELL' ? 'text-white' : 'text-n1-ww-gray-700 dark:text-n1-ww-gray-300'\n          }`}\n        >\n          Sell\n        </span>\n\n        {side === 'SELL' && hoveredSide === 'SELL' && !animating && (\n          <span\n            className=\"absolute inset-0 bg-gradient-to-r from-transparent via-white to-transparent opacity-25 pointer-events-none translate-x-[-200%] n1-ww-animate-shimmer\"\n            style={{\n              backgroundSize: '200% 100%',\n              animationDuration: '1.5s',\n            }}\n          />\n        )}\n      </button>\n    </div>\n  );\n}\n"]}

package/dist/Modal/Sidebar/NordTradingView/TradeForm/FillModeSelector.d.ts

@@ -1,7 +0,0 @@
-import { FillMode } from './TradeForm';
-interface FillModeSelectorProps {
-    fillMode: FillMode;
-    onFillModeChange: (mode: FillMode) => void;
-}
-export default function FillModeSelector({ fillMode, onFillModeChange, }: FillModeSelectorProps): JSX.Element;
-export {};

package/dist/Modal/Sidebar/NordTradingView/TradeForm/FillModeSelector.js

@@ -1,80 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useState, useRef, useEffect } from 'react';
-import { createPortal } from 'react-dom';
-import { ChevronDown } from 'lucide-react';
-export default function FillModeSelector(_a) {
-    var fillMode = _a.fillMode, onFillModeChange = _a.onFillModeChange;
-    var _b = useState(false), isFillModeOpen = _b[0], setIsFillModeOpen = _b[1];
-    var _c = useState(null), hoveredFillMode = _c[0], setHoveredFillMode = _c[1];
-    var fillModeRef = useRef(null);
-    var _d = useState(null), fillModeRect = _d[0], setFillModeRect = _d[1];
-    // Update rect when dropdown opens
-    useEffect(function () {
-        if (isFillModeOpen && fillModeRef.current) {
-            setFillModeRect(fillModeRef.current.getBoundingClientRect());
-        }
-    }, [isFillModeOpen]);
-    // Close dropdowns when clicking outside
-    useEffect(function () {
-        function handleClickOutside(event) {
-            if (fillModeRef.current &&
-                !fillModeRef.current.contains(event.target)) {
-                setIsFillModeOpen(false);
-            }
-        }
-        document.addEventListener('mousedown', handleClickOutside);
-        return function () {
-            document.removeEventListener('mousedown', handleClickOutside);
-        };
-    }, []);
-    // Fill mode options
-    var fillModes = ['GTC', 'POST_ONLY', 'IOC', 'FOK'];
-    // Fill mode descriptions and display names
-    var fillModeInfo = {
-        GTC: {
-            displayName: 'Limit',
-            description: 'Good Till Cancelled',
-        },
-        POST_ONLY: {
-            displayName: 'Post Only',
-            description: 'Only maker orders',
-        },
-        IOC: {
-            displayName: 'Market',
-            description: 'Immediate or Cancel',
-        },
-        FOK: {
-            displayName: 'Fill or Kill',
-            description: 'Fill completely or cancel',
-        },
-    };
-    // Render fill mode dropdown via portal
-    var renderFillModeDropdown = function () {
-        if (!isFillModeOpen || !fillModeRect)
-            return null;
-        var dropdownStyle = {
-            position: 'fixed',
-            top: "".concat(fillModeRect.bottom + window.scrollY, "px"),
-            left: "".concat(fillModeRect.left + window.scrollX, "px"),
-            width: "".concat(fillModeRect.width, "px"),
-            zIndex: 9999,
-            maxHeight: '200px',
-            overflowY: 'auto',
-        };
-        return createPortal(_jsx("div", { className: "bg-white dark:bg-n1-ww-dark-950 rounded-sm shadow-lg border border-n1-ww-gray-200 dark:border-n1-ww-gray-700 overflow-hidden n1-ww-animate-dropdown-open", style: dropdownStyle, children: fillModes.map(function (mode) { return (_jsxs("button", { type: "button", onClick: function () {
-                    onFillModeChange(mode);
-                    setIsFillModeOpen(false);
-                }, onMouseEnter: function () { return setHoveredFillMode(mode); }, onMouseLeave: function () { return setHoveredFillMode(null); }, className: "w-full text-left px-3 py-2 text-sm cursor-pointer transition-colors duration-200 relative overflow-hidden ".concat(fillMode === mode
-                    ? 'bg-n1-ww-gray-100 dark:bg-n1-ww-gray-800 font-medium text-n1-ww-gray-900 dark:text-white'
-                    : 'text-n1-ww-gray-900 dark:text-n1-ww-gray-100 hover:bg-n1-ww-gray-50 dark:hover:bg-n1-ww-gray-800'), children: [_jsxs("div", { className: "flex items-center", children: [_jsx("div", { className: "w-1 h-10 absolute left-0 top-0 bottom-0 my-auto rounded-r-sm ".concat(fillMode === mode
-                                    ? 'bg-emerald-600 dark:bg-emerald-500'
-                                    : 'bg-transparent') }), _jsxs("div", { className: "flex flex-col ml-1", children: [_jsx("span", { className: "font-medium", children: fillModeInfo[mode].displayName }), _jsx("span", { className: "text-[10px] text-n1-ww-gray-500 dark:text-n1-ww-gray-400", children: fillModeInfo[mode].description })] })] }), fillMode === mode && hoveredFillMode === mode && (_jsx("span", { className: "absolute inset-0 bg-gradient-to-r from-transparent via-white to-transparent opacity-25 pointer-events-none translate-x-[-200%] n1-ww-animate-shimmer dark:via-n1-ww-gray-300", style: {
-                            backgroundSize: '200% 100%',
-                            animationDuration: '1.5s',
-                        } }))] }, mode)); }) }), document.body);
-    };
-    return (_jsxs("div", { className: "relative", ref: fillModeRef, children: [_jsx("label", { className: "block text-xs font-medium text-n1-ww-gray-700 dark:text-n1-ww-gray-300 mb-1", children: "Order Type" }), _jsxs("button", { type: "button", onClick: function () { return setIsFillModeOpen(!isFillModeOpen); }, className: "w-full flex items-center justify-between px-3 py-2 border border-n1-ww-gray-200 dark:border-n1-ww-gray-700 rounded-sm text-sm text-n1-ww-gray-900 dark:text-n1-ww-gray-100 hover:border-n1-ww-gray-400 dark:hover:border-n1-ww-gray-500 transition-colors duration-200 bg-white dark:bg-n1-ww-dark-950 focus:outline-none focus:ring-1 focus:ring-n1-ww-gray-400 dark:focus:ring-n1-ww-gray-600", children: [_jsx("span", { children: fillModeInfo[fillMode].displayName }), _jsx(ChevronDown, { size: 14, className: "transition-transform duration-200 ".concat(isFillModeOpen
-                            ? 'rotate-180 text-n1-ww-gray-700 dark:text-n1-ww-gray-300'
-                            : 'text-n1-ww-gray-500 dark:text-n1-ww-gray-400') })] }), renderFillModeDropdown()] }));
-}
-//# sourceMappingURL=FillModeSelector.js.map

package/dist/Modal/Sidebar/NordTradingView/TradeForm/FillModeSelector.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"FillModeSelector.js","sourceRoot":"","sources":["../../../../../src/Modal/Sidebar/NordTradingView/TradeForm/FillModeSelector.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useState, useRef, useEffect } from 'react';\nimport { createPortal } from 'react-dom';\nimport { ChevronDown } from 'lucide-react';\nimport { FillMode } from './TradeForm';\n\ninterface FillModeSelectorProps {\n  fillMode: FillMode;\n  onFillModeChange: (mode: FillMode) => void;\n}\n\nexport default function FillModeSelector({\n  fillMode,\n  onFillModeChange,\n}: FillModeSelectorProps) {\n  const [isFillModeOpen, setIsFillModeOpen] = useState(false);\n  const [hoveredFillMode, setHoveredFillMode] = useState<FillMode | null>(null);\n  const fillModeRef = useRef<HTMLDivElement>(null);\n  const [fillModeRect, setFillModeRect] = useState<DOMRect | null>(null);\n\n  // Update rect when dropdown opens\n  useEffect(() => {\n    if (isFillModeOpen && fillModeRef.current) {\n      setFillModeRect(fillModeRef.current.getBoundingClientRect());\n    }\n  }, [isFillModeOpen]);\n\n  // Close dropdowns when clicking outside\n  useEffect(() => {\n    function handleClickOutside(event: MouseEvent) {\n      if (\n        fillModeRef.current &&\n        !fillModeRef.current.contains(event.target as Node)\n      ) {\n        setIsFillModeOpen(false);\n      }\n    }\n\n    document.addEventListener('mousedown', handleClickOutside);\n    return () => {\n      document.removeEventListener('mousedown', handleClickOutside);\n    };\n  }, []);\n\n  // Fill mode options\n  const fillModes: FillMode[] = ['GTC', 'POST_ONLY', 'IOC', 'FOK'];\n\n  // Fill mode descriptions and display names\n  const fillModeInfo: Record<\n    FillMode,\n    { description: string; displayName: string }\n  > = {\n    GTC: {\n      displayName: 'Limit',\n      description: 'Good Till Cancelled',\n    },\n    POST_ONLY: {\n      displayName: 'Post Only',\n      description: 'Only maker orders',\n    },\n    IOC: {\n      displayName: 'Market',\n      description: 'Immediate or Cancel',\n    },\n    FOK: {\n      displayName: 'Fill or Kill',\n      description: 'Fill completely or cancel',\n    },\n  };\n\n  // Render fill mode dropdown via portal\n  const renderFillModeDropdown = () => {\n    if (!isFillModeOpen || !fillModeRect) return null;\n\n    const dropdownStyle: React.CSSProperties = {\n      position: 'fixed',\n      top: `${fillModeRect.bottom + window.scrollY}px`,\n      left: `${fillModeRect.left + window.scrollX}px`,\n      width: `${fillModeRect.width}px`,\n      zIndex: 9999,\n      maxHeight: '200px',\n      overflowY: 'auto',\n    };\n\n    return createPortal(\n      <div\n        className=\"bg-white dark:bg-n1-ww-dark-950 rounded-sm shadow-lg border border-n1-ww-gray-200 dark:border-n1-ww-gray-700 overflow-hidden n1-ww-animate-dropdown-open\"\n        style={dropdownStyle}\n      >\n        {fillModes.map((mode) => (\n          <button\n            key={mode}\n            type=\"button\"\n            onClick={() => {\n              onFillModeChange(mode);\n              setIsFillModeOpen(false);\n            }}\n            onMouseEnter={() => setHoveredFillMode(mode)}\n            onMouseLeave={() => setHoveredFillMode(null)}\n            className={`w-full text-left px-3 py-2 text-sm cursor-pointer transition-colors duration-200 relative overflow-hidden ${\n              fillMode === mode\n                ? 'bg-n1-ww-gray-100 dark:bg-n1-ww-gray-800 font-medium text-n1-ww-gray-900 dark:text-white'\n                : 'text-n1-ww-gray-900 dark:text-n1-ww-gray-100 hover:bg-n1-ww-gray-50 dark:hover:bg-n1-ww-gray-800'\n            }`}\n          >\n            <div className=\"flex items-center\">\n              <div\n                className={`w-1 h-10 absolute left-0 top-0 bottom-0 my-auto rounded-r-sm ${\n                  fillMode === mode\n                    ? 'bg-emerald-600 dark:bg-emerald-500'\n                    : 'bg-transparent'\n                }`}\n              />\n              <div className=\"flex flex-col ml-1\">\n                <span className=\"font-medium\">\n                  {fillModeInfo[mode].displayName}\n                </span>\n                <span className=\"text-[10px] text-n1-ww-gray-500 dark:text-n1-ww-gray-400\">\n                  {fillModeInfo[mode].description}\n                </span>\n              </div>\n            </div>\n\n            {fillMode === mode && hoveredFillMode === mode && (\n              <span\n                className=\"absolute inset-0 bg-gradient-to-r from-transparent via-white to-transparent opacity-25 pointer-events-none translate-x-[-200%] n1-ww-animate-shimmer dark:via-n1-ww-gray-300\"\n                style={{\n                  backgroundSize: '200% 100%',\n                  animationDuration: '1.5s',\n                }}\n              />\n            )}\n          </button>\n        ))}\n      </div>,\n      document.body\n    );\n  };\n\n  return (\n    <div className=\"relative\" ref={fillModeRef}>\n      <label className=\"block text-xs font-medium text-n1-ww-gray-700 dark:text-n1-ww-gray-300 mb-1\">\n        Order Type\n      </label>\n      <button\n        type=\"button\"\n        onClick={() => setIsFillModeOpen(!isFillModeOpen)}\n        className=\"w-full flex items-center justify-between px-3 py-2 border border-n1-ww-gray-200 dark:border-n1-ww-gray-700 rounded-sm text-sm text-n1-ww-gray-900 dark:text-n1-ww-gray-100 hover:border-n1-ww-gray-400 dark:hover:border-n1-ww-gray-500 transition-colors duration-200 bg-white dark:bg-n1-ww-dark-950 focus:outline-none focus:ring-1 focus:ring-n1-ww-gray-400 dark:focus:ring-n1-ww-gray-600\"\n      >\n        <span>{fillModeInfo[fillMode].displayName}</span>\n        <ChevronDown\n          size={14}\n          className={`transition-transform duration-200 ${\n            isFillModeOpen\n              ? 'rotate-180 text-n1-ww-gray-700 dark:text-n1-ww-gray-300'\n              : 'text-n1-ww-gray-500 dark:text-n1-ww-gray-400'\n          }`}\n        />\n      </button>\n\n      {renderFillModeDropdown()}\n    </div>\n  );\n}\n"]}

package/dist/Modal/Sidebar/NordTradingView/TradeForm/OrderTypeSelector.d.ts

@@ -1,9 +0,0 @@
-import { OrderType, FillMode } from './TradeForm';
-interface FillModeSelectorProps {
-    orderType: OrderType;
-    fillMode: FillMode;
-    onOrderTypeChange: (type: OrderType) => void;
-    onFillModeChange: (mode: FillMode) => void;
-}
-export default function FillModeSelector({ orderType, fillMode, onOrderTypeChange, onFillModeChange, }: FillModeSelectorProps): JSX.Element;
-export {};

package/dist/Modal/Sidebar/NordTradingView/TradeForm/OrderTypeSelector.js

@@ -1,110 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useState, useRef, useEffect } from 'react';
-import { createPortal } from 'react-dom';
-import { ChevronDown } from 'lucide-react';
-export default function FillModeSelector(_a) {
-    var orderType = _a.orderType, fillMode = _a.fillMode, onOrderTypeChange = _a.onOrderTypeChange, onFillModeChange = _a.onFillModeChange;
-    var _b = useState(false), isOrderTypeOpen = _b[0], setIsOrderTypeOpen = _b[1];
-    var _c = useState(false), isFillModeOpen = _c[0], setIsFillModeOpen = _c[1];
-    var _d = useState(null), hoveredOrderType = _d[0], setHoveredOrderType = _d[1];
-    var _e = useState(null), hoveredFillMode = _e[0], setHoveredFillMode = _e[1];
-    var orderTypeRef = useRef(null);
-    var fillModeRef = useRef(null);
-    var _f = useState(null), orderTypeRect = _f[0], setOrderTypeRect = _f[1];
-    var _g = useState(null), fillModeRect = _g[0], setFillModeRect = _g[1];
-    // Update rect when dropdown opens
-    useEffect(function () {
-        if (isOrderTypeOpen && orderTypeRef.current) {
-            setOrderTypeRect(orderTypeRef.current.getBoundingClientRect());
-        }
-    }, [isOrderTypeOpen]);
-    useEffect(function () {
-        if (isFillModeOpen && fillModeRef.current) {
-            setFillModeRect(fillModeRef.current.getBoundingClientRect());
-        }
-    }, [isFillModeOpen]);
-    // Close dropdowns when clicking outside
-    useEffect(function () {
-        function handleClickOutside(event) {
-            if (orderTypeRef.current &&
-                !orderTypeRef.current.contains(event.target)) {
-                setIsOrderTypeOpen(false);
-            }
-            if (fillModeRef.current &&
-                !fillModeRef.current.contains(event.target)) {
-                setIsFillModeOpen(false);
-            }
-        }
-        document.addEventListener('mousedown', handleClickOutside);
-        return function () {
-            document.removeEventListener('mousedown', handleClickOutside);
-        };
-    }, []);
-    // Order type options
-    var orderTypes = ['LIMIT', 'MARKET'];
-    // Fill mode options
-    var fillModes = ['GTC', 'IOC', 'FOK', 'POST_ONLY'];
-    // Fill mode descriptions
-    var fillModeDescriptions = {
-        GTC: 'Good Till Cancelled',
-        IOC: 'Immediate or Cancel',
-        FOK: 'Fill or Kill',
-        POST_ONLY: 'Post Only',
-    };
-    // Render dropdown via portal
-    var renderOrderTypeDropdown = function () {
-        if (!isOrderTypeOpen || !orderTypeRect)
-            return null;
-        var dropdownStyle = {
-            position: 'fixed',
-            top: "".concat(orderTypeRect.bottom + window.scrollY, "px"),
-            left: "".concat(orderTypeRect.left + window.scrollX, "px"),
-            width: "".concat(orderTypeRect.width, "px"),
-            zIndex: 9999,
-            maxHeight: '200px',
-            overflowY: 'auto',
-        };
-        return createPortal(_jsx("div", { className: "bg-white dark:bg-n1-ww-dark-950 rounded-sm shadow-lg border border-n1-ww-gray-200 dark:border-n1-ww-gray-800 overflow-hidden n1-ww-animate-dropdown-open", style: dropdownStyle, children: orderTypes.map(function (type) { return (_jsxs("button", { type: "button", onClick: function () {
-                    onOrderTypeChange(type);
-                    setIsOrderTypeOpen(false);
-                }, onMouseEnter: function () { return setHoveredOrderType(type); }, onMouseLeave: function () { return setHoveredOrderType(null); }, className: "w-full text-left px-3 py-2 text-sm cursor-pointer transition-colors duration-200 relative overflow-hidden ".concat(orderType === type
-                    ? 'bg-n1-ww-gray-100 dark:bg-n1-ww-gray-800 font-medium text-n1-ww-gray-900 dark:text-white'
-                    : 'text-n1-ww-gray-900 dark:text-n1-ww-gray-100 hover:bg-n1-ww-gray-50 dark:hover:bg-n1-ww-gray-800'), children: [_jsxs("div", { className: "flex items-center", children: [_jsx("div", { className: "w-1 h-10 absolute left-0 top-0 bottom-0 my-auto rounded-r-sm ".concat(orderType === type
-                                    ? 'bg-emerald-600 dark:bg-emerald-500'
-                                    : 'bg-transparent') }), _jsx("span", { className: "ml-1", children: type })] }), orderType === type && hoveredOrderType === type && (_jsx("span", { className: "absolute inset-0 bg-gradient-to-r from-transparent via-white to-transparent opacity-25 pointer-events-none translate-x-[-200%] n1-ww-animate-shimmer dark:via-n1-ww-gray-300", style: {
-                            backgroundSize: '200% 100%',
-                            animationDuration: '1.5s',
-                        } }))] }, type)); }) }), document.body);
-    };
-    // Render fill mode dropdown via portal
-    var renderFillModeDropdown = function () {
-        if (!isFillModeOpen || !fillModeRect)
-            return null;
-        var dropdownStyle = {
-            position: 'fixed',
-            top: "".concat(fillModeRect.bottom + window.scrollY, "px"),
-            left: "".concat(fillModeRect.left + window.scrollX, "px"),
-            width: "".concat(fillModeRect.width, "px"),
-            zIndex: 9999,
-            maxHeight: '200px',
-            overflowY: 'auto',
-        };
-        return createPortal(_jsx("div", { className: "bg-white dark:bg-n1-ww-dark-950 rounded-sm shadow-lg border border-n1-ww-gray-200 dark:border-n1-ww-gray-800 overflow-hidden n1-ww-animate-dropdown-open", style: dropdownStyle, children: fillModes.map(function (mode) { return (_jsxs("button", { type: "button", onClick: function () {
-                    onFillModeChange(mode);
-                    setIsFillModeOpen(false);
-                }, onMouseEnter: function () { return setHoveredFillMode(mode); }, onMouseLeave: function () { return setHoveredFillMode(null); }, className: "w-full text-left px-3 py-2 text-sm cursor-pointer transition-colors duration-200 relative overflow-hidden ".concat(fillMode === mode
-                    ? 'bg-n1-ww-gray-100 dark:bg-n1-ww-gray-800 font-medium text-n1-ww-gray-900 dark:text-white'
-                    : 'text-n1-ww-gray-900 dark:text-n1-ww-gray-100 hover:bg-n1-ww-gray-50 dark:hover:bg-n1-ww-gray-800'), children: [_jsxs("div", { className: "flex items-center", children: [_jsx("div", { className: "w-1 h-10 absolute left-0 top-0 bottom-0 my-auto rounded-r-sm ".concat(fillMode === mode
-                                    ? 'bg-emerald-600 dark:bg-emerald-500'
-                                    : 'bg-transparent') }), _jsxs("div", { className: "flex flex-col ml-1", children: [_jsx("span", { children: mode }), _jsx("span", { className: "text-[10px] text-n1-ww-gray-500 dark:text-n1-ww-gray-400", children: fillModeDescriptions[mode] })] })] }), fillMode === mode && hoveredFillMode === mode && (_jsx("span", { className: "absolute inset-0 bg-gradient-to-r from-transparent via-white to-transparent opacity-25 pointer-events-none translate-x-[-200%] n1-ww-animate-shimmer dark:via-n1-ww-gray-300", style: {
-                            backgroundSize: '200% 100%',
-                            animationDuration: '1.5s',
-                        } }))] }, mode)); }) }), document.body);
-    };
-    return (_jsxs("div", { className: "grid grid-cols-2 gap-3", children: [_jsxs("div", { className: "relative", ref: orderTypeRef, children: [_jsx("label", { className: "block text-xs font-medium text-n1-ww-gray-700 dark:text-n1-ww-gray-300 mb-1", children: "Order Type" }), _jsxs("button", { type: "button", onClick: function () { return setIsOrderTypeOpen(!isOrderTypeOpen); }, className: "w-full flex items-center justify-between px-3 py-2 border border-n1-ww-gray-200 dark:border-n1-ww-gray-800 rounded-sm text-sm text-n1-ww-gray-900 dark:text-n1-ww-gray-100 hover:border-n1-ww-gray-400 dark:hover:border-n1-ww-gray-500 transition-colors duration-200 bg-white dark:bg-n1-ww-dark-950 focus:outline-none focus:ring-1 focus:ring-n1-ww-gray-400 dark:focus:ring-n1-ww-gray-600", children: [_jsx("span", { children: orderType }), _jsx(ChevronDown, { size: 14, className: "transition-transform duration-200 ".concat(isOrderTypeOpen
-                                    ? 'rotate-180 text-n1-ww-gray-700 dark:text-n1-ww-gray-300'
-                                    : 'text-n1-ww-gray-500 dark:text-n1-ww-gray-400') })] }), renderOrderTypeDropdown()] }), orderType === 'LIMIT' && (_jsxs("div", { className: "relative", ref: fillModeRef, children: [_jsx("label", { className: "block text-xs font-medium text-n1-ww-gray-700 dark:text-n1-ww-gray-300 mb-1", children: "Fill Mode" }), _jsxs("button", { type: "button", onClick: function () { return setIsFillModeOpen(!isFillModeOpen); }, className: "w-full flex items-center justify-between px-3 py-2 border border-n1-ww-gray-200 dark:border-n1-ww-gray-800 rounded-sm text-sm text-n1-ww-gray-900 dark:text-n1-ww-gray-100 hover:border-n1-ww-gray-400 dark:hover:border-n1-ww-gray-500 transition-colors duration-200 bg-white dark:bg-n1-ww-dark-950 focus:outline-none focus:ring-1 focus:ring-n1-ww-gray-400 dark:focus:ring-n1-ww-gray-600", children: [_jsx("span", { children: fillMode }), _jsx(ChevronDown, { size: 14, className: "transition-transform duration-200 ".concat(isFillModeOpen
-                                    ? 'rotate-180 text-n1-ww-gray-700 dark:text-n1-ww-gray-300'
-                                    : 'text-n1-ww-gray-500 dark:text-n1-ww-gray-400') })] }), renderFillModeDropdown()] }))] }));
-}
-//# sourceMappingURL=OrderTypeSelector.js.map

package/dist/Modal/Sidebar/NordTradingView/TradeForm/OrderTypeSelector.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"OrderTypeSelector.js","sourceRoot":"","sources":["../../../../../src/Modal/Sidebar/NordTradingView/TradeForm/OrderTypeSelector.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useState, useRef, useEffect } from 'react';\nimport { createPortal } from 'react-dom';\nimport { ChevronDown } from 'lucide-react';\nimport { OrderType, FillMode } from './TradeForm';\n\ninterface FillModeSelectorProps {\n  orderType: OrderType;\n  fillMode: FillMode;\n  onOrderTypeChange: (type: OrderType) => void;\n  onFillModeChange: (mode: FillMode) => void;\n}\n\nexport default function FillModeSelector({\n  orderType,\n  fillMode,\n  onOrderTypeChange,\n  onFillModeChange,\n}: FillModeSelectorProps) {\n  const [isOrderTypeOpen, setIsOrderTypeOpen] = useState(false);\n  const [isFillModeOpen, setIsFillModeOpen] = useState(false);\n  const [hoveredOrderType, setHoveredOrderType] = useState<OrderType | null>(\n    null\n  );\n  const [hoveredFillMode, setHoveredFillMode] = useState<FillMode | null>(null);\n  const orderTypeRef = useRef<HTMLDivElement>(null);\n  const fillModeRef = useRef<HTMLDivElement>(null);\n  const [orderTypeRect, setOrderTypeRect] = useState<DOMRect | null>(null);\n  const [fillModeRect, setFillModeRect] = useState<DOMRect | null>(null);\n\n  // Update rect when dropdown opens\n  useEffect(() => {\n    if (isOrderTypeOpen && orderTypeRef.current) {\n      setOrderTypeRect(orderTypeRef.current.getBoundingClientRect());\n    }\n  }, [isOrderTypeOpen]);\n\n  useEffect(() => {\n    if (isFillModeOpen && fillModeRef.current) {\n      setFillModeRect(fillModeRef.current.getBoundingClientRect());\n    }\n  }, [isFillModeOpen]);\n\n  // Close dropdowns when clicking outside\n  useEffect(() => {\n    function handleClickOutside(event: MouseEvent) {\n      if (\n        orderTypeRef.current &&\n        !orderTypeRef.current.contains(event.target as Node)\n      ) {\n        setIsOrderTypeOpen(false);\n      }\n      if (\n        fillModeRef.current &&\n        !fillModeRef.current.contains(event.target as Node)\n      ) {\n        setIsFillModeOpen(false);\n      }\n    }\n\n    document.addEventListener('mousedown', handleClickOutside);\n    return () => {\n      document.removeEventListener('mousedown', handleClickOutside);\n    };\n  }, []);\n\n  // Order type options\n  const orderTypes: OrderType[] = ['LIMIT', 'MARKET'];\n\n  // Fill mode options\n  const fillModes: FillMode[] = ['GTC', 'IOC', 'FOK', 'POST_ONLY'];\n\n  // Fill mode descriptions\n  const fillModeDescriptions: Record<FillMode, string> = {\n    GTC: 'Good Till Cancelled',\n    IOC: 'Immediate or Cancel',\n    FOK: 'Fill or Kill',\n    POST_ONLY: 'Post Only',\n  };\n\n  // Render dropdown via portal\n  const renderOrderTypeDropdown = () => {\n    if (!isOrderTypeOpen || !orderTypeRect) return null;\n\n    const dropdownStyle: React.CSSProperties = {\n      position: 'fixed',\n      top: `${orderTypeRect.bottom + window.scrollY}px`,\n      left: `${orderTypeRect.left + window.scrollX}px`,\n      width: `${orderTypeRect.width}px`,\n      zIndex: 9999,\n      maxHeight: '200px',\n      overflowY: 'auto',\n    };\n\n    return createPortal(\n      <div\n        className=\"bg-white dark:bg-n1-ww-dark-950 rounded-sm shadow-lg border border-n1-ww-gray-200 dark:border-n1-ww-gray-800 overflow-hidden n1-ww-animate-dropdown-open\"\n        style={dropdownStyle}\n      >\n        {orderTypes.map((type) => (\n          <button\n            key={type}\n            type=\"button\"\n            onClick={() => {\n              onOrderTypeChange(type);\n              setIsOrderTypeOpen(false);\n            }}\n            onMouseEnter={() => setHoveredOrderType(type)}\n            onMouseLeave={() => setHoveredOrderType(null)}\n            className={`w-full text-left px-3 py-2 text-sm cursor-pointer transition-colors duration-200 relative overflow-hidden ${\n              orderType === type\n                ? 'bg-n1-ww-gray-100 dark:bg-n1-ww-gray-800 font-medium text-n1-ww-gray-900 dark:text-white'\n                : 'text-n1-ww-gray-900 dark:text-n1-ww-gray-100 hover:bg-n1-ww-gray-50 dark:hover:bg-n1-ww-gray-800'\n            }`}\n          >\n            <div className=\"flex items-center\">\n              <div\n                className={`w-1 h-10 absolute left-0 top-0 bottom-0 my-auto rounded-r-sm ${\n                  orderType === type\n                    ? 'bg-emerald-600 dark:bg-emerald-500'\n                    : 'bg-transparent'\n                }`}\n              />\n              <span className=\"ml-1\">{type}</span>\n            </div>\n\n            {orderType === type && hoveredOrderType === type && (\n              <span\n                className=\"absolute inset-0 bg-gradient-to-r from-transparent via-white to-transparent opacity-25 pointer-events-none translate-x-[-200%] n1-ww-animate-shimmer dark:via-n1-ww-gray-300\"\n                style={{\n                  backgroundSize: '200% 100%',\n                  animationDuration: '1.5s',\n                }}\n              />\n            )}\n          </button>\n        ))}\n      </div>,\n      document.body\n    );\n  };\n\n  // Render fill mode dropdown via portal\n  const renderFillModeDropdown = () => {\n    if (!isFillModeOpen || !fillModeRect) return null;\n\n    const dropdownStyle: React.CSSProperties = {\n      position: 'fixed',\n      top: `${fillModeRect.bottom + window.scrollY}px`,\n      left: `${fillModeRect.left + window.scrollX}px`,\n      width: `${fillModeRect.width}px`,\n      zIndex: 9999,\n      maxHeight: '200px',\n      overflowY: 'auto',\n    };\n\n    return createPortal(\n      <div\n        className=\"bg-white dark:bg-n1-ww-dark-950 rounded-sm shadow-lg border border-n1-ww-gray-200 dark:border-n1-ww-gray-800 overflow-hidden n1-ww-animate-dropdown-open\"\n        style={dropdownStyle}\n      >\n        {fillModes.map((mode) => (\n          <button\n            key={mode}\n            type=\"button\"\n            onClick={() => {\n              onFillModeChange(mode);\n              setIsFillModeOpen(false);\n            }}\n            onMouseEnter={() => setHoveredFillMode(mode)}\n            onMouseLeave={() => setHoveredFillMode(null)}\n            className={`w-full text-left px-3 py-2 text-sm cursor-pointer transition-colors duration-200 relative overflow-hidden ${\n              fillMode === mode\n                ? 'bg-n1-ww-gray-100 dark:bg-n1-ww-gray-800 font-medium text-n1-ww-gray-900 dark:text-white'\n                : 'text-n1-ww-gray-900 dark:text-n1-ww-gray-100 hover:bg-n1-ww-gray-50 dark:hover:bg-n1-ww-gray-800'\n            }`}\n          >\n            <div className=\"flex items-center\">\n              <div\n                className={`w-1 h-10 absolute left-0 top-0 bottom-0 my-auto rounded-r-sm ${\n                  fillMode === mode\n                    ? 'bg-emerald-600 dark:bg-emerald-500'\n                    : 'bg-transparent'\n                }`}\n              />\n              <div className=\"flex flex-col ml-1\">\n                <span>{mode}</span>\n                <span className=\"text-[10px] text-n1-ww-gray-500 dark:text-n1-ww-gray-400\">\n                  {fillModeDescriptions[mode]}\n                </span>\n              </div>\n            </div>\n\n            {fillMode === mode && hoveredFillMode === mode && (\n              <span\n                className=\"absolute inset-0 bg-gradient-to-r from-transparent via-white to-transparent opacity-25 pointer-events-none translate-x-[-200%] n1-ww-animate-shimmer dark:via-n1-ww-gray-300\"\n                style={{\n                  backgroundSize: '200% 100%',\n                  animationDuration: '1.5s',\n                }}\n              />\n            )}\n          </button>\n        ))}\n      </div>,\n      document.body\n    );\n  };\n\n  return (\n    <div className=\"grid grid-cols-2 gap-3\">\n      {/* Order Type Selector */}\n      <div className=\"relative\" ref={orderTypeRef}>\n        <label className=\"block text-xs font-medium text-n1-ww-gray-700 dark:text-n1-ww-gray-300 mb-1\">\n          Order Type\n        </label>\n        <button\n          type=\"button\"\n          onClick={() => setIsOrderTypeOpen(!isOrderTypeOpen)}\n          className=\"w-full flex items-center justify-between px-3 py-2 border border-n1-ww-gray-200 dark:border-n1-ww-gray-800 rounded-sm text-sm text-n1-ww-gray-900 dark:text-n1-ww-gray-100 hover:border-n1-ww-gray-400 dark:hover:border-n1-ww-gray-500 transition-colors duration-200 bg-white dark:bg-n1-ww-dark-950 focus:outline-none focus:ring-1 focus:ring-n1-ww-gray-400 dark:focus:ring-n1-ww-gray-600\"\n        >\n          <span>{orderType}</span>\n          <ChevronDown\n            size={14}\n            className={`transition-transform duration-200 ${\n              isOrderTypeOpen\n                ? 'rotate-180 text-n1-ww-gray-700 dark:text-n1-ww-gray-300'\n                : 'text-n1-ww-gray-500 dark:text-n1-ww-gray-400'\n            }`}\n          />\n        </button>\n\n        {renderOrderTypeDropdown()}\n      </div>\n\n      {/* Fill Mode Selector (only for LIMIT orders) */}\n      {orderType === 'LIMIT' && (\n        <div className=\"relative\" ref={fillModeRef}>\n          <label className=\"block text-xs font-medium text-n1-ww-gray-700 dark:text-n1-ww-gray-300 mb-1\">\n            Fill Mode\n          </label>\n          <button\n            type=\"button\"\n            onClick={() => setIsFillModeOpen(!isFillModeOpen)}\n            className=\"w-full flex items-center justify-between px-3 py-2 border border-n1-ww-gray-200 dark:border-n1-ww-gray-800 rounded-sm text-sm text-n1-ww-gray-900 dark:text-n1-ww-gray-100 hover:border-n1-ww-gray-400 dark:hover:border-n1-ww-gray-500 transition-colors duration-200 bg-white dark:bg-n1-ww-dark-950 focus:outline-none focus:ring-1 focus:ring-n1-ww-gray-400 dark:focus:ring-n1-ww-gray-600\"\n          >\n            <span>{fillMode}</span>\n            <ChevronDown\n              size={14}\n              className={`transition-transform duration-200 ${\n                isFillModeOpen\n                  ? 'rotate-180 text-n1-ww-gray-700 dark:text-n1-ww-gray-300'\n                  : 'text-n1-ww-gray-500 dark:text-n1-ww-gray-400'\n              }`}\n            />\n          </button>\n\n          {renderFillModeDropdown()}\n        </div>\n      )}\n    </div>\n  );\n}\n"]}

package/dist/Modal/Sidebar/NordTradingView/TradeForm/PriceInput.d.ts

@@ -1,7 +0,0 @@
-interface PriceInputProps {
-    price: string;
-    onChange: (price: string) => void;
-    marketPrice?: number;
-}
-export default function PriceInput({ price, onChange, marketPrice, }: PriceInputProps): JSX.Element;
-export {};

package/dist/Modal/Sidebar/NordTradingView/TradeForm/PriceInput.js

@@ -1,30 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-export default function PriceInput(_a) {
-    var price = _a.price, onChange = _a.onChange, marketPrice = _a.marketPrice;
-    // Handle price change
-    var handlePriceChange = function (e) {
-        var value = e.target.value;
-        // Allow only numbers and decimal point
-        if (/^[0-9]*\.?[0-9]*$/.test(value) || value === '') {
-            onChange(value);
-        }
-    };
-    // Set price to market price
-    var setMarketPrice = function () {
-        if (marketPrice) {
-            onChange(marketPrice.toString());
-        }
-    };
-    // Adjust price by percentage
-    var adjustPrice = function (percentage) {
-        if (!price)
-            return;
-        var currentPrice = parseFloat(price);
-        if (isNaN(currentPrice))
-            return;
-        var newPrice = currentPrice * (1 + percentage / 100);
-        onChange(newPrice.toString());
-    };
-    return (_jsxs("div", { className: "relative z-20", children: [_jsx("label", { className: "block text-xs font-medium text-n1-ww-gray-700 dark:text-n1-ww-gray-300 mb-1", children: "Price" }), _jsxs("div", { className: "relative", children: [_jsx("input", { type: "text", value: price, onChange: handlePriceChange, className: "w-full px-3 py-2 border border-n1-ww-gray-200 dark:border-n1-ww-gray-800 rounded-sm text-sm text-n1-ww-gray-900 dark:text-n1-ww-gray-100 focus:outline-none focus:ring-1 focus:ring-n1-ww-gray-400 dark:focus:ring-n1-ww-gray-600 focus:border-n1-ww-gray-400 dark:focus:border-n1-ww-gray-600 bg-white dark:bg-n1-ww-dark-950 font-mono transition-colors duration-200", placeholder: "Enter price" }), marketPrice && (_jsx("button", { type: "button", onClick: setMarketPrice, className: "absolute right-2 top-1/2 transform -translate-y-1/2 text-[10px] border border-n1-ww-gray-200 dark:border-n1-ww-gray-800 text-n1-ww-gray-700 dark:text-n1-ww-gray-300 px-1.5 py-0.5 rounded-sm hover:bg-emerald-600 hover:border-emerald-600 hover:text-white dark:hover:bg-emerald-600 dark:hover:border-emerald-600 dark:hover:text-white transition-colors duration-200", children: "Market" }))] }), _jsxs("div", { className: "grid grid-cols-4 gap-1 mt-2", children: [_jsx("button", { type: "button", onClick: function () { return adjustPrice(-1); }, className: "text-xs px-1 py-0.5 bg-n1-ww-gray-100 dark:bg-n1-ww-gray-800 hover:bg-n1-ww-gray-200 dark:hover:bg-n1-ww-gray-700 rounded text-n1-ww-gray-700 dark:text-n1-ww-gray-300 transition-colors duration-200", children: "-1%" }), _jsx("button", { type: "button", onClick: function () { return adjustPrice(-0.1); }, className: "text-xs px-1 py-0.5 bg-n1-ww-gray-100 dark:bg-n1-ww-gray-800 hover:bg-n1-ww-gray-200 dark:hover:bg-n1-ww-gray-700 rounded text-n1-ww-gray-700 dark:text-n1-ww-gray-300 transition-colors duration-200", children: "-0.1%" }), _jsx("button", { type: "button", onClick: function () { return adjustPrice(0.1); }, className: "text-xs px-1 py-0.5 bg-n1-ww-gray-100 dark:bg-n1-ww-gray-800 hover:bg-n1-ww-gray-200 dark:hover:bg-n1-ww-gray-700 rounded text-n1-ww-gray-700 dark:text-n1-ww-gray-300 transition-colors duration-200", children: "+0.1%" }), _jsx("button", { type: "button", onClick: function () { return adjustPrice(1); }, className: "text-xs px-1 py-0.5 bg-n1-ww-gray-100 dark:bg-n1-ww-gray-800 hover:bg-n1-ww-gray-200 dark:hover:bg-n1-ww-gray-700 rounded text-n1-ww-gray-700 dark:text-n1-ww-gray-300 transition-colors duration-200", children: "+1%" })] })] }));
-}
-//# sourceMappingURL=PriceInput.js.map

package/dist/Modal/Sidebar/NordTradingView/TradeForm/PriceInput.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"PriceInput.js","sourceRoot":"","sources":["../../../../../src/Modal/Sidebar/NordTradingView/TradeForm/PriceInput.tsx"],"names":[],"mappings":";AAQA,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,EAIjB;QAHhB,KAAK,WAAA,EACL,QAAQ,cAAA,EACR,WAAW,iBAAA;IAEX,sBAAsB;IACtB,IAAM,iBAAiB,GAAG,UAAC,CAAsC;QAC/D,IAAM,KAAK,GAAG,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC;QAE7B,uCAAuC;QACvC,IAAI,mBAAmB,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,KAAK,KAAK,EAAE,EAAE,CAAC;YACpD,QAAQ,CAAC,KAAK,CAAC,CAAC;QAClB,CAAC;IACH,CAAC,CAAC;IAEF,4BAA4B;IAC5B,IAAM,cAAc,GAAG;QACrB,IAAI,WAAW,EAAE,CAAC;YAChB,QAAQ,CAAC,WAAW,CAAC,QAAQ,EAAE,CAAC,CAAC;QACnC,CAAC;IACH,CAAC,CAAC;IAEF,6BAA6B;IAC7B,IAAM,WAAW,GAAG,UAAC,UAAkB;QACrC,IAAI,CAAC,KAAK;YAAE,OAAO;QAEnB,IAAM,YAAY,GAAG,UAAU,CAAC,KAAK,CAAC,CAAC;QACvC,IAAI,KAAK,CAAC,YAAY,CAAC;YAAE,OAAO;QAEhC,IAAM,QAAQ,GAAG,YAAY,GAAG,CAAC,CAAC,GAAG,UAAU,GAAG,GAAG,CAAC,CAAC;QACvD,QAAQ,CAAC,QAAQ,CAAC,QAAQ,EAAE,CAAC,CAAC;IAChC,CAAC,CAAC;IAEF,OAAO,CACL,eAAK,SAAS,EAAC,eAAe,aAC5B,gBAAO,SAAS,EAAC,6EAA6E,sBAEtF,EAER,eAAK,SAAS,EAAC,UAAU,aACvB,gBACE,IAAI,EAAC,MAAM,EACX,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,iBAAiB,EAC3B,SAAS,EAAC,yWAAyW,EACnX,WAAW,EAAC,aAAa,GACzB,EAED,WAAW,IAAI,CACd,iBACE,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,cAAc,EACvB,SAAS,EAAC,2WAA2W,uBAG9W,CACV,IACG,EAGN,eAAK,SAAS,EAAC,6BAA6B,aAC1C,iBACE,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,cAAM,OAAA,WAAW,CAAC,CAAC,CAAC,CAAC,EAAf,CAAe,EAC9B,SAAS,EAAC,uMAAuM,oBAG1M,EACT,iBACE,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,cAAM,OAAA,WAAW,CAAC,CAAC,GAAG,CAAC,EAAjB,CAAiB,EAChC,SAAS,EAAC,uMAAuM,sBAG1M,EACT,iBACE,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,cAAM,OAAA,WAAW,CAAC,GAAG,CAAC,EAAhB,CAAgB,EAC/B,SAAS,EAAC,uMAAuM,sBAG1M,EACT,iBACE,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,cAAM,OAAA,WAAW,CAAC,CAAC,CAAC,EAAd,CAAc,EAC7B,SAAS,EAAC,uMAAuM,oBAG1M,IACL,IACF,CACP,CAAC;AACJ,CAAC","sourcesContent":["import React from 'react';\n\ninterface PriceInputProps {\n  price: string;\n  onChange: (price: string) => void;\n  marketPrice?: number;\n}\n\nexport default function PriceInput({\n  price,\n  onChange,\n  marketPrice,\n}: PriceInputProps) {\n  // Handle price change\n  const handlePriceChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    const value = e.target.value;\n\n    // Allow only numbers and decimal point\n    if (/^[0-9]*\\.?[0-9]*$/.test(value) || value === '') {\n      onChange(value);\n    }\n  };\n\n  // Set price to market price\n  const setMarketPrice = () => {\n    if (marketPrice) {\n      onChange(marketPrice.toString());\n    }\n  };\n\n  // Adjust price by percentage\n  const adjustPrice = (percentage: number) => {\n    if (!price) return;\n\n    const currentPrice = parseFloat(price);\n    if (isNaN(currentPrice)) return;\n\n    const newPrice = currentPrice * (1 + percentage / 100);\n    onChange(newPrice.toString());\n  };\n\n  return (\n    <div className=\"relative z-20\">\n      <label className=\"block text-xs font-medium text-n1-ww-gray-700 dark:text-n1-ww-gray-300 mb-1\">\n        Price\n      </label>\n\n      <div className=\"relative\">\n        <input\n          type=\"text\"\n          value={price}\n          onChange={handlePriceChange}\n          className=\"w-full px-3 py-2 border border-n1-ww-gray-200 dark:border-n1-ww-gray-800 rounded-sm text-sm text-n1-ww-gray-900 dark:text-n1-ww-gray-100 focus:outline-none focus:ring-1 focus:ring-n1-ww-gray-400 dark:focus:ring-n1-ww-gray-600 focus:border-n1-ww-gray-400 dark:focus:border-n1-ww-gray-600 bg-white dark:bg-n1-ww-dark-950 font-mono transition-colors duration-200\"\n          placeholder=\"Enter price\"\n        />\n\n        {marketPrice && (\n          <button\n            type=\"button\"\n            onClick={setMarketPrice}\n            className=\"absolute right-2 top-1/2 transform -translate-y-1/2 text-[10px] border border-n1-ww-gray-200 dark:border-n1-ww-gray-800 text-n1-ww-gray-700 dark:text-n1-ww-gray-300 px-1.5 py-0.5 rounded-sm hover:bg-emerald-600 hover:border-emerald-600 hover:text-white dark:hover:bg-emerald-600 dark:hover:border-emerald-600 dark:hover:text-white transition-colors duration-200\"\n          >\n            Market\n          </button>\n        )}\n      </div>\n\n      {/* Price adjustment buttons */}\n      <div className=\"grid grid-cols-4 gap-1 mt-2\">\n        <button\n          type=\"button\"\n          onClick={() => adjustPrice(-1)}\n          className=\"text-xs px-1 py-0.5 bg-n1-ww-gray-100 dark:bg-n1-ww-gray-800 hover:bg-n1-ww-gray-200 dark:hover:bg-n1-ww-gray-700 rounded text-n1-ww-gray-700 dark:text-n1-ww-gray-300 transition-colors duration-200\"\n        >\n          -1%\n        </button>\n        <button\n          type=\"button\"\n          onClick={() => adjustPrice(-0.1)}\n          className=\"text-xs px-1 py-0.5 bg-n1-ww-gray-100 dark:bg-n1-ww-gray-800 hover:bg-n1-ww-gray-200 dark:hover:bg-n1-ww-gray-700 rounded text-n1-ww-gray-700 dark:text-n1-ww-gray-300 transition-colors duration-200\"\n        >\n          -0.1%\n        </button>\n        <button\n          type=\"button\"\n          onClick={() => adjustPrice(0.1)}\n          className=\"text-xs px-1 py-0.5 bg-n1-ww-gray-100 dark:bg-n1-ww-gray-800 hover:bg-n1-ww-gray-200 dark:hover:bg-n1-ww-gray-700 rounded text-n1-ww-gray-700 dark:text-n1-ww-gray-300 transition-colors duration-200\"\n        >\n          +0.1%\n        </button>\n        <button\n          type=\"button\"\n          onClick={() => adjustPrice(1)}\n          className=\"text-xs px-1 py-0.5 bg-n1-ww-gray-100 dark:bg-n1-ww-gray-800 hover:bg-n1-ww-gray-200 dark:hover:bg-n1-ww-gray-700 rounded text-n1-ww-gray-700 dark:text-n1-ww-gray-300 transition-colors duration-200\"\n        >\n          +1%\n        </button>\n      </div>\n    </div>\n  );\n}\n"]}

package/dist/Modal/Sidebar/NordTradingView/TradeForm/SubmitButton.d.ts

@@ -1,9 +0,0 @@
-import { OrderSide, OrderType } from './TradeForm';
-interface SubmitButtonProps {
-    loading: boolean;
-    side: OrderSide;
-    orderType: OrderType;
-    disabled: boolean;
-}
-export default function SubmitButton({ loading, side, orderType, disabled, }: SubmitButtonProps): JSX.Element;
-export {};

package/dist/Modal/Sidebar/NordTradingView/TradeForm/SubmitButton.js

@@ -1,40 +0,0 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { Loader2 } from 'lucide-react';
-import { useState } from 'react';
-export default function SubmitButton(_a) {
-    var loading = _a.loading, side = _a.side, orderType = _a.orderType, disabled = _a.disabled;
-    var _b = useState(false), isHovered = _b[0], setIsHovered = _b[1];
-    var _c = useState(false), isPressed = _c[0], setIsPressed = _c[1];
-    // Generate button text based on side and order type
-    var getButtonText = function () {
-        if (side === 'BUY') {
-            return "Buy ".concat(orderType === 'MARKET' ? 'Market' : 'Limit');
-        }
-        else {
-            return "Sell ".concat(orderType === 'MARKET' ? 'Market' : 'Limit');
-        }
-    };
-    // Generate button color based on side
-    var getButtonClass = function () {
-        var baseClasses = 'w-full py-3 rounded-sm font-medium transition-all duration-200 flex items-center justify-center relative overflow-hidden';
-        if (disabled || loading) {
-            return "".concat(baseClasses, " bg-n1-ww-gray-200 dark:bg-n1-ww-gray-800 text-n1-ww-gray-400 dark:text-n1-ww-gray-500 cursor-not-allowed");
-        }
-        if (side === 'BUY') {
-            return "".concat(baseClasses, " bg-emerald-600 hover:bg-emerald-700 text-white shadow-sm transform hover:scale-[0.99] active:scale-[0.98]");
-        }
-        else {
-            return "".concat(baseClasses, " bg-red-700 hover:bg-red-800 text-white shadow-sm transform hover:scale-[0.99] active:scale-[0.98]");
-        }
-    };
-    return (_jsxs("button", { type: "submit", disabled: disabled || loading, className: getButtonClass(), onMouseEnter: function () { return setIsHovered(true); }, onMouseLeave: function () {
-            setIsHovered(false);
-            setIsPressed(false);
-        }, onMouseDown: function () { return setIsPressed(true); }, onMouseUp: function () { return setIsPressed(false); }, children: [_jsx("span", { className: "relative z-10 flex items-center justify-center transition-transform duration-200 ".concat(isPressed ? 'scale-95' : ''), children: loading ? (_jsxs(_Fragment, { children: [_jsx(Loader2, { size: 18, className: "n1-ww-animate-spin mr-2 inline-block" }), "Processing..."] })) : (_jsxs(_Fragment, { children: [side === 'BUY' ? (_jsx("svg", { className: "w-4 h-4 mr-2", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { d: "M12 5L12 19M12 5L6 11M12 5L18 11", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className: "transition-transform duration-300 ".concat(isHovered ? 'translate-y-[-2px]' : '') }) })) : (_jsx("svg", { className: "w-4 h-4 mr-2", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { d: "M12 19L12 5M12 19L6 13M12 19L18 13", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className: "transition-transform duration-300 ".concat(isHovered ? 'translate-y-[2px]' : '') }) })), getButtonText()] })) }), !disabled && !loading && (_jsxs(_Fragment, { children: [_jsx("span", { className: "absolute inset-0 bg-gradient-to-r from-transparent via-white to-transparent opacity-25 pointer-events-none translate-x-[-200%] ".concat(isHovered ? 'animate-shimmer' : ''), style: {
-                            backgroundSize: '200% 100%',
-                            animationDuration: '1.5s',
-                        } }), _jsx("span", { className: "absolute inset-0 rounded-sm transition-opacity duration-300 pointer-events-none ".concat(isPressed
-                            ? 'bg-black opacity-10 dark:bg-white dark:opacity-10'
-                            : 'opacity-0') })] }))] }));
-}
-//# sourceMappingURL=SubmitButton.js.map

package/dist/Modal/Sidebar/NordTradingView/TradeForm/SubmitButton.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"SubmitButton.js","sourceRoot":"","sources":["../../../../../src/Modal/Sidebar/NordTradingView/TradeForm/SubmitButton.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AACvC,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAUjC,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,EAKjB;QAJlB,OAAO,aAAA,EACP,IAAI,UAAA,EACJ,SAAS,eAAA,EACT,QAAQ,cAAA;IAEF,IAAA,KAA4B,QAAQ,CAAC,KAAK,CAAC,EAA1C,SAAS,QAAA,EAAE,YAAY,QAAmB,CAAC;IAC5C,IAAA,KAA4B,QAAQ,CAAC,KAAK,CAAC,EAA1C,SAAS,QAAA,EAAE,YAAY,QAAmB,CAAC;IAElD,oDAAoD;IACpD,IAAM,aAAa,GAAG;QACpB,IAAI,IAAI,KAAK,KAAK,EAAE,CAAC;YACnB,OAAO,cAAO,SAAS,KAAK,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAE,CAAC;QAC9D,CAAC;aAAM,CAAC;YACN,OAAO,eAAQ,SAAS,KAAK,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAE,CAAC;QAC/D,CAAC;IACH,CAAC,CAAC;IAEF,sCAAsC;IACtC,IAAM,cAAc,GAAG;QACrB,IAAM,WAAW,GACf,0HAA0H,CAAC;QAE7H,IAAI,QAAQ,IAAI,OAAO,EAAE,CAAC;YACxB,OAAO,UAAG,WAAW,8GAA2G,CAAC;QACnI,CAAC;QAED,IAAI,IAAI,KAAK,KAAK,EAAE,CAAC;YACnB,OAAO,UAAG,WAAW,+GAA4G,CAAC;QACpI,CAAC;aAAM,CAAC;YACN,OAAO,UAAG,WAAW,uGAAoG,CAAC;QAC5H,CAAC;IACH,CAAC,CAAC;IAEF,OAAO,CACL,kBACE,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAE,QAAQ,IAAI,OAAO,EAC7B,SAAS,EAAE,cAAc,EAAE,EAC3B,YAAY,EAAE,cAAM,OAAA,YAAY,CAAC,IAAI,CAAC,EAAlB,CAAkB,EACtC,YAAY,EAAE;YACZ,YAAY,CAAC,KAAK,CAAC,CAAC;YACpB,YAAY,CAAC,KAAK,CAAC,CAAC;QACtB,CAAC,EACD,WAAW,EAAE,cAAM,OAAA,YAAY,CAAC,IAAI,CAAC,EAAlB,CAAkB,EACrC,SAAS,EAAE,cAAM,OAAA,YAAY,CAAC,KAAK,CAAC,EAAnB,CAAmB,aAEpC,eACE,SAAS,EAAE,2FAAoF,SAAS,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,CAAE,YAE3H,OAAO,CAAC,CAAC,CAAC,CACT,8BACE,KAAC,OAAO,IAAC,IAAI,EAAE,EAAE,EAAE,SAAS,EAAC,sCAAsC,GAAG,qBAErE,CACJ,CAAC,CAAC,CAAC,CACF,8BACG,IAAI,KAAK,KAAK,CAAC,CAAC,CAAC,CAChB,cACE,SAAS,EAAC,cAAc,EACxB,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,4BAA4B,YAElC,eACE,CAAC,EAAC,kCAAkC,EACpC,MAAM,EAAC,cAAc,EACrB,WAAW,EAAC,GAAG,EACf,aAAa,EAAC,OAAO,EACrB,cAAc,EAAC,OAAO,EACtB,SAAS,EAAE,4CAAqC,SAAS,CAAC,CAAC,CAAC,oBAAoB,CAAC,CAAC,CAAC,EAAE,CAAE,GACvF,GACE,CACP,CAAC,CAAC,CAAC,CACF,cACE,SAAS,EAAC,cAAc,EACxB,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,4BAA4B,YAElC,eACE,CAAC,EAAC,oCAAoC,EACtC,MAAM,EAAC,cAAc,EACrB,WAAW,EAAC,GAAG,EACf,aAAa,EAAC,OAAO,EACrB,cAAc,EAAC,OAAO,EACtB,SAAS,EAAE,4CAAqC,SAAS,CAAC,CAAC,CAAC,mBAAmB,CAAC,CAAC,CAAC,EAAE,CAAE,GACtF,GACE,CACP,EACA,aAAa,EAAE,IACf,CACJ,GACI,EAEN,CAAC,QAAQ,IAAI,CAAC,OAAO,IAAI,CACxB,8BACE,eACE,SAAS,EAAE,yIAAkI,SAAS,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,EAAE,CAAE,EACjL,KAAK,EAAE;4BACL,cAAc,EAAE,WAAW;4BAC3B,iBAAiB,EAAE,MAAM;yBAC1B,GACD,EACF,eACE,SAAS,EAAE,0FACT,SAAS;4BACP,CAAC,CAAC,mDAAmD;4BACrD,CAAC,CAAC,WAAW,CACf,GACF,IACD,CACJ,IACM,CACV,CAAC;AACJ,CAAC","sourcesContent":["import { Loader2 } from 'lucide-react';\nimport { useState } from 'react';\nimport { OrderSide, OrderType } from './TradeForm';\n\ninterface SubmitButtonProps {\n  loading: boolean;\n  side: OrderSide;\n  orderType: OrderType;\n  disabled: boolean;\n}\n\nexport default function SubmitButton({\n  loading,\n  side,\n  orderType,\n  disabled,\n}: SubmitButtonProps) {\n  const [isHovered, setIsHovered] = useState(false);\n  const [isPressed, setIsPressed] = useState(false);\n\n  // Generate button text based on side and order type\n  const getButtonText = () => {\n    if (side === 'BUY') {\n      return `Buy ${orderType === 'MARKET' ? 'Market' : 'Limit'}`;\n    } else {\n      return `Sell ${orderType === 'MARKET' ? 'Market' : 'Limit'}`;\n    }\n  };\n\n  // Generate button color based on side\n  const getButtonClass = () => {\n    const baseClasses =\n      'w-full py-3 rounded-sm font-medium transition-all duration-200 flex items-center justify-center relative overflow-hidden';\n\n    if (disabled || loading) {\n      return `${baseClasses} bg-n1-ww-gray-200 dark:bg-n1-ww-gray-800 text-n1-ww-gray-400 dark:text-n1-ww-gray-500 cursor-not-allowed`;\n    }\n\n    if (side === 'BUY') {\n      return `${baseClasses} bg-emerald-600 hover:bg-emerald-700 text-white shadow-sm transform hover:scale-[0.99] active:scale-[0.98]`;\n    } else {\n      return `${baseClasses} bg-red-700 hover:bg-red-800 text-white shadow-sm transform hover:scale-[0.99] active:scale-[0.98]`;\n    }\n  };\n\n  return (\n    <button\n      type=\"submit\"\n      disabled={disabled || loading}\n      className={getButtonClass()}\n      onMouseEnter={() => setIsHovered(true)}\n      onMouseLeave={() => {\n        setIsHovered(false);\n        setIsPressed(false);\n      }}\n      onMouseDown={() => setIsPressed(true)}\n      onMouseUp={() => setIsPressed(false)}\n    >\n      <span\n        className={`relative z-10 flex items-center justify-center transition-transform duration-200 ${isPressed ? 'scale-95' : ''}`}\n      >\n        {loading ? (\n          <>\n            <Loader2 size={18} className=\"n1-ww-animate-spin mr-2 inline-block\" />\n            Processing...\n          </>\n        ) : (\n          <>\n            {side === 'BUY' ? (\n              <svg\n                className=\"w-4 h-4 mr-2\"\n                viewBox=\"0 0 24 24\"\n                fill=\"none\"\n                xmlns=\"http://www.w3.org/2000/svg\"\n              >\n                <path\n                  d=\"M12 5L12 19M12 5L6 11M12 5L18 11\"\n                  stroke=\"currentColor\"\n                  strokeWidth=\"2\"\n                  strokeLinecap=\"round\"\n                  strokeLinejoin=\"round\"\n                  className={`transition-transform duration-300 ${isHovered ? 'translate-y-[-2px]' : ''}`}\n                />\n              </svg>\n            ) : (\n              <svg\n                className=\"w-4 h-4 mr-2\"\n                viewBox=\"0 0 24 24\"\n                fill=\"none\"\n                xmlns=\"http://www.w3.org/2000/svg\"\n              >\n                <path\n                  d=\"M12 19L12 5M12 19L6 13M12 19L18 13\"\n                  stroke=\"currentColor\"\n                  strokeWidth=\"2\"\n                  strokeLinecap=\"round\"\n                  strokeLinejoin=\"round\"\n                  className={`transition-transform duration-300 ${isHovered ? 'translate-y-[2px]' : ''}`}\n                />\n              </svg>\n            )}\n            {getButtonText()}\n          </>\n        )}\n      </span>\n\n      {!disabled && !loading && (\n        <>\n          <span\n            className={`absolute inset-0 bg-gradient-to-r from-transparent via-white to-transparent opacity-25 pointer-events-none translate-x-[-200%] ${isHovered ? 'animate-shimmer' : ''}`}\n            style={{\n              backgroundSize: '200% 100%',\n              animationDuration: '1.5s',\n            }}\n          />\n          <span\n            className={`absolute inset-0 rounded-sm transition-opacity duration-300 pointer-events-none ${\n              isPressed\n                ? 'bg-black opacity-10 dark:bg-white dark:opacity-10'\n                : 'opacity-0'\n            }`}\n          />\n        </>\n      )}\n    </button>\n  );\n}\n"]}

package/dist/Modal/Sidebar/NordTradingView/TradeForm/TotalCalculator.d.ts

@@ -1,7 +0,0 @@
-type OrderType = 'LIMIT' | 'MARKET';
-interface TotalCalculatorProps {
-    total: string;
-    orderType: OrderType;
-}
-export default function TotalCalculator({ total, orderType, }: TotalCalculatorProps): JSX.Element;
-export {};

package/dist/Modal/Sidebar/NordTradingView/TradeForm/TotalCalculator.js

@@ -1,10 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-export default function TotalCalculator(_a) {
-    var total = _a.total, orderType = _a.orderType;
-    // Calculate fee (example: 0.1% fee)
-    var fee = total && orderType === 'LIMIT'
-        ? (parseFloat(total) * 0.001).toFixed(6)
-        : '0.00';
-    return (_jsxs("div", { className: "relative z-20", children: [_jsx("label", { className: "block text-xs font-medium text-n1-ww-gray-700 dark:text-n1-ww-gray-300 mb-1", children: "Total" }), _jsx("div", { className: "px-3 py-2 border border-n1-ww-gray-200 dark:border-n1-ww-gray-800 rounded-sm text-sm text-n1-ww-gray-900 dark:text-n1-ww-gray-100 bg-n1-ww-gray-50 dark:bg-n1-ww-dark-950 font-mono", children: orderType === 'MARKET' ? (_jsx("span", { className: "text-n1-ww-gray-500 dark:text-n1-ww-gray-400", children: "Market Order" })) : total ? (total) : (_jsx("span", { className: "text-n1-ww-gray-400 dark:text-n1-ww-gray-500", children: "0.00" })) }), _jsxs("div", { className: "mt-1 text-[10px] text-n1-ww-gray-500 dark:text-n1-ww-gray-400 flex justify-between", children: [_jsx("span", { children: "Estimated fee:" }), _jsx("span", { className: "font-mono", children: fee })] })] }));
-}
-//# sourceMappingURL=TotalCalculator.js.map

package/dist/Modal/Sidebar/NordTradingView/TradeForm/TotalCalculator.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"TotalCalculator.js","sourceRoot":"","sources":["../../../../../src/Modal/Sidebar/NordTradingView/TradeForm/TotalCalculator.tsx"],"names":[],"mappings":";AAUA,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,EAGjB;QAFrB,KAAK,WAAA,EACL,SAAS,eAAA;IAET,oCAAoC;IACpC,IAAM,GAAG,GACP,KAAK,IAAI,SAAS,KAAK,OAAO;QAC5B,CAAC,CAAC,CAAC,UAAU,CAAC,KAAK,CAAC,GAAG,KAAK,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC;QACxC,CAAC,CAAC,MAAM,CAAC;IAEb,OAAO,CACL,eAAK,SAAS,EAAC,eAAe,aAC5B,gBAAO,SAAS,EAAC,6EAA6E,sBAEtF,EACR,cAAK,SAAS,EAAC,qLAAqL,YACjM,SAAS,KAAK,QAAQ,CAAC,CAAC,CAAC,CACxB,eAAM,SAAS,EAAC,8CAA8C,6BAAoB,CACnF,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CACV,KAAK,CACN,CAAC,CAAC,CAAC,CACF,eAAM,SAAS,EAAC,8CAA8C,qBAAY,CAC3E,GACG,EAGN,eAAK,SAAS,EAAC,oFAAoF,aACjG,4CAA2B,EAC3B,eAAM,SAAS,EAAC,WAAW,YAAE,GAAG,GAAQ,IACpC,IACF,CACP,CAAC;AACJ,CAAC","sourcesContent":["import React from 'react';\n\n// We still need OrderType for backward compatibility with the TotalCalculator\ntype OrderType = 'LIMIT' | 'MARKET';\n\ninterface TotalCalculatorProps {\n  total: string;\n  orderType: OrderType;\n}\n\nexport default function TotalCalculator({\n  total,\n  orderType,\n}: TotalCalculatorProps) {\n  // Calculate fee (example: 0.1% fee)\n  const fee =\n    total && orderType === 'LIMIT'\n      ? (parseFloat(total) * 0.001).toFixed(6)\n      : '0.00';\n\n  return (\n    <div className=\"relative z-20\">\n      <label className=\"block text-xs font-medium text-n1-ww-gray-700 dark:text-n1-ww-gray-300 mb-1\">\n        Total\n      </label>\n      <div className=\"px-3 py-2 border border-n1-ww-gray-200 dark:border-n1-ww-gray-800 rounded-sm text-sm text-n1-ww-gray-900 dark:text-n1-ww-gray-100 bg-n1-ww-gray-50 dark:bg-n1-ww-dark-950 font-mono\">\n        {orderType === 'MARKET' ? (\n          <span className=\"text-n1-ww-gray-500 dark:text-n1-ww-gray-400\">Market Order</span>\n        ) : total ? (\n          total\n        ) : (\n          <span className=\"text-n1-ww-gray-400 dark:text-n1-ww-gray-500\">0.00</span>\n        )}\n      </div>\n\n      {/* Fee estimate */}\n      <div className=\"mt-1 text-[10px] text-n1-ww-gray-500 dark:text-n1-ww-gray-400 flex justify-between\">\n        <span>Estimated fee:</span>\n        <span className=\"font-mono\">{fee}</span>\n      </div>\n    </div>\n  );\n}\n"]}

package/dist/Modal/Sidebar/NordTradingView/TradeForm/TradeForm.d.ts

@@ -1,13 +0,0 @@
-/**
- * @deprecated This component is deprecated due to technical issues.
- * Please refer to DEPRECATED.md for more information.
- */
-interface TradeFormProps {
-    marketSymbol: string | null;
-    marketId?: number;
-}
-export type OrderSide = 'BUY' | 'SELL';
-export type OrderType = 'LIMIT' | 'MARKET';
-export type FillMode = 'GTC' | 'POST_ONLY' | 'IOC' | 'FOK';
-export default function TradeForm({ marketSymbol, marketId }: TradeFormProps): JSX.Element;
-export {};