Repository URL to install this package:
|
Version:
3.5.4 ▾
|
export * from '../typings'
import { ReactNode, ChangeEvent, ReactElement } from 'react'
import { Value, ValidatorFunction, Type } from '../typings'
import { InputState } from './InputState'
export type ReactDivProps = React.HTMLProps<HTMLDivElement>
export type ReactInputProps = React.HTMLProps<HTMLInputElement>
export type InputRenderInputProp = (
props: InputRenderProps
) => ReactElement<HTMLInputElement>
export type InputRenderWrapProp = (props: InputRenderProps) => ReactNode
export type InputRenderExtraProp = (props: InputRenderProps) => ReactNode
export interface InputPropsBase extends ReactInputProps {
state: InputState
}
// @private
export interface InputPropsRenderPropsOnly {
renderInput: InputRenderInputProp
renderWrap: InputRenderWrapProp
renderAfterInput: InputRenderExtraProp
renderError: InputRenderExtraProp
renderLabelText: InputRenderExtraProp
}
export type InputPropsAndRenderProps = InputPropsBase &
InputPropsRenderPropsOnly
export type InputProps = InputPropsAndRenderProps
export type InputRenderProps = InputPropsBase &
BaseInputConfig &
StyledInputProps & {
// @note - now not needed with split out `InputPropsAndRenderProps`
// renderInput: never
// renderWrap: never
// validator: never
// @note same as Value, but not boolean
value: string | number
children?: ReactNode
}
/**
* @todo `extends` on HTMLElementHere
* @example HTMLElementHere = HTMLDivElement extends HTMLOrSVGElement
*/
export type InputRenderWrapElementProps<
HTMLElementHere = HTMLDivElement
> = React.HTMLProps<HTMLElementHere> & {
className?: string
isActive: boolean
isValid: boolean
children: ReactNode
}
/** split this from InputConfig for the reusable parts */
export interface BaseInputConfig {
identifier?: string
// name?: string
propertyName?: string
label?: string
value?: Value
// any reason this was not there before?
type: Type | string
}
/**
* @todo generic & use `extends 'select' ? ...
*/
export interface InputConfig extends BaseInputConfig {
validator?: ValidatorFunction
renderInput?: InputRenderInputProp
renderWrap?: InputRenderWrapProp
}
export interface AnyObj {
[key: string]: any
}
export interface InputStateStore extends Map<string, any> {
get(key: 'isDirty'): boolean
set(key: 'isDirty', value: boolean): this
/** would like to do this another way... */
get(key: 'isValid'): boolean
set(key: 'isValid', value: boolean): this
}
export interface StyledInputProps {
className?: string
onChange?: (event?: ChangeEvent<any>) => void
isDirty?: boolean
isActive: boolean
isValid: boolean
isDisabled?: boolean
isVisible?: boolean
propertyName?: string
hasValue?: boolean
}
import { StylehComponent, ThemedOuterStyledProps } from '../typings'
export interface StyledInputWrapPropsOverrides {
isValid: boolean
className?: string
}
// ReactInputProps &
export type StyledInputWrapProps = ReactDivProps & StyledInputWrapPropsOverrides
export type StyledInputWrapType = StylehComponent<StyledInputWrapProps>
export type StyledInputWrapThemedProps = ThemedOuterStyledProps<
StyledInputWrapProps,
any
>
// === complex ===
// export type RenderWrapRemainingProps = StyledInputWrapProps & {
// // some issue merging...
// // instance?: any
// // ref?: any
// onChange: never
// onFocus: never
// onBlur: never
// identifier: never
// value: never
// label: never
// tooltip: never
// type: never
// isActive: never
// 'aria-label': never
// 'data-qa': never
// }
// adding it as optional as any
export type Anyify<Typing, Keys extends keyof Typing> = Pick<
Typing,
Exclude<keyof Typing, Keys>
> &
{ [Property in Keys]?: any }
export type Omit<Typing, Keys extends keyof Typing> = Pick<
Typing,
Exclude<keyof Typing, Keys>
>
type RenderWrapRemainingPropsAnyRef = Anyify<StyledInputWrapProps, 'ref'>
export type RenderWrapRemainingProps = Omit<
RenderWrapRemainingPropsAnyRef,
RenderWrapIgnoredProps
>
// @note changed this because renderProp is optional...
export type ObserverInputProps = InputPropsBase &
Partial<InputPropsRenderPropsOnly>
export type RenderWrapIgnoredProps =
| 'onChange'
| 'onFocus'
| 'onBlur'
| 'identifier'
| 'value'
| 'label'
| 'isActive'
| 'tooltip'
| 'type'
| 'aria-label'
| 'data-qa'
| 'maxLength'
| 'minLength'
| 'placeholder'
| 'pattern'
| 'required'
// | 'isRequired'