@hanzo/ui 8.27.9 → 8.27.11

package/dist/backends/gui/news-timeline.js

@@ -0,0 +1,45 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * NewsTimeline — a TradingView news feed, in a gui frame.
+ *
+ * The headlines are TradingView's, drawn inside TradingView's own document, so
+ * the feed is an `<iframe>` and nothing here draws a pixel of it. What this
+ * owns is the frame around it and the settings the feed opens with — which
+ * mode it filters by, which market or symbol that mode reads, the theme —
+ * written into the iframe's address the way TradingView's own embed script
+ * writes them: `/embed-widget/timeline/?locale=…#<settings as JSON>`. Nothing
+ * is fetched or injected at mount, so the markup is the same on the server and
+ * in the browser, and the frame has its height before the feed arrives.
+ *
+ * `feedMode` picks what narrows the headlines: `all_symbols` takes none of
+ * `market`/`symbol`, `market` reads `market`, and `symbol` reads `symbol`.
+ *
+ * The iframe is keyed on that address. A browser treats a `src` that differs
+ * only in its fragment as a same-document navigation and does not reload, so
+ * without the key a changed prop would leave the old feed on screen.
+ */
+import { YStack, isWeb } from '@hanzo/gui';
+import { slot } from './slot.js';
+const EMBED = 'https://www.tradingview-widget.com/embed-widget/timeline/?locale=';
+/** The settings TradingView reads, with the documented defaults filled in. */
+const settings = ({ feedMode = 'all_symbols', market = 'crypto', symbol, width = '100%', height = 400, colorTheme = 'dark', isTransparent = false, }) => ({
+    displayMode: 'regular',
+    feedMode,
+    ...(feedMode === 'market' ? { market } : {}),
+    ...(feedMode === 'symbol' ? { symbol: symbol ?? '' } : {}),
+    colorTheme,
+    isTransparent,
+    width,
+    height,
+});
+const NewsTimeline = ({ feedMode, market, symbol, width, height, colorTheme, locale = 'en', isTransparent, ...props }) => {
+    const s = settings({ feedMode, market, symbol, width, height, colorTheme, isTransparent });
+    const src = `${EMBED}${locale}#${encodeURIComponent(JSON.stringify(s))}`;
+    return (_jsx(YStack, { ...slot('news-timeline'), "data-feed-mode": s.feedMode, "data-color-theme": s.colorTheme, 
+        // The documented size is TradingView's — a number or a percent string —
+        // and gui declares a narrower one; on web both reach CSS as written.
+        width: s.width, height: s.height, overflow: "hidden", position: "relative", bg: "$panel", ...props, children: isWeb && (_jsx("iframe", { src: src, title: "News timeline", loading: "lazy", scrolling: "no", style: { display: 'block', width: '100%', height: '100%', border: 0 } }, src)) }));
+};
+export { NewsTimeline };
+//# sourceMappingURL=news-timeline.js.map

package/dist/backends/gui/news-timeline.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"news-timeline.js","sourceRoot":"","sources":["../../../src/backends/gui/news-timeline.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ;;;;;;;;;;;;;;;;;;GAkBG;AACH,OAAO,EAAE,MAAM,EAAE,KAAK,EAAoB,MAAM,YAAY,CAAA;AAC5D,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA;AAqB7B,MAAM,KAAK,GAAG,mEAAmE,CAAA;AAEjF,8EAA8E;AAC9E,MAAM,QAAQ,GAAG,CAAC,EAChB,QAAQ,GAAG,aAAa,EACxB,MAAM,GAAG,QAAQ,EACjB,MAAM,EACN,KAAK,GAAG,MAAM,EACd,MAAM,GAAG,GAAG,EACZ,UAAU,GAAG,MAAM,EACnB,aAAa,GAAG,KAAK,GACH,EAAE,EAAE,CAAC,CAAC;IACxB,WAAW,EAAE,SAAS;IACtB,QAAQ;IACR,GAAG,CAAC,QAAQ,KAAK,QAAQ,CAAC,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;IAC5C,GAAG,CAAC,QAAQ,KAAK,QAAQ,CAAC,CAAC,CAAC,EAAE,MAAM,EAAE,MAAM,IAAI,EAAE,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;IAC1D,UAAU;IACV,aAAa;IACb,KAAK;IACL,MAAM;CACP,CAAC,CAAA;AAEF,MAAM,YAAY,GAAG,CAAC,EACpB,QAAQ,EACR,MAAM,EACN,MAAM,EACN,KAAK,EACL,MAAM,EACN,UAAU,EACV,MAAM,GAAG,IAAI,EACb,aAAa,EACb,GAAG,KAAK,EACU,EAAE,EAAE;IACtB,MAAM,CAAC,GAAG,QAAQ,CAAC,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,UAAU,EAAE,aAAa,EAAE,CAAC,CAAA;IAC1F,MAAM,GAAG,GAAG,GAAG,KAAK,GAAG,MAAM,IAAI,kBAAkB,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,EAAE,CAAA;IACxE,OAAO,CACL,KAAC,MAAM,OACD,IAAI,CAAC,eAAe,CAAC,oBACT,CAAC,CAAC,QAAQ,sBACR,CAAC,CAAC,UAAU;QAC9B,wEAAwE;QACxE,qEAAqE;QACrE,KAAK,EAAE,CAAC,CAAC,KAA6B,EACtC,MAAM,EAAE,CAAC,CAAC,MAA+B,EACzC,QAAQ,EAAC,QAAQ,EACjB,QAAQ,EAAC,UAAU,EACnB,EAAE,EAAC,QAAQ,KACP,KAAK,YAER,KAAK,IAAI,CACR,iBAEE,GAAG,EAAE,GAAG,EACR,KAAK,EAAC,eAAe,EACrB,OAAO,EAAC,MAAM,EACd,SAAS,EAAC,IAAI,EACd,KAAK,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,CAAC,EAAE,IALhE,GAAG,CAMR,CACH,GACM,CACV,CAAA;AACH,CAAC,CAAA;AAED,OAAO,EAAE,YAAY,EAAE,CAAA"}

package/dist/backends/gui/order-entry.cjs

