@octane-xplat/ui 0.5.0 → 0.7.0

package/dist/web/WebView.web.tsrx.js

@@ -0,0 +1,272 @@
+import { applyEscapeProps } from "./escape-props.web.js";
+import { layoutChildProps } from "./layout-child.web.js";
+import { __s, bag16, clone, hookSlots, snapshotSpread, template, useEffect, useRef } from "octane";
+import { bindSignalChild, bindSignalHostPropSources, compilerMemoRegion, enableSignalBindings, hookMemoCreate, hookMemoPublishInvariant } from "octane/internal/client";
+//#region src/WebView.web.tsrx
+enableSignalBindings(1, true);
+var _t$0 = /* @__PURE__ */ template("<iframe></iframe>");
+var _hs$ = /* @__PURE__ */ hookSlots(2);
+var _rm$1 = [
+	"s",
+	"n",
+	"m"
+];
+var DEFAULT_SANDBOX = "allow-scripts allow-same-origin allow-forms allow-modals";
+var WebView = /* @__PURE__ */ __s(function WebView(props, __s, __extra) {
+	const __memoRegion = compilerMemoRegion(__s, _hs$ + 0);
+	let __hk = __memoRegion.hooks;
+	if (__hk === void 0) __memoRegion.hooks = __hk = hookMemoCreate(1);
+	const frame = useRef(null, _hs$ + 0);
+	const handle = __hk[0] ?? hookMemoPublishInvariant(__hk, 0, (el) => ({
+		reload: () => {
+			try {
+				el.contentWindow.location.reload();
+			} catch {
+				if (el.src) el.src = el.src;
+			}
+		},
+		goBack: () => el.contentWindow?.history.back(),
+		goForward: () => el.contentWindow?.history.forward(),
+		stopLoading: () => {
+			try {
+				el.contentWindow?.stop();
+			} catch {}
+		},
+		native: el
+	}));
+	useEffect(() => {
+		const el = frame.current;
+		if (!el) return;
+		let observer;
+		let observedDocument;
+		const measure = () => {
+			try {
+				const doc = el.contentDocument;
+				const body = doc?.body;
+				const root = doc?.documentElement;
+				if (!doc || !body || !root) return;
+				const size = {
+					width: Math.max(body.scrollWidth, root.scrollWidth),
+					height: Math.max(body.scrollHeight, root.scrollHeight)
+				};
+				if (size.width <= 0 || size.height <= 0) return;
+				if (props.matchContents) el.style.height = `${size.height}px`;
+				props.onLayoutContent?.(size);
+				if (observedDocument !== doc && typeof ResizeObserver !== "undefined") {
+					observer?.disconnect();
+					observer = new ResizeObserver(measure);
+					observer.observe(body);
+					observer.observe(root);
+					observedDocument = doc;
+				}
+			} catch {}
+		};
+		el.addEventListener("load", measure);
+		measure();
+		return () => {
+			el.removeEventListener("load", measure);
+			observer?.disconnect();
+		};
+	}, [props.matchContents, props.onLayoutContent], _hs$ + 1);
+	let _b = __s.slots[0];
+	if (_b === void 0) {
+		let _m0, _m1, _m2, _m3, _m4, _m5, _m6, _m7, _m8, _m9, _m10, _m11, _m12, _m13;
+		const _root = clone(_t$0);
+		_m0 = (el) => {
+			if (!el) return;
+			frame.current = el;
+			applyEscapeProps(el, props);
+			props.bind?.(handle(el));
+		};
+		_m1 = props.id;
+		_m2 = ["vx-webview", props.className];
+		_m3 = snapshotSpread(layoutChildProps(props));
+		_m4 = props.html;
+		_m5 = props.html === void 0 ? props.src : void 0;
+		_m6 = props.sandbox === false ? void 0 : props.sandbox ?? DEFAULT_SANDBOX;
+		_m7 = props.scrollEnabled === false ? "no" : void 0;
+		_m8 = props.accessibilityLabel;
+		_m9 = props.accessible === false ? true : void 0;
+		_m10 = (e) => props.onLoad?.({ url: props.html === void 0 ? e.currentTarget?.src : void 0 });
+		_m11 = (e) => props.onError?.({
+			url: props.html === void 0 ? e.currentTarget?.src : void 0,
+			error: "iframe failed to load"
+		});
+		_m12 = _root;
+		_m13 = bindSignalHostPropSources(__s, void 0, _root, [
+			[
+				false,
+				"ref",
+				_m0
+			],
+			[
+				false,
+				"id",
+				_m1
+			],
+			[
+				false,
+				"className",
+				_m2
+			],
+			[true, _m3],
+			[
+				false,
+				"srcDoc",
+				_m4
+			],
+			[
+				false,
+				"src",
+				_m5
+			],
+			[
+				false,
+				"sandbox",
+				_m6
+			],
+			[
+				false,
+				"scrolling",
+				_m7
+			],
+			[
+				false,
+				"title",
+				_m8
+			],
+			[
+				false,
+				"aria-hidden",
+				_m9
+			],
+			[
+				false,
+				"onLoad",
+				_m10
+			],
+			[
+				false,
+				"onError",
+				_m11
+			]
+		], "b:5cdc9608", false);
+		_b = bag16(__s, _root, _m0, _m1, _m2, _m3, _m4, _m5, _m6, _m7, _m8, _m9, _m10, _m11, _m12, _m13, null, void 0);
+		__s.refFields = _rm$1;
+	} else {
+		{
+			const _v = (el) => {
+				if (!el) return;
+				frame.current = el;
+				applyEscapeProps(el, props);
+				props.bind?.(handle(el));
+			};
+			if (_b.a !== _v) _b.a = _v;
+		}
+		{
+			const _v = props.id;
+			if (_b.b !== _v) _b.b = _v;
+		}
+		{
+			const _v = ["vx-webview", props.className];
+			if (_b.c !== _v) _b.c = _v;
+		}
+		_b.d = snapshotSpread(layoutChildProps(props));
+		{
+			const _v = props.html;
+			if (_b.e !== _v) _b.e = _v;
+		}
+		{
+			const _v = props.html === void 0 ? props.src : void 0;
+			if (_b.f !== _v) _b.f = _v;
+		}
+		{
+			const _v = props.sandbox === false ? void 0 : props.sandbox ?? DEFAULT_SANDBOX;
+			if (_b.g !== _v) _b.g = _v;
+		}
+		{
+			const _v = props.scrollEnabled === false ? "no" : void 0;
+			if (_b.h !== _v) _b.h = _v;
+		}
+		{
+			const _v = props.accessibilityLabel;
+			if (_b.i !== _v) _b.i = _v;
+		}
+		{
+			const _v = props.accessible === false ? true : void 0;
+			if (_b.j !== _v) _b.j = _v;
+		}
+		{
+			const _v = (e) => props.onLoad?.({ url: props.html === void 0 ? e.currentTarget?.src : void 0 });
+			if (_b.k !== _v) _b.k = _v;
+		}
+		{
+			const _v = (e) => props.onError?.({
+				url: props.html === void 0 ? e.currentTarget?.src : void 0,
+				error: "iframe failed to load"
+			});
+			if (_b.l !== _v) _b.l = _v;
+		}
+		_b.n = bindSignalHostPropSources(__s, _b.n, _b.m, [
+			[
+				false,
+				"ref",
+				_b.a
+			],
+			[
+				false,
+				"id",
+				_b.b
+			],
+			[
+				false,
+				"className",
+				_b.c
+			],
+			[true, _b.d],
+			[
+				false,
+				"srcDoc",
+				_b.e
+			],
+			[
+				false,
+				"src",
+				_b.f
+			],
+			[
+				false,
+				"sandbox",
+				_b.g
+			],
+			[
+				false,
+				"scrolling",
+				_b.h
+			],
+			[
+				false,
+				"title",
+				_b.i
+			],
+			[
+				false,
+				"aria-hidden",
+				_b.j
+			],
+			[
+				false,
+				"onLoad",
+				_b.k
+			],
+			[
+				false,
+				"onError",
+				_b.l
+			]
+		], "b:5cdc9608", false);
+	}
+	_b.q = bindSignalChild(__s, _b.q, 1, _b.m, Object.prototype.propertyIsEnumerable.call(_b.n.resolved, "children") ? _b.n.resolved.children : void 0, "b:5cdc9608", null, void 0, void 0, void 0, true);
+});
+//#endregion
+export { WebView };

