@lt-three/love3 0.0.0 → 0.1.0

package/dist/native/lib/external-store.d.ts

@@ -0,0 +1,17 @@
+//#region src/native/lib/external-store.d.ts
+/**
+ * 命令的な API（`confirm()`・`globalLoading()`）と、ルートに置く部品（`ConfirmDialog`・`LoadingLock`）の橋渡しをする、
+ * 小さな外部ストア。`@lt-three/core` は jotai の atom と共有のストアでこれをやっていたが、love3 は jotai に依存しない
+ * ので、React の `useSyncExternalStore` で読む。値は不変で扱う（`set` は新しい値を渡す）。
+ */
+export type ExternalStore<T> = {
+  get: () => T;
+  set: (next: T) => void;
+  /** 前の値から次の値を作る。 */
+  update: (updater: (prev: T) => T) => void;
+  subscribe: (listener: () => void) => () => void;
+  /** 部品から読む。値が変わると描き直す。 */
+  use: () => T;
+};
+export declare function createExternalStore<T>(initial: T): ExternalStore<T>;
+//#endregion

package/dist/native/lib/external-store.js

@@ -0,0 +1,30 @@
+import { useSyncExternalStore } from "react";
+
+//#region src/native/lib/external-store.ts
+function createExternalStore(initial) {
+	let state = initial;
+	const listeners = /* @__PURE__ */ new Set();
+	const get = () => state;
+	const subscribe = (listener) => {
+		listeners.add(listener);
+		return () => {
+			listeners.delete(listener);
+		};
+	};
+	const set = (next) => {
+		if (Object.is(next, state)) return;
+		state = next;
+		for (const listener of listeners) listener();
+	};
+	const update = (updater) => set(updater(state));
+	return {
+		get,
+		set,
+		update,
+		subscribe,
+		use: () => useSyncExternalStore(subscribe, get, get)
+	};
+}
+
+//#endregion
+export { createExternalStore };

package/dist/native/lib/keyboard.d.ts

@@ -0,0 +1,15 @@
+import { KeyDownEvent } from "react-native";
+//#region src/native/lib/keyboard.d.ts
+/**
+ * Space で `activate` を呼ぶ `onKeyDown`（`Pressable` に渡す）。
+ *
+ * react-native-web の `Pressable` は、Enter では押したことになるが、Space は **`<button>` か `role="button"` のときだけ**
+ * 押したことになる（`PressResponder` の `isValidKeyPress`）。`role="radio"` / `"checkbox"` / `"switch"` は Space で動かない。
+ * WAI-ARIA の APG は、この 3 つを Space で決定する（キーボードだけの人が選べない = WCAG 2.1.1）。
+ * **Enter は react-native-web が押したことにする**ので、ここでは Space だけを扱う（Enter まで扱うと二重に呼ばれる）。
+ *
+ * 実機の React Native は、`onKeyDown` を受けるキーを `keyDownEvents` で挙げたものだけにするので、何も渡さないこの使い方では
+ * 呼ばれない（実機の挙動は変わらない）。修飾キー（Ctrl・Alt・Meta・Shift）つきと、押しっぱなしの繰り返しは無視する。
+ */
+export declare function activateOnSpace(activate: () => void, disabled?: boolean | null): (event: KeyDownEvent) => void;
+//#endregion

package/dist/native/lib/keyboard.js

@@ -0,0 +1,24 @@
+//#region src/native/lib/keyboard.ts
+/**
+* Space で `activate` を呼ぶ `onKeyDown`（`Pressable` に渡す）。
+*
+* react-native-web の `Pressable` は、Enter では押したことになるが、Space は **`<button>` か `role="button"` のときだけ**
+* 押したことになる（`PressResponder` の `isValidKeyPress`）。`role="radio"` / `"checkbox"` / `"switch"` は Space で動かない。
+* WAI-ARIA の APG は、この 3 つを Space で決定する（キーボードだけの人が選べない = WCAG 2.1.1）。
+* **Enter は react-native-web が押したことにする**ので、ここでは Space だけを扱う（Enter まで扱うと二重に呼ばれる）。
+*
+* 実機の React Native は、`onKeyDown` を受けるキーを `keyDownEvents` で挙げたものだけにするので、何も渡さないこの使い方では
+* 呼ばれない（実機の挙動は変わらない）。修飾キー（Ctrl・Alt・Meta・Shift）つきと、押しっぱなしの繰り返しは無視する。
+*/
+function activateOnSpace(activate, disabled) {
+	return (event) => {
+		const { key, repeat, altKey, ctrlKey, metaKey, shiftKey } = event.nativeEvent;
+		if (key !== " " || repeat === true || altKey || ctrlKey || metaKey || shiftKey) return;
+		event.preventDefault();
+		if (disabled === true) return;
+		activate();
+	};
+}
+
+//#endregion
+export { activateOnSpace };

