Added Background Color to Text Input (#4194)

* Added Background Color to Text Input

* Added Default Value for Background Color

* added default value and make background of text input consistent with the dark theme

Co-authored-by: manishkushare <kushare.manish9@gmail.com>
Co-authored-by: Kavin Venkatachalam <kavin.saratha@gmail.com>
This commit is contained in:
Rahul Sunil 2022-11-17 15:08:36 +05:30 committed by GitHub
parent 016620589f
commit 14e4593578
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 8 additions and 1 deletions

View file

@ -1,4 +1,4 @@
import React, { useEffect, useState, useRef } from 'react';
import React, { useEffect, useRef, useState } from 'react';
export const TextInput = function TextInput({
height,
@ -23,6 +23,7 @@ export const TextInput = function TextInput({
borderRadius: `${styles.borderRadius}px`,
color: darkMode && styles.textColor === '#000' ? '#fff' : styles.textColor,
borderColor: styles.borderColor,
backgroundColor: darkMode && ['#fff'].includes(styles.backgroundColor) ? '#232e3c' : styles.backgroundColor,
};
useEffect(() => {

View file

@ -956,6 +956,11 @@ export const widgets = [
displayName: 'Text Color',
validation: { schema: { type: 'string' } },
},
backgroundColor: {
type: 'color',
displayName: 'Background Color',
validation: { schema: { type: 'string' } },
},
borderColor: {
type: 'color',
displayName: 'Border Color',
@ -1029,6 +1034,7 @@ export const widgets = [
borderRadius: { value: '{{0}}' },
visibility: { value: '{{true}}' },
disabledState: { value: '{{false}}' },
backgroundColor: { value: '#fff' },
},
},
},