@@ -0,0 +1,53 @@
+'use client';"use strict";
+'use client';
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.OrderEntry = OrderEntry;
+const jsx_runtime_1 = require("react/jsx-runtime");
+/**
+ * OrderEntry — a trading ticket: buying power, buy/sell side, market/limit
+ * type, a share count and, for a limit order, a limit price, ending in one
+ * submit button that reads the side and the ticker back to the trader.
+ *
+ * The two segmented rows (side, order type) are `Grid` with two equal tracks
+ * rather than a stack, matching the two-dimensional layout the original
+ * markup used (`grid-cols-2`) instead of approximating it with flex.
+ */
+const gui_1 = require("@hanzo/gui");
+const react_1 = require("react");
+const grid_1 = require("../../grid.cjs");
+const button_1 = require("./button.cjs");
+const input_1 = require("./input.cjs");
+const label_1 = require("./label.cjs");
+const slot_1 = require("./slot.cjs");
+const ticker = (symbol) => symbol.split(':')[1] || symbol;
+const SIDE_ON = { buy: '$green9', sell: '$red9' };
+function OrderEntry({ symbol = 'NASDAQ:AAPL', accountBalance = 10000, onPlaceOrder = () => { }, disabled = false, }) {
+    const [orderType, setOrderType] = (0, react_1.useState)('market');
+    const [orderSide, setOrderSide] = (0, react_1.useState)('buy');
+    const [shares, setShares] = (0, react_1.useState)('');
+    const [limitPrice, setLimitPrice] = (0, react_1.useState)('');
+    const canSubmit = !disabled && !!shares && (orderType !== 'limit' || !!limitPrice);
+    const submit = () => {
+        if (!canSubmit)
+            return;
+        onPlaceOrder({
+            symbol,
+            side: orderSide,
+            orderType,
+            shares: parseInt(shares, 10),
+            limitPrice: orderType === 'limit' ? parseFloat(limitPrice) : undefined,
+        });
+        setShares('');
+        setLimitPrice('');
+    };
+    return ((0, jsx_runtime_1.jsxs)(gui_1.YStack, { ...(0, slot_1.slot)('order-entry'), p: "$4", gap: "$4", children: [(0, jsx_runtime_1.jsxs)(gui_1.YStack, { ...(0, slot_1.slot)('order-entry-balance'), bg: "$hover", rounded: "$3", p: "$3", children: [(0, jsx_runtime_1.jsx)(gui_1.SizableText, { size: "$1", color: "$quiet", mb: "$1", children: "Buying Power" }), (0, jsx_runtime_1.jsxs)(gui_1.SizableText, { size: "$5", fontWeight: "600", color: "$ink", children: ["$", accountBalance.toLocaleString()] })] }), (0, jsx_runtime_1.jsx)(grid_1.Grid, { ...(0, slot_1.slot)('order-entry-side'), columns: 2, gap: "$2", children: ['buy', 'sell'].map((side) => ((0, jsx_runtime_1.jsx)(grid_1.Cell, { children: (0, jsx_runtime_1.jsx)(button_1.Button, { ...(0, slot_1.slot)('order-entry-side-option'), "data-state": orderSide === side ? 'on' : 'off', role: "radio", "aria-checked": orderSide === side, variant: "ghost", width: "100%", disabled: disabled, onPress: () => setOrderSide(side), bg: orderSide === side ? SIDE_ON[side] : '$hover', 
+                        // `color` reaches Button.Frame through gui's own text-context —
+                        // applied at runtime but never declared on the Frame's own prop
+                        // type, the same gap `toggle-group.tsx` casts around elsewhere.
+                        // @ts-expect-error color is a real, working prop the Frame's type omits
+                        color: orderSide === side ? '$white1' : '$quiet', hoverStyle: orderSide === side ? { bg: SIDE_ON[side] } : { bg: '$edge' }, fontWeight: "600", children: side === 'buy' ? 'Buy' : 'Sell' }) }, side))) }), (0, jsx_runtime_1.jsxs)(gui_1.YStack, { ...(0, slot_1.slot)('order-entry-type'), gap: "$2", children: [(0, jsx_runtime_1.jsx)(label_1.Label, { children: "Order Type" }), (0, jsx_runtime_1.jsx)(grid_1.Grid, { columns: 2, gap: "$2", children: ['market', 'limit'].map((kind) => ((0, jsx_runtime_1.jsx)(grid_1.Cell, { children: (0, jsx_runtime_1.jsx)(button_1.Button, { ...(0, slot_1.slot)('order-entry-type-option'), "data-state": orderType === kind ? 'on' : 'off', role: "radio", "aria-checked": orderType === kind, variant: "ghost", size: "sm", width: "100%", disabled: disabled, onPress: () => setOrderType(kind), bg: orderType === kind ? '$rim' : '$hover', 
+                                // @ts-expect-error color is a real, working prop the Frame's type omits
+                                color: orderType === kind ? '$ink' : '$quiet', hoverStyle: orderType === kind ? { bg: '$rim' } : { bg: '$edge' }, children: kind === 'market' ? 'Market' : 'Limit' }) }, kind))) })] }), (0, jsx_runtime_1.jsxs)(gui_1.YStack, { ...(0, slot_1.slot)('order-entry-shares'), gap: "$2", children: [(0, jsx_runtime_1.jsx)(label_1.Label, { htmlFor: "order-entry-shares-input", children: "Shares" }), (0, jsx_runtime_1.jsx)(input_1.Input, { id: "order-entry-shares-input", type: "number", placeholder: "0", value: shares, onChangeText: setShares, disabled: disabled })] }), orderType === 'limit' && ((0, jsx_runtime_1.jsxs)(gui_1.YStack, { ...(0, slot_1.slot)('order-entry-limit-price'), gap: "$2", children: [(0, jsx_runtime_1.jsx)(label_1.Label, { htmlFor: "order-entry-limit-price-input", children: "Limit Price" }), (0, jsx_runtime_1.jsx)(input_1.Input, { id: "order-entry-limit-price-input", type: "number", step: "0.01", placeholder: "0.00", value: limitPrice, onChangeText: setLimitPrice, disabled: disabled })] })), (0, jsx_runtime_1.jsxs)(button_1.Button, { ...(0, slot_1.slot)('order-entry-submit'), variant: "ghost", size: "lg", width: "100%", disabled: !canSubmit, onPress: submit, bg: SIDE_ON[orderSide], 
+                // @ts-expect-error color is a real, working prop the Frame's type omits
+                color: "$white1", fontWeight: "600", hoverStyle: { bg: SIDE_ON[orderSide], opacity: 0.9 }, children: [orderSide === 'buy' ? 'Buy' : 'Sell', " ", ticker(symbol)] })] }));
+}