package/dist/native/lib/labels.d.ts

@@ -0,0 +1,15 @@
+//#region src/native/lib/labels.d.ts
+/** 読み込み中の表示（Spinner） */
+export declare const LOADING_LABEL = "読み込み中";
+/** 確認ダイアログ（`confirm()`）の既定のボタン。使う側は `yes` / `no` で上書きする */
+export declare const YES_LABEL = "はい";
+export declare const NO_LABEL = "いいえ";
+/** 数値欄（`form/text-input` の `type="number"`）の入力が数として読めないとき */
+export declare const NUMBER_INVALID_LABEL = "数値で入力してください";
+/** 閉じるボタン（Sheet・Modal・Snackbar）。使う側は `closeLabel` で上書きする */
+export declare const CLOSE_LABEL = "閉じる";
+/** `atom/select` の選択肢の見出し・名前が何も渡されなかったときの、最後の砦（無名のダイアログにしない） */
+export declare const SELECT_LABEL = "選択肢";
+/** `form/select` の placeholder の既定（web の `form/select` と同じ文言） */
+export declare const SELECT_PLACEHOLDER_LABEL = "選択してください";
+//#endregion

package/dist/native/lib/labels.js

@@ -0,0 +1,17 @@
+//#region src/native/lib/labels.ts
+/** 読み込み中の表示（Spinner） */
+const LOADING_LABEL = "読み込み中";
+/** 確認ダイアログ（`confirm()`）の既定のボタン。使う側は `yes` / `no` で上書きする */
+const YES_LABEL = "はい";
+const NO_LABEL = "いいえ";
+/** 数値欄（`form/text-input` の `type="number"`）の入力が数として読めないとき */
+const NUMBER_INVALID_LABEL = "数値で入力してください";
+/** 閉じるボタン（Sheet・Modal・Snackbar）。使う側は `closeLabel` で上書きする */
+const CLOSE_LABEL = "閉じる";
+/** `atom/select` の選択肢の見出し・名前が何も渡されなかったときの、最後の砦（無名のダイアログにしない） */
+const SELECT_LABEL = "選択肢";
+/** `form/select` の placeholder の既定（web の `form/select` と同じ文言） */
+const SELECT_PLACEHOLDER_LABEL = "選択してください";
+
+//#endregion
+export { CLOSE_LABEL, LOADING_LABEL, NO_LABEL, NUMBER_INVALID_LABEL, SELECT_LABEL, SELECT_PLACEHOLDER_LABEL, YES_LABEL };

package/dist/native/lib/loading.d.ts

@@ -0,0 +1,10 @@
+import { ExternalStore } from "./external-store.js";
+//#region src/native/lib/loading.d.ts
+/** `LoadingLock` が読む状態。命令的な API（`globalLoading()`）がここへ書く。 */
+export declare const loadingStore: ExternalStore<boolean>;
+/**
+ * アプリ全体の操作を塞ぐローディングを出す・消す。アプリのルートに `once/loading-lock` の `LoadingLock` を 1 つ置いておく。
+ * 真偽の 1 つだけを持つ（重ねて呼んでも数えない。最後に `false` を渡した時点で消える。移植元と同じ）。
+ */
+export declare function globalLoading(loading: boolean): void;
+//#endregion

package/dist/native/lib/loading.js

@@ -0,0 +1,15 @@
+import { createExternalStore } from "./external-store.js";
+
+//#region src/native/lib/loading.ts
+/** `LoadingLock` が読む状態。命令的な API（`globalLoading()`）がここへ書く。 */
+const loadingStore = createExternalStore(false);
+/**
+* アプリ全体の操作を塞ぐローディングを出す・消す。アプリのルートに `once/loading-lock` の `LoadingLock` を 1 つ置いておく。
+* 真偽の 1 つだけを持つ（重ねて呼んでも数えない。最後に `false` を渡した時点で消える。移植元と同じ）。
+*/
+function globalLoading(loading) {
+	loadingStore.set(loading);
+}
+
+//#endregion
+export { globalLoading, loadingStore };

