Apply getter-transforms on change functions

This commit is contained in:
Talia 2023-10-17 10:33:01 +02:00
parent f13bccf7a9
commit 350117ef64

View file

@ -6,9 +6,9 @@ export default Class => {
const props = [] const props = []
Object.entries(attributes).forEach(([name, attribute]) => { Object.entries(attributes).forEach(([name, attribute]) => {
let htmlName = name.replace(/([a-z])([A-Z])/g, "$1-$2").toLowerCase() const htmlName = name.replace(/([a-z])([A-Z])/g, "$1-$2").toLowerCase()
props.push(htmlName) props.push(htmlName)
let prop = {} const prop = {}
prop.get = typeof attribute.get == "function" prop.get = typeof attribute.get == "function"
? function() { return attribute.get.call(this, this.getAttribute(htmlName)) } ? function() { return attribute.get.call(this, this.getAttribute(htmlName)) }
@ -17,7 +17,7 @@ export default Class => {
prop.set = typeof attribute.set == "function" prop.set = typeof attribute.set == "function"
? function(val) { return this.setAttribute(htmlName, attribute.set.call(this, val)) } ? function(val) { return this.setAttribute(htmlName, attribute.set.call(this, val)) }
: attribute.set === false : attribute.set === false
? function(val) { throw(Error(`Attribute ${name} cannot be set`)) } ? function() { throw(Error(`Attribute ${name} cannot be set`)) }
: function(val) { this.setAttribute(htmlName, val) } : function(val) { this.setAttribute(htmlName, val) }
Object.defineProperty(proto, name, prop) Object.defineProperty(proto, name, prop)
@ -33,9 +33,20 @@ export default Class => {
}) })
Class.prototype.attributeChangedCallback = function(name, oldValue, newValue) { Class.prototype.attributeChangedCallback = function(name, oldValue, newValue) {
name = name.replaceAll(/-(.)/g, (a, b) => b.toUpperCase()) name = name.replaceAll(/-(.)/g, (_, b) => b.toUpperCase())
if (`${name}Changed` in this) this[`${name}Changed`](oldValue, newValue) const get_transform = attributes[name]?.get
if (`changed` in this) this.changed(name, oldValue, newValue) if (`${name}Changed` in this) {
if (typeof get_transform == "function")
return this[`${name}Changed`](get_transform(oldValue), get_transform(newValue))
else
return this[`${name}Changed`](oldValue, newValue)
}
if (`changed` in this) {
if (typeof get_transform == "function")
return this.changed(name, get_transform(oldValue), get_transform(newValue))
else
return this.changed(name, oldValue, newValue)
}
} }
/* Enable batch-processing for dollar-methods */ /* Enable batch-processing for dollar-methods */
@ -54,7 +65,7 @@ export default Class => {
queue.push(args) queue.push(args)
Class.queues.set(this, queue) Class.queues.set(this, queue)
} }
}; }
} }
} }