package/dist/backends/gui/order-entry.d.ts

@@ -0,0 +1,21 @@
+export type OrderSide = 'buy' | 'sell';
+export type OrderKind = 'market' | 'limit';
+export interface PlacedOrder {
+    symbol: string;
+    side: OrderSide;
+    orderType: OrderKind;
+    shares: number;
+    limitPrice?: number;
+}
+export interface OrderEntryProps {
+    /** Trading symbol, e.g. `"NASDAQ:AAPL"`. The part after `:` is the ticker shown on the submit button. */
+    symbol?: string;
+    /** Buying power shown at the top of the ticket. */
+    accountBalance?: number;
+    /** Fired with the composed order when the trader submits it; the form then clears. */
+    onPlaceOrder?: (order: PlacedOrder) => void;
+    disabled?: boolean;
+}
+declare function OrderEntry({ symbol, accountBalance, onPlaceOrder, disabled, }: OrderEntryProps): import("react").JSX.Element;
+export { OrderEntry };
+//# sourceMappingURL=order-entry.d.ts.map

package/dist/backends/gui/order-entry.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"order-entry.d.ts","sourceRoot":"","sources":["../../../src/backends/gui/order-entry.tsx"],"names":[],"mappings":"AAmBA,MAAM,MAAM,SAAS,GAAG,KAAK,GAAG,MAAM,CAAA;AACtC,MAAM,MAAM,SAAS,GAAG,QAAQ,GAAG,OAAO,CAAA;AAE1C,MAAM,WAAW,WAAW;IAC1B,MAAM,EAAE,MAAM,CAAA;IACd,IAAI,EAAE,SAAS,CAAA;IACf,SAAS,EAAE,SAAS,CAAA;IACpB,MAAM,EAAE,MAAM,CAAA;IACd,UAAU,CAAC,EAAE,MAAM,CAAA;CACpB;AAED,MAAM,WAAW,eAAe;IAC9B,yGAAyG;IACzG,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,mDAAmD;IACnD,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,sFAAsF;IACtF,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,KAAK,IAAI,CAAA;IAC3C,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB;AAMD,iBAAS,UAAU,CAAC,EAClB,MAAsB,EACtB,cAAsB,EACtB,YAAuB,EACvB,QAAgB,GACjB,EAAE,eAAe,+BAkIjB;AAED,OAAO,EAAE,UAAU,EAAE,CAAA"}

package/dist/backends/gui/order-entry.js

@@ -0,0 +1,52 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * OrderEntry — a trading ticket: buying power, buy/sell side, market/limit
+ * type, a share count and, for a limit order, a limit price, ending in one
+ * submit button that reads the side and the ticker back to the trader.
+ *
+ * The two segmented rows (side, order type) are `Grid` with two equal tracks
+ * rather than a stack, matching the two-dimensional layout the original
+ * markup used (`grid-cols-2`) instead of approximating it with flex.
+ */
+import { SizableText, YStack } from '@hanzo/gui';
+import { useState } from 'react';
+import { Grid, Cell } from '../../grid.js';
+import { Button } from './button.js';
+import { Input } from './input.js';
+import { Label } from './label.js';
+import { slot } from './slot.js';
+const ticker = (symbol) => symbol.split(':')[1] || symbol;
+const SIDE_ON = { buy: '$green9', sell: '$red9' };
+function OrderEntry({ symbol = 'NASDAQ:AAPL', accountBalance = 10000, onPlaceOrder = () => { }, disabled = false, }) {
+    const [orderType, setOrderType] = useState('market');
+    const [orderSide, setOrderSide] = useState('buy');
+    const [shares, setShares] = useState('');
+    const [limitPrice, setLimitPrice] = useState('');
+    const canSubmit = !disabled && !!shares && (orderType !== 'limit' || !!limitPrice);
+    const submit = () => {
+        if (!canSubmit)
+            return;
+        onPlaceOrder({
+            symbol,
+            side: orderSide,
+            orderType,
+            shares: parseInt(shares, 10),
+            limitPrice: orderType === 'limit' ? parseFloat(limitPrice) : undefined,
+        });
+        setShares('');
+        setLimitPrice('');
+    };
+    return (_jsxs(YStack, { ...slot('order-entry'), p: "$4", gap: "$4", children: [_jsxs(YStack, { ...slot('order-entry-balance'), bg: "$hover", rounded: "$3", p: "$3", children: [_jsx(SizableText, { size: "$1", color: "$quiet", mb: "$1", children: "Buying Power" }), _jsxs(SizableText, { size: "$5", fontWeight: "600", color: "$ink", children: ["$", accountBalance.toLocaleString()] })] }), _jsx(Grid, { ...slot('order-entry-side'), columns: 2, gap: "$2", children: ['buy', 'sell'].map((side) => (_jsx(Cell, { children: _jsx(Button, { ...slot('order-entry-side-option'), "data-state": orderSide === side ? 'on' : 'off', role: "radio", "aria-checked": orderSide === side, variant: "ghost", width: "100%", disabled: disabled, onPress: () => setOrderSide(side), bg: orderSide === side ? SIDE_ON[side] : '$hover', 
+                        // `color` reaches Button.Frame through gui's own text-context —
+                        // applied at runtime but never declared on the Frame's own prop
+                        // type, the same gap `toggle-group.tsx` casts around elsewhere.
+                        // @ts-expect-error color is a real, working prop the Frame's type omits
+                        color: orderSide === side ? '$white1' : '$quiet', hoverStyle: orderSide === side ? { bg: SIDE_ON[side] } : { bg: '$edge' }, fontWeight: "600", children: side === 'buy' ? 'Buy' : 'Sell' }) }, side))) }), _jsxs(YStack, { ...slot('order-entry-type'), gap: "$2", children: [_jsx(Label, { children: "Order Type" }), _jsx(Grid, { columns: 2, gap: "$2", children: ['market', 'limit'].map((kind) => (_jsx(Cell, { children: _jsx(Button, { ...slot('order-entry-type-option'), "data-state": orderType === kind ? 'on' : 'off', role: "radio", "aria-checked": orderType === kind, variant: "ghost", size: "sm", width: "100%", disabled: disabled, onPress: () => setOrderType(kind), bg: orderType === kind ? '$rim' : '$hover', 
+                                // @ts-expect-error color is a real, working prop the Frame's type omits
+                                color: orderType === kind ? '$ink' : '$quiet', hoverStyle: orderType === kind ? { bg: '$rim' } : { bg: '$edge' }, children: kind === 'market' ? 'Market' : 'Limit' }) }, kind))) })] }), _jsxs(YStack, { ...slot('order-entry-shares'), gap: "$2", children: [_jsx(Label, { htmlFor: "order-entry-shares-input", children: "Shares" }), _jsx(Input, { id: "order-entry-shares-input", type: "number", placeholder: "0", value: shares, onChangeText: setShares, disabled: disabled })] }), orderType === 'limit' && (_jsxs(YStack, { ...slot('order-entry-limit-price'), gap: "$2", children: [_jsx(Label, { htmlFor: "order-entry-limit-price-input", children: "Limit Price" }), _jsx(Input, { id: "order-entry-limit-price-input", type: "number", step: "0.01", placeholder: "0.00", value: limitPrice, onChangeText: setLimitPrice, disabled: disabled })] })), _jsxs(Button, { ...slot('order-entry-submit'), variant: "ghost", size: "lg", width: "100%", disabled: !canSubmit, onPress: submit, bg: SIDE_ON[orderSide], 
+                // @ts-expect-error color is a real, working prop the Frame's type omits
+                color: "$white1", fontWeight: "600", hoverStyle: { bg: SIDE_ON[orderSide], opacity: 0.9 }, children: [orderSide === 'buy' ? 'Buy' : 'Sell', " ", ticker(symbol)] })] }));
+}
+export { OrderEntry };
+//# sourceMappingURL=order-entry.js.map

