diff --git a/lib/components/NodeBaseInputField.tsx b/lib/components/NodeBaseInputField.tsx index 52afda1..baab414 100644 --- a/lib/components/NodeBaseInputField.tsx +++ b/lib/components/NodeBaseInputField.tsx @@ -19,7 +19,14 @@ export const NodeBaseInputField = ({ onPointerDown, onPointerLeave, children, - ...props + inputMode, + pattern, + maxLength, + minLength, + max, + min, + step, + placeholder, }: NodeBaseInputFieldProps) => { const [labelVisible, setLabelVisible] = useState(true) const ref = useRef<HTMLInputElement>(null) @@ -45,7 +52,6 @@ export const NodeBaseInputField = ({ > {children} <input - {...props} ref={ref} style={{ background: '#545555', @@ -71,6 +77,14 @@ export const NodeBaseInputField = ({ }} onPointerDown={onPointerDown} onPointerLeave={onPointerLeave} + inputMode={inputMode} + pattern={pattern} + maxLength={maxLength} + minLength={minLength} + max={max} + min={min} + step={step} + placeholder={placeholder} /> {labelVisible ? ( <div diff --git a/lib/components/NodeInputField.tsx b/lib/components/NodeInputField.tsx index 0be0b04..efea6d9 100644 --- a/lib/components/NodeInputField.tsx +++ b/lib/components/NodeInputField.tsx @@ -1,13 +1,12 @@ import { useCallback, useEffect, useState } from 'react' import { NodeBaseInputField } from './NodeBaseInputField' import { useNodeFieldValue } from '../hooks/node' -import { NodeInputConfig, ValueTypeConfig } from '../config' +import { NodeInputConfig } from '../config' import { BaseInputProps } from './inputs.ts' import './NodeInputField.css' type NodeInputFieldProps = BaseInputProps & - Omit<NodeInputConfig, 'valueType'> & - ValueTypeConfig & + Pick<NodeInputConfig, 'isConstant' | 'id' | 'defaultValue' | 'name'> & React.InputHTMLAttributes<any> export const NodeInputField = ({ @@ -16,10 +15,12 @@ export const NodeInputField = ({ type, isConstant, slots, + id, + defaultValue, ...props }: NodeInputFieldProps) => { const Handle = slots?.Handle - const [value, setValue] = useNodeFieldValue(props.id, props.defaultValue) + const [value, setValue] = useNodeFieldValue(id, defaultValue) return ( <NodeBaseInputField @@ -95,7 +96,7 @@ export const NodeInputDecimalField = ({ type NodeInputTypedFieldProps = Omit<NodeInputFieldProps, 'type'> export const NodeInputTextField = ( - props: NodeInputTypedFieldProps & { maxlength?: number; minlength?: number }, + props: NodeInputTypedFieldProps & { maxLength?: number; minLength?: number }, ) => { return <NodeInputField type="text" {...props} /> } @@ -107,7 +108,7 @@ export const NodeInputNumberField = ( } export const NodeInputPasswordField = ( - props: NodeInputTypedFieldProps & { maxlength?: number; minlength?: number }, + props: NodeInputTypedFieldProps & { maxLength?: number; minLength?: number }, ) => { return <NodeInputField type="password" {...props} /> }