react-msaview 8.3.0 → 8.4.1

package/dist/components/header/ColorSchemeMenu.js

@@ -3,16 +3,34 @@ import CascadingMenuButton from '@jbrowse/core/ui/CascadingMenuButton';
 import Palette from '@mui/icons-material/Palette';
 import { observer } from 'mobx-react';
 import colorSchemes from '../../colorSchemes.js';
-const ColorSchemeMenu = observer(function ({ model }) {
-    const { colorSchemeName } = model;
-    return (React.createElement(CascadingMenuButton, { "data-testid": "color_scheme_menu", tooltip: "Color scheme", closeAfterItemClick: true, anchorOrigin: { vertical: 'bottom', horizontal: 'left' }, transformOrigin: { vertical: 'top', horizontal: 'left' }, menuItems: Object.keys(colorSchemes).map(option => ({
+// While a `customColorScheme` map is set, a checked Custom entry stands for it
+// and no named scheme is checked. Picking a named scheme clears the map.
+export function colorSchemeMenuItems(model) {
+    const { colorSchemeName, customColorScheme } = model;
+    const custom = customColorScheme
+        ? [
+            {
+                label: 'Custom',
+                type: 'radio',
+                checked: true,
+                onClick: () => { },
+            },
+        ]
+        : [];
+    return [
+        ...custom,
+        ...Object.keys(colorSchemes).map(option => ({
             label: option,
             type: 'radio',
-            checked: colorSchemeName === option,
+            checked: !customColorScheme && colorSchemeName === option,
             onClick: () => {
                 model.setColorSchemeName(option);
             },
-        })) },
+        })),
+    ];
+}
+const ColorSchemeMenu = observer(function ({ model }) {
+    return (React.createElement(CascadingMenuButton, { "data-testid": "color_scheme_menu", tooltip: "Color scheme", closeAfterItemClick: true, anchorOrigin: { vertical: 'bottom', horizontal: 'left' }, transformOrigin: { vertical: 'top', horizontal: 'left' }, menuItems: colorSchemeMenuItems(model) },
         React.createElement(Palette, null)));
 });
 export default ColorSchemeMenu;

package/dist/components/header/ColorSchemeMenu.js.map

@@ -1 +1 @@
-{"version":3,"file":"ColorSchemeMenu.js","sourceRoot":"","sources":["../../../src/components/header/ColorSchemeMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,mBAAmB,MAAM,sCAAsC,CAAA;AACtE,OAAO,OAAO,MAAM,6BAA6B,CAAA;AACjD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,OAAO,YAAY,MAAM,uBAAuB,CAAA;AAIhD,MAAM,eAAe,GAAG,QAAQ,CAAC,UAAU,EAAE,KAAK,EAA2B;IAC3E,MAAM,EAAE,eAAe,EAAE,GAAG,KAAK,CAAA;IACjC,OAAO,CACL,oBAAC,mBAAmB,mBACN,mBAAmB,EAC/B,OAAO,EAAC,cAAc,EACtB,mBAAmB,QACnB,YAAY,EAAE,EAAE,QAAQ,EAAE,QAAQ,EAAE,UAAU,EAAE,MAAM,EAAE,EACxD,eAAe,EAAE,EAAE,QAAQ,EAAE,KAAK,EAAE,UAAU,EAAE,MAAM,EAAE,EACxD,SAAS,EAAE,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,GAAG,CACtC,MAAM,CAAC,EAAE,CACP,CAAC;YACC,KAAK,EAAE,MAAM;YACb,IAAI,EAAE,OAAO;YACb,OAAO,EAAE,eAAe,KAAK,MAAM;YACnC,OAAO,EAAE,GAAG,EAAE;gBACZ,KAAK,CAAC,kBAAkB,CAAC,MAAM,CAAC,CAAA;YAClC,CAAC;SACF,CAAU,CACd;QAED,oBAAC,OAAO,OAAG,CACS,CACvB,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,eAAe,CAAA"}
+{"version":3,"file":"ColorSchemeMenu.js","sourceRoot":"","sources":["../../../src/components/header/ColorSchemeMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,mBAAmB,MAAM,sCAAsC,CAAA;AACtE,OAAO,OAAO,MAAM,6BAA6B,CAAA;AACjD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,OAAO,YAAY,MAAM,uBAAuB,CAAA;AAIhD,+EAA+E;AAC/E,yEAAyE;AACzE,MAAM,UAAU,oBAAoB,CAAC,KAAmB;IACtD,MAAM,EAAE,eAAe,EAAE,iBAAiB,EAAE,GAAG,KAAK,CAAA;IACpD,MAAM,MAAM,GAAG,iBAAiB;QAC9B,CAAC,CAAC;YACE;gBACE,KAAK,EAAE,QAAQ;gBACf,IAAI,EAAE,OAAO;gBACb,OAAO,EAAE,IAAI;gBACb,OAAO,EAAE,GAAG,EAAE,GAAE,CAAC;aACT;SACX;QACH,CAAC,CAAC,EAAE,CAAA;IACN,OAAO;QACL,GAAG,MAAM;QACT,GAAG,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,GAAG,CAC9B,MAAM,CAAC,EAAE,CACP,CAAC;YACC,KAAK,EAAE,MAAM;YACb,IAAI,EAAE,OAAO;YACb,OAAO,EAAE,CAAC,iBAAiB,IAAI,eAAe,KAAK,MAAM;YACzD,OAAO,EAAE,GAAG,EAAE;gBACZ,KAAK,CAAC,kBAAkB,CAAC,MAAM,CAAC,CAAA;YAClC,CAAC;SACF,CAAU,CACd;KACF,CAAA;AACH,CAAC;AAED,MAAM,eAAe,GAAG,QAAQ,CAAC,UAAU,EAAE,KAAK,EAA2B;IAC3E,OAAO,CACL,oBAAC,mBAAmB,mBACN,mBAAmB,EAC/B,OAAO,EAAC,cAAc,EACtB,mBAAmB,QACnB,YAAY,EAAE,EAAE,QAAQ,EAAE,QAAQ,EAAE,UAAU,EAAE,MAAM,EAAE,EACxD,eAAe,EAAE,EAAE,QAAQ,EAAE,KAAK,EAAE,UAAU,EAAE,MAAM,EAAE,EACxD,SAAS,EAAE,oBAAoB,CAAC,KAAK,CAAC;QAEtC,oBAAC,OAAO,OAAG,CACS,CACvB,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,eAAe,CAAA"}

package/dist/components/header/GoToBox.d.ts

@@ -0,0 +1,338 @@
+import React from 'react';
+import type { MsaViewModel } from '../../model.ts';
+import type { AutocompleteRenderInputParams } from '@mui/material';
+export declare function labelledInput(params: AutocompleteRenderInputParams): {
+    slotProps: {
+        inputLabel: ReturnType<ReturnType<typeof import("@mui/material").useAutocomplete>['getInputLabelProps']>;
+        input: {
+            ref: React.Ref<any>;
+            className: string;
+            startAdornment: React.ReactNode;
+            endAdornment: React.ReactNode;
+            onMouseDown: React.MouseEventHandler;
+        };
+        htmlInput: {
+            children?: React.ReactNode | undefined;
+            dangerouslySetInnerHTML?: {
+                __html: string | TrustedHTML;
+            } | undefined;
+            onCopy?: React.ClipboardEventHandler<HTMLInputElement> | undefined;
+            onCopyCapture?: React.ClipboardEventHandler<HTMLInputElement> | undefined;
+            onCut?: React.ClipboardEventHandler<HTMLInputElement> | undefined;
+            onCutCapture?: React.ClipboardEventHandler<HTMLInputElement> | undefined;
+            onPaste?: React.ClipboardEventHandler<HTMLInputElement> | undefined;
+            onPasteCapture?: React.ClipboardEventHandler<HTMLInputElement> | undefined;
+            onCompositionEnd?: React.CompositionEventHandler<HTMLInputElement> | undefined;
+            onCompositionEndCapture?: React.CompositionEventHandler<HTMLInputElement> | undefined;
+            onCompositionStart?: React.CompositionEventHandler<HTMLInputElement> | undefined;
+            onCompositionStartCapture?: React.CompositionEventHandler<HTMLInputElement> | undefined;
+            onCompositionUpdate?: React.CompositionEventHandler<HTMLInputElement> | undefined;
+            onCompositionUpdateCapture?: React.CompositionEventHandler<HTMLInputElement> | undefined;
+            onFocus?: React.FocusEventHandler<HTMLInputElement> | undefined;
+            onFocusCapture?: React.FocusEventHandler<HTMLInputElement> | undefined;
+            onBlur?: React.FocusEventHandler<HTMLInputElement> | undefined;
+            onBlurCapture?: React.FocusEventHandler<HTMLInputElement> | undefined;
+            onChangeCapture?: React.ChangeEventHandler<HTMLInputElement, Element> | undefined;
+            onBeforeInput?: React.InputEventHandler<HTMLInputElement> | undefined;
+            onBeforeInputCapture?: React.InputEventHandler<HTMLInputElement> | undefined;
+            onInput?: React.InputEventHandler<HTMLInputElement> | undefined;
+            onInputCapture?: React.InputEventHandler<HTMLInputElement> | undefined;
+            onReset?: React.ReactEventHandler<HTMLInputElement> | undefined;
+            onResetCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
+            onSubmit?: React.SubmitEventHandler<HTMLInputElement> | undefined;
+            onSubmitCapture?: React.SubmitEventHandler<HTMLInputElement> | undefined;
+            onInvalid?: React.ReactEventHandler<HTMLInputElement> | undefined;
+            onInvalidCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
+            onLoad?: React.ReactEventHandler<HTMLInputElement> | undefined;
+            onLoadCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
+            onError?: React.ReactEventHandler<HTMLInputElement> | undefined;
+            onErrorCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
+            onKeyDown?: React.KeyboardEventHandler<HTMLInputElement> | undefined;
+            onKeyDownCapture?: React.KeyboardEventHandler<HTMLInputElement> | undefined;
+            onKeyPress?: React.KeyboardEventHandler<HTMLInputElement> | undefined;
+            onKeyPressCapture?: React.KeyboardEventHandler<HTMLInputElement> | undefined;
+            onKeyUp?: React.KeyboardEventHandler<HTMLInputElement> | undefined;
+            onKeyUpCapture?: React.KeyboardEventHandler<HTMLInputElement> | undefined;
+            onAbort?: React.ReactEventHandler<HTMLInputElement> | undefined;
+            onAbortCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
+            onCanPlay?: React.ReactEventHandler<HTMLInputElement> | undefined;
+            onCanPlayCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
+            onCanPlayThrough?: React.ReactEventHandler<HTMLInputElement> | undefined;
+            onCanPlayThroughCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
+            onDurationChange?: React.ReactEventHandler<HTMLInputElement> | undefined;
+            onDurationChangeCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
+            onEmptied?: React.ReactEventHandler<HTMLInputElement> | undefined;
+            onEmptiedCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
+            onEncrypted?: React.ReactEventHandler<HTMLInputElement> | undefined;
+            onEncryptedCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
+            onEnded?: React.ReactEventHandler<HTMLInputElement> | undefined;
+            onEndedCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
+            onLoadedData?: React.ReactEventHandler<HTMLInputElement> | undefined;
+            onLoadedDataCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
+            onLoadedMetadata?: React.ReactEventHandler<HTMLInputElement> | undefined;
+            onLoadedMetadataCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
+            onLoadStart?: React.ReactEventHandler<HTMLInputElement> | undefined;
+            onLoadStartCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
+            onPause?: React.ReactEventHandler<HTMLInputElement> | undefined;
+            onPauseCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
+            onPlay?: React.ReactEventHandler<HTMLInputElement> | undefined;
+            onPlayCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
+            onPlaying?: React.ReactEventHandler<HTMLInputElement> | undefined;
+            onPlayingCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
+            onProgress?: React.ReactEventHandler<HTMLInputElement> | undefined;
+            onProgressCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
+            onRateChange?: React.ReactEventHandler<HTMLInputElement> | undefined;
+            onRateChangeCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
+            onSeeked?: React.ReactEventHandler<HTMLInputElement> | undefined;
+            onSeekedCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
+            onSeeking?: React.ReactEventHandler<HTMLInputElement> | undefined;
+            onSeekingCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
+            onStalled?: React.ReactEventHandler<HTMLInputElement> | undefined;
+            onStalledCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
+            onSuspend?: React.ReactEventHandler<HTMLInputElement> | undefined;
+            onSuspendCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
+            onTimeUpdate?: React.ReactEventHandler<HTMLInputElement> | undefined;
+            onTimeUpdateCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
+            onVolumeChange?: React.ReactEventHandler<HTMLInputElement> | undefined;
+            onVolumeChangeCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
+            onWaiting?: React.ReactEventHandler<HTMLInputElement> | undefined;
+            onWaitingCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
+            onAuxClick?: React.MouseEventHandler<HTMLInputElement> | undefined;
+            onAuxClickCapture?: React.MouseEventHandler<HTMLInputElement> | undefined;
+            onClick?: React.MouseEventHandler<HTMLInputElement> | undefined;
+            onClickCapture?: React.MouseEventHandler<HTMLInputElement> | undefined;
+            onContextMenu?: React.MouseEventHandler<HTMLInputElement> | undefined;
+            onContextMenuCapture?: React.MouseEventHandler<HTMLInputElement> | undefined;
+            onDoubleClick?: React.MouseEventHandler<HTMLInputElement> | undefined;
+            onDoubleClickCapture?: React.MouseEventHandler<HTMLInputElement> | undefined;
+            onDrag?: React.DragEventHandler<HTMLInputElement> | undefined;
+            onDragCapture?: React.DragEventHandler<HTMLInputElement> | undefined;
+            onDragEnd?: React.DragEventHandler<HTMLInputElement> | undefined;
+            onDragEndCapture?: React.DragEventHandler<HTMLInputElement> | undefined;
+            onDragEnter?: React.DragEventHandler<HTMLInputElement> | undefined;
+            onDragEnterCapture?: React.DragEventHandler<HTMLInputElement> | undefined;
+            onDragExit?: React.DragEventHandler<HTMLInputElement> | undefined;
+            onDragExitCapture?: React.DragEventHandler<HTMLInputElement> | undefined;
+            onDragLeave?: React.DragEventHandler<HTMLInputElement> | undefined;
+            onDragLeaveCapture?: React.DragEventHandler<HTMLInputElement> | undefined;
+            onDragOver?: React.DragEventHandler<HTMLInputElement> | undefined;
+            onDragOverCapture?: React.DragEventHandler<HTMLInputElement> | undefined;
+            onDragStart?: React.DragEventHandler<HTMLInputElement> | undefined;
+            onDragStartCapture?: React.DragEventHandler<HTMLInputElement> | undefined;
+            onDrop?: React.DragEventHandler<HTMLInputElement> | undefined;
+            onDropCapture?: React.DragEventHandler<HTMLInputElement> | undefined;
+            onMouseDown?: React.MouseEventHandler<HTMLInputElement> | undefined;
+            onMouseDownCapture?: React.MouseEventHandler<HTMLInputElement> | undefined;
+            onMouseEnter?: React.MouseEventHandler<HTMLInputElement> | undefined;
+            onMouseLeave?: React.MouseEventHandler<HTMLInputElement> | undefined;
+            onMouseMove?: React.MouseEventHandler<HTMLInputElement> | undefined;
+            onMouseMoveCapture?: React.MouseEventHandler<HTMLInputElement> | undefined;
+            onMouseOut?: React.MouseEventHandler<HTMLInputElement> | undefined;
+            onMouseOutCapture?: React.MouseEventHandler<HTMLInputElement> | undefined;
+            onMouseOver?: React.MouseEventHandler<HTMLInputElement> | undefined;
+            onMouseOverCapture?: React.MouseEventHandler<HTMLInputElement> | undefined;
+            onMouseUp?: React.MouseEventHandler<HTMLInputElement> | undefined;
+            onMouseUpCapture?: React.MouseEventHandler<HTMLInputElement> | undefined;
+            onSelect?: React.ReactEventHandler<HTMLInputElement> | undefined;
+            onSelectCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
+            onTouchCancel?: React.TouchEventHandler<HTMLInputElement> | undefined;
+            onTouchCancelCapture?: React.TouchEventHandler<HTMLInputElement> | undefined;
+            onTouchEnd?: React.TouchEventHandler<HTMLInputElement> | undefined;
+            onTouchEndCapture?: React.TouchEventHandler<HTMLInputElement> | undefined;
+            onTouchMove?: React.TouchEventHandler<HTMLInputElement> | undefined;
+            onTouchMoveCapture?: React.TouchEventHandler<HTMLInputElement> | undefined;
+            onTouchStart?: React.TouchEventHandler<HTMLInputElement> | undefined;
+            onTouchStartCapture?: React.TouchEventHandler<HTMLInputElement> | undefined;
+            onPointerDown?: React.PointerEventHandler<HTMLInputElement> | undefined;
+            onPointerDownCapture?: React.PointerEventHandler<HTMLInputElement> | undefined;
+            onPointerMove?: React.PointerEventHandler<HTMLInputElement> | undefined;
+            onPointerMoveCapture?: React.PointerEventHandler<HTMLInputElement> | undefined;
+            onPointerUp?: React.PointerEventHandler<HTMLInputElement> | undefined;
+            onPointerUpCapture?: React.PointerEventHandler<HTMLInputElement> | undefined;
+            onPointerCancel?: React.PointerEventHandler<HTMLInputElement> | undefined;
+            onPointerCancelCapture?: React.PointerEventHandler<HTMLInputElement> | undefined;
+            onPointerEnter?: React.PointerEventHandler<HTMLInputElement> | undefined;
+            onPointerLeave?: React.PointerEventHandler<HTMLInputElement> | undefined;
+            onPointerOver?: React.PointerEventHandler<HTMLInputElement> | undefined;
+            onPointerOverCapture?: React.PointerEventHandler<HTMLInputElement> | undefined;
+            onPointerOut?: React.PointerEventHandler<HTMLInputElement> | undefined;
+            onPointerOutCapture?: React.PointerEventHandler<HTMLInputElement> | undefined;
+            onGotPointerCapture?: React.PointerEventHandler<HTMLInputElement> | undefined;
+            onGotPointerCaptureCapture?: React.PointerEventHandler<HTMLInputElement> | undefined;
+            onLostPointerCapture?: React.PointerEventHandler<HTMLInputElement> | undefined;
+            onLostPointerCaptureCapture?: React.PointerEventHandler<HTMLInputElement> | undefined;
+            onScroll?: React.UIEventHandler<HTMLInputElement> | undefined;
+            onScrollCapture?: React.UIEventHandler<HTMLInputElement> | undefined;
+            onScrollEnd?: React.UIEventHandler<HTMLInputElement> | undefined;
+            onScrollEndCapture?: React.UIEventHandler<HTMLInputElement> | undefined;
+            onWheel?: React.WheelEventHandler<HTMLInputElement> | undefined;
+            onWheelCapture?: React.WheelEventHandler<HTMLInputElement> | undefined;
+            onAnimationStart?: React.AnimationEventHandler<HTMLInputElement> | undefined;
+            onAnimationStartCapture?: React.AnimationEventHandler<HTMLInputElement> | undefined;
+            onAnimationEnd?: React.AnimationEventHandler<HTMLInputElement> | undefined;
+            onAnimationEndCapture?: React.AnimationEventHandler<HTMLInputElement> | undefined;
+            onAnimationIteration?: React.AnimationEventHandler<HTMLInputElement> | undefined;
+            onAnimationIterationCapture?: React.AnimationEventHandler<HTMLInputElement> | undefined;
+            onToggle?: React.ToggleEventHandler<HTMLInputElement> | undefined;
+            onBeforeToggle?: React.ToggleEventHandler<HTMLInputElement> | undefined;
+            onTransitionCancel?: React.TransitionEventHandler<HTMLInputElement> | undefined;
+            onTransitionCancelCapture?: React.TransitionEventHandler<HTMLInputElement> | undefined;
+            onTransitionEnd?: React.TransitionEventHandler<HTMLInputElement> | undefined;
+            onTransitionEndCapture?: React.TransitionEventHandler<HTMLInputElement> | undefined;
+            onTransitionRun?: React.TransitionEventHandler<HTMLInputElement> | undefined;
+            onTransitionRunCapture?: React.TransitionEventHandler<HTMLInputElement> | undefined;
+            onTransitionStart?: React.TransitionEventHandler<HTMLInputElement> | undefined;
+            onTransitionStartCapture?: React.TransitionEventHandler<HTMLInputElement> | undefined;
+            "aria-activedescendant"?: string | undefined;
+            "aria-atomic"?: ("false" | "true" | boolean) | undefined;
+            "aria-autocomplete"?: "none" | "inline" | "list" | "both" | undefined;
+            "aria-braillelabel"?: string | undefined;
+            "aria-brailleroledescription"?: string | undefined;
+            "aria-busy"?: ("false" | "true" | boolean) | undefined;
+            "aria-checked"?: boolean | "false" | "mixed" | "true" | undefined;
+            "aria-colcount"?: number | undefined;
+            "aria-colindex"?: number | undefined;
+            "aria-colindextext"?: string | undefined;
+            "aria-colspan"?: number | undefined;
+            "aria-controls"?: string | undefined;
+            "aria-current"?: boolean | "false" | "true" | "page" | "step" | "location" | "date" | "time" | undefined;
+            "aria-describedby"?: string | undefined;
+            "aria-description"?: string | undefined;
+            "aria-details"?: string | undefined;
+            "aria-disabled"?: ("false" | "true" | boolean) | undefined;
+            "aria-dropeffect"?: "none" | "copy" | "execute" | "link" | "move" | "popup" | undefined;
+            "aria-errormessage"?: string | undefined;
+            "aria-expanded"?: ("false" | "true" | boolean) | undefined;
+            "aria-flowto"?: string | undefined;
+            "aria-grabbed"?: ("false" | "true" | boolean) | undefined;
+            "aria-haspopup"?: boolean | "false" | "true" | "menu" | "listbox" | "tree" | "grid" | "dialog" | undefined;
+            "aria-hidden"?: ("false" | "true" | boolean) | undefined;
+            "aria-invalid"?: boolean | "false" | "true" | "grammar" | "spelling" | undefined;
+            "aria-keyshortcuts"?: string | undefined;
+            "aria-labelledby"?: string | undefined;
+            "aria-level"?: number | undefined;
+            "aria-live"?: "off" | "assertive" | "polite" | undefined;
+            "aria-modal"?: ("false" | "true" | boolean) | undefined;
+            "aria-multiline"?: ("false" | "true" | boolean) | undefined;
+            "aria-multiselectable"?: ("false" | "true" | boolean) | undefined;
+            "aria-orientation"?: "horizontal" | "vertical" | undefined;
+            "aria-owns"?: string | undefined;
+            "aria-placeholder"?: string | undefined;
+            "aria-posinset"?: number | undefined;
+            "aria-pressed"?: boolean | "false" | "mixed" | "true" | undefined;
+            "aria-readonly"?: ("false" | "true" | boolean) | undefined;
+            "aria-relevant"?: "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text" | "text additions" | "text removals" | undefined;
+            "aria-required"?: ("false" | "true" | boolean) | undefined;
+            "aria-roledescription"?: string | undefined;
+            "aria-rowcount"?: number | undefined;
+            "aria-rowindex"?: number | undefined;
+            "aria-rowindextext"?: string | undefined;
+            "aria-rowspan"?: number | undefined;
+            "aria-selected"?: ("false" | "true" | boolean) | undefined;
+            "aria-setsize"?: number | undefined;
+            "aria-sort"?: "none" | "ascending" | "descending" | "other" | undefined;
+            "aria-valuemax"?: number | undefined;
+            "aria-valuemin"?: number | undefined;
+            "aria-valuenow"?: number | undefined;
+            "aria-valuetext"?: string | undefined;
+            defaultChecked?: boolean | undefined;
+            defaultValue?: string | number | readonly string[] | undefined;
+            suppressContentEditableWarning?: boolean | undefined;
+            suppressHydrationWarning?: boolean | undefined;
+            accessKey?: string | undefined;
+            autoCapitalize?: "off" | "none" | "on" | "sentences" | "words" | "characters" | undefined | (string & {});
+            autoFocus?: boolean | undefined;
+            className?: string | undefined;
+            contentEditable?: ("false" | "true" | boolean) | "inherit" | "plaintext-only" | undefined;
+            contextMenu?: string | undefined;
+            dir?: string | undefined;
+            draggable?: ("false" | "true" | boolean) | undefined;
+            enterKeyHint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined;
+            hidden?: boolean | undefined;
+            id?: string | undefined;
+            lang?: string | undefined;
+            nonce?: string | undefined;
+            slot?: string | undefined;
+            spellCheck?: ("false" | "true" | boolean) | undefined;
+            style?: React.CSSProperties | undefined;
+            tabIndex?: number | undefined;
+            title?: string | undefined;
+            translate?: "yes" | "no" | undefined;
+            radioGroup?: string | undefined;
+            role?: React.AriaRole | undefined;
+            about?: string | undefined;
+            content?: string | undefined;
+            datatype?: string | undefined;
+            inlist?: any;
+            prefix?: string | undefined;
+            property?: string | undefined;
+            rel?: string | undefined;
+            resource?: string | undefined;
+            rev?: string | undefined;
+            typeof?: string | undefined;
+            vocab?: string | undefined;
+            autoCorrect?: string | undefined;
+            autoSave?: string | undefined;
+            color?: string | undefined;
+            itemProp?: string | undefined;
+            itemScope?: boolean | undefined;
+            itemType?: string | undefined;
+            itemID?: string | undefined;
+            itemRef?: string | undefined;
+            results?: number | undefined;
+            security?: string | undefined;
+            unselectable?: "on" | "off" | undefined;
+            popover?: "" | "auto" | "manual" | "hint" | undefined;
+            popoverTargetAction?: "toggle" | "show" | "hide" | undefined;
+            popoverTarget?: string | undefined;
+            inert?: boolean | undefined;
+            inputMode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined;
+            is?: string | undefined;
+            exportparts?: string | undefined;
+            part?: string | undefined;
+            accept?: string | undefined;
+            alt?: string | undefined;
+            autoComplete?: React.HTMLInputAutoCompleteAttribute | undefined;
+            capture?: boolean | "user" | "environment" | undefined;
+            checked?: boolean | undefined;
+            disabled?: boolean | undefined;
+            form?: string | undefined;
+            formAction?: string | ((formData: FormData) => void | Promise<void>) | React.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_EXPERIMENTAL_FORM_ACTIONS[keyof React.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_EXPERIMENTAL_FORM_ACTIONS] | undefined;
+            formEncType?: string | undefined;
+            formMethod?: string | undefined;
+            formNoValidate?: boolean | undefined;
+            formTarget?: string | undefined;
+            height?: number | string | undefined;
+            list?: string | undefined;
+            max?: number | string | undefined;
+            maxLength?: number | undefined;
+            min?: number | string | undefined;
+            minLength?: number | undefined;
+            multiple?: boolean | undefined;
+            name?: string | undefined;
+            pattern?: string | undefined;
+            placeholder?: string | undefined;
+            readOnly?: boolean | undefined;
+            required?: boolean | undefined;
+            size?: number | undefined;
+            src?: string | undefined;
+            step?: number | string | undefined;
+            type?: React.HTMLInputTypeAttribute | undefined;
+            value?: string | readonly string[] | number | undefined;
+            width?: number | string | undefined;
+            onChange?: React.ChangeEventHandler<HTMLInputElement, HTMLInputElement> | undefined;
+            ref: React.Ref<HTMLInputElement>;
+            'aria-label': string;
+        };
+    };
+    inputProps?: undefined;
+} | {
+    slotProps?: undefined;
+    inputProps: {
+        'aria-label': string;
+    };
+};
+declare const GoToBox: ({ model }: {
+    model: MsaViewModel;
+}) => React.JSX.Element | null;
+export default GoToBox;

package/dist/components/header/GoToBox.js

@@ -0,0 +1,31 @@
+import React, { useState } from 'react';
+import { Autocomplete, TextField } from '@mui/material';
+import { observer } from 'mobx-react';
+import { findableRowNames, goTo, rowNameSuggestions } from './goTo.js';
+const label = 'Go to row or column';
+// MUI 9 hands renderInput `slotProps`; MUI 7, which every released JBrowse host
+// serves, hands it `inputProps` and no `slotProps` at all
+export function labelledInput(params) {
+    const { slotProps, inputProps } = params;
+    return slotProps
+        ? {
+            slotProps: {
+                ...slotProps,
+                htmlInput: { ...slotProps.htmlInput, 'aria-label': label },
+            },
+        }
+        : { inputProps: { ...inputProps, 'aria-label': label } };
+}
+const GoToBox = observer(function ({ model }) {
+    const [missed, setMissed] = useState(false);
+    const names = findableRowNames(model);
+    return names.length > 1 || model.numColumns > 0 ? (React.createElement(Autocomplete, { freeSolo: true, size: "small", options: names, filterOptions: (options, { inputValue }) => rowNameSuggestions(options, inputValue), value: null, blurOnSelect: true, onInputChange: () => {
+            setMissed(false);
+        }, onChange: (_, text) => {
+            if (text) {
+                setMissed(!goTo(model, text));
+            }
+        }, style: { width: 180, margin: 'auto 8px' }, renderInput: params => (React.createElement(TextField, { ...params, error: missed, placeholder: label, title: "A row name, a column number, or name:residue", ...labelledInput(params) })) })) : null;
+});
+export default GoToBox;
+//# sourceMappingURL=GoToBox.js.map

package/dist/components/header/GoToBox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GoToBox.js","sourceRoot":"","sources":["../../../src/components/header/GoToBox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAEvC,OAAO,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,eAAe,CAAA;AACvD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,OAAO,EAAE,gBAAgB,EAAE,IAAI,EAAE,kBAAkB,EAAE,MAAM,WAAW,CAAA;AAKtE,MAAM,KAAK,GAAG,qBAAqB,CAAA;AAEnC,gFAAgF;AAChF,0DAA0D;AAC1D,MAAM,UAAU,aAAa,CAAC,MAAqC;IACjE,MAAM,EAAE,SAAS,EAAE,UAAU,EAAE,GAAG,MAEjC,CAAA;IACD,OAAO,SAAS;QACd,CAAC,CAAC;YACE,SAAS,EAAE;gBACT,GAAG,SAAS;gBACZ,SAAS,EAAE,EAAE,GAAG,SAAS,CAAC,SAAS,EAAE,YAAY,EAAE,KAAK,EAAE;aAC3D;SACF;QACH,CAAC,CAAC,EAAE,UAAU,EAAE,EAAE,GAAG,UAAU,EAAE,YAAY,EAAE,KAAK,EAAE,EAAE,CAAA;AAC5D,CAAC;AAED,MAAM,OAAO,GAAG,QAAQ,CAAC,UAAU,EAAE,KAAK,EAA2B;IACnE,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAA;IAC3C,MAAM,KAAK,GAAG,gBAAgB,CAAC,KAAK,CAAC,CAAA;IACrC,OAAO,KAAK,CAAC,MAAM,GAAG,CAAC,IAAI,KAAK,CAAC,UAAU,GAAG,CAAC,CAAC,CAAC,CAAC,CAChD,oBAAC,YAAY,IACX,QAAQ,QACR,IAAI,EAAC,OAAO,EACZ,OAAO,EAAE,KAAK,EACd,aAAa,EAAE,CAAC,OAAO,EAAE,EAAE,UAAU,EAAE,EAAE,EAAE,CACzC,kBAAkB,CAAC,OAAO,EAAE,UAAU,CAAC,EAEzC,KAAK,EAAE,IAAI,EACX,YAAY,QACZ,aAAa,EAAE,GAAG,EAAE;YAClB,SAAS,CAAC,KAAK,CAAC,CAAA;QAClB,CAAC,EACD,QAAQ,EAAE,CAAC,CAAC,EAAE,IAAI,EAAE,EAAE;YACpB,IAAI,IAAI,EAAE,CAAC;gBACT,SAAS,CAAC,CAAC,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC,CAAA;YAC/B,CAAC;QACH,CAAC,EACD,KAAK,EAAE,EAAE,KAAK,EAAE,GAAG,EAAE,MAAM,EAAE,UAAU,EAAE,EACzC,WAAW,EAAE,MAAM,CAAC,EAAE,CAAC,CACrB,oBAAC,SAAS,OACJ,MAAM,EACV,KAAK,EAAE,MAAM,EACb,WAAW,EAAE,KAAK,EAClB,KAAK,EAAC,8CAA8C,KAChD,aAAa,CAAC,MAAM,CAAC,GACzB,CACH,GACD,CACH,CAAC,CAAC,CAAC,IAAI,CAAA;AACV,CAAC,CAAC,CAAA;AAEF,eAAe,OAAO,CAAA"}

package/dist/components/header/Header.js

@@ -7,11 +7,12 @@ import StatusMessage from '../StatusMessage.js';
 import ColorSchemeMenu from './ColorSchemeMenu.js';
 import FileMenu from './FileMenu.js';
 import GappynessSlider from './GappynessSlider.js';
+import GoToBox from './GoToBox.js';
 import HeaderInfoArea from './HeaderInfoArea.js';
 import LoadWarnings from './LoadWarnings.js';
 import MSASettingsMenu from './MSASettingsMenu.js';
 import MultiAlignmentSelector from './MultiAlignmentSelector.js';
-import RowSearch from './RowSearch.js';
+import SelectionMenu from './SelectionMenu.js';
 import TreeSettingsMenu from './TreeSettingsMenu.js';
 import UnshareableDataWarning from './UnshareableDataWarning.js';
 import ZoomControls from './ZoomControls.js';
@@ -33,10 +34,11 @@ const Header = observer(function ({ model }) {
         React.createElement(ZoomControls, { model: model }),
         React.createElement(ZoomMenu, { model: model }),
         React.createElement(GappynessSlider, { model: model }),
-        React.createElement(RowSearch, { model: model }),
+        React.createElement(GoToBox, { model: model }),
         React.createElement("div", { style: { paddingLeft: 20, margin: 'auto' } },
             React.createElement(MultiAlignmentSelector, { model: model })),
         React.createElement("div", { style: { flex: '1 1 0', minWidth: 0, display: 'flex' } },
+            React.createElement(SelectionMenu, { model: model }),
             React.createElement(HeaderInfoArea, { model: model })),
         React.createElement(LoadWarnings, { model: model }),
         React.createElement(UnshareableDataWarning, { model: model }),

package/dist/components/header/Header.js.map

@@ -1 +1 @@
-{"version":3,"file":"Header.js","sourceRoot":"","sources":["../../../src/components/header/Header.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Header.js","sourceRoot":"","sources":["../../../src/components/header/Header.tsx"],"names":[],"mappings":"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"}

package/dist/components/header/SelectionMenu.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+import type { MsaViewModel } from '../../model.ts';
+/**
+ * The selected block's size, as a button opening what to do with it. It
+ * renders only while there is a selection. Header.tsx puts it in the slot
+ * with no width of its own, so the label ellipsizes before it could wrap the
+ * header onto a second line.
+ */
+declare const SelectionMenu: ({ model }: {
+    model: MsaViewModel;
+}) => React.JSX.Element | null;
+export default SelectionMenu;

package/dist/components/header/SelectionMenu.js

@@ -0,0 +1,72 @@
+import React, { useState } from 'react';
+import ArrowDropDown from '@mui/icons-material/ArrowDropDown';
+import Clear from '@mui/icons-material/Clear';
+import ContentCopy from '@mui/icons-material/ContentCopy';
+import ZoomIn from '@mui/icons-material/ZoomIn';
+import { Button, ListItemIcon, ListItemText, Menu, MenuItem, Tooltip, } from '@mui/material';
+import { observer } from 'mobx-react';
+import copy from '../../vendor/copyToClipboard.js';
+function count(n, noun) {
+    return `${n.toLocaleString('en-US')} ${noun}${n === 1 ? '' : 's'}`;
+}
+/**
+ * The selected block's size, as a button opening what to do with it. It
+ * renders only while there is a selection. Header.tsx puts it in the slot
+ * with no width of its own, so the label ellipsizes before it could wrap the
+ * header onto a second line.
+ */
+const SelectionMenu = observer(function ({ model }) {
+    const [anchorEl, setAnchorEl] = useState();
+    const { selectionSize, selectionFileSpan } = model;
+    if (!selectionSize || !selectionFileSpan) {
+        return null;
+    }
+    const label = `${count(selectionSize.columns, 'column')} × ${count(selectionSize.rows, 'row')}`;
+    const items = [
+        {
+            text: 'Copy as FASTA',
+            Icon: ContentCopy,
+            act: () => {
+                copy(model.selectionFasta);
+            },
+        },
+        {
+            text: 'Zoom to selection',
+            Icon: ZoomIn,
+            act: () => {
+                model.zoomToSelection();
+            },
+        },
+        {
+            text: 'Clear selection',
+            Icon: Clear,
+            act: () => {
+                model.clearSelection();
+            },
+        },
+    ];
+    return (React.createElement(React.Fragment, null,
+        React.createElement(Tooltip, { title: `Columns ${selectionFileSpan.start}-${selectionFileSpan.end} selected. Shift-drag the alignment to select, Escape to clear` },
+            React.createElement(Button, { size: "small", "aria-label": `Selection: ${label}`, endIcon: React.createElement(ArrowDropDown, null), onClick: event => {
+                    setAnchorEl(event.currentTarget);
+                }, style: {
+                    margin: 'auto 0 auto 8px',
+                    flexShrink: 0,
+                    maxWidth: '100%',
+                    minWidth: 0,
+                    textTransform: 'none',
+                    whiteSpace: 'nowrap',
+                } },
+                React.createElement("span", { style: { overflow: 'hidden', textOverflow: 'ellipsis' } }, label))),
+        anchorEl ? (React.createElement(Menu, { anchorEl: anchorEl, open: true, transitionDuration: 0, onClose: () => {
+                setAnchorEl(undefined);
+            } }, items.map(({ text, Icon, act }) => (React.createElement(MenuItem, { key: text, dense: true, onClick: () => {
+                act();
+                setAnchorEl(undefined);
+            } },
+            React.createElement(ListItemIcon, null,
+                React.createElement(Icon, { fontSize: "small" })),
+            React.createElement(ListItemText, null, text)))))) : null));
+});
+export default SelectionMenu;
+//# sourceMappingURL=SelectionMenu.js.map

package/dist/components/header/SelectionMenu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectionMenu.js","sourceRoot":"","sources":["../../../src/components/header/SelectionMenu.tsx"],"names":[],"mappings":"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"}

package/dist/components/header/goTo.d.ts

@@ -0,0 +1,20 @@
+import type { MsaViewModel } from '../../model.ts';
+export declare function findableRowNames(model: MsaViewModel): string[];
+export declare function rowNameSuggestions(names: string[], input: string, limit?: number): string[];
+/**
+ * The visible row and column a "Go to" entry names: a row by its name, the
+ * column the ruler numbers N, or residue N of a row written `name:N`. A name
+ * is tried whole first, so a row called `chr1:100` stays reachable.
+ */
+export declare function resolveGoTo(model: MsaViewModel, text: string): {
+    row: number;
+    col?: undefined;
+} | {
+    row: number | undefined;
+    col: number;
+} | {
+    row?: undefined;
+    col: number;
+} | undefined;
+/** centers the view on the entry's target and lights it; false if none */
+export declare function goTo(model: MsaViewModel, text: string): boolean;