@hanzo/ui 8.27.8 → 8.27.10

package/dist/backends/gui/editor.cjs

@@ -0,0 +1,80 @@
+'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.Editor = Editor;
+const jsx_runtime_1 = require("react/jsx-runtime");
+/**
+ * Editor — a rich-text surface: a toolbar of bold/italic/bulleted-list/numbered-list
+ * toggles above a contentEditable region, reporting its HTML back on every edit.
+ *
+ * Formatting a live selection is a browser primitive with no cross-platform
+ * equivalent in gui, so this wraps the two platform primitives directly —
+ * `contentEditable` for the surface, `document.execCommand` for the commands —
+ * inside a gui frame for layout and theming. It is web-only for that reason;
+ * native has no selection to format.
+ */
+const gui_1 = require("@hanzo/gui");
+const lucide_icons_2_1 = require("@hanzogui/lucide-icons-2");
+const React = __importStar(require("react"));
+const button_1 = require("./button.cjs");
+const slot_1 = require("./slot.cjs");
+function Editor({ value, onChange, placeholder = 'Start typing...', readOnly = false, ...props }) {
+    const surface = React.useRef(null);
+    const [empty, setEmpty] = React.useState(!value);
+    // A controlled value is written into the surface only when it changes out
+    // from under the caller (e.g. a reset button) — writing it on every render
+    // would fight the surface's own DOM as the user types and jump the caret.
+    React.useEffect(() => {
+        const el = surface.current;
+        if (el && value !== undefined && value !== el.innerHTML)
+            el.innerHTML = value;
+    }, [value]);
+    const report = React.useCallback(() => {
+        const el = surface.current;
+        if (!el)
+            return;
+        setEmpty(el.textContent === '');
+        onChange?.(el.innerHTML);
+    }, [onChange]);
+    const command = (name) => () => {
+        document.execCommand(name);
+        surface.current?.focus();
+        report();
+    };
+    return ((0, jsx_runtime_1.jsxs)(gui_1.YStack, { ...(0, slot_1.slot)('editor'), gap: "$2", ...props, children: [(0, jsx_runtime_1.jsxs)(gui_1.XStack, { ...(0, slot_1.slot)('editor-toolbar'), gap: "$1", borderBottomWidth: 1, borderColor: "$borderColor", pb: "$2", children: [(0, jsx_runtime_1.jsx)(button_1.Button, { ...(0, slot_1.slot)('editor-bold'), variant: "ghost", size: "icon-sm", type: "button", onClick: command('bold'), "aria-label": "Bold", children: (0, jsx_runtime_1.jsx)(lucide_icons_2_1.Bold, { size: 16 }) }), (0, jsx_runtime_1.jsx)(button_1.Button, { ...(0, slot_1.slot)('editor-italic'), variant: "ghost", size: "icon-sm", type: "button", onClick: command('italic'), "aria-label": "Italic", children: (0, jsx_runtime_1.jsx)(lucide_icons_2_1.Italic, { size: 16 }) }), (0, jsx_runtime_1.jsx)(button_1.Button, { ...(0, slot_1.slot)('editor-bullet-list'), variant: "ghost", size: "icon-sm", type: "button", onClick: command('insertUnorderedList'), "aria-label": "Bulleted list", children: (0, jsx_runtime_1.jsx)(lucide_icons_2_1.List, { size: 16 }) }), (0, jsx_runtime_1.jsx)(button_1.Button, { ...(0, slot_1.slot)('editor-ordered-list'), variant: "ghost", size: "icon-sm", type: "button", onClick: command('insertOrderedList'), "aria-label": "Numbered list", children: (0, jsx_runtime_1.jsx)(lucide_icons_2_1.ListOrdered, { size: 16 }) })] }), (0, jsx_runtime_1.jsx)(gui_1.YStack, { ...(0, slot_1.slot)('editor-surface'), ref: surface, 
+                // @ts-expect-error — contentEditable is a DOM attribute gui does not type; it forwards unknown props on web and drops them on native
+                contentEditable: !readOnly, suppressContentEditableWarning: true, "data-placeholder": placeholder, "data-empty": empty || undefined, minH: 200, borderWidth: 1, borderColor: "$borderColor", rounded: "$3", p: "$4", onInput: report, dangerouslySetInnerHTML: value === undefined ? { __html: '' } : undefined, style: { outline: 'none' } })] }));
+}

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