package/dist/web/aliases.web.tsrx.js

@@ -0,0 +1,24 @@
+import { Select } from "./Select.web.tsrx.js";
+import { createScopedValue } from "octane";
+import { createElementFromConfig } from "octane/internal/client";
+//#region src/aliases.web.tsrx
+var SelectMenu = function SelectMenu(props, __s, __extra) {
+	return createScopedValue(() => createElementFromConfig("c:bda11851", Select, {
+		...props,
+		multiple: true
+	})) ?? null;
+};
+var Combobox = function Combobox(props, __s, __extra) {
+	return createScopedValue(() => createElementFromConfig("c:4a0931a9", Select, {
+		...props,
+		searchable: true
+	})) ?? null;
+};
+var InputMenu = function InputMenu(props, __s, __extra) {
+	return createScopedValue(() => createElementFromConfig("c:4bbd50ae", Select, {
+		...props,
+		searchable: true
+	})) ?? null;
+};
+//#endregion
+export { Combobox, InputMenu, SelectMenu };

package/dist/web/{ui36.js → anim.web.tsrx.js}

@@ -1,46 +1,14 @@
+import { writeTransformProp } from "./transform.web.js";
 import { hookSlots, useRef } from "octane";
 //#region src/anim.web.tsrx
 var _h$0 = /* @__PURE__ */ Symbol(/* @__PURE__ */ hookSlots(1));
