Skip to content

Commit 6d2ea04

Browse files
committed
feat: add data-color-mode props.
1 parent a8f585a commit 6d2ea04

File tree

2 files changed

+12
-1
lines changed

2 files changed

+12
-1
lines changed

src/index.tsx

Lines changed: 10 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,10 @@ export * from './SelectionText';
99

1010
export interface TextareaCodeEditorProps extends React.TextareaHTMLAttributes<HTMLTextAreaElement> {
1111
prefixCls?: string;
12+
/**
13+
* Support dark-mode/night-mode
14+
*/
15+
['data-color-mode']?: 'dark' | 'light';
1216
/**
1317
* Set what programming language the code belongs to.
1418
*/
@@ -37,6 +41,7 @@ export default React.forwardRef<HTMLTextAreaElement, TextareaCodeEditorProps>((p
3741
minHeight = 16,
3842
placeholder,
3943
language,
44+
'data-color-mode': dataColorMode,
4045
className,
4146
style,
4247
rehypePlugins,
@@ -81,7 +86,11 @@ export default React.forwardRef<HTMLTextAreaElement, TextareaCodeEditorProps>((p
8186
);
8287

8388
return (
84-
<div style={{ ...styles.container, ...style }} className={`${prefixCls} ${className || ''}`}>
89+
<div
90+
style={{ ...styles.container, ...style }}
91+
className={`${prefixCls} ${className || ''}`}
92+
data-color-mode={dataColorMode}
93+
>
8594
<textarea
8695
autoComplete="off"
8796
autoCorrect="off"

src/style/index.less

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -30,6 +30,7 @@
3030
}
3131
}
3232

33+
.@{w-textarea}[data-color-mode*='dark'],
3334
[data-color-mode*='dark'] .@{w-textarea},
3435
[data-color-mode*='dark'] .@{w-textarea}-var,
3536
body[data-color-mode*='dark'] {
@@ -45,6 +46,7 @@ body[data-color-mode*='dark'] {
4546
--color-prettylights-syntax-markup-bold: #c9d1d9;
4647
}
4748

49+
.@{w-textarea}[data-color-mode*='light'],
4850
[data-color-mode*='light'] .@{w-textarea},
4951
[data-color-mode*='light'] .@{w-textarea}-var,
5052
body[data-color-mode*='light'] {

0 commit comments

Comments
 (0)