@loafmarkets/ui 0.1.367 → 0.1.369
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.
- package/dist/index.d.mts +19 -1
- package/dist/index.d.ts +19 -1
- package/dist/index.js +135 -0
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +135 -2
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.d.mts
CHANGED
|
@@ -1088,6 +1088,7 @@ type PropertyBuyProps = {
|
|
|
1088
1088
|
tradeHistory?: readonly TradeHistoryItem[];
|
|
1089
1089
|
transfers?: readonly TransferHistoryItem[];
|
|
1090
1090
|
onCancelOrder?: (orderId: number) => Promise<void>;
|
|
1091
|
+
onCancelAllOrders?: () => Promise<void>;
|
|
1091
1092
|
onClosePosition?: (tokenName: string, type: 'market' | 'limit', quantity: number, marketPrice: number) => void;
|
|
1092
1093
|
cancellingOrderId?: number | null;
|
|
1093
1094
|
};
|
|
@@ -1236,4 +1237,21 @@ interface ContactPopupProps {
|
|
|
1236
1237
|
}
|
|
1237
1238
|
declare const ContactPopup: ({ onClose }: ContactPopupProps) => react_jsx_runtime.JSX.Element;
|
|
1238
1239
|
|
|
1239
|
-
|
|
1240
|
+
interface SparklineChartProps {
|
|
1241
|
+
data: number[];
|
|
1242
|
+
width: number;
|
|
1243
|
+
height: number;
|
|
1244
|
+
positive: boolean;
|
|
1245
|
+
}
|
|
1246
|
+
/**
|
|
1247
|
+
* Downsamples candles to at most `maxPoints` close prices for a sparkline,
|
|
1248
|
+
* always keeping the final close so the line ends on the latest price.
|
|
1249
|
+
* Reads `close` (the canonical Candle field per @loafmarkets/shared-types);
|
|
1250
|
+
* typed structurally so any `{ close }`-shaped candle works.
|
|
1251
|
+
*/
|
|
1252
|
+
declare function extractSparkline(candles: ReadonlyArray<{
|
|
1253
|
+
close: number;
|
|
1254
|
+
}>, maxPoints?: number): number[];
|
|
1255
|
+
declare const SparklineChart: React__default.NamedExoticComponent<SparklineChartProps>;
|
|
1256
|
+
|
|
1257
|
+
export { type ActivityTabId, AssetSelectorBar, type AssetSelectorBarProps, type AssetSelectorMetric, Badge, type BadgeProps, Button, type ButtonProps, Card, CardContent, type CardContentProps, CardDescription, type CardDescriptionProps, CardFooter, type CardFooterProps, CardHeader, type CardHeaderProps, type CardProps, CardTitle, type CardTitleProps, ContactPopup, type ContactPopupProps, type FinancialItem, type FundWalletParams, type FundWalletResult, Header, type HeaderPortfolioData, type HeaderProps, type HousePositionOrderbook, type HousePositionPendingOrder, HousePositionSlider, HousePositionSliderMobile, type HousePositionSliderMobileOrderPayload, type HousePositionSliderMobileOrderbook, type HousePositionSliderMobileProps, type HousePositionSliderOrderPayload, type HousePositionSliderProps, type InspectionSlot, LoafLiquidityBadge, LoafLiquidityLogo, type LoafLiquidityLogoProps, LoginPopup, type LoginPopupProps, MobileTradeNav, type MobileTradeNavItem, type MobileTradeNavProps, type OfferStatus, OfferingProgressCard, type OfferingProgressCardProps, Orderbook, type OrderbookLevel, type OrderbookProps, type OrderbookSide, type OrderbookTrade, type OverviewImage, type OverviewResponse, OwnerBooking, type OwnerBookingProps, PaymentPopup, type PaymentPopupProps, PortfolioActivityPanel, type PortfolioActivityPanelProps, type PortfolioPosition, PortfolioSummary, type PortfolioSummaryProps, PriceChart, type PriceChartCandle, type PriceChartProps, type PriceChartRange, type PropertyAddressOption, PropertyBuy, PropertyCompareBar, type PropertyCompareBarProps, PropertyDocuments, type PropertyGalleryHotspot, type PropertyGalleryImage, PropertyHeroHeader, type PropertyHeroHeaderProps, PropertyHistory, type PropertyInfoItem, PropertyInspectionTimes, PropertyMediaRow, type PropertyMediaRowProps, type PropertyNewsItem, type PropertyNewsType, PropertyNewsUpdates, type PropertyNewsUpdatesProps, type PropertyOffer, PropertyOffers, type PropertyOffersProps, PropertyOverview, type PropertyOverviewProps, PropertyPhotoGallery, type PropertyPriceSummary, PropertySubheader, type PropertySubheaderAction, type PropertySubheaderProps, type PropertySubheaderTab, PropertyTour, type PropertyTourProps, PropertyValuation, type PropertyValuationProps, type PropertyValueSummary, type PurchaseFeedItem, type SelectorItem, SiteFooter, Skeleton, type SkeletonProps, SlideDigit, SparklineChart, type SparklineChartProps, type ToastData, ToastProvider, type ToastVariant, TradeConfirmationModal, type TradeConfirmationModalDetails, type TradeConfirmationModalProps, TradingSlider, type TradingSliderProps, type YourOrder, type YourOrderSide, YourOrders, type YourOrdersProps, badgeVariants, buttonVariants, extractSparkline, hasPendingActivity, useAdaptivePolling, useToast };
|
package/dist/index.d.ts
CHANGED
|
@@ -1088,6 +1088,7 @@ type PropertyBuyProps = {
|
|
|
1088
1088
|
tradeHistory?: readonly TradeHistoryItem[];
|
|
1089
1089
|
transfers?: readonly TransferHistoryItem[];
|
|
1090
1090
|
onCancelOrder?: (orderId: number) => Promise<void>;
|
|
1091
|
+
onCancelAllOrders?: () => Promise<void>;
|
|
1091
1092
|
onClosePosition?: (tokenName: string, type: 'market' | 'limit', quantity: number, marketPrice: number) => void;
|
|
1092
1093
|
cancellingOrderId?: number | null;
|
|
1093
1094
|
};
|
|
@@ -1236,4 +1237,21 @@ interface ContactPopupProps {
|
|
|
1236
1237
|
}
|
|
1237
1238
|
declare const ContactPopup: ({ onClose }: ContactPopupProps) => react_jsx_runtime.JSX.Element;
|
|
1238
1239
|
|
|
1239
|
-
|
|
1240
|
+
interface SparklineChartProps {
|
|
1241
|
+
data: number[];
|
|
1242
|
+
width: number;
|
|
1243
|
+
height: number;
|
|
1244
|
+
positive: boolean;
|
|
1245
|
+
}
|
|
1246
|
+
/**
|
|
1247
|
+
* Downsamples candles to at most `maxPoints` close prices for a sparkline,
|
|
1248
|
+
* always keeping the final close so the line ends on the latest price.
|
|
1249
|
+
* Reads `close` (the canonical Candle field per @loafmarkets/shared-types);
|
|
1250
|
+
* typed structurally so any `{ close }`-shaped candle works.
|
|
1251
|
+
*/
|
|
1252
|
+
declare function extractSparkline(candles: ReadonlyArray<{
|
|
1253
|
+
close: number;
|
|
1254
|
+
}>, maxPoints?: number): number[];
|
|
1255
|
+
declare const SparklineChart: React__default.NamedExoticComponent<SparklineChartProps>;
|
|
1256
|
+
|
|
1257
|
+
export { type ActivityTabId, AssetSelectorBar, type AssetSelectorBarProps, type AssetSelectorMetric, Badge, type BadgeProps, Button, type ButtonProps, Card, CardContent, type CardContentProps, CardDescription, type CardDescriptionProps, CardFooter, type CardFooterProps, CardHeader, type CardHeaderProps, type CardProps, CardTitle, type CardTitleProps, ContactPopup, type ContactPopupProps, type FinancialItem, type FundWalletParams, type FundWalletResult, Header, type HeaderPortfolioData, type HeaderProps, type HousePositionOrderbook, type HousePositionPendingOrder, HousePositionSlider, HousePositionSliderMobile, type HousePositionSliderMobileOrderPayload, type HousePositionSliderMobileOrderbook, type HousePositionSliderMobileProps, type HousePositionSliderOrderPayload, type HousePositionSliderProps, type InspectionSlot, LoafLiquidityBadge, LoafLiquidityLogo, type LoafLiquidityLogoProps, LoginPopup, type LoginPopupProps, MobileTradeNav, type MobileTradeNavItem, type MobileTradeNavProps, type OfferStatus, OfferingProgressCard, type OfferingProgressCardProps, Orderbook, type OrderbookLevel, type OrderbookProps, type OrderbookSide, type OrderbookTrade, type OverviewImage, type OverviewResponse, OwnerBooking, type OwnerBookingProps, PaymentPopup, type PaymentPopupProps, PortfolioActivityPanel, type PortfolioActivityPanelProps, type PortfolioPosition, PortfolioSummary, type PortfolioSummaryProps, PriceChart, type PriceChartCandle, type PriceChartProps, type PriceChartRange, type PropertyAddressOption, PropertyBuy, PropertyCompareBar, type PropertyCompareBarProps, PropertyDocuments, type PropertyGalleryHotspot, type PropertyGalleryImage, PropertyHeroHeader, type PropertyHeroHeaderProps, PropertyHistory, type PropertyInfoItem, PropertyInspectionTimes, PropertyMediaRow, type PropertyMediaRowProps, type PropertyNewsItem, type PropertyNewsType, PropertyNewsUpdates, type PropertyNewsUpdatesProps, type PropertyOffer, PropertyOffers, type PropertyOffersProps, PropertyOverview, type PropertyOverviewProps, PropertyPhotoGallery, type PropertyPriceSummary, PropertySubheader, type PropertySubheaderAction, type PropertySubheaderProps, type PropertySubheaderTab, PropertyTour, type PropertyTourProps, PropertyValuation, type PropertyValuationProps, type PropertyValueSummary, type PurchaseFeedItem, type SelectorItem, SiteFooter, Skeleton, type SkeletonProps, SlideDigit, SparklineChart, type SparklineChartProps, type ToastData, ToastProvider, type ToastVariant, TradeConfirmationModal, type TradeConfirmationModalDetails, type TradeConfirmationModalProps, TradingSlider, type TradingSliderProps, type YourOrder, type YourOrderSide, YourOrders, type YourOrdersProps, badgeVariants, buttonVariants, extractSparkline, hasPendingActivity, useAdaptivePolling, useToast };
|
package/dist/index.js
CHANGED
|
@@ -15484,6 +15484,7 @@ function PropertyBuy({
|
|
|
15484
15484
|
tradeHistory: portfolioActivity?.tradeHistory,
|
|
15485
15485
|
transfers: portfolioActivity?.transfers,
|
|
15486
15486
|
onCancelOrder: portfolioActivity?.onCancelOrder,
|
|
15487
|
+
onCancelAllOrders: portfolioActivity?.onCancelAllOrders,
|
|
15487
15488
|
onClosePosition: portfolioActivity?.onClosePosition,
|
|
15488
15489
|
cancellingOrderId: portfolioActivity?.cancellingOrderId,
|
|
15489
15490
|
defaultTab: "subscriptions",
|
|
@@ -18599,6 +18600,138 @@ var SiteFooter = () => {
|
|
|
18599
18600
|
showContactPopup && /* @__PURE__ */ jsxRuntime.jsx(ContactPopup, { onClose: () => setShowContactPopup(false) })
|
|
18600
18601
|
] });
|
|
18601
18602
|
};
|
|
18603
|
+
var PAD_Y = 2;
|
|
18604
|
+
function lerp(a, b, t) {
|
|
18605
|
+
return a + (b - a) * t;
|
|
18606
|
+
}
|
|
18607
|
+
function extractSparkline(candles, maxPoints = 20) {
|
|
18608
|
+
if (!candles.length) return [];
|
|
18609
|
+
const step = Math.max(1, Math.floor(candles.length / maxPoints));
|
|
18610
|
+
const points = [];
|
|
18611
|
+
for (let i = 0; i < candles.length; i += step) {
|
|
18612
|
+
points.push(candles[i].close);
|
|
18613
|
+
}
|
|
18614
|
+
if (points.length > 0) {
|
|
18615
|
+
const last = candles[candles.length - 1].close;
|
|
18616
|
+
if (points[points.length - 1] !== last) {
|
|
18617
|
+
points.push(last);
|
|
18618
|
+
}
|
|
18619
|
+
}
|
|
18620
|
+
return points;
|
|
18621
|
+
}
|
|
18622
|
+
var SparklineChart = React5__namespace.default.memo(function SparklineChart2({ data, width, height, positive }) {
|
|
18623
|
+
const [hoverX, setHoverX] = React5.useState(null);
|
|
18624
|
+
const svgRef = React5.useRef(null);
|
|
18625
|
+
const { linePath, fillPath, points } = React5.useMemo(() => {
|
|
18626
|
+
const mn = Math.min(...data);
|
|
18627
|
+
const mx = Math.max(...data);
|
|
18628
|
+
const range = mx - mn || 1;
|
|
18629
|
+
const stepX = width / (data.length - 1);
|
|
18630
|
+
const pts = data.map((v, i) => ({
|
|
18631
|
+
x: i * stepX,
|
|
18632
|
+
y: height - (v - mn) / range * (height - PAD_Y * 2) - PAD_Y
|
|
18633
|
+
}));
|
|
18634
|
+
const line = pts.map((p, i) => `${i === 0 ? "M" : "L"}${p.x},${p.y}`).join(" ");
|
|
18635
|
+
const fill = `${line} L${width},${height} L0,${height} Z`;
|
|
18636
|
+
return { linePath: line, fillPath: fill, points: pts };
|
|
18637
|
+
}, [data, width, height]);
|
|
18638
|
+
const interpolated = React5.useMemo(() => {
|
|
18639
|
+
if (hoverX == null || points.length < 2) return null;
|
|
18640
|
+
const stepX = width / (data.length - 1);
|
|
18641
|
+
const rawIdx = hoverX / stepX;
|
|
18642
|
+
const i0 = Math.floor(rawIdx);
|
|
18643
|
+
const i1 = Math.min(i0 + 1, data.length - 1);
|
|
18644
|
+
const t = rawIdx - i0;
|
|
18645
|
+
return {
|
|
18646
|
+
x: hoverX,
|
|
18647
|
+
y: lerp(points[i0].y, points[i1].y, t),
|
|
18648
|
+
price: lerp(data[i0], data[i1], t)
|
|
18649
|
+
};
|
|
18650
|
+
}, [hoverX, points, data, width]);
|
|
18651
|
+
const handleMouseMove = React5.useCallback((e) => {
|
|
18652
|
+
const svg = svgRef.current;
|
|
18653
|
+
if (!svg) return;
|
|
18654
|
+
const rect = svg.getBoundingClientRect();
|
|
18655
|
+
const x = Math.max(0, Math.min(width, e.clientX - rect.left));
|
|
18656
|
+
setHoverX(x);
|
|
18657
|
+
}, [width]);
|
|
18658
|
+
const handleMouseLeave = React5.useCallback(() => setHoverX(null), []);
|
|
18659
|
+
if (data.length < 2) return null;
|
|
18660
|
+
const color = positive ? "#00C076" : "#FF5757";
|
|
18661
|
+
const gradId = `spark-grad-${positive ? "up" : "dn"}`;
|
|
18662
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
18663
|
+
"svg",
|
|
18664
|
+
{
|
|
18665
|
+
ref: svgRef,
|
|
18666
|
+
width,
|
|
18667
|
+
height,
|
|
18668
|
+
style: { display: "block", overflow: "visible", cursor: hoverX != null ? "crosshair" : "default" },
|
|
18669
|
+
onMouseMove: handleMouseMove,
|
|
18670
|
+
onMouseLeave: handleMouseLeave,
|
|
18671
|
+
children: [
|
|
18672
|
+
/* @__PURE__ */ jsxRuntime.jsx("defs", { children: /* @__PURE__ */ jsxRuntime.jsxs("linearGradient", { id: gradId, x1: "0", y1: "0", x2: "0", y2: "1", children: [
|
|
18673
|
+
/* @__PURE__ */ jsxRuntime.jsx("stop", { offset: "0%", stopColor: color, stopOpacity: 0.15 }),
|
|
18674
|
+
/* @__PURE__ */ jsxRuntime.jsx("stop", { offset: "100%", stopColor: color, stopOpacity: 0 })
|
|
18675
|
+
] }) }),
|
|
18676
|
+
/* @__PURE__ */ jsxRuntime.jsx("path", { d: fillPath, fill: `url(#${gradId})` }),
|
|
18677
|
+
/* @__PURE__ */ jsxRuntime.jsx("path", { d: linePath, fill: "none", stroke: color, strokeWidth: 1.5, strokeLinejoin: "round", strokeLinecap: "round" }),
|
|
18678
|
+
interpolated && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
18679
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
18680
|
+
"line",
|
|
18681
|
+
{
|
|
18682
|
+
x1: interpolated.x,
|
|
18683
|
+
y1: 0,
|
|
18684
|
+
x2: interpolated.x,
|
|
18685
|
+
y2: height,
|
|
18686
|
+
stroke: "rgba(255,255,255,0.2)",
|
|
18687
|
+
strokeWidth: 1,
|
|
18688
|
+
strokeDasharray: "2,2"
|
|
18689
|
+
}
|
|
18690
|
+
),
|
|
18691
|
+
/* @__PURE__ */ jsxRuntime.jsx("circle", { cx: interpolated.x, cy: interpolated.y, r: 3, fill: color, stroke: "#0A0A0C", strokeWidth: 1.5 }),
|
|
18692
|
+
(() => {
|
|
18693
|
+
const above = interpolated.y > 24;
|
|
18694
|
+
const tooltipY = above ? interpolated.y - 26 : interpolated.y + 8;
|
|
18695
|
+
const tooltipX = Math.min(Math.max(interpolated.x - 28, 0), width - 56);
|
|
18696
|
+
const textX = tooltipX + 28;
|
|
18697
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("g", { children: [
|
|
18698
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
18699
|
+
"rect",
|
|
18700
|
+
{
|
|
18701
|
+
x: tooltipX,
|
|
18702
|
+
y: tooltipY,
|
|
18703
|
+
width: 56,
|
|
18704
|
+
height: 16,
|
|
18705
|
+
rx: 3,
|
|
18706
|
+
fill: "rgba(0,0,0,0.75)",
|
|
18707
|
+
stroke: "rgba(255,255,255,0.1)",
|
|
18708
|
+
strokeWidth: 0.5
|
|
18709
|
+
}
|
|
18710
|
+
),
|
|
18711
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
18712
|
+
"text",
|
|
18713
|
+
{
|
|
18714
|
+
x: textX,
|
|
18715
|
+
y: tooltipY + 11.5,
|
|
18716
|
+
textAnchor: "middle",
|
|
18717
|
+
fill: "#fff",
|
|
18718
|
+
fontSize: 9,
|
|
18719
|
+
fontWeight: 600,
|
|
18720
|
+
fontFamily: "inherit",
|
|
18721
|
+
style: { fontVariantNumeric: "tabular-nums" },
|
|
18722
|
+
children: [
|
|
18723
|
+
"$",
|
|
18724
|
+
interpolated.price.toFixed(2)
|
|
18725
|
+
]
|
|
18726
|
+
}
|
|
18727
|
+
)
|
|
18728
|
+
] });
|
|
18729
|
+
})()
|
|
18730
|
+
] })
|
|
18731
|
+
]
|
|
18732
|
+
}
|
|
18733
|
+
);
|
|
18734
|
+
});
|
|
18602
18735
|
|
|
18603
18736
|
exports.AssetSelectorBar = AssetSelectorBar;
|
|
18604
18737
|
exports.Badge = Badge;
|
|
@@ -18641,12 +18774,14 @@ exports.PropertyValuation = PropertyValuation;
|
|
|
18641
18774
|
exports.SiteFooter = SiteFooter;
|
|
18642
18775
|
exports.Skeleton = Skeleton;
|
|
18643
18776
|
exports.SlideDigit = SlideDigit;
|
|
18777
|
+
exports.SparklineChart = SparklineChart;
|
|
18644
18778
|
exports.ToastProvider = ToastProvider;
|
|
18645
18779
|
exports.TradeConfirmationModal = TradeConfirmationModal;
|
|
18646
18780
|
exports.TradingSlider = TradingSlider;
|
|
18647
18781
|
exports.YourOrders = YourOrders;
|
|
18648
18782
|
exports.badgeVariants = badgeVariants;
|
|
18649
18783
|
exports.buttonVariants = buttonVariants;
|
|
18784
|
+
exports.extractSparkline = extractSparkline;
|
|
18650
18785
|
exports.hasPendingActivity = hasPendingActivity;
|
|
18651
18786
|
exports.useAdaptivePolling = useAdaptivePolling;
|
|
18652
18787
|
exports.useToast = useToast;
|