-var transformProps = {
-	translateX: (v) => `translateX(${v}px)`,
-	translateY: (v) => `translateY(${v}px)`,
-	translateZ: (v) => `translateZ(${v}px)`,
-	scale: (v) => `scale(${v})`,
-	scaleX: (v) => `scaleX(${v})`,
-	scaleY: (v) => `scaleY(${v})`,
-	rotate: (v) => `rotate(${v}deg)`,
-	rotateX: (v) => `rotateX(${v}deg)`,
-	rotateY: (v) => `rotateY(${v}deg)`,
-	skewX: (v) => `skewX(${v}deg)`,
-	skewY: (v) => `skewY(${v}deg)`
-};
-var transformStates = /* @__PURE__ */ new WeakMap();
-function writeAnimatedValue(el, prop, value) {
-	if (Object.prototype.hasOwnProperty.call(transformProps, prop)) {
-		const transformProp = prop;
-		let state = transformStates.get(el);
-		if (!state) {
-			const computed = getComputedStyle(el).transform;
-			state = {
-				base: computed === "none" ? "" : computed,
-				values: /* @__PURE__ */ new Map()
-			};
-			transformStates.set(el, state);
-		}
-		state.values.set(transformProp, value);
-		const transforms = Object.entries(transformProps).filter(([name]) => state.values.has(name)).map(([name, toTransform]) => toTransform(state.values.get(name)));
-		el.style.transform = [state.base, ...transforms].filter(Boolean).join(" ");
-		return;
-	}
-	el.style[prop] = value;
-}
 function createAnimated(initial, prop) {
 	let el = null;
 	let current = initial;
 	let raf = 0;
 	const apply = (v) => {
 		current = v;
-		if (el) writeAnimatedValue(el, prop, v);
+		if (el) writeTransformProp(el, prop, v);
 	};
 	const run = (step) => {
 		cancelAnimationFrame(raf);
@@ -59,7 +27,7 @@ function createAnimated(initial, prop) {
 		},
 		bind(e) {
 			el = e;
-			if (el) writeAnimatedValue(el, prop, current);
+			if (el) writeTransformProp(el, prop, current);
 		},
 		to(target, opts) {
 			const dur = opts?.duration ?? 300;

package/dist/web/child-array.js

@@ -0,0 +1,15 @@
+//#region src/child-array.ts
+/** Normalize a JSX children value to a flat array — children may be a
+*  single node, an array, or nested arrays from `.map` calls. */
+function toChildArray(children) {
+	const out = [];
+	const walk = (node) => {
+		if (node == null || node === false) return;
+		if (Array.isArray(node)) for (const child of node) walk(child);
+		else out.push(node);
+	};
+	walk(children);
+	return out;
+}
+//#endregion
+export { toChildArray };

package/dist/web/icons.js

@@ -0,0 +1,25 @@
+//#region src/icons.ts
+/**
+* App-owned icon registry. `svg` is SVG path `d` data (not a full SVG
+* markup string). `src` can carry an image or an SVG source; the leaves only
+* infer SVG from inline markup, SVG data URIs, and `.svg` paths/URLs. Native
+* `font` glyphs render only when the app ships and registers that font.
+*/
+var icons = /* @__PURE__ */ new Map();
+function registerIcon(name, glyph) {
+	icons.set(name, glyph);
+}
+function registerIcons(record) {
+	for (const [name, glyph] of Object.entries(record)) icons.set(name, glyph);
+}
+function getIcon(name) {
+	return icons.get(name);
+}
+if (!icons.has("xplat-search")) icons.set("xplat-search", { svg: "M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z" });
+if (!icons.has("xplat-clear")) icons.set("xplat-clear", { svg: "M19 6.41 17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z" });
+if (!icons.has("xplat-play")) icons.set("xplat-play", { svg: "M8 5v14l11-7z" });
+if (!icons.has("xplat-pause")) icons.set("xplat-pause", { svg: "M6 19h4V5H6v14zm8-14v14h4V5h-4z" });
+if (!icons.has("xplat-volume")) icons.set("xplat-volume", { svg: "M3 9v6h4l5 5V4L7 9H3zm13.5 3c0-1.77-1.02-3.29-2.5-4.03v8.05c1.48-.73 2.5-2.25 2.5-4.02zM14 3.23v2.06c2.89.86 5 3.54 5 6.71s-2.11 5.85-5 6.71v2.06c4.01-.91 7-4.49 7-8.77s-2.99-7.86-7-8.77z" });
+if (!icons.has("xplat-volume-off")) icons.set("xplat-volume-off", { svg: "M16.5 12c0-1.77-1.02-3.29-2.5-4.03v2.21l2.45 2.45c.03-.2.05-.41.05-.63zm2.5 0c0 .94-.2 1.82-.54 2.64l1.51 1.51C20.63 14.91 21 13.5 21 12c0-4.28-2.99-7.86-7-8.77v2.06c2.89.86 5 3.54 5 6.71zM4.27 3L3 4.27 7.73 9H3v6h4l5 5v-6.73l4.25 4.25c-.67.52-1.42.93-2.25 1.18v2.06c1.45-.54 2.78-1.32 3.97-2.27L19.73 21 21 19.73l-9-9L4.27 3zM12 4L9.91 6.09 12 8.18V4z" });
+//#endregion
+export { getIcon, registerIcon, registerIcons };

package/dist/web/index.shared.web.js

@@ -0,0 +1,92 @@
+import { View } from "./View.web.tsrx.js";
+import { Row } from "./Row.web.tsrx.js";
+import { Grid } from "./Grid.web.tsrx.js";
+import { Stack } from "./Stack.web.tsrx.js";
+import { Absolute } from "./Absolute.web.tsrx.js";
+import { setTranslate } from "./translate.web.js";
+import { Spacer } from "./Spacer.web.tsrx.js";
+import { Text } from "./Text.web.tsrx.js";
+import { RichText, RichTextSpan } from "./RichText.web.tsrx.js";
+import { Pressable } from "./Pressable.web.tsrx.js";
+import { ActivityIndicator } from "./ActivityIndicator.web.tsrx.js";
+import { Button } from "./Button.web.tsrx.js";
+import { Collapsible } from "./Collapsible.web.tsrx.js";
+import { Accordion } from "./Accordion.web.tsrx.js";
+import { Checkbox } from "./Checkbox.web.tsrx.js";
+import { RadioGroup } from "./RadioGroup.web.tsrx.js";
+import { getColorScheme, useColorScheme } from "./theme/colorScheme.web.js";
+import { applyThemeClasses, getThemePreference, getThemeScheme, onThemeSchemeChange, setThemePreference, themeSchemeClasses, useThemeScheme } from "./theme/theme-scheme.js";
+import { Popover } from "./Popover.web.tsrx.js";
+import { registerIcon, registerIcons } from "./icons.js";
+import { Icon } from "./Icon.web.tsrx.js";
+import { DropdownMenu } from "./DropdownMenu.web.tsrx.js";
+import { ContextMenu } from "./ContextMenu.web.tsrx.js";
+import { Badge } from "./Badge.web.tsrx.js";
+import { Separator } from "./Separator.web.tsrx.js";
+import { Skeleton } from "./Skeleton.web.tsrx.js";
+import { Avatar } from "./Avatar.web.tsrx.js";
+import { AvatarGroup } from "./AvatarGroup.web.tsrx.js";
+import { FormField } from "./FormField.web.tsrx.js";
+import { FieldGroup } from "./FieldGroup.web.tsrx.js";
+import { ListItem } from "./ListItem.web.tsrx.js";
+import { TextInput } from "./TextInput.web.tsrx.js";
+import { InputNumber } from "./InputNumber.web.tsrx.js";
+import { PinInput } from "./PinInput.web.tsrx.js";
+import { Select } from "./Select.web.tsrx.js";
+import { Combobox, InputMenu, SelectMenu } from "./aliases.web.tsrx.js";
+import { InputTags } from "./InputTags.web.tsrx.js";
+import { InputRating } from "./InputRating.web.tsrx.js";
+import { CheckboxGroup } from "./CheckboxGroup.web.tsrx.js";
+import { Breadcrumb } from "./Breadcrumb.web.tsrx.js";
+import { Pagination } from "./Pagination.web.tsrx.js";
+import { Stepper } from "./Stepper.web.tsrx.js";
+import { NavigationMenu } from "./NavigationMenu.web.tsrx.js";
+import { Overlay } from "./Overlay.web.tsrx.js";
+import { CommandPalette } from "./CommandPalette.web.tsrx.js";
+import { Table } from "./Table.web.tsrx.js";
+import { Timeline } from "./Timeline.web.tsrx.js";
+import { Tree } from "./Tree.web.tsrx.js";
+import { Alert } from "./Alert.web.tsrx.js";
+import { Card } from "./Card.web.tsrx.js";
+import { Chip } from "./Chip.web.tsrx.js";
+import { Kbd } from "./Kbd.web.tsrx.js";
+import { Empty } from "./Empty.web.tsrx.js";
+import { Banner } from "./Banner.web.tsrx.js";
+import { User } from "./User.web.tsrx.js";
+import { Meter } from "./Meter.web.tsrx.js";
+import { ProgressGroup } from "./ProgressGroup.web.tsrx.js";
+import { Link } from "./Link.web.tsrx.js";
+import { defineRoutes, deriveRouteManifest, mergeRouteManifests } from "./route-table.js";
+import { addBackInterceptor, addRoutes, canGoBack, currentModalRoute, currentRoute, hrefFor, layoutsFor, popRoute, pushDeepLink, pushRoute, redirect, registerRoutes, registerScreens, routeFor, routeStacks, screenFor, useCanGoBack, useModalRoute, useRoute } from "./route.web.js";
+import { NavLink } from "./NavLink.web.tsrx.js";
+import { TextArea } from "./TextArea.web.tsrx.js";
+import { SearchInput } from "./SearchInput.web.tsrx.js";
+import { SegmentedControl } from "./SegmentedControl.web.tsrx.js";
+import { ScrollView } from "./ScrollView.web.tsrx.js";
+import { ScrollBox } from "./ScrollBox.web.tsrx.js";
+import { VirtualList } from "./VirtualList.web.tsrx.js";
+import { Image } from "./Image.web.tsrx.js";
+import { WebView } from "./WebView.web.tsrx.js";
+import { Hoverable } from "./Hoverable.web.tsrx.js";
+import { Tooltip } from "./Tooltip.web.tsrx.js";
+import { showToast } from "./toast-anchor.web.tsrx.js";
+import { useAnimation } from "./anim.web.tsrx.js";
+import { styled } from "./styled.web.tsrx.js";
+import { openWindow } from "./windows.web.js";
+import { Screen } from "./Screen.web.tsrx.js";
+import { Tabs } from "./Tabs.web.tsrx.js";
+import { Switch } from "./Switch.web.tsrx.js";
+import { useSafeAreaInsets } from "./safeAreaInsets.web.tsrx.js";
+import { SafeArea } from "./SafeArea.web.tsrx.js";
+import { Drawer } from "./Drawer.web.tsrx.js";
+import { useMeasure } from "./useMeasure.web.tsrx.js";
+import { Slider } from "./Slider.web.tsrx.js";
+import { Heading } from "./Heading.web.tsrx.js";
+import { isNative } from "./platform.web.js";
+import { getStack, registerStack, stackEntries } from "./stacks.web.js";
+import { useBackInterceptor } from "./use-back.web.tsrx.js";
+import { createStore } from "./store.js";
+import { useStore } from "./use-store.web.tsrx.js";
+import { Sheet } from "./Sheet.web.tsrx.js";
+import { closeSheet, openSheet } from "./sheet-service.web.js";
+export { Absolute, Accordion, ActivityIndicator, Alert, Avatar, AvatarGroup, Badge, Banner, Breadcrumb, Button, Card, Checkbox, CheckboxGroup, Chip, Collapsible, View as Column, Combobox, CommandPalette, ContextMenu, Drawer, DropdownMenu, Empty, FieldGroup, FormField, Grid, Heading, Hoverable, Icon, Image, InputMenu, InputNumber, InputRating, InputTags, Kbd, Link, ListItem, Meter, NavLink, NavigationMenu, Overlay, Pagination, PinInput, Popover, Pressable, ProgressGroup, RadioGroup, RichText, RichTextSpan, Row, SafeArea, Screen, ScrollBox, ScrollView, SearchInput, SegmentedControl, Select, SelectMenu, Separator, Sheet, Skeleton, Slider, Spacer, Stack, Stepper, Switch, Table, Tabs, Text, TextArea, TextInput, Timeline, Tooltip, Tree, User, View, VirtualList, WebView, addBackInterceptor, addRoutes, applyThemeClasses, canGoBack, closeSheet, createStore, currentModalRoute, currentRoute, defineRoutes, deriveRouteManifest, getColorScheme, getStack, getThemePreference, getThemeScheme, hrefFor, isNative, layoutsFor as layoutsForRoute, mergeRouteManifests, onThemeSchemeChange, openSheet, openWindow, popRoute, pushDeepLink, pushRoute, redirect, registerIcon, registerIcons, registerRoutes, registerScreens, registerStack, routeFor, routeStacks, screenFor, setThemePreference, setTranslate, showToast, stackEntries, styled, themeSchemeClasses, useAnimation, useBackInterceptor, useCanGoBack, useColorScheme, useMeasure, useModalRoute, useRoute, useSafeAreaInsets, useStore, useThemeScheme };

package/dist/web/octane-client-build.json

@@ -1,6 +1,6 @@
 {
   "version": 1,
-  "buildId": "bc136ba4-ca23-4dbc-99a2-c7175a4714db",
+  "buildId": "78256e80-6068-49f2-aacb-e3e38333d9ee",
   "mode": "production",
   "capabilities": {
     "independentHydration": false

package/dist/web/pan.web.tsrx.js

@@ -0,0 +1,66 @@
+import { hookSlots, useEffect } from "octane";
+//#region src/pan.web.tsrx
+var _h$0 = /* @__PURE__ */ Symbol(/* @__PURE__ */ hookSlots(1));
+function usePan(el, cb) {
+	useEffect(() => {
+		const node = el.current;
+		if (!node || !cb) return;
+		let sx = 0, sy = 0, active = false, last = 0, lx = 0, t0 = 0;
+		const emit = (e, state) => {
+			const now = performance.now();
+			const dt = Math.max(now - t0, 1) / 1e3;
+			const vx = (e.clientX - lx) / dt;
+			const vy = (e.clientY - last) / dt;
+			lx = e.clientX;
+			last = e.clientY;
+			t0 = now;
+			cb({
+				x: e.clientX - sx,
+				y: e.clientY - sy,
+				dx: e.clientX - sx,
+				dy: e.clientY - sy,
+				vx,
+				vy,
+				state,
+				target: node
+			});
+		};
+		const down = (e) => {
+			active = true;
+			sx = e.clientX;
+			sy = e.clientY;
+			t0 = performance.now();
+			lx = sx;
+			last = sy;
+			node.setPointerCapture?.(e.pointerId);
+			emit(e, "began");
+		};
+		const move = (e) => {
+			if (active) emit(e, "moved");
+		};
+		const up = (e) => {
+			if (active) {
+				active = false;
+				emit(e, "ended");
+			}
+		};
+		const cancel = (e) => {
+			if (active) {
+				active = false;
+				emit(e, "cancelled");
+			}
+		};
+		node.addEventListener("pointerdown", down);
+		node.addEventListener("pointermove", move);
+		node.addEventListener("pointerup", up);
+		node.addEventListener("pointercancel", cancel);
+		return () => {
+			node.removeEventListener("pointerdown", down);
+			node.removeEventListener("pointermove", move);
+			node.removeEventListener("pointerup", up);
+			node.removeEventListener("pointercancel", cancel);
+		};
+	}, [el, cb], _h$0);
+}
+//#endregion
+export { usePan };

package/dist/web/platform.web.js

@@ -0,0 +1,9 @@
+//#region src/platform.web.ts
+/** Compile-time platform flag — `false` in every web build. Prefer
+*  `.web`/unsuffixed native defaults leaves for real divergence; `isNative` covers the
+*  render-time cases (conditional JSX, prop selection) where a whole
+*  leaf file is heavier than the difference. Bundlers constant-fold it,
+*  so `!isNative` branches tree-shake out of web output. */
+var isNative = false;
+//#endregion
+export { isNative };

package/dist/web/refresh-metrics.js

@@ -0,0 +1,9 @@
+//#region src/refresh-metrics.ts
+/** Finger-travel → content displacement. iOS rubber-band applies ~0.5
+*  resistance at small pulls; web/Android drive the same ratio so the
+*  affordance reads identically across targets. */
+function dampenPull(dy) {
+	return dy * .5;
+}
+//#endregion
+export { dampenPull };