@@ -0,0 +1,23 @@
+/**
+ * Editor — a rich-text surface: a toolbar of bold/italic/bulleted-list/numbered-list
+ * toggles above a contentEditable region, reporting its HTML back on every edit.
+ *
+ * Formatting a live selection is a browser primitive with no cross-platform
+ * equivalent in gui, so this wraps the two platform primitives directly —
+ * `contentEditable` for the surface, `document.execCommand` for the commands —
+ * inside a gui frame for layout and theming. It is web-only for that reason;
+ * native has no selection to format.
+ */
+import { type YStackProps } from '@hanzo/gui';
+import * as React from 'react';
+/** The four formatting commands the toolbar issues via `document.execCommand`. */
+export type EditorCommand = 'bold' | 'italic' | 'insertUnorderedList' | 'insertOrderedList';
+export interface EditorProps extends Omit<YStackProps, 'children' | 'onChange'> {
+    /** A controlled value; omit it and edit freely to let the surface own its HTML. */
+    value?: string;
+    onChange?: (value: string) => void;
+    placeholder?: string;
+    readOnly?: boolean;
+}
+export declare function Editor({ value, onChange, placeholder, readOnly, ...props }: EditorProps): React.JSX.Element;
+//# sourceMappingURL=editor.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"editor.d.ts","sourceRoot":"","sources":["../../../src/backends/gui/editor.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;GASG;AACH,OAAO,EAAkB,KAAK,WAAW,EAAE,MAAM,YAAY,CAAA;AAE7D,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAK9B,kFAAkF;AAClF,MAAM,MAAM,aAAa,GAAG,MAAM,GAAG,QAAQ,GAAG,qBAAqB,GAAG,mBAAmB,CAAA;AAE3F,MAAM,WAAW,WAAY,SAAQ,IAAI,CAAC,WAAW,EAAE,UAAU,GAAG,UAAU,CAAC;IAC7E,mFAAmF;IACnF,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IAClC,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB;AAED,wBAAgB,MAAM,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,WAA+B,EAAE,QAAgB,EAAE,GAAG,KAAK,EAAE,EAAE,WAAW,qBA0EnH"}

package/dist/backends/gui/editor.js

@@ -0,0 +1,45 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * Editor — a rich-text surface: a toolbar of bold/italic/bulleted-list/numbered-list
+ * toggles above a contentEditable region, reporting its HTML back on every edit.
+ *
+ * Formatting a live selection is a browser primitive with no cross-platform
+ * equivalent in gui, so this wraps the two platform primitives directly —
+ * `contentEditable` for the surface, `document.execCommand` for the commands —
+ * inside a gui frame for layout and theming. It is web-only for that reason;
+ * native has no selection to format.
+ */
+import { XStack, YStack } from '@hanzo/gui';
+import { Bold, Italic, List, ListOrdered } from '@hanzogui/lucide-icons-2';
+import * as React from 'react';
+import { Button } from './button.js';
+import { slot } from './slot.js';
+export function Editor({ value, onChange, placeholder = 'Start typing...', readOnly = false, ...props }) {
+    const surface = React.useRef(null);
+    const [empty, setEmpty] = React.useState(!value);
+    // A controlled value is written into the surface only when it changes out
+    // from under the caller (e.g. a reset button) — writing it on every render
+    // would fight the surface's own DOM as the user types and jump the caret.
+    React.useEffect(() => {
+        const el = surface.current;
+        if (el && value !== undefined && value !== el.innerHTML)
+            el.innerHTML = value;
+    }, [value]);
+    const report = React.useCallback(() => {
+        const el = surface.current;
+        if (!el)
+            return;
+        setEmpty(el.textContent === '');
+        onChange?.(el.innerHTML);
+    }, [onChange]);
+    const command = (name) => () => {
+        document.execCommand(name);
+        surface.current?.focus();
+        report();
+    };
+    return (_jsxs(YStack, { ...slot('editor'), gap: "$2", ...props, children: [_jsxs(XStack, { ...slot('editor-toolbar'), gap: "$1", borderBottomWidth: 1, borderColor: "$borderColor", pb: "$2", children: [_jsx(Button, { ...slot('editor-bold'), variant: "ghost", size: "icon-sm", type: "button", onClick: command('bold'), "aria-label": "Bold", children: _jsx(Bold, { size: 16 }) }), _jsx(Button, { ...slot('editor-italic'), variant: "ghost", size: "icon-sm", type: "button", onClick: command('italic'), "aria-label": "Italic", children: _jsx(Italic, { size: 16 }) }), _jsx(Button, { ...slot('editor-bullet-list'), variant: "ghost", size: "icon-sm", type: "button", onClick: command('insertUnorderedList'), "aria-label": "Bulleted list", children: _jsx(List, { size: 16 }) }), _jsx(Button, { ...slot('editor-ordered-list'), variant: "ghost", size: "icon-sm", type: "button", onClick: command('insertOrderedList'), "aria-label": "Numbered list", children: _jsx(ListOrdered, { size: 16 }) })] }), _jsx(YStack, { ...slot('editor-surface'), ref: surface, 
+                // @ts-expect-error — contentEditable is a DOM attribute gui does not type; it forwards unknown props on web and drops them on native
+                contentEditable: !readOnly, suppressContentEditableWarning: true, "data-placeholder": placeholder, "data-empty": empty || undefined, minH: 200, borderWidth: 1, borderColor: "$borderColor", rounded: "$3", p: "$4", onInput: report, dangerouslySetInnerHTML: value === undefined ? { __html: '' } : undefined, style: { outline: 'none' } })] }));
+}
+//# sourceMappingURL=editor.js.map

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

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

