basalt-core 0.0.0-rc5

package/dist/src/Menu.d.ts

@@ -0,0 +1,72 @@
+/**
+ * The application menu.
+ *
+ *   <Menu>
+ *     <Menu.Submenu label="File">
+ *       <Menu.Item label="Open…" accelerator="CmdOrCtrl+O" onClick={open} />
+ *       <Menu.Separator />
+ *       <Menu.Item role="close" />
+ *     </Menu.Submenu>
+ *     <Menu.Submenu label="Edit">
+ *       <Menu.Item role="undo" />
+ *       <Menu.Item role="copy" />
+ *       <Menu.Item role="paste" />
+ *     </Menu.Submenu>
+ *   </Menu>
+ *
+ * Declarative because a menu bar is state, not a command: it is on screen for
+ * as long as the component is mounted, and unmounting restores whatever the
+ * platform's default was. `<Menu>` renders nothing.
+ *
+ * ## Roles
+ *
+ * An item with a `role` is one the platform implements itself, and it needs no
+ * `onClick` and no label -- it gets the platform's own word and the platform's
+ * own shortcut. The names are Electron's: about, quit, undo, redo, cut, copy,
+ * paste, delete, selectAll, minimize, zoom, close, togglefullscreen.
+ *
+ * Roles are not a convenience. On macOS AppKit routes every key equivalent
+ * through the main menu before anything else sees it, so `role="copy"` is what
+ * makes Cmd-C reach a text field at all -- and an app that never renders a
+ * <Menu> gets an Edit menu anyway, for exactly that reason.
+ *
+ * ## Where there is no menu bar
+ *
+ * `Menu.isSupported` is false on Linux, and that is not a gap waiting to be
+ * filled: GNOME's guidelines have said to use a header bar with a menu button
+ * since GNOME 3, and GTK4 removed the menu bar widget. An app that cares can
+ * ask and put its commands in its own header with <TitleBar>. An app that does
+ * not is no worse off -- the description is simply not shown.
+ *
+ * @format
+ */
+import * as React from 'react';
+/** One of the role names in `native/core/MenuModel.h`. */
+export type MenuRole = string;
+export type MenuItemProps = {
+    label?: string;
+    /** Handled by the platform, and never reported back. See the header. */
+    role?: MenuRole;
+    /** "CmdOrCtrl+O", in Electron's spelling. Ignored for a role. */
+    accelerator?: string;
+    enabled?: boolean;
+    onClick?: () => void;
+};
+export type MenuSubmenuProps = {
+    label?: string;
+    enabled?: boolean;
+    children?: React.ReactNode;
+};
+/** Whether this platform shows an application menu at all. See the header. */
+export declare const isSupported: boolean;
+export type MenuProps = {
+    children?: React.ReactNode;
+};
+export declare function Menu({ children }: MenuProps): null;
+export declare namespace Menu {
+    var Item: (_props: MenuItemProps) => null;
+    var Separator: () => null;
+    var Submenu: (_props: MenuSubmenuProps) => null;
+    var isSupported: boolean;
+}
+//# sourceMappingURL=Menu.d.ts.map

package/dist/src/Menu.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Menu.d.ts","sourceRoot":"","sources":["../../src/Menu.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAyCG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,0DAA0D;AAC1D,MAAM,MAAM,QAAQ,GAAG,MAAM,CAAC;AAE9B,MAAM,MAAM,aAAa,GAAG;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,wEAAwE;IACxE,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,iEAAiE;IACjE,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B,CAAC;AA6BF,8EAA8E;AAC9E,eAAO,MAAM,WAAW,SAAuC,CAAC;AAoEhE,MAAM,MAAM,SAAS,GAAG;IAAC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAAC,CAAC;AAErD,wBAAgB,IAAI,CAAC,EAAC,QAAQ,EAAC,EAAE,SAAS,GAAG,IAAI,CAgChD;yBAhCe,IAAI;uBAZE,aAAa,KAAG,IAAI;yBAGpB,IAAI;0BAGD,gBAAgB,KAAG,IAAI"}

package/dist/src/Menu.js

