@hanzo/ui 8.27.9 → 8.27.11

package/dist/backends/gui/stock-market.d.ts

@@ -0,0 +1,17 @@
+/**
+ * StockMarket — the indices-flavored opening of the TradingView market-overview
+ * table that `./crypto-market` already renders.
+ *
+ * `market-overview.tsx`, `crypto-market.tsx`, `forex-market.tsx` and
+ * `stock-market.tsx` are four doc pages for ONE upstream widget, told apart
+ * only by which tab it opens on — crypto, forex, indices. Duplicating the
+ * iframe address, the preset table and the settings object under a second
+ * name would give the table two places to drift out of sync with itself, so
+ * this file holds none of that: it is `MarketOverview` with its `tabs` default
+ * turned from `['crypto']` to `['indices']`, nothing else.
+ */
+import { type MarketOverviewProps } from './crypto-market.js';
+export type { MarketOverviewPreset as StockMarketPreset, MarketOverviewSymbol as StockMarketSymbol, MarketOverviewTab as StockMarketTab, MarketOverviewTheme as StockMarketTheme, } from './crypto-market.js';
+export type StockMarketProps = MarketOverviewProps;
+export declare function StockMarket({ tabs, ...props }: StockMarketProps): import("react").JSX.Element;
+//# sourceMappingURL=stock-market.d.ts.map

package/dist/backends/gui/stock-market.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"stock-market.d.ts","sourceRoot":"","sources":["../../../src/backends/gui/stock-market.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;GAWG;AACH,OAAO,EAAkB,KAAK,mBAAmB,EAAE,MAAM,iBAAiB,CAAA;AAE1E,YAAY,EACV,oBAAoB,IAAI,iBAAiB,EACzC,oBAAoB,IAAI,iBAAiB,EACzC,iBAAiB,IAAI,cAAc,EACnC,mBAAmB,IAAI,gBAAgB,GACxC,MAAM,iBAAiB,CAAA;AAExB,MAAM,MAAM,gBAAgB,GAAG,mBAAmB,CAAA;AAElD,wBAAgB,WAAW,CAAC,EAAE,IAAkB,EAAE,GAAG,KAAK,EAAE,EAAE,gBAAgB,+BAE7E"}

package/dist/backends/gui/stock-market.js

@@ -0,0 +1,19 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * StockMarket — the indices-flavored opening of the TradingView market-overview
+ * table that `./crypto-market` already renders.
+ *
+ * `market-overview.tsx`, `crypto-market.tsx`, `forex-market.tsx` and
+ * `stock-market.tsx` are four doc pages for ONE upstream widget, told apart
+ * only by which tab it opens on — crypto, forex, indices. Duplicating the
+ * iframe address, the preset table and the settings object under a second
+ * name would give the table two places to drift out of sync with itself, so
+ * this file holds none of that: it is `MarketOverview` with its `tabs` default
+ * turned from `['crypto']` to `['indices']`, nothing else.
+ */
+import { MarketOverview } from './crypto-market.js';
+export function StockMarket({ tabs = ['indices'], ...props }) {
+    return _jsx(MarketOverview, { tabs: tabs, ...props });
+}
+//# sourceMappingURL=stock-market.js.map

package/dist/backends/gui/stock-market.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"stock-market.js","sourceRoot":"","sources":["../../../src/backends/gui/stock-market.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ;;;;;;;;;;;GAWG;AACH,OAAO,EAAE,cAAc,EAA4B,MAAM,iBAAiB,CAAA;AAW1E,MAAM,UAAU,WAAW,CAAC,EAAE,IAAI,GAAG,CAAC,SAAS,CAAC,EAAE,GAAG,KAAK,EAAoB;IAC5E,OAAO,KAAC,cAAc,IAAC,IAAI,EAAE,IAAI,KAAM,KAAK,GAAI,CAAA;AAClD,CAAC"}

package/dist/backends/gui/stock-screener.cjs