package/dist/backends/gui/order-entry.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"order-entry.js","sourceRoot":"","sources":["../../../src/backends/gui/order-entry.tsx"],"names":[],"mappings":"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"}

package/dist/backends/gui/orders-history.cjs

@@ -0,0 +1,102 @@
+'use client';"use strict";
+'use client';
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.OrdersHistory = OrdersHistory;
+const jsx_runtime_1 = require("react/jsx-runtime");
+/**
+ * OrdersHistory — a list of trading orders, each row showing its symbol, time,
+ * status, side, share count and price, with an optional cancel action on the
+ * still-open ones and an optional click-through to the order.
+ *
+ * `showFilters` adds a status filter row above the list (All / Open / Filled /
+ * Cancelled / Pending) that narrows which orders render; the filter is local
+ * state, since it changes what is SHOWN and not the data itself. The three
+ * stats in a row (side, shares, price) sit in `@hanzo/ui`'s own `Grid` — a real
+ * CSS grid, so the columns stay even regardless of how wide any one value is.
+ */
+const gui_1 = require("@hanzo/gui");
+const React = __importStar(require("react"));
+const badge_1 = require("./badge.cjs");
+const button_1 = require("./button.cjs");
+const grid_1 = require("../../grid.cjs");
+const ink_1 = require("./ink.cjs");
+const slot_1 = require("./slot.cjs");
+const STATUS_COLOR = {
+    open: '$blue9',
+    filled: '$green9',
+    cancelled: '$quiet',
+    pending: '$yellow9',
+};
+const SIDE_COLOR = {
+    buy: '$green9',
+    sell: '$red9',
+};
+const FILTERS = ['all', 'open', 'filled', 'cancelled', 'pending'];
+const cap = (s) => s.charAt(0).toUpperCase() + s.slice(1);
+/** The ticker half of an exchange-qualified symbol, e.g. `NASDAQ:AAPL` -> `AAPL`. */
+const ticker = (symbol) => symbol.split(':')[1] || symbol;
+const RowFrame = (0, gui_1.styled)(gui_1.YStack, {
+    name: 'OrdersHistoryRow',
+    bg: '$hover',
+    rounded: '$4',
+    p: '$3',
+    gap: '$2',
+    variants: {
+        clickable: { true: { cursor: 'pointer', hoverStyle: { bg: '$edge' } } },
+    },
+});
+function OrderRow({ order, onCancelOrder, onOrderClick, }) {
+    return ((0, jsx_runtime_1.jsxs)(RowFrame, { ...(0, slot_1.slot)('orders-history-row'), "data-status": order.status, clickable: !!onOrderClick, onPress: onOrderClick ? () => onOrderClick(order) : undefined, children: [(0, jsx_runtime_1.jsxs)(gui_1.XStack, { justify: "space-between", items: "flex-start", children: [(0, jsx_runtime_1.jsxs)(gui_1.YStack, { children: [(0, ink_1.ink)(ticker(order.symbol), gui_1.SizableText, { fontWeight: '600' }), (0, ink_1.ink)(new Date(order.timestamp).toLocaleString(), gui_1.SizableText, {
+                                size: '$1',
+                                color: '$quiet',
+                            })] }), (0, jsx_runtime_1.jsx)(badge_1.Badge, { ...(0, slot_1.slot)('orders-history-status'), variant: "outline", style: { borderColor: STATUS_COLOR[order.status], color: STATUS_COLOR[order.status] }, children: cap(order.status) })] }), (0, jsx_runtime_1.jsxs)(grid_1.Grid, { columns: 3, gap: "$2", children: [(0, jsx_runtime_1.jsx)(grid_1.Cell, { children: (0, jsx_runtime_1.jsxs)(gui_1.YStack, { gap: "$1", children: [(0, ink_1.ink)('Side', gui_1.SizableText, { size: '$1', color: '$quiet' }), (0, ink_1.ink)(order.type.toUpperCase(), gui_1.SizableText, {
+                                    size: '$1',
+                                    fontWeight: '500',
+                                    color: SIDE_COLOR[order.type],
+                                })] }) }), (0, jsx_runtime_1.jsx)(grid_1.Cell, { children: (0, jsx_runtime_1.jsxs)(gui_1.YStack, { gap: "$1", children: [(0, ink_1.ink)('Shares', gui_1.SizableText, { size: '$1', color: '$quiet' }), (0, ink_1.ink)(String(order.shares), gui_1.SizableText, { size: '$1', fontWeight: '500' })] }) }), (0, jsx_runtime_1.jsx)(grid_1.Cell, { children: (0, jsx_runtime_1.jsxs)(gui_1.YStack, { gap: "$1", children: [(0, ink_1.ink)('Price', gui_1.SizableText, { size: '$1', color: '$quiet' }), (0, ink_1.ink)(order.price > 0 ? `$${order.price.toFixed(2)}` : 'Market', gui_1.SizableText, {
+                                    size: '$1',
+                                    fontWeight: '500',
+                                })] }) })] }), order.orderType ? ((0, jsx_runtime_1.jsxs)(gui_1.XStack, { gap: "$1", children: [(0, ink_1.ink)('Type:', gui_1.SizableText, { size: '$1', color: '$quiet' }), (0, ink_1.ink)(cap(order.orderType), gui_1.SizableText, { size: '$1', fontWeight: '500' })] })) : null, order.status === 'open' && onCancelOrder ? ((0, jsx_runtime_1.jsx)(button_1.Button, { ...(0, slot_1.slot)('orders-history-cancel'), variant: "outline", size: "sm", onPress: (e) => {
+                    e.stopPropagation();
+                    onCancelOrder(order.id);
+                }, children: "Cancel Order" })) : null] }));
+}
+function OrdersHistory({ orders = [], onCancelOrder, onOrderClick, showFilters = true, }) {
+    const [filter, setFilter] = React.useState('all');
+    const shown = filter === 'all' ? orders : orders.filter((order) => order.status === filter);
+    return ((0, jsx_runtime_1.jsxs)(gui_1.YStack, { ...(0, slot_1.slot)('orders-history'), gap: "$3", p: "$4", children: [showFilters ? ((0, jsx_runtime_1.jsx)(gui_1.XStack, { ...(0, slot_1.slot)('orders-history-filters'), gap: "$2", flexWrap: "wrap", children: FILTERS.map((f) => ((0, jsx_runtime_1.jsx)(badge_1.Badge, { ...(0, slot_1.slot)('orders-history-filter'), "data-active": filter === f, variant: filter === f ? 'default' : 'outline', onClick: () => setFilter(f), style: { cursor: 'pointer' }, children: cap(f) }, f))) })) : null, shown.length === 0 ? ((0, jsx_runtime_1.jsx)(gui_1.YStack, { ...(0, slot_1.slot)('orders-history-empty'), items: "center", py: "$8", children: (0, ink_1.ink)('No orders yet', gui_1.SizableText, { size: '$2', color: '$quiet' }) })) : ((0, jsx_runtime_1.jsx)(gui_1.YStack, { gap: "$2", children: shown.map((order) => ((0, jsx_runtime_1.jsx)(OrderRow, { order: order, onCancelOrder: onCancelOrder, onOrderClick: onOrderClick }, order.id))) }))] }));
+}
+exports.default = OrdersHistory;