package/dist/native/lib/network.d.ts

@@ -0,0 +1,12 @@
+//#region src/native/lib/network.d.ts
+/**
+ * 現在オンラインかどうかを購読する。`once/offline-banner` の表示制御に使う。
+ * 移植元（`@lt-three/native` の `hooks/network.ts`）は TanStack Query の `onlineManager` を NetInfo に委譲していたが、
+ * love3 は TanStack Query に依存しないので、ここは NetInfo だけを見る（fetch の保留・復帰時の再取得を NetInfo に連動させたいアプリは、
+ * 自分で `onlineManager.setEventListener` を NetInfo に繋ぐ）。
+ *
+ * 実機は NetInfo の `isConnected`（判定中の `null` はオンライン扱いにして誤検知を避ける）。
+ * web（react-native-web）でも NetInfo は動き、`navigator.onLine` と `online` / `offline` イベントを見る。
+ */
+export declare function useIsOnline(): boolean;
+//#endregion

package/dist/native/lib/network.js

@@ -0,0 +1,21 @@
+import { useEffect, useState } from "react";
+import { addEventListener } from "@react-native-community/netinfo";
+
+//#region src/native/lib/network.ts
+/**
+* 現在オンラインかどうかを購読する。`once/offline-banner` の表示制御に使う。
+* 移植元（`@lt-three/native` の `hooks/network.ts`）は TanStack Query の `onlineManager` を NetInfo に委譲していたが、
+* love3 は TanStack Query に依存しないので、ここは NetInfo だけを見る（fetch の保留・復帰時の再取得を NetInfo に連動させたいアプリは、
+* 自分で `onlineManager.setEventListener` を NetInfo に繋ぐ）。
+*
+* 実機は NetInfo の `isConnected`（判定中の `null` はオンライン扱いにして誤検知を避ける）。
+* web（react-native-web）でも NetInfo は動き、`navigator.onLine` と `online` / `offline` イベントを見る。
+*/
+function useIsOnline() {
+	const [online, setOnline] = useState(true);
+	useEffect(() => addEventListener((state) => setOnline(state.isConnected !== false)), []);
+	return online;
+}
+
+//#endregion
+export { useIsOnline };

package/dist/native/lib/scheme.d.ts

@@ -0,0 +1,18 @@
+import { TokenName } from "../../tokens/tokens.gen.js";
+//#region src/native/lib/scheme.d.ts
+/** テーマ選択。`system` は端末設定に追従する。保存先（AsyncStorage・設定画面）はアプリの責務で、ここでは持たない。 */
+export type ThemePreference = "system" | "light" | "dark";
+/** 実際に描画に使われるテーマ。 */
+export type ActiveScheme = "light" | "dark";
+/** 選択と端末のカラースキームから、実際に使うテーマを決める。 */
+export declare function resolveScheme(preference: ThemePreference, system: "light" | "dark" | "unspecified" | null | undefined): ActiveScheme;
+/** 色のトークンの名前（書体 `font-*` と角丸 `radius` を除く）。`useTokenColor` が受けるのはこれだけ。 */
+export type ColorTokenName = Exclude<TokenName, `font-${string}` | "radius">;
+/**
+ * トークンの色の実値。DS が値を持ち（`@lt-three/love3/tokens`）、部品はここを通して引く。
+ * 名前は CSS 変数の形（`--ink-500`）でも、トークン名（`ink-500`）でもよい。色でないトークン（書体・角丸）は受けない。
+ */
+export declare function tokenColor(scheme: ActiveScheme, name: `--${ColorTokenName}` | ColorTokenName,
+/** 調整（`TuningRoot`）が配る実効値。あれば、その値を優先する（実行時の上書きに追従する）。 */
+overlay?: Readonly<Record<ActiveScheme, Readonly<Record<string, string>>>> | null): string;
+//#endregion

package/dist/native/lib/scheme.js

