@popovandrii/ui-elements 0.1.2 → 0.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.cjs.js CHANGED
@@ -1 +1 @@
1
- Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e=class{selectors;spinBoxes;abortController=new AbortController;dbug;constructor(e={},t=!1){this.dbug=t;let n={main:`UIsp`,btn:`UIsp__btn`,input:`UIsp__input`,disabledBtn:`disabled`};this.selectors={...n,...e},this.spinBoxes=document.querySelectorAll(`.${this.selectors.main}`),this.event()}state=(e,t,n,r=0,i=0)=>{e==r||e<r?(t.classList.add(this.selectors.disabledBtn),t.disabled=!0):(t.classList.remove(this.selectors.disabledBtn),t.disabled=!1),i!==0&&(e==i||e>i?(n.classList.add(this.selectors.disabledBtn),n.disabled=!0):(n.classList.remove(this.selectors.disabledBtn),n.disabled=!1))};destroy(){this.spinBoxes?.forEach(e=>this.disableEl(e)),this.abortController&&this.abortController.abort(),this.spinBoxes=null}disableEl(e){let t=e.querySelector(`.${this.selectors.input}`),n=e.querySelectorAll(`.${this.selectors.btn}`);t&&(t.disabled=!0),n.forEach(e=>{e.classList.add(this.selectors.disabledBtn),e.disabled=!0}),e.setAttribute(`tabindex`,`-1`),e.setAttribute(`aria-disabled`,`true`)}setValue(e,t){let n=e.querySelector(`.${this.selectors.input}`);if(!n){this.dbug&&console.warn(`UISpinBox: input not found`);return}n.value=String(t),n.dispatchEvent(new Event(`change`))}getValidDataNumber=(e,t)=>{let n=e.getAttribute(`data-${t}`);return n===null||n.trim()===``||isNaN(Number(n))?0:Number(n)};event(){this.abortController=new AbortController;let e=this.abortController.signal;this.spinBoxes?.forEach(t=>{let n,r=t.querySelectorAll(`.${this.selectors.btn}`),i=t.querySelector(`.${this.selectors.input}`);this.dbug&&(r||console.log(`Buttons (${this.selectors.btn}) not found in container`),i||console.log(`Input (${this.selectors.input}) not found in container`));let a=r[0],o=r[1];i.disabled=!1,[a,o].forEach(e=>{e.classList.remove(this.selectors.disabledBtn),e.disabled=!1}),t.setAttribute(`tabindex`,`0`),t.removeAttribute(`aria-disabled`);let s=this.getValidDataNumber(t,`step`),c=this.getValidDataNumber(t,`min`),l=this.getValidDataNumber(t,`max`);if(t.hasAttribute(`data-disabled`)){Number(i.value)<=c&&(i.value=c.toFixed(s)),l===0?i.value=Number(i.value).toFixed(s):Number(i.value)>=l&&(i.value=l.toFixed(s)),this.disableEl(t),t.addEventListener(`click`,e=>{e.preventDefault(),e.stopImmediatePropagation()},{capture:!0,signal:e});return}let u=e=>{t.setAttribute(`aria-valuenow`,String(e)),t.setAttribute(`aria-valuetext`,`${e} items`)};Number(i.value)<=c&&(i.value=c.toFixed(s)),l===0?i.value=Number(i.value).toFixed(s):(Number(i.value)>=l&&(i.value=l.toFixed(s)),l&&t.setAttribute(`aria-valuemax`,l.toFixed(s))),c&&t.setAttribute(`aria-valuemin`,c.toFixed(s)),this.state(Number(i.value),a,o,c,l),u(i.value);let d=null,f=(e,t=1)=>{i.value=String(Math.abs(Number(i.value)));let n=parseFloat(i.value)||0;return n+=e*t/10**s,e===1&&l!==0&&n>l&&(n=l),e===-1&&n<c&&(n=c),i.value=n.toFixed(s),this.state(Number(i.value),a,o,c,l),u(i.value),i.value},p=(e,t=150)=>{d===null&&(d=window.setInterval(e,t))},m=()=>{d!==null&&(clearInterval(d),d=null)};o.addEventListener(`mousedown`,e=>{let t=e.shiftKey?3:1;p(()=>f(1,t))},{signal:e}),o.addEventListener(`touchstart`,()=>p(()=>f(1)),{signal:e}),[`mouseup`,`mouseleave`,`mouseout`,`touchend`,`touchcancel`].forEach(t=>{o.addEventListener(t,m,{signal:e})}),o.addEventListener(`click`,e=>{let t=e.shiftKey?3:1;d===null&&(n=f(1,t),this.costomEvent(i,n))},{signal:e}),a.addEventListener(`click`,e=>{let t=e.shiftKey?3:1;d===null&&(n=f(-1,t),this.costomEvent(i,n))},{signal:e}),a.addEventListener(`mousedown`,e=>{let t=e.shiftKey?3:1;p(()=>f(-1,t),100)},{signal:e}),a.addEventListener(`touchstart`,()=>p(()=>f(-1),100),{signal:e}),[`mouseup`,`mouseleave`,`mouseout`,`touchend`,`touchcancel`].forEach(t=>{a.addEventListener(t,m,{signal:e})}),i.addEventListener(`keydown`,e=>{let t=e.key,n=e.shiftKey?5:1;if([`Backspace`,`Delete`,`ArrowLeft`,`ArrowRight`,`Tab`,`Enter`,`Home`,`End`].includes(t)||(e.ctrlKey||e.metaKey)&&[`a`,`c`,`v`,`x`].includes(t.toLowerCase()))return;if([`e`,`+`,`-`].includes(t)){e.preventDefault();return}if(t===`ArrowUp`||t===`ArrowDown`){e.preventDefault(),f(t===`ArrowUp`?1:-1,n);return}let r=t===`,`?`.`:t,a=/^[0-9]$/.test(r),o=r===`.`,c=i.value.includes(`.`);(s===0&&!a||s>0&&!(a||o)||o&&c)&&e.preventDefault()},{signal:e}),i.addEventListener(`keyup`,e=>{(e.key===`ArrowUp`||e.key===`ArrowDown`)&&this.costomEvent(i,i.value)},{signal:e}),i.addEventListener(`change`,()=>{Number(i.value)<c&&(i.value=c.toFixed(s)),Number(i.value)>l&&l!==0?i.value=l.toFixed(s):i.value=Number(i.value).toFixed(s),this.state(Number(i.value),a,o,c,l),this.costomEvent(i,i.value)},{signal:e})})}costomEvent(e,t){let n={detail:{id:e.id,value:t},bubbles:!0};this.dbug&&console.log(`CostomEvent: data.detail `,n.detail),e.dispatchEvent(new CustomEvent(`ui-spinbox-change`,n))}},t=class{selectors;main=null;abortController=new AbortController;dbug;constructor(e={},t=!1){this.dbug=t;let n={main:`UIsw`,label:`UIsw-label`};this.selectors={...n,...e},this.main=document.querySelectorAll(`.${this.selectors.main}`),this.event()}destroy(){this.main?.forEach(e=>this.disableEl(e)),this.abortController&&this.abortController.abort(),this.main=null}disableEl(e){e.setAttribute(`tabindex`,`-1`),e.setAttribute(`aria-disabled`,`true`)}event(){this.abortController=new AbortController;let e=this.abortController.signal;this.main?.forEach(t=>{let n=t.querySelector(`.${this.selectors.label}`),r=t.querySelector(`input`);n&&n.id&&t.setAttribute(`aria-labelledby`,n.id),t.hasAttribute(`data-originally-disabled`)||t.setAttribute(`data-originally-disabled`,String(r?.disabled??!1));let i=t.getAttribute(`data-originally-disabled`)===`true`;r&&(r.disabled=!1),t.setAttribute(`tabindex`,`0`),t.removeAttribute(`aria-disabled`),i&&(r&&(r.disabled=!0),t.setAttribute(`tabindex`,`-1`),t.setAttribute(`aria-disabled`,`true`),t.addEventListener(`click`,e=>{e.preventDefault(),e.stopImmediatePropagation()},{capture:!0,signal:e})),r&&(r.checked?t.setAttribute(`aria-checked`,`true`):t.setAttribute(`aria-checked`,`false`),r.addEventListener(`change`,()=>{t.setAttribute(`aria-checked`,String(r.checked)),this.customEvent(r,String(r.checked))},{signal:e}),t.addEventListener(`click`,e=>{if(e.target.tagName===`INPUT`)return;let t=e.target.closest(`label`);t||(r.checked=!r.checked),t||r.dispatchEvent(new Event(`change`))},{signal:e}),t.addEventListener(`keydown`,e=>{let n=t.querySelector(`input`);e.key===`ArrowRight`?(r.checked=!0,t.setAttribute(`aria-checked`,String(r.checked)),e.preventDefault(),this.customEvent(n,`true`)):e.key===`ArrowLeft`&&(r.checked=!1,t.setAttribute(`aria-checked`,String(r.checked)),e.preventDefault(),this.customEvent(n,`false`))},{signal:e}))})}setValue(e,t){this.main?.forEach(n=>{let r=n.querySelector(`input#${e}`);r&&(r.checked=t,this.dbug&&console.log(`SetValue:`,r.checked),n.setAttribute(`aria-checked`,String(t)),this.customEvent(r,String(t)))})}customEvent(e,t){let n={detail:{id:e.id,value:t},bubbles:!0};this.dbug&&console.log(`CustomEvent:`,n.detail),e.dispatchEvent(new CustomEvent(`ui-switch-change`,n))}},n=class e{selectors;main=null;itemArrowInitialized=new WeakSet;abortController=new AbortController;dbug;selectMap=new Map;constructor(e={},t=!1){this.dbug=t;let n={idPrefix:`UI-option-`,main:`UIselect`,selected:`UIselect-selected`,arrow:`UIselect-arrow`,optionsList:`UIselect-options`,search:`UIselect-options__search`,items:`UIselect-options__items`,flash:`UIFlash`,excludedItems:[`divider`,`test`]};this.selectors={...n,...e},this.main=document.querySelectorAll(`.${this.selectors.main}`),this.event(),this.initGlobalListener(this.selectors)}filterExcluded(e,t){return Array.from(e).filter(e=>!t.some(t=>typeof t==`string`?e.classList.contains(t)||e.id===t:e===t))}filterSearch(e,t){let n=t.trim().toLowerCase();return e.filter(e=>{let t=e.dataset.value?.toLowerCase()||``,r=e.textContent?.toLowerCase()||``;return t.includes(n)||r.includes(n)})}destroy(){this.main?.forEach(e=>this.disableEl(e)),e.closeAll(this.selectors),this.abortController&&(this.abortController.abort(),this.selectMap.clear()),this.main=null}disableEl(e){e.setAttribute(`tabindex`,`-1`),e.setAttribute(`aria-disabled`,`true`)}setValue(e,t){let n=this.selectMap.get(e);if(!n){this.dbug&&console.warn(`UISelect: element not registered`);return}let{input:r,selected:i}=n,a=e.querySelector(`.${this.selectors.optionsList}`);if(!a)return;let o=Array.from(a.querySelectorAll(`.${this.selectors.items} ul li`)),s=this.filterExcluded(o,this.selectors.excludedItems),c=s.find(e=>String(e.dataset.value)===String(t));if(!c){this.dbug&&console.warn(`UISelect: value "${t}" not found`);return}s.forEach(e=>e.removeAttribute(`aria-selected`)),c.setAttribute(`aria-selected`,`true`),i.textContent=c.textContent??``,r.value=String(t),r.setAttribute(`value`,String(t)),e.setAttribute(`aria-activedescendant`,c.id||`${this.selectors.idPrefix}${s.indexOf(c)}`),this.customEvent(e,String(t)),e.classList.remove(this.selectors.flash),e.offsetWidth,e.classList.add(this.selectors.flash),e.addEventListener(`animationend`,()=>e.classList.remove(this.selectors.flash),{once:!0})}event(){this.abortController=new AbortController;let e=this.abortController.signal;this.main?.forEach(t=>{let n=t.querySelector(`.${this.selectors.main} input[type='hidden']`);try{if(!n)throw Error(`<input type="hidden" name="YouUniqueId">`)}catch(e){return console.warn(`Not found:`,e.message)}let r=t.querySelector(`.${this.selectors.selected}`),i=t.querySelector(`.${this.selectors.arrow}`),a=t.querySelector(`.${this.selectors.optionsList}`),o=t.querySelector(`.${this.selectors.search} input`);if(t.setAttribute(`tabindex`,`0`),t.removeAttribute(`aria-disabled`),t.hasAttribute(`data-disabled`)){this.disableEl(t),t.addEventListener(`click`,e=>{e.preventDefault(),e.stopImmediatePropagation()},{capture:!0,signal:e});return}this.selectMap.set(t,{input:n,selected:r}),i&&i.addEventListener(`click`,()=>{this.toggle(t,a)},{signal:e}),r.addEventListener(`click`,()=>{this.toggle(t,a)},{signal:e}),t.addEventListener(`click`,()=>{this.itemsPosition(a)},{signal:e});let s=a.querySelectorAll(`.${this.selectors.items} ul li`),c=this.filterExcluded(s,this.selectors.excludedItems),l=t.querySelector(`[aria-selected='true']`);l&&this.defaultSelect(t,l,r,n);var u=[];o&&o.addEventListener(`input`,i=>{let o=i.target.value.trim();r&&(u=this.filterSearch(c,o),o?(s.forEach(e=>e.remove()),u.forEach(e=>{a.querySelector(`.${this.selectors.optionsList} ul`)?.appendChild(e)})):s.forEach(e=>{a.querySelector(`.${this.selectors.optionsList} ul`)?.appendChild(e)}),this.itemArrow(t,a,r,n,e))},{signal:e}),this.itemArrow(t,a,r,n,e),this.items(t,a,c,r,n,e)},{signal:e})}itemArrow(e,t,n,r,i){if(this.itemArrowInitialized.has(e))return;this.itemArrowInitialized.add(e);let a=-1,o=n.textContent?n.textContent:``,s=e.querySelector(`.${this.selectors.search} input`);e.addEventListener(`keydown`,i=>{s&&s.focus();let c=Array.from(t.querySelectorAll(`.${this.selectors.optionsList} ul li`)),l=this.filterExcluded(c,this.selectors.excludedItems),u=l.length;if(u!==0)if(i.key===`ArrowDown`){i.preventDefault(),e.getAttribute(`aria-expanded`)===`false`&&this.toggle(e,t),a=(a+1)%u,n.textContent=l[a].textContent,l.forEach(e=>e.removeAttribute(`aria-selected`)),l[a].setAttribute(`aria-selected`,`true`);let r=l[a].id||`${this.selectors.idPrefix}${a}`;e.setAttribute(`aria-activedescendant`,r),l[a].scrollIntoView({block:`nearest`})}else if(i.key===`ArrowUp`){i.preventDefault(),a=(a-1+u)%u,n.textContent=l[a].textContent,l.forEach(e=>e.removeAttribute(`aria-selected`)),l[a].setAttribute(`aria-selected`,`true`);let t=l[a].id||`${this.selectors.idPrefix}${a}`;e.setAttribute(`aria-activedescendant`,t),l[a].scrollIntoView({block:`nearest`})}else if(i.key===`Enter`)if(i.preventDefault(),a>=0){n.textContent=l[a].textContent,l.forEach(e=>e.removeAttribute(`aria-selected`)),l[a].setAttribute(`aria-selected`,`true`);let i=l[a].id||`${this.selectors.idPrefix}${a}`;e.setAttribute(`aria-activedescendant`,i),r.value=String(l[a].dataset.value),this.customEvent(e,r.value),this.close(e,t)}else this.toggle(e,t);else i.key===`Escape`&&(e.getAttribute(`aria-activedescendant`)||(n.textContent=o),this.close(e,t))},{signal:i})}itemsPosition(e){let t=e.querySelector(`[aria-selected="true"]`);t&&t.scrollIntoView({block:`nearest`})}items(e,t,n,r,i,a){n.forEach((o,s)=>{o.addEventListener(`click`,()=>{let a=n[s];if(a){r.textContent=a.textContent,n.forEach(e=>e.removeAttribute(`aria-selected`)),a.setAttribute(`aria-selected`,`true`);let o=a.id||`${this.selectors.idPrefix}${s}`;e.setAttribute(`aria-expanded`,`false`),e.setAttribute(`aria-activedescendant`,o),i.value=String(n[s].dataset.value),this.customEvent(e,i.value),this.close(e,t)}},{signal:a})})}defaultSelect(e,t,n,r){t&&(r.setAttribute(`value`,t.dataset.value??``),n.textContent=t.textContent??``,e.setAttribute(`aria-activedescendant`,t.id||``))}customEvent(e,t){let n={detail:{id:e.id,value:t},bubbles:!0};this.dbug&&console.log(`CustomEvent:`,n.detail),e.dispatchEvent(new CustomEvent(`ui-select-change`,n))}toggle(t,n){e.closeAll(this.selectors),n.hidden?(n.hidden=!1,t.setAttribute(`aria-expanded`,`true`)):this.close(t,n)}close(e,t){t.hidden=!0,e.setAttribute(`aria-expanded`,`false`)}static closeAll(e){document.querySelectorAll(`.${e.main}`).forEach(t=>{let n=t.querySelector(`.${e.optionsList}`);n.hidden=!0,t.setAttribute(`aria-expanded`,`false`)})}initGlobalListener(t){document.addEventListener(`click`,n=>{let r=n.target;[...document.querySelectorAll(`.${t.main}`)].some(e=>e.contains(r))||e.closeAll(t)},{signal:this.abortController.signal})}},r=class{selectors;main=null;abortController=new AbortController;dbug;constructor(e={},t=!1){this.dbug=t;let n={main:`UIbg`,btn:`UIbg-btn`,input:`UIbg-input`};this.selectors={...n,...e},this.main=document.querySelectorAll(`.${this.selectors.main}`),this.#e()}destroy(){this.main?.forEach(e=>this.disableEl(e)),this.abortController&&this.abortController.abort(),this.main=null}disableEl(e){e.querySelectorAll(`.${this.selectors.btn}`).forEach(e=>{e.setAttribute(`aria-disabled`,`true`)}),e.setAttribute(`aria-disabled`,`true`)}setValue(e,t){let n=e.querySelectorAll(`.${this.selectors.input}`),r=e.querySelectorAll(`.${this.selectors.btn}`),i=Array.from(n).findIndex(e=>e.value===t&&!e.disabled);if(i===-1){this.dbug&&console.warn(`UIButtonGroup: value "${t}" not found or disabled`);return}n.forEach((e,t)=>{e.checked=t===i,t===i?e.setAttribute(`checked`,``):e.removeAttribute(`checked`)}),r.forEach((e,t)=>{e.setAttribute(`aria-checked`,String(t===i)),e.setAttribute(`tabindex`,t===i?`0`:`-1`)}),this.costomEvent(n[i])}#e(){this.abortController=new AbortController;let e=this.abortController.signal;this.main?.forEach(t=>{t.querySelectorAll(`.${this.selectors.input}`).forEach(e=>{e.hasAttribute(`data-originally-disabled`)||e.setAttribute(`data-originally-disabled`,String(e.disabled)),e.disabled=e.getAttribute(`data-originally-disabled`)===`true`}),t.removeAttribute(`aria-disabled`);let n=t.querySelector(`.${this.selectors.input}:checked`);n&&this.costomEvent(n);let r=t.querySelectorAll(`.${this.selectors.btn}`);r.forEach(t=>{t.addEventListener(`click`,()=>{r.forEach(e=>{e.setAttribute(`aria-checked`,`false`),e.setAttribute(`tabindex`,`-1`)}),t.setAttribute(`aria-checked`,`true`),t.setAttribute(`tabindex`,`0`),t.focus()},{signal:e}),t.addEventListener(`keydown`,e=>{let n=Array.from(r).indexOf(t);if(e.key===`ArrowRight`&&n++,e.key===`ArrowLeft`&&n--,n<0&&(n=r.length-1),n>=r.length&&(n=0),e.key===`Enter`){let t=i[n];t&&!t.disabled&&(i.forEach(e=>{e.checked=!1,e.removeAttribute(`checked`)}),t.checked=!0,t.setAttribute(`checked`,``),this.costomEvent(t)),e.preventDefault();return}let a=r[n];a&&(r.forEach(e=>e.setAttribute(`tabindex`,`-1`)),a.setAttribute(`tabindex`,`0`),a.focus())},{signal:e})});let i=t.querySelectorAll(`.${this.selectors.input}`);i.forEach((t,n)=>{this.dbug&&(t.id||console.error(`Input #${n} in group has no ID!`),(!t.value||t.value===`on`)&&console.warn(`Input #${t.id} does not have a value specified (currently "${t.value}")`));let a=r[n];a&&(t.tabIndex=-1,a.setAttribute(`role`,`radio`),a.setAttribute(`aria-checked`,String(t.checked)),a.setAttribute(`tabindex`,t.checked?`0`:`-1`),t.disabled?a.setAttribute(`aria-disabled`,`true`):a.removeAttribute(`aria-disabled`),t.addEventListener(`click`,()=>{i.forEach(e=>{e.checked=!1,e.removeAttribute(`checked`)}),i[n].checked=!0,i[n].setAttribute(`checked`,``),this.costomEvent(t)},{signal:e}))});let a=Array.from(i).find(e=>e.checked&&!e.disabled)||Array.from(i).find(e=>!e.disabled);if(a){let e=t.querySelector(`label[for="${a.id}"]`);e&&e.setAttribute(`tabindex`,`0`)}})}costomEvent(e){let t={detail:{id:e.id,value:e.value},bubbles:!0};this.dbug&&console.log(`CostomEvent:`,t.detail),e.dispatchEvent(new CustomEvent(`ui-button-group-change`,t))}},i=class{selectors;buttons=null;abortController=new AbortController;dbug;constructor(e={},t=!1){this.dbug=t;let n={main:`UIb`};this.selectors={...n,...e},this.buttons=document.querySelectorAll(`.${this.selectors.main}`),this.#e()}setValue(e,t,n){e.dataset.value=t,e.tagName===`A`&&(e.href=t),n!==void 0&&(e.textContent=n),e.classList.remove(`UIb--flash`),e.offsetWidth,e.classList.add(`UIb--flash`),e.addEventListener(`animationend`,()=>e.classList.remove(`UIb--flash`),{once:!0})}destroy(){this.buttons?.forEach(e=>this.disableEl(e)),this.abortController&&this.abortController.abort(),this.buttons=null}disableEl(e){e.tagName===`BUTTON`?e.disabled=!0:(e.setAttribute(`aria-disabled`,`true`),e.setAttribute(`tabindex`,`-1`))}enableEl(e){e.tagName===`BUTTON`?e.disabled=!1:(e.removeAttribute(`aria-disabled`),e.setAttribute(`tabindex`,`0`))}isDisabled(e){return e.tagName===`BUTTON`?e.disabled:e.getAttribute(`aria-disabled`)===`true`}setDisabled(e,t){e.setAttribute(`data-originally-disabled`,String(t)),t?this.disableEl(e):this.enableEl(e)}#e(){this.abortController=new AbortController;let e=this.abortController.signal;this.buttons?.forEach(t=>{t.hasAttribute(`data-originally-disabled`)||t.setAttribute(`data-originally-disabled`,String(this.isDisabled(t))),t.getAttribute(`data-originally-disabled`)===`true`?this.disableEl(t):this.enableEl(t),t.addEventListener(`click`,e=>{if(this.isDisabled(t)){e.preventDefault(),e.stopImmediatePropagation();return}t.tagName===`A`&&e.preventDefault(),this.ripple(t),this.customEvent(t,String(t.dataset.value))},{signal:e})})}ripple(e){e.classList.remove(`UIb--ripple`),e.offsetWidth,e.classList.add(`UIb--ripple`),e.addEventListener(`animationend`,()=>e.classList.remove(`UIb--ripple`),{once:!0})}customEvent(e,t){if(!t||t===`undefined`||t.trim()===``){console.warn(`Button data-value="" Not set!`);return}let n={detail:{id:e.id,value:t},bubbles:!0};this.dbug&&console.info(`Button CustomEvent:`,n.detail),e.dispatchEvent(new CustomEvent(`ui-button-change`,n))}};exports.Button=i,exports.ButtonGroup=r,exports.Select=n,exports.SpinBox=e,exports.Switch=t;
1
+ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e=class{selectors;spinBoxes=null;abortController=new AbortController;dbug;root;observer=null;rescanTimer=null;constructor(e={},t=!1,n={}){this.dbug=t,this.root=n.root??document;let r={main:`UIsp`,btn:`UIsp__btn`,input:`UIsp__input`,disabledBtn:`disabled`};this.selectors={...r,...e},this.scan(),n.observe&&this.observe()}observe(){let e=this.root===document?document.body:this.root;this.observer=new MutationObserver(()=>{this.rescanTimer===null&&(this.rescanTimer=window.setTimeout(()=>{this.rescanTimer=null,this.scan()},50))}),this.observer.observe(e,{childList:!0,subtree:!0})}state=(e,t,n,r=0,i=0)=>{e==r||e<r?(t.classList.add(this.selectors.disabledBtn),t.disabled=!0):(t.classList.remove(this.selectors.disabledBtn),t.disabled=!1),i!==0&&(e==i||e>i?(n.classList.add(this.selectors.disabledBtn),n.disabled=!0):(n.classList.remove(this.selectors.disabledBtn),n.disabled=!1))};destroy(){this.observer?.disconnect(),this.observer=null,this.rescanTimer!==null&&(clearTimeout(this.rescanTimer),this.rescanTimer=null),this.abortController.abort(),this.spinBoxes?.forEach(e=>delete e.dataset.uispBound),this.spinBoxes=null,this.abortController=new AbortController}disableEl(e){let t=e.querySelector(`.${this.selectors.input}`),n=e.querySelectorAll(`.${this.selectors.btn}`);t&&(t.disabled=!0),n.forEach(e=>{e.classList.add(this.selectors.disabledBtn),e.disabled=!0}),e.setAttribute(`tabindex`,`-1`),e.setAttribute(`aria-disabled`,`true`)}setValue(e,t){let n=e.querySelector(`.${this.selectors.input}`);if(!n){this.dbug&&console.warn(`UISpinBox: input not found`);return}n.value=String(t),n.dispatchEvent(new Event(`change`)),!e.closest(`.ui-no-flash`)&&(e.classList.remove(`UIsp--flash`),e.offsetWidth,e.classList.add(`UIsp--flash`),n.addEventListener(`animationend`,()=>e.classList.remove(`UIsp--flash`),{once:!0}))}getValidDataNumber=(e,t)=>{let n=e.getAttribute(`data-${t}`);return n===null||n.trim()===``||isNaN(Number(n))?0:Number(n)};scan(){this.spinBoxes=this.root.querySelectorAll(`.${this.selectors.main}`);let e=this.abortController.signal;this.spinBoxes.forEach(t=>{if(t.dataset.uispBound)return;t.dataset.uispBound=`1`;let n,r=t.querySelectorAll(`.${this.selectors.btn}`),i=t.querySelector(`.${this.selectors.input}`);this.dbug&&(r||console.log(`Buttons (${this.selectors.btn}) not found in container`),i||console.log(`Input (${this.selectors.input}) not found in container`));let a=r[0],o=r[1];i.disabled=!1,[a,o].forEach(e=>{e.classList.remove(this.selectors.disabledBtn),e.disabled=!1}),t.setAttribute(`tabindex`,`0`),t.removeAttribute(`aria-disabled`);let s=this.getValidDataNumber(t,`step`),c=this.getValidDataNumber(t,`min`),l=this.getValidDataNumber(t,`max`);if(t.hasAttribute(`data-disabled`)){Number(i.value)<=c&&(i.value=c.toFixed(s)),l===0?i.value=Number(i.value).toFixed(s):Number(i.value)>=l&&(i.value=l.toFixed(s)),this.disableEl(t),t.addEventListener(`click`,e=>{e.preventDefault(),e.stopImmediatePropagation()},{capture:!0,signal:e});return}let u=e=>{t.setAttribute(`aria-valuenow`,String(e)),t.setAttribute(`aria-valuetext`,`${e} items`)};Number(i.value)<=c&&(i.value=c.toFixed(s)),l===0?i.value=Number(i.value).toFixed(s):(Number(i.value)>=l&&(i.value=l.toFixed(s)),l&&t.setAttribute(`aria-valuemax`,l.toFixed(s))),c&&t.setAttribute(`aria-valuemin`,c.toFixed(s)),this.state(Number(i.value),a,o,c,l),u(i.value);let d=null,f=(e,t=1)=>{i.value=String(Math.abs(Number(i.value)));let n=parseFloat(i.value)||0;return n+=e*t/10**s,e===1&&l!==0&&n>l&&(n=l),e===-1&&n<c&&(n=c),i.value=n.toFixed(s),this.state(Number(i.value),a,o,c,l),u(i.value),i.value},p=(e,t=150)=>{d===null&&(d=window.setInterval(e,t))},m=()=>{d!==null&&(clearInterval(d),d=null)};o.addEventListener(`mousedown`,e=>{let t=e.shiftKey?3:1;p(()=>f(1,t))},{signal:e}),o.addEventListener(`touchstart`,()=>p(()=>f(1)),{signal:e}),[`mouseup`,`mouseleave`,`mouseout`,`touchend`,`touchcancel`].forEach(t=>{o.addEventListener(t,m,{signal:e})}),o.addEventListener(`click`,e=>{let t=e.shiftKey?3:1;d===null&&(n=f(1,t),this.ripple(o),this.costomEvent(i,n))},{signal:e}),a.addEventListener(`click`,e=>{let t=e.shiftKey?3:1;d===null&&(n=f(-1,t),this.ripple(a),this.costomEvent(i,n))},{signal:e}),a.addEventListener(`mousedown`,e=>{let t=e.shiftKey?3:1;p(()=>f(-1,t),100)},{signal:e}),a.addEventListener(`touchstart`,()=>p(()=>f(-1),100),{signal:e}),[`mouseup`,`mouseleave`,`mouseout`,`touchend`,`touchcancel`].forEach(t=>{a.addEventListener(t,m,{signal:e})}),i.addEventListener(`keydown`,e=>{let t=e.key,n=e.shiftKey?5:1;if([`Backspace`,`Delete`,`ArrowLeft`,`ArrowRight`,`Tab`,`Enter`,`Home`,`End`].includes(t)||(e.ctrlKey||e.metaKey)&&[`a`,`c`,`v`,`x`].includes(t.toLowerCase()))return;if([`e`,`+`,`-`].includes(t)){e.preventDefault();return}if(t===`ArrowUp`||t===`ArrowDown`){e.preventDefault(),f(t===`ArrowUp`?1:-1,n);return}let r=t===`,`?`.`:t,a=/^[0-9]$/.test(r),o=r===`.`,c=i.value.includes(`.`);(s===0&&!a||s>0&&!(a||o)||o&&c)&&e.preventDefault()},{signal:e}),i.addEventListener(`keyup`,e=>{(e.key===`ArrowUp`||e.key===`ArrowDown`)&&this.costomEvent(i,i.value)},{signal:e}),i.addEventListener(`change`,()=>{Number(i.value)<c&&(i.value=c.toFixed(s)),Number(i.value)>l&&l!==0?i.value=l.toFixed(s):i.value=Number(i.value).toFixed(s),this.state(Number(i.value),a,o,c,l),this.costomEvent(i,i.value)},{signal:e})})}ripple(e){e.closest(`.ui-no-ripple`)||(e.classList.remove(`ui-ripple`),e.offsetWidth,e.classList.add(`ui-ripple`),e.addEventListener(`animationend`,()=>e.classList.remove(`ui-ripple`),{once:!0}))}costomEvent(e,t){let n={detail:{id:e.id,value:t},bubbles:!0};this.dbug&&console.log(`CostomEvent: data.detail `,n.detail),e.dispatchEvent(new CustomEvent(`ui-spinbox-change`,n))}},t=class{selectors;main=null;abortController=new AbortController;dbug;root;observer=null;rescanTimer=null;constructor(e={},t=!1,n={}){this.dbug=t,this.root=n.root??document;let r={main:`UIsw`,label:`UIsw-label`};this.selectors={...r,...e},this.scan(),n.observe&&this.observe()}observe(){let e=this.root===document?document.body:this.root;this.observer=new MutationObserver(()=>{this.rescanTimer===null&&(this.rescanTimer=window.setTimeout(()=>{this.rescanTimer=null,this.scan()},50))}),this.observer.observe(e,{childList:!0,subtree:!0})}destroy(){this.observer?.disconnect(),this.observer=null,this.rescanTimer!==null&&(clearTimeout(this.rescanTimer),this.rescanTimer=null),this.abortController.abort(),this.main?.forEach(e=>delete e.dataset.uiswBound),this.main=null,this.abortController=new AbortController}scan(){this.main=this.root.querySelectorAll(`.${this.selectors.main}`);let e=this.abortController.signal;this.main.forEach(t=>{if(t.dataset.uiswBound)return;t.dataset.uiswBound=`1`;let n=t.querySelector(`.${this.selectors.label}`),r=t.querySelector(`input`);n&&n.id&&t.setAttribute(`aria-labelledby`,n.id),t.hasAttribute(`data-originally-disabled`)||t.setAttribute(`data-originally-disabled`,String(r?.disabled??!1));let i=t.getAttribute(`data-originally-disabled`)===`true`;r&&(r.disabled=!1),t.setAttribute(`tabindex`,`0`),t.removeAttribute(`aria-disabled`),i&&(r&&(r.disabled=!0),t.setAttribute(`tabindex`,`-1`),t.setAttribute(`aria-disabled`,`true`),t.addEventListener(`click`,e=>{e.preventDefault(),e.stopImmediatePropagation()},{capture:!0,signal:e})),r&&(r.checked?t.setAttribute(`aria-checked`,`true`):t.setAttribute(`aria-checked`,`false`),r.addEventListener(`change`,()=>{t.setAttribute(`aria-checked`,String(r.checked)),this.customEvent(r,String(r.checked))},{signal:e}),t.addEventListener(`click`,e=>{if(e.target.tagName===`INPUT`)return;let n=e.target.closest(`label`);n||(r.checked=!r.checked),n||r.dispatchEvent(new Event(`change`));let i=t.querySelector(`.UIsw-slider`);i&&this.ripple(i)},{signal:e}),t.addEventListener(`keydown`,e=>{let n=t.querySelector(`input`);e.key===`ArrowRight`?(r.checked=!0,t.setAttribute(`aria-checked`,String(r.checked)),e.preventDefault(),this.customEvent(n,`true`)):e.key===`ArrowLeft`&&(r.checked=!1,t.setAttribute(`aria-checked`,String(r.checked)),e.preventDefault(),this.customEvent(n,`false`))},{signal:e}))})}setValue(e,t){this.main?.forEach(n=>{let r=n.querySelector(`input#${e}`);if(r){r.checked=t,this.dbug&&console.log(`SetValue:`,r.checked),n.setAttribute(`aria-checked`,String(t)),this.customEvent(r,String(t));let e=n.querySelector(`.UIsw-slider`);e&&!n.closest(`.ui-no-flash`)&&(n.classList.remove(`UIsw--flash`),n.offsetWidth,n.classList.add(`UIsw--flash`),e.addEventListener(`animationend`,()=>n.classList.remove(`UIsw--flash`),{once:!0}))}})}ripple(e){e.closest(`.ui-no-ripple`)||(e.classList.remove(`ui-ripple`),e.offsetWidth,e.classList.add(`ui-ripple`),e.addEventListener(`animationend`,()=>e.classList.remove(`ui-ripple`),{once:!0}))}customEvent(e,t){let n={detail:{id:e.id,value:t},bubbles:!0};this.dbug&&console.log(`CustomEvent:`,n.detail),e.dispatchEvent(new CustomEvent(`ui-switch-change`,n))}},n=class e{selectors;main=null;itemArrowInitialized=new WeakSet;abortController=new AbortController;dbug;root;observer=null;rescanTimer=null;selectMap=new Map;constructor(e={},t=!1,n={}){this.dbug=t,this.root=n.root??document;let r={idPrefix:`UI-option-`,main:`UIselect`,selected:`UIselect-selected`,arrow:`UIselect-arrow`,optionsList:`UIselect-options`,search:`UIselect-options__search`,items:`UIselect-options__items`,flash:`UIselect--flash`,excludedItems:[`divider`,`test`]};this.selectors={...r,...e},this.scan(),this.initGlobalListener(this.selectors),n.observe&&this.observe()}observe(){let e=this.root===document?document.body:this.root;this.observer=new MutationObserver(()=>{this.rescanTimer===null&&(this.rescanTimer=window.setTimeout(()=>{this.rescanTimer=null,this.scan()},50))}),this.observer.observe(e,{childList:!0,subtree:!0})}filterExcluded(e,t){return Array.from(e).filter(e=>!t.some(t=>typeof t==`string`?e.classList.contains(t)||e.id===t:e===t))}filterSearch(e,t){let n=t.trim().toLowerCase();return e.filter(e=>{let t=e.dataset.value?.toLowerCase()||``,r=e.textContent?.toLowerCase()||``;return t.includes(n)||r.includes(n)})}destroy(){this.observer?.disconnect(),this.observer=null,this.rescanTimer!==null&&(clearTimeout(this.rescanTimer),this.rescanTimer=null),e.closeAll(this.selectors),this.abortController.abort(),this.main?.forEach(e=>delete e.dataset.uiselBound),this.selectMap.clear(),this.itemArrowInitialized=new WeakSet,this.main=null,this.abortController=new AbortController}disableEl(e){e.setAttribute(`tabindex`,`-1`),e.setAttribute(`aria-disabled`,`true`)}setValue(e,t){let n=this.selectMap.get(e);if(!n){this.dbug&&console.warn(`UISelect: element not registered`);return}let{input:r,selected:i}=n,a=e.querySelector(`.${this.selectors.optionsList}`);if(!a)return;let o=Array.from(a.querySelectorAll(`.${this.selectors.items} ul li`)),s=this.filterExcluded(o,this.selectors.excludedItems),c=s.find(e=>String(e.dataset.value)===String(t));if(!c){this.dbug&&console.warn(`UISelect: value "${t}" not found`);return}s.forEach(e=>e.removeAttribute(`aria-selected`)),c.setAttribute(`aria-selected`,`true`),i.textContent=c.textContent??``,r.value=String(t),r.setAttribute(`value`,String(t)),e.setAttribute(`aria-activedescendant`,c.id||`${this.selectors.idPrefix}${s.indexOf(c)}`),this.customEvent(e,String(t)),e.closest(`.ui-no-flash`)||(e.classList.remove(this.selectors.flash),e.offsetWidth,e.classList.add(this.selectors.flash),e.addEventListener(`animationend`,()=>e.classList.remove(this.selectors.flash),{once:!0}))}scan(){this.main=this.root.querySelectorAll(`.${this.selectors.main}`);let e=this.abortController.signal;this.main.forEach(t=>{if(t.dataset.uiselBound)return;let n=t.querySelector(`.${this.selectors.main} input[type='hidden']`);try{if(!n)throw Error(`<input type="hidden" name="YouUniqueId">`)}catch(e){return console.warn(`Not found:`,e.message)}t.dataset.uiselBound=`1`;let r=t.querySelector(`.${this.selectors.selected}`),i=t.querySelector(`.${this.selectors.arrow}`),a=t.querySelector(`.${this.selectors.optionsList}`),o=t.querySelector(`.${this.selectors.search} input`);if(t.setAttribute(`tabindex`,`0`),t.removeAttribute(`aria-disabled`),t.hasAttribute(`data-disabled`)){this.disableEl(t),t.addEventListener(`click`,e=>{e.preventDefault(),e.stopImmediatePropagation()},{capture:!0,signal:e});return}this.selectMap.set(t,{input:n,selected:r}),i&&i.addEventListener(`click`,()=>{this.toggle(t,a)},{signal:e}),r.addEventListener(`click`,()=>{this.toggle(t,a)},{signal:e}),t.addEventListener(`click`,()=>{this.itemsPosition(a)},{signal:e});let s=a.querySelectorAll(`.${this.selectors.items} ul li`),c=this.filterExcluded(s,this.selectors.excludedItems),l=t.querySelector(`[aria-selected='true']`);l&&this.defaultSelect(t,l,r,n);var u=[];o&&o.addEventListener(`input`,i=>{let o=i.target.value.trim();r&&(u=this.filterSearch(c,o),o?(s.forEach(e=>e.remove()),u.forEach(e=>{a.querySelector(`.${this.selectors.optionsList} ul`)?.appendChild(e)})):s.forEach(e=>{a.querySelector(`.${this.selectors.optionsList} ul`)?.appendChild(e)}),this.itemArrow(t,a,r,n,e))},{signal:e}),this.itemArrow(t,a,r,n,e),this.items(t,a,c,r,n,e)},{signal:e})}itemArrow(e,t,n,r,i){if(this.itemArrowInitialized.has(e))return;this.itemArrowInitialized.add(e);let a=-1,o=n.textContent?n.textContent:``,s=e.querySelector(`.${this.selectors.search} input`);e.addEventListener(`keydown`,i=>{s&&s.focus();let c=Array.from(t.querySelectorAll(`.${this.selectors.optionsList} ul li`)),l=this.filterExcluded(c,this.selectors.excludedItems),u=l.length;if(u!==0)if(i.key===`ArrowDown`){i.preventDefault(),e.getAttribute(`aria-expanded`)===`false`&&this.toggle(e,t),a=(a+1)%u,n.textContent=l[a].textContent,l.forEach(e=>e.removeAttribute(`aria-selected`)),l[a].setAttribute(`aria-selected`,`true`);let r=l[a].id||`${this.selectors.idPrefix}${a}`;e.setAttribute(`aria-activedescendant`,r),l[a].scrollIntoView({block:`nearest`})}else if(i.key===`ArrowUp`){i.preventDefault(),a=(a-1+u)%u,n.textContent=l[a].textContent,l.forEach(e=>e.removeAttribute(`aria-selected`)),l[a].setAttribute(`aria-selected`,`true`);let t=l[a].id||`${this.selectors.idPrefix}${a}`;e.setAttribute(`aria-activedescendant`,t),l[a].scrollIntoView({block:`nearest`})}else if(i.key===`Enter`)if(i.preventDefault(),a>=0){n.textContent=l[a].textContent,l.forEach(e=>e.removeAttribute(`aria-selected`)),l[a].setAttribute(`aria-selected`,`true`);let i=l[a].id||`${this.selectors.idPrefix}${a}`;e.setAttribute(`aria-activedescendant`,i),r.value=String(l[a].dataset.value),this.customEvent(e,r.value),this.close(e,t)}else this.toggle(e,t);else i.key===`Escape`&&(e.getAttribute(`aria-activedescendant`)||(n.textContent=o),this.close(e,t))},{signal:i})}itemsPosition(e){let t=e.querySelector(`[aria-selected="true"]`);t&&t.scrollIntoView({block:`nearest`})}items(e,t,n,r,i,a){n.forEach((o,s)=>{o.addEventListener(`click`,()=>{let a=n[s];if(a){r.textContent=a.textContent,n.forEach(e=>e.removeAttribute(`aria-selected`)),a.setAttribute(`aria-selected`,`true`);let o=a.id||`${this.selectors.idPrefix}${s}`;e.setAttribute(`aria-expanded`,`false`),e.setAttribute(`aria-activedescendant`,o),i.value=String(n[s].dataset.value),this.customEvent(e,i.value),this.close(e,t)}},{signal:a})})}defaultSelect(e,t,n,r){t&&(r.setAttribute(`value`,t.dataset.value??``),n.textContent=t.textContent??``,e.setAttribute(`aria-activedescendant`,t.id||``))}customEvent(e,t){let n={detail:{id:e.id,value:t},bubbles:!0};this.dbug&&console.log(`CustomEvent:`,n.detail),e.dispatchEvent(new CustomEvent(`ui-select-change`,n))}toggle(t,n){e.closeAll(this.selectors),n.hidden?(n.hidden=!1,t.setAttribute(`aria-expanded`,`true`)):this.close(t,n)}close(e,t){t.hidden=!0,e.setAttribute(`aria-expanded`,`false`)}static closeAll(e){document.querySelectorAll(`.${e.main}`).forEach(t=>{let n=t.querySelector(`.${e.optionsList}`);n.hidden=!0,t.setAttribute(`aria-expanded`,`false`)})}initGlobalListener(t){document.addEventListener(`click`,n=>{let r=n.target;[...document.querySelectorAll(`.${t.main}`)].some(e=>e.contains(r))||e.closeAll(t)},{signal:this.abortController.signal})}},r=class{selectors;main=null;abortController=new AbortController;dbug;root;observer=null;rescanTimer=null;constructor(e={},t=!1,n={}){this.dbug=t,this.root=n.root??document;let r={main:`UIbg`,btn:`UIbg-btn`,input:`UIbg-input`};this.selectors={...r,...e},this.scan(),n.observe&&this.observe()}observe(){let e=this.root===document?document.body:this.root;this.observer=new MutationObserver(()=>{this.rescanTimer===null&&(this.rescanTimer=window.setTimeout(()=>{this.rescanTimer=null,this.scan()},50))}),this.observer.observe(e,{childList:!0,subtree:!0})}destroy(){this.observer?.disconnect(),this.observer=null,this.rescanTimer!==null&&(clearTimeout(this.rescanTimer),this.rescanTimer=null),this.abortController.abort(),this.main?.forEach(e=>delete e.dataset.uibgBound),this.main=null,this.abortController=new AbortController}setValue(e,t){let n=e.querySelectorAll(`.${this.selectors.input}`),r=e.querySelectorAll(`.${this.selectors.btn}`),i=Array.from(n).findIndex(e=>e.value===t&&!e.disabled);if(i===-1){this.dbug&&console.warn(`UIButtonGroup: value "${t}" not found or disabled`);return}n.forEach((e,t)=>{e.checked=t===i,t===i?e.setAttribute(`checked`,``):e.removeAttribute(`checked`)}),r.forEach((e,t)=>{e.setAttribute(`aria-checked`,String(t===i)),e.setAttribute(`tabindex`,t===i?`0`:`-1`)}),this.costomEvent(n[i]);let a=r[i];a&&!e.closest(`.ui-no-flash`)&&(a.classList.remove(`UIbg--flash`),a.offsetWidth,a.classList.add(`UIbg--flash`),a.addEventListener(`animationend`,()=>a.classList.remove(`UIbg--flash`),{once:!0}))}scan(){this.main=this.root.querySelectorAll(`.${this.selectors.main}`);let e=this.abortController.signal;this.main.forEach(t=>{if(t.dataset.uibgBound)return;t.dataset.uibgBound=`1`,t.querySelectorAll(`.${this.selectors.input}`).forEach(e=>{e.hasAttribute(`data-originally-disabled`)||e.setAttribute(`data-originally-disabled`,String(e.disabled)),e.disabled=e.getAttribute(`data-originally-disabled`)===`true`}),t.removeAttribute(`aria-disabled`);let n=t.querySelector(`.${this.selectors.input}:checked`);n&&this.costomEvent(n);let r=t.querySelectorAll(`.${this.selectors.btn}`);r.forEach(t=>{t.addEventListener(`click`,()=>{r.forEach(e=>{e.setAttribute(`aria-checked`,`false`),e.setAttribute(`tabindex`,`-1`)}),t.setAttribute(`aria-checked`,`true`),t.setAttribute(`tabindex`,`0`),t.focus(),this.#e(t)},{signal:e}),t.addEventListener(`keydown`,e=>{let n=Array.from(r).indexOf(t);if(e.key===`ArrowRight`&&n++,e.key===`ArrowLeft`&&n--,n<0&&(n=r.length-1),n>=r.length&&(n=0),e.key===`Enter`){let t=i[n];t&&!t.disabled&&(i.forEach(e=>{e.checked=!1,e.removeAttribute(`checked`)}),t.checked=!0,t.setAttribute(`checked`,``),this.costomEvent(t)),e.preventDefault();return}let a=r[n];a&&(r.forEach(e=>e.setAttribute(`tabindex`,`-1`)),a.setAttribute(`tabindex`,`0`),a.focus())},{signal:e})});let i=t.querySelectorAll(`.${this.selectors.input}`);i.forEach((t,n)=>{this.dbug&&(t.id||console.error(`Input #${n} in group has no ID!`),(!t.value||t.value===`on`)&&console.warn(`Input #${t.id} does not have a value specified (currently "${t.value}")`));let a=r[n];a&&(t.tabIndex=-1,a.setAttribute(`role`,`radio`),a.setAttribute(`aria-checked`,String(t.checked)),a.setAttribute(`tabindex`,t.checked?`0`:`-1`),t.disabled?a.setAttribute(`aria-disabled`,`true`):a.removeAttribute(`aria-disabled`),t.addEventListener(`click`,()=>{i.forEach(e=>{e.checked=!1,e.removeAttribute(`checked`)}),i[n].checked=!0,i[n].setAttribute(`checked`,``),this.costomEvent(t)},{signal:e}))});let a=Array.from(i).find(e=>e.checked&&!e.disabled)||Array.from(i).find(e=>!e.disabled);if(a){let e=t.querySelector(`label[for="${a.id}"]`);e&&e.setAttribute(`tabindex`,`0`)}})}#e(e){e.closest(`.ui-no-ripple`)||(e.classList.remove(`ui-ripple`),e.offsetWidth,e.classList.add(`ui-ripple`),e.addEventListener(`animationend`,()=>e.classList.remove(`ui-ripple`),{once:!0}))}costomEvent(e){let t={detail:{id:e.id,value:e.value},bubbles:!0};this.dbug&&console.log(`CostomEvent:`,t.detail),e.dispatchEvent(new CustomEvent(`ui-button-group-change`,t))}},i=class{selectors;buttons=null;abortController=new AbortController;dbug;root;observer=null;rescanTimer=null;constructor(e={},t=!1,n={}){this.dbug=t,this.root=n.root??document;let r={main:`UIb`};this.selectors={...r,...e},this.scan(),n.observe&&this.observe()}observe(){let e=this.root===document?document.body:this.root;this.observer=new MutationObserver(()=>{this.rescanTimer===null&&(this.rescanTimer=window.setTimeout(()=>{this.rescanTimer=null,this.scan()},50))}),this.observer.observe(e,{childList:!0,subtree:!0})}setValue(e,t,n){e.dataset.value=t,e.tagName===`A`&&(e.href=t),n!==void 0&&(e.textContent=n),!e.closest(`.ui-no-flash`)&&(e.classList.remove(`UIb--flash`),e.offsetWidth,e.classList.add(`UIb--flash`),e.addEventListener(`animationend`,()=>e.classList.remove(`UIb--flash`),{once:!0}))}destroy(){this.observer?.disconnect(),this.observer=null,this.rescanTimer!==null&&(clearTimeout(this.rescanTimer),this.rescanTimer=null),this.abortController.abort(),this.buttons?.forEach(e=>delete e.dataset.uibBound),this.buttons=null,this.abortController=new AbortController}disableEl(e){e.tagName===`BUTTON`?e.disabled=!0:(e.setAttribute(`aria-disabled`,`true`),e.setAttribute(`tabindex`,`-1`))}enableEl(e){e.tagName===`BUTTON`?e.disabled=!1:(e.removeAttribute(`aria-disabled`),e.setAttribute(`tabindex`,`0`))}isDisabled(e){return e.tagName===`BUTTON`?e.disabled:e.getAttribute(`aria-disabled`)===`true`}setDisabled(e,t){e.setAttribute(`data-originally-disabled`,String(t)),t?this.disableEl(e):this.enableEl(e)}scan(){this.buttons=this.root.querySelectorAll(`.${this.selectors.main}`);let e=this.abortController.signal;this.buttons.forEach(t=>{t.dataset.uibBound||(t.dataset.uibBound=`1`,t.hasAttribute(`data-originally-disabled`)||t.setAttribute(`data-originally-disabled`,String(this.isDisabled(t))),t.getAttribute(`data-originally-disabled`)===`true`?this.disableEl(t):this.enableEl(t),t.addEventListener(`click`,e=>{if(this.isDisabled(t)){e.preventDefault(),e.stopImmediatePropagation();return}t.tagName===`A`&&e.preventDefault(),this.ripple(t),this.customEvent(t,String(t.dataset.value))},{signal:e}))})}ripple(e){e.closest(`.ui-no-ripple`)||(e.classList.remove(`UIb--ripple`),e.offsetWidth,e.classList.add(`UIb--ripple`),e.addEventListener(`animationend`,()=>e.classList.remove(`UIb--ripple`),{once:!0}))}customEvent(e,t){if(!t||t===`undefined`||t.trim()===``){console.warn(`Button data-value="" Not set!`);return}let n={detail:{id:e.id,value:t},bubbles:!0};this.dbug&&console.info(`Button CustomEvent:`,n.detail),e.dispatchEvent(new CustomEvent(`ui-button-change`,n))}},a=null,o=null,s=null,c=null,l=null;function u(...e){return a??=new i(...e)}function d(...e){return l??=new r(...e)}function f(...e){return o??=new n(...e)}function p(...t){return s??=new e(...t)}function m(...e){return c??=new t(...e)}function h(){a=null,o=null,s=null,c=null,l=null}exports.Button=i,exports.ButtonGroup=r,exports.Select=n,exports.SpinBox=e,exports.Switch=t,exports.getButtonGroupManager=d,exports.getButtonManager=u,exports.getSelectManager=f,exports.getSpinBoxManager=p,exports.getSwitchManager=m,exports.resetManagers=h;
package/dist/index.d.ts CHANGED
@@ -1,5 +1,17 @@
1
+ import { SpinBox } from './SpinBox';
2
+ import { Switch } from './Switch';
3
+ import { Select } from './Select';
4
+ import { Button } from './Button';
5
+ import { ButtonGroup } from './ButtonGroup';
1
6
  export { SpinBox } from './SpinBox';
2
7
  export { Switch } from './Switch';
3
8
  export { Select } from './Select';
4
9
  export { ButtonGroup } from './ButtonGroup';
5
10
  export { Button } from './Button';
11
+ export declare function getButtonManager(...args: ConstructorParameters<typeof Button>): Button;
12
+ export declare function getButtonGroupManager(...args: ConstructorParameters<typeof ButtonGroup>): ButtonGroup;
13
+ export declare function getSelectManager(...args: ConstructorParameters<typeof Select>): Select;
14
+ export declare function getSpinBoxManager(...args: ConstructorParameters<typeof SpinBox>): SpinBox;
15
+ export declare function getSwitchManager(...args: ConstructorParameters<typeof Switch>): Switch;
16
+ /** Drop the cached singletons so the next getXManager() builds a fresh one. */
17
+ export declare function resetManagers(): void;
package/dist/index.es.js CHANGED
@@ -1,27 +1,41 @@
1
1
  //#region src/SpinBox.ts
2
2
  var e = class {
3
3
  selectors;
4
- spinBoxes;
4
+ spinBoxes = null;
5
5
  abortController = new AbortController();
6
6
  dbug;
7
- constructor(e = {}, t = !1) {
8
- this.dbug = t;
9
- let n = {
7
+ root;
8
+ observer = null;
9
+ rescanTimer = null;
10
+ constructor(e = {}, t = !1, n = {}) {
11
+ this.dbug = t, this.root = n.root ?? document;
12
+ let r = {
10
13
  main: "UIsp",
11
14
  btn: "UIsp__btn",
12
15
  input: "UIsp__input",
13
16
  disabledBtn: "disabled"
14
17
  };
15
18
  this.selectors = {
16
- ...n,
19
+ ...r,
17
20
  ...e
18
- }, this.spinBoxes = document.querySelectorAll(`.${this.selectors.main}`), this.event();
21
+ }, this.scan(), n.observe && this.observe();
22
+ }
23
+ observe() {
24
+ let e = this.root === document ? document.body : this.root;
25
+ this.observer = new MutationObserver(() => {
26
+ this.rescanTimer === null && (this.rescanTimer = window.setTimeout(() => {
27
+ this.rescanTimer = null, this.scan();
28
+ }, 50));
29
+ }), this.observer.observe(e, {
30
+ childList: !0,
31
+ subtree: !0
32
+ });
19
33
  }
20
34
  state = (e, t, n, r = 0, i = 0) => {
21
35
  e == r || e < r ? (t.classList.add(this.selectors.disabledBtn), t.disabled = !0) : (t.classList.remove(this.selectors.disabledBtn), t.disabled = !1), i !== 0 && (e == i || e > i ? (n.classList.add(this.selectors.disabledBtn), n.disabled = !0) : (n.classList.remove(this.selectors.disabledBtn), n.disabled = !1));
22
36
  };
23
37
  destroy() {
24
- this.spinBoxes?.forEach((e) => this.disableEl(e)), this.abortController && this.abortController.abort(), this.spinBoxes = null;
38
+ this.observer?.disconnect(), this.observer = null, this.rescanTimer !== null && (clearTimeout(this.rescanTimer), this.rescanTimer = null), this.abortController.abort(), this.spinBoxes?.forEach((e) => delete e.dataset.uispBound), this.spinBoxes = null, this.abortController = new AbortController();
25
39
  }
26
40
  disableEl(e) {
27
41
  let t = e.querySelector(`.${this.selectors.input}`), n = e.querySelectorAll(`.${this.selectors.btn}`);
@@ -35,16 +49,18 @@ var e = class {
35
49
  this.dbug && console.warn("UISpinBox: input not found");
36
50
  return;
37
51
  }
38
- n.value = String(t), n.dispatchEvent(new Event("change"));
52
+ n.value = String(t), n.dispatchEvent(new Event("change")), !e.closest(".ui-no-flash") && (e.classList.remove("UIsp--flash"), e.offsetWidth, e.classList.add("UIsp--flash"), n.addEventListener("animationend", () => e.classList.remove("UIsp--flash"), { once: !0 }));
39
53
  }
40
54
  getValidDataNumber = (e, t) => {
41
55
  let n = e.getAttribute(`data-${t}`);
42
56
  return n === null || n.trim() === "" || isNaN(Number(n)) ? 0 : Number(n);
43
57
  };
44
- event() {
45
- this.abortController = new AbortController();
58
+ scan() {
59
+ this.spinBoxes = this.root.querySelectorAll(`.${this.selectors.main}`);
46
60
  let e = this.abortController.signal;
47
- this.spinBoxes?.forEach((t) => {
61
+ this.spinBoxes.forEach((t) => {
62
+ if (t.dataset.uispBound) return;
63
+ t.dataset.uispBound = "1";
48
64
  let n, r = t.querySelectorAll(`.${this.selectors.btn}`), i = t.querySelector(`.${this.selectors.input}`);
49
65
  this.dbug && (r || console.log(`Buttons (${this.selectors.btn}) not found in container`), i || console.log(`Input (${this.selectors.input}) not found in container`));
50
66
  let a = r[0], o = r[1];
@@ -87,10 +103,10 @@ var e = class {
87
103
  o.addEventListener(t, m, { signal: e });
88
104
  }), o.addEventListener("click", (e) => {
89
105
  let t = e.shiftKey ? 3 : 1;
90
- d === null && (n = f(1, t), this.costomEvent(i, n));
106
+ d === null && (n = f(1, t), this.ripple(o), this.costomEvent(i, n));
91
107
  }, { signal: e }), a.addEventListener("click", (e) => {
92
108
  let t = e.shiftKey ? 3 : 1;
93
- d === null && (n = f(-1, t), this.costomEvent(i, n));
109
+ d === null && (n = f(-1, t), this.ripple(a), this.costomEvent(i, n));
94
110
  }, { signal: e }), a.addEventListener("mousedown", (e) => {
95
111
  let t = e.shiftKey ? 3 : 1;
96
112
  p(() => f(-1, t), 100);
@@ -140,6 +156,9 @@ var e = class {
140
156
  }, { signal: e });
141
157
  });
142
158
  }
159
+ ripple(e) {
160
+ e.closest(".ui-no-ripple") || (e.classList.remove("ui-ripple"), e.offsetWidth, e.classList.add("ui-ripple"), e.addEventListener("animationend", () => e.classList.remove("ui-ripple"), { once: !0 }));
161
+ }
143
162
  costomEvent(e, t) {
144
163
  let n = {
145
164
  detail: {
@@ -155,27 +174,40 @@ var e = class {
155
174
  main = null;
156
175
  abortController = new AbortController();
157
176
  dbug;
158
- constructor(e = {}, t = !1) {
159
- this.dbug = t;
160
- let n = {
177
+ root;
178
+ observer = null;
179
+ rescanTimer = null;
180
+ constructor(e = {}, t = !1, n = {}) {
181
+ this.dbug = t, this.root = n.root ?? document;
182
+ let r = {
161
183
  main: "UIsw",
162
184
  label: "UIsw-label"
163
185
  };
164
186
  this.selectors = {
165
- ...n,
187
+ ...r,
166
188
  ...e
167
- }, this.main = document.querySelectorAll(`.${this.selectors.main}`), this.event();
189
+ }, this.scan(), n.observe && this.observe();
190
+ }
191
+ observe() {
192
+ let e = this.root === document ? document.body : this.root;
193
+ this.observer = new MutationObserver(() => {
194
+ this.rescanTimer === null && (this.rescanTimer = window.setTimeout(() => {
195
+ this.rescanTimer = null, this.scan();
196
+ }, 50));
197
+ }), this.observer.observe(e, {
198
+ childList: !0,
199
+ subtree: !0
200
+ });
168
201
  }
169
202
  destroy() {
170
- this.main?.forEach((e) => this.disableEl(e)), this.abortController && this.abortController.abort(), this.main = null;
203
+ this.observer?.disconnect(), this.observer = null, this.rescanTimer !== null && (clearTimeout(this.rescanTimer), this.rescanTimer = null), this.abortController.abort(), this.main?.forEach((e) => delete e.dataset.uiswBound), this.main = null, this.abortController = new AbortController();
171
204
  }
172
- disableEl(e) {
173
- e.setAttribute("tabindex", "-1"), e.setAttribute("aria-disabled", "true");
174
- }
175
- event() {
176
- this.abortController = new AbortController();
205
+ scan() {
206
+ this.main = this.root.querySelectorAll(`.${this.selectors.main}`);
177
207
  let e = this.abortController.signal;
178
- this.main?.forEach((t) => {
208
+ this.main.forEach((t) => {
209
+ if (t.dataset.uiswBound) return;
210
+ t.dataset.uiswBound = "1";
179
211
  let n = t.querySelector(`.${this.selectors.label}`), r = t.querySelector("input");
180
212
  n && n.id && t.setAttribute("aria-labelledby", n.id), t.hasAttribute("data-originally-disabled") || t.setAttribute("data-originally-disabled", String(r?.disabled ?? !1));
181
213
  let i = t.getAttribute("data-originally-disabled") === "true";
@@ -188,8 +220,10 @@ var e = class {
188
220
  t.setAttribute("aria-checked", String(r.checked)), this.customEvent(r, String(r.checked));
189
221
  }, { signal: e }), t.addEventListener("click", (e) => {
190
222
  if (e.target.tagName === "INPUT") return;
191
- let t = e.target.closest("label");
192
- t || (r.checked = !r.checked), t || r.dispatchEvent(new Event("change"));
223
+ let n = e.target.closest("label");
224
+ n || (r.checked = !r.checked), n || r.dispatchEvent(new Event("change"));
225
+ let i = t.querySelector(".UIsw-slider");
226
+ i && this.ripple(i);
193
227
  }, { signal: e }), t.addEventListener("keydown", (e) => {
194
228
  let n = t.querySelector("input");
195
229
  e.key === "ArrowRight" ? (r.checked = !0, t.setAttribute("aria-checked", String(r.checked)), e.preventDefault(), this.customEvent(n, "true")) : e.key === "ArrowLeft" && (r.checked = !1, t.setAttribute("aria-checked", String(r.checked)), e.preventDefault(), this.customEvent(n, "false"));
@@ -199,9 +233,16 @@ var e = class {
199
233
  setValue(e, t) {
200
234
  this.main?.forEach((n) => {
201
235
  let r = n.querySelector(`input#${e}`);
202
- r && (r.checked = t, this.dbug && console.log("SetValue:", r.checked), n.setAttribute("aria-checked", String(t)), this.customEvent(r, String(t)));
236
+ if (r) {
237
+ r.checked = t, this.dbug && console.log("SetValue:", r.checked), n.setAttribute("aria-checked", String(t)), this.customEvent(r, String(t));
238
+ let e = n.querySelector(".UIsw-slider");
239
+ e && !n.closest(".ui-no-flash") && (n.classList.remove("UIsw--flash"), n.offsetWidth, n.classList.add("UIsw--flash"), e.addEventListener("animationend", () => n.classList.remove("UIsw--flash"), { once: !0 }));
240
+ }
203
241
  });
204
242
  }
243
+ ripple(e) {
244
+ e.closest(".ui-no-ripple") || (e.classList.remove("ui-ripple"), e.offsetWidth, e.classList.add("ui-ripple"), e.addEventListener("animationend", () => e.classList.remove("ui-ripple"), { once: !0 }));
245
+ }
205
246
  customEvent(e, t) {
206
247
  let n = {
207
248
  detail: {
@@ -218,10 +259,13 @@ var e = class {
218
259
  itemArrowInitialized = /* @__PURE__ */ new WeakSet();
219
260
  abortController = new AbortController();
220
261
  dbug;
262
+ root;
263
+ observer = null;
264
+ rescanTimer = null;
221
265
  selectMap = /* @__PURE__ */ new Map();
222
- constructor(e = {}, t = !1) {
223
- this.dbug = t;
224
- let n = {
266
+ constructor(e = {}, t = !1, n = {}) {
267
+ this.dbug = t, this.root = n.root ?? document;
268
+ let r = {
225
269
  idPrefix: "UI-option-",
226
270
  main: "UIselect",
227
271
  selected: "UIselect-selected",
@@ -229,13 +273,24 @@ var e = class {
229
273
  optionsList: "UIselect-options",
230
274
  search: "UIselect-options__search",
231
275
  items: "UIselect-options__items",
232
- flash: "UIFlash",
276
+ flash: "UIselect--flash",
233
277
  excludedItems: ["divider", "test"]
234
278
  };
235
279
  this.selectors = {
236
- ...n,
280
+ ...r,
237
281
  ...e
238
- }, this.main = document.querySelectorAll(`.${this.selectors.main}`), this.event(), this.initGlobalListener(this.selectors);
282
+ }, this.scan(), this.initGlobalListener(this.selectors), n.observe && this.observe();
283
+ }
284
+ observe() {
285
+ let e = this.root === document ? document.body : this.root;
286
+ this.observer = new MutationObserver(() => {
287
+ this.rescanTimer === null && (this.rescanTimer = window.setTimeout(() => {
288
+ this.rescanTimer = null, this.scan();
289
+ }, 50));
290
+ }), this.observer.observe(e, {
291
+ childList: !0,
292
+ subtree: !0
293
+ });
239
294
  }
240
295
  filterExcluded(e, t) {
241
296
  return Array.from(e).filter((e) => !t.some((t) => typeof t == "string" ? e.classList.contains(t) || e.id === t : e === t));
@@ -248,7 +303,7 @@ var e = class {
248
303
  });
249
304
  }
250
305
  destroy() {
251
- this.main?.forEach((e) => this.disableEl(e)), e.closeAll(this.selectors), this.abortController && (this.abortController.abort(), this.selectMap.clear()), this.main = null;
306
+ this.observer?.disconnect(), this.observer = null, this.rescanTimer !== null && (clearTimeout(this.rescanTimer), this.rescanTimer = null), e.closeAll(this.selectors), this.abortController.abort(), this.main?.forEach((e) => delete e.dataset.uiselBound), this.selectMap.clear(), this.itemArrowInitialized = /* @__PURE__ */ new WeakSet(), this.main = null, this.abortController = new AbortController();
252
307
  }
253
308
  disableEl(e) {
254
309
  e.setAttribute("tabindex", "-1"), e.setAttribute("aria-disabled", "true");
@@ -266,18 +321,20 @@ var e = class {
266
321
  this.dbug && console.warn(`UISelect: value "${t}" not found`);
267
322
  return;
268
323
  }
269
- s.forEach((e) => e.removeAttribute("aria-selected")), c.setAttribute("aria-selected", "true"), i.textContent = c.textContent ?? "", r.value = String(t), r.setAttribute("value", String(t)), e.setAttribute("aria-activedescendant", c.id || `${this.selectors.idPrefix}${s.indexOf(c)}`), this.customEvent(e, String(t)), e.classList.remove(this.selectors.flash), e.offsetWidth, e.classList.add(this.selectors.flash), e.addEventListener("animationend", () => e.classList.remove(this.selectors.flash), { once: !0 });
324
+ s.forEach((e) => e.removeAttribute("aria-selected")), c.setAttribute("aria-selected", "true"), i.textContent = c.textContent ?? "", r.value = String(t), r.setAttribute("value", String(t)), e.setAttribute("aria-activedescendant", c.id || `${this.selectors.idPrefix}${s.indexOf(c)}`), this.customEvent(e, String(t)), e.closest(".ui-no-flash") || (e.classList.remove(this.selectors.flash), e.offsetWidth, e.classList.add(this.selectors.flash), e.addEventListener("animationend", () => e.classList.remove(this.selectors.flash), { once: !0 }));
270
325
  }
271
- event() {
272
- this.abortController = new AbortController();
326
+ scan() {
327
+ this.main = this.root.querySelectorAll(`.${this.selectors.main}`);
273
328
  let e = this.abortController.signal;
274
- this.main?.forEach((t) => {
329
+ this.main.forEach((t) => {
330
+ if (t.dataset.uiselBound) return;
275
331
  let n = t.querySelector(`.${this.selectors.main} input[type='hidden']`);
276
332
  try {
277
333
  if (!n) throw Error("<input type=\"hidden\" name=\"YouUniqueId\">");
278
334
  } catch (e) {
279
335
  return console.warn("Not found:", e.message);
280
336
  }
337
+ t.dataset.uiselBound = "1";
281
338
  let r = t.querySelector(`.${this.selectors.selected}`), i = t.querySelector(`.${this.selectors.arrow}`), a = t.querySelector(`.${this.selectors.optionsList}`), o = t.querySelector(`.${this.selectors.search} input`);
282
339
  if (t.setAttribute("tabindex", "0"), t.removeAttribute("aria-disabled"), t.hasAttribute("data-disabled")) {
283
340
  this.disableEl(t), t.addEventListener("click", (e) => {
@@ -386,25 +443,34 @@ var e = class {
386
443
  main = null;
387
444
  abortController = new AbortController();
388
445
  dbug;
389
- constructor(e = {}, t = !1) {
390
- this.dbug = t;
391
- let n = {
446
+ root;
447
+ observer = null;
448
+ rescanTimer = null;
449
+ constructor(e = {}, t = !1, n = {}) {
450
+ this.dbug = t, this.root = n.root ?? document;
451
+ let r = {
392
452
  main: "UIbg",
393
453
  btn: "UIbg-btn",
394
454
  input: "UIbg-input"
395
455
  };
396
456
  this.selectors = {
397
- ...n,
457
+ ...r,
398
458
  ...e
399
- }, this.main = document.querySelectorAll(`.${this.selectors.main}`), this.#e();
459
+ }, this.scan(), n.observe && this.observe();
460
+ }
461
+ observe() {
462
+ let e = this.root === document ? document.body : this.root;
463
+ this.observer = new MutationObserver(() => {
464
+ this.rescanTimer === null && (this.rescanTimer = window.setTimeout(() => {
465
+ this.rescanTimer = null, this.scan();
466
+ }, 50));
467
+ }), this.observer.observe(e, {
468
+ childList: !0,
469
+ subtree: !0
470
+ });
400
471
  }
401
472
  destroy() {
402
- this.main?.forEach((e) => this.disableEl(e)), this.abortController && this.abortController.abort(), this.main = null;
403
- }
404
- disableEl(e) {
405
- e.querySelectorAll(`.${this.selectors.btn}`).forEach((e) => {
406
- e.setAttribute("aria-disabled", "true");
407
- }), e.setAttribute("aria-disabled", "true");
473
+ this.observer?.disconnect(), this.observer = null, this.rescanTimer !== null && (clearTimeout(this.rescanTimer), this.rescanTimer = null), this.abortController.abort(), this.main?.forEach((e) => delete e.dataset.uibgBound), this.main = null, this.abortController = new AbortController();
408
474
  }
409
475
  setValue(e, t) {
410
476
  let n = e.querySelectorAll(`.${this.selectors.input}`), r = e.querySelectorAll(`.${this.selectors.btn}`), i = Array.from(n).findIndex((e) => e.value === t && !e.disabled);
@@ -417,12 +483,15 @@ var e = class {
417
483
  }), r.forEach((e, t) => {
418
484
  e.setAttribute("aria-checked", String(t === i)), e.setAttribute("tabindex", t === i ? "0" : "-1");
419
485
  }), this.costomEvent(n[i]);
486
+ let a = r[i];
487
+ a && !e.closest(".ui-no-flash") && (a.classList.remove("UIbg--flash"), a.offsetWidth, a.classList.add("UIbg--flash"), a.addEventListener("animationend", () => a.classList.remove("UIbg--flash"), { once: !0 }));
420
488
  }
421
- #e() {
422
- this.abortController = new AbortController();
489
+ scan() {
490
+ this.main = this.root.querySelectorAll(`.${this.selectors.main}`);
423
491
  let e = this.abortController.signal;
424
- this.main?.forEach((t) => {
425
- t.querySelectorAll(`.${this.selectors.input}`).forEach((e) => {
492
+ this.main.forEach((t) => {
493
+ if (t.dataset.uibgBound) return;
494
+ t.dataset.uibgBound = "1", t.querySelectorAll(`.${this.selectors.input}`).forEach((e) => {
426
495
  e.hasAttribute("data-originally-disabled") || e.setAttribute("data-originally-disabled", String(e.disabled)), e.disabled = e.getAttribute("data-originally-disabled") === "true";
427
496
  }), t.removeAttribute("aria-disabled");
428
497
  let n = t.querySelector(`.${this.selectors.input}:checked`);
@@ -432,7 +501,7 @@ var e = class {
432
501
  t.addEventListener("click", () => {
433
502
  r.forEach((e) => {
434
503
  e.setAttribute("aria-checked", "false"), e.setAttribute("tabindex", "-1");
435
- }), t.setAttribute("aria-checked", "true"), t.setAttribute("tabindex", "0"), t.focus();
504
+ }), t.setAttribute("aria-checked", "true"), t.setAttribute("tabindex", "0"), t.focus(), this.#e(t);
436
505
  }, { signal: e }), t.addEventListener("keydown", (e) => {
437
506
  let n = Array.from(r).indexOf(t);
438
507
  if (e.key === "ArrowRight" && n++, e.key === "ArrowLeft" && n--, n < 0 && (n = r.length - 1), n >= r.length && (n = 0), e.key === "Enter") {
@@ -463,6 +532,9 @@ var e = class {
463
532
  }
464
533
  });
465
534
  }
535
+ #e(e) {
536
+ e.closest(".ui-no-ripple") || (e.classList.remove("ui-ripple"), e.offsetWidth, e.classList.add("ui-ripple"), e.addEventListener("animationend", () => e.classList.remove("ui-ripple"), { once: !0 }));
537
+ }
466
538
  costomEvent(e) {
467
539
  let t = {
468
540
  detail: {
@@ -478,19 +550,33 @@ var e = class {
478
550
  buttons = null;
479
551
  abortController = new AbortController();
480
552
  dbug;
481
- constructor(e = {}, t = !1) {
482
- this.dbug = t;
483
- let n = { main: "UIb" };
553
+ root;
554
+ observer = null;
555
+ rescanTimer = null;
556
+ constructor(e = {}, t = !1, n = {}) {
557
+ this.dbug = t, this.root = n.root ?? document;
558
+ let r = { main: "UIb" };
484
559
  this.selectors = {
485
- ...n,
560
+ ...r,
486
561
  ...e
487
- }, this.buttons = document.querySelectorAll(`.${this.selectors.main}`), this.#e();
562
+ }, this.scan(), n.observe && this.observe();
563
+ }
564
+ observe() {
565
+ let e = this.root === document ? document.body : this.root;
566
+ this.observer = new MutationObserver(() => {
567
+ this.rescanTimer === null && (this.rescanTimer = window.setTimeout(() => {
568
+ this.rescanTimer = null, this.scan();
569
+ }, 50));
570
+ }), this.observer.observe(e, {
571
+ childList: !0,
572
+ subtree: !0
573
+ });
488
574
  }
489
575
  setValue(e, t, n) {
490
- e.dataset.value = t, e.tagName === "A" && (e.href = t), n !== void 0 && (e.textContent = n), e.classList.remove("UIb--flash"), e.offsetWidth, e.classList.add("UIb--flash"), e.addEventListener("animationend", () => e.classList.remove("UIb--flash"), { once: !0 });
576
+ e.dataset.value = t, e.tagName === "A" && (e.href = t), n !== void 0 && (e.textContent = n), !e.closest(".ui-no-flash") && (e.classList.remove("UIb--flash"), e.offsetWidth, e.classList.add("UIb--flash"), e.addEventListener("animationend", () => e.classList.remove("UIb--flash"), { once: !0 }));
491
577
  }
492
578
  destroy() {
493
- this.buttons?.forEach((e) => this.disableEl(e)), this.abortController && this.abortController.abort(), this.buttons = null;
579
+ this.observer?.disconnect(), this.observer = null, this.rescanTimer !== null && (clearTimeout(this.rescanTimer), this.rescanTimer = null), this.abortController.abort(), this.buttons?.forEach((e) => delete e.dataset.uibBound), this.buttons = null, this.abortController = new AbortController();
494
580
  }
495
581
  disableEl(e) {
496
582
  e.tagName === "BUTTON" ? e.disabled = !0 : (e.setAttribute("aria-disabled", "true"), e.setAttribute("tabindex", "-1"));
@@ -504,21 +590,21 @@ var e = class {
504
590
  setDisabled(e, t) {
505
591
  e.setAttribute("data-originally-disabled", String(t)), t ? this.disableEl(e) : this.enableEl(e);
506
592
  }
507
- #e() {
508
- this.abortController = new AbortController();
593
+ scan() {
594
+ this.buttons = this.root.querySelectorAll(`.${this.selectors.main}`);
509
595
  let e = this.abortController.signal;
510
- this.buttons?.forEach((t) => {
511
- t.hasAttribute("data-originally-disabled") || t.setAttribute("data-originally-disabled", String(this.isDisabled(t))), t.getAttribute("data-originally-disabled") === "true" ? this.disableEl(t) : this.enableEl(t), t.addEventListener("click", (e) => {
596
+ this.buttons.forEach((t) => {
597
+ t.dataset.uibBound || (t.dataset.uibBound = "1", t.hasAttribute("data-originally-disabled") || t.setAttribute("data-originally-disabled", String(this.isDisabled(t))), t.getAttribute("data-originally-disabled") === "true" ? this.disableEl(t) : this.enableEl(t), t.addEventListener("click", (e) => {
512
598
  if (this.isDisabled(t)) {
513
599
  e.preventDefault(), e.stopImmediatePropagation();
514
600
  return;
515
601
  }
516
602
  t.tagName === "A" && e.preventDefault(), this.ripple(t), this.customEvent(t, String(t.dataset.value));
517
- }, { signal: e });
603
+ }, { signal: e }));
518
604
  });
519
605
  }
520
606
  ripple(e) {
521
- e.classList.remove("UIb--ripple"), e.offsetWidth, e.classList.add("UIb--ripple"), e.addEventListener("animationend", () => e.classList.remove("UIb--ripple"), { once: !0 });
607
+ e.closest(".ui-no-ripple") || (e.classList.remove("UIb--ripple"), e.offsetWidth, e.classList.add("UIb--ripple"), e.addEventListener("animationend", () => e.classList.remove("UIb--ripple"), { once: !0 }));
522
608
  }
523
609
  customEvent(e, t) {
524
610
  if (!t || t === "undefined" || t.trim() === "") {
@@ -534,6 +620,24 @@ var e = class {
534
620
  };
535
621
  this.dbug && console.info("Button CustomEvent:", n.detail), e.dispatchEvent(new CustomEvent("ui-button-change", n));
536
622
  }
537
- };
623
+ }, a = null, o = null, s = null, c = null, l = null;
624
+ function u(...e) {
625
+ return a ??= new i(...e);
626
+ }
627
+ function d(...e) {
628
+ return l ??= new r(...e);
629
+ }
630
+ function f(...e) {
631
+ return o ??= new n(...e);
632
+ }
633
+ function p(...t) {
634
+ return s ??= new e(...t);
635
+ }
636
+ function m(...e) {
637
+ return c ??= new t(...e);
638
+ }
639
+ function h() {
640
+ a = null, o = null, s = null, c = null, l = null;
641
+ }
538
642
  //#endregion
539
- export { i as Button, r as ButtonGroup, n as Select, e as SpinBox, t as Switch };
643
+ export { i as Button, r as ButtonGroup, n as Select, e as SpinBox, t as Switch, d as getButtonGroupManager, u as getButtonManager, f as getSelectManager, p as getSpinBoxManager, m as getSwitchManager, h as resetManagers };