monobill-mintui 0.6.633 → 0.6.635

package/dist/components/time-picker/browser.js

@@ -21,7 +21,7 @@ import "../chunks/icon-BWUYe89V.js";
 import { t as e } from "../chunks/register-element-BFYmIynH.js";
 import "../chunks/text-Bmfl6CxJ.js";
 import "../chunks/input-Dwrs8tJH.js";
-import "../chunks/popover-gviDCspV.js";
+import "../chunks/popover-CYM_34P9.js";
 //#region src/components/time-picker/TimePicker.ts
 var t = class extends HTMLElement {
 	constructor(...e) {

package/dist/components/time-picker/index.cjs

@@ -1 +1 @@
-require(`../chunks/icon-B_7c8b8e.js`);const e=require(`../chunks/register-element-tCL_F1YI.js`);require(`../chunks/text-Cpl5ljSe.js`),require(`../chunks/input-lLl8cB6r.js`),require(`../chunks/popover-BeaGf_JC.js`);var t=class extends HTMLElement{constructor(...e){super(...e),this._triggerId=`mint-time-picker-trigger-${Math.random().toString(36).slice(2,10)}`,this._popover=null,this._popoverObserver=null,this._inputEl=null,this._hiddenInput=null,this._single={hour:9,minute:0,second:0,meridiem:`AM`},this._rangeStart={hour:9,minute:0,second:0,meridiem:`AM`},this._rangeEnd={hour:5,minute:0,second:0,meridiem:`PM`},this._invalidFromInput=!1}static get observedAttributes(){return[`value`,`label`,`info`,`disabled`,`id`,`name`,`required`,`readonly`,`range`,`hours`,`minutes`,`seconds`,`error`,`error-message`]}connectedCallback(){this.classList.add(`mint-time-picker-host`),this._parseAndApplyValue(this.getAttribute(`value`)||``),this.render()}disconnectedCallback(){this._popoverObserver&&=(this._popoverObserver.disconnect(),null)}attributeChangedCallback(e,t,n){if(t!==n){if(e===`value`){if(this._parseAndApplyValue(n||``),this._syncHiddenInput(),this._syncInputValue(),this._popover){let e=this._popover.querySelector(`[data-mint-time-picker-body="true"]`);e&&this._buildPopoverContent(e)}return}e!==`error`&&e!==`error-message`&&(this._invalidFromInput=!1),this.render()}}get value(){return this.getValue()}set value(e){this.setValue(e||``)}getValue(){return this.getAttribute(`value`)||``}setValue(e){e?this.setAttribute(`value`,e):this.removeAttribute(`value`),this._parseAndApplyValue(e||``),this._syncHiddenInput(),this._syncInputValue()}isRange(){return this.getAttribute(`range`)===`true`}isHoursEnabled(){let e=this.getAttribute(`hours`);return e===null?!0:e!==`false`}isMinutesEnabled(){let e=this.getAttribute(`minutes`);return e===null?!0:e!==`false`}isSecondsEnabled(){let e=this.getAttribute(`seconds`);return e===null?!1:e!==`false`}isDisabled(){return this.getAttribute(`disabled`)===`true`}isReadonly(){return this.getAttribute(`readonly`)===`true`}isRequired(){return this.getAttribute(`required`)===`true`}hasExternalError(){return this.getAttribute(`error`)===`true`}getExternalErrorMessage(){return this.getAttribute(`error-message`)||``}getLabel(){return this.getAttribute(`label`)||``}getInfo(){return this.getAttribute(`info`)||``}getName(){return this.getAttribute(`name`)||``}_getEffectiveError(){return{hasError:this.hasExternalError(),message:this.getExternalErrorMessage()}}_formatParts(e){let t=this.isHoursEnabled(),n=this.isMinutesEnabled(),r=this.isSecondsEnabled(),i=[];return t&&i.push(e.hour.toString()),n&&i.push(e.minute.toString().padStart(2,`0`)),r&&i.push(e.second.toString().padStart(2,`0`)),t?`${i.join(`:`)} ${e.meridiem.toLowerCase()}`:i.join(`:`)}_to24Hour(e){let t=e.hour%12;return e.meridiem===`PM`&&(t+=12),{hour:t,minute:e.minute,second:e.second}}_formatParts24(e){let t=this.isHoursEnabled(),n=this.isMinutesEnabled(),r=this.isSecondsEnabled(),i=this._to24Hour(e),a=[];return t&&a.push(i.hour.toString().padStart(2,`0`)),n&&a.push(i.minute.toString().padStart(2,`0`)),r&&a.push(i.second.toString().padStart(2,`0`)),a.join(`:`)}_getDisplayValue(){return this.isRange()?`${this._formatParts(this._rangeStart)} - ${this._formatParts(this._rangeEnd)}`:this._formatParts(this._single)}_getOutputValue(){return this.isRange()?`${this._formatParts24(this._rangeStart)} - ${this._formatParts24(this._rangeEnd)}`:this._formatParts24(this._single)}_getExpectedFormat(){let e=this.isHoursEnabled(),t=this.isMinutesEnabled(),n=this.isSecondsEnabled(),r=[];e&&r.push(`h`),t&&r.push(`mm`),n&&r.push(`ss`);let i=e?`${r.join(`:`)} am/pm`:r.join(`:`);return this.isRange()?`${i} - ${i}`:i}_syncHiddenInput(){this._hiddenInput&&(this._hiddenInput.value=this.getValue()||this._getOutputValue())}_syncInputValue(){this._inputEl&&(this._inputEl.value=this._getDisplayValue(),typeof this._inputEl.render==`function`&&this._inputEl.render())}_emitChangeFromPicker(){let e=this._getOutputValue();this._invalidFromInput=!1,this.setAttribute(`value`,e),this._syncHiddenInput(),this._syncInputValue(),this.dispatchEvent(new Event(`input`,{bubbles:!0,composed:!0})),this.dispatchEvent(new Event(`change`,{bubbles:!0}))}_parseSingle(e){let t=this.isHoursEnabled(),n=this.isMinutesEnabled(),r=this.isSecondsEnabled(),i=e.trim();if(t){let e=i.match(/^(\d{1,2})(?::(\d{2}))?(?::(\d{2}))?\s*(am|pm)$/i);if(!e)return null;let t=Number(e[1]),a=Number(e[2]??0),o=Number(e[3]??0),s=e[4].toUpperCase();return t<1||t>12||n&&(a<0||a>59)||r&&(o<0||o>59)?null:{hour:t,minute:a,second:o,meridiem:s}}let a=i.match(/^(\d{2})(?::(\d{2}))?$/);if(!a)return null;let o=Number(a[1]),s=Number(a[2]??0);return n&&(o<0||o>59)||r&&(s<0||s>59)?null:{hour:12,minute:o,second:s,meridiem:`AM`}}_parseSingleOutput24(e){let t=this.isHoursEnabled(),n=this.isMinutesEnabled(),r=this.isSecondsEnabled(),i=e.trim();if(t){let e=i.match(/^(\d{2})(?::(\d{2}))?(?::(\d{2}))?$/);if(!e)return null;let t=Number(e[1]),a=Number(e[2]??0),o=Number(e[3]??0);if(t<0||t>23||n&&(a<0||a>59)||r&&(o<0||o>59))return null;let s=t>=12?`PM`:`AM`;return{hour:t%12==0?12:t%12,minute:a,second:o,meridiem:s}}let a=i.match(/^(\d{2})(?::(\d{2}))?$/);if(!a)return null;let o=Number(a[1]),s=Number(a[2]??0);return n&&(o<0||o>59)||r&&(s<0||s>59)?null:{hour:12,minute:o,second:s,meridiem:`AM`}}_parseAndApplyValue(e){if(!e)return!1;if(this.isRange()){let[t,n]=e.split(`-`).map(e=>e.trim()),r=this._parseSingleOutput24(t||``),i=this._parseSingleOutput24(n||``);return!r||!i?!1:(this._rangeStart=r,this._rangeEnd=i,!0)}let t=this._parseSingleOutput24(e);return t?(this._single=t,!0):!1}_parseAndApplyDisplayValue(e){if(!e)return!1;if(this.isRange()){let[t,n]=e.split(`-`).map(e=>e.trim()),r=this._parseSingle(t||``),i=this._parseSingle(n||``);return!r||!i?!1:(this._rangeStart=r,this._rangeEnd=i,!0)}let t=this._parseSingle(e);return t?(this._single=t,!0):!1}_handleTypedValue(e){let t=e.trim();if(!t){this._invalidFromInput=!1,this.removeAttribute(`value`),this._syncHiddenInput(),this._syncInputValue();return}if(!this._parseAndApplyDisplayValue(t)){this._invalidFromInput=!0,this.removeAttribute(`value`),this._inputEl&&(this._inputEl.value=``),this._syncHiddenInput(),this.render(),this.dispatchEvent(new Event(`input`,{bubbles:!0,composed:!0})),this.dispatchEvent(new Event(`change`,{bubbles:!0}));return}this._invalidFromInput=!1;let n=this._getOutputValue();this.setAttribute(`value`,n),this._syncHiddenInput(),this._syncInputValue(),this.dispatchEvent(new Event(`input`,{bubbles:!0,composed:!0})),this.dispatchEvent(new Event(`change`,{bubbles:!0}))}_buildColumn(e,t,n,r=!0,i=`standard`,a=`Time`){let o=document.createElement(`div`);return o.className=`mint-time-picker-column mint-time-picker-column-${i}${r?` mint-time-picker-column-divider`:``}`,o.setAttribute(`role`,`group`),o.setAttribute(`aria-label`,a),e.forEach(e=>{let r=document.createElement(`button`);r.type=`button`;let i=e===t;r.className=`mint-time-picker-option${i?` is-selected`:``}`,r.dataset.selected=i?`true`:`false`,r.setAttribute(`aria-pressed`,String(i)),r.setAttribute(`aria-label`,`${a}: ${e}`),r.textContent=e,r.addEventListener(`click`,()=>n(e)),o.appendChild(r)}),o}_centerSelectedInColumn(e,t=0){let n=e.querySelector(`button[data-selected="true"]`);if(!n)return;let r=n.offsetTop-(e.clientHeight/2-n.clientHeight/2)-t;e.scrollTop=Math.max(0,r)}_centerAllColumnsInPopoverBody(){if(!this._popover)return;let e=this._popover.querySelector(`[data-mint-time-picker-body="true"]`);if(!e)return;let t=Array.from(e.querySelectorAll(`.mint-time-picker-column`)),n=this.isRange()?20:0;t.forEach(e=>this._centerSelectedInColumn(e,n))}_setupPopoverOpenObserver(){this._popover&&(this._popoverObserver&&=(this._popoverObserver.disconnect(),null),this._popoverObserver=new MutationObserver(()=>{this._popover?.getAttribute(`open`)===`true`&&requestAnimationFrame(()=>{requestAnimationFrame(()=>{this._centerAllColumnsInPopoverBody()})})}),this._popoverObserver.observe(this._popover,{attributes:!0,attributeFilter:[`open`]}))}_buildPickerSet(e,t,n){let r=this.isHoursEnabled(),i=this.isMinutesEnabled(),a=this.isSecondsEnabled(),o=document.createElement(`div`),s=(r?1:0)+(i?1:0)+(a?1:0)+(r?1:0);o.className=`mint-time-picker-wheel`,o.style.gridTemplateColumns=`repeat(${Math.max(s,1)}, minmax(0, 1fr))`;let c=Array.from({length:12},(e,t)=>(t+1).toString().padStart(2,`0`)),l=Array.from({length:60},(e,t)=>t.toString().padStart(2,`0`)),u=Array.from({length:60},(e,t)=>t.toString().padStart(2,`0`)),d=[`AM`,`PM`],f=[];r&&f.push(this._buildColumn(c,t.hour.toString().padStart(2,`0`),e=>{n({...t,hour:Number(e)})},!0,`tall`,`Hour`)),i&&f.push(this._buildColumn(l,t.minute.toString().padStart(2,`0`),e=>{n({...t,minute:Number(e)})},!0,`tall`,`Minute`)),a&&f.push(this._buildColumn(u,t.second.toString().padStart(2,`0`),e=>{n({...t,second:Number(e)})},!0,`tall`,`Second`)),r&&f.push(this._buildColumn(d,t.meridiem,e=>{n({...t,meridiem:e})},!0,`compact`,`Meridiem`)),f.forEach((e,t)=>{t===f.length-1&&e.classList.remove(`mint-time-picker-column-divider`),o.appendChild(e)}),e.appendChild(o)}_buildPopoverContent(e){if(e.innerHTML=``,!this.isRange()){this._buildPickerSet(e,this._single,t=>{this._single=t,this._emitChangeFromPicker(),this._buildPopoverContent(e)});return}let t=document.createElement(`div`);t.className=`mint-time-picker-range`;let n=document.createElement(`div`),r=document.createElement(`mint-text`);r.setAttribute(`variant`,`muted`),r.className=`mint-time-picker-range-label`,r.textContent=`Start`,n.appendChild(r),this._buildPickerSet(n,this._rangeStart,t=>{this._rangeStart=t,this._emitChangeFromPicker(),this._buildPopoverContent(e)});let i=document.createElement(`div`),a=document.createElement(`mint-text`);a.setAttribute(`variant`,`muted`),a.className=`mint-time-picker-range-label`,a.textContent=`End`,i.appendChild(a),this._buildPickerSet(i,this._rangeEnd,t=>{this._rangeEnd=t,this._emitChangeFromPicker(),this._buildPopoverContent(e)}),t.appendChild(n),t.appendChild(i),e.appendChild(t),requestAnimationFrame(()=>{this._centerAllColumnsInPopoverBody()})}render(){let e=this.isDisabled(),t=this.isReadonly(),n=this._getEffectiveError();this.innerHTML=``;let r=document.createElement(`div`);r.className=`mint-time-picker-control`,this._inputEl=document.createElement(`mint-input`),this._inputEl.id=this._triggerId,this._inputEl.classList.add(`mint-time-picker-trigger`),this._inputEl.setAttribute(`type`,`text`),this._inputEl.setAttribute(`icon`,`clock`),this._inputEl.setAttribute(`placeholder`,this._getExpectedFormat()),this._inputEl.setAttribute(`label`,this.getLabel()),this._inputEl.setAttribute(`info`,this.getInfo()),this._inputEl.setAttribute(`value`,this._getDisplayValue()),this._inputEl.setAttribute(`error`,n.hasError?`true`:`false`),this._inputEl.setAttribute(`error-message`,n.message||``),e&&this._inputEl.setAttribute(`disabled`,`true`),t&&this._inputEl.setAttribute(`readonly`,`true`),this._inputEl.addEventListener(`change`,n=>{if(e||t)return;let r=n.target;this._handleTypedValue((r?.value||``).toString())}),this._inputEl.addEventListener(`blur`,n=>{if(e||t)return;let r=n.target;this._handleTypedValue((r?.value||``).toString())},!0),r.appendChild(this._inputEl),this._hiddenInput=document.createElement(`input`),this._hiddenInput.type=`hidden`,this._hiddenInput.name=this.getName(),this._hiddenInput.required=this.isRequired(),r.appendChild(this._hiddenInput),this._syncHiddenInput(),this._popover=document.createElement(`mint-popover`),this._popover.setAttribute(`trigger-id`,this._triggerId),this._popover.setAttribute(`direction`,`down`),this._popover.setAttribute(`padding`,`0`),this._popover.setAttribute(`distance`,`6px`),(e||t)&&this._popover.setAttribute(`open`,`false`);let i=document.createElement(`div`);i.setAttribute(`data-mint-time-picker-body`,`true`),i.className=`mint-time-picker-popover`,this._buildPopoverContent(i),this._popover.appendChild(i),r.appendChild(this._popover),this._setupPopoverOpenObserver(),this.appendChild(r)}};customElements.get(`mint-time-picker`)||e.t(`mint-time-picker`,t),module.exports=t;
+require(`../chunks/icon-B_7c8b8e.js`);const e=require(`../chunks/register-element-tCL_F1YI.js`);require(`../chunks/text-Cpl5ljSe.js`),require(`../chunks/input-lLl8cB6r.js`),require(`../chunks/popover-C6SS_Ggh.js`);var t=class extends HTMLElement{constructor(...e){super(...e),this._triggerId=`mint-time-picker-trigger-${Math.random().toString(36).slice(2,10)}`,this._popover=null,this._popoverObserver=null,this._inputEl=null,this._hiddenInput=null,this._single={hour:9,minute:0,second:0,meridiem:`AM`},this._rangeStart={hour:9,minute:0,second:0,meridiem:`AM`},this._rangeEnd={hour:5,minute:0,second:0,meridiem:`PM`},this._invalidFromInput=!1}static get observedAttributes(){return[`value`,`label`,`info`,`disabled`,`id`,`name`,`required`,`readonly`,`range`,`hours`,`minutes`,`seconds`,`error`,`error-message`]}connectedCallback(){this.classList.add(`mint-time-picker-host`),this._parseAndApplyValue(this.getAttribute(`value`)||``),this.render()}disconnectedCallback(){this._popoverObserver&&=(this._popoverObserver.disconnect(),null)}attributeChangedCallback(e,t,n){if(t!==n){if(e===`value`){if(this._parseAndApplyValue(n||``),this._syncHiddenInput(),this._syncInputValue(),this._popover){let e=this._popover.querySelector(`[data-mint-time-picker-body="true"]`);e&&this._buildPopoverContent(e)}return}e!==`error`&&e!==`error-message`&&(this._invalidFromInput=!1),this.render()}}get value(){return this.getValue()}set value(e){this.setValue(e||``)}getValue(){return this.getAttribute(`value`)||``}setValue(e){e?this.setAttribute(`value`,e):this.removeAttribute(`value`),this._parseAndApplyValue(e||``),this._syncHiddenInput(),this._syncInputValue()}isRange(){return this.getAttribute(`range`)===`true`}isHoursEnabled(){let e=this.getAttribute(`hours`);return e===null?!0:e!==`false`}isMinutesEnabled(){let e=this.getAttribute(`minutes`);return e===null?!0:e!==`false`}isSecondsEnabled(){let e=this.getAttribute(`seconds`);return e===null?!1:e!==`false`}isDisabled(){return this.getAttribute(`disabled`)===`true`}isReadonly(){return this.getAttribute(`readonly`)===`true`}isRequired(){return this.getAttribute(`required`)===`true`}hasExternalError(){return this.getAttribute(`error`)===`true`}getExternalErrorMessage(){return this.getAttribute(`error-message`)||``}getLabel(){return this.getAttribute(`label`)||``}getInfo(){return this.getAttribute(`info`)||``}getName(){return this.getAttribute(`name`)||``}_getEffectiveError(){return{hasError:this.hasExternalError(),message:this.getExternalErrorMessage()}}_formatParts(e){let t=this.isHoursEnabled(),n=this.isMinutesEnabled(),r=this.isSecondsEnabled(),i=[];return t&&i.push(e.hour.toString()),n&&i.push(e.minute.toString().padStart(2,`0`)),r&&i.push(e.second.toString().padStart(2,`0`)),t?`${i.join(`:`)} ${e.meridiem.toLowerCase()}`:i.join(`:`)}_to24Hour(e){let t=e.hour%12;return e.meridiem===`PM`&&(t+=12),{hour:t,minute:e.minute,second:e.second}}_formatParts24(e){let t=this.isHoursEnabled(),n=this.isMinutesEnabled(),r=this.isSecondsEnabled(),i=this._to24Hour(e),a=[];return t&&a.push(i.hour.toString().padStart(2,`0`)),n&&a.push(i.minute.toString().padStart(2,`0`)),r&&a.push(i.second.toString().padStart(2,`0`)),a.join(`:`)}_getDisplayValue(){return this.isRange()?`${this._formatParts(this._rangeStart)} - ${this._formatParts(this._rangeEnd)}`:this._formatParts(this._single)}_getOutputValue(){return this.isRange()?`${this._formatParts24(this._rangeStart)} - ${this._formatParts24(this._rangeEnd)}`:this._formatParts24(this._single)}_getExpectedFormat(){let e=this.isHoursEnabled(),t=this.isMinutesEnabled(),n=this.isSecondsEnabled(),r=[];e&&r.push(`h`),t&&r.push(`mm`),n&&r.push(`ss`);let i=e?`${r.join(`:`)} am/pm`:r.join(`:`);return this.isRange()?`${i} - ${i}`:i}_syncHiddenInput(){this._hiddenInput&&(this._hiddenInput.value=this.getValue()||this._getOutputValue())}_syncInputValue(){this._inputEl&&(this._inputEl.value=this._getDisplayValue(),typeof this._inputEl.render==`function`&&this._inputEl.render())}_emitChangeFromPicker(){let e=this._getOutputValue();this._invalidFromInput=!1,this.setAttribute(`value`,e),this._syncHiddenInput(),this._syncInputValue(),this.dispatchEvent(new Event(`input`,{bubbles:!0,composed:!0})),this.dispatchEvent(new Event(`change`,{bubbles:!0}))}_parseSingle(e){let t=this.isHoursEnabled(),n=this.isMinutesEnabled(),r=this.isSecondsEnabled(),i=e.trim();if(t){let e=i.match(/^(\d{1,2})(?::(\d{2}))?(?::(\d{2}))?\s*(am|pm)$/i);if(!e)return null;let t=Number(e[1]),a=Number(e[2]??0),o=Number(e[3]??0),s=e[4].toUpperCase();return t<1||t>12||n&&(a<0||a>59)||r&&(o<0||o>59)?null:{hour:t,minute:a,second:o,meridiem:s}}let a=i.match(/^(\d{2})(?::(\d{2}))?$/);if(!a)return null;let o=Number(a[1]),s=Number(a[2]??0);return n&&(o<0||o>59)||r&&(s<0||s>59)?null:{hour:12,minute:o,second:s,meridiem:`AM`}}_parseSingleOutput24(e){let t=this.isHoursEnabled(),n=this.isMinutesEnabled(),r=this.isSecondsEnabled(),i=e.trim();if(t){let e=i.match(/^(\d{2})(?::(\d{2}))?(?::(\d{2}))?$/);if(!e)return null;let t=Number(e[1]),a=Number(e[2]??0),o=Number(e[3]??0);if(t<0||t>23||n&&(a<0||a>59)||r&&(o<0||o>59))return null;let s=t>=12?`PM`:`AM`;return{hour:t%12==0?12:t%12,minute:a,second:o,meridiem:s}}let a=i.match(/^(\d{2})(?::(\d{2}))?$/);if(!a)return null;let o=Number(a[1]),s=Number(a[2]??0);return n&&(o<0||o>59)||r&&(s<0||s>59)?null:{hour:12,minute:o,second:s,meridiem:`AM`}}_parseAndApplyValue(e){if(!e)return!1;if(this.isRange()){let[t,n]=e.split(`-`).map(e=>e.trim()),r=this._parseSingleOutput24(t||``),i=this._parseSingleOutput24(n||``);return!r||!i?!1:(this._rangeStart=r,this._rangeEnd=i,!0)}let t=this._parseSingleOutput24(e);return t?(this._single=t,!0):!1}_parseAndApplyDisplayValue(e){if(!e)return!1;if(this.isRange()){let[t,n]=e.split(`-`).map(e=>e.trim()),r=this._parseSingle(t||``),i=this._parseSingle(n||``);return!r||!i?!1:(this._rangeStart=r,this._rangeEnd=i,!0)}let t=this._parseSingle(e);return t?(this._single=t,!0):!1}_handleTypedValue(e){let t=e.trim();if(!t){this._invalidFromInput=!1,this.removeAttribute(`value`),this._syncHiddenInput(),this._syncInputValue();return}if(!this._parseAndApplyDisplayValue(t)){this._invalidFromInput=!0,this.removeAttribute(`value`),this._inputEl&&(this._inputEl.value=``),this._syncHiddenInput(),this.render(),this.dispatchEvent(new Event(`input`,{bubbles:!0,composed:!0})),this.dispatchEvent(new Event(`change`,{bubbles:!0}));return}this._invalidFromInput=!1;let n=this._getOutputValue();this.setAttribute(`value`,n),this._syncHiddenInput(),this._syncInputValue(),this.dispatchEvent(new Event(`input`,{bubbles:!0,composed:!0})),this.dispatchEvent(new Event(`change`,{bubbles:!0}))}_buildColumn(e,t,n,r=!0,i=`standard`,a=`Time`){let o=document.createElement(`div`);return o.className=`mint-time-picker-column mint-time-picker-column-${i}${r?` mint-time-picker-column-divider`:``}`,o.setAttribute(`role`,`group`),o.setAttribute(`aria-label`,a),e.forEach(e=>{let r=document.createElement(`button`);r.type=`button`;let i=e===t;r.className=`mint-time-picker-option${i?` is-selected`:``}`,r.dataset.selected=i?`true`:`false`,r.setAttribute(`aria-pressed`,String(i)),r.setAttribute(`aria-label`,`${a}: ${e}`),r.textContent=e,r.addEventListener(`click`,()=>n(e)),o.appendChild(r)}),o}_centerSelectedInColumn(e,t=0){let n=e.querySelector(`button[data-selected="true"]`);if(!n)return;let r=n.offsetTop-(e.clientHeight/2-n.clientHeight/2)-t;e.scrollTop=Math.max(0,r)}_centerAllColumnsInPopoverBody(){if(!this._popover)return;let e=this._popover.querySelector(`[data-mint-time-picker-body="true"]`);if(!e)return;let t=Array.from(e.querySelectorAll(`.mint-time-picker-column`)),n=this.isRange()?20:0;t.forEach(e=>this._centerSelectedInColumn(e,n))}_setupPopoverOpenObserver(){this._popover&&(this._popoverObserver&&=(this._popoverObserver.disconnect(),null),this._popoverObserver=new MutationObserver(()=>{this._popover?.getAttribute(`open`)===`true`&&requestAnimationFrame(()=>{requestAnimationFrame(()=>{this._centerAllColumnsInPopoverBody()})})}),this._popoverObserver.observe(this._popover,{attributes:!0,attributeFilter:[`open`]}))}_buildPickerSet(e,t,n){let r=this.isHoursEnabled(),i=this.isMinutesEnabled(),a=this.isSecondsEnabled(),o=document.createElement(`div`),s=(r?1:0)+(i?1:0)+(a?1:0)+(r?1:0);o.className=`mint-time-picker-wheel`,o.style.gridTemplateColumns=`repeat(${Math.max(s,1)}, minmax(0, 1fr))`;let c=Array.from({length:12},(e,t)=>(t+1).toString().padStart(2,`0`)),l=Array.from({length:60},(e,t)=>t.toString().padStart(2,`0`)),u=Array.from({length:60},(e,t)=>t.toString().padStart(2,`0`)),d=[`AM`,`PM`],f=[];r&&f.push(this._buildColumn(c,t.hour.toString().padStart(2,`0`),e=>{n({...t,hour:Number(e)})},!0,`tall`,`Hour`)),i&&f.push(this._buildColumn(l,t.minute.toString().padStart(2,`0`),e=>{n({...t,minute:Number(e)})},!0,`tall`,`Minute`)),a&&f.push(this._buildColumn(u,t.second.toString().padStart(2,`0`),e=>{n({...t,second:Number(e)})},!0,`tall`,`Second`)),r&&f.push(this._buildColumn(d,t.meridiem,e=>{n({...t,meridiem:e})},!0,`compact`,`Meridiem`)),f.forEach((e,t)=>{t===f.length-1&&e.classList.remove(`mint-time-picker-column-divider`),o.appendChild(e)}),e.appendChild(o)}_buildPopoverContent(e){if(e.innerHTML=``,!this.isRange()){this._buildPickerSet(e,this._single,t=>{this._single=t,this._emitChangeFromPicker(),this._buildPopoverContent(e)});return}let t=document.createElement(`div`);t.className=`mint-time-picker-range`;let n=document.createElement(`div`),r=document.createElement(`mint-text`);r.setAttribute(`variant`,`muted`),r.className=`mint-time-picker-range-label`,r.textContent=`Start`,n.appendChild(r),this._buildPickerSet(n,this._rangeStart,t=>{this._rangeStart=t,this._emitChangeFromPicker(),this._buildPopoverContent(e)});let i=document.createElement(`div`),a=document.createElement(`mint-text`);a.setAttribute(`variant`,`muted`),a.className=`mint-time-picker-range-label`,a.textContent=`End`,i.appendChild(a),this._buildPickerSet(i,this._rangeEnd,t=>{this._rangeEnd=t,this._emitChangeFromPicker(),this._buildPopoverContent(e)}),t.appendChild(n),t.appendChild(i),e.appendChild(t),requestAnimationFrame(()=>{this._centerAllColumnsInPopoverBody()})}render(){let e=this.isDisabled(),t=this.isReadonly(),n=this._getEffectiveError();this.innerHTML=``;let r=document.createElement(`div`);r.className=`mint-time-picker-control`,this._inputEl=document.createElement(`mint-input`),this._inputEl.id=this._triggerId,this._inputEl.classList.add(`mint-time-picker-trigger`),this._inputEl.setAttribute(`type`,`text`),this._inputEl.setAttribute(`icon`,`clock`),this._inputEl.setAttribute(`placeholder`,this._getExpectedFormat()),this._inputEl.setAttribute(`label`,this.getLabel()),this._inputEl.setAttribute(`info`,this.getInfo()),this._inputEl.setAttribute(`value`,this._getDisplayValue()),this._inputEl.setAttribute(`error`,n.hasError?`true`:`false`),this._inputEl.setAttribute(`error-message`,n.message||``),e&&this._inputEl.setAttribute(`disabled`,`true`),t&&this._inputEl.setAttribute(`readonly`,`true`),this._inputEl.addEventListener(`change`,n=>{if(e||t)return;let r=n.target;this._handleTypedValue((r?.value||``).toString())}),this._inputEl.addEventListener(`blur`,n=>{if(e||t)return;let r=n.target;this._handleTypedValue((r?.value||``).toString())},!0),r.appendChild(this._inputEl),this._hiddenInput=document.createElement(`input`),this._hiddenInput.type=`hidden`,this._hiddenInput.name=this.getName(),this._hiddenInput.required=this.isRequired(),r.appendChild(this._hiddenInput),this._syncHiddenInput(),this._popover=document.createElement(`mint-popover`),this._popover.setAttribute(`trigger-id`,this._triggerId),this._popover.setAttribute(`direction`,`down`),this._popover.setAttribute(`padding`,`0`),this._popover.setAttribute(`distance`,`6px`),(e||t)&&this._popover.setAttribute(`open`,`false`);let i=document.createElement(`div`);i.setAttribute(`data-mint-time-picker-body`,`true`),i.className=`mint-time-picker-popover`,this._buildPopoverContent(i),this._popover.appendChild(i),r.appendChild(this._popover),this._setupPopoverOpenObserver(),this.appendChild(r)}};customElements.get(`mint-time-picker`)||e.t(`mint-time-picker`,t),module.exports=t;

package/dist/components/time-picker/index.js

@@ -9,7 +9,7 @@ import "../chunks/icon-BWUYe89V.js";
 import { t as e } from "../chunks/register-element-BFYmIynH.js";
 import "../chunks/text-Bmfl6CxJ.js";
 import "../chunks/input-Dwrs8tJH.js";
-import "../chunks/popover-gviDCspV.js";
+import "../chunks/popover-CYM_34P9.js";
 //#region src/components/time-picker/TimePicker.ts
 var t = class extends HTMLElement {
 	constructor(...e) {