@@ -0,0 +1,22 @@
+import { tokenNames, tokens } from "../../tokens/tokens.gen.js";
+
+//#region src/native/lib/scheme.ts
+/** 選択と端末のカラースキームから、実際に使うテーマを決める。 */
+function resolveScheme(preference, system) {
+	if (preference === "system") return system === "dark" ? "dark" : "light";
+	return preference;
+}
+const isColorToken = (name) => !name.startsWith("font-") && name !== "radius";
+/**
+* トークンの色の実値。DS が値を持ち（`@lt-three/love3/tokens`）、部品はここを通して引く。
+* 名前は CSS 変数の形（`--ink-500`）でも、トークン名（`ink-500`）でもよい。色でないトークン（書体・角丸）は受けない。
+*/
+function tokenColor(scheme, name, overlay) {
+	const key = name.startsWith("--") ? name.slice(2) : name;
+	const token = tokenNames.find((candidate) => candidate === key);
+	if (token === void 0 || !isColorToken(token)) throw new Error(`色のトークンではない: ${name}`);
+	return overlay?.[scheme][token] ?? tokens[scheme][token];
+}
+
+//#endregion
+export { resolveScheme, tokenColor };

package/dist/native/lib/snackbar.d.ts

@@ -0,0 +1,46 @@
+import { ExternalStore } from "./external-store.js";
+//#region src/native/lib/snackbar.d.ts
+export type SnackbarIcon = "success" | "error" | "info" | "warning";
+export type SnackbarAction = {
+  label: string;
+  /** 押すと呼ばれ、そのあとトーストは閉じる（web の sonner の action と同じ）。 */
+  onPress: () => void;
+};
+export type SnackbarItem = {
+  id: string | number;
+  icon: SnackbarIcon;
+  title: string;
+  description?: string;
+  action?: SnackbarAction;
+  persistent?: boolean;
+};
+export type SnackbarOptions = {
+  id?: string | number;
+  icon?: SnackbarIcon;
+  description?: string;
+  action?: SnackbarAction;
+  /**
+   * true なら自動で消えない（`dismissSnackbar` か、閉じるボタンで消す）。
+   * **`action` があるときの既定は true**（押す前に消えると、キーボードや支援技術で操作する人が間に合わない。WCAG 2.2.1）。
+   * `action` つきでも、`duration` を渡すか `persistent: false` を明示すれば、自動で消える。
+   */
+  persistent?: boolean;
+  /** 自動で消えるまでの ms（既定 4000）。`persistent` のときは無視される。 */
+  duration?: number;
+};
+/** `Snackbar` が読む待ち行列。命令的な API（`snackbar()`）がここへ書く。 */
+export declare const snackbarStore: ExternalStore<readonly SnackbarItem[]>;
+/** `Snackbar` がマウントされている間だけ呼ぶ（`once/snackbar` が effect で呼ぶ）。戻り値は解除。未マウントの警告に使う。 */
+export declare function registerSnackbarHost(): () => void;
+/**
+ * トーストを出す。戻り値の id は `dismissSnackbar` に渡せる。
+ * アプリのルートに `once/snackbar` の `Snackbar` を 1 つ置いておく（**置いていないと出ない**。開発時は警告を出す。
+ * 自動で消えるまでの時間は、置く前でも進む）。
+ * 移植元の `@lt-three/native/lib/snackbar`（jotai の atom）と同じ形の API を、外部ストアで作り直した。
+ */
+export declare function snackbar(title: string, options?: SnackbarOptions): string | number;
+/** 指定したトーストを閉じる。 */
+export declare function dismissSnackbar(id: string | number): void;
+/** 出ているトーストを全部閉じる（自動で消える予約も全部取り消す）。 */
+export declare function dismissAllSnackbars(): void;
+//#endregion

package/dist/native/lib/snackbar.js

