geopreview 1.0.0

package/README.md

@@ -0,0 +1,74 @@
+# geopreview
+
+Geospatial file inspector for the terminal. Displays statistics summary and a Braille-character map preview.
+
+```
+world.geojson
+FeatureCollection / 240 features / 9.4 MB
+
+GEOMETRY SUMMARY               PROPERTY SCHEMA
+MultiPolygon             240   fid             number        ▓▓▓▓▓▓▓▓▓▓ (240/240)
+                               iso_a2          string        ▓▓▓▓▓▓▓▓▓▓ (240/240)
+                               NAME            string        ▓▓▓▓▓▓▓▓▓▓ (238/240)
+
+MAP PREVIEW
+⣀⡀ ⢀⣀⣀⣀⣀⡀ ⣀⣰⣻⣿⣿⡿⣿⣿⣿⣿⣿⣿⣤⣉⠉⠙⣦⡀   ⢠⣴⡿⠃ ⡀    ⢙⣊⣁⣀
+⠿⣶⣮⣿⡆   ⡏⠉⠉⠉⠉⠙⠛⠛⠛⠛⣫⣿⣿⣹⣿⣹⣷⠂⠹⣷⢀⣴⠶⠛⠩⣧⣶⠄
+```
+
+## Supported Formats
+
+| Format | Extension |
+|---|---|
+| GeoJSON | `.geojson`, `.json` |
+| FlatGeobuf | `.fgb` |
+| GeoParquet | `.parquet` |
+
+## Install
+
+```bash
+npm install -g geopreview
+```
+
+Requires Node.js v18+.
+
+## Usage
+
+```bash
+gp <file>
+```
+
+### Options
+
+| Option | Description | Default |
+|---|---|---|
+| `--no-map` | Hide map preview | — |
+| `--width`, `-w` | Map width (chars) | terminal width - 4 |
+| `--height`, `-h` | Map height (chars) | 24 |
+| `--props`, `-p` | Property display limit | 15 |
+
+### Examples
+
+```bash
+gp world.geojson
+gp countries.fgb --no-map
+gp buildings.parquet --props 30
+gp routes.geojson -w 100 -h 30
+```
+
+### Keyboard
+
+| Key | Action |
+|---|---|
+| `q` / `Ctrl+C` | Exit |
+
+## What It Shows
+
+- **Header** — File name, feature count, file size
+- **Geometry Summary** — Count per geometry type (Point, Polygon, MultiPolygon, etc.)
+- **Property Schema** — Property names, types, and fill rate with visual bar
+- **Map Preview** — Braille-character rendering of all geometries
+
+## License
+
+ISC

package/dist/App.d.ts

@@ -0,0 +1,21 @@
+/**
+ * ルートコンポーネント — 全UIコンポーネントを組み立てる。
+ *
+ * データフロー:
+ *   cli.tsx → App（filePath, parser, options）
+ *     → useFileParser で非同期解析
+ *     → ParseResult を各子コンポーネントに分配
+ *
+ * useInput で "q" キーによる終了を実装。
+ * ただしパイプ入力等で stdin が TTY でない場合は useInput を無効化する
+ * （Ink の Raw mode エラーを回避するため）。
+ */
+import type { FC } from "react";
+import type { CliOptions, FileParser } from "./lib/types.js";
+interface Props {
+    filePath: string;
+    parser: FileParser;
+    options: CliOptions;
+}
+declare const App: FC<Props>;
+export default App;

package/dist/App.js

