diff options
| -rw-r--r-- | packages/ui/package.json | 1 | ||||
| -rw-r--r-- | packages/ui/src/components/diff.tsx | 18 |
2 files changed, 15 insertions, 4 deletions
diff --git a/packages/ui/package.json b/packages/ui/package.json index 2893d6eef..0e0853f96 100644 --- a/packages/ui/package.json +++ b/packages/ui/package.json @@ -44,6 +44,7 @@ "@pierre/diffs": "catalog:", "@shikijs/transformers": "3.9.2", "@solid-primitives/bounds": "0.1.3", + "@solid-primitives/media": "2.3.3", "@solid-primitives/resize-observer": "2.1.3", "@solidjs/meta": "catalog:", "@typescript/native-preview": "catalog:", diff --git a/packages/ui/src/components/diff.tsx b/packages/ui/src/components/diff.tsx index 7620f2bb5..33925592c 100644 --- a/packages/ui/src/components/diff.tsx +++ b/packages/ui/src/components/diff.tsx @@ -1,5 +1,6 @@ import { checksum } from "@opencode-ai/util/encode" import { FileDiff } from "@pierre/diffs" +import { createMediaQuery } from "@solid-primitives/media" import { createEffect, createMemo, onCleanup, splitProps } from "solid-js" import { createDefaultOptions, type DiffProps, styleVariables } from "../pierre" import { getWorkerPool } from "../pierre/worker" @@ -8,10 +9,19 @@ export function Diff<T>(props: DiffProps<T>) { let container!: HTMLDivElement const [local, others] = splitProps(props, ["before", "after", "class", "classList", "annotations"]) - const options = createMemo(() => ({ - ...createDefaultOptions(props.diffStyle), - ...others, - })) + const mobile = createMediaQuery("(max-width: 640px)") + + const options = createMemo(() => { + const opts = { + ...createDefaultOptions(props.diffStyle), + ...others, + } + if (!mobile()) return opts + return { + ...opts, + disableLineNumbers: true, + } + }) let instance: FileDiff<T> | undefined |