@@ -0,0 +1,60 @@
+import { createExternalStore } from "./external-store.js";
+
+//#region src/native/lib/snackbar.ts
+/** `Snackbar` が読む待ち行列。命令的な API（`snackbar()`）がここへ書く。 */
+const snackbarStore = createExternalStore([]);
+const DEFAULT_DURATION = 4e3;
+let sequence = 0;
+const timers = /* @__PURE__ */ new Map();
+let mountedHosts = 0;
+/** `Snackbar` がマウントされている間だけ呼ぶ（`once/snackbar` が effect で呼ぶ）。戻り値は解除。未マウントの警告に使う。 */
+function registerSnackbarHost() {
+	mountedHosts += 1;
+	return () => {
+		mountedHosts -= 1;
+	};
+}
+/**
+* トーストを出す。戻り値の id は `dismissSnackbar` に渡せる。
+* アプリのルートに `once/snackbar` の `Snackbar` を 1 つ置いておく（**置いていないと出ない**。開発時は警告を出す。
+* 自動で消えるまでの時間は、置く前でも進む）。
+* 移植元の `@lt-three/native/lib/snackbar`（jotai の atom）と同じ形の API を、外部ストアで作り直した。
+*/
+function snackbar(title, options) {
+	if (__DEV__ && mountedHosts === 0) console.warn("snackbar(): Snackbar がマウントされていない。アプリのルートに <Snackbar /> を 1 つ置くまで、このトーストは出ない。");
+	sequence += 1;
+	const id = options?.id ?? sequence;
+	const persistent = options?.persistent ?? (options?.action !== void 0 && options.duration === void 0);
+	const item = {
+		id,
+		icon: options?.icon ?? "info",
+		title,
+		description: options?.description,
+		action: options?.action,
+		persistent
+	};
+	snackbarStore.update((items) => [...items.filter((candidate) => candidate.id !== id), item]);
+	clearTimer(id);
+	if (!persistent) timers.set(id, setTimeout(() => dismissSnackbar(id), options?.duration ?? DEFAULT_DURATION));
+	return id;
+}
+/** 指定したトーストを閉じる。 */
+function dismissSnackbar(id) {
+	clearTimer(id);
+	snackbarStore.update((items) => items.filter((candidate) => candidate.id !== id));
+}
+/** 出ているトーストを全部閉じる（自動で消える予約も全部取り消す）。 */
+function dismissAllSnackbars() {
+	for (const timer of timers.values()) clearTimeout(timer);
+	timers.clear();
+	snackbarStore.set([]);
+}
+function clearTimer(id) {
+	const timer = timers.get(id);
+	if (timer === void 0) return;
+	clearTimeout(timer);
+	timers.delete(id);
+}
+
+//#endregion
+export { dismissAllSnackbars, dismissSnackbar, registerSnackbarHost, snackbar, snackbarStore };

package/dist/native/lib/theme.d.ts

@@ -0,0 +1,34 @@
+import { ActiveScheme, ThemePreference } from "./scheme.js";
+import { ReactNode } from "react";
+//#region src/native/lib/theme.d.ts
+/**
+ * 現在の有効テーマ。
+ *
+ * 配色そのものはここでは返さない。色は NativeWind のセマンティッククラス
+ * （`bg-background` / `text-foreground` 等）から取る。このフックは
+ * ネイティブ側 API（react-navigation のテーマ、StatusBar、SF Symbols の tint、チャートの色等）に
+ * ライト/ダークを渡す必要がある箇所だけで使う。
+ */
+export declare function useActiveScheme(): ActiveScheme;
+export type ThemeRootProps = {
+  /** テーマ選択。保存先（AsyncStorage・jotai など）はアプリが持ち、ここへは値だけを渡す。 */
+  preference: ThemePreference;
+  children: ReactNode;
+};
+/**
+ * テーマを実際の描画へ反映するルート。
+ *
+ * `@lt-three/love3/styles.css` は `.dark { --paper: ...; ... }` という
+ * **クラスベース**のダークトークンを定義している。react-native-css はこのクラス規則をそのまま
+ * コンパイルするため、ルートに `className="dark"` を置けば子孫すべてにダークの CSS 変数が配られる。
+ * web の `<html class="dark">` と同じ仕組みで、トークンを TS 側に複製しなくて済む。
+ *
+ * あわせて RN の `Appearance` も同期する。ナビゲーションのテーマや StatusBar など、
+ * NativeWind の外側にあるネイティブ UI がこれを見ている。
+ *
+ * **web（react-native-web）では使わない。** web のテーマは `<html class="dark">` が持つ
+ * （preview・vitest はそのまま切り替える）。
+ */
+export declare function ThemeRoot({ preference, children }: ThemeRootProps): import("react").JSX.Element;
+//#endregion
+export type { ActiveScheme, ThemePreference };

package/dist/native/lib/theme.js