package/dist/backends/gui/orders-history.d.ts

@@ -0,0 +1,24 @@
+import * as React from 'react';
+export type OrdersHistorySide = 'buy' | 'sell';
+export type OrdersHistoryStatus = 'open' | 'filled' | 'cancelled' | 'pending';
+export type OrdersHistoryOrderType = 'market' | 'limit';
+export interface Order {
+    id: string;
+    symbol: string;
+    type: OrdersHistorySide;
+    shares: number;
+    price: number;
+    status: OrdersHistoryStatus;
+    timestamp: number;
+    orderType?: OrdersHistoryOrderType;
+}
+export interface OrdersHistoryProps {
+    orders: Order[];
+    onCancelOrder?: (orderId: string) => void;
+    onOrderClick?: (order: Order) => void;
+    /** Shows the status filter row above the list. Defaults to true. */
+    showFilters?: boolean;
+}
+export declare function OrdersHistory({ orders, onCancelOrder, onOrderClick, showFilters, }: OrdersHistoryProps): React.JSX.Element;
+export default OrdersHistory;
+//# sourceMappingURL=orders-history.d.ts.map

package/dist/backends/gui/orders-history.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"orders-history.d.ts","sourceRoot":"","sources":["../../../src/backends/gui/orders-history.tsx"],"names":[],"mappings":"AAcA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAO9B,MAAM,MAAM,iBAAiB,GAAG,KAAK,GAAG,MAAM,CAAA;AAC9C,MAAM,MAAM,mBAAmB,GAAG,MAAM,GAAG,QAAQ,GAAG,WAAW,GAAG,SAAS,CAAA;AAC7E,MAAM,MAAM,sBAAsB,GAAG,QAAQ,GAAG,OAAO,CAAA;AAEvD,MAAM,WAAW,KAAK;IACpB,EAAE,EAAE,MAAM,CAAA;IACV,MAAM,EAAE,MAAM,CAAA;IACd,IAAI,EAAE,iBAAiB,CAAA;IACvB,MAAM,EAAE,MAAM,CAAA;IACd,KAAK,EAAE,MAAM,CAAA;IACb,MAAM,EAAE,mBAAmB,CAAA;IAC3B,SAAS,EAAE,MAAM,CAAA;IACjB,SAAS,CAAC,EAAE,sBAAsB,CAAA;CACnC;AAED,MAAM,WAAW,kBAAkB;IACjC,MAAM,EAAE,KAAK,EAAE,CAAA;IACf,aAAa,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAA;IACzC,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAA;IACrC,oEAAoE;IACpE,WAAW,CAAC,EAAE,OAAO,CAAA;CACtB;AAuHD,wBAAgB,aAAa,CAAC,EAC5B,MAAW,EACX,aAAa,EACb,YAAY,EACZ,WAAkB,GACnB,EAAE,kBAAkB,qBAyCpB;eAEc,aAAa"}

package/dist/backends/gui/orders-history.js