package/dist/backends/gui/empty.cjs

@@ -0,0 +1,71 @@
+'use client';"use strict";
+'use client';
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.EmptyContent = exports.EmptyDescription = exports.EmptyTitle = exports.EmptyMedia = exports.EmptyHeader = exports.Empty = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+/**
+ * Empty — a placeholder for the absence of data: a header (media, title,
+ * description) above a content slot for a call to action.
+ *
+ * `EmptyMedia` carries the one variant that matters here — a bare icon versus
+ * one boxed into a rounded tile — through a styled context, the same split
+ * Badge uses for its frame/text pair.
+ */
+const gui_1 = require("@hanzo/gui");
+const ink_1 = require("./ink.cjs");
+const slot_1 = require("./slot.cjs");
+const EmptyFrame = (0, gui_1.styled)(gui_1.YStack, {
+    name: 'Empty',
+    flex: 1,
+    minW: 0,
+    items: 'center',
+    justify: 'center',
+    gap: '$6',
+    p: '$6',
+    rounded: '$6',
+    borderStyle: 'dashed',
+});
+const HeaderFrame = (0, gui_1.styled)(gui_1.YStack, {
+    name: 'EmptyHeader',
+    maxW: 384,
+    items: 'center',
+    gap: '$2',
+});
+const MediaContext = /* @__PURE__ */ (0, gui_1.createStyledContext)({ variant: 'default' });
+const MediaFrame = (0, gui_1.styled)(gui_1.YStack, {
+    name: 'EmptyMedia',
+    context: MediaContext,
+    shrink: 0,
+    items: 'center',
+    justify: 'center',
+    mb: '$2',
+    variants: {
+        variant: {
+            default: { bg: 'transparent' },
+            icon: { bg: '$hover', width: 40, height: 40, rounded: '$3' },
+        },
+    },
+    defaultVariants: { variant: 'default' },
+});
+const TitleFrame = (0, gui_1.styled)(gui_1.SizableText, { name: 'EmptyTitle', size: '$4', fontWeight: '500' });
+const DescriptionFrame = (0, gui_1.styled)(gui_1.SizableText, { name: 'EmptyDescription', size: '$2', color: '$quiet' });
+const ContentFrame = (0, gui_1.styled)(gui_1.YStack, {
+    name: 'EmptyContent',
+    width: '100%',
+    minW: 0,
+    maxW: 384,
+    items: 'center',
+    gap: '$4',
+});
+const Empty = (p) => (0, jsx_runtime_1.jsx)(EmptyFrame, { ...(0, slot_1.slot)('empty'), ...p });
+exports.Empty = Empty;
+const EmptyHeader = (p) => (0, jsx_runtime_1.jsx)(HeaderFrame, { ...(0, slot_1.slot)('empty-header'), ...p });
+exports.EmptyHeader = EmptyHeader;
+const EmptyMedia = ({ variant = 'default', ...p }) => ((0, jsx_runtime_1.jsx)(MediaFrame, { ...(0, slot_1.slot)('empty-icon'), "data-variant": variant, variant: variant, ...p }));
+exports.EmptyMedia = EmptyMedia;
+const EmptyTitle = ({ children, ...p }) => ((0, jsx_runtime_1.jsx)(TitleFrame, { ...(0, slot_1.slot)('empty-title'), ...p, children: (0, ink_1.ink)(children) }));
+exports.EmptyTitle = EmptyTitle;
+const EmptyDescription = ({ children, ...p }) => ((0, jsx_runtime_1.jsx)(DescriptionFrame, { ...(0, slot_1.slot)('empty-description'), ...p, children: (0, ink_1.ink)(children) }));
+exports.EmptyDescription = EmptyDescription;
+const EmptyContent = ({ children, ...p }) => ((0, jsx_runtime_1.jsx)(ContentFrame, { ...(0, slot_1.slot)('empty-content'), ...p, children: (0, ink_1.ink)(children) }));
+exports.EmptyContent = EmptyContent;

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