@@ -0,0 +1,53 @@
+import { resolveScheme } from "./scheme.js";
+import { createContext, useContext, useEffect } from "react";
+import { Appearance, View, useColorScheme } from "react-native";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/native/lib/theme.tsx
+/** `ThemeRoot` が配る有効テーマ。`ThemeRoot` の外では端末のカラースキームに従う。 */
+const SchemeContext = createContext(null);
+/**
+* 現在の有効テーマ。
+*
+* 配色そのものはここでは返さない。色は NativeWind のセマンティッククラス
+* （`bg-background` / `text-foreground` 等）から取る。このフックは
+* ネイティブ側 API（react-navigation のテーマ、StatusBar、SF Symbols の tint、チャートの色等）に
+* ライト/ダークを渡す必要がある箇所だけで使う。
+*/
+function useActiveScheme() {
+	const fromRoot = useContext(SchemeContext);
+	const system = useColorScheme();
+	return fromRoot ?? resolveScheme("system", system);
+}
+/**
+* テーマを実際の描画へ反映するルート。
+*
+* `@lt-three/love3/styles.css` は `.dark { --paper: ...; ... }` という
+* **クラスベース**のダークトークンを定義している。react-native-css はこのクラス規則をそのまま
+* コンパイルするため、ルートに `className="dark"` を置けば子孫すべてにダークの CSS 変数が配られる。
+* web の `<html class="dark">` と同じ仕組みで、トークンを TS 側に複製しなくて済む。
+*
+* あわせて RN の `Appearance` も同期する。ナビゲーションのテーマや StatusBar など、
+* NativeWind の外側にあるネイティブ UI がこれを見ている。
+*
+* **web（react-native-web）では使わない。** web のテーマは `<html class="dark">` が持つ
+* （preview・vitest はそのまま切り替える）。
+*/
+function ThemeRoot({ preference, children }) {
+	const system = useColorScheme();
+	const scheme = resolveScheme(preference, system);
+	useEffect(() => {
+		Appearance.setColorScheme(preference === "system" ? "unspecified" : preference);
+	}, [preference]);
+	return /* @__PURE__ */ jsx(SchemeContext.Provider, {
+		value: scheme,
+		children: /* @__PURE__ */ jsx(View, {
+			accessible: false,
+			className: scheme === "dark" ? "dark flex-1" : "flex-1",
+			children
+		})
+	});
+}
+
+//#endregion
+export { ThemeRoot, useActiveScheme };

package/dist/native/lib/timezone.d.ts

@@ -0,0 +1,26 @@
+//#region src/native/lib/timezone.d.ts
+/**
+ * タイムゾーン（IANA 文字列）のユーティリティ。`atom/timezone-select` が使う。
+ * 移植元は `@lt-three/core/lib/timezone`。love3 は core に依存しないので、native の `lib/` に持つ
+ * （web の love3 に timezone-select が移ったら `shared/` へ移して共有する）。
+ *
+ * 選択肢を `Intl.supportedValuesOf("timeZone")` から作らないのは、native の JS エンジン
+ * Hermes にそれが無いため（Hermes 250829098.0.16 の hermesvm バイナリに文字列が無いことを確認した。
+ * `Intl.DateTimeFormat` の `resolvedOptions().timeZone` は iOS / Android とも持つ）。
+ * 全ゾーン（約 420）を出しても検索の無い選択リストでは使えないので、固定リストにしている。
+ */
+/**
+ * 主要な IANA タイムゾーン。各地域の代表的な都市を IANA の tz database から選んだ。
+ * ここに無い値でも、デバイスのタイムゾーンと保存済みの値は `timeZoneOptions` が必ず足す。
+ */
+export declare const MAJOR_TIME_ZONES: readonly string[];
+/** この端末のタイムゾーン（IANA 文字列）。取れなければ空文字。 */
+export declare function getDeviceTimeZone(): string;
+/**
+ * 選択肢のタイムゾーン一覧。固定リストに `extra`（デバイスの値・保存済みの値）を足し、
+ * 重複と空文字を除いて返す。リストに無い値が選択済みのとき、選択肢から消えて空表示になるのを防ぐ。
+ */
+export declare function timeZoneOptions(...extra: string[]): string[];
+/** 表示用の名前。IANA の `_` は読みにくいので空白に直す（`America/New_York` → `America/New York`）。 */
+export declare function formatTimeZoneLabel(zone: string): string;
+//#endregion

package/dist/native/lib/timezone.js

