2019-11-08 01:03:34 +03:00
import isUrl from 'is-url' ;
2019-10-07 17:24:30 +03:00
import nanoid from 'nanoid' ;
2019-11-15 22:44:01 +03:00
import isPlainObject from 'is-plain-object' ;
2019-10-07 17:24:30 +03:00
var library = {
// === SINGLE LINE TEXT STYLE INPUTS
text : {
classification : 'text' ,
component : 'FormulateInputText'
} ,
email : {
classification : 'text' ,
component : 'FormulateInputText'
} ,
number : {
classification : 'text' ,
component : 'FormulateInputText'
} ,
color : {
classification : 'text' ,
component : 'FormulateInputText'
} ,
date : {
classification : 'text' ,
component : 'FormulateInputText'
} ,
hidden : {
classification : 'text' ,
component : 'FormulateInputText'
} ,
month : {
classification : 'text' ,
component : 'FormulateInputText'
} ,
password : {
classification : 'text' ,
component : 'FormulateInputText'
} ,
search : {
classification : 'text' ,
component : 'FormulateInputText'
} ,
tel : {
classification : 'text' ,
component : 'FormulateInputText'
} ,
time : {
classification : 'text' ,
component : 'FormulateInputText'
} ,
url : {
classification : 'text' ,
component : 'FormulateInputText'
} ,
week : {
classification : 'text' ,
component : 'FormulateInputText'
} ,
'datetime-local' : {
classification : 'text' ,
component : 'FormulateInputText'
} ,
2019-11-14 09:00:56 +03:00
// === SLIDER INPUTS
range : {
classification : 'slider' ,
component : 'FormulateInputSlider'
} ,
2019-10-07 17:24:30 +03:00
// === MULTI LINE TEXT INPUTS
textarea : {
classification : 'textarea' ,
component : 'FormulateInputTextArea'
} ,
// === BOX STYLE INPUTS
checkbox : {
classification : 'box' ,
component : 'FormulateInputBox'
} ,
radio : {
classification : 'box' ,
component : 'FormulateInputBox'
} ,
// === BUTTON STYLE INPUTS
submit : {
classification : 'button' ,
component : 'FormulateInputButton'
} ,
button : {
classification : 'button' ,
component : 'FormulateInputButton'
} ,
// === SELECT STYLE INPUTS
select : {
classification : 'select' ,
component : 'FormulateInputSelect'
2019-11-15 22:44:01 +03:00
} ,
// === FILE TYPE
file : {
classification : 'file' ,
component : 'FormulateInputFile'
} ,
image : {
classification : 'file' ,
component : 'FormulateInputFile'
}
} ;
/ * *
* The file upload class holds and represents a file ’ s upload state durring
* the upload flow .
* /
2019-11-19 15:15:13 +03:00
var FileUpload = function FileUpload ( input , context , options ) {
this . input = input ;
this . fileList = input . files ;
2019-11-15 22:44:01 +03:00
this . files = [ ] ;
this . options = options ;
2019-11-19 15:15:13 +03:00
this . addFileList ( this . fileList ) ;
2019-11-15 22:44:01 +03:00
this . context = context ;
} ;
/ * *
* Produce an array of files and alert the callback .
* @ param { FileList }
* /
2019-11-19 15:15:13 +03:00
FileUpload . prototype . addFileList = function addFileList ( fileList ) {
var this $1 = this ;
var loop = function ( i ) {
var file = fileList [ i ] ;
var uuid = nanoid ( ) ;
var removeFile = function ( ) {
this . removeFile ( uuid ) ;
} ;
this $1 . files . push ( {
progress : false ,
error : false ,
complete : false ,
justFinished : false ,
2019-11-15 22:44:01 +03:00
name : file . name || 'file-upload' ,
file : file ,
2019-11-19 15:15:13 +03:00
uuid : uuid ,
2019-11-21 08:29:28 +03:00
path : false ,
removeFile : removeFile . bind ( this $1 ) ,
previewData : false
2019-11-15 22:44:01 +03:00
} ) ;
2019-11-19 15:15:13 +03:00
} ;
for ( var i = 0 ; i < fileList . length ; i ++ ) loop ( i ) ;
2019-11-15 22:44:01 +03:00
} ;
/ * *
* Check if the file has an .
* /
FileUpload . prototype . hasUploader = function hasUploader ( ) {
return ! ! this . context . uploader
} ;
2019-11-21 07:16:31 +03:00
/ * *
* Check if the given uploader is axios instance .
* /
2019-11-15 22:44:01 +03:00
FileUpload . prototype . uploaderIsAxios = function uploaderIsAxios ( ) {
if (
this . hasUploader &&
typeof this . hasUploader . request === 'function' &&
typeof this . hasUploader . get === 'function' &&
typeof this . hasUploader . delete === 'function' &&
typeof this . hasUploader . post === 'function'
) {
return true
2019-10-07 17:24:30 +03:00
}
2019-11-15 22:44:01 +03:00
return false
} ;
/ * *
* Get a new uploader function .
* /
FileUpload . prototype . getUploader = function getUploader ( ) {
var ref ;
var args = [ ] , len = arguments . length ;
while ( len -- ) args [ len ] = arguments [ len ] ;
if ( this . uploaderIsAxios ( ) ) {
var formData = new FormData ( ) ;
formData . append ( this . context . name || 'file' , args [ 0 ] ) ;
return this . uploader . post ( this . context . uploadUrl , formData , {
headers : {
'Content-Type' : 'multipart/form-data'
} ,
onUploadProgress : function ( progressEvent ) {
args [ 1 ] ( Math . round ( ( progressEvent . loaded * 100 ) / progressEvent . total ) ) ;
}
} )
. catch ( function ( err ) { return args [ 2 ] ( err ) ; } )
}
return ( ref = this . context ) . uploader . apply ( ref , args )
} ;
/ * *
* Perform the file upload .
* /
FileUpload . prototype . upload = function upload ( ) {
var this $1 = this ;
return new Promise ( function ( resolve , reject ) {
if ( ! this $1 . hasUploader ) {
return reject ( new Error ( 'No uploader has been defined' ) )
}
Promise . all ( this $1 . files . map ( function ( file ) {
2019-11-21 07:16:31 +03:00
return file . path ? Promise . resolve ( file . path ) : this $1 . getUploader (
2019-11-15 22:44:01 +03:00
file . file ,
2019-11-19 15:15:13 +03:00
function ( progress ) {
file . progress = progress ;
if ( progress >= 100 ) {
if ( ! file . complete ) {
file . justFinished = true ;
setTimeout ( function ( ) { file . justFinished = false ; } , this $1 . options . uploadJustCompleteDuration ) ;
}
file . complete = true ;
}
} ,
function ( error ) {
file . progress = 0 ;
file . error = error ;
file . complete = true ;
} ,
2019-11-15 22:44:01 +03:00
this $1 . options
)
} ) )
. then ( function ( results ) { return resolve ( results ) ; } )
. catch ( function ( err ) { throw new Error ( err ) } ) ;
} )
} ;
2019-11-19 15:15:13 +03:00
/ * *
* Remove a file from the uploader ( and the file list )
* @ param { string } uuid
* /
FileUpload . prototype . removeFile = function removeFile ( uuid ) {
this . files = this . files . filter ( function ( file ) { return file . uuid !== uuid ; } ) ;
if ( window ) {
var transfer = new DataTransfer ( ) ;
this . files . map ( function ( file ) { return transfer . items . add ( file . file ) ; } ) ;
this . fileList = transfer . files ;
this . input . files = this . fileList ;
}
} ;
2019-11-21 08:29:28 +03:00
/ * *
* load image previews for all uploads .
* /
FileUpload . prototype . loadPreviews = function loadPreviews ( ) {
this . files . map ( function ( file ) {
if ( ! file . previewData && window && window . FileReader && /^image\// . test ( file . file . type ) ) {
var reader = new FileReader ( ) ;
reader . onload = function ( e ) { return Object . assign ( file , { previewData : e . target . result } ) ; } ;
reader . readAsDataURL ( file . file ) ;
}
} ) ;
} ;
2019-11-15 22:44:01 +03:00
/ * *
* Get the files .
* /
FileUpload . prototype . getFileList = function getFileList ( ) {
return this . fileList
} ;
/ * *
* Get the files .
* /
FileUpload . prototype . getFiles = function getFiles ( ) {
return this . files
2019-10-07 17:24:30 +03:00
} ;
2020-02-26 01:32:40 +03:00
FileUpload . prototype . toString = function toString ( ) {
var descriptor = this . files . length ? this . files . length + ' files' : 'empty' ;
return ( "FileUpload(" + descriptor + ")" )
} ;
2019-10-07 17:24:30 +03:00
/ * *
* Function to map over an object .
* @ param { Object } obj An object to map over
* @ param { Function } callback
* /
function map ( original , callback ) {
var obj = { } ;
for ( var key in original ) {
obj [ key ] = callback ( key , original [ key ] ) ;
}
return obj
}
/ * *
2019-10-08 20:50:53 +03:00
* Shallow equal .
* @ param { } objA
* @ param { * } objB
2019-10-07 17:24:30 +03:00
* /
2019-10-08 20:50:53 +03:00
function shallowEqualObjects ( objA , objB ) {
if ( objA === objB ) {
return true
}
if ( ! objA || ! objB ) {
return false
}
var aKeys = Object . keys ( objA ) ;
var bKeys = Object . keys ( objB ) ;
var len = aKeys . length ;
if ( bKeys . length !== len ) {
return false
2019-10-07 17:24:30 +03:00
}
2019-10-08 20:50:53 +03:00
for ( var i = 0 ; i < len ; i ++ ) {
var key = aKeys [ i ] ;
if ( objA [ key ] !== objB [ key ] ) {
return false
}
}
return true
2019-10-07 17:24:30 +03:00
}
2019-11-07 01:17:19 +03:00
/ * *
* Given a string , object , falsey , or array - return an array .
* @ param { mixed } item
* /
function arrayify ( item ) {
if ( ! item ) {
return [ ]
}
if ( typeof item === 'string' ) {
return [ item ]
}
if ( Array . isArray ( item ) ) {
return item
}
if ( typeof item === 'object' ) {
return Object . values ( item )
}
return [ ]
}
2019-11-14 00:10:17 +03:00
/ * *
* How to add an item .
* @ param { string } item
* /
function sentence ( item ) {
if ( typeof item === 'string' ) {
return item [ 0 ] . toUpperCase ( ) + item . substr ( 1 )
}
return item
}
2019-11-08 01:03:34 +03:00
/ * *
* Given an array or string return an array of callables .
* @ param { array | string } validation
* @ param { array } rules and array of functions
* @ return { array } an array of functions
* /
function parseRules ( validation , rules ) {
if ( typeof validation === 'string' ) {
return parseRules ( validation . split ( '|' ) , rules )
}
if ( ! Array . isArray ( validation ) ) {
return [ ]
}
return validation . map ( function ( rule ) { return parseRule ( rule , rules ) ; } ) . filter ( function ( f ) { return ! ! f ; } )
}
/ * *
* Given a string or function , parse it and return the an array in the format
* [ fn , [ ... arguments ] ]
* @ param { string | function } rule
* /
function parseRule ( rule , rules ) {
if ( typeof rule === 'function' ) {
return [ rule , [ ] ]
}
if ( Array . isArray ( rule ) && rule . length ) {
2019-11-14 00:10:17 +03:00
rule = rule . map ( function ( r ) { return r ; } ) ; // light clone
2019-11-08 01:03:34 +03:00
if ( typeof rule [ 0 ] === 'string' && rules . hasOwnProperty ( rule [ 0 ] ) ) {
return [ rules [ rule . shift ( ) ] , rule ]
}
if ( typeof rule [ 0 ] === 'function' ) {
return [ rule . shift ( ) , rule ]
}
}
if ( typeof rule === 'string' ) {
var segments = rule . split ( ':' ) ;
var functionName = segments . shift ( ) ;
if ( rules . hasOwnProperty ( functionName ) ) {
return [ rules [ functionName ] , segments . length ? segments . join ( ':' ) . split ( ',' ) : [ ] ]
} else {
throw new Error ( ( "Unknown validation rule " + rule ) )
}
}
return false
}
2019-11-14 09:00:56 +03:00
/ * *
* Escape a string for use in regular expressions .
* @ param { string } string
* /
function escapeRegExp ( string ) {
return string . replace ( /[.*+?^${}()|[\]\\]/g , '\\$&' ) // $& means the whole matched string
}
/ * *
* Given a string format ( date ) return a regex to match against .
* @ param { string } format
* /
function regexForFormat ( format ) {
var escaped = "^" + ( escapeRegExp ( format ) ) + "$" ;
var formats = {
MM : '(0[1-9]|1[012])' ,
M : '([1-9]|1[012])' ,
DD : '([012][1-9]|3[01])' ,
D : '([012]?[1-9]|3[01])' ,
YYYY : '\\d{4}' ,
YY : '\\d{2}'
} ;
return new RegExp ( Object . keys ( formats ) . reduce ( function ( regex , format ) {
return regex . replace ( format , formats [ format ] )
} , escaped ) )
}
2020-02-26 01:32:40 +03:00
/ * *
* Check if
* @ param { mixed } data
* /
function isValueType ( data ) {
switch ( typeof data ) {
case 'symbol' :
case 'number' :
case 'string' :
case 'boolean' :
case 'undefined' :
return true
default :
if ( data === null ) {
return true
}
return false
}
}
/ * *
* A simple ( somewhat non - comprehensive ) cloneDeep function , valid for our use
* case of needing to unbind reactive watchers .
* /
function cloneDeep ( obj ) {
var newObj = { } ;
for ( var key in obj ) {
if ( obj [ key ] instanceof FileUpload || isValueType ( obj [ key ] ) ) {
newObj [ key ] = obj ;
} else {
newObj [ key ] = cloneDeep ( obj [ key ] ) ;
}
}
return newObj
}
2019-11-08 01:03:34 +03:00
/ * *
* Library of rules
* /
var rules = {
/ * *
* Rule : the value must be "yes" , "on" , "1" , or true
* /
2020-02-26 01:32:40 +03:00
accepted : function ( ref ) {
var value = ref . value ;
2019-11-08 01:03:34 +03:00
return Promise . resolve ( [ 'yes' , 'on' , '1' , 1 , true , 'true' ] . includes ( value ) )
} ,
/ * *
* Rule : checks if a value is after a given date . Defaults to current time
* /
2020-02-26 01:32:40 +03:00
after : function ( ref , compare ) {
var value = ref . value ;
2019-11-08 01:03:34 +03:00
if ( compare === void 0 ) compare = false ;
var timestamp = Date . parse ( compare || new Date ( ) ) ;
var fieldValue = Date . parse ( value ) ;
return Promise . resolve ( isNaN ( fieldValue ) ? false : ( fieldValue > timestamp ) )
} ,
/ * *
2019-11-14 00:10:17 +03:00
* Rule : checks if the value is only alpha
2019-11-08 01:03:34 +03:00
* /
2020-02-26 01:32:40 +03:00
alpha : function ( ref , set ) {
var value = ref . value ;
2019-11-08 01:03:34 +03:00
if ( set === void 0 ) set = 'default' ;
var sets = {
default : /^[a-zA-ZÀ-ÖØ-öø-ÿ]+$/ ,
2019-11-14 00:10:17 +03:00
latin : /^[a-zA-Z]+$/
2019-11-08 01:03:34 +03:00
} ;
var selectedSet = sets . hasOwnProperty ( set ) ? set : 'default' ;
return Promise . resolve ( sets [ selectedSet ] . test ( value ) )
} ,
/ * *
* Rule : checks if the value is alpha numeric
* /
2020-02-26 01:32:40 +03:00
alphanumeric : function ( ref , set ) {
var value = ref . value ;
2019-11-08 01:03:34 +03:00
if ( set === void 0 ) set = 'default' ;
var sets = {
default : /^[a-zA-Z0-9À-ÖØ-öø-ÿ]+$/ ,
2019-11-14 00:10:17 +03:00
latin : /^[a-zA-Z0-9]+$/
2019-11-08 01:03:34 +03:00
} ;
var selectedSet = sets . hasOwnProperty ( set ) ? set : 'default' ;
return Promise . resolve ( sets [ selectedSet ] . test ( value ) )
} ,
2019-11-14 00:10:17 +03:00
/ * *
* Rule : checks if a value is after a given date . Defaults to current time
* /
2020-02-26 01:32:40 +03:00
before : function ( ref , compare ) {
var value = ref . value ;
2019-11-14 00:10:17 +03:00
if ( compare === void 0 ) compare = false ;
var timestamp = Date . parse ( compare || new Date ( ) ) ;
var fieldValue = Date . parse ( value ) ;
return Promise . resolve ( isNaN ( fieldValue ) ? false : ( fieldValue < timestamp ) )
} ,
2019-11-08 01:03:34 +03:00
/ * *
* Rule : checks if the value is between two other values
* /
2020-02-26 01:32:40 +03:00
between : function ( ref , from , to ) {
var value = ref . value ;
2019-11-14 00:10:17 +03:00
if ( from === void 0 ) from = 0 ;
if ( to === void 0 ) to = 10 ;
2019-11-08 01:03:34 +03:00
return Promise . resolve ( ( function ( ) {
if ( from === null || to === null || isNaN ( from ) || isNaN ( to ) ) {
return false
}
from = Number ( from ) ;
to = Number ( to ) ;
if ( ! isNaN ( value ) ) {
value = Number ( value ) ;
return ( value > from && value < to )
}
if ( typeof value === 'string' ) {
return value . length > from && value . length < to
}
return false
} ) ( ) )
} ,
2020-02-26 01:32:40 +03:00
/ * *
* Confirm that the value of one field is the same as another , mostly used
* for password confirmations .
* /
confirm : function ( ref , field ) {
var value = ref . value ;
var getFormValues = ref . getFormValues ;
var name = ref . name ;
return Promise . resolve ( ( function ( ) {
var formValues = getFormValues ( ) ;
var confirmationFieldName = field ;
if ( ! confirmationFieldName ) {
confirmationFieldName = /_confirm$/ . test ( name ) ? name . substr ( 0 , name . length - 8 ) : ( name + "_confirm" ) ;
}
return formValues [ confirmationFieldName ] === value
} ) ( ) )
} ,
2019-11-14 00:10:17 +03:00
/ * *
2019-11-14 09:00:56 +03:00
* Rule : ensures the value is a date according to Date . parse ( ) , or a format
* regex .
2019-11-14 00:10:17 +03:00
* /
2020-02-26 01:32:40 +03:00
date : function ( ref , format ) {
var value = ref . value ;
2019-11-14 09:00:56 +03:00
if ( format === void 0 ) format = false ;
return Promise . resolve ( ( function ( ) {
if ( format && typeof format === 'string' ) {
return regexForFormat ( format ) . test ( value )
}
return ! isNaN ( Date . parse ( value ) )
} ) ( ) )
2019-11-14 00:10:17 +03:00
} ,
2019-11-08 01:03:34 +03:00
/ * *
* Rule : tests
* /
2020-02-26 01:32:40 +03:00
email : function ( ref ) {
var value = ref . value ;
2019-11-08 01:03:34 +03:00
// eslint-disable-next-line
var isEmail = /^(([^<>()\[\]\.,;:\s@\"]+(\.[^<>()\[\]\.,;:\s@\"]+)*)|(\".+\"))@(([^<>()[\]\.,;:\s@\"]+\.)+[^<>()[\]\.,;:\s@\"]{2,})$/i ;
return Promise . resolve ( isEmail . test ( value ) )
} ,
2019-11-14 00:10:17 +03:00
/ * *
* Rule : Value is in an array ( stack ) .
* /
2020-02-26 01:32:40 +03:00
in : function ( ref ) {
var value = ref . value ;
2019-11-14 00:10:17 +03:00
var stack = [ ] , len = arguments . length - 1 ;
while ( len -- > 0 ) stack [ len ] = arguments [ len + 1 ] ;
return Promise . resolve ( stack . find ( function ( item ) {
if ( typeof item === 'object' ) {
return shallowEqualObjects ( item , value )
}
return item === value
} ) !== undefined )
} ,
/ * *
* Rule : Match the value against a ( stack ) of patterns or strings
* /
2020-02-26 01:32:40 +03:00
matches : function ( ref ) {
var value = ref . value ;
2019-11-14 00:10:17 +03:00
var stack = [ ] , len = arguments . length - 1 ;
while ( len -- > 0 ) stack [ len ] = arguments [ len + 1 ] ;
return Promise . resolve ( ! ! stack . find ( function ( pattern ) {
if ( pattern instanceof RegExp ) {
return pattern . test ( value )
}
return pattern === value
} ) )
} ,
/ * *
* Check the maximum value of a particular .
* /
2020-02-26 01:32:40 +03:00
max : function ( ref , minimum , force ) {
var value = ref . value ;
2019-11-14 00:10:17 +03:00
if ( minimum === void 0 ) minimum = 10 ;
return Promise . resolve ( ( function ( ) {
2019-11-15 22:44:01 +03:00
if ( Array . isArray ( value ) ) {
minimum = ! isNaN ( minimum ) ? Number ( minimum ) : minimum ;
2019-11-14 00:10:17 +03:00
return value . length <= minimum
}
2019-11-15 22:44:01 +03:00
if ( ( ! isNaN ( value ) && force !== 'length' ) || force === 'value' ) {
value = ! isNaN ( value ) ? Number ( value ) : value ;
return value <= minimum
}
if ( typeof value === 'string' || ( force === 'length' ) ) {
value = ! isNaN ( value ) ? value . toString ( ) : value ;
2019-11-14 00:10:17 +03:00
return value . length <= minimum
}
return false
} ) ( ) )
} ,
2019-11-08 01:03:34 +03:00
/ * *
* Check the file type is correct .
* /
2020-02-26 01:32:40 +03:00
mime : function ( ref ) {
var value = ref . value ;
2019-11-08 01:03:34 +03:00
var types = [ ] , len = arguments . length - 1 ;
while ( len -- > 0 ) types [ len ] = arguments [ len + 1 ] ;
return Promise . resolve ( ( function ( ) {
2020-02-26 01:32:40 +03:00
if ( value instanceof FileUpload ) {
var fileList = value . getFileList ( ) ;
2019-11-19 15:15:13 +03:00
for ( var i = 0 ; i < fileList . length ; i ++ ) {
var file = fileList [ i ] ;
if ( ! types . includes ( file . type ) ) {
2019-11-08 01:03:34 +03:00
return false
}
}
}
return true
} ) ( ) )
} ,
/ * *
* Check the minimum value of a particular .
* /
2020-02-26 01:32:40 +03:00
min : function ( ref , minimum , force ) {
var value = ref . value ;
2019-11-14 00:10:17 +03:00
if ( minimum === void 0 ) minimum = 1 ;
2019-11-08 01:03:34 +03:00
return Promise . resolve ( ( function ( ) {
2020-01-28 20:12:08 +03:00
if ( Array . isArray ( value ) ) {
minimum = ! isNaN ( minimum ) ? Number ( minimum ) : minimum ;
2019-11-08 01:03:34 +03:00
return value . length >= minimum
}
2020-01-28 20:12:08 +03:00
if ( ( ! isNaN ( value ) && force !== 'length' ) || force === 'value' ) {
value = ! isNaN ( value ) ? Number ( value ) : value ;
return value >= minimum
}
if ( typeof value === 'string' || ( force === 'length' ) ) {
value = ! isNaN ( value ) ? value . toString ( ) : value ;
2019-11-08 01:03:34 +03:00
return value . length >= minimum
}
return false
} ) ( ) )
} ,
/ * *
2019-11-14 00:10:17 +03:00
* Rule : Value is not in stack .
2019-11-08 01:03:34 +03:00
* /
2020-02-26 01:32:40 +03:00
not : function ( ref ) {
var value = ref . value ;
2019-11-14 00:10:17 +03:00
var stack = [ ] , len = arguments . length - 1 ;
while ( len -- > 0 ) stack [ len ] = arguments [ len + 1 ] ;
return Promise . resolve ( stack . find ( function ( item ) {
if ( typeof item === 'object' ) {
return shallowEqualObjects ( item , value )
}
return item === value
} ) === undefined )
} ,
/ * *
* Rule : checks if the value is only alpha numeric
* /
2020-02-26 01:32:40 +03:00
number : function ( ref ) {
var value = ref . value ;
2019-11-14 00:10:17 +03:00
return Promise . resolve ( ! isNaN ( value ) )
} ,
/ * *
* Rule : must be a value
* /
2020-02-26 01:32:40 +03:00
required : function ( ref , isRequired ) {
var value = ref . value ;
2019-11-14 00:10:17 +03:00
if ( isRequired === void 0 ) isRequired = true ;
2019-11-08 01:03:34 +03:00
return Promise . resolve ( ( function ( ) {
2019-11-14 00:10:17 +03:00
if ( ! isRequired || [ 'no' , 'false' ] . includes ( isRequired ) ) {
return true
}
if ( Array . isArray ( value ) ) {
return ! ! value . length
2019-11-08 01:03:34 +03:00
}
if ( typeof value === 'string' ) {
2019-11-14 00:10:17 +03:00
return ! ! value
2019-11-08 01:03:34 +03:00
}
2019-11-14 00:10:17 +03:00
if ( typeof value === 'object' ) {
return ( ! value ) ? false : ! ! Object . keys ( value ) . length
2019-11-08 01:03:34 +03:00
}
2019-11-14 00:10:17 +03:00
return true
2019-11-08 01:03:34 +03:00
} ) ( ) )
2019-11-14 00:10:17 +03:00
} ,
/ * *
* Rule : checks if a string is a valid url
* /
2020-02-26 01:32:40 +03:00
url : function ( ref ) {
var value = ref . value ;
2019-11-14 00:10:17 +03:00
return Promise . resolve ( isUrl ( value ) )
}
} ;
/ * *
* Validation error message generators .
* /
var en = {
/ * *
* Valid accepted value .
* /
accepted : function ( ref ) {
var name = ref . name ;
return ( "Please accept the " + name + "." )
} ,
/ * *
* The date is not after .
* /
after : function ( ref ) {
var name = ref . name ;
var args = ref . args ;
if ( Array . isArray ( args ) && args . length ) {
return ( ( sentence ( name ) ) + " must be after " + ( args [ 0 ] ) + "." )
}
return ( ( sentence ( name ) ) + " must be a later date." )
} ,
/ * *
* The value is not a letter .
* /
alpha : function ( ref ) {
var name = ref . name ;
return ( ( sentence ( name ) ) + " can only contain alphabetical characters." )
} ,
/ * *
* Rule : checks if the value is alpha numeric
* /
alphanumeric : function ( ref ) {
var name = ref . name ;
return ( ( sentence ( name ) ) + " can only contain letters and numbers." )
} ,
/ * *
* The date is not before .
* /
before : function ( ref ) {
var name = ref . name ;
var args = ref . args ;
if ( Array . isArray ( args ) && args . length ) {
return ( ( sentence ( name ) ) + " must be before " + ( args [ 0 ] ) + "." )
}
return ( ( sentence ( name ) ) + " must be an earlier date." )
} ,
/ * *
* The value is not between two numbers or lengths
* /
between : function ( ref ) {
var name = ref . name ;
var value = ref . value ;
var args = ref . args ;
if ( ! isNaN ( value ) ) {
return ( ( sentence ( name ) ) + " must be between " + ( args [ 0 ] ) + " and " + ( args [ 1 ] ) + "." )
}
return ( ( sentence ( name ) ) + " must be between " + ( args [ 0 ] ) + " and " + ( args [ 1 ] ) + " characters long." )
} ,
2020-02-26 01:32:40 +03:00
/ * *
* The confirmation field does not match
* /
confirm : function ( ref ) {
var name = ref . name ;
var args = ref . args ;
return ( ( sentence ( name ) ) + " does not match." )
} ,
2019-11-14 00:10:17 +03:00
/ * *
* Is not a valid date .
* /
date : function ( ref ) {
var name = ref . name ;
2019-11-14 09:00:56 +03:00
var args = ref . args ;
2019-11-14 00:10:17 +03:00
2019-11-14 09:00:56 +03:00
if ( Array . isArray ( args ) && args . length ) {
return ( ( sentence ( name ) ) + " is not a valid, please use the format " + ( args [ 0 ] ) )
}
2019-11-14 00:10:17 +03:00
return ( ( sentence ( name ) ) + " is not a valid date." )
} ,
/ * *
* The default render method for error messages .
* /
default : function ( ref ) {
var name = ref . name ;
return "This field isn’ t valid."
} ,
/ * *
* Is not a valid email address .
* /
email : function ( ref ) {
var name = ref . name ;
var value = ref . value ;
2019-11-14 09:00:56 +03:00
if ( ! value ) {
return 'Please enter a valid email address.'
}
return ( "“" + value + "” is not a valid email address." )
2019-11-14 00:10:17 +03:00
} ,
/ * *
* Value is an allowed value .
* /
in : function ( ref ) {
var name = ref . name ;
var value = ref . value ;
2019-11-14 09:00:56 +03:00
if ( typeof value === 'string' && value ) {
2019-11-14 00:10:17 +03:00
return ( "“" + ( sentence ( value ) ) + "” is not an allowed " + name + "." )
}
2019-11-14 09:00:56 +03:00
return ( "This is not an allowed " + name + "." )
2019-11-14 00:10:17 +03:00
} ,
/ * *
* Value is not a match .
* /
matches : function ( ref ) {
var name = ref . name ;
return ( ( sentence ( name ) ) + " is not an allowed value." )
} ,
/ * *
* The maximum value allowed .
* /
max : function ( ref ) {
var name = ref . name ;
var value = ref . value ;
var args = ref . args ;
2019-11-15 22:44:01 +03:00
if ( Array . isArray ( value ) ) {
return ( "You may only select " + ( args [ 0 ] ) + " " + name + "." )
}
var force = Array . isArray ( args ) && args [ 1 ] ? args [ 1 ] : false ;
if ( ( ! isNaN ( value ) && force !== 'length' ) || force === 'value' ) {
return ( ( sentence ( name ) ) + " must be less than " + ( args [ 0 ] ) + "." )
2019-11-14 00:10:17 +03:00
}
2019-11-15 22:44:01 +03:00
return ( ( sentence ( name ) ) + " must be less than " + ( args [ 0 ] ) + " characters long." )
2019-11-14 00:10:17 +03:00
} ,
2019-11-19 15:15:13 +03:00
/ * *
* The ( field - level ) error message for mime errors .
* /
mime : function ( ref ) {
var name = ref . name ;
var args = ref . args ;
2020-01-28 20:12:08 +03:00
return ( ( sentence ( name ) ) + " must be of the the type: " + ( args [ 0 ] || 'No file formats allowed.' ) )
2019-11-19 15:15:13 +03:00
} ,
2019-11-14 00:10:17 +03:00
/ * *
* The maximum value allowed .
* /
min : function ( ref ) {
var name = ref . name ;
var value = ref . value ;
var args = ref . args ;
2019-11-15 22:44:01 +03:00
if ( Array . isArray ( value ) ) {
return ( "You must select at least " + ( args [ 0 ] ) + " " + name + "." )
}
var force = Array . isArray ( args ) && args [ 1 ] ? args [ 1 ] : false ;
if ( ( ! isNaN ( value ) && force !== 'length' ) || force === 'value' ) {
return ( ( sentence ( name ) ) + " must be more than " + ( args [ 0 ] ) + "." )
2019-11-14 00:10:17 +03:00
}
2019-11-15 22:44:01 +03:00
return ( ( sentence ( name ) ) + " must be more than " + ( args [ 0 ] ) + " characters long." )
2019-11-14 00:10:17 +03:00
} ,
/ * *
* The field is not an allowed value
* /
not : function ( ref ) {
var name = ref . name ;
var value = ref . value ;
return ( "“" + value + "” is not an allowed " + name + "." )
} ,
/ * *
* The field is not a number
* /
number : function ( ref ) {
var name = ref . name ;
return ( ( sentence ( name ) ) + " must be a number." )
} ,
/ * *
* Required field .
* /
required : function ( ref ) {
var name = ref . name ;
return ( ( sentence ( name ) ) + " is required." )
} ,
/ * *
* Value is not a url .
* /
url : function ( ref ) {
var name = ref . name ;
return "Please include a valid url."
2019-11-08 01:03:34 +03:00
}
} ;
2019-11-15 22:44:01 +03:00
/ * *
* A fake uploader used by default .
*
* @ param { File } file
* @ param { function } progress
* @ param { function } error
* @ param { object } options
* /
function fauxUploader ( file , progress , error , options ) {
return new Promise ( function ( resolve , reject ) {
2019-11-19 15:15:13 +03:00
var totalTime = ( options . fauxUploaderDuration || 2000 ) * ( 0.5 + Math . random ( ) ) ;
2019-11-15 22:44:01 +03:00
var start = performance . now ( ) ;
2020-01-28 20:12:08 +03:00
2019-11-19 15:15:13 +03:00
/ * *
2020-01-28 20:12:08 +03:00
* Create a recursive timeout that advances the progress .
2019-11-19 15:15:13 +03:00
* /
2019-11-15 22:44:01 +03:00
var advance = function ( ) { return setTimeout ( function ( ) {
var elapsed = performance . now ( ) - start ;
var currentProgress = Math . min ( 100 , Math . round ( elapsed / totalTime * 100 ) ) ;
progress ( currentProgress ) ;
2019-11-19 15:15:13 +03:00
2019-11-15 22:44:01 +03:00
if ( currentProgress >= 100 ) {
2019-11-19 15:15:13 +03:00
return resolve ( {
2019-11-15 22:44:01 +03:00
url : 'http://via.placeholder.com/350x150.png' ,
name : file . name
2019-11-19 15:15:13 +03:00
} )
2019-11-15 22:44:01 +03:00
} else {
advance ( ) ;
}
} , 20 ) ; } ;
advance ( ) ;
} )
}
2019-10-07 17:24:30 +03:00
/ * *
* For a single instance of an input , export all of the context needed to fully
* render that element .
* @ return { object }
* /
2019-10-08 20:50:53 +03:00
var context = {
context : function context ( ) {
return defineModel . call ( this , Object . assign ( { } , { type : this . type ,
value : this . value ,
2019-10-09 06:54:16 +03:00
name : this . nameOrFallback ,
2019-10-08 20:50:53 +03:00
classification : this . classification ,
component : this . component ,
id : this . id || this . defaultId ,
2020-01-28 20:12:08 +03:00
hasLabel : ( this . label && this . classification !== 'button' ) ,
2019-10-08 20:50:53 +03:00
label : this . label ,
labelPosition : this . logicalLabelPosition ,
2019-11-14 00:10:17 +03:00
attributes : this . elementAttributes ,
2019-11-15 22:44:01 +03:00
blurHandler : blurHandler . bind ( this ) ,
2019-11-21 08:29:28 +03:00
imageBehavior : this . imageBehavior ,
2019-11-15 22:44:01 +03:00
uploadUrl : this . uploadUrl ,
uploader : this . uploader || this . $formulate . getUploader ( ) ,
2019-11-19 15:15:13 +03:00
uploadBehavior : this . uploadBehavior ,
2019-11-21 07:16:31 +03:00
preventWindowDrops : this . preventWindowDrops ,
hasValidationErrors : this . hasValidationErrors } ,
2019-10-08 20:50:53 +03:00
this . typeContext ) )
} ,
2019-10-09 06:54:16 +03:00
nameOrFallback : nameOrFallback ,
2019-10-08 20:50:53 +03:00
typeContext : typeContext ,
elementAttributes : elementAttributes ,
2019-10-30 06:33:31 +03:00
logicalLabelPosition : logicalLabelPosition ,
2019-11-07 01:17:19 +03:00
isVmodeled : isVmodeled ,
2019-11-08 01:03:34 +03:00
mergedErrors : mergedErrors ,
2019-11-14 00:10:17 +03:00
hasErrors : hasErrors ,
showFieldErrors : showFieldErrors ,
mergedValidationName : mergedValidationName
2019-10-08 20:50:53 +03:00
} ;
2019-10-07 17:24:30 +03:00
/ * *
* Given ( this . type ) , return an object to merge with the context
* @ return { object }
2019-10-08 20:50:53 +03:00
* @ return { object }
2019-10-07 17:24:30 +03:00
* /
function typeContext ( ) {
2019-10-08 20:50:53 +03:00
var this $1 = this ;
2019-10-07 17:24:30 +03:00
switch ( this . classification ) {
case 'select' :
return {
2019-10-08 20:50:53 +03:00
options : createOptionList . call ( this , this . options ) ,
optionGroups : this . optionGroups ? map ( this . optionGroups , function ( k , v ) { return createOptionList . call ( this $1 , v ) ; } ) : false ,
2019-10-07 17:24:30 +03:00
placeholder : this . $attrs . placeholder || false
}
case 'group' :
if ( this . options ) {
return {
2019-10-08 20:50:53 +03:00
options : createOptionList . call ( this , this . options )
2019-10-07 17:24:30 +03:00
}
}
break
default :
return { }
}
}
/ * *
* Reducer for attributes that will be applied to each core input element .
* @ return { object }
* /
2019-10-08 20:50:53 +03:00
function elementAttributes ( ) {
var attrs = Object . assign ( { } , this . localAttributes ) ;
2019-10-07 17:24:30 +03:00
if ( this . id ) {
2019-10-08 20:50:53 +03:00
attrs . id = this . id ;
} else {
attrs . id = this . defaultId ;
2019-10-07 17:24:30 +03:00
}
2019-10-08 20:50:53 +03:00
return attrs
2019-10-07 17:24:30 +03:00
}
/ * *
* Determine the a best - guess location for the label ( before or after ) .
* @ return { string } before | after
* /
2019-10-08 20:50:53 +03:00
function logicalLabelPosition ( ) {
2019-10-07 17:24:30 +03:00
if ( this . labelPosition ) {
return this . labelPosition
}
switch ( this . classification ) {
case 'box' :
return 'after'
default :
return 'before'
}
}
2019-11-14 00:10:17 +03:00
/ * *
* The validation label to use .
* /
function mergedValidationName ( ) {
if ( this . validationName ) {
return this . validationName
}
if ( typeof this . name === 'string' ) {
return this . name
}
if ( this . label ) {
return this . label
}
return this . type
}
/ * *
* Determines if the field should show it ' s error ( if it has one )
* @ return { boolean }
* /
function showFieldErrors ( ) {
2020-01-29 00:53:13 +03:00
if ( this . showErrors || this . formShouldShowErrors ) {
return true
2019-11-14 00:10:17 +03:00
}
return this . behavioralErrorVisibility
}
2019-10-09 06:54:16 +03:00
/ * *
* Return the element ’ s name , or select a fallback .
* /
function nameOrFallback ( ) {
2020-01-28 20:12:08 +03:00
if ( this . name === true && this . classification !== 'button' ) {
2019-10-09 06:54:16 +03:00
return ( ( this . type ) + "_" + ( this . elementAttributes . id ) )
}
2020-01-28 20:12:08 +03:00
if ( this . name === false || ( this . classification === 'button' && this . name === true ) ) {
2019-10-09 06:54:16 +03:00
return false
}
return this . name
}
2019-10-30 06:33:31 +03:00
/ * *
* Determines if this formulate element is v - modeled or not .
* /
function isVmodeled ( ) {
return ! ! ( this . $options . propsData . hasOwnProperty ( 'formulateValue' ) &&
this . _events &&
Array . isArray ( this . _events . input ) &&
this . _events . input . length )
}
2019-10-07 17:24:30 +03:00
/ * *
* Given an object or array of options , create an array of objects with label ,
* value , and id .
* @ param { array | object }
* @ return { array }
* /
function createOptionList ( options ) {
2019-10-08 20:50:53 +03:00
if ( ! Array . isArray ( options ) && options && typeof options === 'object' ) {
var optionList = [ ] ;
var that = this ;
for ( var value in options ) {
optionList . push ( { value : value , label : options [ value ] , id : ( ( that . elementAttributes . id ) + "_" + value ) } ) ;
}
return optionList
2019-10-07 17:24:30 +03:00
} else if ( Array . isArray ( options ) && ! options . length ) {
2019-10-08 20:50:53 +03:00
return [ { value : this . value , label : ( this . label || this . name ) , id : this . context . id || nanoid ( 9 ) } ]
2019-10-07 17:24:30 +03:00
}
return options
}
2019-11-07 01:17:19 +03:00
/ * *
* The merged errors computed property .
* /
function mergedErrors ( ) {
return arrayify ( this . errors )
. concat ( arrayify ( this . error ) )
. concat ( arrayify ( this . validationErrors ) )
. reduce ( function ( errors , err ) { return ! errors . includes ( err ) ? errors . concat ( err ) : errors ; } , [ ] )
}
2019-11-08 01:03:34 +03:00
/ * *
* Does this computed property have errors .
* /
function hasErrors ( ) {
return ! ! this . mergedErrors . length
}
2019-11-14 00:10:17 +03:00
/ * *
* Bound into the context object .
* /
function blurHandler ( ) {
if ( this . errorBehavior === 'blur' ) {
this . behavioralErrorVisibility = true ;
}
}
2019-10-07 17:24:30 +03:00
/ * *
2019-10-08 20:50:53 +03:00
* Defines the model used throughout the existing context .
* @ param { object } context
2019-10-07 17:24:30 +03:00
* /
function defineModel ( context ) {
return Object . defineProperty ( context , 'model' , {
get : modelGetter . bind ( this ) ,
set : modelSetter . bind ( this )
} )
}
/ * *
* Get the value from a model .
* * /
function modelGetter ( ) {
2019-10-30 06:33:31 +03:00
var model = this . isVmodeled ? 'formulateValue' : 'internalModelProxy' ;
if ( this . type === 'checkbox' && ! Array . isArray ( this [ model ] ) && this . options ) {
2019-10-07 17:24:30 +03:00
return [ ]
}
2019-10-30 06:33:31 +03:00
if ( ! this [ model ] ) {
2019-10-07 17:24:30 +03:00
return ''
}
2019-10-30 06:33:31 +03:00
return this [ model ]
2019-10-07 17:24:30 +03:00
}
/ * *
* Set the value from a model .
* * /
function modelSetter ( value ) {
2019-10-30 06:33:31 +03:00
this . internalModelProxy = value ;
2019-10-07 17:24:30 +03:00
this . $emit ( 'input' , value ) ;
2019-10-09 06:54:16 +03:00
if ( this . context . name && typeof this . formulateFormSetter === 'function' ) {
this . formulateFormSetter ( this . context . name , value ) ;
}
2019-10-07 17:24:30 +03:00
}
//
var script = {
name : 'FormulateInput' ,
inheritAttrs : false ,
2019-10-09 06:54:16 +03:00
inject : {
formulateFormSetter : { default : undefined } ,
2019-11-14 00:10:17 +03:00
formulateFormRegister : { default : undefined } ,
getFormValues : { default : function ( ) { return function ( ) { return ( { } ) ; } ; } }
2019-10-09 06:54:16 +03:00
} ,
2019-10-07 17:24:30 +03:00
model : {
prop : 'formulateValue' ,
event : 'input'
} ,
props : {
type : {
type : String ,
default : 'text'
} ,
2019-10-09 06:54:16 +03:00
name : {
2020-01-29 00:53:13 +03:00
type : [ String , Boolean ] ,
2019-10-09 06:54:16 +03:00
default : true
} ,
/* eslint-disable */
2019-10-07 17:24:30 +03:00
formulateValue : {
2019-10-30 06:33:31 +03:00
default : ''
2019-10-07 17:24:30 +03:00
} ,
value : {
default : false
} ,
2019-10-09 06:54:16 +03:00
/* eslint-enable */
2019-10-07 17:24:30 +03:00
options : {
type : [ Object , Array , Boolean ] ,
default : false
} ,
optionGroups : {
type : [ Object , Boolean ] ,
default : false
} ,
id : {
type : [ String , Boolean , Number ] ,
2019-10-08 20:50:53 +03:00
default : false
2019-10-07 17:24:30 +03:00
} ,
label : {
type : [ String , Boolean ] ,
default : false
} ,
labelPosition : {
type : [ String , Boolean ] ,
default : false
} ,
help : {
type : [ String , Boolean ] ,
default : false
2019-10-08 20:50:53 +03:00
} ,
debug : {
type : Boolean ,
default : false
2019-11-07 01:17:19 +03:00
} ,
errors : {
type : [ String , Array , Boolean ] ,
default : false
} ,
2019-11-08 01:03:34 +03:00
validation : {
type : [ String , Boolean , Array ] ,
default : false
} ,
2019-11-14 00:10:17 +03:00
validationName : {
type : [ String , Boolean ] ,
default : false
} ,
error : {
type : [ String , Boolean ] ,
default : false
} ,
errorBehavior : {
2019-11-08 01:03:34 +03:00
type : String ,
default : 'blur' ,
validator : function ( value ) {
return [ 'blur' , 'live' ] . includes ( value )
}
} ,
2019-11-14 00:10:17 +03:00
showErrors : {
type : Boolean ,
2019-11-07 01:17:19 +03:00
default : false
2019-11-15 22:44:01 +03:00
} ,
2019-11-21 08:29:28 +03:00
imageBehavior : {
type : String ,
default : 'preview'
2019-11-15 22:44:01 +03:00
} ,
uploadUrl : {
type : [ String , Boolean ] ,
default : false
} ,
uploader : {
type : [ Function , Object , Boolean ] ,
default : false
} ,
2019-11-19 15:15:13 +03:00
uploadBehavior : {
2019-11-21 07:16:31 +03:00
type : String ,
default : 'live'
2019-11-19 15:15:13 +03:00
} ,
preventWindowDrops : {
2019-11-15 22:44:01 +03:00
type : Boolean ,
default : true
2019-10-07 17:24:30 +03:00
}
} ,
2019-10-08 20:50:53 +03:00
data : function data ( ) {
return {
2020-01-28 20:12:08 +03:00
/ * *
* @ todo consider swapping out nanoid for this . _uid
* /
2019-10-08 20:50:53 +03:00
defaultId : nanoid ( 9 ) ,
2019-10-30 06:33:31 +03:00
localAttributes : { } ,
2020-02-01 06:50:18 +03:00
internalModelProxy : this . formulateValue || this . value ,
2019-11-14 00:10:17 +03:00
behavioralErrorVisibility : ( this . errorBehavior === 'live' ) ,
2020-01-29 00:53:13 +03:00
formShouldShowErrors : false ,
2019-11-21 07:16:31 +03:00
validationErrors : [ ] ,
pendingValidation : Promise . resolve ( )
2019-10-08 20:50:53 +03:00
}
} ,
computed : Object . assign ( { } , context ,
{ classification : function classification ( ) {
2019-10-07 17:24:30 +03:00
var classification = this . $formulate . classify ( this . type ) ;
return ( classification === 'box' && this . options ) ? 'group' : classification
} ,
component : function component ( ) {
2019-10-08 20:50:53 +03:00
return ( this . classification === 'group' ) ? 'FormulateInputGroup' : this . $formulate . component ( this . type )
} } ) ,
watch : {
'$attrs' : {
handler : function handler ( value ) {
this . updateLocalAttributes ( value ) ;
} ,
deep : true
2019-10-30 06:33:31 +03:00
} ,
internalModelProxy : function internalModelProxy ( newValue , oldValue ) {
2019-11-08 01:03:34 +03:00
this . performValidation ( ) ;
2019-10-30 06:33:31 +03:00
if ( ! this . isVmodeled && ! shallowEqualObjects ( newValue , oldValue ) ) {
this . context . model = newValue ;
}
} ,
formulateValue : function formulateValue ( newValue , oldValue ) {
if ( this . isVmodeled && ! shallowEqualObjects ( newValue , oldValue ) ) {
this . context . model = newValue ;
}
2019-10-08 20:50:53 +03:00
}
} ,
created : function created ( ) {
2019-10-09 06:54:16 +03:00
if ( this . formulateFormRegister && typeof this . formulateFormRegister === 'function' ) {
2019-10-30 06:33:31 +03:00
this . formulateFormRegister ( this . nameOrFallback , this ) ;
2019-10-09 06:54:16 +03:00
}
2019-10-08 20:50:53 +03:00
this . updateLocalAttributes ( this . $attrs ) ;
2019-11-08 01:03:34 +03:00
this . performValidation ( ) ;
2019-10-08 20:50:53 +03:00
} ,
methods : {
updateLocalAttributes : function updateLocalAttributes ( value ) {
if ( ! shallowEqualObjects ( value , this . localAttributes ) ) {
this . localAttributes = value ;
}
2019-11-08 01:03:34 +03:00
} ,
performValidation : function performValidation ( ) {
var this $1 = this ;
var rules = parseRules ( this . validation , this . $formulate . rules ( ) ) ;
2019-11-21 07:16:31 +03:00
this . pendingValidation = Promise . all (
2019-11-08 01:03:34 +03:00
rules . map ( function ( ref ) {
var rule = ref [ 0 ] ;
var args = ref [ 1 ] ;
2020-02-26 01:32:40 +03:00
return rule . apply ( void 0 , [ {
value : this $1 . context . model ,
getFormValues : this $1 . getFormValues . bind ( this $1 ) ,
name : this $1 . context . name
} ] . concat ( args ) )
2019-11-14 00:10:17 +03:00
. then ( function ( res ) { return res ? false : this $1 . $formulate . validationMessage ( rule . name , {
args : args ,
name : this $1 . mergedValidationName ,
value : this $1 . context . model ,
vm : this $1 ,
formValues : this $1 . getFormValues ( )
} ) ; } )
2019-11-08 01:03:34 +03:00
} )
)
. then ( function ( result ) { return result . filter ( function ( result ) { return result ; } ) ; } )
2019-11-21 08:29:28 +03:00
. then ( function ( errorMessages ) { this $1 . validationErrors = errorMessages ; } ) ;
2019-11-21 07:16:31 +03:00
return this . pendingValidation
} ,
hasValidationErrors : function hasValidationErrors ( ) {
var this $1 = this ;
return new Promise ( function ( resolve ) {
this $1 . $nextTick ( function ( ) {
this $1 . pendingValidation . then ( function ( ) { return resolve ( ! ! this $1 . validationErrors . length ) ; } ) ;
} ) ;
} )
2019-10-07 17:24:30 +03:00
}
}
} ;
2019-11-01 21:03:48 +03:00
function normalizeComponent ( template , style , script , scopeId , isFunctionalTemplate , moduleIdentifier /* server only */ , shadowMode , createInjector , createInjectorSSR , createInjectorShadow ) {
if ( typeof shadowMode !== 'boolean' ) {
createInjectorSSR = createInjector ;
createInjector = shadowMode ;
shadowMode = false ;
}
// Vue.extend constructor export interop.
var options = typeof script === 'function' ? script . options : script ;
// render functions
if ( template && template . render ) {
options . render = template . render ;
options . staticRenderFns = template . staticRenderFns ;
options . _compiled = true ;
// functional template
if ( isFunctionalTemplate ) {
options . functional = true ;
}
}
// scopedId
if ( scopeId ) {
options . _scopeId = scopeId ;
}
var hook ;
if ( moduleIdentifier ) {
// server build
hook = function ( context ) {
// 2.3 injection
context =
context || // cached call
( this . $vnode && this . $vnode . ssrContext ) || // stateful
( this . parent && this . parent . $vnode && this . parent . $vnode . ssrContext ) ; // functional
// 2.2 with runInNewContext: true
if ( ! context && typeof _ _VUE _SSR _CONTEXT _ _ !== 'undefined' ) {
context = _ _VUE _SSR _CONTEXT _ _ ;
}
// inject component styles
if ( style ) {
style . call ( this , createInjectorSSR ( context ) ) ;
}
// register component module identifier for async chunk inference
if ( context && context . _registeredComponents ) {
context . _registeredComponents . add ( moduleIdentifier ) ;
}
} ;
// used by ssr in case component is cached and beforeCreate
// never gets called
options . _ssrRegister = hook ;
}
else if ( style ) {
hook = shadowMode
? function ( context ) {
style . call ( this , createInjectorShadow ( context , this . $root . $options . shadowRoot ) ) ;
}
: function ( context ) {
style . call ( this , createInjector ( context ) ) ;
} ;
}
if ( hook ) {
if ( options . functional ) {
// register for functional component in vue file
var originalRender = options . render ;
options . render = function renderWithStyleInjection ( h , context ) {
hook . call ( context ) ;
return originalRender ( h , context ) ;
} ;
}
else {
// inject component registration as beforeCreate hook
var existing = options . beforeCreate ;
options . beforeCreate = existing ? [ ] . concat ( existing , hook ) : [ hook ] ;
}
}
return script ;
2019-10-07 17:24:30 +03:00
}
/* script */
var _ _vue _script _ _ = script ;
/* template */
var _ _vue _render _ _ = function ( ) {
var _vm = this ;
var _h = _vm . $createElement ;
var _c = _vm . _self . _c || _h ;
return _c (
"div" ,
{
staticClass : "formulate-input" ,
attrs : {
"data-classification" : _vm . classification ,
2019-11-08 01:03:34 +03:00
"data-has-errors" : _vm . hasErrors ,
2019-11-14 00:10:17 +03:00
"data-is-showing-errors" : _vm . hasErrors && _vm . showFieldErrors ,
2019-10-07 17:24:30 +03:00
"data-type" : _vm . type
}
} ,
[
_c (
"div" ,
{ staticClass : "formulate-input-wrapper" } ,
[
2020-01-28 20:12:08 +03:00
_vm . context . hasLabel && _vm . context . labelPosition === "before"
2019-10-07 17:24:30 +03:00
? _vm . _t (
"label" ,
[
_c ( "label" , {
staticClass :
"formulate-input-label formulate-input-label--before" ,
2019-10-08 20:50:53 +03:00
attrs : { for : _vm . context . attributes . id } ,
2019-10-07 17:24:30 +03:00
domProps : { textContent : _vm . _s ( _vm . context . label ) }
} )
] ,
null ,
_vm . context
)
: _vm . _e ( ) ,
_vm . _v ( " " ) ,
_vm . _t (
2020-01-28 20:12:08 +03:00
"element" ,
2019-10-07 17:24:30 +03:00
[
2020-01-28 20:12:08 +03:00
_c (
_vm . context . component ,
{ tag : "component" , attrs : { context : _vm . context } } ,
[ _vm . _t ( "default" , null , null , _vm . context ) ] ,
2
)
2019-10-07 17:24:30 +03:00
] ,
null ,
_vm . context
) ,
_vm . _v ( " " ) ,
2020-01-28 20:12:08 +03:00
_vm . context . hasLabel && _vm . context . labelPosition === "after"
2019-10-07 17:24:30 +03:00
? _vm . _t (
"label" ,
[
_c ( "label" , {
staticClass :
"formulate-input-label formulate-input-label--after" ,
2019-10-08 20:50:53 +03:00
attrs : { for : _vm . context . attributes . id } ,
2019-10-07 17:24:30 +03:00
domProps : { textContent : _vm . _s ( _vm . context . label ) }
} )
] ,
null ,
_vm . context . label
)
: _vm . _e ( )
] ,
2
) ,
_vm . _v ( " " ) ,
_vm . help
? _c ( "div" , {
staticClass : "formulate-input-help" ,
domProps : { textContent : _vm . _s ( _vm . help ) }
} )
2019-11-07 01:17:19 +03:00
: _vm . _e ( ) ,
_vm . _v ( " " ) ,
2019-11-14 00:10:17 +03:00
_vm . showFieldErrors
? _c ( "FormulateInputErrors" , { attrs : { errors : _vm . mergedErrors } } )
: _vm . _e ( )
2019-11-07 01:17:19 +03:00
] ,
1
2019-10-07 17:24:30 +03:00
)
} ;
var _ _vue _staticRenderFns _ _ = [ ] ;
_ _vue _render _ _ . _withStripped = true ;
/* style */
var _ _vue _inject _styles _ _ = undefined ;
/* scoped */
var _ _vue _scope _id _ _ = undefined ;
/* module identifier */
var _ _vue _module _identifier _ _ = undefined ;
/* functional template */
var _ _vue _is _functional _template _ _ = false ;
/* style inject */
/* style inject SSR */
2019-11-01 21:03:48 +03:00
/* style inject shadow dom */
2019-10-07 17:24:30 +03:00
2020-02-26 01:32:40 +03:00
var _ _vue _component _ _ = normalizeComponent (
2019-10-07 17:24:30 +03:00
{ render : _ _vue _render _ _ , staticRenderFns : _ _vue _staticRenderFns _ _ } ,
_ _vue _inject _styles _ _ ,
_ _vue _script _ _ ,
_ _vue _scope _id _ _ ,
_ _vue _is _functional _template _ _ ,
_ _vue _module _identifier _ _ ,
2019-11-01 21:03:48 +03:00
false ,
undefined ,
2019-10-07 17:24:30 +03:00
undefined ,
undefined
) ;
2020-02-26 01:32:40 +03:00
var FormSubmission = function FormSubmission ( form ) {
this . form = form ;
} ;
/ * *
* Determine if the form has any validation errors .
*
* @ return { Promise } resolves a boolean
* /
FormSubmission . prototype . hasValidationErrors = function hasValidationErrors ( ) {
return this . form . hasValidationErrors ( )
} ;
/ * *
* Asynchronously generate the values payload of this form .
* @ return { Promise } resolves to json
* /
FormSubmission . prototype . values = function values ( ) {
var this $1 = this ;
return new Promise ( function ( resolve , reject ) {
var pending = [ ] ;
var values = cloneDeep ( this $1 . form . internalModelProxy ) ;
for ( var key in values ) {
if ( typeof this $1 . form . internalModelProxy [ key ] === 'object' && this $1 . form . internalModelProxy [ key ] instanceof FileUpload ) {
pending . push ( this $1 . form . internalModelProxy [ key ] . upload ( ) ) ;
}
}
/ * *
* @ todo - how do we get these uploaded path values back into our data ?
* /
Promise . all ( pending )
// .then(file => file.path)
. then ( function ( ) { return resolve ( values ) ; } )
. catch ( function ( err ) { return reject ( err ) ; } ) ;
} )
} ;
2019-10-09 06:54:16 +03:00
//
var script$1 = {
provide : function provide ( ) {
return {
formulateFormSetter : this . setFieldValue ,
2019-11-14 00:10:17 +03:00
formulateFormRegister : this . register ,
getFormValues : this . getFormValues
2019-10-09 06:54:16 +03:00
}
} ,
name : 'FormulateForm' ,
model : {
prop : 'formulateValue' ,
event : 'input'
} ,
props : {
name : {
type : [ String , Boolean ] ,
default : false
} ,
formulateValue : {
type : Object ,
default : function ( ) { return ( { } ) ; }
}
} ,
data : function data ( ) {
return {
2019-11-05 18:52:05 +03:00
registry : { } ,
2020-01-29 00:53:13 +03:00
internalFormModelProxy : { } ,
formShouldShowErrors : false
2019-10-09 06:54:16 +03:00
}
} ,
computed : {
2019-10-30 06:33:31 +03:00
hasFormulateValue : function hasFormulateValue ( ) {
return this . formulateValue && typeof this . formulateValue === 'object'
} ,
isVmodeled : function isVmodeled ( ) {
return ! ! ( this . $options . propsData . hasOwnProperty ( 'formulateValue' ) &&
this . _events &&
Array . isArray ( this . _events . input ) &&
this . _events . input . length )
}
} ,
watch : {
formulateValue : {
handler : function handler ( newValue , oldValue ) {
if ( this . isVmodeled &&
newValue &&
typeof newValue === 'object'
) {
for ( var field in newValue ) {
2019-11-05 18:52:05 +03:00
if ( this . registry . hasOwnProperty ( field ) &&
! shallowEqualObjects ( newValue [ field ] , this . internalFormModelProxy [ field ] ) &&
! shallowEqualObjects ( newValue [ field ] , this . registry [ field ] . internalModelProxy [ field ] )
) {
this . setFieldValue ( field , newValue [ field ] ) ;
2019-10-30 06:33:31 +03:00
this . registry [ field ] . context . model = newValue [ field ] ;
}
}
}
} ,
2019-11-05 18:52:05 +03:00
deep : true ,
immediate : false
}
} ,
created : function created ( ) {
if ( this . $options . propsData . hasOwnProperty ( 'formulateValue' ) ) {
this . internalFormModelProxy = Object . assign ( { } , this . formulateValue ) ;
2019-10-09 06:54:16 +03:00
}
} ,
methods : {
setFieldValue : function setFieldValue ( field , value ) {
var obj ;
2019-11-05 18:52:05 +03:00
Object . assign ( this . internalFormModelProxy , ( obj = { } , obj [ field ] = value , obj ) ) ;
this . $emit ( 'input' , Object . assign ( { } , this . internalFormModelProxy ) ) ;
2019-10-09 06:54:16 +03:00
} ,
register : function register ( field , component ) {
this . registry [ field ] = component ;
2019-10-30 06:33:31 +03:00
if ( ! component . $options . propsData . hasOwnProperty ( 'formulateValue' ) && this . hasFormulateValue && this . formulateValue [ field ] ) {
// In the case that the form is carrying an initial value and the
// element is not, set it directly.
component . context . model = this . formulateValue [ field ] ;
2019-11-01 21:03:48 +03:00
} else if ( component . $options . propsData . hasOwnProperty ( 'formulateValue' ) && ! shallowEqualObjects ( component . internalModelProxy , this . formulateValue [ field ] ) ) {
this . setFieldValue ( field , component . internalModelProxy ) ;
2019-10-30 06:33:31 +03:00
}
2019-10-31 17:24:18 +03:00
} ,
formSubmitted : function formSubmitted ( ) {
2020-02-26 01:32:40 +03:00
var this $1 = this ;
2019-10-31 17:24:18 +03:00
// perform validation here
2020-01-29 00:53:13 +03:00
this . showErrors ( ) ;
2020-02-26 01:32:40 +03:00
var submission = new FormSubmission ( this ) ;
this . $emit ( 'submit-raw' , submission ) ;
submission . hasValidationErrors ( )
. then ( function ( hasErrors ) { return hasErrors ? false : submission . values ( ) ; } )
. then ( function ( json ) { return this $1 . $emit ( 'submit' , json ) ; } ) ;
2019-11-14 00:10:17 +03:00
} ,
2020-01-29 00:53:13 +03:00
showErrors : function showErrors ( ) {
for ( var fieldName in this . registry ) {
this . registry [ fieldName ] . formShouldShowErrors = true ;
}
} ,
2019-11-14 00:10:17 +03:00
getFormValues : function getFormValues ( ) {
return this . internalFormModelProxy
2020-02-26 01:32:40 +03:00
} ,
hasValidationErrors : function hasValidationErrors ( ) {
var resolvers = [ ] ;
for ( var fieldName in this . registry ) {
if ( typeof this . registry [ fieldName ] . hasValidationErrors === 'function' ) {
resolvers . push ( this . registry [ fieldName ] . hasValidationErrors ( ) ) ;
}
}
return Promise . all ( resolvers ) . then ( function ( fields ) { return ! ! fields . find ( function ( hasErrors ) { return hasErrors ; } ) ; } )
2019-10-09 06:54:16 +03:00
}
}
} ;
2019-10-07 17:24:30 +03:00
/* script */
2019-10-09 06:54:16 +03:00
var _ _vue _script _ _$1 = script$1 ;
2019-10-07 17:24:30 +03:00
/* template */
var _ _vue _render _ _$1 = function ( ) {
var _vm = this ;
var _h = _vm . $createElement ;
var _c = _vm . _self . _c || _h ;
2019-10-09 06:54:16 +03:00
return _c (
"form" ,
{
on : {
submit : function ( $event ) {
$event . preventDefault ( ) ;
return _vm . formSubmitted ( $event )
}
}
} ,
[ _vm . _t ( "default" ) ] ,
2
)
2019-10-07 17:24:30 +03:00
} ;
var _ _vue _staticRenderFns _ _$1 = [ ] ;
_ _vue _render _ _$1 . _withStripped = true ;
/* style */
var _ _vue _inject _styles _ _$1 = undefined ;
/* scoped */
var _ _vue _scope _id _ _$1 = undefined ;
/* module identifier */
var _ _vue _module _identifier _ _$1 = undefined ;
/* functional template */
var _ _vue _is _functional _template _ _$1 = false ;
/* style inject */
/* style inject SSR */
2019-11-01 21:03:48 +03:00
/* style inject shadow dom */
2019-10-07 17:24:30 +03:00
2020-02-26 01:32:40 +03:00
var _ _vue _component _ _$1 = normalizeComponent (
2019-10-07 17:24:30 +03:00
{ render : _ _vue _render _ _$1 , staticRenderFns : _ _vue _staticRenderFns _ _$1 } ,
_ _vue _inject _styles _ _$1 ,
2019-10-09 06:54:16 +03:00
_ _vue _script _ _$1 ,
2019-10-07 17:24:30 +03:00
_ _vue _scope _id _ _$1 ,
_ _vue _is _functional _template _ _$1 ,
_ _vue _module _identifier _ _$1 ,
2019-11-01 21:03:48 +03:00
false ,
undefined ,
2019-10-07 17:24:30 +03:00
undefined ,
undefined
) ;
//
//
//
//
//
//
//
//
//
//
//
//
//
2019-11-07 01:17:19 +03:00
//
//
//
2019-10-07 17:24:30 +03:00
2019-10-09 06:54:16 +03:00
var script$2 = {
2019-11-07 01:17:19 +03:00
props : {
errors : {
type : [ Boolean , Array ] ,
required : true
}
}
} ;
/* script */
var _ _vue _script _ _$2 = script$2 ;
/* template */
var _ _vue _render _ _$2 = function ( ) {
var _vm = this ;
var _h = _vm . $createElement ;
var _c = _vm . _self . _c || _h ;
return _vm . errors . length
? _c (
"ul" ,
{ staticClass : "formulate-input-errors" } ,
_vm . _l ( _vm . errors , function ( error ) {
return _c ( "li" , {
key : error ,
staticClass : "formulate-input-error" ,
domProps : { innerHTML : _vm . _s ( error ) }
} )
} ) ,
0
)
: _vm . _e ( )
} ;
var _ _vue _staticRenderFns _ _$2 = [ ] ;
_ _vue _render _ _$2 . _withStripped = true ;
/* style */
var _ _vue _inject _styles _ _$2 = undefined ;
/* scoped */
var _ _vue _scope _id _ _$2 = undefined ;
/* module identifier */
var _ _vue _module _identifier _ _$2 = undefined ;
/* functional template */
var _ _vue _is _functional _template _ _$2 = false ;
/* style inject */
/* style inject SSR */
/* style inject shadow dom */
2020-02-26 01:32:40 +03:00
var _ _vue _component _ _$2 = normalizeComponent (
2019-11-07 01:17:19 +03:00
{ render : _ _vue _render _ _$2 , staticRenderFns : _ _vue _staticRenderFns _ _$2 } ,
_ _vue _inject _styles _ _$2 ,
_ _vue _script _ _$2 ,
_ _vue _scope _id _ _$2 ,
_ _vue _is _functional _template _ _$2 ,
_ _vue _module _identifier _ _$2 ,
false ,
undefined ,
undefined ,
undefined
) ;
//
//
//
//
//
//
//
//
//
//
//
//
//
function objectWithoutProperties ( obj , exclude ) { var target = { } ; for ( var k in obj ) if ( Object . prototype . hasOwnProperty . call ( obj , k ) && exclude . indexOf ( k ) === - 1 ) target [ k ] = obj [ k ] ; return target ; }
var script$3 = {
2019-10-07 17:24:30 +03:00
name : 'FormulateInputGroup' ,
props : {
context : {
type : Object ,
required : true
}
} ,
computed : {
options : function options ( ) {
return this . context . options || [ ]
} ,
optionsWithContext : function optionsWithContext ( ) {
var this $1 = this ;
var ref = this . context ;
var options = ref . options ;
var labelPosition = ref . labelPosition ;
var attributes = ref . attributes ;
2019-10-08 20:50:53 +03:00
var classification = ref . classification ;
var rest = objectWithoutProperties ( ref , [ "options" , "labelPosition" , "attributes" , "classification" ] ) ;
2019-10-07 17:24:30 +03:00
var context = rest ;
return this . options . map ( function ( option ) { return this $1 . groupItemContext ( context , option ) ; } )
}
} ,
methods : {
groupItemContext : function groupItemContext ( ) {
var args = [ ] , len = arguments . length ;
while ( len -- ) args [ len ] = arguments [ len ] ;
return Object . assign . apply ( Object , [ { } ] . concat ( args , [ {
component : 'FormulateInput'
} ] ) )
}
}
} ;
/* script */
2019-11-07 01:17:19 +03:00
var _ _vue _script _ _$3 = script$3 ;
2019-10-07 17:24:30 +03:00
/* template */
2019-11-07 01:17:19 +03:00
var _ _vue _render _ _$3 = function ( ) {
2019-10-07 17:24:30 +03:00
var _vm = this ;
var _h = _vm . $createElement ;
var _c = _vm . _self . _c || _h ;
return _c (
"div" ,
{ staticClass : "formulate-input-group" } ,
_vm . _l ( _vm . optionsWithContext , function ( optionContext ) {
return _c (
optionContext . component ,
_vm . _b (
{
key : optionContext . id ,
tag : "component" ,
staticClass : "formulate-input-group-item" ,
model : {
value : _vm . context . model ,
callback : function ( $$v ) {
_vm . $set ( _vm . context , "model" , $$v ) ;
} ,
expression : "context.model"
}
} ,
"component" ,
optionContext ,
false
)
)
} ) ,
1
)
} ;
2019-11-07 01:17:19 +03:00
var _ _vue _staticRenderFns _ _$3 = [ ] ;
_ _vue _render _ _$3 . _withStripped = true ;
2019-10-07 17:24:30 +03:00
/* style */
2019-11-07 01:17:19 +03:00
var _ _vue _inject _styles _ _$3 = undefined ;
2019-10-07 17:24:30 +03:00
/* scoped */
2019-11-07 01:17:19 +03:00
var _ _vue _scope _id _ _$3 = undefined ;
2019-10-07 17:24:30 +03:00
/* module identifier */
2019-11-07 01:17:19 +03:00
var _ _vue _module _identifier _ _$3 = undefined ;
2019-10-07 17:24:30 +03:00
/* functional template */
2019-11-07 01:17:19 +03:00
var _ _vue _is _functional _template _ _$3 = false ;
2019-10-07 17:24:30 +03:00
/* style inject */
/* style inject SSR */
2019-11-01 21:03:48 +03:00
/* style inject shadow dom */
2019-10-07 17:24:30 +03:00
2020-02-26 01:32:40 +03:00
var _ _vue _component _ _$3 = normalizeComponent (
2019-11-07 01:17:19 +03:00
{ render : _ _vue _render _ _$3 , staticRenderFns : _ _vue _staticRenderFns _ _$3 } ,
_ _vue _inject _styles _ _$3 ,
_ _vue _script _ _$3 ,
_ _vue _scope _id _ _$3 ,
_ _vue _is _functional _template _ _$3 ,
_ _vue _module _identifier _ _$3 ,
2019-11-01 21:03:48 +03:00
false ,
undefined ,
2019-10-07 17:24:30 +03:00
undefined ,
undefined
) ;
/ * *
* Default base for input components .
* /
var FormulateInputMixin = {
props : {
context : {
type : Object ,
required : true
}
} ,
computed : {
type : function type ( ) {
return this . context . type
} ,
id : function id ( ) {
return this . context . id
} ,
attributes : function attributes ( ) {
return this . context . attributes || { }
} ,
hasValue : function hasValue ( ) {
2019-10-09 06:54:16 +03:00
return ! ! this . context . model
2019-10-07 17:24:30 +03:00
}
}
} ;
//
2019-11-07 01:17:19 +03:00
var script$4 = {
2019-10-07 17:24:30 +03:00
name : 'FormulateInputBox' ,
mixins : [ FormulateInputMixin ]
} ;
/* script */
2019-11-07 01:17:19 +03:00
var _ _vue _script _ _$4 = script$4 ;
2019-10-07 17:24:30 +03:00
/* template */
2019-11-07 01:17:19 +03:00
var _ _vue _render _ _$4 = function ( ) {
2019-10-07 17:24:30 +03:00
var _vm = this ;
var _h = _vm . $createElement ;
var _c = _vm . _self . _c || _h ;
return _c (
"div" ,
{
2019-11-14 09:00:56 +03:00
class :
"formulate-input-element formulate-input-element--" + _vm . context . type ,
2019-10-07 17:24:30 +03:00
attrs : { "data-type" : _vm . context . type }
} ,
[
_vm . type === "checkbox"
? _c (
"input" ,
_vm . _b (
{
directives : [
{
name : "model" ,
rawName : "v-model" ,
value : _vm . context . model ,
expression : "context.model"
}
] ,
attrs : { type : "checkbox" } ,
domProps : {
value : _vm . context . value ,
checked : Array . isArray ( _vm . context . model )
? _vm . _i ( _vm . context . model , _vm . context . value ) > - 1
: _vm . context . model
} ,
on : {
2019-11-14 00:10:17 +03:00
blur : _vm . context . blurHandler ,
2019-10-07 17:24:30 +03:00
change : function ( $event ) {
var $$a = _vm . context . model ,
$$el = $event . target ,
$$c = $$el . checked ? true : false ;
if ( Array . isArray ( $$a ) ) {
var $$v = _vm . context . value ,
$$i = _vm . _i ( $$a , $$v ) ;
if ( $$el . checked ) {
$$i < 0 &&
_vm . $set ( _vm . context , "model" , $$a . concat ( [ $$v ] ) ) ;
} else {
$$i > - 1 &&
_vm . $set (
_vm . context ,
"model" ,
$$a . slice ( 0 , $$i ) . concat ( $$a . slice ( $$i + 1 ) )
) ;
}
} else {
_vm . $set ( _vm . context , "model" , $$c ) ;
}
}
}
} ,
"input" ,
_vm . attributes ,
false
)
)
: _vm . type === "radio"
? _c (
"input" ,
_vm . _b (
{
directives : [
{
name : "model" ,
rawName : "v-model" ,
value : _vm . context . model ,
expression : "context.model"
}
] ,
attrs : { type : "radio" } ,
domProps : {
value : _vm . context . value ,
checked : _vm . _q ( _vm . context . model , _vm . context . value )
} ,
on : {
2019-11-14 00:10:17 +03:00
blur : _vm . context . blurHandler ,
2019-10-07 17:24:30 +03:00
change : function ( $event ) {
return _vm . $set ( _vm . context , "model" , _vm . context . value )
}
}
} ,
"input" ,
_vm . attributes ,
false
)
)
: _c (
"input" ,
_vm . _b (
{
directives : [
{
name : "model" ,
rawName : "v-model" ,
value : _vm . context . model ,
expression : "context.model"
}
] ,
attrs : { type : _vm . type } ,
domProps : {
value : _vm . context . value ,
value : _vm . context . model
} ,
on : {
2019-11-14 00:10:17 +03:00
blur : _vm . context . blurHandler ,
2019-10-07 17:24:30 +03:00
input : function ( $event ) {
if ( $event . target . composing ) {
return
}
_vm . $set ( _vm . context , "model" , $event . target . value ) ;
}
}
} ,
"input" ,
_vm . attributes ,
false
)
) ,
_vm . _v ( " " ) ,
_c ( "label" , {
staticClass : "formulate-input-element-decorator" ,
attrs : { for : _vm . id }
} )
]
)
} ;
2019-11-07 01:17:19 +03:00
var _ _vue _staticRenderFns _ _$4 = [ ] ;
_ _vue _render _ _$4 . _withStripped = true ;
2019-10-07 17:24:30 +03:00
/* style */
2019-11-07 01:17:19 +03:00
var _ _vue _inject _styles _ _$4 = undefined ;
2019-10-07 17:24:30 +03:00
/* scoped */
2019-11-07 01:17:19 +03:00
var _ _vue _scope _id _ _$4 = undefined ;
2019-10-07 17:24:30 +03:00
/* module identifier */
2019-11-07 01:17:19 +03:00
var _ _vue _module _identifier _ _$4 = undefined ;
2019-10-07 17:24:30 +03:00
/* functional template */
2019-11-07 01:17:19 +03:00
var _ _vue _is _functional _template _ _$4 = false ;
2019-10-07 17:24:30 +03:00
/* style inject */
/* style inject SSR */
2019-11-01 21:03:48 +03:00
/* style inject shadow dom */
2019-10-07 17:24:30 +03:00
2020-02-26 01:32:40 +03:00
var _ _vue _component _ _$4 = normalizeComponent (
2019-11-07 01:17:19 +03:00
{ render : _ _vue _render _ _$4 , staticRenderFns : _ _vue _staticRenderFns _ _$4 } ,
_ _vue _inject _styles _ _$4 ,
_ _vue _script _ _$4 ,
_ _vue _scope _id _ _$4 ,
_ _vue _is _functional _template _ _$4 ,
_ _vue _module _identifier _ _$4 ,
2019-11-01 21:03:48 +03:00
false ,
undefined ,
2019-10-07 17:24:30 +03:00
undefined ,
undefined
) ;
//
2019-11-07 01:17:19 +03:00
var script$5 = {
2019-10-07 17:24:30 +03:00
name : 'FormulateInputText' ,
mixins : [ FormulateInputMixin ]
} ;
/* script */
2019-11-07 01:17:19 +03:00
var _ _vue _script _ _$5 = script$5 ;
2019-10-07 17:24:30 +03:00
/* template */
2019-11-07 01:17:19 +03:00
var _ _vue _render _ _$5 = function ( ) {
2019-10-07 17:24:30 +03:00
var _vm = this ;
var _h = _vm . $createElement ;
var _c = _vm . _self . _c || _h ;
return _c (
"div" ,
{
2019-11-14 09:00:56 +03:00
class :
"formulate-input-element formulate-input-element--" + _vm . context . type ,
attrs : { "data-type" : _vm . context . type }
2019-10-07 17:24:30 +03:00
} ,
[
_vm . type === "checkbox"
? _c (
"input" ,
_vm . _b (
{
directives : [
{
name : "model" ,
rawName : "v-model" ,
value : _vm . context . model ,
expression : "context.model"
}
] ,
attrs : { type : "checkbox" } ,
domProps : {
checked : Array . isArray ( _vm . context . model )
? _vm . _i ( _vm . context . model , null ) > - 1
: _vm . context . model
} ,
on : {
2019-11-14 00:10:17 +03:00
blur : _vm . context . blurHandler ,
2019-10-07 17:24:30 +03:00
change : function ( $event ) {
var $$a = _vm . context . model ,
$$el = $event . target ,
$$c = $$el . checked ? true : false ;
if ( Array . isArray ( $$a ) ) {
var $$v = null ,
$$i = _vm . _i ( $$a , $$v ) ;
if ( $$el . checked ) {
$$i < 0 &&
_vm . $set ( _vm . context , "model" , $$a . concat ( [ $$v ] ) ) ;
} else {
$$i > - 1 &&
_vm . $set (
_vm . context ,
"model" ,
$$a . slice ( 0 , $$i ) . concat ( $$a . slice ( $$i + 1 ) )
) ;
}
} else {
_vm . $set ( _vm . context , "model" , $$c ) ;
}
}
}
} ,
"input" ,
_vm . attributes ,
false
)
)
: _vm . type === "radio"
? _c (
"input" ,
_vm . _b (
{
directives : [
{
name : "model" ,
rawName : "v-model" ,
value : _vm . context . model ,
expression : "context.model"
}
] ,
attrs : { type : "radio" } ,
domProps : { checked : _vm . _q ( _vm . context . model , null ) } ,
on : {
2019-11-14 00:10:17 +03:00
blur : _vm . context . blurHandler ,
2019-10-07 17:24:30 +03:00
change : function ( $event ) {
return _vm . $set ( _vm . context , "model" , null )
}
}
} ,
"input" ,
_vm . attributes ,
false
)
)
: _c (
"input" ,
_vm . _b (
{
directives : [
{
name : "model" ,
rawName : "v-model" ,
value : _vm . context . model ,
expression : "context.model"
}
] ,
attrs : { type : _vm . type } ,
domProps : { value : _vm . context . model } ,
on : {
2019-11-14 00:10:17 +03:00
blur : _vm . context . blurHandler ,
2019-10-07 17:24:30 +03:00
input : function ( $event ) {
if ( $event . target . composing ) {
return
}
_vm . $set ( _vm . context , "model" , $event . target . value ) ;
}
}
} ,
"input" ,
_vm . attributes ,
false
)
)
]
)
} ;
2019-11-07 01:17:19 +03:00
var _ _vue _staticRenderFns _ _$5 = [ ] ;
_ _vue _render _ _$5 . _withStripped = true ;
2019-10-07 17:24:30 +03:00
/* style */
2019-11-07 01:17:19 +03:00
var _ _vue _inject _styles _ _$5 = undefined ;
2019-10-07 17:24:30 +03:00
/* scoped */
2019-11-07 01:17:19 +03:00
var _ _vue _scope _id _ _$5 = undefined ;
2019-10-07 17:24:30 +03:00
/* module identifier */
2019-11-07 01:17:19 +03:00
var _ _vue _module _identifier _ _$5 = undefined ;
2019-10-07 17:24:30 +03:00
/* functional template */
2019-11-07 01:17:19 +03:00
var _ _vue _is _functional _template _ _$5 = false ;
2019-10-07 17:24:30 +03:00
/* style inject */
/* style inject SSR */
2019-11-01 21:03:48 +03:00
/* style inject shadow dom */
2019-10-07 17:24:30 +03:00
2020-02-26 01:32:40 +03:00
var _ _vue _component _ _$5 = normalizeComponent (
2019-11-07 01:17:19 +03:00
{ render : _ _vue _render _ _$5 , staticRenderFns : _ _vue _staticRenderFns _ _$5 } ,
_ _vue _inject _styles _ _$5 ,
_ _vue _script _ _$5 ,
_ _vue _scope _id _ _$5 ,
_ _vue _is _functional _template _ _$5 ,
_ _vue _module _identifier _ _$5 ,
2019-11-01 21:03:48 +03:00
false ,
undefined ,
2019-10-07 17:24:30 +03:00
undefined ,
undefined
) ;
//
2019-11-07 01:17:19 +03:00
var script$6 = {
2019-11-15 22:44:01 +03:00
name : 'FormulateFiles' ,
props : {
files : {
type : FileUpload ,
required : true
2019-11-21 08:29:28 +03:00
} ,
imagePreview : {
type : Boolean ,
default : false
2019-11-15 22:44:01 +03:00
}
} ,
computed : {
fileUploads : function fileUploads ( ) {
return this . files . files || [ ]
}
2019-11-21 08:29:28 +03:00
} ,
watch : {
files : function files ( ) {
if ( this . imagePreview ) {
this . files . loadPreviews ( ) ;
}
}
} ,
mounted : function mounted ( ) {
if ( this . imagePreview ) {
this . files . loadPreviews ( ) ;
}
2019-11-15 22:44:01 +03:00
}
} ;
/* script */
var _ _vue _script _ _$6 = script$6 ;
/* template */
var _ _vue _render _ _$6 = function ( ) {
var _vm = this ;
var _h = _vm . $createElement ;
var _c = _vm . _self . _c || _h ;
return _vm . fileUploads . length
? _c (
"ul" ,
{ staticClass : "formulate-files" } ,
_vm . _l ( _vm . fileUploads , function ( file ) {
2019-11-19 15:15:13 +03:00
return _c (
"li" ,
2019-11-21 08:29:28 +03:00
{
key : file . uuid ,
attrs : {
"data-has-error" : ! ! file . error ,
"data-has-preview" : _vm . imagePreview && file . previewData
}
} ,
2019-11-19 15:15:13 +03:00
[
_c ( "div" , { staticClass : "formulate-file" } , [
2019-11-21 08:29:28 +03:00
_vm . imagePreview && file . previewData
? _c ( "div" , { staticClass : "formulate-file-image-preview" } , [
_c ( "img" , { attrs : { src : file . previewData } } )
] )
: _vm . _e ( ) ,
_vm . _v ( " " ) ,
2019-11-19 15:15:13 +03:00
_c ( "div" , {
staticClass : "formualte-file-name" ,
domProps : { textContent : _vm . _s ( file . name ) }
} ) ,
_vm . _v ( " " ) ,
file . progress !== false
? _c (
"div" ,
{
staticClass : "formulate-file-progress" ,
attrs : {
"data-just-finished" : file . justFinished ,
"data-is-finished" :
! file . justFinished && file . complete
}
} ,
[
_c ( "div" , {
staticClass : "formulate-file-progress-inner" ,
style : { width : file . progress + "%" }
} )
]
)
: _vm . _e ( ) ,
_vm . _v ( " " ) ,
( file . complete && ! file . justFinished ) || file . progress === false
? _c ( "div" , {
staticClass : "formulate-file-remove" ,
on : { click : file . removeFile }
} )
: _vm . _e ( )
] ) ,
_vm . _v ( " " ) ,
file . error
? _c ( "div" , {
staticClass : "formulate-file-upload-error" ,
domProps : { textContent : _vm . _s ( file . error ) }
} )
: _vm . _e ( )
]
)
2019-11-15 22:44:01 +03:00
} ) ,
0
)
: _vm . _e ( )
} ;
var _ _vue _staticRenderFns _ _$6 = [ ] ;
_ _vue _render _ _$6 . _withStripped = true ;
/* style */
var _ _vue _inject _styles _ _$6 = undefined ;
/* scoped */
var _ _vue _scope _id _ _$6 = undefined ;
/* module identifier */
var _ _vue _module _identifier _ _$6 = undefined ;
/* functional template */
var _ _vue _is _functional _template _ _$6 = false ;
/* style inject */
/* style inject SSR */
/* style inject shadow dom */
2020-02-26 01:32:40 +03:00
var _ _vue _component _ _$6 = normalizeComponent (
2019-11-15 22:44:01 +03:00
{ render : _ _vue _render _ _$6 , staticRenderFns : _ _vue _staticRenderFns _ _$6 } ,
_ _vue _inject _styles _ _$6 ,
_ _vue _script _ _$6 ,
_ _vue _scope _id _ _$6 ,
_ _vue _is _functional _template _ _$6 ,
_ _vue _module _identifier _ _$6 ,
false ,
undefined ,
undefined ,
undefined
) ;
//
var script$7 = {
name : 'FormulateInputFile' ,
components : {
2020-02-26 01:32:40 +03:00
FormulateFiles : _ _vue _component _ _$6
2019-11-15 22:44:01 +03:00
} ,
mixins : [ FormulateInputMixin ] ,
data : function data ( ) {
return {
isOver : false
}
} ,
computed : {
hasFiles : function hasFiles ( ) {
2019-11-19 15:15:13 +03:00
return ! ! ( this . context . model instanceof FileUpload && this . context . model . files . length )
}
} ,
mounted : function mounted ( ) {
// Add a listener to the window to prevent drag/drops that miss the dropzone
// from opening the file and navigating the user away from the page.
if ( window && this . context . preventWindowDrops ) {
window . addEventListener ( 'dragover' , this . preventDefault ) ;
window . addEventListener ( 'drop' , this . preventDefault ) ;
}
} ,
destroyed : function destroyed ( ) {
if ( window && this . context . preventWindowDrops ) {
window . removeEventListener ( 'dragover' , this . preventDefault ) ;
window . removeEventListener ( 'drop' , this . preventDefault ) ;
2019-11-15 22:44:01 +03:00
}
} ,
methods : {
2019-11-19 15:15:13 +03:00
preventDefault : function preventDefault ( e ) {
if ( e . target . tagName !== 'INPUT' && e . target . getAttribute ( 'type' ) !== 'file' ) {
e = e || event ;
e . preventDefault ( ) ;
}
} ,
2019-11-15 22:44:01 +03:00
handleFile : function handleFile ( ) {
2019-11-21 07:16:31 +03:00
this . isOver = false ;
2019-11-15 22:44:01 +03:00
var input = this . $refs . file ;
if ( input . files . length ) {
2019-11-19 15:15:13 +03:00
this . context . model = this . $formulate . createUpload ( input , this . context ) ;
2019-11-15 22:44:01 +03:00
}
2019-11-21 07:16:31 +03:00
this . attemptImmediateUpload ( ) ;
} ,
attemptImmediateUpload : function attemptImmediateUpload ( ) {
var this $1 = this ;
if ( this . context . uploadBehavior === 'live' &&
this . context . model instanceof FileUpload ) {
this . context . hasValidationErrors ( ) . then ( function ( errors ) {
if ( ! errors ) {
this $1 . context . model . upload ( ) ;
}
} ) ;
2019-11-15 22:44:01 +03:00
}
} ,
handleDragOver : function handleDragOver ( e ) {
e . preventDefault ( ) ;
this . isOver = true ;
} ,
handleDragLeave : function handleDragLeave ( e ) {
e . preventDefault ( ) ;
this . isOver = false ;
}
}
} ;
/* script */
var _ _vue _script _ _$7 = script$7 ;
/* template */
var _ _vue _render _ _$7 = function ( ) {
var _vm = this ;
var _h = _vm . $createElement ;
var _c = _vm . _self . _c || _h ;
return _c (
"div" ,
{
class :
"formulate-input-element formulate-input-element--" + _vm . context . type ,
attrs : { "data-type" : _vm . context . type , "data-has-files" : _vm . hasFiles }
} ,
[
_c (
"div" ,
{
staticClass : "formulate-input-upload-area" ,
attrs : { "data-has-files" : _vm . hasFiles }
} ,
[
_c (
"input" ,
_vm . _b (
{
ref : "file" ,
attrs : { "data-is-drag-hover" : _vm . isOver , type : "file" } ,
on : {
blur : _vm . context . blurHandler ,
change : _vm . handleFile ,
dragover : _vm . handleDragOver ,
dragleave : _vm . handleDragLeave
}
} ,
"input" ,
_vm . attributes ,
false
)
) ,
_vm . _v ( " " ) ,
_c ( "div" , {
directives : [
{
name : "show" ,
rawName : "v-show" ,
value : ! _vm . hasFiles ,
expression : "!hasFiles"
}
] ,
staticClass : "formulate-input-upload-area-mask"
} ) ,
_vm . _v ( " " ) ,
_vm . hasFiles
2019-11-21 08:29:28 +03:00
? _c ( "FormulateFiles" , {
attrs : {
files : _vm . context . model ,
"image-preview" :
_vm . context . type === "image" &&
_vm . context . imageBehavior === "preview"
}
} )
2019-11-15 22:44:01 +03:00
: _vm . _e ( )
] ,
1
)
]
)
} ;
var _ _vue _staticRenderFns _ _$7 = [ ] ;
_ _vue _render _ _$7 . _withStripped = true ;
/* style */
var _ _vue _inject _styles _ _$7 = undefined ;
/* scoped */
var _ _vue _scope _id _ _$7 = undefined ;
/* module identifier */
var _ _vue _module _identifier _ _$7 = undefined ;
/* functional template */
var _ _vue _is _functional _template _ _$7 = false ;
/* style inject */
/* style inject SSR */
/* style inject shadow dom */
2020-02-26 01:32:40 +03:00
var _ _vue _component _ _$7 = normalizeComponent (
2019-11-15 22:44:01 +03:00
{ render : _ _vue _render _ _$7 , staticRenderFns : _ _vue _staticRenderFns _ _$7 } ,
_ _vue _inject _styles _ _$7 ,
_ _vue _script _ _$7 ,
_ _vue _scope _id _ _$7 ,
_ _vue _is _functional _template _ _$7 ,
_ _vue _module _identifier _ _$7 ,
false ,
undefined ,
undefined ,
undefined
) ;
//
var script$8 = {
2020-01-28 20:12:08 +03:00
name : 'FormulateInputButton' ,
mixins : [ FormulateInputMixin ]
} ;
/* script */
var _ _vue _script _ _$8 = script$8 ;
/* template */
var _ _vue _render _ _$8 = function ( ) {
var _vm = this ;
var _h = _vm . $createElement ;
var _c = _vm . _self . _c || _h ;
return _c (
"div" ,
{
class :
"formulate-input-element formulate-input-element--" + _vm . context . type ,
attrs : { "data-type" : _vm . context . type }
} ,
[
_c (
"button" ,
_vm . _b ( { attrs : { type : _vm . type } } , "button" , _vm . attributes , false ) ,
[
_vm . _t ( "default" , [
_c ( "span" , {
class : "formulate-input-element--" + _vm . context . type + "--label" ,
domProps : {
textContent : _vm . _s (
_vm . context . value ||
_vm . context . label ||
_vm . context . name ||
"Submit"
)
}
} )
] )
] ,
2
)
]
)
} ;
var _ _vue _staticRenderFns _ _$8 = [ ] ;
_ _vue _render _ _$8 . _withStripped = true ;
/* style */
var _ _vue _inject _styles _ _$8 = undefined ;
/* scoped */
var _ _vue _scope _id _ _$8 = undefined ;
/* module identifier */
var _ _vue _module _identifier _ _$8 = undefined ;
/* functional template */
var _ _vue _is _functional _template _ _$8 = false ;
/* style inject */
/* style inject SSR */
/* style inject shadow dom */
2020-02-26 01:32:40 +03:00
var _ _vue _component _ _$8 = normalizeComponent (
2020-01-28 20:12:08 +03:00
{ render : _ _vue _render _ _$8 , staticRenderFns : _ _vue _staticRenderFns _ _$8 } ,
_ _vue _inject _styles _ _$8 ,
_ _vue _script _ _$8 ,
_ _vue _scope _id _ _$8 ,
_ _vue _is _functional _template _ _$8 ,
_ _vue _module _identifier _ _$8 ,
false ,
undefined ,
undefined ,
undefined
) ;
//
var script$9 = {
2019-10-07 17:24:30 +03:00
name : 'FormulateInputSelect' ,
mixins : [ FormulateInputMixin ] ,
computed : {
options : function options ( ) {
return this . context . options || { }
} ,
optionGroups : function optionGroups ( ) {
return this . context . optionGroups || false
} ,
placeholderSelected : function placeholderSelected ( ) {
2019-10-08 20:50:53 +03:00
return ! ! ( ! this . hasValue && this . context . attributes && this . context . attributes . placeholder )
2019-10-07 17:24:30 +03:00
}
}
} ;
/* script */
2020-01-28 20:12:08 +03:00
var _ _vue _script _ _$9 = script$9 ;
2019-10-07 17:24:30 +03:00
/* template */
2020-01-28 20:12:08 +03:00
var _ _vue _render _ _$9 = function ( ) {
2019-10-07 17:24:30 +03:00
var _vm = this ;
var _h = _vm . $createElement ;
var _c = _vm . _self . _c || _h ;
return _c (
"div" ,
2019-11-14 09:00:56 +03:00
{
class :
"formulate-input-element formulate-input-element--" + _vm . context . type ,
attrs : { "data-type" : _vm . context . type }
} ,
2019-10-07 17:24:30 +03:00
[
_c (
"select" ,
_vm . _b (
{
directives : [
{
name : "model" ,
rawName : "v-model" ,
value : _vm . context . model ,
expression : "context.model"
}
] ,
attrs : { "data-placeholder-selected" : _vm . placeholderSelected } ,
on : {
2019-11-14 00:10:17 +03:00
blur : _vm . context . blurHandler ,
2019-10-07 17:24:30 +03:00
change : function ( $event ) {
var $$selectedVal = Array . prototype . filter
. call ( $event . target . options , function ( o ) {
return o . selected
} )
. map ( function ( o ) {
var val = "_value" in o ? o . _value : o . value ;
return val
} ) ;
_vm . $set (
_vm . context ,
"model" ,
$event . target . multiple ? $$selectedVal : $$selectedVal [ 0 ]
) ;
}
}
} ,
"select" ,
_vm . attributes ,
false
) ,
[
_vm . context . placeholder
? _c (
"option" ,
{
attrs : { value : "" , disabled : "" } ,
domProps : { selected : ! _vm . hasValue }
} ,
[
_vm . _v (
"\n " + _vm . _s ( _vm . context . placeholder ) + "\n "
)
]
)
: _vm . _e ( ) ,
_vm . _v ( " " ) ,
! _vm . optionGroups
? _vm . _l ( _vm . options , function ( option ) {
return _c (
"option" ,
_vm . _b (
{
key : option . id ,
domProps : {
value : option . value ,
textContent : _vm . _s ( option . label )
}
} ,
"option" ,
option . attributes || { } ,
false
)
)
} )
: _vm . _l ( _vm . optionGroups , function ( subOptions , label ) {
return _c (
"optgroup" ,
{ key : label , attrs : { label : label } } ,
_vm . _l ( subOptions , function ( option ) {
return _c (
"option" ,
_vm . _b (
{
key : option . id ,
domProps : {
value : option . value ,
textContent : _vm . _s ( option . label )
}
} ,
"option" ,
option . attributes || { } ,
false
)
)
} ) ,
0
)
} )
] ,
2
)
]
)
} ;
2020-01-28 20:12:08 +03:00
var _ _vue _staticRenderFns _ _$9 = [ ] ;
_ _vue _render _ _$9 . _withStripped = true ;
2019-10-07 17:24:30 +03:00
/* style */
2020-01-28 20:12:08 +03:00
var _ _vue _inject _styles _ _$9 = undefined ;
2019-10-07 17:24:30 +03:00
/* scoped */
2020-01-28 20:12:08 +03:00
var _ _vue _scope _id _ _$9 = undefined ;
2019-10-07 17:24:30 +03:00
/* module identifier */
2020-01-28 20:12:08 +03:00
var _ _vue _module _identifier _ _$9 = undefined ;
2019-10-07 17:24:30 +03:00
/* functional template */
2020-01-28 20:12:08 +03:00
var _ _vue _is _functional _template _ _$9 = false ;
2019-10-07 17:24:30 +03:00
/* style inject */
/* style inject SSR */
2019-11-01 21:03:48 +03:00
/* style inject shadow dom */
2019-10-07 17:24:30 +03:00
2020-02-26 01:32:40 +03:00
var _ _vue _component _ _$9 = normalizeComponent (
2020-01-28 20:12:08 +03:00
{ render : _ _vue _render _ _$9 , staticRenderFns : _ _vue _staticRenderFns _ _$9 } ,
_ _vue _inject _styles _ _$9 ,
_ _vue _script _ _$9 ,
_ _vue _scope _id _ _$9 ,
_ _vue _is _functional _template _ _$9 ,
_ _vue _module _identifier _ _$9 ,
2019-11-01 21:03:48 +03:00
false ,
undefined ,
2019-10-07 17:24:30 +03:00
undefined ,
undefined
) ;
//
2020-01-28 20:12:08 +03:00
var script$a = {
2019-11-15 22:44:01 +03:00
name : 'FormulateInputSlider' ,
2019-10-07 17:24:30 +03:00
mixins : [ FormulateInputMixin ]
} ;
/* script */
2020-01-28 20:12:08 +03:00
var _ _vue _script _ _$a = script$a ;
2019-10-07 17:24:30 +03:00
/* template */
2020-01-28 20:12:08 +03:00
var _ _vue _render _ _$a = function ( ) {
2019-10-07 17:24:30 +03:00
var _vm = this ;
var _h = _vm . $createElement ;
var _c = _vm . _self . _c || _h ;
return _c (
"div" ,
{
2019-11-14 09:00:56 +03:00
class :
"formulate-input-element formulate-input-element--" + _vm . context . type ,
attrs : { "data-type" : _vm . context . type }
} ,
[
_vm . type === "checkbox"
? _c (
"input" ,
_vm . _b (
{
directives : [
{
name : "model" ,
rawName : "v-model" ,
value : _vm . context . model ,
expression : "context.model"
}
] ,
attrs : { type : "checkbox" } ,
domProps : {
checked : Array . isArray ( _vm . context . model )
? _vm . _i ( _vm . context . model , null ) > - 1
: _vm . context . model
} ,
on : {
blur : _vm . context . blurHandler ,
change : function ( $event ) {
var $$a = _vm . context . model ,
$$el = $event . target ,
$$c = $$el . checked ? true : false ;
if ( Array . isArray ( $$a ) ) {
var $$v = null ,
$$i = _vm . _i ( $$a , $$v ) ;
if ( $$el . checked ) {
$$i < 0 &&
_vm . $set ( _vm . context , "model" , $$a . concat ( [ $$v ] ) ) ;
} else {
$$i > - 1 &&
_vm . $set (
_vm . context ,
"model" ,
$$a . slice ( 0 , $$i ) . concat ( $$a . slice ( $$i + 1 ) )
) ;
}
} else {
_vm . $set ( _vm . context , "model" , $$c ) ;
}
}
}
} ,
"input" ,
_vm . attributes ,
false
)
)
: _vm . type === "radio"
? _c (
"input" ,
_vm . _b (
{
directives : [
{
name : "model" ,
rawName : "v-model" ,
value : _vm . context . model ,
expression : "context.model"
}
] ,
attrs : { type : "radio" } ,
domProps : { checked : _vm . _q ( _vm . context . model , null ) } ,
on : {
blur : _vm . context . blurHandler ,
change : function ( $event ) {
return _vm . $set ( _vm . context , "model" , null )
}
}
} ,
"input" ,
_vm . attributes ,
false
)
)
: _c (
"input" ,
_vm . _b (
{
directives : [
{
name : "model" ,
rawName : "v-model" ,
value : _vm . context . model ,
expression : "context.model"
}
] ,
attrs : { type : _vm . type } ,
domProps : { value : _vm . context . model } ,
on : {
blur : _vm . context . blurHandler ,
input : function ( $event ) {
if ( $event . target . composing ) {
return
}
_vm . $set ( _vm . context , "model" , $event . target . value ) ;
}
}
} ,
"input" ,
_vm . attributes ,
false
)
)
]
)
} ;
2020-01-28 20:12:08 +03:00
var _ _vue _staticRenderFns _ _$a = [ ] ;
_ _vue _render _ _$a . _withStripped = true ;
2019-11-14 09:00:56 +03:00
/* style */
2020-01-28 20:12:08 +03:00
var _ _vue _inject _styles _ _$a = undefined ;
2019-11-14 09:00:56 +03:00
/* scoped */
2020-01-28 20:12:08 +03:00
var _ _vue _scope _id _ _$a = undefined ;
2019-11-14 09:00:56 +03:00
/* module identifier */
2020-01-28 20:12:08 +03:00
var _ _vue _module _identifier _ _$a = undefined ;
2019-11-14 09:00:56 +03:00
/* functional template */
2020-01-28 20:12:08 +03:00
var _ _vue _is _functional _template _ _$a = false ;
2019-11-14 09:00:56 +03:00
/* style inject */
/* style inject SSR */
/* style inject shadow dom */
2020-02-26 01:32:40 +03:00
var _ _vue _component _ _$a = normalizeComponent (
2020-01-28 20:12:08 +03:00
{ render : _ _vue _render _ _$a , staticRenderFns : _ _vue _staticRenderFns _ _$a } ,
_ _vue _inject _styles _ _$a ,
_ _vue _script _ _$a ,
_ _vue _scope _id _ _$a ,
_ _vue _is _functional _template _ _$a ,
_ _vue _module _identifier _ _$a ,
2019-11-14 09:00:56 +03:00
false ,
undefined ,
undefined ,
undefined
) ;
//
2020-01-28 20:12:08 +03:00
var script$b = {
2019-11-14 09:00:56 +03:00
name : 'FormulateInputTextArea' ,
mixins : [ FormulateInputMixin ]
} ;
/* script */
2020-01-28 20:12:08 +03:00
var _ _vue _script _ _$b = script$b ;
2019-11-14 09:00:56 +03:00
/* template */
2020-01-28 20:12:08 +03:00
var _ _vue _render _ _$b = function ( ) {
2019-11-14 09:00:56 +03:00
var _vm = this ;
var _h = _vm . $createElement ;
var _c = _vm . _self . _c || _h ;
return _c (
"div" ,
{
staticClass : "formulate-input-element formulate-input-element--textarea" ,
attrs : { "data-type" : "textarea" }
2019-10-07 17:24:30 +03:00
} ,
[
_c (
"textarea" ,
_vm . _b (
{
directives : [
{
name : "model" ,
rawName : "v-model" ,
value : _vm . context . model ,
expression : "context.model"
}
] ,
domProps : { value : _vm . context . model } ,
on : {
2019-11-14 00:10:17 +03:00
blur : _vm . context . blurHandler ,
2019-10-07 17:24:30 +03:00
input : function ( $event ) {
if ( $event . target . composing ) {
return
}
_vm . $set ( _vm . context , "model" , $event . target . value ) ;
}
}
} ,
"textarea" ,
_vm . attributes ,
false
)
)
]
)
} ;
2020-01-28 20:12:08 +03:00
var _ _vue _staticRenderFns _ _$b = [ ] ;
_ _vue _render _ _$b . _withStripped = true ;
2019-10-07 17:24:30 +03:00
/* style */
2020-01-28 20:12:08 +03:00
var _ _vue _inject _styles _ _$b = undefined ;
2019-10-07 17:24:30 +03:00
/* scoped */
2020-01-28 20:12:08 +03:00
var _ _vue _scope _id _ _$b = undefined ;
2019-10-07 17:24:30 +03:00
/* module identifier */
2020-01-28 20:12:08 +03:00
var _ _vue _module _identifier _ _$b = undefined ;
2019-10-07 17:24:30 +03:00
/* functional template */
2020-01-28 20:12:08 +03:00
var _ _vue _is _functional _template _ _$b = false ;
2019-10-07 17:24:30 +03:00
/* style inject */
/* style inject SSR */
2019-11-01 21:03:48 +03:00
/* style inject shadow dom */
2019-10-07 17:24:30 +03:00
2020-02-26 01:32:40 +03:00
var _ _vue _component _ _$b = normalizeComponent (
2020-01-28 20:12:08 +03:00
{ render : _ _vue _render _ _$b , staticRenderFns : _ _vue _staticRenderFns _ _$b } ,
_ _vue _inject _styles _ _$b ,
_ _vue _script _ _$b ,
_ _vue _scope _id _ _$b ,
_ _vue _is _functional _template _ _$b ,
_ _vue _module _identifier _ _$b ,
2019-11-01 21:03:48 +03:00
false ,
undefined ,
2019-10-07 17:24:30 +03:00
undefined ,
undefined
) ;
/ * *
* The base formulate library .
* /
var Formulate = function Formulate ( ) {
this . defaults = {
components : {
2020-02-26 01:32:40 +03:00
FormulateForm : _ _vue _component _ _$1 ,
FormulateInput : _ _vue _component _ _ ,
FormulateInputErrors : _ _vue _component _ _$2 ,
FormulateInputBox : _ _vue _component _ _$4 ,
FormulateInputText : _ _vue _component _ _$5 ,
FormulateInputFile : _ _vue _component _ _$7 ,
FormulateInputGroup : _ _vue _component _ _$3 ,
FormulateInputButton : _ _vue _component _ _$8 ,
FormulateInputSelect : _ _vue _component _ _$9 ,
FormulateInputSlider : _ _vue _component _ _$a ,
FormulateInputTextArea : _ _vue _component _ _$b
2019-10-07 17:24:30 +03:00
} ,
2019-11-08 01:03:34 +03:00
library : library ,
2019-11-14 00:10:17 +03:00
rules : rules ,
locale : 'en' ,
2019-11-15 22:44:01 +03:00
uploader : fauxUploader ,
2019-11-19 15:15:13 +03:00
uploadJustCompleteDuration : 1000 ,
2019-11-14 00:10:17 +03:00
locales : {
en : en
}
2019-10-07 17:24:30 +03:00
} ;
} ;
/ * *
* Install vue formulate , and register it ’ s components .
* /
Formulate . prototype . install = function install ( Vue , options ) {
Vue . prototype . $formulate = this ;
this . options = this . extend ( this . defaults , options || { } ) ;
for ( var componentName in this . options . components ) {
Vue . component ( componentName , this . options . components [ componentName ] ) ;
}
2019-10-08 20:50:53 +03:00
Object . freeze ( this ) ;
2019-10-07 17:24:30 +03:00
} ;
/ * *
* Create a new object by copying properties of base and extendWith .
* @ param { Object } base
* @ param { Object } extendWith
* /
Formulate . prototype . extend = function extend ( base , extendWith ) {
var merged = { } ;
for ( var key in base ) {
if ( extendWith . hasOwnProperty ( key ) ) {
merged [ key ] = isPlainObject ( extendWith [ key ] ) && isPlainObject ( base [ key ] )
? this . extend ( base [ key ] , extendWith [ key ] )
: extendWith [ key ] ;
} else {
merged [ key ] = base [ key ] ;
}
}
for ( var prop in extendWith ) {
if ( ! merged . hasOwnProperty ( prop ) ) {
merged [ prop ] = extendWith [ prop ] ;
}
}
return merged
} ;
/ * *
* Determine what "class" of input this element is given the "type" .
* @ param { string } type
* /
Formulate . prototype . classify = function classify ( type ) {
if ( this . options . library . hasOwnProperty ( type ) ) {
return this . options . library [ type ] . classification
}
return 'unknown'
} ;
/ * *
* Determine what type of component to render given the "type" .
* @ param { string } type
* /
Formulate . prototype . component = function component ( type ) {
if ( this . options . library . hasOwnProperty ( type ) ) {
return this . options . library [ type ] . component
}
return false
} ;
2019-11-08 01:03:34 +03:00
/ * *
* Get validation rules .
* @ return { object } object of validation functions
* /
Formulate . prototype . rules = function rules ( ) {
return this . options . rules
} ;
2019-11-14 00:10:17 +03:00
/ * *
* Get the validation message for a particular error .
* /
Formulate . prototype . validationMessage = function validationMessage ( rule , validationContext ) {
var generators = this . options . locales [ this . options . locale ] ;
if ( generators . hasOwnProperty ( rule ) ) {
return generators [ rule ] ( validationContext )
2019-11-14 09:00:56 +03:00
} else if ( rule [ 0 ] === '_' && generators . hasOwnProperty ( rule . substr ( 1 ) ) ) {
return generators [ rule . substr ( 1 ) ] ( validationContext )
2019-11-14 00:10:17 +03:00
}
if ( generators . hasOwnProperty ( 'default' ) ) {
return generators . default ( validationContext )
}
return 'This field does not have a valid value'
} ;
2019-11-15 22:44:01 +03:00
/ * *
* Get the file uploader .
* /
Formulate . prototype . getUploader = function getUploader ( ) {
return this . options . uploader || false
} ;
/ * *
* Create a new instance of an upload .
* /
Formulate . prototype . createUpload = function createUpload ( fileList , context ) {
return new FileUpload ( fileList , context , this . options )
} ;
2019-10-07 17:24:30 +03:00
var Formulate$1 = new Formulate ( ) ;
export default Formulate$1 ;
2020-02-26 01:32:40 +03:00
export { FileUpload } ;