@loafmarkets/ui 0.1.105 → 0.1.108

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/dist/index.js +52 -53
  2. package/dist/index.js.map +1 -1
  3. package/dist/index.mjs +52 -53
  4. package/dist/index.mjs.map +1 -1
  5. package/package.json +1 -1
package/dist/index.js CHANGED
@@ -9891,72 +9891,68 @@ var Separator = styled25__default.default.span`
9891
9891
  `;
9892
9892
  var IPODropdown = styled25__default.default.div`
9893
9893
  position: absolute;
9894
- top: calc(100% + 12px);
9894
+ top: calc(100% + 6px);
9895
9895
  left: 0;
9896
- right: 0;
9897
- background: #0a0a0a;
9898
- border-radius: 16px;
9899
- box-shadow: 0 20px 40px rgba(0,0,0,0.8), 0 4px 12px rgba(0,0,0,0.5), inset 0 1px 0 rgba(255,255,255,0.1);
9896
+ width: 320px;
9897
+ background: #0d0d0f;
9898
+ border-radius: 10px;
9899
+ box-shadow: 0 12px 32px rgba(0,0,0,0.7), 0 0 0 1px rgba(255,255,255,0.06);
9900
9900
  z-index: 1000;
9901
- max-height: 360px;
9901
+ max-height: 320px;
9902
9902
  overflow-y: auto;
9903
- border: 1px solid rgba(255,255,255,0.08);
9903
+ padding: 4px;
9904
+
9905
+ scrollbar-width: thin;
9906
+ scrollbar-color: rgba(255,255,255,0.12) transparent;
9907
+ &::-webkit-scrollbar { width: 4px; }
9908
+ &::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.12); border-radius: 2px; }
9904
9909
 
9905
9910
  @media (max-width: 480px) {
9906
- max-height: 280px;
9907
- border-radius: 12px;
9911
+ width: 280px;
9912
+ max-height: 260px;
9913
+ border-radius: 8px;
9908
9914
  }
9909
- animation: slideDown 0.3s cubic-bezier(0.4,0,0.2,1);
9915
+ animation: slideDown 0.2s cubic-bezier(0.16,1,0.3,1);
9910
9916
  @keyframes slideDown {
9911
- from { opacity: 0; transform: translateY(-10px); }
9917
+ from { opacity: 0; transform: translateY(-6px); }
9912
9918
  to { opacity: 1; transform: translateY(0); }
9913
9919
  }
9914
9920
  `;
9915
9921
  var IPOOption = styled25__default.default.div`
9916
- padding: 1.25rem 1.5rem;
9917
- transition: all 0.2s ease;
9918
- border-bottom: 1px solid rgba(255,255,255,0.03);
9922
+ padding: 0.6rem 0.75rem;
9923
+ transition: background 0.15s ease;
9924
+ border-radius: 7px;
9919
9925
  position: relative;
9920
- &:last-child { border-bottom: none; }
9921
- &:before {
9922
- content: '';
9923
- position: absolute;
9924
- left: 0;
9925
- top: 0;
9926
- bottom: 0;
9927
- width: 3px;
9928
- background: ${(p) => p.$selected ? "var(--color-accent)" : "transparent"};
9929
- transition: all 0.2s ease;
9930
- }
9931
- &:hover { background: linear-gradient(90deg, rgba(255,255,255,0.06) 0%, transparent 100%); }
9932
- ${(p) => p.$selected && `background: linear-gradient(90deg, rgba(56,97,251,0.15) 0%, transparent 100%);`}
9926
+ &:hover { background: rgba(255,255,255,0.06); }
9927
+ ${(p) => p.$selected && `background: rgba(255,255,255,0.04);`}
9933
9928
  `;
9934
9929
  var IPOOptionInner = styled25__default.default.div`
9935
9930
  display: flex;
9936
9931
  align-items: center;
9937
- gap: 1rem;
9932
+ gap: 0.65rem;
9938
9933
  `;