@@ -0,0 +1,95 @@
+//#region src/native/lib/timezone.ts
+/**
+* タイムゾーン（IANA 文字列）のユーティリティ。`atom/timezone-select` が使う。
+* 移植元は `@lt-three/core/lib/timezone`。love3 は core に依存しないので、native の `lib/` に持つ
+* （web の love3 に timezone-select が移ったら `shared/` へ移して共有する）。
+*
+* 選択肢を `Intl.supportedValuesOf("timeZone")` から作らないのは、native の JS エンジン
+* Hermes にそれが無いため（Hermes 250829098.0.16 の hermesvm バイナリに文字列が無いことを確認した。
+* `Intl.DateTimeFormat` の `resolvedOptions().timeZone` は iOS / Android とも持つ）。
+* 全ゾーン（約 420）を出しても検索の無い選択リストでは使えないので、固定リストにしている。
+*/
+/**
+* 主要な IANA タイムゾーン。各地域の代表的な都市を IANA の tz database から選んだ。
+* ここに無い値でも、デバイスのタイムゾーンと保存済みの値は `timeZoneOptions` が必ず足す。
+*/
+const MAJOR_TIME_ZONES = [
+	"UTC",
+	"Pacific/Honolulu",
+	"America/Anchorage",
+	"America/Los_Angeles",
+	"America/Vancouver",
+	"America/Phoenix",
+	"America/Denver",
+	"America/Chicago",
+	"America/Mexico_City",
+	"America/New_York",
+	"America/Toronto",
+	"America/Halifax",
+	"America/Sao_Paulo",
+	"America/Argentina/Buenos_Aires",
+	"Atlantic/Reykjavik",
+	"Europe/London",
+	"Europe/Dublin",
+	"Europe/Lisbon",
+	"Europe/Madrid",
+	"Europe/Paris",
+	"Europe/Amsterdam",
+	"Europe/Berlin",
+	"Europe/Zurich",
+	"Europe/Rome",
+	"Europe/Stockholm",
+	"Europe/Athens",
+	"Europe/Helsinki",
+	"Europe/Istanbul",
+	"Europe/Moscow",
+	"Africa/Lagos",
+	"Africa/Cairo",
+	"Africa/Nairobi",
+	"Africa/Johannesburg",
+	"Asia/Jerusalem",
+	"Asia/Dubai",
+	"Asia/Karachi",
+	"Asia/Kolkata",
+	"Asia/Dhaka",
+	"Asia/Bangkok",
+	"Asia/Jakarta",
+	"Asia/Ho_Chi_Minh",
+	"Asia/Singapore",
+	"Asia/Kuala_Lumpur",
+	"Asia/Hong_Kong",
+	"Asia/Shanghai",
+	"Asia/Taipei",
+	"Asia/Manila",
+	"Asia/Seoul",
+	"Asia/Tokyo",
+	"Australia/Perth",
+	"Australia/Adelaide",
+	"Australia/Sydney",
+	"Australia/Melbourne",
+	"Pacific/Auckland"
+];
+/** この端末のタイムゾーン（IANA 文字列）。取れなければ空文字。 */
+function getDeviceTimeZone() {
+	try {
+		return Intl.DateTimeFormat().resolvedOptions().timeZone ?? "";
+	} catch {
+		return "";
+	}
+}
+/**
+* 選択肢のタイムゾーン一覧。固定リストに `extra`（デバイスの値・保存済みの値）を足し、
+* 重複と空文字を除いて返す。リストに無い値が選択済みのとき、選択肢から消えて空表示になるのを防ぐ。
+*/
+function timeZoneOptions(...extra) {
+	const set = new Set(MAJOR_TIME_ZONES);
+	for (const zone of extra) if (zone) set.add(zone);
+	return [...set].sort((a, b) => a.localeCompare(b));
+}
+/** 表示用の名前。IANA の `_` は読みにくいので空白に直す（`America/New_York` → `America/New York`）。 */
+function formatTimeZoneLabel(zone) {
+	return zone.replaceAll("_", " ");
+}
+
+//#endregion
+export { MAJOR_TIME_ZONES, formatTimeZoneLabel, getDeviceTimeZone, timeZoneOptions };

package/dist/native/lib/token-color.d.ts

