Elgato_dark/ToolJet
1
0
Fork 0
mirror of https://github.com/ToolJet/ToolJet synced 2026-05-23 17:08:34 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

Add border color property to number input widget (#4175)

Browse source 
* add border color property to number input widget

* fix lint

* adds default value

* fixes

* fix lint
This commit is contained in:
Srisuma Atluri 2022-11-03 11:02:00 +05:30 committed by GitHub
parent a920811cb4
commit 4c4749af0a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 16 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
frontend/src/Editor/Components/NumberInput.jsx
View file

@ -9,7 +9,7 @@ export const NumberInput = function NumberInput({
darkMode,
fireEvent,
}) {
const { visibility, borderRadius } = styles;
const { visibility, borderRadius, borderColor } = styles;
const textColor = darkMode && ['#232e3c', '#000000ff'].includes(styles.textColor) ? '#fff' : styles.textColor;
@ -50,7 +50,13 @@ export const NumberInput = function NumberInput({
type="number"
className="form-control"
placeholder={properties.placeholder}
style={{ height, display: visibility ? '' : 'none', borderRadius: `${borderRadius}px`, color: textColor }}
style={{
height,
display: visibility ? '' : 'none',
borderRadius: `${borderRadius}px`,
borderColor,
color: textColor,
}}
value={value}
data-cy={`draggable-widget-${String(component.name).toLowerCase()}`}
/>

8
frontend/src/Editor/WidgetManager/widgetConfig.js
View file

@ -1092,6 +1092,13 @@ export const widgets = [
schema: { type: 'union', schemas: [{ type: 'string' }, { type: 'number' }] },
},
},
borderColor: {
type: 'color',
displayName: 'Border Color',
validation: {
schema: { type: 'string' },
},
},
textColor: {
type: 'color',
displayName: 'Text Color',
@ -1117,6 +1124,7 @@ export const widgets = [
visibility: { value: '{{true}}' },
disabledState: { value: '{{false}}' },
borderRadius: { value: '{{0}}' },
borderColor: { value: '#fff' },
textColor: { value: '#232e3c' },
},
},