Current File : /home/tradevaly/www/node_modules/sweetalert2/src/utils/getTemplateParams.js |
import defaultParams from './params.js'
import { toArray, capitalizeFirstLetter, warn } from './utils.js'
const swalStringParams = ['swal-title', 'swal-html', 'swal-footer']
export const getTemplateParams = (params) => {
const template = typeof params.template === 'string' ? document.querySelector(params.template) : params.template
if (!template) {
return {}
}
const templateContent = template.content || template // IE11
showWarningsForElements(templateContent)
const result = Object.assign(
getSwalParams(templateContent),
getSwalButtons(templateContent),
getSwalImage(templateContent),
getSwalIcon(templateContent),
getSwalInput(templateContent),
getSwalStringParams(templateContent, swalStringParams),
)
return result
}
const getSwalParams = (templateContent) => {
const result = {}
toArray(templateContent.querySelectorAll('swal-param')).forEach((param) => {
showWarningsForAttributes(param, ['name', 'value'])
const paramName = param.getAttribute('name')
let value = param.getAttribute('value')
if (typeof defaultParams[paramName] === 'boolean' && value === 'false') {
value = false
}
if (typeof defaultParams[paramName] === 'object') {
value = JSON.parse(value)
}
result[paramName] = value
})
return result
}
const getSwalButtons = (templateContent) => {
const result = {}
toArray(templateContent.querySelectorAll('swal-button')).forEach((button) => {
showWarningsForAttributes(button, ['type', 'color', 'aria-label'])
const type = button.getAttribute('type')
result[`${type}ButtonText`] = button.innerHTML
result[`show${capitalizeFirstLetter(type)}Button`] = true
if (button.hasAttribute('color')) {
result[`${type}ButtonColor`] = button.getAttribute('color')
}
if (button.hasAttribute('aria-label')) {
result[`${type}ButtonAriaLabel`] = button.getAttribute('aria-label')
}
})
return result
}
const getSwalImage = (templateContent) => {
const result = {}
const image = templateContent.querySelector('swal-image')
if (image) {
showWarningsForAttributes(image, ['src', 'width', 'height', 'alt'])
if (image.hasAttribute('src')) {
result.imageUrl = image.getAttribute('src')
}
if (image.hasAttribute('width')) {
result.imageWidth = image.getAttribute('width')
}
if (image.hasAttribute('height')) {
result.imageHeight = image.getAttribute('height')
}
if (image.hasAttribute('alt')) {
result.imageAlt = image.getAttribute('alt')
}
}
return result
}
const getSwalIcon = (templateContent) => {
const result = {}
const icon = templateContent.querySelector('swal-icon')
if (icon) {
showWarningsForAttributes(icon, ['type', 'color'])
if (icon.hasAttribute('type')) {
result.icon = icon.getAttribute('type')
}
if (icon.hasAttribute('color')) {
result.iconColor = icon.getAttribute('color')
}
result.iconHtml = icon.innerHTML
}
return result
}
const getSwalInput = (templateContent) => {
const result = {}
const input = templateContent.querySelector('swal-input')
if (input) {
showWarningsForAttributes(input, ['type', 'label', 'placeholder', 'value'])
result.input = input.getAttribute('type') || 'text'
if (input.hasAttribute('label')) {
result.inputLabel = input.getAttribute('label')
}
if (input.hasAttribute('placeholder')) {
result.inputPlaceholder = input.getAttribute('placeholder')
}
if (input.hasAttribute('value')) {
result.inputValue = input.getAttribute('value')
}
}
const inputOptions = templateContent.querySelectorAll('swal-input-option')
if (inputOptions.length) {
result.inputOptions = {}
toArray(inputOptions).forEach((option) => {
showWarningsForAttributes(option, ['value'])
const optionValue = option.getAttribute('value')
const optionName = option.innerHTML
result.inputOptions[optionValue] = optionName
})
}
return result
}
const getSwalStringParams = (templateContent, paramNames) => {
const result = {}
for (const i in paramNames) {
const paramName = paramNames[i]
const tag = templateContent.querySelector(paramName)
if (tag) {
showWarningsForAttributes(tag, [])
result[paramName.replace(/^swal-/, '')] = tag.innerHTML.trim()
}
}
return result
}
const showWarningsForElements = (template) => {
const allowedElements = swalStringParams.concat([
'swal-param',
'swal-button',
'swal-image',
'swal-icon',
'swal-input',
'swal-input-option',
])
toArray(template.querySelectorAll('*')).forEach((el) => {
if (el.parentNode !== template) { // can't use template.children because of IE11
return
}
const tagName = el.tagName.toLowerCase()
if (allowedElements.indexOf(tagName) === -1) {
warn(`Unrecognized element <${tagName}>`)
}
})
}
const showWarningsForAttributes = (el, allowedAttributes) => {
toArray(el.attributes).forEach((attribute) => {
if (allowedAttributes.indexOf(attribute.name) === -1) {
warn([
`Unrecognized attribute "${attribute.name}" on <${el.tagName.toLowerCase()}>.`,
`${allowedAttributes.length ? `Allowed attributes are: ${allowedAttributes.join(', ')}` : 'To set the value, use HTML within the element.'}`
])
}
})
}