@@ -0,0 +1,5 @@
+import { ColorTokenName } from "./scheme.js";
+//#region src/native/lib/token-color.d.ts
+/** 引数は CSS 変数の形の色のトークン（`--ink-500`）。セマンティックな名前（`--muted-foreground`）も引ける。書体・角丸は受けない。 */
+export declare function useTokenColor(name: `--${ColorTokenName}`): string;
+//#endregion

package/dist/native/lib/token-color.js

@@ -0,0 +1,13 @@
+import { tokenColor } from "./scheme.js";
+import { useActiveScheme } from "./theme.js";
+import { TuningTokensContext } from "./tuning-context.js";
+import { useContext } from "react";
+
+//#region src/native/lib/token-color.ts
+/** 引数は CSS 変数の形の色のトークン（`--ink-500`）。セマンティックな名前（`--muted-foreground`）も引ける。書体・角丸は受けない。 */
+function useTokenColor(name) {
+	return tokenColor(useActiveScheme(), name, useContext(TuningTokensContext));
+}
+
+//#endregion
+export { useTokenColor };

package/dist/native/lib/token-color.web.d.ts

@@ -0,0 +1,4 @@
+import { ColorTokenName } from "./scheme.js";
+//#region src/native/lib/token-color.web.d.ts
+export declare function useTokenColor(name: `--${ColorTokenName}`): string;
+//#endregion

package/dist/native/lib/token-color.web.js

@@ -0,0 +1,7 @@
+//#region src/native/lib/token-color.web.ts
+function useTokenColor(name) {
+	return `var(${name})`;
+}
+
+//#endregion
+export { useTokenColor };

package/dist/native/lib/tuning-context.d.ts

@@ -0,0 +1,9 @@
+import { Mode } from "../../tuning/types.js";
+//#region src/native/lib/tuning-context.d.ts
+/**
+ * 調整（`TuningRoot`）が配る、トークンの実効値（ライト・ダーク別。参照を解決した値）。無ければ（`TuningRoot` の外）調整なし。
+ * TS から色を引く `useTokenColor` が、これを見て実行時の上書きに追従する。
+ */
+export type TuningTokens = Readonly<Record<Mode, Readonly<Record<string, string>>>>;
+export declare const TuningTokensContext: import("react").Context<Readonly<Record<Mode, Readonly<Record<string, string>>>> | null>;
+//#endregion

package/dist/native/lib/tuning-context.js

@@ -0,0 +1,7 @@
+import { createContext } from "react";
+
+//#region src/native/lib/tuning-context.ts
+const TuningTokensContext = createContext(null);
+
+//#endregion
+export { TuningTokensContext };

package/dist/native/lib/tuning.d.ts

@@ -0,0 +1,24 @@
+import { Tuning, TuningCatalog } from "../../tuning/types.js";
+import { ReactNode } from "react";
+//#region src/native/lib/tuning.d.ts
+export type TuningRootProps = {
+  /** 調整の内容（既定との差分。`@lt-three/love3/tuning` の `Tuning`。保存先はアプリが持つ）。 */
+  tuning: Tuning;
+  /** 調整の対象。既定は love3 の生成物（`tuning/catalog.gen.ts`）。 */
+  catalog?: TuningCatalog;
+  children: ReactNode;
+};
+/**
+ * 調整（トークンの実行時の上書き）を、子孫の部品に反映するルート。**`ThemeRoot` の内側**に置く（有効テーマと、ダークの変数を受け取るため）。
+ *
+ * - `react-native-css` の `VariableContextProvider` で、変えた色・角丸・書体を CSS 変数として配る。実機で効くのは、
+ *   ライト・ダークで値が違う色のトークンを使うクラス（`bg-card` など）と書体。`bg-action` などビルド時にリテラルへ
+ *   畳み込まれるクラス・角丸・本文サイズ・セマンティックの参照先は、**実機では効かない**（`nativeLimits` が説明を返す。
+ *   react-native-web では CSS 変数なので全部効く）
+ * - TS から色を引く部品（`useTokenColor`）は、実効値（参照を解決した値）を `TuningTokensContext` から引くので、**全部追従する**
+ * - 調整が無い（既定と同じ）なら、何も変えない（`tuning` を空にすれば元の見た目）
+ *
+ * 実機（Expo）での確認は未実施。react-native-web の browser test で確かめた範囲を README に書いてある。
+ */
+export declare function TuningRoot({ tuning, catalog, children }: TuningRootProps): import("react").JSX.Element;
+//#endregion