gaschz/trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-11-21 08:04:24 +01:00
Code Issues Actions 14 Packages Projects Releases Wiki Activity

client/note color picker: fix the custom color picker on Safari

Browse Source
This commit is contained in:
Adorian Doran 2025-11-21 01:29:54 +02:00
parent 36350bd71a
commit e9796c9a35
1 changed files with 7 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
apps/client/src/menus/custom-items/NoteColorPicker.tsx
View File

@ -122,6 +122,7 @@ function CustomColorCell(props: ColorCellProps) {
const colorInput = useRef<HTMLInputElement>(null); const colorInput = useRef<HTMLInputElement>(null);
const colorInputDebouncer = useRef<Debouncer<string | null> | null>(null); const colorInputDebouncer = useRef<Debouncer<string | null> | null>(null);
const callbackRef = useRef(props.onSelect); const callbackRef = useRef(props.onSelect);
const isSafari = useRef(/^((?!chrome|android).)*safari/i.test(navigator.userAgent));
useEffect(() => { useEffect(() => {
colorInputDebouncer.current = new Debouncer(500, (color) => { colorInputDebouncer.current = new Debouncer(500, (color) => {
@ -152,7 +153,12 @@ function CustomColorCell(props: ColorCellProps) {
colorInput.current?.click(); colorInput.current?.click();
}, [pickedColor]); }, [pickedColor]);
return <div style={`--foreground: ${getForegroundColor(props.color)};`}> return <div style={`--foreground: ${getForegroundColor(props.color)};`}
onClick={(e) => {
// The color picker dropdown will close on Safari if the parent context menu is
// dismissed, so stop the click propagation to prevent dismissing the menu.
isSafari.current && e.stopPropagation();
}}>
<ColorCell {...props} <ColorCell {...props}
color={pickedColor} color={pickedColor}
className={clsx("custom-color-cell", { className={clsx("custom-color-cell", {