@joewinke/jatui 0.38.6 → 0.40.0

package/dist/components/progress/Steps.svelte.d.ts

@@ -1,3 +1,4 @@
+import { type Snippet } from 'svelte';
 interface Step {
     label?: string;
     description?: string;
@@ -8,7 +9,21 @@ interface Props {
     color?: 'primary' | 'secondary' | 'accent' | 'success' | 'warning' | 'error' | 'info';
     size?: 'sm' | 'md' | 'lg';
     class?: string;
+    /** Render a summary header button that folds the steps away. */
+    collapsible?: boolean;
+    /** Folded state (bindable). Only meaningful with `collapsible`. */
+    collapsed?: boolean;
+    /** Header copy. Default: "N steps left" / "All steps done". */
+    summary?: string | Snippet;
+    /** Layout. Default 'horizontal'. */
+    orientation?: 'horizontal' | 'vertical';
+    /** 0–1 progress of the active step → a mini ring on its node. */
+    activeProgress?: number;
+    /** Hold (ms) after the last step completes before `onFinished`. Default 0. */
+    completionDelay?: number;
+    /** Fired once after `current` passes the last step (+ `completionDelay`). */
+    onFinished?: () => void;
 }
-declare const Steps: import("svelte").Component<Props, {}, "">;
+declare const Steps: import("svelte").Component<Props, {}, "collapsed">;
 type Steps = ReturnType<typeof Steps>;
 export default Steps;

package/dist/components/progress/stepsSummary.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Pure helpers behind Steps' collapsible summary header (jatui-lltq9).
+ *
+ * `current` is Steps' 1-based active step: steps before it are complete, the
+ * step at it is in progress, and `current > count` means every step is done.
+ */
+/** Steps still to finish, counting the active one. Never negative. */
+export declare function stepsRemaining(count: number, current: number): number;
+/** True once `current` has moved past the last step. */
+export declare function isStepsFinished(count: number, current: number): boolean;
+/** Default header copy: "3 steps left", "1 step left", "All steps done". */
+export declare function stepsSummary(count: number, current: number): string;
+/** Clamp an active-step progress fraction to 0–1 (non-finite → 0). */
+export declare function clampStepProgress(value: number): number;

package/dist/components/progress/stepsSummary.js

@@ -0,0 +1,32 @@
+/**
+ * Pure helpers behind Steps' collapsible summary header (jatui-lltq9).
+ *
+ * `current` is Steps' 1-based active step: steps before it are complete, the
+ * step at it is in progress, and `current > count` means every step is done.
+ */
+/** Steps still to finish, counting the active one. Never negative. */
+export function stepsRemaining(count, current) {
+    if (!Number.isFinite(count) || count <= 0)
+        return 0;
+    const done = Math.max(0, Math.min(count, Math.floor(current) - 1));
+    return count - done;
+}
+/** True once `current` has moved past the last step. */
+export function isStepsFinished(count, current) {
+    return count > 0 && current > count;
+}
+/** Default header copy: "3 steps left", "1 step left", "All steps done". */
+export function stepsSummary(count, current) {
+    if (!Number.isFinite(count) || count <= 0)
+        return 'No steps';
+    const left = stepsRemaining(count, current);
+    if (left === 0)
+        return 'All steps done';
+    return `${left} ${left === 1 ? 'step' : 'steps'} left`;
+}
+/** Clamp an active-step progress fraction to 0–1 (non-finite → 0). */
+export function clampStepProgress(value) {
+    if (!Number.isFinite(value))
+        return 0;
+    return value < 0 ? 0 : value > 1 ? 1 : value;
+}

package/dist/index.d.ts

@@ -57,6 +57,10 @@ export { default as InlineEdit } from './components/InlineEdit.svelte';
 export { default as FloatingActionBar } from './components/FloatingActionBar.svelte';
 export { default as BulkActionBar } from './components/BulkActionBar.svelte';
 export type { BulkAction, BulkActionGroup } from './components/BulkActionBar.svelte';
+export { createClickSelection } from './selection/createClickSelection';
+export type { ClickSelection, ClickSelectionOptions, ClickSelectionKeyOptions } from './selection/createClickSelection';
+export { applyClick as applySelectionClick, extendTo as extendSelectionTo, rangeBetween as selectionRange, selectionKey, isAdditive as isAdditiveClick } from './selection/clickSelection';
+export type { SelectionModifiers, SelectionState, SelectionKeyEvent, SelectionKeyAction, ArrowKey as SelectionArrowKey } from './selection/clickSelection';
 export { default as HunkDiffView } from './components/HunkDiffView.svelte';
 export { default as Tooltip } from './components/Tooltip.svelte';
 export { default as PresenceStack } from './components/PresenceStack.svelte';
@@ -71,6 +75,10 @@ export { default as InfiniteSearchGrid } from './components/InfiniteSearchGrid.s
 export { createInfiniteLoader } from './components/infiniteGridLoader';
 export type { InfinitePage, InfiniteLoadContext, InfiniteLoadFn, InfiniteLoader, InfiniteLoaderState, InfiniteStatus } from './components/infiniteGridLoader';
 export { default as Button } from './components/Button.svelte';
+export { default as IconButton } from './components/IconButton.svelte';
+export type { IconButtonVariant, IconButtonSize } from './components/IconButton.svelte';
+export { default as CloseButton } from './components/CloseButton.svelte';
+export { default as LinkButton } from './components/LinkButton.svelte';
 export { default as Badge } from './components/Badge.svelte';
 export { default as Card } from './components/Card.svelte';
 export { default as Drawer } from './components/Drawer.svelte';
@@ -79,6 +87,8 @@ export { default as LoadingSpinner } from './components/LoadingSpinner.svelte';
 export { default as StatusBadge } from './components/StatusBadge.svelte';
 export { default as TextInput } from './components/TextInput.svelte';
 export { default as TextArea } from './components/TextArea.svelte';
+export { textareaRowsHeight } from './utils/textareaRows';
+export type { TextareaRowsInput } from './utils/textareaRows';
 export { default as SelectInput } from './components/SelectInput.svelte';
 export { default as PhoneInput } from './components/PhoneInput.svelte';
 export { default as AudioWaveform } from './components/AudioWaveform.svelte';
@@ -198,6 +208,8 @@ export type { MapJob, MapAgent } from './types/maps';
 export { loadGoogleMapsAPI, isGoogleMapsLoaded, isPlacesLoaded, isGeometryLoaded, } from './utils/googleMapsLoader';
 export { tooltip } from './actions/tooltip';
 export type { TooltipOptions } from './actions/tooltip';
+export { scrollEdge, edgeOpacity, edgeDistances } from './actions/scrollEdge';
+export type { ScrollEdgeOptions, ScrollEdgeSide } from './actions/scrollEdge';
 export { staggerEntrance } from './actions/staggerEntrance';
 export type { StaggerEntranceOptions } from './actions/staggerEntrance';
 export { attention } from './actions/attention';
@@ -205,12 +217,15 @@ export type { AttentionEffect, AttentionOptions } from './actions/attention';
 export { reveal, REVEAL_HIDDEN_CLASS, REVEAL_BASE_CLASS, REVEAL_OFF_SELECTOR, REVEAL_MAX_DELAY_SECONDS } from './actions/reveal';
 export type { RevealOptions, RevealVariant } from './actions/reveal';
 export { default as ThumbnailGrid } from './components/ThumbnailGrid.svelte';
+export { default as MediaExplorer } from "./components/MediaExplorer.svelte";
+export type { ExplorerSource } from "./components/MediaExplorer.svelte";
 export type { ThumbnailItem } from './components/ThumbnailGrid.svelte';
 export { floating, makeVirtualAnchor } from './actions/floating';
 export type { FloatingOptions, Placement } from './actions/floating';
 export { glide } from './transitions/glide';
 export type { GlideOrigin, GlideParams } from './transitions/glide';
-export { themeWipe } from './utils/themeWipe';
+export { themeWipe, wipeOrigin, coverRadius } from './utils/themeWipe';
+export type { ThemeWipeOptions } from './utils/themeWipe';
 export { viewTransition } from './utils/viewTransition';
 export { MOTION_LEVELS, DEFAULT_MOTION_LEVEL, MOTION_LEVEL_ATTR, MOTION_DURATIONS, MOTION_LEVEL_SCALE, MOTION_LEVEL_TRAVEL, MOTION_EASING_POINTS, isMotionLevel, parseMotionLevel, prefersReducedMotion, resolveMotionLevel, motionContextFor, getMotionContext, motionDuration, effectiveEasing, setMotionLevel, cubicBezier, motionEasing, motionFade, motionScale, motionSlide, resolveMotionTiming, createMotionLevelStore } from './motion';
 export type { MotionLevel, MotionDurationToken, MotionEasingToken, MotionContext, EasingFn, MotionTransitionParams, MotionTransitionConfig, MotionFadeParams, MotionScaleParams, MotionSlideParams, ResolvedMotionTiming, MotionState, MotionLevelStore, MotionLevelStoreOptions } from './motion';
@@ -234,6 +249,7 @@ export { default as AnimatedNumber } from './components/AnimatedNumber.svelte';
 export { default as CopyButton } from './components/CopyButton.svelte';
 export { default as HoldToConfirm } from './components/HoldToConfirm.svelte';
 export { default as PinInput } from './components/PinInput.svelte';
+export { applyCellInput as applyPinCellInput, distribute as distributePin, cellsFromValue as pinCellsFromValue, isPinComplete, sanitizePin } from './utils/pinInput';
 export { default as PasswordMeter } from './components/PasswordMeter.svelte';
 export { default as QuantityStepper } from './components/QuantityStepper.svelte';
 export { default as TypingIndicator } from './components/messaging/TypingIndicator.svelte';
@@ -255,6 +271,9 @@ export type { StickState, StickToBottomOptions, StickController } from './action
 export { ansiToHtml, ansiToHtmlStateful, ansiToHtmlWithLinks, ansiToHtmlWithHierarchy, linkifyUrls, stripAnsi, classifyLine, parseOutputLines, createDefaultAnsiState } from './utils/ansiToHtml';
 export type { AnsiState, ParsedLine } from './utils/ansiToHtml';
 export { default as Breadcrumb } from './components/basic/Breadcrumb.svelte';
+export type { BreadcrumbItem } from './components/basic/Breadcrumb.svelte';
+export { collapseBreadcrumb } from './components/basic/breadcrumbCollapse';
+export type { BreadcrumbSlot } from './components/basic/breadcrumbCollapse';
 export { default as Alert } from './components/basic/Alert.svelte';
 export { default as ButtonGroup } from './components/basic/ButtonGroup.svelte';
 export { default as Switch } from './components/basic/Switch.svelte';
@@ -304,3 +323,31 @@ export { mergeReviewCounts, summarizeReview, reviewSentence, buildReviewFilters,
 export type { ReviewTone, ReviewVerdictDef, ReviewCounts, ReviewRound, ReviewFilterChip, ReviewSummary, BuildFiltersInput } from './components/review/reviewSummary';
 export { MEDIA_ZOOM_KEYS, mediaZoomHint } from './components/review/mediaZoom';
 export type { MediaZoomState, MediaZoomView, MediaZoomFooterContext, MediaZoomAction, MediaZoomKeyDef, MediaZoomKeyContext } from './components/review/mediaZoom';
+export { default as ShimmerText } from './components/agent/ShimmerText.svelte';
+export { default as AgentThinking } from './components/agent/AgentThinking.svelte';
+export { formatThinkingTime } from './components/agent/agentThinking';
+export type { AgentThinkingVariant, AgentThinkingTone } from './components/agent/agentThinking';
+export { default as AgentLog } from './components/agent/AgentLog.svelte';
+export { default as AgentLogRow } from './components/agent/AgentLogRow.svelte';
+export { createRevealTicker } from './components/agent/revealTicker';
+export type { RevealTickerOptions, RevealTicker } from './components/agent/revealTicker';
+export { RevealCore, revealDelay, DEFAULT_STEP_INTERVAL as REVEAL_STEP_INTERVAL, DEFAULT_START_DELAY as REVEAL_START_DELAY } from './components/agent/revealCore';
+export type { RevealCoreOptions, RevealClock, RevealCoreHooks } from './components/agent/revealCore';
+export { BRANCH_Y as AGENT_LOG_BRANCH_Y } from './components/agent/agentLog';
+export { default as AgentTaskList } from './components/agent/AgentTaskList.svelte';
+export { countUnits as countAgentTaskUnits, layoutTaskReveal, displayStatus as agentTaskDisplayStatus, isListComplete as isAgentTaskListComplete, foldedByPolicy as agentTaskFoldedByPolicy, sourceStack as agentSourceStack, sourceDomain as agentSourceDomain, sourceLabel as agentSourceLabel } from './components/agent/agentTaskList';
+export type { AgentTask, AgentTaskStep, AgentTaskChip, AgentTaskSource, AgentTaskStatus, CollapsePolicy as AgentTaskCollapsePolicy, TaskReveal } from './components/agent/agentTaskList';
+export { default as Questionnaire } from './components/agent/Questionnaire.svelte';
+export { emptyAnswers as emptyQuestionnaireAnswers, normalizeAnswers as normalizeQuestionnaireAnswers, finalizeAnswers as finalizeQuestionnaireAnswers, isComplete as isQuestionnaireComplete, isAnswered as isQuestionAnswered, digitToRow as questionnaireDigitToRow } from './components/agent/questionnaire';
+export type { QuestionnaireQuestion, QuestionnaireOption, QuestionnaireAnswer, QuestionnaireAnswers } from './components/agent/questionnaire';
+export { default as ContextMeter } from './components/agent/ContextMeter.svelte';
+export { computeContextMeter, buildBreakdown as buildContextBreakdown, formatCompact as formatCompactTokens, formatPercent as formatContextPercent, segmentColor as contextSegmentColor, meterValueText as contextMeterValueText } from './components/agent/contextMeter';
+export type { ContextSegment, ContextGroup, ContextTone, ContextMeterModel, MeterSegment as ContextMeterSegment, BreakdownRow as ContextBreakdownRow } from './components/agent/contextMeter';
+export { default as ComposerGlow } from './components/agent/ComposerGlow.svelte';
+export { default as StreamedText } from './components/agent/StreamedText.svelte';
+export { splitStreamedText } from './components/agent/streamedText';
+export type { StreamedBlock, StreamedTextSplit } from './components/agent/streamedText';
+export { stepsSummary, stepsRemaining, isStepsFinished, clampStepProgress } from './components/progress/stepsSummary';
+export { default as NotificationCenter } from './components/NotificationCenter.svelte';
+export { DEFAULT_NOTIFICATION_TABS, DATE_GROUP_LABELS as NOTIFICATION_DATE_GROUP_LABELS, dateGroupKey as notificationDateGroupKey, groupNotificationsByDate, toTimestampMs as notificationTimestampMs, isNotificationUnread, unreadIds as unreadNotificationIds, filterByTab as filterNotificationsByTab, tabCounts as notificationTabCounts, unreadSummary as notificationUnreadSummary } from './components/notificationCenter';
+export type { NotificationItem, NotificationAction, NotificationTab, NotificationStatus, NotificationGroup, DateGroupKey as NotificationDateGroupKey } from './components/notificationCenter';

package/dist/index.js

@@ -93,6 +93,12 @@ export { default as SortDropdown } from './components/SortDropdown.svelte';
 export { default as InlineEdit } from './components/InlineEdit.svelte';
 export { default as FloatingActionBar } from './components/FloatingActionBar.svelte';
 export { default as BulkActionBar } from './components/BulkActionBar.svelte';
+// Click selection (qimg-x9ifp.1): the pointer-first multi-selection that feeds
+// BulkActionBar — click / Ctrl-⌘ click / Shift click ranges, Shift+arrows,
+// Ctrl/⌘ A, Esc. Pure rules in selection/clickSelection.ts (unit-tested), a
+// reactive SvelteSet controller in createClickSelection.svelte.ts.
+export { createClickSelection } from './selection/createClickSelection';
+export { applyClick as applySelectionClick, extendTo as extendSelectionTo, rangeBetween as selectionRange, selectionKey, isAdditive as isAdditiveClick } from './selection/clickSelection';
 export { default as HunkDiffView } from './components/HunkDiffView.svelte';
 // Primitives — accessibility + form-editor scaffolding
 export { default as Tooltip } from './components/Tooltip.svelte';
@@ -106,6 +112,10 @@ export { default as InfiniteSearchGrid } from './components/InfiniteSearchGrid.s
 export { createInfiniteLoader } from './components/infiniteGridLoader';
 // Components — from Flush
 export { default as Button } from './components/Button.svelte';
+// Icon-only / close / text-link buttons (BoardUI wave 1, jatui-owg2z)
+export { default as IconButton } from './components/IconButton.svelte';
+export { default as CloseButton } from './components/CloseButton.svelte';
+export { default as LinkButton } from './components/LinkButton.svelte';
 export { default as Badge } from './components/Badge.svelte';
 export { default as Card } from './components/Card.svelte';
 export { default as Drawer } from './components/Drawer.svelte';
@@ -114,6 +124,7 @@ export { default as LoadingSpinner } from './components/LoadingSpinner.svelte';
 export { default as StatusBadge } from './components/StatusBadge.svelte';
 export { default as TextInput } from './components/TextInput.svelte';
 export { default as TextArea } from './components/TextArea.svelte';
+export { textareaRowsHeight } from './utils/textareaRows';
 export { default as SelectInput } from './components/SelectInput.svelte';
 export { default as PhoneInput } from './components/PhoneInput.svelte';
 // Components — from Chimaro
@@ -239,6 +250,8 @@ export { loadGoogleMapsAPI, isGoogleMapsLoaded, isPlacesLoaded, isGeometryLoaded
 // ============================================================
 // Motion primitives
 export { tooltip } from './actions/tooltip';
+// Progressive-blur scroll-region edge (BoardUI wave 1, jatui-owg2z)
+export { scrollEdge, edgeOpacity, edgeDistances } from './actions/scrollEdge';
 export { staggerEntrance } from './actions/staggerEntrance';
 export { attention } from './actions/attention';
 // Scroll-reveal (jatui-m4uz3.3, chimaro port): IntersectionObserver
@@ -248,10 +261,11 @@ export { reveal, REVEAL_HIDDEN_CLASS, REVEAL_BASE_CLASS, REVEAL_OFF_SELECTOR, RE
 // Thumbnail grid (jatui-m4uz3.3, chimaro port): generic {id,url,alt} strip
 // with overflow counter, remove/add affordances and a cell snippet override.
 export { default as ThumbnailGrid } from './components/ThumbnailGrid.svelte';
+export { default as MediaExplorer } from "./components/MediaExplorer.svelte";
 export { floating, makeVirtualAnchor } from './actions/floating';
 export { glide } from './transitions/glide';
 // View Transitions kit
-export { themeWipe } from './utils/themeWipe';
+export { themeWipe, wipeOrigin, coverRadius } from './utils/themeWipe';
 export { viewTransition } from './utils/viewTransition';
 // Motion level kit (jatui-j6833): data-motion="calm|standard|lively" scales
 // the --motion-* tokens per surface (styles/motion.css); these helpers,
@@ -285,6 +299,7 @@ export { default as CopyButton } from './components/CopyButton.svelte';
 export { default as HoldToConfirm } from './components/HoldToConfirm.svelte';
 // Form gaps
 export { default as PinInput } from './components/PinInput.svelte';
+export { applyCellInput as applyPinCellInput, distribute as distributePin, cellsFromValue as pinCellsFromValue, isPinComplete, sanitizePin } from './utils/pinInput';
 export { default as PasswordMeter } from './components/PasswordMeter.svelte';
 export { default as QuantityStepper } from './components/QuantityStepper.svelte';
 // Messaging
@@ -314,6 +329,7 @@ export { createStickToBottom } from './actions/stickToBottom';
 // ANSI terminal output → HTML (upstreamed from the JAT IDE, U5 — jatui-rl7w6.3).
 export { ansiToHtml, ansiToHtmlStateful, ansiToHtmlWithLinks, ansiToHtmlWithHierarchy, linkifyUrls, stripAnsi, classifyLine, parseOutputLines, createDefaultAnsiState } from './utils/ansiToHtml';
 export { default as Breadcrumb } from './components/basic/Breadcrumb.svelte';
+export { collapseBreadcrumb } from './components/basic/breadcrumbCollapse';
 export { default as Alert } from './components/basic/Alert.svelte';
 export { default as ButtonGroup } from './components/basic/ButtonGroup.svelte';
 export { default as Switch } from './components/basic/Switch.svelte';
@@ -355,3 +371,25 @@ export { default as MediaZoomLightbox } from './components/review/MediaZoomLight
 export { reviewKeys, createReviewKeys, reviewKeyRows, resolveReviewKey, REVIEW_KEY_TABLE } from './actions/reviewKeys';
 export { mergeReviewCounts, summarizeReview, reviewSentence, buildReviewFilters, orderRounds, formatRoundDate } from './components/review/reviewSummary';
 export { MEDIA_ZOOM_KEYS, mediaZoomHint } from './components/review/mediaZoom';
+// Agent surfaces (BoardUI wave 2 — jatui-lltq9). Free BoardUI items are MIT
+// (THIRD_PARTY_NOTICES.md); Task List / Questionnaire / ContextMeter are clean-room.
+export { default as ShimmerText } from './components/agent/ShimmerText.svelte';
+export { default as AgentThinking } from './components/agent/AgentThinking.svelte';
+export { formatThinkingTime } from './components/agent/agentThinking';
+export { default as AgentLog } from './components/agent/AgentLog.svelte';
+export { default as AgentLogRow } from './components/agent/AgentLogRow.svelte';
+export { createRevealTicker } from './components/agent/revealTicker';
+export { RevealCore, revealDelay, DEFAULT_STEP_INTERVAL as REVEAL_STEP_INTERVAL, DEFAULT_START_DELAY as REVEAL_START_DELAY } from './components/agent/revealCore';
+export { BRANCH_Y as AGENT_LOG_BRANCH_Y } from './components/agent/agentLog';
+export { default as AgentTaskList } from './components/agent/AgentTaskList.svelte';
+export { countUnits as countAgentTaskUnits, layoutTaskReveal, displayStatus as agentTaskDisplayStatus, isListComplete as isAgentTaskListComplete, foldedByPolicy as agentTaskFoldedByPolicy, sourceStack as agentSourceStack, sourceDomain as agentSourceDomain, sourceLabel as agentSourceLabel } from './components/agent/agentTaskList';
+export { default as Questionnaire } from './components/agent/Questionnaire.svelte';
+export { emptyAnswers as emptyQuestionnaireAnswers, normalizeAnswers as normalizeQuestionnaireAnswers, finalizeAnswers as finalizeQuestionnaireAnswers, isComplete as isQuestionnaireComplete, isAnswered as isQuestionAnswered, digitToRow as questionnaireDigitToRow } from './components/agent/questionnaire';
+export { default as ContextMeter } from './components/agent/ContextMeter.svelte';
+export { computeContextMeter, buildBreakdown as buildContextBreakdown, formatCompact as formatCompactTokens, formatPercent as formatContextPercent, segmentColor as contextSegmentColor, meterValueText as contextMeterValueText } from './components/agent/contextMeter';
+export { default as ComposerGlow } from './components/agent/ComposerGlow.svelte';
+export { default as StreamedText } from './components/agent/StreamedText.svelte';
+export { splitStreamedText } from './components/agent/streamedText';
+export { stepsSummary, stepsRemaining, isStepsFinished, clampStepProgress } from './components/progress/stepsSummary';
+export { default as NotificationCenter } from './components/NotificationCenter.svelte';
+export { DEFAULT_NOTIFICATION_TABS, DATE_GROUP_LABELS as NOTIFICATION_DATE_GROUP_LABELS, dateGroupKey as notificationDateGroupKey, groupNotificationsByDate, toTimestampMs as notificationTimestampMs, isNotificationUnread, unreadIds as unreadNotificationIds, filterByTab as filterNotificationsByTab, tabCounts as notificationTabCounts, unreadSummary as notificationUnreadSummary } from './components/notificationCenter';

package/dist/selection/clickSelection.d.ts

@@ -0,0 +1,89 @@
+/**
+ * Pointer-first multi-selection: the desktop-standard click rules, as pure
+ * functions over a plain `Set` (a `SvelteSet` is a `Set`, so the reactive
+ * controller in `createClickSelection.svelte.ts` runs exactly this code).
+ *
+ *   click            select only this one; it becomes the anchor
+ *   Ctrl/⌘ click     toggle this one; it becomes the anchor
+ *   Shift click      select the range anchor..this, in the current id order
+ *                    (replaces the selection; the anchor stays put)
+ *   Shift Ctrl/⌘     add the range anchor..this to the selection
+ *   Shift arrows     extend from the anchor (the caller says which id an
+ *                    arrow lands on, because only it knows the layout)
+ *   Ctrl/⌘ A         select every id
+ *   Esc              clear
+ *
+ * The selection is a set of ids, not of positions: re-sorting, filtering or
+ * live inserts keep it, and an id that is no longer in `ids` is simply not
+ * selected any more (`prune` drops it, the readers filter it out first).
+ *
+ * `head` is the moving end of the last range (the last id clicked or
+ * extended to), so Shift+arrows keep growing from where they left off.
+ *
+ * No DOM, no Svelte: unit-tested in tests/unit/clickSelection.test.ts.
+ */
+/** The modifier keys of a click (a MouseEvent or KeyboardEvent satisfies it). */
+export interface SelectionModifiers {
+    shiftKey?: boolean;
+    ctrlKey?: boolean;
+    metaKey?: boolean;
+}
+/** What a selection is: the set, plus the fixed and the moving end of a range. */
+export interface SelectionState<Id = string> {
+    selected: Set<Id>;
+    anchor: Id | null;
+    head: Id | null;
+}
+/** Ctrl on Linux/Windows, ⌘ on macOS: either counts as "toggle / add". */
+export declare const isAdditive: (m: SelectionModifiers) => boolean;
+/** The ids from `a` to `b` inclusive, in `ids` order (either direction). Empty when either is missing. */
+export declare function rangeBetween<Id>(ids: readonly Id[], a: Id, b: Id): Id[];
+/** Select only `id` and make it the anchor (a plain click, or a plain arrow move). */
+export declare function selectOnly<Id>(s: SelectionState<Id>, id: Id): void;
+/** Toggle `id` and make it the anchor (Ctrl/⌘ click). */
+export declare function toggleOne<Id>(s: SelectionState<Id>, id: Id): void;
+/**
+ * Select the range from the anchor to `id` (Shift click / Shift arrows).
+ * `additive` keeps what was selected and adds the range (Shift+Ctrl/⌘).
+ * With no usable anchor (none yet, or it vanished) it behaves as a plain
+ * click on `id` (or a toggle-on when additive).
+ */
+export declare function extendTo<Id>(s: SelectionState<Id>, ids: readonly Id[], id: Id, additive?: boolean): void;
+/** Apply one click on `id` with its modifiers. Ids not in `ids` are ignored. */
+export declare function applyClick<Id>(s: SelectionState<Id>, ids: readonly Id[], id: Id, m?: SelectionModifiers): void;
+/** Select every id (Ctrl/⌘ A). The anchor stays if it is still there, else the first id. */
+export declare function selectAll<Id>(s: SelectionState<Id>, ids: readonly Id[]): void;
+/** Clear the selection and the range ends (Esc). */
+export declare function clearSelection<Id>(s: SelectionState<Id>): void;
+/** Drop selected ids that are no longer in `ids` (and an anchor or head that vanished). True when anything changed. */
+export declare function prune<Id>(s: SelectionState<Id>, ids: readonly Id[]): boolean;
+/** The selected ids that are still present, in `ids` order (what a range or a list shows). */
+export declare const inOrder: <Id>(selected: ReadonlySet<Id>, ids: readonly Id[]) => Id[];
+/** The selected ids that are still present, in the order they were selected (Set insertion order). */
+export declare function inPickOrder<Id>(selected: ReadonlySet<Id>, ids: readonly Id[]): Id[];
+/** The keyboard part of a keydown (a KeyboardEvent satisfies it). */
+export interface SelectionKeyEvent extends SelectionModifiers {
+    key: string;
+    altKey?: boolean;
+    target?: EventTarget | null;
+    defaultPrevented?: boolean;
+}
+export declare const ARROW_KEYS: readonly ["ArrowUp", "ArrowDown", "ArrowLeft", "ArrowRight"];
+export type ArrowKey = (typeof ARROW_KEYS)[number];
+/** What a selection key does, decided without touching anything. */
+export type SelectionKeyAction = {
+    kind: 'selectAll';
+} | {
+    kind: 'clear';
+} | {
+    kind: 'extend';
+    key: ArrowKey;
+    additive: boolean;
+};
+/**
+ * Which selection key this is, if any: Ctrl/⌘ A (select all), Esc (clear,
+ * only while something is selected, so Esc keeps its other meanings when
+ * nothing is), Shift+arrows (extend; with Ctrl/⌘ too, add the range).
+ * Never while typing in a field, never with Alt, never when already handled.
+ */
+export declare function selectionKey(e: SelectionKeyEvent, hasSelection: boolean): SelectionKeyAction | null;

package/dist/selection/clickSelection.js

@@ -0,0 +1,152 @@
+/**
+ * Pointer-first multi-selection: the desktop-standard click rules, as pure
+ * functions over a plain `Set` (a `SvelteSet` is a `Set`, so the reactive
+ * controller in `createClickSelection.svelte.ts` runs exactly this code).
+ *
+ *   click            select only this one; it becomes the anchor
+ *   Ctrl/⌘ click     toggle this one; it becomes the anchor
+ *   Shift click      select the range anchor..this, in the current id order
+ *                    (replaces the selection; the anchor stays put)
+ *   Shift Ctrl/⌘     add the range anchor..this to the selection
+ *   Shift arrows     extend from the anchor (the caller says which id an
+ *                    arrow lands on, because only it knows the layout)
+ *   Ctrl/⌘ A         select every id
+ *   Esc              clear
+ *
+ * The selection is a set of ids, not of positions: re-sorting, filtering or
+ * live inserts keep it, and an id that is no longer in `ids` is simply not
+ * selected any more (`prune` drops it, the readers filter it out first).
+ *
+ * `head` is the moving end of the last range (the last id clicked or
+ * extended to), so Shift+arrows keep growing from where they left off.
+ *
+ * No DOM, no Svelte: unit-tested in tests/unit/clickSelection.test.ts.
+ */
+import { isTypingTarget } from '../utils/keyboardShortcutRegistry';
+/** Ctrl on Linux/Windows, ⌘ on macOS: either counts as "toggle / add". */
+export const isAdditive = (m) => !!(m.ctrlKey || m.metaKey);
+/** The ids from `a` to `b` inclusive, in `ids` order (either direction). Empty when either is missing. */
+export function rangeBetween(ids, a, b) {
+    const i = ids.indexOf(a);
+    const j = ids.indexOf(b);
+    if (i < 0 || j < 0)
+        return [];
+    return i <= j ? ids.slice(i, j + 1) : ids.slice(j, i + 1);
+}
+/** Select only `id` and make it the anchor (a plain click, or a plain arrow move). */
+export function selectOnly(s, id) {
+    s.selected.clear();
+    s.selected.add(id);
+    s.anchor = id;
+    s.head = id;
+}
+/** Toggle `id` and make it the anchor (Ctrl/⌘ click). */
+export function toggleOne(s, id) {
+    if (s.selected.has(id))
+        s.selected.delete(id);
+    else
+        s.selected.add(id);
+    s.anchor = id;
+    s.head = id;
+}
+/**
+ * Select the range from the anchor to `id` (Shift click / Shift arrows).
+ * `additive` keeps what was selected and adds the range (Shift+Ctrl/⌘).
+ * With no usable anchor (none yet, or it vanished) it behaves as a plain
+ * click on `id` (or a toggle-on when additive).
+ */
+export function extendTo(s, ids, id, additive = false) {
+    if (!ids.includes(id))
+        return;
+    const anchor = s.anchor !== null && ids.includes(s.anchor) ? s.anchor : null;
+    if (anchor === null) {
+        if (additive) {
+            s.selected.add(id);
+            s.anchor = id;
+            s.head = id;
+        }
+        else
+            selectOnly(s, id);
+        return;
+    }
+    const range = rangeBetween(ids, anchor, id);
+    if (!additive)
+        s.selected.clear();
+    for (const x of range)
+        s.selected.add(x);
+    s.head = id;
+}
+/** Apply one click on `id` with its modifiers. Ids not in `ids` are ignored. */
+export function applyClick(s, ids, id, m = {}) {
+    if (!ids.includes(id))
+        return;
+    prune(s, ids);
+    if (m.shiftKey)
+        return extendTo(s, ids, id, isAdditive(m));
+    if (isAdditive(m))
+        return toggleOne(s, id);
+    selectOnly(s, id);
+}
+/** Select every id (Ctrl/⌘ A). The anchor stays if it is still there, else the first id. */
+export function selectAll(s, ids) {
+    s.selected.clear();
+    for (const x of ids)
+        s.selected.add(x);
+    if (s.anchor === null || !ids.includes(s.anchor))
+        s.anchor = ids[0] ?? null;
+    s.head = ids.at(-1) ?? null;
+}
+/** Clear the selection and the range ends (Esc). */
+export function clearSelection(s) {
+    s.selected.clear();
+    s.anchor = null;
+    s.head = null;
+}
+/** Drop selected ids that are no longer in `ids` (and an anchor or head that vanished). True when anything changed. */
+export function prune(s, ids) {
+    const present = new Set(ids);
+    let changed = false;
+    for (const x of [...s.selected]) {
+        if (!present.has(x)) {
+            s.selected.delete(x);
+            changed = true;
+        }
+    }
+    if (s.anchor !== null && !present.has(s.anchor)) {
+        s.anchor = null;
+        changed = true;
+    }
+    if (s.head !== null && !present.has(s.head)) {
+        s.head = null;
+        changed = true;
+    }
+    return changed;
+}
+/** The selected ids that are still present, in `ids` order (what a range or a list shows). */
+export const inOrder = (selected, ids) => ids.filter((x) => selected.has(x));
+/** The selected ids that are still present, in the order they were selected (Set insertion order). */
+export function inPickOrder(selected, ids) {
+    const present = new Set(ids);
+    return [...selected].filter((x) => present.has(x));
+}
+export const ARROW_KEYS = ['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight'];
+/**
+ * Which selection key this is, if any: Ctrl/⌘ A (select all), Esc (clear,
+ * only while something is selected, so Esc keeps its other meanings when
+ * nothing is), Shift+arrows (extend; with Ctrl/⌘ too, add the range).
+ * Never while typing in a field, never with Alt, never when already handled.
+ */
+export function selectionKey(e, hasSelection) {
+    if (e.defaultPrevented || e.altKey)
+        return null;
+    if (isTypingTarget(e.target ?? null))
+        return null;
+    const mod = isAdditive(e);
+    if (mod && !e.shiftKey && (e.key === 'a' || e.key === 'A'))
+        return { kind: 'selectAll' };
+    if (e.key === 'Escape' && !mod && !e.shiftKey)
+        return hasSelection ? { kind: 'clear' } : null;
+    if (e.shiftKey && ARROW_KEYS.includes(e.key))
+        return { kind: 'extend', key: e.key, additive: mod };
+    return null;
+}

package/dist/selection/createClickSelection.d.ts

@@ -0,0 +1,79 @@
+/**
+ * createClickSelection: a reactive multi-selection for grids and lists that are
+ * used with the mouse (Shift-click ranges, Ctrl/⌘-click toggles) and the
+ * keyboard (Shift+arrows, Ctrl/⌘ A, Esc). The rules live in `clickSelection.ts`
+ * (pure, unit-tested); this wraps them in a `SvelteSet` plus `$state` ends so a
+ * component re-renders when the selection changes.
+ *
+ * Usage:
+ *
+ *     const sel = createClickSelection({ ids: () => items.map((i) => i.id) });
+ *
+ *     {#each items as item (item.id)}
+ *       <button class:selected={sel.has(item.id)} onclick={(e) => sel.click(item.id, e)}>…</button>
+ *     {/each}
+ *
+ *     <svelte:window onkeydown={(e) => sel.handleKeydown(e, { next: (from, key) => neighbour(from, key) })} />
+ *
+ *     <BulkActionBar selection={sel.ordered} actions={…} onClear={() => sel.clear()} />
+ *
+ * `ids()` is read on every call, in display order, so ranges always follow
+ * what is on screen; ids that left it are never reported (`ordered`,
+ * `picked`, `count`) and are dropped from the set on the next change.
+ *
+ * With listNav: listNav is the keyboard-only list motion (j/k, vim counts) and
+ * has its own opt-in selection (x, V, Shift+J/K). Give a surface ONE selection
+ * owner. A pointer-first grid uses clickSelection; a keyboard-first list uses
+ * listNav's. To have both, run listNav with `selectable: false` for focus
+ * motion and let clickSelection own the set: call `sel.click(id, e)` from the
+ * click handler and `sel.extendTo(id)` from your own Shift+J/K.
+ */
+import { SvelteSet } from 'svelte/reactivity';
+import { type ArrowKey, type SelectionKeyEvent, type SelectionModifiers } from './clickSelection';
+export interface ClickSelectionOptions<Id = string> {
+    /** Every selectable id, in the order shown. Read lazily on each call. */
+    ids: () => readonly Id[];
+    /** Called after every change, with the selection in display order. */
+    onChange?: (ordered: Id[]) => void;
+}
+export interface ClickSelectionKeyOptions<Id = string> {
+    /**
+     * Where an arrow lands from `from` (null: the selection has no moving end
+     * yet). Return null to do nothing (an edge). Only the caller knows the
+     * layout (a grid's row above, a list's next item), so it decides.
+     */
+    next?: (from: Id | null, key: ArrowKey) => Id | null;
+}
+export interface ClickSelection<Id = string> {
+    /** The raw set (may briefly hold an id that just left `ids`; prefer `ordered`). */
+    readonly selected: SvelteSet<Id>;
+    /** The fixed end of a range: the last plain or Ctrl/⌘ click. */
+    readonly anchor: Id | null;
+    /** The moving end: the last id clicked or extended to. */
+    readonly head: Id | null;
+    /** Selected and still present, in display order. */
+    readonly ordered: Id[];
+    /** Selected and still present, in the order they were picked. */
+    readonly picked: Id[];
+    /** How many are selected and present. */
+    readonly count: number;
+    has(id: Id): boolean;
+    /** Apply a click with its modifiers (MouseEvent works as is). */
+    click(id: Id, mods?: SelectionModifiers): void;
+    /** Select only this one (a plain click or a plain arrow move). */
+    only(id: Id): void;
+    /** Toggle one (Ctrl/⌘ click, or an "x" key). */
+    toggle(id: Id): void;
+    /** Range from the anchor to `id`; `additive` keeps the rest. */
+    extendTo(id: Id, additive?: boolean): void;
+    selectAll(): void;
+    clear(): void;
+    /** Drop ids no longer in `ids()`. Every other method does this first. */
+    prune(): void;
+    /**
+     * Ctrl/⌘ A, Esc (while something is selected) and Shift+arrows (with
+     * `next`). Returns true and prevents the default when it handled the key.
+     */
+    handleKeydown(e: KeyboardEvent | SelectionKeyEvent, opts?: ClickSelectionKeyOptions<Id>): boolean;
+}
+export declare function createClickSelection<Id = string>(options: ClickSelectionOptions<Id>): ClickSelection<Id>;