@@ -0,0 +1,67 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * OrdersHistory — a list of trading orders, each row showing its symbol, time,
+ * status, side, share count and price, with an optional cancel action on the
+ * still-open ones and an optional click-through to the order.
+ *
+ * `showFilters` adds a status filter row above the list (All / Open / Filled /
+ * Cancelled / Pending) that narrows which orders render; the filter is local
+ * state, since it changes what is SHOWN and not the data itself. The three
+ * stats in a row (side, shares, price) sit in `@hanzo/ui`'s own `Grid` — a real
+ * CSS grid, so the columns stay even regardless of how wide any one value is.
+ */
+import { SizableText, XStack, YStack, styled } from '@hanzo/gui';
+import * as React from 'react';
+import { Badge } from './badge.js';
+import { Button } from './button.js';
+import { Cell, Grid } from '../../grid.js';
+import { ink } from './ink.js';
+import { slot } from './slot.js';
+const STATUS_COLOR = {
+    open: '$blue9',
+    filled: '$green9',
+    cancelled: '$quiet',
+    pending: '$yellow9',
+};
+const SIDE_COLOR = {
+    buy: '$green9',
+    sell: '$red9',
+};
+const FILTERS = ['all', 'open', 'filled', 'cancelled', 'pending'];
+const cap = (s) => s.charAt(0).toUpperCase() + s.slice(1);
+/** The ticker half of an exchange-qualified symbol, e.g. `NASDAQ:AAPL` -> `AAPL`. */
+const ticker = (symbol) => symbol.split(':')[1] || symbol;
+const RowFrame = styled(YStack, {
+    name: 'OrdersHistoryRow',
+    bg: '$hover',
+    rounded: '$4',
+    p: '$3',
+    gap: '$2',
+    variants: {
+        clickable: { true: { cursor: 'pointer', hoverStyle: { bg: '$edge' } } },
+    },
+});
+function OrderRow({ order, onCancelOrder, onOrderClick, }) {
+    return (_jsxs(RowFrame, { ...slot('orders-history-row'), "data-status": order.status, clickable: !!onOrderClick, onPress: onOrderClick ? () => onOrderClick(order) : undefined, children: [_jsxs(XStack, { justify: "space-between", items: "flex-start", children: [_jsxs(YStack, { children: [ink(ticker(order.symbol), SizableText, { fontWeight: '600' }), ink(new Date(order.timestamp).toLocaleString(), SizableText, {
+                                size: '$1',
+                                color: '$quiet',
+                            })] }), _jsx(Badge, { ...slot('orders-history-status'), variant: "outline", style: { borderColor: STATUS_COLOR[order.status], color: STATUS_COLOR[order.status] }, children: cap(order.status) })] }), _jsxs(Grid, { columns: 3, gap: "$2", children: [_jsx(Cell, { children: _jsxs(YStack, { gap: "$1", children: [ink('Side', SizableText, { size: '$1', color: '$quiet' }), ink(order.type.toUpperCase(), SizableText, {
+                                    size: '$1',
+                                    fontWeight: '500',
+                                    color: SIDE_COLOR[order.type],
+                                })] }) }), _jsx(Cell, { children: _jsxs(YStack, { gap: "$1", children: [ink('Shares', SizableText, { size: '$1', color: '$quiet' }), ink(String(order.shares), SizableText, { size: '$1', fontWeight: '500' })] }) }), _jsx(Cell, { children: _jsxs(YStack, { gap: "$1", children: [ink('Price', SizableText, { size: '$1', color: '$quiet' }), ink(order.price > 0 ? `$${order.price.toFixed(2)}` : 'Market', SizableText, {
+                                    size: '$1',
+                                    fontWeight: '500',
+                                })] }) })] }), order.orderType ? (_jsxs(XStack, { gap: "$1", children: [ink('Type:', SizableText, { size: '$1', color: '$quiet' }), ink(cap(order.orderType), SizableText, { size: '$1', fontWeight: '500' })] })) : null, order.status === 'open' && onCancelOrder ? (_jsx(Button, { ...slot('orders-history-cancel'), variant: "outline", size: "sm", onPress: (e) => {
+                    e.stopPropagation();
+                    onCancelOrder(order.id);
+                }, children: "Cancel Order" })) : null] }));
+}
+export function OrdersHistory({ orders = [], onCancelOrder, onOrderClick, showFilters = true, }) {
+    const [filter, setFilter] = React.useState('all');
+    const shown = filter === 'all' ? orders : orders.filter((order) => order.status === filter);
+    return (_jsxs(YStack, { ...slot('orders-history'), gap: "$3", p: "$4", children: [showFilters ? (_jsx(XStack, { ...slot('orders-history-filters'), gap: "$2", flexWrap: "wrap", children: FILTERS.map((f) => (_jsx(Badge, { ...slot('orders-history-filter'), "data-active": filter === f, variant: filter === f ? 'default' : 'outline', onClick: () => setFilter(f), style: { cursor: 'pointer' }, children: cap(f) }, f))) })) : null, shown.length === 0 ? (_jsx(YStack, { ...slot('orders-history-empty'), items: "center", py: "$8", children: ink('No orders yet', SizableText, { size: '$2', color: '$quiet' }) })) : (_jsx(YStack, { gap: "$2", children: shown.map((order) => (_jsx(OrderRow, { order: order, onCancelOrder: onCancelOrder, onOrderClick: onOrderClick }, order.id))) }))] }));
+}
+export default OrdersHistory;
+//# sourceMappingURL=orders-history.js.map

package/dist/backends/gui/orders-history.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"orders-history.js","sourceRoot":"","sources":["../../../src/backends/gui/orders-history.tsx"],"names":[],"mappings":"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"}

package/dist/backends/gui/pagination.cjs