@@ -0,0 +1,55 @@
+'use client';"use strict";
+'use client';
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.StockScreener = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+/**
+ * StockScreener — a TradingView equity screener table, in a gui frame.
+ *
+ * The rows are TradingView's, drawn inside TradingView's own document, so the
+ * table is an `<iframe>` and nothing here draws a pixel of it. What this owns
+ * is the frame around it and the settings the table opens with — which market
+ * it screens, which column set and preset screen it opens on, the theme —
+ * written into the iframe's address the way TradingView's own embed script
+ * writes them: `/embed-widget/screener/?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 table arrives.
+ *
+ * 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 `market` would leave the old table on screen.
+ */
+const gui_1 = require("@hanzo/gui");
+const slot_1 = require("./slot.cjs");
+const EMBED = 'https://www.tradingview-widget.com/embed-widget/screener/?locale=';
+/** The settings TradingView reads, with the documented defaults filled in. */
+const settings = ({ market = 'america', defaultColumn = 'overview', defaultScreen = 'general', showToolbar = true, colorTheme = 'dark', isTransparent = false, locale = 'en', width = '100%', height = 500, }) => ({
+    defaultColumn,
+    defaultScreen,
+    screener_type: market,
+    showToolbar,
+    colorTheme,
+    isTransparent,
+    locale,
+    width,
+    height,
+});
+const StockScreener = ({ market, defaultColumn, defaultScreen, showToolbar, colorTheme, isTransparent, locale, width, height, ...props }) => {
+    const s = settings({
+        market,
+        defaultColumn,
+        defaultScreen,
+        showToolbar,
+        colorTheme,
+        isTransparent,
+        locale,
+        width,
+        height,
+    });
+    const src = `${EMBED}${s.locale}#${encodeURIComponent(JSON.stringify(s))}`;
+    return ((0, jsx_runtime_1.jsx)(gui_1.YStack, { ...(0, slot_1.slot)('stock-screener'), "data-market": market ?? 'america', "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: gui_1.isWeb && ((0, jsx_runtime_1.jsx)("iframe", { src: src, title: `${market ?? 'america'} screener`, loading: "lazy", scrolling: "no", style: { display: 'block', width: '100%', height: '100%', border: 0 } }, src)) }));
+};
+exports.StockScreener = StockScreener;

package/dist/backends/gui/stock-screener.d.ts

@@ -0,0 +1,41 @@
+/**
+ * StockScreener — a TradingView equity screener table, in a gui frame.
+ *
+ * The rows are TradingView's, drawn inside TradingView's own document, so the
+ * table is an `<iframe>` and nothing here draws a pixel of it. What this owns
+ * is the frame around it and the settings the table opens with — which market
+ * it screens, which column set and preset screen it opens on, the theme —
+ * written into the iframe's address the way TradingView's own embed script
+ * writes them: `/embed-widget/screener/?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 table arrives.
+ *
+ * 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 `market` would leave the old table on screen.
+ */
+import { type YStackProps } from '@hanzo/gui';
+/** The market the table screens — TradingView's own `screener_type` values (`america`, `india`, `germany`, …). */
+export type StockScreenerMarket = 'america' | (string & {});
+export type StockScreenerColumn = 'overview' | 'performance' | 'oscillators' | 'moving_averages';
+export type StockScreenerScreen = 'general' | 'top_gainers' | 'top_losers' | 'most_volatile' | (string & {});
+export type StockScreenerTheme = 'light' | 'dark';
+export interface StockScreenerProps extends Omit<YStackProps, 'width' | 'height' | 'theme'> {
+    /** Which market the table screens. */
+    market?: StockScreenerMarket;
+    /** Which column set the table opens on. */
+    defaultColumn?: StockScreenerColumn;
+    /** Which preset screen the table opens filtered to. */
+    defaultScreen?: StockScreenerScreen;
+    /** Whether the toolbar (screen picker, column picker) is shown. */
+    showToolbar?: boolean;
+    /** The table's own palette; independent of the surrounding gui theme. */
+    colorTheme?: StockScreenerTheme;
+    isTransparent?: boolean;
+    locale?: string;
+    width?: string | number;
+    height?: string | number;
+}
+declare const StockScreener: ({ market, defaultColumn, defaultScreen, showToolbar, colorTheme, isTransparent, locale, width, height, ...props }: StockScreenerProps) => import("react").JSX.Element;
+export { StockScreener };
+//# sourceMappingURL=stock-screener.d.ts.map

package/dist/backends/gui/stock-screener.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"stock-screener.d.ts","sourceRoot":"","sources":["../../../src/backends/gui/stock-screener.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;GAeG;AACH,OAAO,EAAiB,KAAK,WAAW,EAAE,MAAM,YAAY,CAAA;AAG5D,kHAAkH;AAClH,MAAM,MAAM,mBAAmB,GAAG,SAAS,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAAA;AAE3D,MAAM,MAAM,mBAAmB,GAC3B,UAAU,GACV,aAAa,GACb,aAAa,GACb,iBAAiB,CAAA;AAErB,MAAM,MAAM,mBAAmB,GAC3B,SAAS,GACT,aAAa,GACb,YAAY,GACZ,eAAe,GACf,CAAC,MAAM,GAAG,EAAE,CAAC,CAAA;AAEjB,MAAM,MAAM,kBAAkB,GAAG,OAAO,GAAG,MAAM,CAAA;AAEjD,MAAM,WAAW,kBAAmB,SAAQ,IAAI,CAAC,WAAW,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;IACzF,sCAAsC;IACtC,MAAM,CAAC,EAAE,mBAAmB,CAAA;IAC5B,2CAA2C;IAC3C,aAAa,CAAC,EAAE,mBAAmB,CAAA;IACnC,uDAAuD;IACvD,aAAa,CAAC,EAAE,mBAAmB,CAAA;IACnC,mEAAmE;IACnE,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,yEAAyE;IACzE,UAAU,CAAC,EAAE,kBAAkB,CAAA;IAC/B,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACvB,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;CACzB;AA2BD,QAAA,MAAM,aAAa,sHAWhB,kBAAkB,gCAuCpB,CAAA;AAED,OAAO,EAAE,aAAa,EAAE,CAAA"}

package/dist/backends/gui/stock-screener.js

@@ -0,0 +1,53 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * StockScreener — a TradingView equity screener table, in a gui frame.
+ *
+ * The rows are TradingView's, drawn inside TradingView's own document, so the
+ * table is an `<iframe>` and nothing here draws a pixel of it. What this owns
+ * is the frame around it and the settings the table opens with — which market
+ * it screens, which column set and preset screen it opens on, the theme —
+ * written into the iframe's address the way TradingView's own embed script
+ * writes them: `/embed-widget/screener/?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 table arrives.
+ *
+ * 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 `market` would leave the old table on screen.
+ */
+import { YStack, isWeb } from '@hanzo/gui';
+import { slot } from './slot.js';
+const EMBED = 'https://www.tradingview-widget.com/embed-widget/screener/?locale=';
+/** The settings TradingView reads, with the documented defaults filled in. */
+const settings = ({ market = 'america', defaultColumn = 'overview', defaultScreen = 'general', showToolbar = true, colorTheme = 'dark', isTransparent = false, locale = 'en', width = '100%', height = 500, }) => ({
+    defaultColumn,
+    defaultScreen,
+    screener_type: market,
+    showToolbar,
+    colorTheme,
+    isTransparent,
+    locale,
+    width,
+    height,
+});
+const StockScreener = ({ market, defaultColumn, defaultScreen, showToolbar, colorTheme, isTransparent, locale, width, height, ...props }) => {
+    const s = settings({
+        market,
+        defaultColumn,
+        defaultScreen,
+        showToolbar,
+        colorTheme,
+        isTransparent,
+        locale,
+        width,
+        height,
+    });
+    const src = `${EMBED}${s.locale}#${encodeURIComponent(JSON.stringify(s))}`;
+    return (_jsx(YStack, { ...slot('stock-screener'), "data-market": market ?? 'america', "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: `${market ?? 'america'} screener`, loading: "lazy", scrolling: "no", style: { display: 'block', width: '100%', height: '100%', border: 0 } }, src)) }));
+};
+export { StockScreener };
+//# sourceMappingURL=stock-screener.js.map

package/dist/backends/gui/stock-screener.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"stock-screener.js","sourceRoot":"","sources":["../../../src/backends/gui/stock-screener.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ;;;;;;;;;;;;;;;GAeG;AACH,OAAO,EAAE,MAAM,EAAE,KAAK,EAAoB,MAAM,YAAY,CAAA;AAC5D,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA;AAqC7B,MAAM,KAAK,GAAG,mEAAmE,CAAA;AAEjF,8EAA8E;AAC9E,MAAM,QAAQ,GAAG,CAAC,EAChB,MAAM,GAAG,SAAS,EAClB,aAAa,GAAG,UAAU,EAC1B,aAAa,GAAG,SAAS,EACzB,WAAW,GAAG,IAAI,EAClB,UAAU,GAAG,MAAM,EACnB,aAAa,GAAG,KAAK,EACrB,MAAM,GAAG,IAAI,EACb,KAAK,GAAG,MAAM,EACd,MAAM,GAAG,GAAG,GACO,EAAE,EAAE,CAAC,CAAC;IACzB,aAAa;IACb,aAAa;IACb,aAAa,EAAE,MAAM;IACrB,WAAW;IACX,UAAU;IACV,aAAa;IACb,MAAM;IACN,KAAK;IACL,MAAM;CACP,CAAC,CAAA;AAEF,MAAM,aAAa,GAAG,CAAC,EACrB,MAAM,EACN,aAAa,EACb,aAAa,EACb,WAAW,EACX,UAAU,EACV,aAAa,EACb,MAAM,EACN,KAAK,EACL,MAAM,EACN,GAAG,KAAK,EACW,EAAE,EAAE;IACvB,MAAM,CAAC,GAAG,QAAQ,CAAC;QACjB,MAAM;QACN,aAAa;QACb,aAAa;QACb,WAAW;QACX,UAAU;QACV,aAAa;QACb,MAAM;QACN,KAAK;QACL,MAAM;KACP,CAAC,CAAA;IACF,MAAM,GAAG,GAAG,GAAG,KAAK,GAAG,CAAC,CAAC,MAAM,IAAI,kBAAkB,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,EAAE,CAAA;IAC1E,OAAO,CACL,KAAC,MAAM,OACD,IAAI,CAAC,gBAAgB,CAAC,iBACb,MAAM,IAAI,SAAS,sBACd,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,EAAE,GAAG,MAAM,IAAI,SAAS,WAAW,EACxC,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,aAAa,EAAE,CAAA"}

package/dist/backends/gui/symbol-info.cjs

@@ -0,0 +1,46 @@
+'use client';"use strict";
+'use client';
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SymbolInfo = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+/**
+ * SymbolInfo — a TradingView symbol-info widget for one symbol, in a gui
+ * frame.
+ *
+ * The price and the key stats beside it are TradingView's, drawn inside
+ * TradingView's own document, so the widget is an `<iframe>` and nothing here
+ * draws a pixel of it. What this owns is the frame around it and the settings
+ * it opens with — symbol, locale, theme — written into the iframe's address
+ * the way TradingView's own embed script writes them:
+ * `/embed-widget/symbol-info/?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 widget arrives.
+ *
+ * The widget sizes its own height from its content, so unlike its wider
+ * siblings (Financials, CompanyProfile) this frame takes no `height` prop —
+ * only the documented `width`.
+ *
+ * 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 new `symbol` would change the URL and leave the old
+ * widget on screen.
+ */
+const gui_1 = require("@hanzo/gui");
+const slot_1 = require("./slot.cjs");
+const EMBED = 'https://www.tradingview-widget.com/embed-widget/symbol-info/?locale=';
+/** The settings TradingView reads, with the documented defaults filled in. */
+const settings = ({ symbol = 'NASDAQ:AAPL', width = '100%', colorTheme = 'dark', isTransparent = false, }) => ({
+    symbol,
+    width,
+    colorTheme,
+    isTransparent,
+});
+const SymbolInfo = ({ symbol, width, locale = 'en', colorTheme, isTransparent, ...props }) => {
+    const s = settings({ symbol, width, colorTheme, isTransparent });
+    const src = `${EMBED}${locale}#${encodeURIComponent(JSON.stringify(s))}`;
+    return ((0, jsx_runtime_1.jsx)(gui_1.YStack, { ...(0, slot_1.slot)('symbol-info'), "data-symbol": s.symbol, "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, overflow: "hidden", position: "relative", bg: "$panel", ...props, children: gui_1.isWeb && ((0, jsx_runtime_1.jsx)("iframe", { src: src, title: `${s.symbol} symbol info`, loading: "lazy", scrolling: "no", style: { display: 'block', width: '100%', border: 0 } }, src)) }));
+};
+exports.SymbolInfo = SymbolInfo;

package/dist/backends/gui/symbol-info.d.ts

@@ -0,0 +1,36 @@
+/**
+ * SymbolInfo — a TradingView symbol-info widget for one symbol, in a gui
+ * frame.
+ *
+ * The price and the key stats beside it are TradingView's, drawn inside
+ * TradingView's own document, so the widget is an `<iframe>` and nothing here
+ * draws a pixel of it. What this owns is the frame around it and the settings
+ * it opens with — symbol, locale, theme — written into the iframe's address
+ * the way TradingView's own embed script writes them:
+ * `/embed-widget/symbol-info/?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 widget arrives.
+ *
+ * The widget sizes its own height from its content, so unlike its wider
+ * siblings (Financials, CompanyProfile) this frame takes no `height` prop —
+ * only the documented `width`.
+ *
+ * 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 new `symbol` would change the URL and leave the old
+ * widget on screen.
+ */
+import { type YStackProps } from '@hanzo/gui';
+export type SymbolInfoTheme = 'light' | 'dark';
+export interface SymbolInfoProps extends Omit<YStackProps, 'width' | 'colorTheme'> {
+    /** The symbol to describe, exchange-qualified. */
+    symbol?: string;
+    width?: string | number;
+    locale?: string;
+    /** The widget's own palette; independent of the surrounding gui theme. */
+    colorTheme?: SymbolInfoTheme;
+    isTransparent?: boolean;
+}
+declare const SymbolInfo: ({ symbol, width, locale, colorTheme, isTransparent, ...props }: SymbolInfoProps) => import("react").JSX.Element;
+export { SymbolInfo };
+//# sourceMappingURL=symbol-info.d.ts.map

package/dist/backends/gui/symbol-info.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"symbol-info.d.ts","sourceRoot":"","sources":["../../../src/backends/gui/symbol-info.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,OAAO,EAAiB,KAAK,WAAW,EAAE,MAAM,YAAY,CAAA;AAG5D,MAAM,MAAM,eAAe,GAAG,OAAO,GAAG,MAAM,CAAA;AAE9C,MAAM,WAAW,eAAgB,SAAQ,IAAI,CAAC,WAAW,EAAE,OAAO,GAAG,YAAY,CAAC;IAChF,kDAAkD;IAClD,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACvB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,0EAA0E;IAC1E,UAAU,CAAC,EAAE,eAAe,CAAA;IAC5B,aAAa,CAAC,EAAE,OAAO,CAAA;CACxB;AAiBD,QAAA,MAAM,UAAU,mEAA2E,eAAe,gCA4BzG,CAAA;AAED,OAAO,EAAE,UAAU,EAAE,CAAA"}

package/dist/backends/gui/symbol-info.js

@@ -0,0 +1,44 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * SymbolInfo — a TradingView symbol-info widget for one symbol, in a gui
+ * frame.
+ *
+ * The price and the key stats beside it are TradingView's, drawn inside
+ * TradingView's own document, so the widget is an `<iframe>` and nothing here
+ * draws a pixel of it. What this owns is the frame around it and the settings
+ * it opens with — symbol, locale, theme — written into the iframe's address
+ * the way TradingView's own embed script writes them:
+ * `/embed-widget/symbol-info/?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 widget arrives.
+ *
+ * The widget sizes its own height from its content, so unlike its wider
+ * siblings (Financials, CompanyProfile) this frame takes no `height` prop —
+ * only the documented `width`.
+ *
+ * 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 new `symbol` would change the URL and leave the old
+ * widget on screen.
+ */
+import { YStack, isWeb } from '@hanzo/gui';
+import { slot } from './slot.js';
+const EMBED = 'https://www.tradingview-widget.com/embed-widget/symbol-info/?locale=';
+/** The settings TradingView reads, with the documented defaults filled in. */
+const settings = ({ symbol = 'NASDAQ:AAPL', width = '100%', colorTheme = 'dark', isTransparent = false, }) => ({
+    symbol,
+    width,
+    colorTheme,
+    isTransparent,
+});
+const SymbolInfo = ({ symbol, width, locale = 'en', colorTheme, isTransparent, ...props }) => {
+    const s = settings({ symbol, width, colorTheme, isTransparent });
+    const src = `${EMBED}${locale}#${encodeURIComponent(JSON.stringify(s))}`;
+    return (_jsx(YStack, { ...slot('symbol-info'), "data-symbol": s.symbol, "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, overflow: "hidden", position: "relative", bg: "$panel", ...props, children: isWeb && (_jsx("iframe", { src: src, title: `${s.symbol} symbol info`, loading: "lazy", scrolling: "no", style: { display: 'block', width: '100%', border: 0 } }, src)) }));
+};
+export { SymbolInfo };
+//# sourceMappingURL=symbol-info.js.map

package/dist/backends/gui/symbol-info.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"symbol-info.js","sourceRoot":"","sources":["../../../src/backends/gui/symbol-info.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,OAAO,EAAE,MAAM,EAAE,KAAK,EAAoB,MAAM,YAAY,CAAA;AAC5D,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA;AAc7B,MAAM,KAAK,GAAG,sEAAsE,CAAA;AAEpF,8EAA8E;AAC9E,MAAM,QAAQ,GAAG,CAAC,EAChB,MAAM,GAAG,aAAa,EACtB,KAAK,GAAG,MAAM,EACd,UAAU,GAAG,MAAM,EACnB,aAAa,GAAG,KAAK,GACL,EAAE,EAAE,CAAC,CAAC;IACtB,MAAM;IACN,KAAK;IACL,UAAU;IACV,aAAa;CACd,CAAC,CAAA;AAEF,MAAM,UAAU,GAAG,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,IAAI,EAAE,UAAU,EAAE,aAAa,EAAE,GAAG,KAAK,EAAmB,EAAE,EAAE;IAC5G,MAAM,CAAC,GAAG,QAAQ,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,UAAU,EAAE,aAAa,EAAE,CAAC,CAAA;IAChE,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,aAAa,CAAC,iBACV,CAAC,CAAC,MAAM,sBACH,CAAC,CAAC,UAAU;QAC9B,wEAAwE;QACxE,qEAAqE;QACrE,KAAK,EAAE,CAAC,CAAC,KAA6B,EACtC,QAAQ,EAAC,QAAQ,EACjB,QAAQ,EAAC,UAAU,EACnB,EAAE,EAAC,QAAQ,KACP,KAAK,YAER,KAAK,IAAI,CACR,iBAEE,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,GAAG,CAAC,CAAC,MAAM,cAAc,EAChC,OAAO,EAAC,MAAM,EACd,SAAS,EAAC,IAAI,EACd,KAAK,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,CAAC,EAAE,IALhD,GAAG,CAMR,CACH,GACM,CACV,CAAA;AACH,CAAC,CAAA;AAED,OAAO,EAAE,UAAU,EAAE,CAAA"}

package/dist/backends/gui/table.cjs

@@ -0,0 +1,104 @@
+'use client';"use strict";
+'use client';
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Table = Table;
+exports.TableHeader = TableHeader;
+exports.TableBody = TableBody;
+exports.TableFooter = TableFooter;
+exports.TableRow = TableRow;
+exports.TableHead = TableHead;
+exports.TableCell = TableCell;
+exports.TableCaption = TableCaption;
+const jsx_runtime_1 = require("react/jsx-runtime");
+/**
+ * Table — a real `<table>` and its sections/rows/cells, laid out with the
+ * host's native table algorithm (each part keeps its matching `display: table-*`)
+ * rather than a flex or grid stand-in, so `colSpan`/`rowSpan` and column-width
+ * alignment across rows work the way the browser already does them for free.
+ * It is the semantic counterpart to `DataTable` (sorting/filtering/pagination
+ * over a grid): this one is markup for tabular content someone else already
+ * shaped, the way a changelog or an invoice line-item list is markup, not a
+ * data structure.
+ *
+ * `display: table-*` and a couple of CSS properties gui does not model as
+ * typed style props (`overflow: auto`, `transition`, `text-align`) go through
+ * the plain `style` object every host element accepts, the same escape hatch
+ * `calendar.tsx` uses for `textAlign` — the styled() variant surface stays
+ * limited to the tokens gui actually knows.
+ *
+ * The scrolling frame is a separate part from the table itself so a caption,
+ * header, body and footer all scroll together as one unit on a narrow
+ * viewport.
+ */
+const gui_1 = require("@hanzo/gui");
+const slot_1 = require("./slot.cjs");
+const TableScroll = (0, gui_1.styled)(gui_1.XStack, {
+    name: 'TableScroll',
+    position: 'relative',
+    width: '100%',
+});
+const TableFrame = (0, gui_1.styled)(gui_1.YStack, {
+    name: 'TableFrame',
+    width: '100%',
+});
+const TableHeaderFrame = (0, gui_1.styled)(gui_1.YStack, {
+    name: 'TableHeaderFrame',
+});
+const TableBodyFrame = (0, gui_1.styled)(gui_1.YStack, {
+    name: 'TableBodyFrame',
+});
+const TableFooterFrame = (0, gui_1.styled)(gui_1.YStack, {
+    name: 'TableFooterFrame',
+    borderTopWidth: 1,
+    borderTopColor: '$borderColor',
+    bg: '$panel',
+});
+const TableRowFrame = (0, gui_1.styled)(gui_1.YStack, {
+    name: 'TableRowFrame',
+    borderBottomWidth: 1,
+    borderBottomColor: '$borderColor',
+    hoverStyle: { bg: '$hover' },
+    variants: {
+        selected: {
+            true: { bg: '$hover' },
+        },
+    },
+});
+const TableHeadFrame = (0, gui_1.styled)(gui_1.YStack, {
+    name: 'TableHeadFrame',
+    height: 48,
+    px: '$3',
+});
+const TableCellFrame = (0, gui_1.styled)(gui_1.YStack, {
+    name: 'TableCellFrame',
+    p: '$3',
+});
+const TableCaptionFrame = (0, gui_1.styled)(gui_1.YStack, {
+    name: 'TableCaptionFrame',
+    mt: '$4',
+});
+function Table({ children, ...props }) {
+    return ((0, jsx_runtime_1.jsx)(TableScroll, { ...(0, slot_1.slot)('table-scroll'), style: { overflow: 'auto' }, children: (0, jsx_runtime_1.jsx)(TableFrame, { ...(0, slot_1.slot)('table'), render: "table", style: { borderCollapse: 'collapse', captionSide: 'bottom', display: 'table' }, ...props, children: children }) }));
+}
+function TableHeader({ children, ...props }) {
+    return ((0, jsx_runtime_1.jsx)(TableHeaderFrame, { ...(0, slot_1.slot)('table-header'), render: "thead", style: { display: 'table-header-group' }, ...props, children: children }));
+}
+function TableBody({ children, ...props }) {
+    return ((0, jsx_runtime_1.jsx)(TableBodyFrame, { ...(0, slot_1.slot)('table-body'), render: "tbody", style: { display: 'table-row-group' }, ...props, children: children }));
+}
+function TableFooter({ children, ...props }) {
+    return ((0, jsx_runtime_1.jsx)(TableFooterFrame, { ...(0, slot_1.slot)('table-footer'), render: "tfoot", style: { display: 'table-footer-group' }, ...props, children: children }));
+}
+function TableRow({ children, selected = false, ...props }) {
+    return ((0, jsx_runtime_1.jsx)(TableRowFrame, { ...(0, slot_1.slot)('table-row'), "data-state": selected ? 'selected' : undefined, selected: selected, render: "tr", style: { display: 'table-row', transition: 'background-color 0.15s ease' }, ...props, children: children }));
+}
+function TableHead({ children, ...props }) {
+    return ((0, jsx_runtime_1.jsx)(TableHeadFrame, { ...(0, slot_1.slot)('table-head'), render: "th", style: { display: 'table-cell', textAlign: 'left', verticalAlign: 'middle' }, ...props, children: (0, jsx_runtime_1.jsx)(gui_1.SizableText, { size: "$2", fontWeight: "500", color: "$quiet", children: children }) }));
+}
+function TableCell({ children, colSpan, rowSpan, ...props }) {
+    const cellAttrs = { colSpan, rowSpan };
+    return ((0, jsx_runtime_1.jsx)(TableCellFrame, { ...(0, slot_1.slot)('table-cell'), render: "td", style: { display: 'table-cell', verticalAlign: 'middle' }, ...props, ...cellAttrs, children: (0, jsx_runtime_1.jsx)(gui_1.SizableText, { size: "$2", children: children }) }));
+}
+function TableCaption({ children, ...props }) {
+    return ((0, jsx_runtime_1.jsx)(TableCaptionFrame, { ...(0, slot_1.slot)('table-caption'), render: "caption", style: { display: 'table-caption' }, ...props, children: (0, jsx_runtime_1.jsx)(gui_1.SizableText, { size: "$2", color: "$quiet", children: children }) }));
+}

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

@@ -0,0 +1,57 @@
+import type * as React from 'react';
+declare const TableFrame: 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>;
+declare const TableHeaderFrame: 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>;
+declare const TableBodyFrame: 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>;
+declare const TableFooterFrame: 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>;
+declare const TableRowFrame: 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;
+    selected?: boolean | undefined;
+}, import("@hanzogui/web").StaticConfigPublic>;
+declare const TableHeadFrame: 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>;
+declare const TableCellFrame: 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>;
+declare const TableCaptionFrame: 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 TableProps = React.ComponentProps<typeof TableFrame>;
+export type TableHeaderProps = React.ComponentProps<typeof TableHeaderFrame>;
+export type TableBodyProps = React.ComponentProps<typeof TableBodyFrame>;
+export type TableFooterProps = React.ComponentProps<typeof TableFooterFrame>;
+export type TableRowProps = React.ComponentProps<typeof TableRowFrame> & {
+    selected?: boolean;
+};
+export type TableHeadProps = React.ComponentProps<typeof TableHeadFrame>;
+export type TableCellProps = React.ComponentProps<typeof TableCellFrame> & {
+    colSpan?: number;
+    rowSpan?: number;
+};
+export type TableCaptionProps = React.ComponentProps<typeof TableCaptionFrame>;
+export declare function Table({ children, ...props }: TableProps): React.JSX.Element;
+export declare function TableHeader({ children, ...props }: TableHeaderProps): React.JSX.Element;
+export declare function TableBody({ children, ...props }: TableBodyProps): React.JSX.Element;
+export declare function TableFooter({ children, ...props }: TableFooterProps): React.JSX.Element;
+export declare function TableRow({ children, selected, ...props }: TableRowProps): React.JSX.Element;
+export declare function TableHead({ children, ...props }: TableHeadProps): React.JSX.Element;
+export declare function TableCell({ children, colSpan, rowSpan, ...props }: TableCellProps): React.JSX.Element;
+export declare function TableCaption({ children, ...props }: TableCaptionProps): React.JSX.Element;
+export {};
+//# sourceMappingURL=table.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"table.d.ts","sourceRoot":"","sources":["../../../src/backends/gui/table.tsx"],"names":[],"mappings":"AAuBA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAA;AASnC,QAAA,MAAM,UAAU;;;8CAGd,CAAA;AAEF,QAAA,MAAM,gBAAgB;;;8CAEpB,CAAA;AAEF,QAAA,MAAM,cAAc;;;8CAElB,CAAA;AAEF,QAAA,MAAM,gBAAgB;;;8CAKpB,CAAA;AAEF,QAAA,MAAM,aAAa;;;;8CAWjB,CAAA;AAEF,QAAA,MAAM,cAAc;;;8CAIlB,CAAA;AAEF,QAAA,MAAM,cAAc;;;8CAGlB,CAAA;AAEF,QAAA,MAAM,iBAAiB;;;8CAGrB,CAAA;AAEF,MAAM,MAAM,UAAU,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,UAAU,CAAC,CAAA;AAChE,MAAM,MAAM,gBAAgB,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,gBAAgB,CAAC,CAAA;AAC5E,MAAM,MAAM,cAAc,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,cAAc,CAAC,CAAA;AACxE,MAAM,MAAM,gBAAgB,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,gBAAgB,CAAC,CAAA;AAC5E,MAAM,MAAM,aAAa,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,aAAa,CAAC,GAAG;IAAE,QAAQ,CAAC,EAAE,OAAO,CAAA;CAAE,CAAA;AAC/F,MAAM,MAAM,cAAc,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,cAAc,CAAC,CAAA;AACxE,MAAM,MAAM,cAAc,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,cAAc,CAAC,GAAG;IACzE,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,OAAO,CAAC,EAAE,MAAM,CAAA;CACjB,CAAA;AACD,MAAM,MAAM,iBAAiB,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,iBAAiB,CAAC,CAAA;AAE9E,wBAAgB,KAAK,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,UAAU,qBAavD;AAED,wBAAgB,WAAW,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,gBAAgB,qBAWnE;AAED,wBAAgB,SAAS,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,qBAW/D;AAED,wBAAgB,WAAW,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,gBAAgB,qBAWnE;AAED,wBAAgB,QAAQ,CAAC,EAAE,QAAQ,EAAE,QAAgB,EAAE,GAAG,KAAK,EAAE,EAAE,aAAa,qBAa/E;AAED,wBAAgB,SAAS,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,qBAa/D;AAED,wBAAgB,SAAS,CAAC,EAAE,QAAQ,EAAE,OAAO,EAAE,OAAO,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,qBAajF;AAED,wBAAgB,YAAY,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,iBAAiB,qBAarE"}

package/dist/backends/gui/table.js

@@ -0,0 +1,95 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * Table — a real `<table>` and its sections/rows/cells, laid out with the
+ * host's native table algorithm (each part keeps its matching `display: table-*`)
+ * rather than a flex or grid stand-in, so `colSpan`/`rowSpan` and column-width
+ * alignment across rows work the way the browser already does them for free.
+ * It is the semantic counterpart to `DataTable` (sorting/filtering/pagination
+ * over a grid): this one is markup for tabular content someone else already
+ * shaped, the way a changelog or an invoice line-item list is markup, not a
+ * data structure.
+ *
+ * `display: table-*` and a couple of CSS properties gui does not model as
+ * typed style props (`overflow: auto`, `transition`, `text-align`) go through
+ * the plain `style` object every host element accepts, the same escape hatch
+ * `calendar.tsx` uses for `textAlign` — the styled() variant surface stays
+ * limited to the tokens gui actually knows.
+ *
+ * The scrolling frame is a separate part from the table itself so a caption,
+ * header, body and footer all scroll together as one unit on a narrow
+ * viewport.
+ */
+import { SizableText, XStack, YStack, styled } from '@hanzo/gui';
+import { slot } from './slot.js';
+const TableScroll = styled(XStack, {
+    name: 'TableScroll',
+    position: 'relative',
+    width: '100%',
+});
+const TableFrame = styled(YStack, {
+    name: 'TableFrame',
+    width: '100%',
+});
+const TableHeaderFrame = styled(YStack, {
+    name: 'TableHeaderFrame',
+});
+const TableBodyFrame = styled(YStack, {
+    name: 'TableBodyFrame',
+});
+const TableFooterFrame = styled(YStack, {
+    name: 'TableFooterFrame',
+    borderTopWidth: 1,
+    borderTopColor: '$borderColor',
+    bg: '$panel',
+});
+const TableRowFrame = styled(YStack, {
+    name: 'TableRowFrame',
+    borderBottomWidth: 1,
+    borderBottomColor: '$borderColor',
+    hoverStyle: { bg: '$hover' },
+    variants: {
+        selected: {
+            true: { bg: '$hover' },
+        },
+    },
+});
+const TableHeadFrame = styled(YStack, {
+    name: 'TableHeadFrame',
+    height: 48,
+    px: '$3',
+});
+const TableCellFrame = styled(YStack, {
+    name: 'TableCellFrame',
+    p: '$3',
+});
+const TableCaptionFrame = styled(YStack, {
+    name: 'TableCaptionFrame',
+    mt: '$4',
+});
+export function Table({ children, ...props }) {
+    return (_jsx(TableScroll, { ...slot('table-scroll'), style: { overflow: 'auto' }, children: _jsx(TableFrame, { ...slot('table'), render: "table", style: { borderCollapse: 'collapse', captionSide: 'bottom', display: 'table' }, ...props, children: children }) }));
+}
+export function TableHeader({ children, ...props }) {
+    return (_jsx(TableHeaderFrame, { ...slot('table-header'), render: "thead", style: { display: 'table-header-group' }, ...props, children: children }));
+}
+export function TableBody({ children, ...props }) {
+    return (_jsx(TableBodyFrame, { ...slot('table-body'), render: "tbody", style: { display: 'table-row-group' }, ...props, children: children }));
+}
+export function TableFooter({ children, ...props }) {
+    return (_jsx(TableFooterFrame, { ...slot('table-footer'), render: "tfoot", style: { display: 'table-footer-group' }, ...props, children: children }));
+}
+export function TableRow({ children, selected = false, ...props }) {
+    return (_jsx(TableRowFrame, { ...slot('table-row'), "data-state": selected ? 'selected' : undefined, selected: selected, render: "tr", style: { display: 'table-row', transition: 'background-color 0.15s ease' }, ...props, children: children }));
+}
+export function TableHead({ children, ...props }) {
+    return (_jsx(TableHeadFrame, { ...slot('table-head'), render: "th", style: { display: 'table-cell', textAlign: 'left', verticalAlign: 'middle' }, ...props, children: _jsx(SizableText, { size: "$2", fontWeight: "500", color: "$quiet", children: children }) }));
+}
+export function TableCell({ children, colSpan, rowSpan, ...props }) {
+    const cellAttrs = { colSpan, rowSpan };
+    return (_jsx(TableCellFrame, { ...slot('table-cell'), render: "td", style: { display: 'table-cell', verticalAlign: 'middle' }, ...props, ...cellAttrs, children: _jsx(SizableText, { size: "$2", children: children }) }));
+}
+export function TableCaption({ children, ...props }) {
+    return (_jsx(TableCaptionFrame, { ...slot('table-caption'), render: "caption", style: { display: 'table-caption' }, ...props, children: _jsx(SizableText, { size: "$2", color: "$quiet", children: children }) }));
+}
+//# sourceMappingURL=table.js.map

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

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