@@ -0,0 +1,179 @@
+"use strict";
+/**
+ * The application menu.
+ *
+ *   <Menu>
+ *     <Menu.Submenu label="File">
+ *       <Menu.Item label="Open…" accelerator="CmdOrCtrl+O" onClick={open} />
+ *       <Menu.Separator />
+ *       <Menu.Item role="close" />
+ *     </Menu.Submenu>
+ *     <Menu.Submenu label="Edit">
+ *       <Menu.Item role="undo" />
+ *       <Menu.Item role="copy" />
+ *       <Menu.Item role="paste" />
+ *     </Menu.Submenu>
+ *   </Menu>
+ *
+ * Declarative because a menu bar is state, not a command: it is on screen for
+ * as long as the component is mounted, and unmounting restores whatever the
+ * platform's default was. `<Menu>` renders nothing.
+ *
+ * ## Roles
+ *
+ * An item with a `role` is one the platform implements itself, and it needs no
+ * `onClick` and no label -- it gets the platform's own word and the platform's
+ * own shortcut. The names are Electron's: about, quit, undo, redo, cut, copy,
+ * paste, delete, selectAll, minimize, zoom, close, togglefullscreen.
+ *
+ * Roles are not a convenience. On macOS AppKit routes every key equivalent
+ * through the main menu before anything else sees it, so `role="copy"` is what
+ * makes Cmd-C reach a text field at all -- and an app that never renders a
+ * <Menu> gets an Edit menu anyway, for exactly that reason.
+ *
+ * ## Where there is no menu bar
+ *
+ * `Menu.isSupported` is false on Linux, and that is not a gap waiting to be
+ * filled: GNOME's guidelines have said to use a header bar with a menu button
+ * since GNOME 3, and GTK4 removed the menu bar widget. An app that cares can
+ * ask and put its commands in its own header with <TitleBar>. An app that does
+ * not is no worse off -- the description is simply not shown.
+ *
+ * @format
+ */
+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.isSupported = void 0;
+exports.Menu = Menu;
+const React = __importStar(require("react"));
+const react_native_1 = require("react-native");
+const NativeMenu = react_native_1.TurboModuleRegistry.get('BasaltMenu');
+// Must match kMenuChosenEvent in native/core/MenuModule.h.
+const CHOSEN_EVENT = 'basaltMenuItemChosen';
+/** Whether this platform shows an application menu at all. See the header. */
+exports.isSupported = NativeMenu?.isSupported?.() === true;
+// Every `onClick` in the tree, by the id the native side reports back. Ids are
+// assigned here rather than by the app: an app numbering its own items would be
+// an app with two items numbered 3.
+let nextId = 1;
+function describe(children, handlers) {
+    const items = [];
+    React.Children.forEach(children, rawChild => {
+        if (rawChild == null || typeof rawChild !== 'object') {
+            return;
+        }
+        // `React.Children.forEach` types its argument as ReactNode; everything
+        // below only makes sense for an element, and anything else is skipped by
+        // the type checks that follow.
+        const child = rawChild;
+        const { kind, label, role, accelerator, enabled, onClick } = child.props ?? {};
+        if (child.type === Separator) {
+            items.push({ separator: true });
+            return;
+        }
+        if (child.type === Submenu) {
+            items.push({
+                label: label ?? '',
+                enabled: enabled !== false,
+                submenu: describe(child.props.children, handlers),
+            });
+            return;
+        }
+        if (child.type !== Item) {
+            // Anything else in a <Menu> is a mistake rather than a thing to render:
+            // there is nowhere for it to go.
+            return;
+        }
+        const item = {
+            label: label ?? '',
+            role: role ?? '',
+            accelerator: accelerator ?? '',
+            enabled: enabled !== false,
+            id: 0,
+        };
+        // A role is handled by the platform and never comes back, so it needs no
+        // id and no handler. See the header.
+        if (!role && typeof onClick === 'function') {
+            item.id = nextId++;
+            handlers.set(item.id, onClick);
+        }
+        items.push(item);
+        void kind;
+    });
+    return items;
+}
+function Item(_props) {
+    return null;
+}
+function Separator() {
+    return null;
+}
+function Submenu(_props) {
+    return null;
+}
+function Menu({ children }) {
+    const handlers = React.useRef(new Map());
+    // Described during render rather than in the effect, so that the effect's
+    // dependency is the menu itself: a menu whose labels did not change should
+    // not be reinstalled, and reinstalling one closes it if it happens to be open.
+    const items = React.useMemo(() => {
+        handlers.current = new Map();
+        return describe(children, handlers.current);
+    }, [children]);
+    const serialised = React.useMemo(() => JSON.stringify(items), [items]);
+    React.useEffect(() => {
+        NativeMenu?.setApplicationMenu?.(JSON.parse(serialised));
+        return () => {
+            // Back to the platform's default, which on macOS is the minimum an
+            // application needs to be usable -- an Edit menu included.
+            NativeMenu?.setApplicationMenu?.([]);
+        };
+    }, [serialised]);
+    React.useEffect(() => {
+        const subscription = react_native_1.DeviceEventEmitter.addListener(CHOSEN_EVENT, (id) => {
+            const onClick = handlers.current.get(id);
+            if (onClick != null) {
+                onClick();
+            }
+        });
+        return () => subscription.remove();
+    }, []);
+    return null;
+}
+Menu.Item = Item;
+Menu.Separator = Separator;
+Menu.Submenu = Submenu;
+Menu.isSupported = exports.isSupported;
+//# sourceMappingURL=Menu.js.map

