Repository URL to install this package:
|
Version:
3.7.2 ▾
|
/**
* @file @TODO !!! THIS IS NOT OBSERVER INPUT, THIS IS INPUTSTATE !!!
* ^ PROBABLY WILL NEED OBSERVERINPUT + INPUTSTATE
*/
import { defaultRenderWrap } from '../../inputs'
/**
*
* most of the old forms is done in ObserverForm...
*
* @todo create InputState & add?
* - updateFocused
* - validateInput
* - setValue
* - getValue
* - setValidationType
* - setIsValidInput
* - disable
* - enable
* - invalid
* - valid
* - select
* - unselect
* - setIsSelected
* - setInputReference
* - setProps
*/
export class OldInputConfigAdapter {
// may want to adapt to new form plugin names
// type: string
store = new Map()
renderInputWrap?: any
// @todo !!! ui-component help for adapting this mini piece
// ^ as in the TODO file
animatePlaceholder?: boolean
// onBlur?: (...args: any) => void
// onFocus?: (...args: any) => void
// on...?: (...args: any) => void
// ariaLabel?: string
/** does not make much sense, maybe it is passthrough? @todo search & see */
// icon?: { [key: string]: any }
// => pass prop
set wrapperClassName(className: string) {
console.warn(`@deprecated [@skava/forms]
this will be removed in the next major release: '''
const inputsList = [
{
wrapperClassName: ${className},
},
]
'''
instead use: '''
const inputsList = [
{
// or, you will not need this
// because there is a plugin for it already prestyled!
//
// check the link on the list of existing plugins
// and how to quickly make your own
renderInputWrap: renderWrap,
},
]
'''
for code examples + live demo links + docs on @skava/form 3.0 release:
https://bitbucket.org/skava-admin/mono/wiki/forms-3.0
`)
const renderWrap = props => defaultRenderWrap({ ...props, className })
this.renderInputWrap = renderWrap
}
// => propertyName
set name(name: string) {
this.store.set('propertyName', name)
}
get name() {
return this.store.get('propertyName')
}
// not sure we need to adapt the new way...
set propertyName(propertyName: string) {
this.store.set('propertyName', propertyName)
}
get propertyName() {
return this.store.get('propertyName')
}
// @todo - dedupe
// labelText?: string
// label?: string
set minLength(length: string | number) {
console.warn(`@deprecated [@skava/forms]
this will be removed in the next major release: '''
const inputsList = [
{
minLength: ${length},
type: 'text',
autocomplete: 'given name',
},
]
'''
instead use: '''
const inputsList = [
{
// you will not need this because the validation should be in plugins!
// check the link on the list of existing plugins
// and how to quickly make your own
type: 'firstName',
// in the urgent case you do
// the docs on how to pass in a similar prop can be found in the docs page
// note it is not recommended, please see if there is a better way
},
]
'''
for code examples + live demo links + docs on @skava/form 3.0 release:
https://bitbucket.org/skava-admin/mono/wiki/forms-3.0
`)
}
set maxLength(length: string | number) {
console.warn(`@deprecated [@skava/forms]
this will be removed in the next major release: '''
const inputsList = [
{
maxLength: ${length},
type: 'text',
autocomplete: 'given name',
},
]
'''
instead use: '''
const inputsList = [
{
// you will not need this because the validation should be in plugins!
// check the link on the list of existing plugins
// and how to quickly make your own
type: 'firstName',
// in the urgent case you do
// the docs on how to pass in a similar prop can be found in the docs page
// note it is not recommended, please see if there is a better way
},
]
'''
for code examples + live demo links + docs on @skava/form 3.0 release:
https://bitbucket.org/skava-admin/mono/wiki/forms-3.0
`)
}
/**
* @todo we may need to map all of the validations here...
*/
set validationType(validationType: string) {
console.warn(`@deprecated [@skava/forms]
this will be removed in the next major release: '''
const inputsList = [
{
validationType: ${validationType},
type: 'text',
autocomplete: 'given name',
},
]
'''
instead use: '''
// example plugin, see the docs for more
class TelephonePlugin extends React.Component<InputProps> {
static isSatisfiedByProps(props: { type: string }): boolean {
return ['telephone'].includes(props.type)
}
static defaultState = {
propertyName: 'telephone',
label: 'Phone',
validator: (inputState: InputState) =>
isValidTelephone(inputState.value as string),
}
static defaultProps = {
minLength: 4,
required: true,
placeholder: '1250',
pattern: '[+()0-9]+',
type: 'tel',
autoComplete: 'tel',
}
render() {
// you can easily compose plugins since they are just components :)
return <ObserverInput {...this.props} />
}
}
const inputsList = [
{
type: 'telephone',
},
]
<PluginsContext.Provider value={[ TelephonePlugin ]}>
<PageOrFormAtAnyLevel />
</PluginsContext.Provider>
'''
for code examples + live demo links + docs on @skava/form 3.0 release:
https://bitbucket.org/skava-admin/mono/wiki/forms-3.0
`)
}
set errorMessageFor(errorMessageFor: string) {
console.warn(`@deprecated [@skava/forms]
@see the log for validationType (which is always hand in hand with 'validationType')
this will be removed in the next major release: '''
const inputsList = [
{
errorMessageFor: ${errorMessageFor},
type: 'text',
},
]
'''
instead use: '''
// example plugin, see the docs for more
class EhPlugin extends React.Component<InputProps> {
static isSatisfiedByProps(props: { type: string }): boolean {
return ['eh'].includes(props.type)
}
static defaultState = {
propertyName: 'example',
label: 'Eh!',
validator: (inputState: InputState) => {
// !!!!! note this stuff here !!!!!!
if (isValidTelephone(inputState.value)) {
return true
} else {
// using this, can customize the error message to the feature
return 'error message!'
}
}
}
render() {
return <ObserverInput {...this.props} />
}
}
const inputsList = [
{
type: 'eh',
},
]
'''
for code examples + live demo links + docs on @skava/form 3.0 release:
https://bitbucket.org/skava-admin/mono/wiki/forms-3.0
`)
}
set qa(qa: string) {
this.dataQa = qa
}
set dataQa(qa: string) {
console.warn(`@deprecated [@skava/forms]
@see the log for validationType (which is always hand in hand with 'validationType')
this will be removed in the next major release: '''
const inputsList = [
{
qa: ${qa},
type: 'text',
},
]
'''
instead use: '''
// example plugin, see the docs for more
class EhPlugin extends React.Component<InputProps> {
static isSatisfiedByProps(props: { type: string }): boolean {
return ['eh'].includes(props.type)
}
static defaultState = {
propertyName: 'example',
label: 'Eh!',
validator: (inputState: InputState) => {
// !!!!! note this stuff here !!!!!!
if (isValidTelephone(inputState.value)) {
return true
} else {
// using this, can customize the error message to the feature
return 'error message!'
}
}
}
render() {
return <ObserverInput {...this.props} />
}
}
const inputsList = [
{
type: 'eh',
},
]
'''
for code examples + live demo links + docs on @skava/form 3.0 release:
https://bitbucket.org/skava-admin/mono/wiki/forms-3.0
`)
// putting it here, may need to autocomplete
this['data-qa'] = qa
}
autoComplete?: string
set autocomplete(autocomplete: string) {
this.autoComplete = autocomplete
}
}