fix(tui): apply scroll configuration uniformly across all scrollboxes (#14735)
This commit is contained in:
@@ -4,6 +4,7 @@ import { Clipboard } from "@tui/util/clipboard"
|
|||||||
import { createSignal } from "solid-js"
|
import { createSignal } from "solid-js"
|
||||||
import { Installation } from "@/installation"
|
import { Installation } from "@/installation"
|
||||||
import { win32FlushInputBuffer } from "../win32"
|
import { win32FlushInputBuffer } from "../win32"
|
||||||
|
import { getScrollAcceleration } from "../util/scroll"
|
||||||
|
|
||||||
export function ErrorComponent(props: {
|
export function ErrorComponent(props: {
|
||||||
error: Error
|
error: Error
|
||||||
@@ -82,7 +83,7 @@ export function ErrorComponent(props: {
|
|||||||
<text fg={colors.bg}>Exit</text>
|
<text fg={colors.bg}>Exit</text>
|
||||||
</box>
|
</box>
|
||||||
</box>
|
</box>
|
||||||
<scrollbox height={Math.floor(term().height * 0.7)}>
|
<scrollbox height={Math.floor(term().height * 0.7)} scrollAcceleration={getScrollAcceleration()}>
|
||||||
<text fg={colors.muted}>{props.error.stack}</text>
|
<text fg={colors.muted}>{props.error.stack}</text>
|
||||||
</scrollbox>
|
</scrollbox>
|
||||||
<text fg={colors.text}>{props.error.message}</text>
|
<text fg={colors.text}>{props.error.message}</text>
|
||||||
|
|||||||
@@ -6,6 +6,8 @@ import { createMemo, createResource, createEffect, onMount, onCleanup, Index, Sh
|
|||||||
import { createStore } from "solid-js/store"
|
import { createStore } from "solid-js/store"
|
||||||
import { useSDK } from "@tui/context/sdk"
|
import { useSDK } from "@tui/context/sdk"
|
||||||
import { useSync } from "@tui/context/sync"
|
import { useSync } from "@tui/context/sync"
|
||||||
|
import { getScrollAcceleration } from "../../util/scroll"
|
||||||
|
import { useTuiConfig } from "../../context/tui-config"
|
||||||
import { useTheme, selectedForeground } from "@tui/context/theme"
|
import { useTheme, selectedForeground } from "@tui/context/theme"
|
||||||
import { SplitBorder } from "@tui/component/border"
|
import { SplitBorder } from "@tui/component/border"
|
||||||
import { useCommandDialog } from "@tui/component/dialog-command"
|
import { useCommandDialog } from "@tui/component/dialog-command"
|
||||||
@@ -81,6 +83,7 @@ export function Autocomplete(props: {
|
|||||||
const { theme } = useTheme()
|
const { theme } = useTheme()
|
||||||
const dimensions = useTerminalDimensions()
|
const dimensions = useTerminalDimensions()
|
||||||
const frecency = useFrecency()
|
const frecency = useFrecency()
|
||||||
|
const tuiConfig = useTuiConfig()
|
||||||
|
|
||||||
const [store, setStore] = createStore({
|
const [store, setStore] = createStore({
|
||||||
index: 0,
|
index: 0,
|
||||||
@@ -605,6 +608,7 @@ export function Autocomplete(props: {
|
|||||||
})
|
})
|
||||||
|
|
||||||
let scroll: ScrollBoxRenderable
|
let scroll: ScrollBoxRenderable
|
||||||
|
const scrollAcceleration = createMemo(() => getScrollAcceleration(tuiConfig))
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<box
|
<box
|
||||||
@@ -622,6 +626,7 @@ export function Autocomplete(props: {
|
|||||||
backgroundColor={theme.backgroundMenu}
|
backgroundColor={theme.backgroundMenu}
|
||||||
height={height()}
|
height={height()}
|
||||||
scrollbarOptions={{ visible: false }}
|
scrollbarOptions={{ visible: false }}
|
||||||
|
scrollAcceleration={scrollAcceleration()}
|
||||||
>
|
>
|
||||||
<Index
|
<Index
|
||||||
each={options()}
|
each={options()}
|
||||||
|
|||||||
@@ -82,16 +82,7 @@ import { UI } from "@/cli/ui.ts"
|
|||||||
import { useTuiConfig } from "../../context/tui-config"
|
import { useTuiConfig } from "../../context/tui-config"
|
||||||
|
|
||||||
addDefaultParsers(parsers.parsers)
|
addDefaultParsers(parsers.parsers)
|
||||||
|
import { getScrollAcceleration } from "../../util/scroll"
|
||||||
class CustomSpeedScroll implements ScrollAcceleration {
|
|
||||||
constructor(private speed: number) {}
|
|
||||||
|
|
||||||
tick(_now?: number): number {
|
|
||||||
return this.speed
|
|
||||||
}
|
|
||||||
|
|
||||||
reset(): void {}
|
|
||||||
}
|
|
||||||
|
|
||||||
const context = createContext<{
|
const context = createContext<{
|
||||||
width: number
|
width: number
|
||||||
@@ -168,17 +159,7 @@ export function Session() {
|
|||||||
const showTimestamps = createMemo(() => timestamps() === "show")
|
const showTimestamps = createMemo(() => timestamps() === "show")
|
||||||
const contentWidth = createMemo(() => dimensions().width - (sidebarVisible() ? 42 : 0) - 4)
|
const contentWidth = createMemo(() => dimensions().width - (sidebarVisible() ? 42 : 0) - 4)
|
||||||
|
|
||||||
const scrollAcceleration = createMemo(() => {
|
const scrollAcceleration = createMemo(() => getScrollAcceleration(tuiConfig))
|
||||||
const tui = tuiConfig
|
|
||||||
if (tui?.scroll_acceleration?.enabled) {
|
|
||||||
return new MacOSScrollAccel()
|
|
||||||
}
|
|
||||||
if (tui?.scroll_speed) {
|
|
||||||
return new CustomSpeedScroll(tui.scroll_speed)
|
|
||||||
}
|
|
||||||
|
|
||||||
return new CustomSpeedScroll(3)
|
|
||||||
})
|
|
||||||
|
|
||||||
createEffect(() => {
|
createEffect(() => {
|
||||||
if (session()?.workspaceID) {
|
if (session()?.workspaceID) {
|
||||||
|
|||||||
@@ -15,6 +15,7 @@ import { Keybind } from "@/util/keybind"
|
|||||||
import { Locale } from "@/util/locale"
|
import { Locale } from "@/util/locale"
|
||||||
import { Global } from "@/global"
|
import { Global } from "@/global"
|
||||||
import { useDialog } from "../../ui/dialog"
|
import { useDialog } from "../../ui/dialog"
|
||||||
|
import { getScrollAcceleration } from "../../util/scroll"
|
||||||
import { useTuiConfig } from "../../context/tui-config"
|
import { useTuiConfig } from "../../context/tui-config"
|
||||||
|
|
||||||
type PermissionStage = "permission" | "always" | "reject"
|
type PermissionStage = "permission" | "always" | "reject"
|
||||||
@@ -62,12 +63,14 @@ function EditBody(props: { request: PermissionRequest }) {
|
|||||||
})
|
})
|
||||||
|
|
||||||
const ft = createMemo(() => filetype(filepath()))
|
const ft = createMemo(() => filetype(filepath()))
|
||||||
|
const scrollAcceleration = createMemo(() => getScrollAcceleration(config))
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<box flexDirection="column" gap={1}>
|
<box flexDirection="column" gap={1}>
|
||||||
<Show when={diff()}>
|
<Show when={diff()}>
|
||||||
<scrollbox
|
<scrollbox
|
||||||
height="100%"
|
height="100%"
|
||||||
|
scrollAcceleration={scrollAcceleration()}
|
||||||
verticalScrollbarOptions={{
|
verticalScrollbarOptions={{
|
||||||
trackOptions: {
|
trackOptions: {
|
||||||
backgroundColor: theme.background,
|
backgroundColor: theme.background,
|
||||||
|
|||||||
@@ -1,13 +1,18 @@
|
|||||||
import { useSync } from "@tui/context/sync"
|
import { useSync } from "@tui/context/sync"
|
||||||
import { createMemo, Show } from "solid-js"
|
import { createMemo, Show } from "solid-js"
|
||||||
import { useTheme } from "../../context/theme"
|
import { useTheme } from "../../context/theme"
|
||||||
|
import { useTuiConfig } from "../../context/tui-config"
|
||||||
import { Installation } from "@/installation"
|
import { Installation } from "@/installation"
|
||||||
import { TuiPluginRuntime } from "../../plugin"
|
import { TuiPluginRuntime } from "../../plugin"
|
||||||
|
|
||||||
|
import { getScrollAcceleration } from "../../util/scroll"
|
||||||
|
|
||||||
export function Sidebar(props: { sessionID: string; overlay?: boolean }) {
|
export function Sidebar(props: { sessionID: string; overlay?: boolean }) {
|
||||||
const sync = useSync()
|
const sync = useSync()
|
||||||
const { theme } = useTheme()
|
const { theme } = useTheme()
|
||||||
|
const tuiConfig = useTuiConfig()
|
||||||
const session = createMemo(() => sync.session.get(props.sessionID))
|
const session = createMemo(() => sync.session.get(props.sessionID))
|
||||||
|
const scrollAcceleration = createMemo(() => getScrollAcceleration(tuiConfig))
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Show when={session()}>
|
<Show when={session()}>
|
||||||
@@ -23,6 +28,7 @@ export function Sidebar(props: { sessionID: string; overlay?: boolean }) {
|
|||||||
>
|
>
|
||||||
<scrollbox
|
<scrollbox
|
||||||
flexGrow={1}
|
flexGrow={1}
|
||||||
|
scrollAcceleration={scrollAcceleration()}
|
||||||
verticalScrollbarOptions={{
|
verticalScrollbarOptions={{
|
||||||
trackOptions: {
|
trackOptions: {
|
||||||
backgroundColor: theme.background,
|
backgroundColor: theme.background,
|
||||||
|
|||||||
@@ -10,6 +10,9 @@ import { useDialog, type DialogContext } from "@tui/ui/dialog"
|
|||||||
import { useKeybind } from "@tui/context/keybind"
|
import { useKeybind } from "@tui/context/keybind"
|
||||||
import { Keybind } from "@/util/keybind"
|
import { Keybind } from "@/util/keybind"
|
||||||
import { Locale } from "@/util/locale"
|
import { Locale } from "@/util/locale"
|
||||||
|
import { useSync } from "@tui/context/sync"
|
||||||
|
import { getScrollAcceleration } from "../util/scroll"
|
||||||
|
import { useTuiConfig } from "../context/tui-config"
|
||||||
|
|
||||||
export interface DialogSelectProps<T> {
|
export interface DialogSelectProps<T> {
|
||||||
title: string
|
title: string
|
||||||
@@ -50,6 +53,10 @@ export type DialogSelectRef<T> = {
|
|||||||
export function DialogSelect<T>(props: DialogSelectProps<T>) {
|
export function DialogSelect<T>(props: DialogSelectProps<T>) {
|
||||||
const dialog = useDialog()
|
const dialog = useDialog()
|
||||||
const { theme } = useTheme()
|
const { theme } = useTheme()
|
||||||
|
const sync = useSync()
|
||||||
|
const tuiConfig = useTuiConfig()
|
||||||
|
const scrollAcceleration = createMemo(() => getScrollAcceleration(tuiConfig))
|
||||||
|
|
||||||
const [store, setStore] = createStore({
|
const [store, setStore] = createStore({
|
||||||
selected: 0,
|
selected: 0,
|
||||||
filter: "",
|
filter: "",
|
||||||
@@ -276,6 +283,7 @@ export function DialogSelect<T>(props: DialogSelectProps<T>) {
|
|||||||
paddingLeft={1}
|
paddingLeft={1}
|
||||||
paddingRight={1}
|
paddingRight={1}
|
||||||
scrollbarOptions={{ visible: false }}
|
scrollbarOptions={{ visible: false }}
|
||||||
|
scrollAcceleration={scrollAcceleration()}
|
||||||
ref={(r: ScrollBoxRenderable) => (scroll = r)}
|
ref={(r: ScrollBoxRenderable) => (scroll = r)}
|
||||||
maxHeight={height()}
|
maxHeight={height()}
|
||||||
>
|
>
|
||||||
|
|||||||
@@ -0,0 +1,23 @@
|
|||||||
|
import { MacOSScrollAccel, type ScrollAcceleration } from "@opentui/core"
|
||||||
|
import { TuiConfig } from "@/config/tui"
|
||||||
|
|
||||||
|
export class CustomSpeedScroll implements ScrollAcceleration {
|
||||||
|
constructor(private speed: number) {}
|
||||||
|
|
||||||
|
tick(_now?: number): number {
|
||||||
|
return this.speed
|
||||||
|
}
|
||||||
|
|
||||||
|
reset(): void {}
|
||||||
|
}
|
||||||
|
|
||||||
|
export function getScrollAcceleration(tuiConfig?: TuiConfig.Info): ScrollAcceleration {
|
||||||
|
if (tuiConfig?.scroll_acceleration?.enabled) {
|
||||||
|
return new MacOSScrollAccel()
|
||||||
|
}
|
||||||
|
if (tuiConfig?.scroll_speed) {
|
||||||
|
return new CustomSpeedScroll(tuiConfig.scroll_speed)
|
||||||
|
}
|
||||||
|
|
||||||
|
return new CustomSpeedScroll(3)
|
||||||
|
}
|
||||||
Reference in New Issue
Block a user