{"version":3,"sources":["webpack:///./src/js/components/field-validator.js","webpack:///./src/js/components/form-validator.js","webpack:///./src/js/components/contact-form.js"],"names":["emailPattern","phonePattern","validatePattern","value","pattern","test","FieldValidator","_Component","_classCallCheck","_callSuper","arguments","_inherits","key","this","dom","$input","el","_$","$errorMessage","isRequired","hasAttribute","isEmail","getAttribute","isPhone","errorRequired","dataset","errorEmail","errorPhone","addValidators","handleInputChange","_on","bind","validators","errors","push","trim","length","showErrors","undefined","_this$dom","isTouched","classList","contains","isValid","some","validator","add","remove","textContent","findIndex","triggerCustomEvent","bubbles","validate","Component","FormValidator","$fields","_$$","$dropdowns","fieldValidators","map","field","filter","fieldValidator","focus","forEach","reset","$dropdown","$button","defaultLabel","ContactForm","$form","$heading","$success","$submitBtn","$buttonReset","$buttonTryAgain","$alertError","headingSuccess","headingDefault","fetchUrl","formValidator","handleSubmit","handleChange","handleReset","disabled","e","_this","preventDefault","_this$dom2","formData","Array","from","window","FormData","target","data","entries","reduce","memo","_ref","_ref2","_slicedToArray","_ref2$","_objectSpread","_defineProperty","axios","post","then","hidden","catch","_this$dom3"],"mappings":"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","file":"32.1eb854.js","sourcesContent":["import { Component } from '@verndale/core';\r\nimport { triggerCustomEvent } from '../utils/events';\r\n\r\nconst emailPattern = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\\.[a-zA-Z]{2,}$/;\r\nconst phonePattern = /^(\\+\\d{1,2}\\s)?\\(?\\d{3}\\)?[\\s.-]?\\d{3}[\\s.-]?\\d{4}$/;\r\n\r\nconst validatePattern = (value, pattern) => pattern.test(value);\r\nconst validateRequired = (value) => value.trim().length > 0;\r\nconst validatePhone = (value) =>\r\n value.trim().length > 9 && validatePattern(value, phonePattern);\r\n\r\nclass FieldValidator extends Component {\r\n setupDefaults() {\r\n this.dom = {\r\n $input: this.el._$('.field__input'),\r\n $errorMessage: this.el._$('.field__error-msg')\r\n };\r\n\r\n this.isRequired = this.dom.$input.hasAttribute('required');\r\n this.isEmail = this.dom.$input.getAttribute('type') === 'email';\r\n this.isPhone = this.dom.$input.getAttribute('type') === 'phone';\r\n this.errorRequired = this.el.dataset.errorRequired || '';\r\n this.errorEmail = this.el.dataset.errorEmail || '';\r\n this.errorPhone = this.el.dataset.errorPhone || '';\r\n\r\n this.addValidators();\r\n this.handleInputChange();\r\n }\r\n\r\n addListeners() {\r\n const { $input } = this.dom;\r\n\r\n $input._on('change', ::this.handleInputChange);\r\n $input._on('keyup', ::this.handleInputChange);\r\n $input._on('blur', ::this.handleInputChange);\r\n }\r\n\r\n addValidators() {\r\n const { $input } = this.dom;\r\n this.validators = [];\r\n this.errors = [];\r\n\r\n if (this.isRequired) {\r\n this.validators.push(() => validateRequired($input.value));\r\n this.errors.push(this.errorRequired);\r\n }\r\n\r\n if (this.isEmail) {\r\n this.validators.push(() => validatePattern($input.value, emailPattern));\r\n this.errors.push(this.errorEmail);\r\n }\r\n\r\n if (this.isPhone) {\r\n this.validators.push(() => validatePhone($input.value));\r\n this.errors.push(this.errorPhone);\r\n }\r\n }\r\n\r\n validate(showErrors = true) {\r\n const { $input, $errorMessage } = this.dom;\r\n const isTouched = this.el.classList.contains('field--touched');\r\n let isValid = true;\r\n\r\n if (!this.isRequired && !$input.value) {\r\n this.el.classList.remove('field--ok');\r\n this.el.classList.remove('field--error');\r\n\r\n return true;\r\n }\r\n\r\n if (\r\n this.validators.length &&\r\n this.errors.length &&\r\n this.validators.some((validator) => !validator())\r\n ) {\r\n if (showErrors || isTouched) {\r\n this.el.classList.add('field--error');\r\n this.el.classList.remove('field--ok');\r\n $errorMessage.textContent = this.errors[\r\n this.validators.findIndex((validator) => !validator())\r\n ];\r\n }\r\n isValid = false;\r\n } else {\r\n if (showErrors || isTouched) {\r\n this.el.classList.add('field--ok');\r\n this.el.classList.remove('field--error');\r\n }\r\n }\r\n\r\n return isValid;\r\n }\r\n\r\n reset() {\r\n const { $input } = this.dom;\r\n\r\n this.el.classList.remove('field--ok');\r\n this.el.classList.remove('field--error');\r\n this.el.classList.remove('field--filled');\r\n $input.value = '';\r\n triggerCustomEvent($input, 'reset', { bubbles: true });\r\n }\r\n\r\n handleInputChange() {\r\n this.validate();\r\n }\r\n}\r\n\r\nexport default FieldValidator;\r\n","import { Component } from '@verndale/core';\r\n\r\nimport FieldValidator from './field-validator';\r\n\r\nclass FormValidator extends Component {\r\n setupDefaults() {\r\n this.dom = {\r\n $fields: this.el._$$('.field'),\r\n $dropdowns: this.el._$$('.dropdown')\r\n };\r\n\r\n this.fieldValidators = this.dom.$fields.map(\r\n (field) => new FieldValidator(field)\r\n );\r\n }\r\n\r\n validate(showErrors = true) {\r\n const errors = this.fieldValidators.filter(\r\n (fieldValidator) => !fieldValidator.validate(showErrors)\r\n );\r\n\r\n if (errors.length) {\r\n if (showErrors) {\r\n errors[0].dom.$input.focus();\r\n }\r\n\r\n return false;\r\n }\r\n\r\n return true;\r\n }\r\n\r\n reset() {\r\n const { $dropdowns } = this.dom;\r\n this.fieldValidators.forEach((fieldValidator) => fieldValidator.reset());\r\n\r\n if ($dropdowns && $dropdowns.length) {\r\n $dropdowns.forEach(($dropdown) => {\r\n const $button = $dropdown._$('.dropdown__button');\r\n\r\n $button.textContent = $button.dataset.defaultLabel;\r\n });\r\n }\r\n }\r\n}\r\n\r\nexport default FormValidator;\r\n","import { Component } from '@verndale/core';\r\nimport axios from 'axios';\r\n\r\nimport FormValidator from '../components/form-validator';\r\n\r\nclass ContactForm extends Component {\r\n setupDefaults() {\r\n this.dom = {\r\n $form: this.el._$('.contact-form__form'),\r\n $heading: this.el._$('h2'),\r\n $success: this.el._$('.contact-form__success'),\r\n $submitBtn: this.el._$('.contact-form__submit-btn'),\r\n $buttonReset: this.el._$('.contact-form__reset'),\r\n $buttonTryAgain: this.el._$('.contact-form__try-again'),\r\n $alertError: this.el._$('.contact-form__alert-error')\r\n };\r\n\r\n this.headingSuccess = this.el.dataset.headingSuccess;\r\n this.headingDefault = this.el.dataset.headingDefault;\r\n this.fetchUrl = this.dom.$form.dataset.fetchUrl;\r\n this.formValidator = new FormValidator(this.dom.$form);\r\n }\r\n\r\n addListeners() {\r\n const { $form, $buttonReset, $buttonTryAgain } = this.dom;\r\n\r\n $form._on('submit', ::this.handleSubmit);\r\n $form._on('change', ::this.handleChange);\r\n $form._on('input', ::this.handleChange);\r\n $buttonTryAgain._on('submit', ::this.handleSubmit);\r\n $buttonReset._on('click', ::this.handleReset);\r\n }\r\n\r\n handleChange() {\r\n const { $submitBtn } = this.dom;\r\n\r\n if (this.formValidator.validate(false)) {\r\n $submitBtn.disabled = false;\r\n } else {\r\n $submitBtn.disabled = true;\r\n }\r\n }\r\n\r\n handleSubmit(e) {\r\n e.preventDefault();\r\n\r\n const {\r\n $heading,\r\n $form,\r\n $alertError,\r\n $success,\r\n $buttonTryAgain,\r\n $submitBtn\r\n } = this.dom;\r\n const formData = Array.from(new window.FormData(e.target));\r\n const data = Array.from(formData.entries()).reduce(\r\n (memo, [index, [key, value]]) => ({\r\n ...memo,\r\n [key]: value\r\n }),\r\n {}\r\n );\r\n\r\n if (this.formValidator.validate()) {\r\n axios\r\n .post(this.fetchUrl, data)\r\n .then(() => {\r\n $form.hidden = true;\r\n $success.hidden = false;\r\n $alertError.hidden = true;\r\n $buttonTryAgain.hidden = true;\r\n $heading.textContent = this.headingSuccess;\r\n })\r\n .catch(() => {\r\n $form.hidden = false;\r\n $success.hidden = true;\r\n $alertError.hidden = false;\r\n $buttonTryAgain.hidden = false;\r\n $submitBtn.hidden = true;\r\n });\r\n }\r\n }\r\n\r\n handleReset() {\r\n const {\r\n $form,\r\n $alertError,\r\n $success,\r\n $buttonTryAgain,\r\n $heading,\r\n $submitBtn\r\n } = this.dom;\r\n\r\n this.formValidator.reset();\r\n $form.hidden = false;\r\n $success.hidden = true;\r\n $alertError.hidden = true;\r\n $buttonTryAgain.hidden = true;\r\n $heading.textContent = this.headingDefault;\r\n $submitBtn.disabled = true;\r\n }\r\n}\r\n\r\nexport default ContactForm;\r\n"],"sourceRoot":""}