package/dist/src/Menu.js.map

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

package/dist/src/TitleBar.d.ts

@@ -0,0 +1,75 @@
+/**
+ * The window's title bar: its title, its colours, and whether the host draws
+ * it or the app does.
+ *
+ *   useTitleBar({title, backgroundColor, textColor, borderColor, style})
+ *   <TitleBar title="Inbox" backgroundColor="#1f1f1f" textColor="#fff" />
+ *
+ * `style: 'native'` (the default) keeps the system's title bar and colours it.
+ * `style: 'hidden'` removes it: the app's own content reaches the top of the
+ * window, the host still draws the minimise, maximise and close buttons over
+ * the top right corner, and the app says which parts of its header drag the
+ * window:
+ *
+ *   Window.minimize(); Window.toggleMaximize(); Window.close();
+ *
+ *   const {height, buttonsWidth} = useTitleBarMetrics();
+ *   <TitleBar.DragRegion style={{height, paddingRight: buttonsWidth}}>
+ *     <Text>Inbox</Text>
+ *     <TitleBar.NoDragRegion><Button title="Compose" /></TitleBar.NoDragRegion>
+ *   </TitleBar.DragRegion>
+ *
+ * Requests stack like <StatusBar>'s: the most recently mounted wins, key by key,
+ * and unmounting one restores what was beneath it. See titleBarState.ts.
+ *
+ * All three hosts have a title bar module. The calls are guarded regardless:
+ * on a host without one -- or before it has registered -- every call is
+ * ignored and the metrics are all zero, so the same code runs everywhere.
+ *
+ * `<TitleBar.DragRegion>` is where the three are not yet equal. Windows and
+ * GTK read the marks and drag the window from them; macOS does not read them
+ * yet, so a header an app drew there shows correctly but does not move the
+ * window. See core/TitleBarRegions.h for the marks and the rule.
+ *
+ * @format
+ */
+import * as React from 'react';
+import type { ViewProps } from 'react-native';
+import type { TitleBarOptions, TitleBarStyle } from './titleBarState';
+export type { TitleBarOptions, TitleBarStyle } from './titleBarState';
+/** How much of the window a hidden title bar's caption takes, in layout units. */
+export type TitleBarMetrics = {
+    height: number;
+    buttonsWidth: number;
+    style: TitleBarStyle;
+};
+export declare function useTitleBar(options?: TitleBarOptions | null): void;
+export declare function TitleBar(props: TitleBarOptions): null;
+export declare namespace TitleBar {
+    var DragRegion: (props: ViewProps) => React.ReactElement;
+    var NoDragRegion: (props: ViewProps) => React.ReactElement;
+}
+/**
+ * What the caption buttons do, for an app drawing its own header.
+ *
+ * The system's buttons need none of this -- they are the system's -- but a
+ * header the app drew has no way to act on itself otherwise, which makes the
+ * hidden style a picture of a title bar rather than one.
+ *
+ * Every call is ignored on a host with no window module, like the rest of this
+ * file, so the same code runs everywhere.
+ */
+export declare const Window: {
+    minimize(): void;
+    toggleMaximize(): void;
+    close(): void;
+    /**
+     * Starts dragging the window, to be called from a press on an app-drawn
+     * caption. A no-op where the host moves windows some other way: GTK does it
+     * through a widget rather than a call, so the drag regions handle it and
+     * this has nothing to begin.
+     */
+    startDrag(): void;
+};
+export declare function useTitleBarMetrics(): TitleBarMetrics;
+//# sourceMappingURL=TitleBar.d.ts.map