@@ -0,0 +1,37 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * ルートコンポーネント — 全UIコンポーネントを組み立てる。
+ *
+ * データフロー:
+ *   cli.tsx → App（filePath, parser, options）
+ *     → useFileParser で非同期解析
+ *     → ParseResult を各子コンポーネントに分配
+ *
+ * useInput で "q" キーによる終了を実装。
+ * ただしパイプ入力等で stdin が TTY でない場合は useInput を無効化する
+ * （Ink の Raw mode エラーを回避するため）。
+ */
+import { Box, Text, useApp, useInput } from "ink";
+import { Spinner } from "@inkjs/ui";
+import Header from "./components/Header.js";
+import GeometrySummary from "./components/GeometrySummary.js";
+import PropertySchema from "./components/PropertySchema.js";
+import MapPreview from "./components/MapPreview.js";
+import Footer from "./components/Footer.js";
+import { useFileParser } from "./hooks/useFileParser.js";
+const App = ({ filePath, parser, options }) => {
+    const { result, loading, error } = useFileParser(filePath, parser);
+    const { exit } = useApp();
+    useInput((input) => {
+        if (input === "q")
+            exit();
+    }, { isActive: process.stdin.isTTY === true });
+    if (loading)
+        return _jsx(Spinner, { label: "Loading..." });
+    if (error)
+        return _jsx(Text, { color: "red", children: error.message });
+    if (!result)
+        return null;
+    return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Header, { result: result }), _jsxs(Box, { children: [_jsx(GeometrySummary, { counts: result.geometryCounts }), _jsx(PropertySchema, { stats: result.propertyStats, limit: options.props })] }), !options.noMap && (_jsx(MapPreview, { result: result, width: options.width, height: options.height })), _jsx(Footer, {})] }));
+};
+export default App;

package/dist/cli.d.ts

@@ -0,0 +1,13 @@
+#!/usr/bin/env node
+/**
+ * CLI エントリポイント。
+ *
+ * meow でコマンドライン引数を解析し、ファイル拡張子に応じたパーサーを
+ * レジストリから取得して、Ink の App コンポーネントに渡す。
+ *
+ * 使用例:
+ *   gi world.geojson
+ *   gi ports.geojson --no-map --props 30
+ *   gi routes.geojson -w 100 -h 30
+ */
+export {};

package/dist/cli.js

@@ -0,0 +1,77 @@
+#!/usr/bin/env node
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * CLI エントリポイント。
+ *
+ * meow でコマンドライン引数を解析し、ファイル拡張子に応じたパーサーを
+ * レジストリから取得して、Ink の App コンポーネントに渡す。
+ *
+ * 使用例:
+ *   gi world.geojson
+ *   gi ports.geojson --no-map --props 30
+ *   gi routes.geojson -w 100 -h 30
+ */
+import meow from "meow";
+import { render } from "ink";
+import App from "./App.js";
+import { getParser } from "./lib/registry.js";
+const cli = meow(`
+  Usage
+    $ gp <file>
+
+  Options
+    --no-map          Hide map preview
+    --width, -w       Map width (chars)   Default: terminal width - 4
+    --height, -h      Map height (chars)  Default: 24
+    --props, -p       Property display limit  Default: 15
+
+  Examples
+    $ gp world.geojson
+    $ gp ports.geojson --no-map --props 30
+`, {
+    importMeta: import.meta,
+    flags: {
+        map: {
+            type: "boolean",
+            default: true,
+        },
+        width: {
+            type: "number",
+            shortFlag: "w",
+            default: (process.stdout.columns ?? 80) - 4,
+        },
+        height: {
+            type: "number",
+            shortFlag: "h",
+            default: 24,
+        },
+        props: {
+            type: "number",
+            shortFlag: "p",
+            default: 15,
+        },
+    },
+});
+const filePath = cli.input[0];
+if (!filePath) {
+    cli.showHelp();
+    process.exit(1);
+}
+// 拡張子からパーサーを解決。未対応の形式の場合はエラーメッセージを表示して終了
+let parser;
+try {
+    parser = getParser(filePath);
+}
+catch (e) {
+    console.error(e.message);
+    process.exit(1);
+}
+const options = {
+    noMap: !cli.flags.map,
+    width: cli.flags.width,
+    height: cli.flags.height,
+    props: cli.flags.props,
+};
+render(_jsx(App, { filePath: filePath, parser: parser, options: options }), {
+    exitOnCtrlC: true,
+});

package/dist/components/Footer.d.ts

@@ -0,0 +1,3 @@
+import type { FC } from "react";
+declare const Footer: FC;
+export default Footer;

package/dist/components/Footer.js

@@ -0,0 +1,4 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Text } from "ink";
+const Footer = () => (_jsx(Text, { dimColor: true, children: "[q: exit]" }));
+export default Footer;

