@zoff-tech/zt-bottom-drawer/dist/zt-bottom-drawer/p-82bfe303.entry.js

Bottom Drawer / Web Component

import{r as t,h as e,H as i,e as n}from"./p-f6c816ce.js";import{addEventListener as a,componentOnReady as s}from"@utils/helpers";import{printIonError as o}from"@utils/logging";import{createColorClasses as r}from"@utils/theme";import{g as d}from"./p-0b9b2444.js";import{q as c,t as l,J as m,S as h,G as p,K as u,T as b}from"./p-72283fec.js";const f=":host{display:flex;align-items:center;justify-content:center}:host button{border-radius:8px;-webkit-padding-start:12px;padding-inline-start:12px;-webkit-padding-end:12px;padding-inline-end:12px;padding-top:6px;padding-bottom:6px;-webkit-margin-start:2px;margin-inline-start:2px;-webkit-margin-end:2px;margin-inline-end:2px;margin-top:0px;margin-bottom:0px;position:relative;transition:150ms color ease-in-out;border:none;background:var(--ion-color-step-300, #edeef0);color:var(--ion-text-color, #000);font-family:inherit;font-size:inherit;cursor:pointer;appearance:none;overflow:hidden}:host(.time-active) #time-button,:host(.date-active) #date-button{color:var(--ion-color-base)}:host(.datetime-button-disabled){pointer-events:none}:host(.datetime-button-disabled) button{opacity:0.4}";const g=":host{display:flex;align-items:center;justify-content:center}:host button{border-radius:8px;-webkit-padding-start:12px;padding-inline-start:12px;-webkit-padding-end:12px;padding-inline-end:12px;padding-top:6px;padding-bottom:6px;-webkit-margin-start:2px;margin-inline-start:2px;-webkit-margin-end:2px;margin-inline-end:2px;margin-top:0px;margin-bottom:0px;position:relative;transition:150ms color ease-in-out;border:none;background:var(--ion-color-step-300, #edeef0);color:var(--ion-text-color, #000);font-family:inherit;font-size:inherit;cursor:pointer;appearance:none;overflow:hidden}:host(.time-active) #time-button,:host(.date-active) #date-button{color:var(--ion-color-base)}:host(.datetime-button-disabled){pointer-events:none}:host(.datetime-button-disabled) button{opacity:0.4}";const x=class{constructor(e){t(this,e);this.datetimeEl=null;this.overlayEl=null;this.getParsedDateValues=t=>{if(t===undefined||t===null){return[]}if(Array.isArray(t)){return t}return[t]};this.setDateTimeText=()=>{const{datetimeEl:t,datetimePresentation:e}=this;if(!t){return}const{value:i,locale:n,hourCycle:a,preferWheel:s,multiple:r,titleSelectedDatesFormatter:d}=t;const f=this.getParsedDateValues(i);const g=c(f.length>0?f:[l()]);const x=g[0];const v=m(n,a);this.dateText=this.timeText=undefined;switch(e){case"date-time":case"time-date":const t=b(n,x);const e=u(n,x,v);if(s){this.dateText=`${t} ${e}`}else{this.dateText=t;this.timeText=e}break;case"date":if(r&&f.length!==1){let t=`${f.length} days`;if(d!==undefined){try{t=d(f)}catch(t){o("Exception in provided `titleSelectedDatesFormatter`: ",t)}}this.dateText=t}else{this.dateText=b(n,x)}break;case"time":this.timeText=u(n,x,v);break;case"month-year":this.dateText=p(n,x);break;case"month":this.dateText=h(n,x,{month:"long"});break;case"year":this.dateText=h(n,x,{year:"numeric"});break}};this.waitForDatetimeChanges=async()=>{const{datetimeEl:t}=this;if(!t){return Promise.resolve()}return new Promise((e=>{a(t,"ionRender",e,{once:true})}))};this.handleDateClick=async t=>{const{datetimeEl:e,datetimePresentation:i}=this;if(!e){return}let n=false;switch(i){case"date-time":case"time-date":const t=e.presentation!=="date";if(!e.preferWheel&&t){e.presentation="date";n=true}break}this.selectedButton="date";this.presentOverlay(t,n,this.dateTargetEl)};this.handleTimeClick=t=>{const{datetimeEl:e,datetimePresentation:i}=this;if(!e){return}let n=false;switch(i){case"date-time":case"time-date":const t=e.presentation!=="time";if(t){e.presentation="time";n=true}break}this.selectedButton="time";this.presentOverlay(t,n,this.timeTargetEl)};this.presentOverlay=async(t,e,i)=>{const{overlayEl:n}=this;if(!n){return}if(n.tagName==="ION-POPOVER"){if(e){await this.waitForDatetimeChanges()}n.present(Object.assign(Object.assign({},t),{detail:{ionShadowTarget:i}}))}else{n.present()}};this.datetimePresentation="date-time";this.dateText=undefined;this.timeText=undefined;this.datetimeActive=false;this.selectedButton=undefined;this.color="primary";this.disabled=false;this.datetime=undefined}async componentWillLoad(){const{datetime:t}=this;if(!t){o("An ID associated with an ion-datetime instance is required for ion-datetime-button to function properly.",this.el);return}const e=this.datetimeEl=document.getElementById(t);if(!e){o(`No ion-datetime instance found for ID '${t}'.`,this.el);return}if(e.tagName!=="ION-DATETIME"){o(`Expected an ion-datetime instance for ID '${t}' but received '${e.tagName.toLowerCase()}' instead.`,e);return}const i=new IntersectionObserver((t=>{const e=t[0];this.datetimeActive=e.isIntersecting}),{threshold:.01});i.observe(e);const n=this.overlayEl=e.closest("ion-modal, ion-popover");if(n){n.classList.add("ion-datetime-button-overlay")}s(e,(()=>{const t=this.datetimePresentation=e.presentation||"date-time";this.setDateTimeText();a(e,"ionValueChange",this.setDateTimeText);switch(t){case"date-time":case"date":case"month-year":case"month":case"year":this.selectedButton="date";break;case"time-date":case"time":this.selectedButton="time";break}}))}render(){const{color:t,dateText:n,timeText:a,selectedButton:s,datetimeActive:o,disabled:c}=this;const l=d(this);return e(i,{class:r(t,{[l]:true,[`${s}-active`]:o,["datetime-button-disabled"]:c})},n&&e("button",{class:"ion-activatable",id:"date-button","aria-expanded":o?"true":"false",onClick:this.handleDateClick,disabled:c,part:"native",ref:t=>this.dateTargetEl=t},e("slot",{name:"date-target"},n),l==="md"&&e("ion-ripple-effect",null)),a&&e("button",{class:"ion-activatable",id:"time-button","aria-expanded":o?"true":"false",onClick:this.handleTimeClick,disabled:c,part:"native",ref:t=>this.timeTargetEl=t},e("slot",{name:"time-target"},a),l==="md"&&e("ion-ripple-effect",null)))}get el(){return n(this)}};x.style={ios:f,md:g};export{x as ion_datetime_button};
//# sourceMappingURL=p-82bfe303.entry.js.map