9939
9934
  var IPOOptionThumb = styled25__default.default.img`
9940
- width: 36px;
9941
- height: 36px;
9942
- border-radius: 6px;
9935
+ width: 28px;
9936
+ height: 28px;
9937
+ border-radius: 5px;
9943
9938
  object-fit: cover;
9944
9939
  flex-shrink: 0;
9945
- border: 1px solid rgba(255, 255, 255, 0.08);
9946
9940
  `;
9947
9941
  var IPOOptionName = styled25__default.default.div`
9948
- font-weight: 600;
9949
- font-size: 1rem;
9950
- color: #ffffff;
9951
- margin-bottom: 0.35rem;
9942
+ font-weight: 500;
9943
+ font-size: 0.82rem;
9944
+ color: ${(p) => "#ebebeb"};
9945
+ line-height: 1.3;
9952
9946
  `;
9953
9947
  var IPOOptionLocation = styled25__default.default.div`
9954
- font-size: 0.875rem;
9955
- color: rgba(255,255,255,0.5);
9948
+ font-size: 0.72rem;
9949
+ color: rgba(255,255,255,0.38);
9950
+ margin-top: 1px;
9956
9951
  span {
9957
- margin-left: 0.5rem;
9958
- color: var(--color-accent);
9959
- font-size: 0.75rem;
9952
+ margin-left: 0.4rem;
9953
+ color: var(--color-accent, #E6C87E);
9954
+ font-size: 0.68rem;
9955
+ font-weight: 500;
9960
9956
  }
9961
9957
  `;