@@ -0,0 +1,51 @@
+'use client';"use strict";
+'use client';
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PaginationEllipsis = exports.PaginationNext = exports.PaginationPrevious = exports.PaginationLink = exports.PaginationItem = exports.PaginationContent = exports.Pagination = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const gui_1 = require("@hanzo/gui");
+const lucide_icons_2_1 = require("@hanzogui/lucide-icons-2");
+const button_1 = require("./button.cjs");
+const slot_1 = require("./slot.cjs");
+const ICON = 16;
+const Nav = (0, gui_1.styled)(gui_1.XStack, {
+    name: 'Pagination',
+    render: 'nav',
+    width: '100%',
+    justify: 'center',
+});
+const Pagination = (props) => ((0, jsx_runtime_1.jsx)(Nav, { ...(0, slot_1.slot)('pagination'), role: "navigation", "aria-label": "pagination", ...props }));
+exports.Pagination = Pagination;
+const List = (0, gui_1.styled)(gui_1.XStack, {
+    name: 'PaginationContent',
+    render: 'ul',
+    flexDirection: 'row',
+    items: 'center',
+    gap: '$1',
+});
+const PaginationContent = (props) => ((0, jsx_runtime_1.jsx)(List, { ...(0, slot_1.slot)('pagination-content'), ...props }));
+exports.PaginationContent = PaginationContent;
+const Item = (0, gui_1.styled)(gui_1.XStack, {
+    name: 'PaginationItem',
+    render: 'li',
+});
+const PaginationItem = (props) => ((0, jsx_runtime_1.jsx)(Item, { ...(0, slot_1.slot)('pagination-item'), ...props }));
+exports.PaginationItem = PaginationItem;
+/** One page number, or any other stop in the trail. Renders as an anchor. */
+const PaginationLink = ({ isActive, size = 'icon', href, children, ...props }) => ((0, jsx_runtime_1.jsx)(button_1.Button, { asChild: true, ...(0, slot_1.slot)('pagination-link'), "data-active": isActive || undefined, "aria-current": isActive ? 'page' : undefined, variant: isActive ? 'outline' : 'ghost', size: size, ...props, children: (0, jsx_runtime_1.jsx)("a", { href: href, children: children }) }));
+exports.PaginationLink = PaginationLink;
+const PaginationPrevious = (props) => ((0, jsx_runtime_1.jsxs)(exports.PaginationLink, { "aria-label": "Go to previous page", size: "default", gap: "$1", pl: "$2.5", ...props, children: [(0, jsx_runtime_1.jsx)(lucide_icons_2_1.ChevronLeft, { size: ICON }), "Previous"] }));
+exports.PaginationPrevious = PaginationPrevious;
+const PaginationNext = (props) => ((0, jsx_runtime_1.jsxs)(exports.PaginationLink, { "aria-label": "Go to next page", size: "default", gap: "$1", pr: "$2.5", ...props, children: ["Next", (0, jsx_runtime_1.jsx)(lucide_icons_2_1.ChevronRight, { size: ICON })] }));
+exports.PaginationNext = PaginationNext;
+const Ellipsis = (0, gui_1.styled)(gui_1.XStack, {
+    name: 'PaginationEllipsis',
+    render: 'span',
+    height: 36,
+    width: 36,
+    items: 'center',
+    justify: 'center',
+});
+/** A gap too long to enumerate. Decorative — the count still comes from the list. */
+const PaginationEllipsis = (props) => ((0, jsx_runtime_1.jsxs)(Ellipsis, { ...(0, slot_1.slot)('pagination-ellipsis'), "aria-hidden": true, ...props, children: [(0, jsx_runtime_1.jsx)(lucide_icons_2_1.MoreHorizontal, { size: ICON }), (0, jsx_runtime_1.jsx)(gui_1.VisuallyHidden, { children: "More pages" })] }));
+exports.PaginationEllipsis = PaginationEllipsis;

package/dist/backends/gui/pagination.d.ts

@@ -0,0 +1,52 @@
+/**
+ * Pagination — a trail of page links, framed as a navigation landmark.
+ *
+ * `Pagination` is a `<nav aria-label="pagination">` around `PaginationContent`,
+ * a real `<ul>` so a screen reader counts the pages the way it counts a list.
+ * `PaginationLink` wears the same `Button` frame every other control on the
+ * page wears — ghost for a page you can go to, outline for the one you are
+ * on — so the current page reads as pressed rather than as a colour choice.
+ * `PaginationPrevious`/`PaginationNext` are that link with an icon and a
+ * label; `PaginationEllipsis` is a decorative gap, `aria-hidden`, with its own
+ * "More pages" line for whoever is not looking at it.
+ */
+import * as React from 'react';
+import { Button, type ButtonSize } from './button.js';
+declare const Nav: import("@hanzogui/web").GuiComponent<import("@hanzogui/web").TamaDefer, import("@hanzogui/web").GuiElement, import("@hanzogui/core").RNGuiViewNonStyleProps, import("@hanzogui/web").StackStyleBase, {
+    elevation?: number | import("@hanzogui/web").SizeTokens | undefined;
+    fullscreen?: boolean | undefined;
+}, import("@hanzogui/web").StaticConfigPublic>;
+export type PaginationProps = React.ComponentProps<typeof Nav>;
+export declare const Pagination: (props: PaginationProps) => React.JSX.Element;
+declare const List: import("@hanzogui/web").GuiComponent<import("@hanzogui/web").TamaDefer, import("@hanzogui/web").GuiElement, import("@hanzogui/core").RNGuiViewNonStyleProps, import("@hanzogui/web").StackStyleBase, {
+    elevation?: number | import("@hanzogui/web").SizeTokens | undefined;
+    fullscreen?: boolean | undefined;
+}, import("@hanzogui/web").StaticConfigPublic>;
+export type PaginationContentProps = React.ComponentProps<typeof List>;
+export declare const PaginationContent: (props: PaginationContentProps) => React.JSX.Element;
+declare const Item: import("@hanzogui/web").GuiComponent<import("@hanzogui/web").TamaDefer, import("@hanzogui/web").GuiElement, import("@hanzogui/core").RNGuiViewNonStyleProps, import("@hanzogui/web").StackStyleBase, {
+    elevation?: number | import("@hanzogui/web").SizeTokens | undefined;
+    fullscreen?: boolean | undefined;
+}, import("@hanzogui/web").StaticConfigPublic>;
+export type PaginationItemProps = React.ComponentProps<typeof Item>;
+export declare const PaginationItem: (props: PaginationItemProps) => React.JSX.Element;
+export type PaginationLinkProps = {
+    isActive?: boolean;
+    size?: ButtonSize;
+    href?: string;
+} & Omit<React.ComponentProps<typeof Button>, 'variant' | 'size' | 'asChild'>;
+/** One page number, or any other stop in the trail. Renders as an anchor. */
+export declare const PaginationLink: ({ isActive, size, href, children, ...props }: PaginationLinkProps) => React.JSX.Element;
+export type PaginationPreviousProps = Omit<PaginationLinkProps, 'size' | 'children'>;
+export declare const PaginationPrevious: (props: PaginationPreviousProps) => React.JSX.Element;
+export type PaginationNextProps = Omit<PaginationLinkProps, 'size' | 'children'>;
+export declare const PaginationNext: (props: PaginationNextProps) => React.JSX.Element;
+declare const Ellipsis: import("@hanzogui/web").GuiComponent<import("@hanzogui/web").TamaDefer, import("@hanzogui/web").GuiElement, import("@hanzogui/core").RNGuiViewNonStyleProps, import("@hanzogui/web").StackStyleBase, {
+    elevation?: number | import("@hanzogui/web").SizeTokens | undefined;
+    fullscreen?: boolean | undefined;
+}, import("@hanzogui/web").StaticConfigPublic>;
+export type PaginationEllipsisProps = React.ComponentProps<typeof Ellipsis>;
+/** A gap too long to enumerate. Decorative — the count still comes from the list. */
+export declare const PaginationEllipsis: (props: PaginationEllipsisProps) => React.JSX.Element;
+export {};
+//# sourceMappingURL=pagination.d.ts.map

