diff --git a/src/types/MarkdownTextProps.web.ts b/src/types/MarkdownTextProps.web.ts index 91034b54..918dbe7f 100644 --- a/src/types/MarkdownTextProps.web.ts +++ b/src/types/MarkdownTextProps.web.ts @@ -1,4 +1,3 @@ -import type { ColorValue } from 'react-native'; import type { CSSProperties, HTMLAttributes } from 'react'; import type { MarkdownStyle, Md4cFlags } from './MarkdownStyle'; import type { @@ -70,7 +69,7 @@ export interface EnrichedMarkdownTextProps * Color of the text selection highlight. * @platform web */ - selectionColor?: ColorValue; + selectionColor?: string; /** * When false (default), removes trailing margin from the last element to * eliminate bottom spacing. diff --git a/src/web/EnrichedMarkdownText.tsx b/src/web/EnrichedMarkdownText.tsx index e26ee273..b0009069 100644 --- a/src/web/EnrichedMarkdownText.tsx +++ b/src/web/EnrichedMarkdownText.tsx @@ -18,7 +18,6 @@ import type { ASTNode, RendererCallbacks, RenderCapabilities } from './types'; import { indexTaskItems, markInlineImages } from './utils'; import { loadKaTeX } from './katex'; import type { KaTeXInstance } from './katex'; -import { normalizeColor } from '../styleUtils'; export const EnrichedMarkdownText = ({ markdown, @@ -103,21 +102,18 @@ export const EnrichedMarkdownText = ({ [lastChildStyle] ); - const wrapperStyle = useMemo(() => { - const selectionColorCss = selectionColor - ? normalizeColor(String(selectionColor)) - : undefined; - - return { + const wrapperStyle = useMemo( + () => ({ display: 'flex', flexDirection: 'column', ...(containerStyle as CSSProperties), ...(selectable ? undefined : { userSelect: 'none' }), - ...(selectionColorCss != null - ? ({ ['--enrm-selection-bg']: selectionColorCss } as CSSProperties) + ...(selectionColor + ? ({ ['--enrm-selection-bg']: selectionColor } as CSSProperties) : null), - }; - }, [containerStyle, selectable, selectionColor]); + }), + [containerStyle, selectable, selectionColor] + ); const selectionStyle = selectionColor ? (