dzeio/components
1
0
Fork 0
mirror of https://github.com/dzeiocom/components.git synced 2025-04-23 03:12:14 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: Allow to disable automatic icons

Browse Source 
Signed-off-by: Avior <github@avior.me>
This commit is contained in:
Florian Bouillon 2022-05-13 12:11:57 +02:00
parent 6f1ab9665e
commit 407ccca8e9
Signed by: Florian Bouillon
GPG Key ID: BEEAF3722D0EBF64
1 changed files with 23 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

38
src/Input/index.tsx
View File

@ -48,6 +48,11 @@ interface Props extends React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLIn
* if enabled value will not be sent if it is not contained in the choices * if enabled value will not be sent if it is not contained in the choices
*/ */
strictChoices?: boolean strictChoices?: boolean
/**
* Allows you to disable automatic icons
*/
disableAutoIcons?: boolean
} }
interface States { interface States {
@ -181,20 +186,22 @@ export default class Input extends React.PureComponent<Props, States> {
break break
case 'number': case 'number':
baseProps.onWheel = (ev: React.WheelEvent<HTMLInputElement>) => ev.currentTarget.blur() baseProps.onWheel = (ev: React.WheelEvent<HTMLInputElement>) => ev.currentTarget.blur()
iconLeft = this.props.iconLeft ?? {icon: MinusSquare, transformer: (v) => { if (!this.props.disabled && !this.props.disableAutoIcons) {
let value = parseFloat(v) iconLeft = this.props.iconLeft ?? {icon: MinusSquare, transformer: (v) => {
if (isNaN(value)) { let value = parseFloat(v)
value = 0 if (isNaN(value)) {
} value = 0
return (value - this.ensureNumber(this.props.step, 1)).toString() }
}} return (value - this.ensureNumber(this.props.step, 1)).toString()
iconRight = this.props.iconRight ?? {icon: PlusSquare, transformer: (v) => { }}
let value = parseFloat(v) iconRight = this.props.iconRight ?? {icon: PlusSquare, transformer: (v) => {
if (isNaN(value)) { let value = parseFloat(v)
value = 0 if (isNaN(value)) {
} value = 0
return (value + this.ensureNumber(this.props.step, 1)).toString() }
}} return (value + this.ensureNumber(this.props.step, 1)).toString()
}}
}
default: default:
input = <input input = <input
{...props} {...props}
@ -223,7 +230,7 @@ export default class Input extends React.PureComponent<Props, States> {
{/* Right Icon */} {/* Right Icon */}
{iconRight ? {iconRight ?
this.getIcon(iconRight, 'right') : this.getIcon(iconRight, 'right') :
(this.props.choices && !this.props.disabled) && ( (this.props.choices && !this.props.disabled && !this.props.disableAutoIcons) && (
<ChevronDown size="18" className={buildClassName(css.right, css.rotate)} /> <ChevronDown size="18" className={buildClassName(css.right, css.rotate)} />
) )
} }
@ -316,6 +323,7 @@ export default class Input extends React.PureComponent<Props, States> {
if ('icon' in Icon) { if ('icon' in Icon) {
return <Icon.icon size="18" className={buildClassName(css[position], css.iconClickable)} onClick={async () => { return <Icon.icon size="18" className={buildClassName(css[position], css.iconClickable)} onClick={async () => {
if (this.props.disabled) {return}
const value = Icon.transformer(this.state.value ?? this.state.displayedValue ?? '') const value = Icon.transformer(this.state.value ?? this.state.displayedValue ?? '')
this.setState({ value: value, displayedValue: value, valueUpdate: true }) this.setState({ value: value, displayedValue: value, valueUpdate: true })
}} /> }} />