package/dist/components/GeometrySummary.d.ts

@@ -0,0 +1,11 @@
+/**
+ * ジオメトリサマリー — ジオメトリ種別ごとの件数を表形式で表示する。
+ * カウントが 0 の種別は非表示にして、実際に含まれる種別のみ列挙する。
+ */
+import type { FC } from "react";
+import type { GeometryType } from "../lib/types.js";
+interface Props {
+    counts: Record<GeometryType, number>;
+}
+declare const GeometrySummary: FC<Props>;
+export default GeometrySummary;

package/dist/components/GeometrySummary.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * ジオメトリサマリー — ジオメトリ種別ごとの件数を表形式で表示する。
+ * カウントが 0 の種別は非表示にして、実際に含まれる種別のみ列挙する。
+ */
+import { Box, Text } from "ink";
+const GeometrySummary = ({ counts }) => {
+    const entries = Object.entries(counts).filter(([, v]) => v > 0);
+    return (_jsxs(Box, { flexDirection: "column", marginRight: 4, children: [_jsx(Text, { bold: true, underline: true, children: "GEOMETRY SUMMARY" }), entries.length === 0 ? (_jsx(Text, { dimColor: true, children: "(none)" })) : (entries.map(([type, count]) => (_jsxs(Text, { children: [_jsx(Text, { color: "green", children: type.padEnd(20) }), _jsx(Text, { children: count.toLocaleString().padStart(8) })] }, type))))] }));
+};
+export default GeometrySummary;

package/dist/components/Header.d.ts

@@ -0,0 +1,10 @@
+/**
+ * ヘッダー — ファイル名・Feature 数・ファイルサイズを表示する。
+ */
+import type { FC } from "react";
+import type { ParseResult } from "../lib/types.js";
+interface Props {
+    result: ParseResult;
+}
+declare const Header: FC<Props>;
+export default Header;

package/dist/components/Header.js

@@ -0,0 +1,18 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * ヘッダー — ファイル名・Feature 数・ファイルサイズを表示する。
+ */
+import { Box, Text } from "ink";
+/** バイト数を B / KB / MB の読みやすい単位に変換する */
+function formatBytes(bytes) {
+    if (bytes < 1024)
+        return `${bytes} B`;
+    if (bytes < 1024 * 1024)
+        return `${(bytes / 1024).toFixed(1)} KB`;
+    return `${(bytes / (1024 * 1024)).toFixed(1)} MB`;
+}
+const Header = ({ result }) => {
+    const fileName = result.filePath.split("/").pop() ?? result.filePath;
+    return (_jsxs(Box, { flexDirection: "column", marginBottom: 1, children: [_jsx(Text, { bold: true, color: "cyan", children: fileName }), _jsxs(Text, { dimColor: true, children: ["FeatureCollection / ", result.featureCount.toLocaleString(), " features /", " ", formatBytes(result.fileSizeBytes)] })] }));
+};
+export default Header;

package/dist/components/MapPreview.d.ts

@@ -0,0 +1,15 @@
+/**
+ * マッププレビュー — drawMap() の出力をブライユ文字列として表示する。
+ *
+ * result / width / height が変わるたびに useEffect で再描画する。
+ * --no-map フラグが指定された場合、App.tsx 側でこのコンポーネント自体がマウントされない。
+ */
+import { type FC } from "react";
+import type { ParseResult } from "../lib/types.js";
+interface Props {
+    result: ParseResult;
+    width: number;
+    height: number;
+}
+declare const MapPreview: FC<Props>;
+export default MapPreview;

package/dist/components/MapPreview.js

@@ -0,0 +1,19 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * マッププレビュー — drawMap() の出力をブライユ文字列として表示する。
+ *
+ * result / width / height が変わるたびに useEffect で再描画する。
+ * --no-map フラグが指定された場合、App.tsx 側でこのコンポーネント自体がマウントされない。
+ */
+import { Text } from "ink";
+import { useEffect, useState } from "react";
+import { drawMap } from "../lib/drawMap.js";
+const MapPreview = ({ result, width, height }) => {
+    const [frame, setFrame] = useState("");
+    useEffect(() => {
+        const output = drawMap(result, width, height);
+        setFrame(output);
+    }, [result, width, height]);
+    return (_jsxs(_Fragment, { children: [_jsx(Text, { bold: true, underline: true, children: "MAP PREVIEW" }), _jsx(Text, { children: frame })] }));
+};
+export default MapPreview;

