@ionic/core/dist/ionic/p-675b1a31.entry.js

Base components for Ionic

/*!
 * (C) Ionic http://ionicframework.com - MIT License
 */
import{r as i,c as t,h as e,d as s,g as n}from"./p-C8IsBmNU.js";import{d as o}from"./p-ZjP4CjeZ.js";import{r as a,g as r}from"./p-CTfR9YZG.js";import{b as l,a as d,h as c}from"./p-CKvCXMs9.js";import{a as h,b as p}from"./p-BFvmZNyx.js";import{c as m}from"./p-DiVJyqlX.js";import"./p-CIGNaXM1.js";const u=class{constructor(e){i(this,e),this.ionChange=t(this,"ionChange",7),this.isScrolling=!1,this.isColumnVisible=!1,this.canExitInputMode=!0,this.updateValueTextOnScroll=!1,this.ariaLabel=null,this.isActive=!1,this.disabled=!1,this.color="primary",this.numericInput=!1,this.centerPickerItemInView=(i,t=!0,e=!0)=>{const{isColumnVisible:s,scrollEl:n}=this;if(s&&n){const s=i.offsetTop-3*i.clientHeight+i.clientHeight/2;n.scrollTop!==s&&(this.canExitInputMode=e,this.updateValueTextOnScroll=!1,n.scroll({top:s,left:0,behavior:t?"smooth":void 0}))}},this.setPickerItemActiveState=(i,t)=>{t?i.classList.add(f):i.classList.remove(f)},this.inputModeChange=i=>{if(!this.numericInput)return;const{useInputMode:t,inputModeColumn:e}=i.detail;this.setInputModeActive(!(!t||void 0!==e&&e!==this.el))},this.setInputModeActive=i=>{this.isScrolling?this.scrollEndCallback=()=>{this.isActive=i}:this.isActive=i},this.initializeScrollListener=()=>{const i=h("ios"),{el:t,scrollEl:e}=this;let s,n=this.activeItem;const r=()=>{a((()=>{var a;if(!e)return;s&&(clearTimeout(s),s=void 0),this.isScrolling||(i&&l(),this.isScrolling=!0);const r=e.getBoundingClientRect(),h=r.x+r.width/2,p=r.y+r.height/2,m=t.getRootNode(),u=m instanceof ShadowRoot?m:o;if(void 0===u)return;let f=u.elementsFromPoint(h,p).find((i=>"ION-PICKER-COLUMN-OPTION"===i.tagName));if(void 0===f){const i=u.elementFromPoint(h,p);"ION-PICKER-COLUMN-OPTION"===(null==i?void 0:i.tagName)&&(f=i)}void 0!==n&&this.setPickerItemActiveState(n,!1),void 0===f||f.disabled||(f!==n&&(i&&d(),this.canExitInputMode&&this.exitInputMode()),n=f,this.setPickerItemActiveState(f,!0),this.updateValueTextOnScroll&&(null===(a=this.assistiveFocusable)||void 0===a||a.setAttribute("aria-valuetext",this.getOptionValueText(f))),s=setTimeout((()=>{this.isScrolling=!1,this.updateValueTextOnScroll=!0,i&&c();const{scrollEndCallback:t}=this;t&&(t(),this.scrollEndCallback=void 0),this.canExitInputMode=!0,this.setValue(f.value)}),250))}))};a((()=>{e&&(e.addEventListener("scroll",r),this.destroyScrollListener=()=>{e.removeEventListener("scroll",r)})}))},this.exitInputMode=()=>{const{parentEl:i}=this;null!=i&&(i.exitInputMode(),this.el.classList.remove("picker-column-active"))},this.findNextOption=(i=1)=>{const{activeItem:t}=this;if(!t)return null;let e=t,s=t.nextElementSibling;for(;null!=s;){if(i>0&&i--,"ION-PICKER-COLUMN-OPTION"===s.tagName&&!s.disabled&&0===i)return s;e=s,s=s.nextElementSibling}return e},this.findPreviousOption=(i=1)=>{const{activeItem:t}=this;if(!t)return null;let e=t,s=t.previousElementSibling;for(;null!=s;){if(i>0&&i--,"ION-PICKER-COLUMN-OPTION"===s.tagName&&!s.disabled&&0===i)return s;e=s,s=s.previousElementSibling}return e},this.onKeyDown=i=>{const t=h("mobile");let e=null;switch(i.key){case"ArrowDown":e=t?this.findPreviousOption():this.findNextOption();break;case"ArrowUp":e=t?this.findNextOption():this.findPreviousOption();break;case"PageUp":e=t?this.findNextOption(5):this.findPreviousOption(5);break;case"PageDown":e=t?this.findPreviousOption(5):this.findNextOption(5);break;case"Home":e=this.el.querySelector("ion-picker-column-option:first-of-type");break;case"End":e=this.el.querySelector("ion-picker-column-option:last-of-type")}null!==e&&(this.setValue(e.value),i.preventDefault())},this.getOptionValueText=i=>{var t;return i?null!==(t=i.getAttribute("aria-label"))&&void 0!==t?t:i.innerText:""}}ariaLabelChanged(i){this.ariaLabel=i}valueChange(){this.isColumnVisible&&this.scrollActiveItemIntoView(!0)}componentWillLoad(){const i=this.parentEl=this.el.closest("ion-picker");new IntersectionObserver((i=>{if(i[i.length-1].isIntersecting){const{activeItem:i,el:t}=this;this.isColumnVisible=!0;const e=r(t).querySelector(`.${f}`);e&&this.setPickerItemActiveState(e,!1),this.scrollActiveItemIntoView(),i&&this.setPickerItemActiveState(i,!0),this.initializeScrollListener()}else this.isColumnVisible=!1,this.destroyScrollListener&&(this.destroyScrollListener(),this.destroyScrollListener=void 0)}),{threshold:.001,root:this.parentEl}).observe(this.el),null!==i&&i.addEventListener("ionInputModeChange",(i=>this.inputModeChange(i)))}componentDidRender(){const{el:i,activeItem:t,isColumnVisible:e,value:s}=this;if(e&&!t){const t=i.querySelector("ion-picker-column-option");null!==t&&t.value!==s&&this.setValue(t.value)}}async scrollActiveItemIntoView(i=!1){const t=this.activeItem;t&&this.centerPickerItemInView(t,i,!1)}async setValue(i){!0!==this.disabled&&this.value!==i&&(this.value=i,this.ionChange.emit({value:i}))}async setFocus(){this.assistiveFocusable&&this.assistiveFocusable.focus()}connectedCallback(){var i;this.ariaLabel=null!==(i=this.el.getAttribute("aria-label"))&&void 0!==i?i:"Select a value"}get activeItem(){const{value:i}=this;return Array.from(this.el.querySelectorAll("ion-picker-column-option")).find((t=>!(!this.disabled&&t.disabled)&&t.value===i))}render(){const{color:i,disabled:t,isActive:n,numericInput:o}=this,a=p(this);return e(s,{key:"db903fd415f8a2d91994dececca481c1af8ba6a9",class:m(i,{[a]:!0,"picker-column-active":n,"picker-column-numeric-input":o,"picker-column-disabled":t})},e("slot",{key:"02ce9e1dd7df91afcd50b06416552bcffb5dec98",name:"prefix"}),e("div",{key:"6dfd7d2429bec19244a6b1afb4448121963a031b",class:"picker-opts",ref:i=>{this.scrollEl=i},role:"slider",tabindex:this.disabled?void 0:0,"aria-label":this.ariaLabel,"aria-valuemin":0,"aria-valuemax":0,"aria-valuenow":0,"aria-valuetext":this.getOptionValueText(this.activeItem),"aria-orientation":"vertical",onKeyDown:i=>this.onKeyDown(i)},e("div",{key:"e30ce0b9cefbfe4d4441fa33acf595da31855c3f",class:"picker-item-empty","aria-hidden":"true"}," "),e("div",{key:"8be2bd293c12c6ba720d9b31d0d561a96f42e97d",class:"picker-item-empty","aria-hidden":"true"}," "),e("div",{key:"8afdcddddabbf646fbb55cb0ba4448309a2c1dd9",class:"picker-item-empty","aria-hidden":"true"}," "),e("slot",{key:"6aa0dacc34d6848575ad5b122b9046982308ca43"}),e("div",{key:"92ec8a357414c1b779b11d1dd18fb87a7ee63982",class:"picker-item-empty","aria-hidden":"true"}," "),e("div",{key:"b89457cb74b5907c25594ff6720ac54ca537e933",class:"picker-item-empty","aria-hidden":"true"}," "),e("div",{key:"5bbc92e6bc24de08e39873bf08c5b668373ac0f8",class:"picker-item-empty","aria-hidden":"true"}," ")),e("slot",{key:"d7bf2b519214f0f3576a4ca79844ad97827dd97f",name:"suffix"}))}get el(){return n(this)}static get watchers(){return{"aria-label":["ariaLabelChanged"],value:["valueChange"]}}},f="option-active";u.style=":host{display:-ms-flexbox;display:flex;position:relative;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;max-width:100%;height:200px;font-size:22px;text-align:center}.assistive-focusable{left:0;right:0;top:0;bottom:0;position:absolute;z-index:1;pointer-events:none}.assistive-focusable:focus{outline:none}.picker-opts{-webkit-padding-start:16px;padding-inline-start:16px;-webkit-padding-end:16px;padding-inline-end:16px;padding-top:0px;padding-bottom:0px;min-width:26px;max-height:200px;outline:none;text-align:inherit;-webkit-scroll-snap-type:y mandatory;-ms-scroll-snap-type:y mandatory;scroll-snap-type:y mandatory;overflow-x:hidden;overflow-y:scroll;scrollbar-width:none}.picker-item-empty{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;display:block;width:100%;height:34px;border:0px;outline:none;background:transparent;color:inherit;font-family:var(--ion-font-family, inherit);font-size:inherit;line-height:34px;text-align:inherit;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.picker-opts::-webkit-scrollbar{display:none}::slotted(ion-picker-column-option){display:block;scroll-snap-align:center}.picker-item-empty,:host(:not([disabled])) ::slotted(ion-picker-column-option.option-disabled){scroll-snap-align:none}::slotted([slot=prefix]),::slotted([slot=suffix]){max-width:200px;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}::slotted([slot=prefix]){-webkit-padding-start:16px;padding-inline-start:16px;-webkit-padding-end:16px;padding-inline-end:16px;padding-top:0;padding-bottom:0;-ms-flex-pack:end;justify-content:end}::slotted([slot=suffix]){-webkit-padding-start:16px;padding-inline-start:16px;-webkit-padding-end:16px;padding-inline-end:16px;padding-top:0;padding-bottom:0;-ms-flex-pack:start;justify-content:start}:host(.picker-column-disabled) .picker-opts{overflow-y:hidden}:host(.picker-column-disabled) ::slotted(ion-picker-column-option){cursor:default;opacity:0.4;pointer-events:none}@media (any-hover: hover){:host(:focus) .picker-opts{outline:none;background:rgba(var(--ion-color-base-rgb), 0.2)}}";export{u as ion_picker_column}