@walkthru-earth/objex 1.3.0 → 1.4.0

package/dist/components/ui/dropdown-menu/dropdown-menu-radio-group.svelte.d.ts

@@ -1,4 +1,4 @@
 import { DropdownMenu as DropdownMenuPrimitive } from 'bits-ui';
-declare const DropdownMenuRadioGroup: import("svelte").Component<DropdownMenuPrimitive.RadioGroupProps, {}, "value" | "ref">;
+declare const DropdownMenuRadioGroup: import("svelte").Component<DropdownMenuPrimitive.RadioGroupProps, {}, "ref" | "value">;
 type DropdownMenuRadioGroup = ReturnType<typeof DropdownMenuRadioGroup>;
 export default DropdownMenuRadioGroup;

package/dist/components/ui/input/input.svelte.d.ts

@@ -8,6 +8,6 @@ type Props = WithElementRef<Omit<HTMLInputAttributes, 'type'> & ({
     type?: InputType;
     files?: undefined;
 })>;
-declare const Input: import("svelte").Component<Props, {}, "value" | "ref" | "files">;
+declare const Input: import("svelte").Component<Props, {}, "ref" | "value" | "files">;
 type Input = ReturnType<typeof Input>;
 export default Input;

package/dist/components/ui/resizable/index.d.ts

@@ -1,4 +1,4 @@
 import { Pane } from 'paneforge';
 import Handle from './resizable-handle.svelte';
 import PaneGroup from './resizable-pane-group.svelte';
-export { PaneGroup, Pane, Handle, PaneGroup as ResizablePaneGroup, Pane as ResizablePane, Handle as ResizableHandle };
+export { Handle, Handle as ResizableHandle, Pane as ResizablePane, PaneGroup, PaneGroup as ResizablePaneGroup };

package/dist/components/ui/resizable/index.js

@@ -1,6 +1,6 @@
 import { Pane } from 'paneforge';
 import Handle from './resizable-handle.svelte';
 import PaneGroup from './resizable-pane-group.svelte';
-export { PaneGroup, Pane, Handle, 
+export { Handle, Handle as ResizableHandle, Pane as ResizablePane, PaneGroup, 
 //
-PaneGroup as ResizablePaneGroup, Pane as ResizablePane, Handle as ResizableHandle };
+PaneGroup as ResizablePaneGroup };

package/dist/components/ui/slider/index.d.ts

@@ -0,0 +1,3 @@
+import RangeSlider from './range-slider.svelte';
+import Root from './slider.svelte';
+export { RangeSlider, Root, Root as Slider };

package/dist/components/ui/slider/index.js

@@ -0,0 +1,5 @@
+import RangeSlider from './range-slider.svelte';
+import Root from './slider.svelte';
+export { RangeSlider, Root, 
+//
+Root as Slider };

package/dist/components/ui/slider/range-slider.svelte