package/dist/components/PropertySchema.d.ts

@@ -0,0 +1,15 @@
+/**
+ * プロパティスキーマ — 各プロパティの名前・型・充足率を表示する。
+ *
+ * 充足率（count / total）を ▓░ のバーで視覚化する（10段階）。
+ * --props オプションで表示件数を制限でき、超過分は "... and N more" と表示する。
+ * 型が複数混在する場合は "string|number" のようにパイプ区切りで表示する。
+ */
+import type { FC } from "react";
+import type { PropertyStat } from "../lib/types.js";
+interface Props {
+    stats: PropertyStat[];
+    limit: number;
+}
+declare const PropertySchema: FC<Props>;
+export default PropertySchema;

package/dist/components/PropertySchema.js

@@ -0,0 +1,25 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * プロパティスキーマ — 各プロパティの名前・型・充足率を表示する。
+ *
+ * 充足率（count / total）を ▓░ のバーで視覚化する（10段階）。
+ * --props オプションで表示件数を制限でき、超過分は "... and N more" と表示する。
+ * 型が複数混在する場合は "string|number" のようにパイプ区切りで表示する。
+ */
+import { Box, Text } from "ink";
+/** 充足率を ▓（充足）/ ░（未充足）のバー文字列に変換 */
+function makeBar(ratio, width = 10) {
+    const filled = Math.round(ratio * width);
+    return "▓".repeat(filled) + "░".repeat(width - filled);
+}
+const PropertySchema = ({ stats, limit }) => {
+    const displayed = stats.slice(0, limit);
+    const remaining = stats.length - displayed.length;
+    return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Text, { bold: true, underline: true, children: "PROPERTY SCHEMA" }), displayed.length === 0 ? (_jsx(Text, { dimColor: true, children: "(none)" })) : (displayed.map((s) => {
+                const types = [...s.types].join("|");
+                const ratio = s.total > 0 ? s.count / s.total : 0;
+                const bar = makeBar(ratio);
+                return (_jsxs(Text, { children: [_jsx(Text, { color: "yellow", children: s.key.padEnd(16) }), _jsx(Text, { children: types.padEnd(14) }), _jsxs(Text, { dimColor: true, children: [bar, " "] }), _jsxs(Text, { children: ["(", s.count, "/", s.total, ")"] })] }, s.key));
+            })), remaining > 0 && (_jsxs(Text, { dimColor: true, children: ["... and ", remaining, " more properties"] }))] }));
+};
+export default PropertySchema;

package/dist/hooks/useFileParser.d.ts

@@ -0,0 +1,18 @@
+/**
+ * ファイル読み込み・解析を行う汎用 React フック。
+ *
+ * パーサーを外部から注入する設計のため、ファイル形式に依存しない。
+ * コンポーネントのマウント時に parser.parse() を非同期で実行し、
+ * loading / result / error の3状態を返す。
+ *
+ * useEffect のクリーンアップで cancelled フラグを立てることで、
+ * アンマウント後の setState を防止している。
+ */
+import type { FileParser, ParseResult } from "../lib/types.js";
+interface UseFileParserResult {
+    result: ParseResult | null;
+    loading: boolean;
+    error: Error | null;
+}
+export declare function useFileParser(filePath: string, parser: FileParser): UseFileParserResult;
+export {};

package/dist/hooks/useFileParser.js

