@walkthru-earth/objex 1.3.1 → 1.4.0

package/dist/components/viewers/StacMosaicViewer.svelte.d.ts

@@ -1,5 +1,5 @@
+import { type StacRoutableKind } from '@walkthru-earth/objex-utils';
 import type { Tab } from '../../types.js';
-import { type StacRoutableKind } from '../../utils/stac.js';
 type $$ComponentProps = {
     tab: Tab;
     classified?: StacRoutableKind;

package/dist/components/viewers/StacTabViewer.svelte

@@ -3,12 +3,12 @@ import CodeIcon from '@lucide/svelte/icons/file-code';
 import GlobeIcon from '@lucide/svelte/icons/globe';
 import LayersIcon from '@lucide/svelte/icons/layers';
 import MapIcon from '@lucide/svelte/icons/map';
+import type { StacRoutableKind } from '@walkthru-earth/objex-utils';
 import { t } from '../../i18n/index.svelte.js';
 import { connectionStore } from '../../stores/connections.svelte.js';
 import type { Tab } from '../../types.js';
-import type { StacRoutableKind } from '../../utils/stac.js';
-import { canStreamDirectly } from '../../utils/url.js';
-import { getUrlView, updateUrlView } from '../../utils/url-state.js';
+import { canStreamDirectly } from '../../utils/signed-url.js';
+import { getUrlView, pickViewMode, updateUrlView } from '../../utils/url-state.js';
 import { Badge } from '../ui/badge/index.js';
 import { Button } from '../ui/button/index.js';
 import * as Tooltip from '../ui/tooltip/index.js';
@@ -28,7 +28,11 @@ interface Props {
 
 let { tab, mapKind, classified }: Props = $props();
 
-type ViewMode = 'map' | 'stac-map' | 'stac-browser' | 'code';
+// 'code' is the URL token for raw-content view on JSON tabs; 'table' is the
+// equivalent token on stac-geoparquet tabs. Both render the nested viewer
+// (CodeViewer for JSON, TableViewer for parquet) but the URL stays
+// semantically meaningful per filetype.
+type ViewMode = 'map' | 'stac-map' | 'stac-browser' | 'code' | 'table';
 
 interface CodeActions {
 	toggleFormat: () => Promise<void>;
@@ -70,13 +74,16 @@ const stacBadgeKey = $derived.by(() => {
 });
 
 function initialView(): ViewMode {
+	// `'map'` is conditional on `mapKind`, so it's not in the static vocabulary.
+	// Both `'code'` and `'table'` are accepted regardless of filetype so a URL
+	// shared from one type still resolves; the render branch dispatches to the
+	// appropriate inner viewer (`TableViewer` / `CodeViewer`).
+	const picked = pickViewMode<ViewMode>(['stac-map', 'stac-browser', 'code', 'table'], 'stac-map');
 	const urlView = getUrlView();
 	if (urlView === 'map' && mapKind) return 'map';
-	if (urlView === 'stac-map') return 'stac-map';
-	if (urlView === 'stac-browser') return 'stac-browser';
-	if (urlView === 'code') return 'code';
-	if (mapKind) return 'map';
-	return 'stac-map';
+	// Hash was unknown or empty: prefer the rich map view when available.
+	if (mapKind && !urlView) return 'map';
+	return picked;
 }
 
 let viewMode = $state<ViewMode>(initialView());
@@ -86,8 +93,12 @@ let codeActions = $state<CodeActions | null>(null);
 function setView(next: ViewMode) {
 	if (viewMode === next) return;
 	viewMode = next;
-	updateUrlView(next === 'map' ? 'map' : next);
+	updateUrlView(next);
 }
+
+// The "Table" / "JSON" button in the navbar writes a filetype-aware token so
+// the URL stays semantically meaningful (parquet → `#table`, json → `#code`).
+const rawContentMode: ViewMode = $derived(isParquet ? 'table' : 'code');
 </script>
 
 <Tooltip.Provider>
@@ -191,9 +202,9 @@ function setView(next: ViewMode) {
 				{/if}
 				<Button
 					size="sm"
-					variant={viewMode === 'code' ? 'default' : 'ghost'}
+					variant={viewMode === rawContentMode ? 'default' : 'ghost'}
 					class="h-7 gap-1 px-2"
-					onclick={() => setView('code')}
+					onclick={() => setView(rawContentMode)}
 				>
 					<CodeIcon class="size-3.5" />
 					{isParquet ? t('stac.viewTable') : t('stac.viewJson')}
@@ -244,7 +255,7 @@ function setView(next: ViewMode) {
 			{:else if viewMode === 'stac-browser'}
 				<StacMapViewer {tab} variant="stac-browser" />
 			{:else if isParquet}
-				<TableViewer {tab} />
+				<TableViewer {tab} nested />
 			{:else}
 				<CodeViewer {tab} nested bind:wordWrap bind:actions={codeActions} />
 			{/if}

package/dist/components/viewers/StacTabViewer.svelte.d.ts

@@ -1,5 +1,5 @@
+import type { StacRoutableKind } from '@walkthru-earth/objex-utils';
 import type { Tab } from '../../types.js';
-import type { StacRoutableKind } from '../../utils/stac.js';
 type MapKind = 'mosaic' | 'multicog' | null;
 interface Props {
     tab: Tab;

package/dist/components/viewers/TableGrid.svelte

@@ -7,15 +7,15 @@ import ColumnsIcon from '@lucide/svelte/icons/columns-3';
 import CopyIcon from '@lucide/svelte/icons/copy';
 import RowsIcon from '@lucide/svelte/icons/rows-3';
 import XIcon from '@lucide/svelte/icons/x';
-import { onDestroy } from 'svelte';
-import { t } from '../../i18n/index.svelte.js';
 import {
 	classifyType,
+	jsonReplacerBigInt,
 	type TypeCategory,
 	typeBadgeClass,
 	typeLabel
-} from '../../utils/column-types.js';
-import { jsonReplacerBigInt } from '../../utils/format.js';
+} from '@walkthru-earth/objex-utils';
+import { onDestroy } from 'svelte';
+import { t } from '../../i18n/index.svelte.js';
 
 const INITIAL_ROWS = 100;
 const BATCH_SIZE = 100;

package/dist/components/viewers/TableStatusBar.svelte

@@ -1,8 +1,8 @@
 <script lang="ts">
 import ChevronDownIcon from '@lucide/svelte/icons/chevron-down';
 import DownloadIcon from '@lucide/svelte/icons/download';
+import { exportToCsv, exportToJson } from '@walkthru-earth/objex-utils';
 import { t } from '../../i18n/index.svelte.js';
-import { exportToCsv, exportToJson } from '../../utils/export.js';
 
 let {
 	rowCount = 0,

package/dist/components/viewers/TableToolbar.svelte

@@ -16,7 +16,7 @@ import { Separator } from '../ui/separator/index.js';
 import { t } from '../../i18n/index.svelte.js';
 import { connections } from '../../stores/connections.svelte.js';
 import type { Tab } from '../../types';
-import { buildHttpsUrl, buildStorageUrl } from '../../utils/url.js';
+import { buildHttpsUrl, buildStorageUrl } from '../../utils/signed-url.js';
 
 const PROVIDER_LABELS: Record<string, string> = {
 	s3: 'S3',

package/dist/components/viewers/TableViewer.svelte

@@ -1,4 +1,17 @@
 <script lang="ts">
+import type { GeoArrowGeomType } from '@walkthru-earth/objex-utils';
+import {
+	buildTransformExpr,
+	extractBounds,
+	extractEpsgFromGeoMeta,
+	extractGeometryTypes,
+	findGeoColumn,
+	findGeoColumnFromRows,
+	parseWKB,
+	readParquetMetadata,
+	toBinary,
+	wrapWkbWithCrs
+} from '@walkthru-earth/objex-utils';
 import { format as formatSql } from 'sql-formatter';
 import { untrack } from 'svelte';
 import CodeMirrorEditor from '../editor/CodeMirrorEditor.svelte';
@@ -18,22 +31,13 @@ import { queryHistory } from '../../stores/query-history.svelte.js';
 import { settings } from '../../stores/settings.svelte.js';
 import { tabResources } from '../../stores/tab-resources.svelte.js';
 import type { Tab } from '../../types';
-import type { GeoArrowGeomType } from '../../utils/geoarrow.js';
-import { buildTransformExpr, wrapWkbWithCrs } from '../../utils/geometry-type.js';
-import {
-	extractBounds,
-	extractEpsgFromGeoMeta,
-	extractGeometryTypes,
-	readParquetMetadata
-} from '../../utils/parquet-metadata.js';
 import {
 	buildDuckDbUrl,
 	buildHttpsUrl,
 	buildStorageUrl,
 	canStreamDirectly
-} from '../../utils/url.js';
-import { getUrlView, updateUrlView } from '../../utils/url-state.js';
-import { findGeoColumn, findGeoColumnFromRows, parseWKB, toBinary } from '../../utils/wkb.js';
+} from '../../utils/signed-url.js';
+import { pickViewMode, updateUrlView } from '../../utils/url-state.js';
 import FileInfo from './FileInfo.svelte';
 import LoadProgress, { type ProgressEntry } from './LoadProgress.svelte';
 import QueryHistoryPanel from './QueryHistoryPanel.svelte';
@@ -41,7 +45,11 @@ import TableGrid from './TableGrid.svelte';
 import TableStatusBar from './TableStatusBar.svelte';
 import TableToolbar from './TableToolbar.svelte';
 
-let { tab }: { tab: Tab } = $props();
+// `nested = true` when mounted inside `StacTabViewer` for a stac-geoparquet
+// tab. The outer wrapper already exposes `stac-map` / `STAC Browser` buttons,
+// so the inner `TableToolbar` hides its own STAC Map toggle to avoid
+// duplicating the same `StacMapViewer` mount.
+let { tab, nested = false }: { tab: Tab; nested?: boolean } = $props();
 
 let pageSize = $state(settings.featureLimit);
 
@@ -56,9 +64,9 @@ let historyVisible = $state(false);
 let hasGeo = $state(false);
 let isStac = $state(false);
 // Restore view mode from URL hash if present
-const urlView = getUrlView();
-let viewMode = $state<'table' | 'map' | 'stac' | 'info'>(
-	urlView === 'map' ? 'map' : urlView === 'stac' ? 'stac' : urlView === 'info' ? 'info' : 'table'
+type TableViewMode = 'table' | 'map' | 'stac' | 'info';
+let viewMode = $state<TableViewMode>(
+	pickViewMode<TableViewMode>(['table', 'map', 'stac', 'info'], 'table')
 );
 let sqlQuery = $state('');
 let customSql = $state('');
@@ -908,7 +916,7 @@ function setStacView() {
 		{pageSize}
 		{historyVisible}
 		{hasGeo}
-		{isStac}
+		isStac={isStac && !nested}
 		{viewMode}
 		onPrevPage={prevPage}
 		onNextPage={nextPage}
@@ -916,7 +924,7 @@ function setStacView() {
 		onToggleInfo={toggleInfo}
 		onToggleHistory={toggleHistory}
 		onToggleView={toggleView}
-		onToggleStac={setStacView}
+		onToggleStac={nested ? undefined : setStacView}
 		onPageSizeChange={handlePageSizeChange}
 	/>
 

package/dist/components/viewers/TableViewer.svelte.d.ts

@@ -1,6 +1,7 @@
 import type { Tab } from '../../types';
 type $$ComponentProps = {
     tab: Tab;
+    nested?: boolean;
 };
 declare const TableViewer: import("svelte").Component<$$ComponentProps, {}, "">;
 type TableViewer = ReturnType<typeof TableViewer>;

package/dist/components/viewers/ViewerRouter.svelte

@@ -1,17 +1,17 @@
 <script lang="ts">
-import { getViewerKind } from '../../file-icons/index.js';
-import { getAdapter } from '../../storage/index.js';
-import type { Tab } from '../../types.js';
-import { readParquetMetadata } from '../../utils/parquet-metadata.js';
 import {
 	classifyStac,
 	detectMosaicCapable,
 	detectMultiCogCapable,
+	isStacGeoparquetSchema,
+	readParquetMetadata,
+	STAC_API_PATH_RE,
 	type StacRoutableKind
-} from '../../utils/stac.js';
-import { isStacGeoparquetSchema } from '../../utils/stac-geoparquet.js';
-import { STAC_API_PATH_RE } from '../../utils/storage-url.js';
-import { buildHttpsUrlAsync } from '../../utils/url.js';
+} from '@walkthru-earth/objex-utils';
+import { getViewerKind } from '../../file-icons/index.js';
+import { getAdapter } from '../../storage/index.js';
+import type { Tab } from '../../types.js';
+import { buildHttpsUrlAsync } from '../../utils/signed-url.js';
 import CodeViewer from './CodeViewer.svelte';
 import ImageViewer from './ImageViewer.svelte';
 import MediaViewer from './MediaViewer.svelte';
@@ -164,6 +164,14 @@ function pickMapKind(classified: StacRoutableKind): 'mosaic' | 'multicog' | null
 
 {#if stacRoute.kind === 'stac' && viewerKind === 'table'}
 	<StacTabViewer {tab} mapKind={stacRoute.mapKind} classified={stacRoute.classified} />
+{:else if stacRoute.kind === 'pending' && (viewerKind === 'table' || viewerKind === 'code' || viewerKind === 'raw')}
+	<!-- STAC detection (sniff parquet schema or peek 256KB JSON) is in flight.
+	     Mounting TableViewer / CodeViewer here would let them read the URL hash,
+	     pick a default viewMode, and potentially write back over an explicit
+	     hash that StacTabViewer would otherwise own (e.g. `#map` on a STAC
+	     collection JSON). The pending window is short — render an empty pane
+	     until detection resolves and the right viewer takes over. -->
+	<div class="h-full"></div>
 {:else if viewerKind === 'table'}
 	<TableViewer {tab} />
 {:else if viewerKind === 'image'}

package/dist/components/viewers/ZarrMapViewer.svelte

@@ -7,7 +7,7 @@ import { t } from '../../i18n/index.svelte.js';
 import { tabResources } from '../../stores/tab-resources.svelte.js';
 import type { Tab } from '../../types.js';
 import { createEpsgResolver } from '../../utils/cog.js';
-import { buildHttpsUrlAsync } from '../../utils/url.js';
+import { buildHttpsUrlAsync } from '../../utils/signed-url.js';
 import {
 	detectGeoZarr,
 	ensureCodecsRegistered,
@@ -17,6 +17,7 @@ import {
 	type ZarrHierarchy,
 	type ZarrNode
 } from '../../utils/zarr.js';
+import { Slider } from '../ui/slider/index.js';
 import MapContainer from './map/MapContainer.svelte';
 
 /** Enriched selector dimension with coordinate metadata. */
@@ -526,7 +527,7 @@ async function tryAddGeoZarrLayer(
 		const zarrInfoSnapshot = $state.snapshot(geoZarrInfo) as GeoZarrInfo;
 		const layer = new ZarrLayer({
 			id: `geozarr-${tab.id}`,
-			source: group,
+			node: group,
 			variable: zarrInfoSnapshot.variantPath || undefined,
 			selection: {},
 			epsgResolver: dsZarrEpsg,
@@ -661,16 +662,17 @@ onDestroy(cleanup);
 				title={dimLabel(dim)}
 			>
 				<span class="shrink-0 font-medium text-zinc-500 dark:text-zinc-400">{dim.name}</span>
-				<input
-					type="range"
-					min="0"
+				<Slider
+					type="single"
+					min={0}
 					max={dim.size - 1}
+					step={1}
 					value={selectorValues[dim.name] ?? 0}
-					oninput={(e) => {
-						selectorValues[dim.name] = +e.currentTarget.value;
+					onValueChange={(v) => {
+						selectorValues[dim.name] = v as number;
 					}}
-					onchange={updateSelector}
-					class="h-1 w-16"
+					onValueCommit={() => updateSelector()}
+					class="w-20"
 				/>
 				{#if dim.isDatetime && dim.minDate && dim.maxDate}
 					{@const dateVal = indexToDateStr(selectorValues[dim.name] ?? 0, dim)}

package/dist/components/viewers/ZarrViewer.svelte

@@ -9,8 +9,8 @@ import {
 } from '../ui/resizable/index.js';
 import { t } from '../../i18n/index.svelte.js';
 import type { Tab } from '../../types';
-import { buildHttpsUrlAsync } from '../../utils/url.js';
-import { getUrlView, updateUrlView } from '../../utils/url-state.js';
+import { buildHttpsUrlAsync } from '../../utils/signed-url.js';
+import { pickViewMode, updateUrlView } from '../../utils/url-state.js';
 import {
 	computeChunkCount,
 	computeChunkSize,
@@ -30,8 +30,8 @@ let { tab }: { tab: Tab } = $props();
 
 let loading = $state(true);
 let error = $state<string | null>(null);
-const urlView = getUrlView();
-let viewMode = $state<'inspect' | 'map'>(urlView === 'map' ? 'map' : 'inspect');
+type ZarrViewMode = 'inspect' | 'map';
+let viewMode = $state<ZarrViewMode>(pickViewMode<ZarrViewMode>(['inspect', 'map'], 'inspect'));
 
 let hierarchy = $state.raw<ZarrHierarchy | null>(null);
 let selectedNode = $state<ZarrNode | null>(null);

package/dist/components/viewers/cog/ChannelPicker.svelte

@@ -0,0 +1,83 @@
+<script lang="ts">
+import type { ChannelRef, CogAsset } from '@walkthru-earth/objex-utils';
+import { t } from '../../../i18n/index.svelte.js';
+
+type Props = {
+	channel: 'r' | 'g' | 'b' | 'a';
+	label: string;
+	colorClass: string;
+	assets: CogAsset[];
+	value: ChannelRef;
+	onChange: (next: ChannelRef) => void;
+	allowNone?: boolean;
+};
+
+let { channel, label, colorClass, assets, value, onChange, allowNone = false }: Props = $props();
+
+const assetByKey = $derived(new Map(assets.map((a) => [a.key, a])));
+const currentAsset = $derived(assetByKey.get(value.assetKey) ?? null);
+const bandCount = $derived(currentAsset?.bandCount ?? 1);
+const bandIndices = $derived(Array.from({ length: bandCount }, (_, i) => i));
+
+function assetLabel(a: CogAsset): string {
+	const cn = a.eoCommon[0];
+	const base = cn ? `${a.key} (${cn})` : a.key;
+	return a.bandCount > 1 ? `${base} · ${a.bandCount} bands` : base;
+}
+
+function bandLabel(i: number, asset: CogAsset | null): string {
+	if (!asset) return `${t('cog.band')} ${i + 1}`;
+	const cn = asset.eoCommon[i];
+	return cn ? `${t('cog.band')} ${i + 1} (${cn})` : `${t('cog.band')} ${i + 1}`;
+}
+
+function setAsset(key: string): void {
+	if (channel === 'a' && allowNone && key === '') {
+		onChange({ assetKey: '', bandIndex: 0 });
+		return;
+	}
+	const target = assetByKey.get(key);
+	const maxIdx = Math.max(0, (target?.bandCount ?? 1) - 1);
+	const nextBand = Math.min(value.bandIndex, maxIdx);
+	onChange({ assetKey: key, bandIndex: nextBand });
+}
+
+function setBand(idx: number): void {
+	onChange({ assetKey: value.assetKey, bandIndex: idx });
+}
+</script>
+
+<div class="flex items-start gap-2">
+	<span class="mt-1 w-3 shrink-0 font-bold {colorClass}">{label}</span>
+	<div class="flex min-w-0 flex-1 flex-col gap-1 sm:flex-row sm:items-center">
+		<select
+			class="min-w-0 flex-1 truncate rounded border border-border bg-background px-1.5 py-0.5 text-xs"
+			aria-label={`${label} ${t('cog.asset')}`}
+			value={value.assetKey}
+			onchange={(e) => setAsset((e.target as HTMLSelectElement).value)}
+		>
+			{#if allowNone}
+				<option value="">{t('map.multiCogChannelNone')}</option>
+			{/if}
+			{#each assets as a (a.key)}
+				<option value={a.key}>{assetLabel(a)}</option>
+			{/each}
+		</select>
+		{#if currentAsset && bandCount > 1}
+			<select
+				class="min-w-0 flex-1 truncate rounded border border-border bg-background px-1.5 py-0.5 text-xs sm:flex-[0_1_auto] sm:min-w-24"
+				aria-label={`${label} ${t('cog.band')}`}
+				value={value.bandIndex}
+				onchange={(e) => setBand(Number((e.target as HTMLSelectElement).value))}
+			>
+				{#each bandIndices as i (i)}
+					<option value={i}>{bandLabel(i, currentAsset)}</option>
+				{/each}
+			</select>
+		{:else if currentAsset}
+			<span class="min-w-0 truncate px-1.5 py-0.5 text-[10px] text-muted-foreground sm:min-w-24">
+				{t('cog.band')} 1
+			</span>
+		{/if}
+	</div>
+</div>

package/dist/components/viewers/cog/ChannelPicker.svelte.d.ts

@@ -0,0 +1,13 @@
+import type { ChannelRef, CogAsset } from '@walkthru-earth/objex-utils';
+type Props = {
+    channel: 'r' | 'g' | 'b' | 'a';
+    label: string;
+    colorClass: string;
+    assets: CogAsset[];
+    value: ChannelRef;
+    onChange: (next: ChannelRef) => void;
+    allowNone?: boolean;
+};
+declare const ChannelPicker: import("svelte").Component<Props, {}, "">;
+type ChannelPicker = ReturnType<typeof ChannelPicker>;
+export default ChannelPicker;

package/dist/components/viewers/cog/PixelInspectorPanel.svelte

@@ -0,0 +1,87 @@
+<script lang="ts" module>
+export type PixelInspectorRow = {
+	label: string;
+	sublabel?: string;
+	value: number | null;
+};
+</script>
+
+<script lang="ts">
+import { t } from '../../../i18n/index.svelte.js';
+
+let {
+	lng,
+	lat,
+	rows,
+	footnote,
+	extraLine,
+	onClose,
+	inspecting = false
+}: {
+	lng: number | null;
+	lat: number | null;
+	rows: PixelInspectorRow[] | null;
+	footnote?: string;
+	extraLine?: string;
+	onClose: () => void;
+	inspecting?: boolean;
+} = $props();
+
+// The panel renders whenever we have a coordinate + rows. The "reading" pill
+// renders independently while inspecting is true. Both blocks can render at
+// once during a follow-up click, this matches the existing per-viewer UX.
+const showPanel = $derived(rows !== null && lng !== null && lat !== null);
+const showReading = $derived(inspecting);
+
+function formatValue(v: number | null): string {
+	if (v === null) return '-';
+	return Number.isInteger(v) ? String(v) : v.toFixed(4);
+}
+</script>
+
+{#if showPanel && rows && lng !== null && lat !== null}
+	<div
+		class="absolute bottom-2 left-2 z-10 max-w-[calc(100vw-1rem)] rounded bg-card/90 p-2.5 text-xs text-card-foreground backdrop-blur-sm sm:max-w-none"
+	>
+		<div class="mb-1 flex items-center justify-between gap-3">
+			<span class="font-medium">{t('cog.pixelValue')}</span>
+			<button
+				class="inline-flex min-h-8 min-w-8 items-center justify-center text-base text-muted-foreground hover:text-card-foreground sm:min-h-0 sm:min-w-0 sm:text-xs"
+				style="touch-action: manipulation;"
+				onclick={onClose}
+				aria-label={t('stac.close')}
+			>
+				&times;
+			</button>
+		</div>
+		<div class="space-y-0.5 text-muted-foreground">
+			<div>{lat.toFixed(6)}&deg;, {lng.toFixed(6)}&deg;</div>
+			{#if footnote}
+				<div class="text-[10px]">{footnote}</div>
+			{/if}
+			{#if extraLine}
+				<div class="truncate text-[10px]" title={extraLine}>{extraLine}</div>
+			{/if}
+		</div>
+		<div class="mt-1.5 space-y-0.5">
+			{#each rows as row}
+				<div class="flex justify-between gap-2">
+					<span class="text-muted-foreground">
+						{row.label}{#if row.sublabel}
+							<span class="ml-1 text-[10px] opacity-70">({row.sublabel})</span>
+						{/if}
+					</span>
+					<span class="font-mono tabular-nums">{formatValue(row.value)}</span>
+				</div>
+			{/each}
+		</div>
+	</div>
+{/if}
+
+{#if showReading}
+	<div
+		class="pointer-events-none absolute bottom-2 left-2 z-10 rounded bg-card/80 px-2 py-1 text-xs text-card-foreground backdrop-blur-sm"
+	>
+		{t('cog.reading')}
+	</div>
+{/if}

package/dist/components/viewers/cog/PixelInspectorPanel.svelte.d.ts

@@ -0,0 +1,17 @@
+export type PixelInspectorRow = {
+    label: string;
+    sublabel?: string;
+    value: number | null;
+};
+type $$ComponentProps = {
+    lng: number | null;
+    lat: number | null;
+    rows: PixelInspectorRow[] | null;
+    footnote?: string;
+    extraLine?: string;
+    onClose: () => void;
+    inspecting?: boolean;
+};
+declare const PixelInspectorPanel: import("svelte").Component<$$ComponentProps, {}, "">;
+type PixelInspectorPanel = ReturnType<typeof PixelInspectorPanel>;
+export default PixelInspectorPanel;

package/dist/components/viewers/cog/buildRgbLayer.d.ts

@@ -0,0 +1,78 @@
+/**
+ * Layer-construction dispatch for the unified RGB picker.
+ *
+ * Decision rule:
+ *   - All three RGB channels point to the SAME asset → COGLayer. When a
+ *     `preflightGeotiff` is supplied, the per-channel `bandIndex` values are
+ *     translated into a `BandConfig` and run through `selectCogPipeline`,
+ *     which returns a custom `getTileData` / `renderTile` pair that swaps
+ *     bands as requested (the library's COGLayer does not accept a
+ *     `bandConfig` prop, only the resolved pipeline). Without a preflight
+ *     GeoTIFF the layer falls back to the library default pipeline, which
+ *     reads bands 0/1/2 in that order, correct for single-band per-asset
+ *     COGs and for the default natural-color order on pre-baked multi-band
+ *     visuals.
+ *   - Channels point to DIFFERENT assets → MultiCOGLayer with the legacy
+ *     `composite: { r, g, b }` keyed on asset keys. MultiCOGLayer reads band 0
+ *     of each source, per-channel band index is silently ignored on this path
+ *     (library limitation, see spec Known Limitations).
+ *
+ * `buildRgbLayer` ONLY constructs the layer. It does not add overlays,
+ * register cleanup, or touch deck.gl state. Caller owns lifecycle.
+ */
+import { COGLayer, MultiCOGLayer } from '@developmentseed/deck.gl-geotiff';
+import type { DecoderPool, GeoTIFF as GeoTIFFType } from '@developmentseed/geotiff';
+import type { EpsgResolver } from '@developmentseed/proj';
+import { type ChannelComposite, type CogAsset } from '@walkthru-earth/objex-utils';
+import { type GeoBounds, type RescaleConfig } from '../../../utils/cog.js';
+export type RgbLayerKind = 'cog' | 'multicog';
+export interface BuildRgbLayerOptions {
+    id: string;
+    assets: CogAsset[];
+    composite: ChannelComposite;
+    rescale: RescaleConfig;
+    /** href → presigned-or-passthrough URL. */
+    resolveHref: (href: string) => Promise<string>;
+    pool?: DecoderPool | null;
+    epsgResolver: EpsgResolver;
+    signal: AbortSignal;
+    onLoad?: (info: {
+        kind: RgbLayerKind;
+        bounds?: GeoBounds;
+    }) => void;
+    /**
+     * Pre-opened GeoTIFF for the single-asset path. When provided, the per-channel
+     * `bandIndex` values from the composite are honored via `selectCogPipeline`,
+     * which inspects the COG's sample format / band count and returns a custom
+     * `getTileData` + `renderTile` pair that swaps bands as requested.
+     *
+     * When omitted, the layer falls back to the library default render pipeline,
+     * which always reads bands 0/1/2 in that order. That is fine for:
+     *   - single-band per-asset COGs (Sentinel-2, Landsat per-band) where every
+     *     `bandIndex` is 0 anyway, OR
+     *   - pre-baked multi-band visuals (NAIP `image`, S2 `visual`) where the
+     *     natural-color preset wants the default band order.
+     */
+    preflightGeotiff?: GeoTIFFType | null;
+    /**
+     * Resolved nodata value threaded into `buildBandRenderPipeline` for the
+     * multi-asset `MultiCOGLayer` path. `null` (default) disables the nodata
+     * filter so legacy callers preserve their previous behaviour.
+     */
+    noDataVal?: number | null;
+}
+export interface BuiltRgbLayer {
+    kind: RgbLayerKind;
+    layer: COGLayer | MultiCOGLayer;
+}
+/**
+ * Build the appropriate deck.gl layer for an RGB composite.
+ *
+ * For single-asset composites the band indices flow through `selectCogPipeline`
+ * (when `preflightGeotiff` is provided) into a custom `getTileData` /
+ * `renderTile` pair that honors the requested R/G/B band order. Without a
+ * preflight GeoTIFF the layer uses the library's default pipeline (bands 0/1/2).
+ * For multi-asset composites a warning is logged (once per call) when any
+ * non-band-0 index is requested, since MultiCOGLayer cannot honor it today.
+ */
+export declare function buildRgbLayer(opts: BuildRgbLayerOptions): Promise<BuiltRgbLayer>;