@@ -0,0 +1,94 @@
+<script lang="ts">
+import { cn } from '../../../utils.js';
+import Slider from './slider.svelte';
+
+/**
+ * Dual-thumb numeric range slider with optional histogram bars rendered
+ * behind the track and a min/max label row beneath. Composes the shadcn
+ * `Slider` primitive (bits-ui) so pointer, keyboard, RTL, and a11y
+ * behavior come from the primitive instead of being reimplemented.
+ *
+ * Used by:
+ *   - StacDatetimeBar / StacFilterPanel (datetime + numeric facets, with histogram)
+ *   - CogControls (rescale min/max, no histogram, paired number inputs)
+ */
+let {
+	value = $bindable<[number, number]>([0, 1]),
+	min,
+	max,
+	step = 1,
+	histogram,
+	formatLabel,
+	loLabel,
+	hiLabel,
+	class: className,
+	disabled = false,
+	onValueChange,
+	onValueCommit
+}: {
+	value?: [number, number];
+	min: number;
+	max: number;
+	step?: number;
+	/** Optional bin counts to draw behind the track. */
+	histogram?: readonly number[] | null;
+	/** Formatter for the default min/max label row. Omit to hide labels. */
+	formatLabel?: (n: number) => string;
+	/** Override the lower label (takes precedence over `formatLabel(value[0])`). */
+	loLabel?: string;
+	/** Override the upper label (takes precedence over `formatLabel(value[1])`). */
+	hiLabel?: string;
+	class?: string;
+	disabled?: boolean;
+	onValueChange?: (next: [number, number]) => void;
+	onValueCommit?: (next: [number, number]) => void;
+} = $props();
+
+const histMax = $derived(histogram?.length ? Math.max(1, ...histogram) : 1);
+const showLabels = $derived(Boolean(formatLabel) || loLabel != null || hiLabel != null);
+
+function emitChange(next: number[]): void {
+	if (next.length >= 2) onValueChange?.([next[0], next[1]]);
+}
+
+function emitCommit(next: number[]): void {
+	if (next.length >= 2) onValueCommit?.([next[0], next[1]]);
+}
+</script>
+
+<div class={cn('flex flex-col gap-1.5', className)}>
+	<div class="relative px-2">
+		{#if histogram && histogram.length > 0}
+			<div
+				class="pointer-events-none absolute inset-x-2 top-0 flex h-6 items-end gap-px"
+				aria-hidden="true"
+			>
+				{#each histogram as count, i (i)}
+					<div
+						class="bg-muted-foreground/30 flex-1 rounded-sm"
+						style="height: {Math.max(2, (count / histMax) * 100)}%"
+					></div>
+				{/each}
+			</div>
+		{/if}
+		<Slider
+			type="multiple"
+			bind:value={value as never}
+			{min}
+			{max}
+			{step}
+			{disabled}
+			onValueChange={emitChange}
+			onValueCommit={emitCommit}
+			class={cn(histogram && histogram.length > 0 && 'mt-7')}
+		/>
+	</div>
+	{#if showLabels}
+		<div
+			class="text-muted-foreground flex items-center justify-between px-2 text-[10px] tabular-nums"
+		>
+			<span>{loLabel ?? (formatLabel ? formatLabel(value[0]) : '')}</span>
+			<span>{hiLabel ?? (formatLabel ? formatLabel(value[1]) : '')}</span>
+		</div>
+	{/if}
+</div>

package/dist/components/ui/slider/range-slider.svelte.d.ts

@@ -0,0 +1,21 @@
+type $$ComponentProps = {
+    value?: [number, number];
+    min: number;
+    max: number;
+    step?: number;
+    /** Optional bin counts to draw behind the track. */
+    histogram?: readonly number[] | null;
+    /** Formatter for the default min/max label row. Omit to hide labels. */
+    formatLabel?: (n: number) => string;
+    /** Override the lower label (takes precedence over `formatLabel(value[0])`). */
+    loLabel?: string;
+    /** Override the upper label (takes precedence over `formatLabel(value[1])`). */
+    hiLabel?: string;
+    class?: string;
+    disabled?: boolean;
+    onValueChange?: (next: [number, number]) => void;
+    onValueCommit?: (next: [number, number]) => void;
+};
+declare const RangeSlider: import("svelte").Component<$$ComponentProps, {}, "value">;
+type RangeSlider = ReturnType<typeof RangeSlider>;
+export default RangeSlider;

package/dist/components/ui/slider/slider.svelte

@@ -0,0 +1,83 @@
+<script lang="ts" module>
+import { Slider as SliderPrimitive, type WithoutChildrenOrChild } from 'bits-ui';
+
+export type SliderProps = WithoutChildrenOrChild<SliderPrimitive.RootProps> & {
+	class?: string;
+};
+</script>
+
+<script lang="ts">
+import { cn } from '../../../utils.js';
+
+let {
+	ref = $bindable(null),
+	value = $bindable(),
+	class: className,
+	type,
+	...restProps
+}: SliderProps = $props();
+</script>
+
+{#if type === 'single'}
+	<SliderPrimitive.Root
+		bind:ref
+		bind:value={value as never}
+		type="single"
+		data-slot="slider"
+		class={cn(
+			'relative flex w-full touch-none select-none items-center data-[orientation=vertical]:h-full data-[orientation=vertical]:min-h-44 data-[orientation=vertical]:w-auto data-[orientation=vertical]:flex-col data-[disabled]:opacity-50',
+			className
+		)}
+		{...(restProps as Record<string, unknown>)}
+	>
+		{#snippet children({ thumbs })}
+			<span
+				data-slot="slider-track"
+				class="bg-muted relative grow overflow-hidden rounded-full data-[orientation=horizontal]:h-1.5 data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-1.5"
+			>
+				<SliderPrimitive.Range
+					data-slot="slider-range"
+					class="bg-primary absolute data-[orientation=horizontal]:h-full data-[orientation=vertical]:w-full"
+				/>
+			</span>
+			{#each thumbs as index (index)}
+				<SliderPrimitive.Thumb
+					{index}
+					data-slot="slider-thumb"
+					class="border-primary bg-background ring-ring/50 block size-4 shrink-0 cursor-pointer rounded-full border-2 shadow-sm transition-[color,box-shadow] hover:ring-4 focus-visible:ring-4 focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50"
+				/>
+			{/each}
+		{/snippet}
+	</SliderPrimitive.Root>
+{:else}
+	<SliderPrimitive.Root
+		bind:ref
+		bind:value={value as never}
+		type="multiple"
+		data-slot="slider"
+		class={cn(
+			'relative flex w-full touch-none select-none items-center data-[orientation=vertical]:h-full data-[orientation=vertical]:min-h-44 data-[orientation=vertical]:w-auto data-[orientation=vertical]:flex-col data-[disabled]:opacity-50',
+			className
+		)}
+		{...(restProps as Record<string, unknown>)}
+	>
+		{#snippet children({ thumbs })}
+			<span
+				data-slot="slider-track"
+				class="bg-muted relative grow overflow-hidden rounded-full data-[orientation=horizontal]:h-1.5 data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-1.5"
+			>
+				<SliderPrimitive.Range
+					data-slot="slider-range"
+					class="bg-primary absolute data-[orientation=horizontal]:h-full data-[orientation=vertical]:w-full"
+				/>
+			</span>
+			{#each thumbs as index (index)}
+				<SliderPrimitive.Thumb
+					{index}
+					data-slot="slider-thumb"
+					class="border-primary bg-background ring-ring/50 block size-4 shrink-0 cursor-pointer rounded-full border-2 shadow-sm transition-[color,box-shadow] hover:ring-4 focus-visible:ring-4 focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50"
+				/>
+			{/each}
+		{/snippet}
+	</SliderPrimitive.Root>
+{/if}

package/dist/components/ui/slider/slider.svelte.d.ts

@@ -0,0 +1,7 @@
+import { Slider as SliderPrimitive, type WithoutChildrenOrChild } from 'bits-ui';
+export type SliderProps = WithoutChildrenOrChild<SliderPrimitive.RootProps> & {
+    class?: string;
+};
+declare const Slider: import("svelte").Component<SliderProps, {}, "ref" | "value">;
+type Slider = ReturnType<typeof Slider>;
+export default Slider;

package/dist/components/viewers/ArchiveViewer.svelte

@@ -1,5 +1,6 @@
 <script lang="ts">
 import { Archive, ChevronRight, Download, File, Folder, Loader } from '@lucide/svelte';
+import { formatFileSize } from '@walkthru-earth/objex-utils';
 import type { Entry } from '@zip.js/zip.js';
 import { onDestroy, untrack } from 'svelte';
 import { Badge } from '../ui/badge/index.js';
@@ -28,8 +29,7 @@ import {
 	streamTarGzEntriesFromUrl,
 	streamZipEntriesFromUrl
 } from '../../utils/archive';
-import { formatFileSize } from '../../utils/format';
-import { buildHttpsUrlAsync } from '../../utils/url.js';
+import { buildHttpsUrlAsync } from '../../utils/signed-url.js';
 
 let { tab }: { tab: Tab } = $props();
 

package/dist/components/viewers/CodeViewer.svelte

@@ -1,5 +1,12 @@
 <script lang="ts">
 import EllipsisVerticalIcon from '@lucide/svelte/icons/ellipsis-vertical';
+import {
+	copyToClipboard,
+	handleLoadError,
+	isStacCatalog,
+	isStacCollection,
+	isStacItem
+} from '@walkthru-earth/objex-utils';
 import { onDestroy } from 'svelte';
 import { Badge } from '../ui/badge/index.js';
 import { Button } from '../ui/button/index.js';
@@ -8,13 +15,10 @@ import { t } from '../../i18n/index.svelte.js';
 import { getAdapter } from '../../storage/index.js';
 import { tabResources } from '../../stores/tab-resources.svelte.js';
 import type { Tab } from '../../types';
-import { copyToClipboard } from '../../utils/clipboard.js';
-import { handleLoadError } from '../../utils/error.js';
 import { extensionToShikiLang, highlightCode } from '../../utils/shiki';
-import { buildHttpsUrl, buildHttpsUrlAsync, canStreamDirectly } from '../../utils/url.js';
-import { getUrlView, updateUrlView } from '../../utils/url-state.js';
+import { buildHttpsUrl, buildHttpsUrlAsync, canStreamDirectly } from '../../utils/signed-url.js';
+import { getUrlView, pickViewMode, updateUrlView } from '../../utils/url-state.js';
 import { openZarrTab } from '../../utils/zarr-tab.js';
-import { isStacCatalog, isStacCollection, isStacItem } from '../../utils/stac.js';
 
 interface CodeActions {
 	toggleFormat: () => Promise<void>;
@@ -44,20 +48,20 @@ let error = $state<string | null>(null);
 let copied = $state(false);
 let formatted = $state(false);
 const urlView = getUrlView();
-function getInitialViewMode():
-	| 'code'
-	| 'render'
-	| 'stac-browser'
-	| 'kepler'
-	| 'maputnik'
-	| 'marimo' {
-	if (urlView === 'stac-browser') return 'stac-browser';
-	if (urlView === 'kepler') return 'kepler';
-	if (urlView === 'maputnik') return 'maputnik';
-	if (urlView === 'marimo') return 'marimo';
-	if (urlView === 'code') return 'code';
-	if (tab.extension.toLowerCase() === 'html') return 'render';
-	return 'code';
+type CodeViewMode = 'code' | 'render' | 'stac-browser' | 'kepler' | 'maputnik' | 'marimo';
+const CODE_VIEW_MODES = [
+	'code',
+	'render',
+	'stac-browser',
+	'kepler',
+	'maputnik',
+	'marimo'
+] as const satisfies readonly CodeViewMode[];
+function getInitialViewMode(): CodeViewMode {
+	const explicit = pickViewMode<CodeViewMode>(CODE_VIEW_MODES, 'code');
+	if (explicit !== 'code' || urlView === 'code') return explicit;
+	// No (or unknown) hash: default to render for HTML, code otherwise.
+	return tab.extension.toLowerCase() === 'html' ? 'render' : 'code';
 }
 let viewMode = $state(getInitialViewMode());
 
@@ -207,12 +211,17 @@ $effect(() => {
 	};
 });
 
-// Auto-switch to STAC Browser when STAC JSON is detected (unless URL explicitly set #code).
+// Auto-switch to STAC Browser when STAC JSON is detected and the user did NOT
+// request a specific view via the URL hash. Any explicit hash (#map, #stac-map,
+// #stac-browser, #code, …) MUST be honored, because while ViewerRouter's async
+// detectStac is pending it falls back to plain CodeViewer for .json tabs;
+// rewriting the hash here would race the eventual StacTabViewer mount and
+// clobber the shared link the user opened.
 // Skipped when nested in StacTabViewer since the outer wrapper owns the view toggle.
 let stacAutoSwitched = false;
 $effect(() => {
 	if (nested) return;
-	if (isStacJson && !stacAutoSwitched && viewMode === 'code' && urlView !== 'code') {
+	if (isStacJson && !stacAutoSwitched && viewMode === 'code' && !urlView) {
 		stacAutoSwitched = true;
 		viewMode = 'stac-browser';
 		updateUrlView('stac-browser');
@@ -349,7 +358,7 @@ async function toggleFormat() {
 	formatted = true;
 }
 
-function setViewMode(mode: 'code' | 'render' | 'stac-browser' | 'kepler' | 'maputnik' | 'marimo') {
+function setViewMode(mode: CodeViewMode) {
 	viewMode = viewMode === mode ? (isHtml ? 'render' : 'code') : mode;
 	updateUrlView(viewMode === 'render' ? '' : viewMode);
 }