9962
9958
  var formatCurrency3 = (amount) => {
@@ -11988,11 +11984,11 @@ function PortfolioActivityPanel({
11988
11984
  positions.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
11989
11985
  /* @__PURE__ */ jsxRuntime.jsxs(PositionsHeader, { $hasClose: !!onClosePosition, children: [
11990
11986
  /* @__PURE__ */ jsxRuntime.jsx(PositionsHeaderCell, { children: "Asset" }),
11991
- /* @__PURE__ */ jsxRuntime.jsx(PositionsHeaderCell, { $align: "right", children: "Size" }),
11992
- /* @__PURE__ */ jsxRuntime.jsx(PositionsHeaderCell, { $align: "right", children: "Value" }),
11993
- /* @__PURE__ */ jsxRuntime.jsx(PositionsHeaderCell, { $align: "right", children: "Entry Price" }),
11994
- /* @__PURE__ */ jsxRuntime.jsx(PositionsHeaderCell, { $align: "right", children: "Mark Price" }),
11995
- /* @__PURE__ */ jsxRuntime.jsx(PositionsHeaderCell, { $align: "right", children: "PNL (%)" }),
11987
+ /* @__PURE__ */ jsxRuntime.jsx(PositionsHeaderCell, { children: "Size" }),
11988
+ /* @__PURE__ */ jsxRuntime.jsx(PositionsHeaderCell, { children: "Value" }),
11989
+ /* @__PURE__ */ jsxRuntime.jsx(PositionsHeaderCell, { children: "Entry Price" }),
11990
+ /* @__PURE__ */ jsxRuntime.jsx(PositionsHeaderCell, { children: "Mark Price" }),
11991
+ /* @__PURE__ */ jsxRuntime.jsx(PositionsHeaderCell, { children: "PNL (%)" }),
11996
11992
  onClosePosition && /* @__PURE__ */ jsxRuntime.jsx(PositionsHeaderCell, { children: "Close" })
11997
11993
  ] }),
11998
11994
  pageSlice(positions).map((pos) => {
@@ -12003,11 +11999,11 @@ function PortfolioActivityPanel({
12003
11999
  const isPositive = pnl >= 0;
12004
12000
  return /* @__PURE__ */ jsxRuntime.jsxs(PositionsRow, { $hasClose: !!onClosePosition, onClick: () => onPositionClick?.(pos.tokenName, pos.isIpoAllocation), children: [
12005
12001
  /* @__PURE__ */ jsxRuntime.jsx(PositionsCell, { children: /* @__PURE__ */ jsxRuntime.jsx(HoldingsProperty, { children: pos.tokenName }) }),
12006
- /* @__PURE__ */ jsxRuntime.jsx(PositionsCell, { $align: "right", children: /* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "#fff", fontSize: "0.8rem" }, children: formatNumber2(pos.quantity) }) }),
12007
- /* @__PURE__ */ jsxRuntime.jsx(PositionsCell, { $align: "right", children: /* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "#fff", fontSize: "0.8rem" }, children: formatCurrency5(currentValue) }) }),
12008
- /* @__PURE__ */ jsxRuntime.jsx(PositionsCell, { $align: "right", children: /* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "rgba(255,255,255,0.7)", fontSize: "0.8rem" }, children: formatCurrency5(pos.averageEntryPrice) }) }),
12009
- /* @__PURE__ */ jsxRuntime.jsx(PositionsCell, { $align: "right", children: /* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "#fff", fontSize: "0.8rem" }, children: formatCurrency5(pos.marketPrice) }) }),
12010
- /* @__PURE__ */ jsxRuntime.jsxs(PositionsCell, { $align: "right", children: [
12002
+ /* @__PURE__ */ jsxRuntime.jsx(PositionsCell, { children: /* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "#fff", fontSize: "0.8rem" }, children: formatNumber2(pos.quantity) }) }),
12003
+ /* @__PURE__ */ jsxRuntime.jsx(PositionsCell, { children: /* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "#fff", fontSize: "0.8rem" }, children: formatCurrency5(currentValue) }) }),
12004
+ /* @__PURE__ */ jsxRuntime.jsx(PositionsCell, { children: /* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "rgba(255,255,255,0.7)", fontSize: "0.8rem" }, children: formatCurrency5(pos.averageEntryPrice) }) }),
12005
+ /* @__PURE__ */ jsxRuntime.jsx(PositionsCell, { children: /* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "#fff", fontSize: "0.8rem" }, children: formatCurrency5(pos.marketPrice) }) }),
12006
+ /* @__PURE__ */ jsxRuntime.jsxs(PositionsCell, { children: [
12011
12007
  /* @__PURE__ */ jsxRuntime.jsxs(PnLAmount, { $positive: isPositive, children: [
12012
12008
  isPositive ? "+" : "-",
12013
12009
  formatCurrency5(Math.abs(pnl))
@@ -12018,7 +12014,7 @@ function PortfolioActivityPanel({
12018
12014
  "%"
12019
12015
  ] })
12020
12016
  ] }),
12021
- onClosePosition && /* @__PURE__ */ jsxRuntime.jsx(PositionsCell, { $align: "left", children: /* @__PURE__ */ jsxRuntime.jsxs(CloseActions, { children: [
12017
+ onClosePosition && /* @__PURE__ */ jsxRuntime.jsx(PositionsCell, { children: /* @__PURE__ */ jsxRuntime.jsxs(CloseActions, { children: [
12022
12018
  /* @__PURE__ */ jsxRuntime.jsx(CloseBtn2, { onClick: (e) => {
12023
12019
  e.stopPropagation();
12024
12020
  onClosePosition(pos.tokenName, "limit", pos.quantity, pos.marketPrice);
@@ -12564,9 +12560,12 @@ var CloseBtn2 = styled25__default.default.button`
12564
12560
  font-size: 0.62rem;
12565
12561
  font-weight: 600;
12566
12562
  color: #E6C87E;
12567
- cursor: pointer;
12563
+ cursor: pointer !important;
12568
12564
  white-space: nowrap;
12569
12565
  transition: all 0.15s ease;
12566
+ position: relative;
12567
+ z-index: 2;
12568
+ pointer-events: auto;
12570
12569
 
12571
12570
  &:hover {
12572
12571
  background: rgba(230, 200, 126, 0.1);