@@ -0,0 +1,43 @@
+import type { ComponentProps } from 'react';
+declare const EmptyFrame: 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 HeaderFrame: 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 EmptyMediaVariant = 'default' | 'icon';
+declare const MediaFrame: 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;
+    variant?: "default" | "icon" | undefined;
+}, import("@hanzogui/web").StaticConfigPublic>;
+declare const TitleFrame: import("@hanzogui/web").GuiComponent<import("@hanzogui/web").TamaDefer, import("@hanzogui/web").GuiTextElement, import("@hanzogui/web").TextNonStyleProps, import("@hanzogui/web").TextStylePropsBase, {
+    unstyled?: boolean | undefined;
+    size?: import("@hanzogui/web").FontSizeTokens | undefined;
+}, import("@hanzogui/web").StaticConfigPublic>;
+declare const DescriptionFrame: import("@hanzogui/web").GuiComponent<import("@hanzogui/web").TamaDefer, import("@hanzogui/web").GuiTextElement, import("@hanzogui/web").TextNonStyleProps, import("@hanzogui/web").TextStylePropsBase, {
+    unstyled?: boolean | undefined;
+    size?: import("@hanzogui/web").FontSizeTokens | undefined;
+}, import("@hanzogui/web").StaticConfigPublic>;
+declare const ContentFrame: 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 EmptyProps = ComponentProps<typeof EmptyFrame>;
+export type EmptyHeaderProps = ComponentProps<typeof HeaderFrame>;
+export type EmptyMediaProps = ComponentProps<typeof MediaFrame> & {
+    variant?: EmptyMediaVariant;
+};
+export type EmptyTitleProps = ComponentProps<typeof TitleFrame>;
+export type EmptyDescriptionProps = ComponentProps<typeof DescriptionFrame>;
+export type EmptyContentProps = ComponentProps<typeof ContentFrame>;
+export declare const Empty: (p: EmptyProps) => import("react").JSX.Element;
+export declare const EmptyHeader: (p: EmptyHeaderProps) => import("react").JSX.Element;
+export declare const EmptyMedia: ({ variant, ...p }: EmptyMediaProps) => import("react").JSX.Element;
+export declare const EmptyTitle: ({ children, ...p }: EmptyTitleProps) => import("react").JSX.Element;
+export declare const EmptyDescription: ({ children, ...p }: EmptyDescriptionProps) => import("react").JSX.Element;
+export declare const EmptyContent: ({ children, ...p }: EmptyContentProps) => import("react").JSX.Element;
+export {};
+//# sourceMappingURL=empty.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"empty.d.ts","sourceRoot":"","sources":["../../../src/backends/gui/empty.tsx"],"names":[],"mappings":"AAWA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAI3C,QAAA,MAAM,UAAU;;;8CAUd,CAAA;AAEF,QAAA,MAAM,WAAW;;;8CAKf,CAAA;AAEF,MAAM,MAAM,iBAAiB,GAAG,SAAS,GAAG,MAAM,CAAA;AAIlD,QAAA,MAAM,UAAU;;;;8CAgBd,CAAA;AAEF,QAAA,MAAM,UAAU;;;8CAA6E,CAAA;AAC7F,QAAA,MAAM,gBAAgB;;;8CAAiF,CAAA;AAEvG,QAAA,MAAM,YAAY;;;8CAOhB,CAAA;AAEF,MAAM,MAAM,UAAU,GAAG,cAAc,CAAC,OAAO,UAAU,CAAC,CAAA;AAC1D,MAAM,MAAM,gBAAgB,GAAG,cAAc,CAAC,OAAO,WAAW,CAAC,CAAA;AACjE,MAAM,MAAM,eAAe,GAAG,cAAc,CAAC,OAAO,UAAU,CAAC,GAAG;IAAE,OAAO,CAAC,EAAE,iBAAiB,CAAA;CAAE,CAAA;AACjG,MAAM,MAAM,eAAe,GAAG,cAAc,CAAC,OAAO,UAAU,CAAC,CAAA;AAC/D,MAAM,MAAM,qBAAqB,GAAG,cAAc,CAAC,OAAO,gBAAgB,CAAC,CAAA;AAC3E,MAAM,MAAM,iBAAiB,GAAG,cAAc,CAAC,OAAO,YAAY,CAAC,CAAA;AAEnE,eAAO,MAAM,KAAK,MAAO,UAAU,gCAA6C,CAAA;AAEhF,eAAO,MAAM,WAAW,MAAO,gBAAgB,gCAAqD,CAAA;AAEpG,eAAO,MAAM,UAAU,sBAAmC,eAAe,gCAExE,CAAA;AAED,eAAO,MAAM,UAAU,uBAAwB,eAAe,gCAE7D,CAAA;AAED,eAAO,MAAM,gBAAgB,uBAAwB,qBAAqB,gCAEzE,CAAA;AAED,eAAO,MAAM,YAAY,uBAAwB,iBAAiB,gCAEjE,CAAA"}

