toeverything/AFFiNE
1
1
Fork 0
mirror of https://github.com/toeverything/AFFiNE.git synced 2024-12-29 03:21:38 +03:00
Code Issues Packages Projects Releases Wiki Activity

chore: update input ui component

Browse Source
This commit is contained in:
JimmFly 2023-01-18 15:31:34 +08:00
parent 32babd8026
commit 4401f083f2
2 changed files with 6 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
packages/app/src/ui/input/Input.tsx
View File

@ -12,6 +12,7 @@ type inputProps = {
placeholder?: string; placeholder?: string;
disabled?: boolean; disabled?: boolean;
width?: number; width?: number;
height?: number;
maxLength?: number; maxLength?: number;
minLength?: number; minLength?: number;
onChange?: (value: string) => void; onChange?: (value: string) => void;
@ -26,6 +27,7 @@ export const Input = (props: inputProps) => {
placeholder, placeholder,
maxLength, maxLength,
minLength, minLength,
height,
width = 260, width = 260,
onChange, onChange,
onBlur, onBlur,
@ -62,6 +64,7 @@ export const Input = (props: inputProps) => {
onChange={handleChange} onChange={handleChange}
onBlur={handleBlur} onBlur={handleBlur}
onKeyDown={handleKeyDown} onKeyDown={handleKeyDown}
height={height}
></StyledInput> ></StyledInput>
); );
}; };

4
packages/app/src/ui/input/style.ts
View File

@ -4,7 +4,8 @@ export const StyledInput = styled('input')<{
disabled?: boolean; disabled?: boolean;
value?: string; value?: string;
width: number; width: number;
}>(({ theme, width, disabled }) => { height?: number;
}>(({ theme, width, disabled, height }) => {
const fontWeight = 400; const fontWeight = 400;
const fontSize = '16px'; const fontSize = '16px';
return { return {
@ -13,6 +14,7 @@ export const StyledInput = styled('input')<{
padding: '8px 12px', padding: '8px 12px',
fontWeight, fontWeight,
fontSize, fontSize,
height: height ? `${height}px` : 'auto',
color: disabled ? theme.colors.disableColor : theme.colors.inputColor, color: disabled ? theme.colors.disableColor : theme.colors.inputColor,
border: `1px solid`, border: `1px solid`,
borderColor: theme.colors.borderColor, // TODO: check out disableColor, borderColor: theme.colors.borderColor, // TODO: check out disableColor,