package/dist/src/TitleBar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TitleBar.d.ts","sourceRoot":"","sources":["../../src/TitleBar.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkCG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAc,SAAS,EAAC,MAAM,cAAc,CAAC;AAIzD,OAAO,KAAK,EAAgB,eAAe,EAAmB,aAAa,EAAC,MAAM,iBAAiB,CAAC;AAEpG,YAAY,EAAC,eAAe,EAAE,aAAa,EAAC,MAAM,iBAAiB,CAAC;AAwBpE,kFAAkF;AAClF,MAAM,MAAM,eAAe,GAAG;IAC5B,MAAM,EAAE,MAAM,CAAC;IACf,YAAY,EAAE,MAAM,CAAC;IACrB,KAAK,EAAE,aAAa,CAAC;CACtB,CAAC;AA+EF,wBAAgB,WAAW,CAAC,OAAO,CAAC,EAAE,eAAe,GAAG,IAAI,GAAG,IAAI,CA2BlE;AAED,wBAAgB,QAAQ,CAAC,KAAK,EAAE,eAAe,GAAG,IAAI,CAGrD;yBAHe,QAAQ;4BAKG,SAAS,KAAG,KAAK,CAAC,YAAY;8BAI5B,SAAS,KAAG,KAAK,CAAC,YAAY;;AAkB3D;;;;;;;;;GASG;AACH,eAAO,MAAM,MAAM;;;;IAUjB;;;;;OAKG;;CAIJ,CAAC;AAMF,wBAAgB,kBAAkB,IAAI,eAAe,CAiBpD"}

package/dist/src/TitleBar.js