package/dist/backends/gui/empty.js

@@ -0,0 +1,63 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * Empty — a placeholder for the absence of data: a header (media, title,
+ * description) above a content slot for a call to action.
+ *
+ * `EmptyMedia` carries the one variant that matters here — a bare icon versus
+ * one boxed into a rounded tile — through a styled context, the same split
+ * Badge uses for its frame/text pair.
+ */
+import { SizableText, YStack, createStyledContext, styled } from '@hanzo/gui';
+import { ink } from './ink.js';
+import { slot } from './slot.js';
+const EmptyFrame = styled(YStack, {
+    name: 'Empty',
+    flex: 1,
+    minW: 0,
+    items: 'center',
+    justify: 'center',
+    gap: '$6',
+    p: '$6',
+    rounded: '$6',
+    borderStyle: 'dashed',
+});
+const HeaderFrame = styled(YStack, {
+    name: 'EmptyHeader',
+    maxW: 384,
+    items: 'center',
+    gap: '$2',
+});
+const MediaContext = /* @__PURE__ */ createStyledContext({ variant: 'default' });
+const MediaFrame = styled(YStack, {
+    name: 'EmptyMedia',
+    context: MediaContext,
+    shrink: 0,
+    items: 'center',
+    justify: 'center',
+    mb: '$2',
+    variants: {
+        variant: {
+            default: { bg: 'transparent' },
+            icon: { bg: '$hover', width: 40, height: 40, rounded: '$3' },
+        },
+    },
+    defaultVariants: { variant: 'default' },
+});
+const TitleFrame = styled(SizableText, { name: 'EmptyTitle', size: '$4', fontWeight: '500' });
+const DescriptionFrame = styled(SizableText, { name: 'EmptyDescription', size: '$2', color: '$quiet' });
+const ContentFrame = styled(YStack, {
+    name: 'EmptyContent',
+    width: '100%',
+    minW: 0,
+    maxW: 384,
+    items: 'center',
+    gap: '$4',
+});
+export const Empty = (p) => _jsx(EmptyFrame, { ...slot('empty'), ...p });
+export const EmptyHeader = (p) => _jsx(HeaderFrame, { ...slot('empty-header'), ...p });
+export const EmptyMedia = ({ variant = 'default', ...p }) => (_jsx(MediaFrame, { ...slot('empty-icon'), "data-variant": variant, variant: variant, ...p }));
+export const EmptyTitle = ({ children, ...p }) => (_jsx(TitleFrame, { ...slot('empty-title'), ...p, children: ink(children) }));
+export const EmptyDescription = ({ children, ...p }) => (_jsx(DescriptionFrame, { ...slot('empty-description'), ...p, children: ink(children) }));
+export const EmptyContent = ({ children, ...p }) => (_jsx(ContentFrame, { ...slot('empty-content'), ...p, children: ink(children) }));
+//# sourceMappingURL=empty.js.map

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

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