package/dist/backends/gui/pagination.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"pagination.d.ts","sourceRoot":"","sources":["../../../src/backends/gui/pagination.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;GAWG;AACH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAI9B,OAAO,EAAE,MAAM,EAAE,KAAK,UAAU,EAAE,MAAM,UAAU,CAAA;AAKlD,QAAA,MAAM,GAAG;;;8CAKP,CAAA;AAEF,MAAM,MAAM,eAAe,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,GAAG,CAAC,CAAA;AAE9D,eAAO,MAAM,UAAU,UAAW,eAAe,sBAEhD,CAAA;AAED,QAAA,MAAM,IAAI;;;8CAMR,CAAA;AAEF,MAAM,MAAM,sBAAsB,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,IAAI,CAAC,CAAA;AAEtE,eAAO,MAAM,iBAAiB,UAAW,sBAAsB,sBAE9D,CAAA;AAED,QAAA,MAAM,IAAI;;;8CAGR,CAAA;AAEF,MAAM,MAAM,mBAAmB,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,IAAI,CAAC,CAAA;AAEnE,eAAO,MAAM,cAAc,UAAW,mBAAmB,sBAExD,CAAA;AAED,MAAM,MAAM,mBAAmB,GAAG;IAChC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,IAAI,CAAC,EAAE,UAAU,CAAA;IACjB,IAAI,CAAC,EAAE,MAAM,CAAA;CACd,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,MAAM,CAAC,EAAE,SAAS,GAAG,MAAM,GAAG,SAAS,CAAC,CAAA;AAE7E,6EAA6E;AAC7E,eAAO,MAAM,cAAc,iDAMxB,mBAAmB,sBAYrB,CAAA;AAED,MAAM,MAAM,uBAAuB,GAAG,IAAI,CAAC,mBAAmB,EAAE,MAAM,GAAG,UAAU,CAAC,CAAA;AAEpF,eAAO,MAAM,kBAAkB,UAAW,uBAAuB,sBAKhE,CAAA;AAED,MAAM,MAAM,mBAAmB,GAAG,IAAI,CAAC,mBAAmB,EAAE,MAAM,GAAG,UAAU,CAAC,CAAA;AAEhF,eAAO,MAAM,cAAc,UAAW,mBAAmB,sBAKxD,CAAA;AAED,QAAA,MAAM,QAAQ;;;8CAOZ,CAAA;AAEF,MAAM,MAAM,uBAAuB,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,QAAQ,CAAC,CAAA;AAE3E,qFAAqF;AACrF,eAAO,MAAM,kBAAkB,UAAW,uBAAuB,sBAKhE,CAAA"}

package/dist/backends/gui/pagination.js

@@ -0,0 +1,42 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { VisuallyHidden, XStack, styled } from '@hanzo/gui';
+import { ChevronLeft, ChevronRight, MoreHorizontal } from '@hanzogui/lucide-icons-2';
+import { Button } from './button.js';
+import { slot } from './slot.js';
+const ICON = 16;
+const Nav = styled(XStack, {
+    name: 'Pagination',
+    render: 'nav',
+    width: '100%',
+    justify: 'center',
+});
+export const Pagination = (props) => (_jsx(Nav, { ...slot('pagination'), role: "navigation", "aria-label": "pagination", ...props }));
+const List = styled(XStack, {
+    name: 'PaginationContent',
+    render: 'ul',
+    flexDirection: 'row',
+    items: 'center',
+    gap: '$1',
+});
+export const PaginationContent = (props) => (_jsx(List, { ...slot('pagination-content'), ...props }));
+const Item = styled(XStack, {
+    name: 'PaginationItem',
+    render: 'li',
+});
+export const PaginationItem = (props) => (_jsx(Item, { ...slot('pagination-item'), ...props }));
+/** One page number, or any other stop in the trail. Renders as an anchor. */
+export const PaginationLink = ({ isActive, size = 'icon', href, children, ...props }) => (_jsx(Button, { asChild: true, ...slot('pagination-link'), "data-active": isActive || undefined, "aria-current": isActive ? 'page' : undefined, variant: isActive ? 'outline' : 'ghost', size: size, ...props, children: _jsx("a", { href: href, children: children }) }));
+export const PaginationPrevious = (props) => (_jsxs(PaginationLink, { "aria-label": "Go to previous page", size: "default", gap: "$1", pl: "$2.5", ...props, children: [_jsx(ChevronLeft, { size: ICON }), "Previous"] }));
+export const PaginationNext = (props) => (_jsxs(PaginationLink, { "aria-label": "Go to next page", size: "default", gap: "$1", pr: "$2.5", ...props, children: ["Next", _jsx(ChevronRight, { size: ICON })] }));
+const Ellipsis = styled(XStack, {
+    name: 'PaginationEllipsis',
+    render: 'span',
+    height: 36,
+    width: 36,
+    items: 'center',
+    justify: 'center',
+});
+/** A gap too long to enumerate. Decorative — the count still comes from the list. */
+export const PaginationEllipsis = (props) => (_jsxs(Ellipsis, { ...slot('pagination-ellipsis'), "aria-hidden": true, ...props, children: [_jsx(MoreHorizontal, { size: ICON }), _jsx(VisuallyHidden, { children: "More pages" })] }));
+//# sourceMappingURL=pagination.js.map

package/dist/backends/gui/pagination.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"pagination.js","sourceRoot":"","sources":["../../../src/backends/gui/pagination.tsx"],"names":[],"mappings":"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"}