@@ -0,0 +1,236 @@
+"use strict";
+/**
+ * The window's title bar: its title, its colours, and whether the host draws
+ * it or the app does.
+ *
+ *   useTitleBar({title, backgroundColor, textColor, borderColor, style})
+ *   <TitleBar title="Inbox" backgroundColor="#1f1f1f" textColor="#fff" />
+ *
+ * `style: 'native'` (the default) keeps the system's title bar and colours it.
+ * `style: 'hidden'` removes it: the app's own content reaches the top of the
+ * window, the host still draws the minimise, maximise and close buttons over
+ * the top right corner, and the app says which parts of its header drag the
+ * window:
+ *
+ *   Window.minimize(); Window.toggleMaximize(); Window.close();
+ *
+ *   const {height, buttonsWidth} = useTitleBarMetrics();
+ *   <TitleBar.DragRegion style={{height, paddingRight: buttonsWidth}}>
+ *     <Text>Inbox</Text>
+ *     <TitleBar.NoDragRegion><Button title="Compose" /></TitleBar.NoDragRegion>
+ *   </TitleBar.DragRegion>
+ *
+ * Requests stack like <StatusBar>'s: the most recently mounted wins, key by key,
+ * and unmounting one restores what was beneath it. See titleBarState.ts.
+ *
+ * All three hosts have a title bar module. The calls are guarded regardless:
+ * on a host without one -- or before it has registered -- every call is
+ * ignored and the metrics are all zero, so the same code runs everywhere.
+ *
+ * `<TitleBar.DragRegion>` is where the three are not yet equal. Windows and
+ * GTK read the marks and drag the window from them; macOS does not read them
+ * yet, so a header an app drew there shows correctly but does not move the
+ * window. See core/TitleBarRegions.h for the marks and the rule.
+ *
+ * @format
+ */
+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.Window = void 0;
+exports.useTitleBar = useTitleBar;
+exports.TitleBar = TitleBar;
+exports.useTitleBarMetrics = useTitleBarMetrics;
+const React = __importStar(require("react"));
+const react_native_1 = require("react-native");
+const titleBarState_1 = require("./titleBarState");
+const NativeWindow = react_native_1.TurboModuleRegistry.get('BasaltWindow');
+const METRICS_EVENT = 'basaltTitleBarMetricsChanged';
+// Must match kTitleBarDragRegionId and kTitleBarNoDragRegionId in
+// core/TitleBarRegions.h, which is where the hosts read them from -- Win32
+// through Win32TitleBarLayout.h and GTK through GtkTitleBarLayout.h. They were
+// spelled in the Windows host alone when Windows was the only reader; that
+// header now takes its values from core rather than repeating them, so these
+// two literals are the only other copy.
+const DRAG_REGION_ID = 'basalt-titlebar-drag';
+const NO_DRAG_REGION_ID = 'basalt-titlebar-no-drag';
+const NO_METRICS = Object.freeze({
+    height: 0,
+    buttonsWidth: 0,
+    style: 'native',
+});
+const stack = (0, titleBarState_1.createTitleBarStack)();
+let applied = null;
+// processColor turns any React Native colour into the 0xAARRGGBB number the
+// host reads. Null, and anything it cannot process, asks for the system's
+// colour back.
+function colorFor(value) {
+    if (value == null) {
+        return null;
+    }
+    const processed = (0, react_native_1.processColor)(value);
+    return typeof processed === 'number' ? processed : null;
+}
+function normalizeMetrics(value) {
+    if (value == null) {
+        return NO_METRICS;
+    }
+    return {
+        height: value.height ?? 0,
+        buttonsWidth: value.buttonsWidth ?? 0,
+        style: value.style === 'hidden' ? 'hidden' : 'native',
+    };
+}
+function applyStack() {
+    if (NativeWindow == null) {
+        return;
+    }
+    const request = stack.resolve();
+    if (applied != null && (0, titleBarState_1.sameRequest)(request, applied)) {
+        return;
+    }
+    const previous = applied ?? {};
+    const first = applied == null;
+    applied = request;
+    if (first || request.title !== previous.title) {
+        // Null restores the window's default title, which is the app's name.
+        NativeWindow.setTitle(request.title == null ? null : String(request.title));
+    }
+    if (first ||
+        request.backgroundColor !== previous.backgroundColor ||
+        request.textColor !== previous.textColor ||
+        request.borderColor !== previous.borderColor) {
+        NativeWindow.setTitleBarColors(colorFor(request.backgroundColor), colorFor(request.textColor), colorFor(request.borderColor));
+    }
+    if (first || request.style !== previous.style) {
+        NativeWindow.setTitleBarStyle(request.style === 'hidden' ? 'hidden' : 'native');
+    }
+}
+function useTitleBar(options) {
+    const { title, style, backgroundColor, textColor, borderColor } = options ?? {};
+    const idRef = React.useRef(null);
+    // Mount and unmount. Layout effects, so a hidden title bar is in place before
+    // the first frame is painted rather than one frame after it.
+    React.useLayoutEffect(() => {
+        const id = stack.push({ title, style, backgroundColor, textColor, borderColor });
+        idRef.current = id;
+        applyStack();
+        return () => {
+            stack.remove(id);
+            idRef.current = null;
+            applyStack();
+        };
+        // Changes arrive through the effect below; this one only enters and leaves
+        // the stack.
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, []);
+    React.useLayoutEffect(() => {
+        if (idRef.current == null) {
+            return;
+        }
+        stack.update(idRef.current, { title, style, backgroundColor, textColor, borderColor });
+        applyStack();
+    }, [title, style, backgroundColor, textColor, borderColor]);
+}
+function TitleBar(props) {
+    useTitleBar(props);
+    return null;
+}
+function DragRegion(props) {
+    return React.createElement(react_native_1.View, { ...props, nativeID: DRAG_REGION_ID });
+}
+function NoDragRegion(props) {
+    return React.createElement(react_native_1.View, { ...props, nativeID: NO_DRAG_REGION_ID });
+}
+TitleBar.DragRegion = DragRegion;
+TitleBar.NoDragRegion = NoDragRegion;
+function readMetrics() {
+    if (NativeWindow == null) {
+        return NO_METRICS;
+    }
+    try {
+        return normalizeMetrics(NativeWindow.getTitleBarMetrics());
+    }
+    catch {
+        return NO_METRICS;
+    }
+}
+/**
+ * What the caption buttons do, for an app drawing its own header.
+ *
+ * The system's buttons need none of this -- they are the system's -- but a
+ * header the app drew has no way to act on itself otherwise, which makes the
+ * hidden style a picture of a title bar rather than one.
+ *
+ * Every call is ignored on a host with no window module, like the rest of this
+ * file, so the same code runs everywhere.
+ */
+exports.Window = {
+    minimize() {
+        NativeWindow?.minimize();
+    },
+    toggleMaximize() {
+        NativeWindow?.toggleMaximize();
+    },
+    close() {
+        NativeWindow?.close();
+    },
+    /**
+     * Starts dragging the window, to be called from a press on an app-drawn
+     * caption. A no-op where the host moves windows some other way: GTK does it
+     * through a widget rather than a call, so the drag regions handle it and
+     * this has nothing to begin.
+     */
+    startDrag() {
+        NativeWindow?.startWindowDrag();
+    },
+};
+// How much of the window a hidden title bar's caption takes: its height, and
+// the width of the buttons in the top right corner, both in layout units. All
+// zero while the title bar is native. Updates when the style changes, the
+// window moves to a display with a different DPI, or it is maximised.
+function useTitleBarMetrics() {
+    const [metrics, setMetrics] = React.useState(readMetrics);
+    React.useEffect(() => {
+        if (NativeWindow == null) {
+            return undefined;
+        }
+        const subscription = react_native_1.DeviceEventEmitter.addListener(METRICS_EVENT, (next) => setMetrics(normalizeMetrics(next)));
+        // Anything that changed between the first render and subscribing.
+        setMetrics(readMetrics());
+        return () => subscription.remove();
+    }, []);
+    return metrics;
+}
+//# sourceMappingURL=TitleBar.js.map

package/dist/src/TitleBar.js.map

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

package/dist/src/Window.d.ts

@@ -0,0 +1,87 @@
+/**
+ * A second window.
+ *
+ *   <Window title="Preview" width={600} height={400} onClose={hide}>
+ *     <Preview id={id} />
+ *   </Window>
+ *
+ * Mount it and a window opens; unmount it and the window closes. React Native
+ * has no API for this because a phone has one window and it is the screen.
+ *
+ * ## A window is a React root
+ *
+ * That is Fabric's grain rather than a decision this makes: a surface is what
+ * has a size, a layout context and a root shadow node, and two windows sharing
+ * one would be two windows sharing a layout. So a second window runs a second
+ * React tree, and `<Window>`'s children are rendered *there* rather than where
+ * they were written.
+ *
+ * Which has a consequence worth stating plainly, because it is the one thing
+ * that will surprise people: **the children do not see React context from the
+ * tree they were written in.** A theme provider, a navigation container or a
+ * Redux store wrapping the `<Window>` is not wrapping its children. What does
+ * cross is props -- the elements themselves are passed through, so anything
+ * captured in a closure or given as a prop arrives intact, including state and
+ * callbacks:
+ *
+ *   const [count, setCount] = useState(0);
+ *   <Window><Text onPress={() => setCount(count + 1)}>{count}</Text></Window>
+ *
+ * works, and re-renders the window when `count` changes. A `useContext` inside
+ * `<Preview>` does not. An app that needs context in a window should pass the
+ * value as a prop and re-provide it inside.
+ *
+ * ## `onClose`
+ *
+ * Called when the *person* closed the window -- its own close button, or the
+ * window manager -- and not when the app unmounted the `<Window>`. An app that
+ * unmounted it already knows.
+ *
+ * It is the half that keeps the two sides agreeing: without it an app's `open`
+ * flag would stay true after the window had gone, the next render would try to
+ * close a window that closed itself, and the window could never be reopened.
+ *
+ * ## `onCloseRequest`
+ *
+ *   <Window onCloseRequest={close => (dirty ? ask() : close())}>
+ *
+ * The other half of `onClose`, and the earlier one: somebody is *trying* to
+ * close the window and it has not closed. A `<Window>` with this prop refuses
+ * every close the window manager asks for and reports the attempt instead, so
+ * the app can ask "are you sure".
+ *
+ * There are two ways to then say yes, and they are not the same one written
+ * twice. Unmounting the `<Window>` is the React-shaped one and usually right --
+ * the window is a render of some state, and agreeing to close it is that state
+ * changing. The `close` the handler is handed is the other, for when the app
+ * has no such state to change, and it closes the window without `onClose`,
+ * because an app that just said yes is not waiting to be told.
+ *
+ * `onClose` is unaffected by any of this: it still means the person closed the
+ * window, which now only happens when there is no handler to refuse it.
+ *
+ * `useWindow()` inside a second window's tree still reports the *active*
+ * window, not the one it is in; that is a real gap and is in docs/BACKLOG.md.
+ *
+ * @format
+ */
+import * as React from 'react';
+import type { CloseRequestHandler } from './closeRequest';
+/** How a second window opens. Changing these afterwards is `useWindow()`'s job. */
+export type WindowProps = {
+    title?: string;
+    width?: number;
+    height?: number;
+    children?: React.ReactNode;
+    /** The person closed it. The window is already gone when this arrives. */
+    onClose?: () => void;
+    /** Be asked first. See closeRequest.ts. */
+    onCloseRequest?: CloseRequestHandler | null;
+};
+/** Whether this platform can open a second window at all. */
+export declare const isSupported: boolean;
+export declare function Window({ title, width, height, children, onClose, onCloseRequest, }: WindowProps): null;
+export declare namespace Window {
+    var isSupported: boolean;
+}
+//# sourceMappingURL=Window.d.ts.map