package/dist/backends/gui/financials.cjs

@@ -0,0 +1,45 @@
+'use client';"use strict";
+'use client';
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Financials = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+/**
+ * Financials — a TradingView financial-statements widget for one symbol, in a
+ * gui frame.
+ *
+ * The statements, ratios and estimates are TradingView's, drawn inside
+ * TradingView's own document, so the widget is an `<iframe>` and nothing here
+ * draws a row of it. What this owns is the frame around it and the settings it
+ * opens with — symbol, display mode, theme — written into the iframe's address
+ * the way TradingView's own embed script writes them:
+ * `/embed-widget/financials/?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 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/financials/?locale=';
+/** The settings TradingView reads, with the documented defaults filled in. */
+const settings = ({ symbol = 'NASDAQ:AAPL', width = '100%', height = 800, colorTheme = 'dark', isTransparent = false, displayMode = 'adaptive', largeChartUrl = '', }) => ({
+    symbol,
+    width,
+    height,
+    colorTheme,
+    isTransparent,
+    displayMode,
+    largeChartUrl,
+});
+const Financials = ({ symbol, width, height, locale = 'en', colorTheme, isTransparent, displayMode, largeChartUrl, ...props }) => {
+    const s = settings({ symbol, width, height, colorTheme, isTransparent, displayMode, largeChartUrl });
+    const src = EMBED + encodeURIComponent(locale) + '#' + encodeURIComponent(JSON.stringify(s));
+    return ((0, jsx_runtime_1.jsx)(gui_1.YStack, { ...(0, slot_1.slot)('financials'), "data-symbol": s.symbol, "data-display-mode": s.displayMode, 
+        // 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: `${s.symbol} financials`, loading: "lazy", scrolling: "no", allowFullScreen: true, style: { display: 'block', width: '100%', height: '100%', border: 0 } }, src)) }));
+};
+exports.Financials = Financials;

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

@@ -0,0 +1,36 @@
+/**
+ * Financials — a TradingView financial-statements widget for one symbol, in a
+ * gui frame.
+ *
+ * The statements, ratios and estimates are TradingView's, drawn inside
+ * TradingView's own document, so the widget is an `<iframe>` and nothing here
+ * draws a row of it. What this owns is the frame around it and the settings it
+ * opens with — symbol, display mode, theme — written into the iframe's address
+ * the way TradingView's own embed script writes them:
+ * `/embed-widget/financials/?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 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 FinancialsDisplayMode = 'adaptive' | 'regular' | 'compact';
+export type FinancialsTheme = 'light' | 'dark';
+export interface FinancialsProps extends Omit<YStackProps, 'width' | 'height' | 'theme'> {
+    /** The symbol to report on, exchange-qualified. */
+    symbol?: string;
+    width?: string | number;
+    height?: string | number;
+    locale?: string;
+    /** The widget's own palette; independent of the surrounding gui theme. */
+    colorTheme?: FinancialsTheme;
+    isTransparent?: boolean;
+    displayMode?: FinancialsDisplayMode;
+    largeChartUrl?: string;
+}
+declare const Financials: ({ symbol, width, height, locale, colorTheme, isTransparent, displayMode, largeChartUrl, ...props }: FinancialsProps) => import("react").JSX.Element;
+export { Financials };
+//# sourceMappingURL=financials.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"financials.d.ts","sourceRoot":"","sources":["../../../src/backends/gui/financials.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;GAiBG;AACH,OAAO,EAAiB,KAAK,WAAW,EAAE,MAAM,YAAY,CAAA;AAG5D,MAAM,MAAM,qBAAqB,GAAG,UAAU,GAAG,SAAS,GAAG,SAAS,CAAA;AAEtE,MAAM,MAAM,eAAe,GAAG,OAAO,GAAG,MAAM,CAAA;AAE9C,MAAM,WAAW,eAAgB,SAAQ,IAAI,CAAC,WAAW,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;IACtF,mDAAmD;IACnD,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACvB,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACxB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,0EAA0E;IAC1E,UAAU,CAAC,EAAE,eAAe,CAAA;IAC5B,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,WAAW,CAAC,EAAE,qBAAqB,CAAA;IACnC,aAAa,CAAC,EAAE,MAAM,CAAA;CACvB;AAuBD,QAAA,MAAM,UAAU,uGAUb,eAAe,gCA8BjB,CAAA;AAED,OAAO,EAAE,UAAU,EAAE,CAAA"}

package/dist/backends/gui/financials.js

@@ -0,0 +1,43 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * Financials — a TradingView financial-statements widget for one symbol, in a
+ * gui frame.
+ *
+ * The statements, ratios and estimates are TradingView's, drawn inside
+ * TradingView's own document, so the widget is an `<iframe>` and nothing here
+ * draws a row of it. What this owns is the frame around it and the settings it
+ * opens with — symbol, display mode, theme — written into the iframe's address
+ * the way TradingView's own embed script writes them:
+ * `/embed-widget/financials/?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 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/financials/?locale=';
+/** The settings TradingView reads, with the documented defaults filled in. */
+const settings = ({ symbol = 'NASDAQ:AAPL', width = '100%', height = 800, colorTheme = 'dark', isTransparent = false, displayMode = 'adaptive', largeChartUrl = '', }) => ({
+    symbol,
+    width,
+    height,
+    colorTheme,
+    isTransparent,
+    displayMode,
+    largeChartUrl,
+});
+const Financials = ({ symbol, width, height, locale = 'en', colorTheme, isTransparent, displayMode, largeChartUrl, ...props }) => {
+    const s = settings({ symbol, width, height, colorTheme, isTransparent, displayMode, largeChartUrl });
+    const src = EMBED + encodeURIComponent(locale) + '#' + encodeURIComponent(JSON.stringify(s));
+    return (_jsx(YStack, { ...slot('financials'), "data-symbol": s.symbol, "data-display-mode": s.displayMode, 
+        // 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: `${s.symbol} financials`, loading: "lazy", scrolling: "no", allowFullScreen: true, style: { display: 'block', width: '100%', height: '100%', border: 0 } }, src)) }));
+};
+export { Financials };
+//# sourceMappingURL=financials.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"financials.js","sourceRoot":"","sources":["../../../src/backends/gui/financials.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ;;;;;;;;;;;;;;;;;GAiBG;AACH,OAAO,EAAE,MAAM,EAAE,KAAK,EAAoB,MAAM,YAAY,CAAA;AAC5D,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA;AAmB7B,MAAM,KAAK,GAAG,qEAAqE,CAAA;AAEnF,8EAA8E;AAC9E,MAAM,QAAQ,GAAG,CAAC,EAChB,MAAM,GAAG,aAAa,EACtB,KAAK,GAAG,MAAM,EACd,MAAM,GAAG,GAAG,EACZ,UAAU,GAAG,MAAM,EACnB,aAAa,GAAG,KAAK,EACrB,WAAW,GAAG,UAAU,EACxB,aAAa,GAAG,EAAE,GACF,EAAE,EAAE,CAAC,CAAC;IACtB,MAAM;IACN,KAAK;IACL,MAAM;IACN,UAAU;IACV,aAAa;IACb,WAAW;IACX,aAAa;CACd,CAAC,CAAA;AAEF,MAAM,UAAU,GAAG,CAAC,EAClB,MAAM,EACN,KAAK,EACL,MAAM,EACN,MAAM,GAAG,IAAI,EACb,UAAU,EACV,aAAa,EACb,WAAW,EACX,aAAa,EACb,GAAG,KAAK,EACQ,EAAE,EAAE;IACpB,MAAM,CAAC,GAAG,QAAQ,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,UAAU,EAAE,aAAa,EAAE,WAAW,EAAE,aAAa,EAAE,CAAC,CAAA;IACpG,MAAM,GAAG,GAAG,KAAK,GAAG,kBAAkB,CAAC,MAAM,CAAC,GAAG,GAAG,GAAG,kBAAkB,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,CAAA;IAC5F,OAAO,CACL,KAAC,MAAM,OACD,IAAI,CAAC,YAAY,CAAC,iBACT,CAAC,CAAC,MAAM,uBACF,CAAC,CAAC,WAAW;QAChC,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,CAAC,CAAC,MAAM,aAAa,EAC/B,OAAO,EAAC,MAAM,EACd,SAAS,EAAC,IAAI,EACd,eAAe,QACf,KAAK,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,CAAC,EAAE,IANhE,GAAG,CAOR,CACH,GACM,CACV,CAAA;AACH,CAAC,CAAA;AAED,OAAO,EAAE,UAAU,EAAE,CAAA"}

package/dist/backends/gui/forex-market.cjs

@@ -0,0 +1,21 @@
+'use client';"use strict";
+'use client';
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ForexMarket = ForexMarket;
+const jsx_runtime_1 = require("react/jsx-runtime");
+/**
+ * ForexMarket — the forex-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 `['forex']`, nothing else.
+ */
+const crypto_market_1 = require("./crypto-market.cjs");
+function ForexMarket({ tabs = ['forex'], ...props }) {
+    return (0, jsx_runtime_1.jsx)(crypto_market_1.MarketOverview, { tabs: tabs, ...props });
+}

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

@@ -0,0 +1,17 @@
+/**
+ * ForexMarket — the forex-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 `['forex']`, nothing else.
+ */
+import { type MarketOverviewProps } from './crypto-market.js';
+export type { MarketOverviewPreset as ForexMarketPreset, MarketOverviewSymbol as ForexMarketSymbol, MarketOverviewTab as ForexMarketTab, MarketOverviewTheme as ForexMarketTheme, } from './crypto-market.js';
+export type ForexMarketProps = MarketOverviewProps;
+export declare function ForexMarket({ tabs, ...props }: ForexMarketProps): import("react").JSX.Element;
+//# sourceMappingURL=forex-market.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"forex-market.d.ts","sourceRoot":"","sources":["../../../src/backends/gui/forex-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,IAAgB,EAAE,GAAG,KAAK,EAAE,EAAE,gBAAgB,+BAE3E"}

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

@@ -0,0 +1,19 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * ForexMarket — the forex-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 `['forex']`, nothing else.
+ */
+import { MarketOverview } from './crypto-market.js';
+export function ForexMarket({ tabs = ['forex'], ...props }) {
+    return _jsx(MarketOverview, { tabs: tabs, ...props });
+}
+//# sourceMappingURL=forex-market.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"forex-market.js","sourceRoot":"","sources":["../../../src/backends/gui/forex-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,OAAO,CAAC,EAAE,GAAG,KAAK,EAAoB;IAC1E,OAAO,KAAC,cAAc,IAAC,IAAI,EAAE,IAAI,KAAM,KAAK,GAAI,CAAA;AAClD,CAAC"}

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

@@ -0,0 +1,57 @@
+'use client';"use strict";
+'use client';
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ForexScreener = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+/**
+ * ForexScreener — a TradingView currency-pair 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");
+/** `forex` is the one short name; every other market is its own screener_type. */
+const screenerType = (market) => market === 'forex' ? 'forex_mkt' : market;
+const EMBED = 'https://www.tradingview-widget.com/embed-widget/screener/?locale=';
+/** The settings TradingView reads, with the documented defaults filled in. */
+const settings = ({ market = 'forex', defaultColumn = 'overview', defaultScreen = 'general', showToolbar = true, colorTheme = 'dark', isTransparent = false, locale = 'en', width = '100%', height = 550, }) => ({
+    defaultColumn,
+    defaultScreen,
+    screener_type: screenerType(market),
+    showToolbar,
+    colorTheme,
+    isTransparent,
+    locale,
+    width,
+    height,
+});
+const ForexScreener = ({ 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)('forex-screener'), "data-market": market ?? 'forex', "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 ?? 'forex'} screener`, loading: "lazy", scrolling: "no", style: { display: 'block', width: '100%', height: '100%', border: 0 } }, src)) }));
+};
+exports.ForexScreener = ForexScreener;