@@ -0,0 +1,37 @@
+/**
+ * ファイル読み込み・解析を行う汎用 React フック。
+ *
+ * パーサーを外部から注入する設計のため、ファイル形式に依存しない。
+ * コンポーネントのマウント時に parser.parse() を非同期で実行し、
+ * loading / result / error の3状態を返す。
+ *
+ * useEffect のクリーンアップで cancelled フラグを立てることで、
+ * アンマウント後の setState を防止している。
+ */
+import { useEffect, useState } from "react";
+export function useFileParser(filePath, parser) {
+    const [result, setResult] = useState(null);
+    const [loading, setLoading] = useState(true);
+    const [error, setError] = useState(null);
+    useEffect(() => {
+        let cancelled = false;
+        parser
+            .parse(filePath)
+            .then((r) => {
+            if (!cancelled) {
+                setResult(r);
+                setLoading(false);
+            }
+        })
+            .catch((e) => {
+            if (!cancelled) {
+                setError(e instanceof Error ? e : new Error(String(e)));
+                setLoading(false);
+            }
+        });
+        return () => {
+            cancelled = true;
+        };
+    }, [filePath, parser]);
+    return { result, loading, error };
+}

package/dist/hooks/useGeojson.d.ts

@@ -0,0 +1,8 @@
+import type { ParseResult } from "../lib/types.js";
+interface UseGeojsonResult {
+    result: ParseResult | null;
+    loading: boolean;
+    error: Error | null;
+}
+export declare function useGeojson(filePath: string): UseGeojsonResult;
+export {};

package/dist/hooks/useGeojson.js

@@ -0,0 +1,27 @@
+import { useEffect, useState } from "react";
+import { parseGeojson } from "../lib/parseGeojson.js";
+export function useGeojson(filePath) {
+    const [result, setResult] = useState(null);
+    const [loading, setLoading] = useState(true);
+    const [error, setError] = useState(null);
+    useEffect(() => {
+        let cancelled = false;
+        parseGeojson(filePath)
+            .then((r) => {
+            if (!cancelled) {
+                setResult(r);
+                setLoading(false);
+            }
+        })
+            .catch((e) => {
+            if (!cancelled) {
+                setError(e instanceof Error ? e : new Error(String(e)));
+                setLoading(false);
+            }
+        });
+        return () => {
+            cancelled = true;
+        };
+    }, [filePath]);
+    return { result, loading, error };
+}

package/dist/lib/drawMap.d.ts

@@ -0,0 +1,21 @@
+/**
+ * drawille-canvas を使ってジオメトリをブライユ文字（Unicode Braille）で描画する。
+ *
+ * ブライユ文字は 1 文字あたり 2×4 のドットマトリクスを持つため、
+ * ターミナルの 1 文字が 2px（横）× 4px（縦）の解像度になる。
+ *
+ * 座標変換:
+ *   経度(lng) → px = (lng - minLng) / lngRange * (幅px - 1)
+ *   緯度(lat) → py = (1 - (lat - minLat) / latRange) * (高さpx - 1)
+ *                     ↑ Y軸反転（ターミナルは上から下、緯度は南から北）
+ *
+ * 描画方針: ストロークのみ（塗りつぶしなし）で輪郭を描く。
+ */
+import type { ParseResult } from "./types.js";
+/**
+ * ParseResult の features を drawille キャンバスに描画し、ブライユ文字列を返す。
+ *
+ * @param widthChars  - マップの幅（ターミナル文字数）
+ * @param heightChars - マップの高さ（ターミナル文字数）
+ */
+export declare function drawMap(result: ParseResult, widthChars: number, heightChars: number): string;

package/dist/lib/drawMap.js

