@ionic/core
Version:
Base components for Ionic
4 lines • 7.89 kB
JavaScript
import{__awaiter,__generator}from"tslib";
/*!
* (C) Ionic http://ionicframework.com - MIT License
*/import{r as registerInstance,h,e as Host,f as getElement,c as createEvent}from"./index-527b9e34.js";import{j as reorderThreeOutline,k as reorderTwoSharp}from"./index-e2cf2ceb.js";import{b as getIonMode}from"./ionic-global-ca86cf32.js";import{f as findClosestIonContent,g as getScrollElement}from"./index-e919e353.js";import{r as raf}from"./helpers-78efeec3.js";import{a as hapticSelectionStart,b as hapticSelectionChanged,h as hapticSelectionEnd}from"./haptic-ac164e4c.js";import"./index-738d7504.js";import"./capacitor-59395cbd.js";import"./index-a5d50daf.js";var reorderIosCss=":host([slot]){display:none;line-height:0;z-index:100}.reorder-icon{display:block}::slotted(ion-icon){font-size:dynamic-font(16px)}.reorder-icon{font-size:2.125rem;opacity:0.4}";var IonReorderIosStyle0=reorderIosCss;var reorderMdCss=":host([slot]){display:none;line-height:0;z-index:100}.reorder-icon{display:block}::slotted(ion-icon){font-size:dynamic-font(16px)}.reorder-icon{font-size:1.9375rem;opacity:0.3}";var IonReorderMdStyle0=reorderMdCss;var Reorder=function(){function r(r){registerInstance(this,r)}r.prototype.onClick=function(r){var e=this.el.closest("ion-reorder-group");r.preventDefault();if(!e||!e.disabled){r.stopImmediatePropagation()}};r.prototype.render=function(){var r=getIonMode(this);var e=r==="ios"?reorderThreeOutline:reorderTwoSharp;return h(Host,{key:"17adf3165f4e09283d5d6434d7cd47bd23519048",class:r},h("slot",{key:"d00d1cd97c689fc5c7b7175a2051cf697fe22871"},h("ion-icon",{key:"eec219aebde6083de98358be3e75965c5a5dc3d0",icon:e,lazy:false,class:"reorder-icon",part:"icon","aria-hidden":"true"})))};Object.defineProperty(r.prototype,"el",{get:function(){return getElement(this)},enumerable:false,configurable:true});return r}();Reorder.style={ios:IonReorderIosStyle0,md:IonReorderMdStyle0};var reorderGroupCss=".reorder-list-active>*{display:block;-webkit-transition:-webkit-transform 300ms;transition:-webkit-transform 300ms;transition:transform 300ms;transition:transform 300ms, -webkit-transform 300ms;will-change:transform}.reorder-enabled{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.reorder-enabled ion-reorder{display:block;cursor:-webkit-grab;cursor:grab;pointer-events:all;-ms-touch-action:none;touch-action:none}.reorder-selected,.reorder-selected ion-reorder{cursor:-webkit-grabbing;cursor:grabbing}.reorder-selected{position:relative;-webkit-transition:none !important;transition:none !important;-webkit-box-shadow:0 0 10px rgba(0, 0, 0, 0.4);box-shadow:0 0 10px rgba(0, 0, 0, 0.4);opacity:0.8;z-index:100}.reorder-visible ion-reorder .reorder-icon{-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0)}";var IonReorderGroupStyle0=reorderGroupCss;var ReorderGroup=function(){function r(r){registerInstance(this,r);this.ionItemReorder=createEvent(this,"ionItemReorder",7);this.lastToIndex=-1;this.cachedHeights=[];this.scrollElTop=0;this.scrollElBottom=0;this.scrollElInitial=0;this.containerTop=0;this.containerBottom=0;this.state=0;this.disabled=true}r.prototype.disabledChanged=function(){if(this.gesture){this.gesture.enable(!this.disabled)}};r.prototype.connectedCallback=function(){return __awaiter(this,void 0,void 0,(function(){var r,e,t;var i=this;return __generator(this,(function(n){switch(n.label){case 0:r=findClosestIonContent(this.el);if(!r)return[3,2];e=this;return[4,getScrollElement(r)];case 1:e.scrollEl=n.sent();n.label=2;case 2:t=this;return[4,import("./index-39782642.js")];case 3:t.gesture=n.sent().createGesture({el:this.el,gestureName:"reorder",gesturePriority:110,threshold:0,direction:"y",passive:false,canStart:function(r){return i.canStart(r)},onStart:function(r){return i.onStart(r)},onMove:function(r){return i.onMove(r)},onEnd:function(){return i.onEnd()}});this.disabledChanged();return[2]}}))}))};r.prototype.disconnectedCallback=function(){this.onEnd();if(this.gesture){this.gesture.destroy();this.gesture=undefined}};r.prototype.complete=function(r){return Promise.resolve(this.completeReorder(r))};r.prototype.canStart=function(r){if(this.selectedItemEl||this.state!==0){return false}var e=r.event.target;var t=e.closest("ion-reorder");if(!t){return false}var i=findReorderItem(t,this.el);if(!i){return false}r.data=i;return true};r.prototype.onStart=function(r){r.event.preventDefault();var e=this.selectedItemEl=r.data;var t=this.cachedHeights;t.length=0;var i=this.el;var n=i.children;if(!n||n.length===0){return}var o=0;for(var s=0;s<n.length;s++){var a=n[s];o+=a.offsetHeight;t.push(o);a.$ionIndex=s}var d=i.getBoundingClientRect();this.containerTop=d.top;this.containerBottom=d.bottom;if(this.scrollEl){var c=this.scrollEl.getBoundingClientRect();this.scrollElInitial=this.scrollEl.scrollTop;this.scrollElTop=c.top+AUTO_SCROLL_MARGIN;this.scrollElBottom=c.bottom-AUTO_SCROLL_MARGIN}else{this.scrollElInitial=0;this.scrollElTop=0;this.scrollElBottom=0}this.lastToIndex=indexForItem(e);this.selectedItemHeight=e.offsetHeight;this.state=1;e.classList.add(ITEM_REORDER_SELECTED);hapticSelectionStart()};r.prototype.onMove=function(r){var e=this.selectedItemEl;if(!e){return}var t=this.autoscroll(r.currentY);var i=this.containerTop-t;var n=this.containerBottom-t;var o=Math.max(i,Math.min(r.currentY,n));var s=t+o-r.startY;var a=o-i;var d=this.itemIndexForTop(a);if(d!==this.lastToIndex){var c=indexForItem(e);this.lastToIndex=d;hapticSelectionChanged();this.reorderMove(c,d)}e.style.transform="translateY(".concat(s,"px)")};r.prototype.onEnd=function(){var r=this.selectedItemEl;this.state=2;if(!r){this.state=0;return}var e=this.lastToIndex;var t=indexForItem(r);if(e===t){this.completeReorder()}else{this.ionItemReorder.emit({from:t,to:e,complete:this.completeReorder.bind(this)})}hapticSelectionEnd()};r.prototype.completeReorder=function(r){var e=this;var t=this.selectedItemEl;if(t&&this.state===2){var i=this.el.children;var n=i.length;var o=this.lastToIndex;var s=indexForItem(t);raf((function(){if(o!==s&&(r===undefined||r===true)){var a=s<o?i[o+1]:i[o];e.el.insertBefore(t,a)}for(var d=0;d<n;d++){i[d].style["transform"]=""}}));if(Array.isArray(r)){r=reorderArray(r,s,o)}t.style.transition="";t.classList.remove(ITEM_REORDER_SELECTED);this.selectedItemEl=undefined;this.state=0}return r};r.prototype.itemIndexForTop=function(r){var e=this.cachedHeights;for(var t=0;t<e.length;t++){if(e[t]>r){return t}}return e.length-1};r.prototype.reorderMove=function(r,e){var t=this.selectedItemHeight;var i=this.el.children;for(var n=0;n<i.length;n++){var o=i[n].style;var s="";if(n>r&&n<=e){s="translateY(".concat(-t,"px)")}else if(n<r&&n>=e){s="translateY(".concat(t,"px)")}o["transform"]=s}};r.prototype.autoscroll=function(r){if(!this.scrollEl){return 0}var e=0;if(r<this.scrollElTop){e=-SCROLL_JUMP}else if(r>this.scrollElBottom){e=SCROLL_JUMP}if(e!==0){this.scrollEl.scrollBy(0,e)}return this.scrollEl.scrollTop-this.scrollElInitial};r.prototype.render=function(){var r;var e=getIonMode(this);return h(Host,{key:"6ca009dd65302a914d459aec638e62977440db20",class:(r={},r[e]=true,r["reorder-enabled"]=!this.disabled,r["reorder-list-active"]=this.state!==0,r)})};Object.defineProperty(r.prototype,"el",{get:function(){return getElement(this)},enumerable:false,configurable:true});Object.defineProperty(r,"watchers",{get:function(){return{disabled:["disabledChanged"]}},enumerable:false,configurable:true});return r}();var indexForItem=function(r){return r["$ionIndex"]};var findReorderItem=function(r,e){var t;while(r){t=r.parentElement;if(t===e){return r}r=t}return undefined};var AUTO_SCROLL_MARGIN=60;var SCROLL_JUMP=10;var ITEM_REORDER_SELECTED="reorder-selected";var reorderArray=function(r,e,t){var i=r[e];r.splice(e,1);r.splice(t,0,i);return r.slice()};ReorderGroup.style=IonReorderGroupStyle0;export{Reorder as ion_reorder,ReorderGroup as ion_reorder_group};