diff --git a/src/editor/components/seDropdown.js b/src/editor/components/seDropdown.js index 981ce4d9..0a61f5a5 100644 --- a/src/editor/components/seDropdown.js +++ b/src/editor/components/seDropdown.js @@ -74,7 +74,6 @@ class Dropdown extends ListComboBox { */ attributeChangedCallback (name, oldValue, newValue) { if (oldValue === newValue) return; - console.log({this: this, name, oldValue, newValue}); switch (name) { case 'title': // this.$span.setAttribute('title', `${newValue} ${shortcut ? `[${shortcut}]` : ''}`); diff --git a/src/editor/components/seExplorerButton.js b/src/editor/components/seExplorerButton.js index 0f11b4a1..c18f7569 100644 --- a/src/editor/components/seExplorerButton.js +++ b/src/editor/components/seExplorerButton.js @@ -242,7 +242,6 @@ export class ExplorerButton extends HTMLElement { connectedCallback () { // capture click event on the button to manage the logic const onClickHandler = (ev) => { - console.log(ev.target); ev.stopPropagation(); switch (ev.target.nodeName) { case 'SE-EXPLORERBUTTON': diff --git a/src/editor/components/seSpinInput.js b/src/editor/components/seSpinInput.js index 06bf5cec..e04e8ed1 100644 --- a/src/editor/components/seSpinInput.js +++ b/src/editor/components/seSpinInput.js @@ -18,6 +18,9 @@ template.innerHTML = ` right: -4px; position: relative; } + elix-number-spin-box::part(spin-button) { + padding: 0px; + } icon label @@ -47,7 +50,7 @@ export class SESpinInput extends HTMLElement { * @returns {any} observed */ static get observedAttributes () { - return ['value', 'label', 'src', 'size']; + return ['value', 'label', 'src', 'size', 'min', 'max', 'step']; } /** * @function attributeChangedCallback @@ -57,6 +60,7 @@ export class SESpinInput extends HTMLElement { * @returns {void} */ attributeChangedCallback (name, oldValue, newValue) { + console.log(name, newValue); if (oldValue === newValue) return; switch (name) { case 'src': @@ -64,7 +68,10 @@ export class SESpinInput extends HTMLElement { this.$label.remove(); break; case 'size': - this.$input.setAttribute('size', newValue); + // access to the underlying input box + this.$input.shadowRoot.getElementById('input').size = newValue; + // below seems mandatory to override the default width style that takes precedence on size + this.$input.shadowRoot.getElementById('input').style.width = 'unset'; break; case 'step': this.$input.setAttribute('step', newValue); @@ -155,11 +162,16 @@ export class SESpinInput extends HTMLElement { * @returns {void} */ connectedCallback () { - this.addEventListener('change', (e) => { + this.$input.addEventListener('change', (e) => { e.preventDefault(); this.value = e.target.value; + this.dispatchEvent(this.$event); + }); + this.$input.addEventListener('click', (e) => { + e.preventDefault(); + this.value = e.target.value; + this.dispatchEvent(this.$event); }); - this.dispatchEvent(this.$event); } } diff --git a/src/editor/index.html b/src/editor/index.html index b3267dbd..13fa57f2 100644 --- a/src/editor/index.html +++ b/src/editor/index.html @@ -150,7 +150,7 @@ - +
- +
@@ -275,7 +275,7 @@
- + @@ -375,7 +375,7 @@
- +