@@ -0,0 +1,113 @@
+/**
+ * drawille-canvas を使ってジオメトリをブライユ文字（Unicode Braille）で描画する。
+ *
+ * ブライユ文字は 1 文字あたり 2×4 のドットマトリクスを持つため、
+ * ターミナルの 1 文字が 2px（横）× 4px（縦）の解像度になる。
+ *
+ * 座標変換:
+ *   経度(lng) → px = (lng - minLng) / lngRange * (幅px - 1)
+ *   緯度(lat) → py = (1 - (lat - minLat) / latRange) * (高さpx - 1)
+ *                     ↑ Y軸反転（ターミナルは上から下、緯度は南から北）
+ *
+ * 描画方針: ストロークのみ（塗りつぶしなし）で輪郭を描く。
+ */
+// @ts-expect-error drawille-canvas has no type declarations
+import DrawilleCanvas from "drawille-canvas";
+/**
+ * ParseResult の features を drawille キャンバスに描画し、ブライユ文字列を返す。
+ *
+ * @param widthChars  - マップの幅（ターミナル文字数）
+ * @param heightChars - マップの高さ（ターミナル文字数）
+ */
+export function drawMap(result, widthChars, heightChars) {
+    // ブライユ1文字 = 横2ドット × 縦4ドット
+    const pxW = widthChars * 2;
+    const pxH = heightChars * 4;
+    const ctx = new DrawilleCanvas(pxW, pxH);
+    const [minLng, minLat, maxLng, maxLat] = result.bbox;
+    const lngRange = maxLng - minLng;
+    const latRange = maxLat - minLat;
+    /** 経度をピクセルX座標に変換 */
+    function projectLng(lng) {
+        return ((lng - minLng) / lngRange) * (pxW - 1);
+    }
+    /** 緯度をピクセルY座標に変換（Y軸反転） */
+    function projectLat(lat) {
+        return (1 - (lat - minLat) / latRange) * (pxH - 1);
+    }
+    /** Point 用: 1ピクセルの点を打つ */
+    function drawCoord(coord) {
+        const px = Math.round(projectLng(coord[0]));
+        const py = Math.round(projectLat(coord[1]));
+        ctx.fillRect(px, py, 1, 1);
+    }
+    /** LineString 用: 頂点間を線分で結ぶ */
+    function drawLineString(coords) {
+        if (coords.length === 0)
+            return;
+        ctx.beginPath();
+        const x0 = Math.round(projectLng(coords[0][0]));
+        const y0 = Math.round(projectLat(coords[0][1]));
+        ctx.moveTo(x0, y0);
+        for (let i = 1; i < coords.length; i++) {
+            const x = Math.round(projectLng(coords[i][0]));
+            const y = Math.round(projectLat(coords[i][1]));
+            ctx.lineTo(x, y);
+        }
+        ctx.stroke();
+    }
+    /** Polygon 用: 各リング（外周・穴）の輪郭を描画（塗りつぶしなし） */
+    function drawPolygon(rings) {
+        for (const ring of rings) {
+            if (ring.length === 0)
+                continue;
+            ctx.beginPath();
+            const x0 = Math.round(projectLng(ring[0][0]));
+            const y0 = Math.round(projectLat(ring[0][1]));
+            ctx.moveTo(x0, y0);
+            for (let i = 1; i < ring.length; i++) {
+                const x = Math.round(projectLng(ring[i][0]));
+                const y = Math.round(projectLat(ring[i][1]));
+                ctx.lineTo(x, y);
+            }
+            ctx.closePath();
+            ctx.stroke();
+        }
+    }
+    /** ジオメトリ種別に応じて描画関数を振り分ける（GeometryCollection は再帰） */
+    function drawGeometry(geometry) {
+        switch (geometry.type) {
+            case "Point":
+                drawCoord(geometry.coordinates);
+                break;
+            case "MultiPoint":
+                for (const coord of geometry.coordinates)
+                    drawCoord(coord);
+                break;
+            case "LineString":
+                drawLineString(geometry.coordinates);
+                break;
+            case "MultiLineString":
+                for (const line of geometry.coordinates)
+                    drawLineString(line);
+                break;
+            case "Polygon":
+                drawPolygon(geometry.coordinates);
+                break;
+            case "MultiPolygon":
+                for (const polygon of geometry.coordinates)
+                    drawPolygon(polygon);
+                break;
+            case "GeometryCollection":
+                for (const g of geometry.geometries)
+                    drawGeometry(g);
+                break;
+        }
+    }
+    for (const feature of result.features) {
+        if (feature.geometry) {
+            drawGeometry(feature.geometry);
+        }
+    }
+    return ctx.toString();
+}

package/dist/lib/parseGeojson.d.ts

@@ -0,0 +1,2 @@
+import type { ParseResult } from "./types.js";
+export declare function parseGeojson(filePath: string): Promise<ParseResult>;