framework7 6.3.4 → 7.0.0-beta.3

package/components/smart-select/smart-select.js

@@ -1 +1,149 @@
-(function framework7ComponentLoader(e,t){void 0===t&&(t=!0);var a=e.$,r=e.utils,s=(e.getDevice,e.getSupport,e.Class),n=(e.Modal,e.ConstructorMethods),o=(e.ModalMethods,r.extend),l=r.id,i=r.nextTick,c=r.deleteProps;function p(e){this.wrapped=e}function u(e){var t,a;function r(t,a){try{var n=e[t](a),o=n.value,l=o instanceof p;Promise.resolve(l?o.wrapped:o).then((function(e){l?r("return"===t?"return":"next",e):s(n.done?"return":"normal",e)}),(function(e){r("throw",e)}))}catch(e){s("throw",e)}}function s(e,s){switch(e){case"return":t.resolve({value:s,done:!0});break;case"throw":t.reject(s);break;default:t.resolve({value:s,done:!1})}(t=t.next)?r(t.key,t.arg):a=null}this._invoke=function(e,s){return new Promise((function(n,o){var l={key:e,arg:s,resolve:n,reject:o,next:null};a?a=a.next=l:(t=a=l,r(e,s))}))},"function"!=typeof e.return&&(this.return=void 0)}function d(e,t){for(var a=0;a<t.length;a++){var r=t[a];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}function m(e,t){return(m=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e})(e,t)}function v(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}u.prototype["function"==typeof Symbol&&Symbol.asyncIterator||"@@asyncIterator"]=function(){return this},u.prototype.next=function(e){return this._invoke("next",e)},u.prototype.throw=function(e){return this._invoke("throw",e)},u.prototype.return=function(e){return this._invoke("return",e)};l=0;var h=function(e){var t,r;function s(t,r){var s;void 0===r&&(r={});var n=v(s=e.call(this,r,[t])||this),i=o({on:{}},t.params.smartSelect);void 0===i.searchbarDisableButton&&(i.searchbarDisableButton="aurora"!==t.theme),n.useModulesParams(i),n.params=o({},i,r),n.app=t;var c=a(n.params.el).eq(0);if(0===c.length)return n||v(s);if(c[0].f7SmartSelect)return c[0].f7SmartSelect||v(s);var p,u=c.find("select").eq(0);if(0===u.length)return n||v(s);n.params.setValueText&&(0===(p=a(n.params.valueEl)).length&&(p=c.find(".item-after")),0===p.length&&(p=a('<div class="item-after"></div>')).insertAfter(c.find(".item-title")));var d=r.url;d||(c.attr("href")&&"#"!==c.attr("href")?d=c.attr("href"):u.attr("name")&&(d=u.attr("name").toLowerCase()+"-select/")),d||(d=n.params.url);var m=u[0].multiple,h=m?"checkbox":"radio",f=l();function b(){n.open()}function g(){var e=n.$selectEl.val();n.$el.trigger("smartselect:change",e),n.emit("local::change smartSelectChange",n,e),n.vl&&n.vl.clearCache(),n.setValueText()}function x(){var e,t,r,s=this,o=s.value,l=[];if("checkbox"===s.type){for(var i=0;i<n.selectEl.options.length;i+=1)(e=n.selectEl.options[i]).value===o&&(e.selected=s.checked),e.selected&&(t=(r=e.dataset?e.dataset.displayAs:a(e).data("display-value-as"))&&void 0!==r?r:e.textContent,l.push(t.trim()));n.maxLength&&n.checkMaxLength()}else(e=n.$selectEl.find('option[value="'+o+'"]')[0])||(e=n.$selectEl.find("option").filter((function(e){return e.value===o}))[0]),l=[t=(r=e.dataset?e.dataset.displayAs:a(e).data("display-as"))&&void 0!==r?r:e.textContent],n.selectEl.value=o;n.$selectEl.trigger("change"),n.params.setValueText&&n.$valueEl.text(n.formatValueText(l)),n.params.closeOnSelect&&"radio"===n.inputType&&n.close()}return o(n,{$el:c,el:c[0],$selectEl:u,selectEl:u[0],$valueEl:p,valueEl:p&&p[0],url:d,multiple:m,inputType:h,id:f,inputName:h+"-"+f,selectName:u.attr("name"),maxLength:u.attr("maxlength")||r.maxLength}),c[0].f7SmartSelect=n,n.attachEvents=function(){c.on("click",b),c.on("change","select",g)},n.detachEvents=function(){c.off("click",b),c.off("change","select",g)},n.attachInputsEvents=function(){n.$containerEl.on("change",'input[type="checkbox"], input[type="radio"]',x)},n.detachInputsEvents=function(){n.$containerEl.off("change",'input[type="checkbox"], input[type="radio"]',x)},n.useModules(),n.init(),n||v(s)}r=e,(t=s).prototype=Object.create(r.prototype),t.prototype.constructor=t,m(t,r);var n,p,u,h=s.prototype;return h.setValue=function(e){var t,r,s,n=this,o=e,l=[];if(n.multiple){Array.isArray(o)||(o=[o]);for(var i=0;i<n.selectEl.options.length;i+=1)t=n.selectEl.options[i],o.indexOf(t.value)>=0?t.selected=!0:t.selected=!1,t.selected&&(s=(r=t.dataset?t.dataset.displayAs:a(t).data("display-value-as"))&&void 0!==r?r:t.textContent,l.push(s.trim()))}else(t=n.$selectEl.find('option[value="'+o+'"]')[0])&&(l=[s=(r=t.dataset?t.dataset.displayAs:a(t).data("display-as"))&&void 0!==r?r:t.textContent]),n.selectEl.value=o;return n.params.setValueText&&n.$valueEl.text(n.formatValueText(l)),n.$selectEl.trigger("change"),n},h.unsetValue=function(){var e=this;e.params.setValueText&&e.$valueEl.text(e.formatValueText([])),e.$selectEl.find("option").each((function(e){e.selected=!1,e.checked=!1})),e.$selectEl[0].value=null,e.$containerEl&&e.$containerEl.find('input[name="'+e.inputName+'"][type="checkbox"], input[name="'+e.inputName+'"][type="radio"]').prop("checked",!1),e.$selectEl.trigger("change")},h.getValue=function(){return this.$selectEl.val()},h.checkMaxLength=function(){var e=this,t=e.$containerEl;e.selectEl.selectedOptions.length>=e.maxLength?t.find('input[type="checkbox"]').each((function(e){e.checked?a(e).parents("li").removeClass("disabled"):a(e).parents("li").addClass("disabled")})):t.find(".disabled").removeClass("disabled")},h.formatValueText=function(e){var t=this;return t.params.formatValueText?t.params.formatValueText.call(t,e,t):e.join(", ")},h.setValueText=function(e){var t=this,r=[];void 0!==e?r=Array.isArray(e)?e:[e]:t.$selectEl.find("option").each((function(e){var t=a(e);if(e.selected){var s=e.dataset?e.dataset.displayAs:t.data("display-value-as");s&&void 0!==s?r.push(s):r.push(e.textContent.trim())}})),t.params.setValueText&&t.$valueEl.text(t.formatValueText(r))},h.getItemsData=function(){var e,t=this,r=t.app.theme,s=[];return t.$selectEl.find("option").each((function(n){var o=a(n),l=o.dataset(),i=l.optionImage||t.params.optionImage,c=l.optionIcon||t.params.optionIcon,p="ios"===r&&(l.optionIconIos||t.params.optionIconIos),u="md"===r&&(l.optionIconMd||t.params.optionIconMd),d="aurora"===r&&(l.optionIconAurora||t.params.optionIconAurora),m=i||c||p||u||d,v=l.optionColor,h=l.optionClass||"";o[0].disabled&&(h+=" disabled");var f=o.parent("optgroup")[0],b=f&&f.label,g=!1;f&&f!==e&&(g=!0,e=f,s.push({groupLabel:b,isLabel:g})),s.push({value:o[0].value,text:o[0].textContent.trim(),selected:o[0].selected,groupEl:f,groupLabel:b,image:i,icon:c,iconIos:p,iconMd:u,iconAurora:d,color:v,className:h,disabled:o[0].disabled,id:t.id,hasMedia:m,checkbox:"checkbox"===t.inputType,radio:"radio"===t.inputType,inputName:t.inputName,inputType:t.inputType})})),t.items=s,s},h.renderSearchbar=function(){var e=this;return e.params.renderSearchbar?e.params.renderSearchbar.call(e):$jsx("form",{class:"searchbar"},$jsx("div",{class:"searchbar-inner"},$jsx("div",{class:"searchbar-input-wrap"},$jsx("input",{type:"search",spellcheck:e.params.searchbarSpellcheck||"false",placeholder:e.params.searchbarPlaceholder}),$jsx("i",{class:"searchbar-icon"}),$jsx("span",{class:"input-clear-button"})),e.params.searchbarDisableButton&&$jsx("span",{class:"searchbar-disable-button"},e.params.searchbarDisableText)))},h.renderItem=function(e,t){var a,r,s=this;if(s.params.renderItem)return s.params.renderItem.call(s,e,t);if(e.isLabel)a='<li class="item-divider">'+e.groupLabel+"</li>";else{var n,o=e.selected;if(s.params.virtualList){var l=s.getValue();o=s.multiple?l.indexOf(e.value)>=0:l===e.value,s.multiple&&(n=s.multiple&&!o&&l.length===parseInt(s.maxLength,10))}var i=e.icon,c=e.iconIos,p=e.iconMd,u=e.iconAurora,d=i||c||p||u,m=(void 0===(r=i||c||p||u||"")&&(r=""),r.indexOf(":")>=0?r.split(":")[1]:""),v=function(e){if(void 0===e&&(e=""),e.indexOf(":")>=0){var t=e.split(":")[0];return"f7"===t&&(t="f7-icons"),"material"===t&&(t="material-icons"),t}return e}(i||c||p||u||"");a=$jsx("li",{class:(e.className||"")+(n?" disabled":"")},$jsx("label",{class:"item-"+e.inputType+" item-content"},$jsx("input",{type:e.inputType,name:e.inputName,value:e.value,_checked:o}),$jsx("i",{class:"icon icon-"+e.inputType}),e.hasMedia&&$jsx("div",{class:"item-media"},d&&$jsx("i",{class:"icon "+v},m),e.image&&$jsx("img",{src:e.image})),$jsx("div",{class:"item-inner"},$jsx("div",{class:"item-title"+(e.color?" text-color-"+e.color:"")},e.text))))}return a},h.renderItems=function(){var e=this;return e.params.renderItems?e.params.renderItems.call(e,e.items):"\n      "+e.items.map((function(t,a){return""+e.renderItem(t,a)})).join("")+"\n    "},h.renderPage=function(){var e=this;if(e.params.renderPage)return e.params.renderPage.call(e,e.items);var t=e.params.pageTitle;if(void 0===t){var a=e.$el.find(".item-title");t=a.length?a.text().trim():""}var r=e.params.cssClass;return $jsx("div",{class:"page smart-select-page "+r,"data-name":"smart-select-page","data-select-name":e.selectName},$jsx("div",{class:"navbar "+(e.params.navbarColorTheme?"color-"+e.params.navbarColorTheme:"")},$jsx("div",{class:"navbar-bg"}),$jsx("div",{class:"navbar-inner sliding "+(e.params.navbarColorTheme?"color-"+e.params.navbarColorTheme:"")},$jsx("div",{class:"left"},$jsx("a",{class:"link back"},$jsx("i",{class:"icon icon-back"}),$jsx("span",{class:"if-not-md"},e.params.pageBackLinkText))),t&&$jsx("div",{class:"title"},t),e.params.searchbar&&$jsx("div",{class:"subnavbar"},e.renderSearchbar()))),e.params.searchbar&&$jsx("div",{class:"searchbar-backdrop"}),$jsx("div",{class:"page-content"},$jsx("div",{class:"list smart-select-list-"+e.id+" "+(e.params.virtualList?" virtual-list":"")+" "+(e.params.formColorTheme?"color-"+e.params.formColorTheme:"")},$jsx("ul",null,!e.params.virtualList&&e.renderItems(e.items)))))},h.renderPopup=function(){var e=this;if(e.params.renderPopup)return e.params.renderPopup.call(e,e.items);var t=e.params.pageTitle;if(void 0===t){var a=e.$el.find(".item-title");t=a.length?a.text().trim():""}var r=e.params.cssClass||"";return $jsx("div",{class:"popup smart-select-popup "+r+" "+(e.params.popupTabletFullscreen?"popup-tablet-fullscreen":""),"data-select-name":e.selectName},$jsx("div",{class:"view"},$jsx("div",{class:"page smart-select-page "+(e.params.searchbar?"page-with-subnavbar":""),"data-name":"smart-select-page"},$jsx("div",{class:"navbar "+(e.params.navbarColorTheme?"color-"+e.params.navbarColorTheme:"")},$jsx("div",{class:"navbar-bg"}),$jsx("div",{class:"navbar-inner sliding"},t&&$jsx("div",{class:"title"},t),$jsx("div",{class:"right"},$jsx("a",{class:"link popup-close","data-popup":".smart-select-popup[data-select-name='"+e.selectName+"']"},e.params.popupCloseLinkText)),e.params.searchbar&&$jsx("div",{class:"subnavbar"},e.renderSearchbar()))),e.params.searchbar&&$jsx("div",{class:"searchbar-backdrop"}),$jsx("div",{class:"page-content"},$jsx("div",{class:"list smart-select-list-"+e.id+" "+(e.params.virtualList?" virtual-list":"")+" "+(e.params.formColorTheme?"color-"+e.params.formColorTheme:"")},$jsx("ul",null,!e.params.virtualList&&e.renderItems(e.items)))))))},h.renderSheet=function(){var e=this;if(e.params.renderSheet)return e.params.renderSheet.call(e,e.items);var t=e.params.cssClass;return $jsx("div",{class:"sheet-modal smart-select-sheet "+t,"data-select-name":e.selectName},$jsx("div",{class:"toolbar toolbar-top "+(e.params.toolbarColorTheme?"color-"+e.params.toolbarColorTheme:"")},$jsx("div",{class:"toolbar-inner"},$jsx("div",{class:"left"}),$jsx("div",{class:"right"},$jsx("a",{class:"link sheet-close"},e.params.sheetCloseLinkText)))),$jsx("div",{class:"sheet-modal-inner"},$jsx("div",{class:"page-content"},$jsx("div",{class:"list smart-select-list-"+e.id+" "+(e.params.virtualList?" virtual-list":"")+" "+(e.params.formColorTheme?"color-"+e.params.formColorTheme:"")},$jsx("ul",null,!e.params.virtualList&&e.renderItems(e.items))))))},h.renderPopover=function(){var e=this;if(e.params.renderPopover)return e.params.renderPopover.call(e,e.items);var t=e.params.cssClass;return $jsx("div",{class:"popover smart-select-popover "+t,"data-select-name":e.selectName},$jsx("div",{class:"popover-inner"},$jsx("div",{class:"list smart-select-list-"+e.id+" "+(e.params.virtualList?" virtual-list":"")+" "+(e.params.formColorTheme?"color-"+e.params.formColorTheme:"")},$jsx("ul",null,!e.params.virtualList&&e.renderItems(e.items)))))},h.scrollToSelectedItem=function(){var e=this,t=e.params,a=e.$containerEl;if(!e.opened)return e;if(t.virtualList){var r;e.vl.items.forEach((function(e,t){void 0===r&&e.selected&&(r=t)})),void 0!==r&&e.vl.scrollToItem(r)}else{var s=a.find("input:checked").parents("li");if(!s.length)return e;var n=a.find(".page-content, .popover-inner");if(!n.length)return e;n.scrollTop(s.offset().top-n.offset().top-parseInt(n.css("padding-top"),10))}return e},h.onOpen=function(e,t){var r=this,s=r.app,n=a(t);if(r.$containerEl=n,r.openedIn=e,r.opened=!0,r.params.virtualList&&(r.vl=s.virtualList.create({el:n.find(".virtual-list"),items:r.items,renderItem:r.renderItem.bind(r),height:r.params.virtualListHeight,searchByItem:function(e,t){return!!(t.text&&t.text.toLowerCase().indexOf(e.trim().toLowerCase())>=0)}})),r.params.scrollToSelectedItem&&r.scrollToSelectedItem(),r.params.searchbar){var l=n.find(".searchbar");if("page"===e&&"ios"===s.theme&&(l=a(s.navbar.getElByPage(n)).find(".searchbar")),r.params.appendSearchbarNotFound&&("page"===e||"popup"===e)){var i=null;(i="string"==typeof r.params.appendSearchbarNotFound?a('<div class="block searchbar-not-found">'+r.params.appendSearchbarNotFound+"</div>"):"boolean"==typeof r.params.appendSearchbarNotFound?a('<div class="block searchbar-not-found">Nothing found</div>'):r.params.appendSearchbarNotFound)&&n.find(".page-content").append(i[0])}var c=o({el:l,backdropEl:n.find(".searchbar-backdrop"),searchContainer:".smart-select-list-"+r.id,searchIn:".item-title"},"object"==typeof r.params.searchbar?r.params.searchbar:{});r.searchbar=s.searchbar.create(c)}r.maxLength&&r.checkMaxLength(),r.params.closeOnSelect&&r.$containerEl.find('input[type="radio"][name="'+r.inputName+'"]:checked').parents("label").once("click",(function(){r.close()})),r.attachInputsEvents(),r.$el.trigger("smartselect:open"),r.emit("local::open smartSelectOpen",r)},h.onOpened=function(){var e=this;e.$el.trigger("smartselect:opened"),e.emit("local::opened smartSelectOpened",e)},h.onClose=function(){var e=this;e.destroyed||(e.vl&&e.vl.destroy&&(e.vl.destroy(),e.vl=null,delete e.vl),e.searchbar&&e.searchbar.destroy&&(e.searchbar.destroy(),e.searchbar=null,delete e.searchbar),e.detachInputsEvents(),e.$el.trigger("smartselect:close"),e.emit("local::close smartSelectClose",e))},h.onClosed=function(){var e=this;e.destroyed||(e.opened=!1,e.$containerEl=null,delete e.$containerEl,e.$el.trigger("smartselect:closed"),e.emit("local::closed smartSelectClosed",e))},h.openPage=function(){var e=this;if(e.opened)return e;e.getItemsData();var t=e.renderPage(e.items);return e.view.router.navigate({url:e.url,route:{content:t,path:e.url,on:{pageBeforeIn:function(t,a){e.onOpen("page",a.el)},pageAfterIn:function(t,a){e.onOpened("page",a.el)},pageBeforeOut:function(t,a){e.onClose("page",a.el)},pageAfterOut:function(t,a){e.onClosed("page",a.el)}}}}),e},h.openPopup=function(){var e=this;if(e.opened)return e;e.getItemsData();var t={content:e.renderPopup(e.items),push:e.params.popupPush,swipeToClose:e.params.popupSwipeToClose,on:{popupOpen:function(t){e.onOpen("popup",t.el)},popupOpened:function(t){e.onOpened("popup",t.el)},popupClose:function(t){e.onClose("popup",t.el)},popupClosed:function(t){e.onClosed("popup",t.el)}}};return e.params.routableModals&&e.view?e.view.router.navigate({url:e.url,route:{path:e.url,popup:t}}):e.modal=e.app.popup.create(t).open(),e},h.openSheet=function(){var e=this;if(e.opened)return e;e.getItemsData();var t={content:e.renderSheet(e.items),backdrop:e.params.sheetBackdrop,scrollToEl:e.$el,closeByOutsideClick:!0,push:e.params.sheetPush,swipeToClose:e.params.sheetSwipeToClose,on:{sheetOpen:function(t){e.onOpen("sheet",t.el)},sheetOpened:function(t){e.onOpened("sheet",t.el)},sheetClose:function(t){e.onClose("sheet",t.el)},sheetClosed:function(t){e.onClosed("sheet",t.el)}}};return e.params.routableModals&&e.view?e.view.router.navigate({url:e.url,route:{path:e.url,sheet:t}}):e.modal=e.app.sheet.create(t).open(),e},h.openPopover=function(){var e=this;if(e.opened)return e;e.getItemsData();var t={content:e.renderPopover(e.items),targetEl:e.$el,on:{popoverOpen:function(t){e.onOpen("popover",t.el)},popoverOpened:function(t){e.onOpened("popover",t.el)},popoverClose:function(t){e.onClose("popover",t.el)},popoverClosed:function(t){e.onClosed("popover",t.el)}}};return e.params.routableModals&&e.view?e.view.router.navigate({url:e.url,route:{path:e.url,popover:t}}):e.modal=e.app.popover.create(t).open(),e},h.open=function(e){var t=this;if(t.opened)return t;var a=!1;function r(){a=!0}return t.$el&&t.$el.trigger("smartselect:beforeopen",{prevent:r}),t.emit("local::beforeOpen smartSelectBeforeOpen",t,r),a||t["open"+(e||t.params.openIn).split("").map((function(e,t){return 0===t?e.toUpperCase():e})).join("")](),t},h.close=function(){var e=this;return e.opened?(e.params.routableModals&&e.view||"page"===e.openedIn?e.view.router.back():(e.modal.once("modalClosed",(function(){i((function(){e.destroyed||(e.modal.destroy(),delete e.modal)}))})),e.modal.close()),e):e},h.init=function(){this.attachEvents(),this.setValueText()},h.destroy=function(){var e=this;e.emit("local::beforeDestroy smartSelectBeforeDestroy",e),e.$el.trigger("smartselect:beforedestroy"),e.detachEvents(),delete e.$el[0].f7SmartSelect,c(e),e.destroyed=!0},n=s,(p=[{key:"view",get:function(){var e,t=this.params,a=this.$el;if(t.view&&(e=t.view),e||(e=a.parents(".view").length&&a.parents(".view")[0].f7View),!e&&"page"===t.openIn)throw Error("Smart Select requires initialized View");return e}}])&&d(n.prototype,p),u&&d(n,u),s}(s),f={name:"smartSelect",params:{smartSelect:{el:void 0,valueEl:void 0,setValueText:!0,formatValueText:null,openIn:"page",popupPush:!1,popupSwipeToClose:void 0,sheetPush:!1,sheetSwipeToClose:void 0,sheetBackdrop:!1,pageTitle:void 0,pageBackLinkText:"Back",popupCloseLinkText:"Close",popupTabletFullscreen:!1,sheetCloseLinkText:"Done",searchbar:!1,searchbarPlaceholder:"Search",searchbarDisableText:"Cancel",searchbarDisableButton:void 0,searchbarSpellcheck:!1,closeOnSelect:!1,virtualList:!1,virtualListHeight:void 0,scrollToSelectedItem:!1,formColorTheme:void 0,navbarColorTheme:void 0,routableModals:!1,url:"select/",cssClass:"",renderPage:void 0,renderPopup:void 0,renderSheet:void 0,renderPopover:void 0,renderItems:void 0,renderItem:void 0,renderSearchbar:void 0}},static:{SmartSelect:h},create:function(){var e=this;e.smartSelect=o(n({defaultSelector:".smart-select",constructor:h,app:e,domProp:"f7SmartSelect"}),{open:function(t){var a=e.smartSelect.get(t);if(a&&a.open)return a.open()},close:function(t){var a=e.smartSelect.get(t);if(a&&a.close)return a.close()}})},on:{tabMounted:function(e){var t=this;a(e).find(".smart-select-init").each((function(e){t.smartSelect.create(o({el:e},a(e).dataset()))}))},tabBeforeRemove:function(e){a(e).find(".smart-select-init").each((function(e){e.f7SmartSelect&&e.f7SmartSelect.destroy&&e.f7SmartSelect.destroy()}))},pageInit:function(e){var t=this;e.$el.find(".smart-select-init").each((function(e){t.smartSelect.create(o({el:e},a(e).dataset()))}))},pageBeforeRemove:function(e){e.$el.find(".smart-select-init").each((function(e){e.f7SmartSelect&&e.f7SmartSelect.destroy&&e.f7SmartSelect.destroy()}))}},clicks:{".smart-select":function(e,t){e[0].f7SmartSelect||this.smartSelect.create(o({el:e},t)).open()}},vnode:{"smart-select-init":{insert:function(e){var t=e.elm;this.smartSelect.create(o({el:t},a(t).dataset()))},destroy:function(e){var t=e.elm;t.f7SmartSelect&&t.f7SmartSelect.destroy&&t.f7SmartSelect.destroy()}}}};if(t){if(e.prototype.modules&&e.prototype.modules[f.name])return;e.use(f),e.instance&&(e.instance.useModuleParams(f,e.instance.params),e.instance.useModule(f))}return f}(Framework7, typeof Framework7AutoInstallComponent === 'undefined' ? undefined : Framework7AutoInstallComponent))
+import $ from '../../shared/dom7';
+import { extend } from '../../shared/utils';
+import SmartSelect from './smart-select-class';
+import ConstructorMethods from '../../shared/constructor-methods';
+export default {
+  name: 'smartSelect',
+  params: {
+    smartSelect: {
+      el: undefined,
+      valueEl: undefined,
+      setValueText: true,
+      formatValueText: null,
+      openIn: 'page',
+      // or 'popup' or 'sheet' or 'popover'
+      popupPush: false,
+      popupSwipeToClose: undefined,
+      // defaults to app
+      sheetPush: false,
+      sheetSwipeToClose: undefined,
+      // defaults to app
+      sheetBackdrop: false,
+      pageTitle: undefined,
+      pageBackLinkText: 'Back',
+      popupCloseLinkText: 'Close',
+      popupTabletFullscreen: false,
+      sheetCloseLinkText: 'Done',
+      searchbar: false,
+      searchbarPlaceholder: 'Search',
+      searchbarDisableText: 'Cancel',
+      searchbarDisableButton: undefined,
+      searchbarSpellcheck: false,
+      closeOnSelect: false,
+      virtualList: false,
+      virtualListHeight: undefined,
+      scrollToSelectedItem: false,
+      formColorTheme: undefined,
+      navbarColorTheme: undefined,
+      routableModals: false,
+      url: 'select/',
+      cssClass: '',
+
+      /*
+        Custom render functions
+      */
+      renderPage: undefined,
+      renderPopup: undefined,
+      renderSheet: undefined,
+      renderPopover: undefined,
+      renderItems: undefined,
+      renderItem: undefined,
+      renderSearchbar: undefined
+    }
+  },
+  static: {
+    SmartSelect
+  },
+
+  create() {
+    const app = this;
+    app.smartSelect = extend(ConstructorMethods({
+      defaultSelector: '.smart-select',
+      constructor: SmartSelect,
+      app,
+      domProp: 'f7SmartSelect'
+    }), {
+      open(smartSelectEl) {
+        const ss = app.smartSelect.get(smartSelectEl);
+        if (ss && ss.open) return ss.open();
+        return undefined;
+      },
+
+      close(smartSelectEl) {
+        const ss = app.smartSelect.get(smartSelectEl);
+        if (ss && ss.close) return ss.close();
+        return undefined;
+      }
+
+    });
+  },
+
+  on: {
+    tabMounted(tabEl) {
+      const app = this;
+      $(tabEl).find('.smart-select-init').each(smartSelectEl => {
+        app.smartSelect.create(extend({
+          el: smartSelectEl
+        }, $(smartSelectEl).dataset()));
+      });
+    },
+
+    tabBeforeRemove(tabEl) {
+      $(tabEl).find('.smart-select-init').each(smartSelectEl => {
+        if (smartSelectEl.f7SmartSelect && smartSelectEl.f7SmartSelect.destroy) {
+          smartSelectEl.f7SmartSelect.destroy();
+        }
+      });
+    },
+
+    pageInit(page) {
+      const app = this;
+      page.$el.find('.smart-select-init').each(smartSelectEl => {
+        app.smartSelect.create(extend({
+          el: smartSelectEl
+        }, $(smartSelectEl).dataset()));
+      });
+    },
+
+    pageBeforeRemove(page) {
+      page.$el.find('.smart-select-init').each(smartSelectEl => {
+        if (smartSelectEl.f7SmartSelect && smartSelectEl.f7SmartSelect.destroy) {
+          smartSelectEl.f7SmartSelect.destroy();
+        }
+      });
+    }
+
+  },
+  clicks: {
+    '.smart-select': function open($clickedEl, data) {
+      const app = this;
+
+      if (!$clickedEl[0].f7SmartSelect) {
+        const ss = app.smartSelect.create(extend({
+          el: $clickedEl
+        }, data));
+        ss.open();
+      }
+    }
+  },
+  vnode: {
+    'smart-select-init': {
+      insert(vnode) {
+        const app = this;
+        const smartSelectEl = vnode.elm;
+        app.smartSelect.create(extend({
+          el: smartSelectEl
+        }, $(smartSelectEl).dataset()));
+      },
+
+      destroy(vnode) {
+        const smartSelectEl = vnode.elm;
+
+        if (smartSelectEl.f7SmartSelect && smartSelectEl.f7SmartSelect.destroy) {
+          smartSelectEl.f7SmartSelect.destroy();
+        }
+      }
+
+    }
+  }
+};

package/components/smart-select/smart-select.umd.js

@@ -0,0 +1 @@
+(function framework7ComponentLoader(e,t){void 0===t&&(t=!0);var a=e.$,s=e.utils,r=(e.getDevice,e.getSupport,e.Class),l=(e.Modal,e.ConstructorMethods),o=(e.ModalMethods,s.extend),n=s.id,i=s.nextTick,c=s.deleteProps;class p extends r{constructor(e,t={}){super(t,[e]);const s=this,r=o({on:{}},e.params.smartSelect);void 0===r.searchbarDisableButton&&(r.searchbarDisableButton="aurora"!==e.theme),s.useModulesParams(r),s.params=o({},r,t),s.app=e;const l=a(s.params.el).eq(0);if(0===l.length)return s;if(l[0].f7SmartSelect)return l[0].f7SmartSelect;const i=l.find("select").eq(0);if(0===i.length)return s;let c;s.params.setValueText&&(c=a(s.params.valueEl),0===c.length&&(c=l.find(".item-after")),0===c.length&&(c=a('<div class="item-after"></div>'),c.insertAfter(l.find(".item-title"))));let p=t.url;p||(l.attr("href")&&"#"!==l.attr("href")?p=l.attr("href"):i.attr("name")&&(p=`${i.attr("name").toLowerCase()}-select/`)),p||(p=s.params.url);const d=i[0].multiple,m=d?"checkbox":"radio",u=n();function h(){s.open()}function v(){const e=s.$selectEl.val();s.$el.trigger("smartselect:change",e),s.emit("local::change smartSelectChange",s,e),s.vl&&s.vl.clearCache(),s.setValueText()}function f(){let e,t;const r=this,l=r.value;let o,n=[];if("checkbox"===r.type){for(let i=0;i<s.selectEl.options.length;i+=1)e=s.selectEl.options[i],e.value===l&&(e.selected=r.checked),e.selected&&(o=e.dataset?e.dataset.displayAs:a(e).data("display-value-as"),t=o&&void 0!==o?o:e.textContent,n.push(t.trim()));s.maxLength&&s.checkMaxLength()}else e=s.$selectEl.find(`option[value="${l}"]`)[0],e||(e=s.$selectEl.find("option").filter((e=>e.value===l))[0]),o=e.dataset?e.dataset.displayAs:a(e).data("display-as"),t=o&&void 0!==o?o:e.textContent,n=[t],s.selectEl.value=l;s.$selectEl.trigger("change"),s.params.setValueText&&s.$valueEl.text(s.formatValueText(n)),s.params.closeOnSelect&&"radio"===s.inputType&&s.close()}return o(s,{$el:l,el:l[0],$selectEl:i,selectEl:i[0],$valueEl:c,valueEl:c&&c[0],url:p,multiple:d,inputType:m,id:u,inputName:`${m}-${u}`,selectName:i.attr("name"),maxLength:i.attr("maxlength")||t.maxLength}),l[0].f7SmartSelect=s,s.attachEvents=function(){l.on("click",h),l.on("change","select",v)},s.detachEvents=function(){l.off("click",h),l.off("change","select",v)},s.attachInputsEvents=function(){s.$containerEl.on("change",'input[type="checkbox"], input[type="radio"]',f)},s.detachInputsEvents=function(){s.$containerEl.off("change",'input[type="checkbox"], input[type="radio"]',f)},s.useModules(),s.init(),s}setValue(e){const t=this;let s,r,l,o=e,n=[];if(t.multiple){Array.isArray(o)||(o=[o]);for(let e=0;e<t.selectEl.options.length;e+=1)s=t.selectEl.options[e],o.indexOf(s.value)>=0?s.selected=!0:s.selected=!1,s.selected&&(r=s.dataset?s.dataset.displayAs:a(s).data("display-value-as"),l=r&&void 0!==r?r:s.textContent,n.push(l.trim()))}else s=t.$selectEl.find(`option[value="${o}"]`)[0],s&&(r=s.dataset?s.dataset.displayAs:a(s).data("display-as"),l=r&&void 0!==r?r:s.textContent,n=[l]),t.selectEl.value=o;return t.params.setValueText&&t.$valueEl.text(t.formatValueText(n)),t.$selectEl.trigger("change"),t}unsetValue(){const e=this;e.params.setValueText&&e.$valueEl.text(e.formatValueText([])),e.$selectEl.find("option").each((e=>{e.selected=!1,e.checked=!1})),e.$selectEl[0].value=null,e.$containerEl&&e.$containerEl.find(`input[name="${e.inputName}"][type="checkbox"], input[name="${e.inputName}"][type="radio"]`).prop("checked",!1),e.$selectEl.trigger("change")}getValue(){return this.$selectEl.val()}get view(){const{params:e,$el:t}=this;let a;if(e.view&&(a=e.view),a||(a=t.parents(".view").length&&t.parents(".view")[0].f7View),!a&&"page"===e.openIn)throw Error("Smart Select requires initialized View");return a}checkMaxLength(){const e=this,t=e.$containerEl;e.selectEl.selectedOptions.length>=e.maxLength?t.find('input[type="checkbox"]').each((e=>{e.checked?a(e).parents("li").removeClass("disabled"):a(e).parents("li").addClass("disabled")})):t.find(".disabled").removeClass("disabled")}formatValueText(e){const t=this;let a;return a=t.params.formatValueText?t.params.formatValueText.call(t,e,t):e.join(", "),a}setValueText(e){const t=this;let s=[];void 0!==e?s=Array.isArray(e)?e:[e]:t.$selectEl.find("option").each((e=>{const t=a(e);if(e.selected){const a=e.dataset?e.dataset.displayAs:t.data("display-value-as");a&&void 0!==a?s.push(a):s.push(e.textContent.trim())}})),t.params.setValueText&&t.$valueEl.text(t.formatValueText(s))}getItemsData(){const e=this,t=e.app.theme,s=[];let r;return e.$selectEl.find("option").each((l=>{const o=a(l),n=o.dataset(),i=n.optionImage||e.params.optionImage,c=n.optionIcon||e.params.optionIcon,p="ios"===t&&(n.optionIconIos||e.params.optionIconIos),d="md"===t&&(n.optionIconMd||e.params.optionIconMd),m="aurora"===t&&(n.optionIconAurora||e.params.optionIconAurora),u=i||c||p||d||m,h=n.optionColor;let v=n.optionClass||"";o[0].disabled&&(v+=" disabled");const f=o.parent("optgroup")[0],$=f&&f.label;let b=!1;f&&f!==r&&(b=!0,r=f,s.push({groupLabel:$,isLabel:b})),s.push({value:o[0].value,text:o[0].textContent.trim(),selected:o[0].selected,groupEl:f,groupLabel:$,image:i,icon:c,iconIos:p,iconMd:d,iconAurora:m,color:h,className:v,disabled:o[0].disabled,id:e.id,hasMedia:u,checkbox:"checkbox"===e.inputType,radio:"radio"===e.inputType,inputName:e.inputName,inputType:e.inputType})})),e.items=s,s}renderSearchbar(){const e=this;return e.params.renderSearchbar?e.params.renderSearchbar.call(e):$jsx("form",{class:"searchbar"},$jsx("div",{class:"searchbar-inner"},$jsx("div",{class:"searchbar-input-wrap"},$jsx("input",{type:"search",spellcheck:e.params.searchbarSpellcheck||"false",placeholder:e.params.searchbarPlaceholder}),$jsx("i",{class:"searchbar-icon"}),$jsx("span",{class:"input-clear-button"})),e.params.searchbarDisableButton&&$jsx("span",{class:"searchbar-disable-button"},e.params.searchbarDisableText)))}renderItem(e,t){const a=this;if(a.params.renderItem)return a.params.renderItem.call(a,e,t);let s;if(e.isLabel)s=`<li class="item-divider">${e.groupLabel}</li>`;else{let t,r=e.selected;if(a.params.virtualList){const s=a.getValue();r=a.multiple?s.indexOf(e.value)>=0:s===e.value,a.multiple&&(t=a.multiple&&!r&&s.length===parseInt(a.maxLength,10))}const{icon:l,iconIos:o,iconMd:n,iconAurora:i}=e,c=l||o||n||i,p=function(e=""){return e.indexOf(":")>=0?e.split(":")[1]:""}(l||o||n||i||""),d=function(e=""){if(e.indexOf(":")>=0){let t=e.split(":")[0];return"f7"===t&&(t="f7-icons"),"material"===t&&(t="material-icons"),t}return e}(l||o||n||i||"");s=$jsx("li",{class:`${e.className||""}${t?" disabled":""}`},$jsx("label",{class:`item-${e.inputType} item-content`},$jsx("input",{type:e.inputType,name:e.inputName,value:e.value,_checked:r}),$jsx("i",{class:`icon icon-${e.inputType}`}),e.hasMedia&&$jsx("div",{class:"item-media"},c&&$jsx("i",{class:`icon ${d}`},p),e.image&&$jsx("img",{src:e.image})),$jsx("div",{class:"item-inner"},$jsx("div",{class:"item-title"+(e.color?` text-color-${e.color}`:"")},e.text))))}return s}renderItems(){const e=this;if(e.params.renderItems)return e.params.renderItems.call(e,e.items);return`\n        ${e.items.map(((t,a)=>`${e.renderItem(t,a)}`)).join("")}\n      `}renderPage(){const e=this;if(e.params.renderPage)return e.params.renderPage.call(e,e.items);let t=e.params.pageTitle;if(void 0===t){const a=e.$el.find(".item-title");t=a.length?a.text().trim():""}const a=e.params.cssClass;return $jsx("div",{class:`page smart-select-page ${a}`,"data-name":"smart-select-page","data-select-name":e.selectName},$jsx("div",{class:"navbar "+(e.params.navbarColorTheme?`color-${e.params.navbarColorTheme}`:"")},$jsx("div",{class:"navbar-bg"}),$jsx("div",{class:"navbar-inner sliding "+(e.params.navbarColorTheme?`color-${e.params.navbarColorTheme}`:"")},$jsx("div",{class:"left"},$jsx("a",{class:"link back"},$jsx("i",{class:"icon icon-back"}),$jsx("span",{class:"if-not-md"},e.params.pageBackLinkText))),t&&$jsx("div",{class:"title"},t),e.params.searchbar&&$jsx("div",{class:"subnavbar"},e.renderSearchbar()))),e.params.searchbar&&$jsx("div",{class:"searchbar-backdrop"}),$jsx("div",{class:"page-content"},$jsx("div",{class:`list smart-select-list-${e.id} ${e.params.virtualList?" virtual-list":""} ${e.params.formColorTheme?`color-${e.params.formColorTheme}`:""}`},$jsx("ul",null,!e.params.virtualList&&e.renderItems(e.items)))))}renderPopup(){const e=this;if(e.params.renderPopup)return e.params.renderPopup.call(e,e.items);let t=e.params.pageTitle;if(void 0===t){const a=e.$el.find(".item-title");t=a.length?a.text().trim():""}const a=e.params.cssClass||"";return $jsx("div",{class:`popup smart-select-popup ${a} ${e.params.popupTabletFullscreen?"popup-tablet-fullscreen":""}`,"data-select-name":e.selectName},$jsx("div",{class:"view"},$jsx("div",{class:"page smart-select-page "+(e.params.searchbar?"page-with-subnavbar":""),"data-name":"smart-select-page"},$jsx("div",{class:"navbar "+(e.params.navbarColorTheme?`color-${e.params.navbarColorTheme}`:"")},$jsx("div",{class:"navbar-bg"}),$jsx("div",{class:"navbar-inner sliding"},t&&$jsx("div",{class:"title"},t),$jsx("div",{class:"right"},$jsx("a",{class:"link popup-close","data-popup":`.smart-select-popup[data-select-name='${e.selectName}']`},e.params.popupCloseLinkText)),e.params.searchbar&&$jsx("div",{class:"subnavbar"},e.renderSearchbar()))),e.params.searchbar&&$jsx("div",{class:"searchbar-backdrop"}),$jsx("div",{class:"page-content"},$jsx("div",{class:`list smart-select-list-${e.id} ${e.params.virtualList?" virtual-list":""} ${e.params.formColorTheme?`color-${e.params.formColorTheme}`:""}`},$jsx("ul",null,!e.params.virtualList&&e.renderItems(e.items)))))))}renderSheet(){const e=this;if(e.params.renderSheet)return e.params.renderSheet.call(e,e.items);const t=e.params.cssClass;return $jsx("div",{class:`sheet-modal smart-select-sheet ${t}`,"data-select-name":e.selectName},$jsx("div",{class:"toolbar toolbar-top "+(e.params.toolbarColorTheme?`color-${e.params.toolbarColorTheme}`:"")},$jsx("div",{class:"toolbar-inner"},$jsx("div",{class:"left"}),$jsx("div",{class:"right"},$jsx("a",{class:"link sheet-close"},e.params.sheetCloseLinkText)))),$jsx("div",{class:"sheet-modal-inner"},$jsx("div",{class:"page-content"},$jsx("div",{class:`list smart-select-list-${e.id} ${e.params.virtualList?" virtual-list":""} ${e.params.formColorTheme?`color-${e.params.formColorTheme}`:""}`},$jsx("ul",null,!e.params.virtualList&&e.renderItems(e.items))))))}renderPopover(){const e=this;if(e.params.renderPopover)return e.params.renderPopover.call(e,e.items);const t=e.params.cssClass;return $jsx("div",{class:`popover smart-select-popover ${t}`,"data-select-name":e.selectName},$jsx("div",{class:"popover-inner"},$jsx("div",{class:`list smart-select-list-${e.id} ${e.params.virtualList?" virtual-list":""} ${e.params.formColorTheme?`color-${e.params.formColorTheme}`:""}`},$jsx("ul",null,!e.params.virtualList&&e.renderItems(e.items)))))}scrollToSelectedItem(){const e=this,{params:t,$containerEl:a}=e;if(!e.opened)return e;if(t.virtualList){let t;e.vl.items.forEach(((e,a)=>{void 0===t&&e.selected&&(t=a)})),void 0!==t&&e.vl.scrollToItem(t)}else{const t=a.find("input:checked").parents("li");if(!t.length)return e;const s=a.find(".page-content, .popover-inner");if(!s.length)return e;s.scrollTop(t.offset().top-s.offset().top-parseInt(s.css("padding-top"),10))}return e}onOpen(e,t){const s=this,r=s.app,l=a(t);if(s.$containerEl=l,s.openedIn=e,s.opened=!0,s.params.virtualList&&(s.vl=r.virtualList.create({el:l.find(".virtual-list"),items:s.items,renderItem:s.renderItem.bind(s),height:s.params.virtualListHeight,searchByItem:(e,t)=>!!(t.text&&t.text.toLowerCase().indexOf(e.trim().toLowerCase())>=0)})),s.params.scrollToSelectedItem&&s.scrollToSelectedItem(),s.params.searchbar){let t=l.find(".searchbar");if("page"===e&&"ios"===r.theme&&(t=a(r.navbar.getElByPage(l)).find(".searchbar")),s.params.appendSearchbarNotFound&&("page"===e||"popup"===e)){let e=null;e="string"==typeof s.params.appendSearchbarNotFound?a(`<div class="block searchbar-not-found">${s.params.appendSearchbarNotFound}</div>`):"boolean"==typeof s.params.appendSearchbarNotFound?a('<div class="block searchbar-not-found">Nothing found</div>'):s.params.appendSearchbarNotFound,e&&l.find(".page-content").append(e[0])}const n=o({el:t,backdropEl:l.find(".searchbar-backdrop"),searchContainer:`.smart-select-list-${s.id}`,searchIn:".item-title"},"object"==typeof s.params.searchbar?s.params.searchbar:{});s.searchbar=r.searchbar.create(n)}s.maxLength&&s.checkMaxLength(),s.params.closeOnSelect&&s.$containerEl.find(`input[type="radio"][name="${s.inputName}"]:checked`).parents("label").once("click",(()=>{s.close()})),s.attachInputsEvents(),s.$el.trigger("smartselect:open"),s.emit("local::open smartSelectOpen",s)}onOpened(){const e=this;e.$el.trigger("smartselect:opened"),e.emit("local::opened smartSelectOpened",e)}onClose(){const e=this;e.destroyed||(e.vl&&e.vl.destroy&&(e.vl.destroy(),e.vl=null,delete e.vl),e.searchbar&&e.searchbar.destroy&&(e.searchbar.destroy(),e.searchbar=null,delete e.searchbar),e.detachInputsEvents(),e.$el.trigger("smartselect:close"),e.emit("local::close smartSelectClose",e))}onClosed(){const e=this;e.destroyed||(e.opened=!1,e.$containerEl=null,delete e.$containerEl,e.$el.trigger("smartselect:closed"),e.emit("local::closed smartSelectClosed",e))}openPage(){const e=this;if(e.opened)return e;e.getItemsData();const t=e.renderPage(e.items);return e.view.router.navigate({url:e.url,route:{content:t,path:e.url,on:{pageBeforeIn(t,a){e.onOpen("page",a.el)},pageAfterIn(t,a){e.onOpened("page",a.el)},pageBeforeOut(t,a){e.onClose("page",a.el)},pageAfterOut(t,a){e.onClosed("page",a.el)}}}}),e}openPopup(){const e=this;if(e.opened)return e;e.getItemsData();const t={content:e.renderPopup(e.items),push:e.params.popupPush,swipeToClose:e.params.popupSwipeToClose,on:{popupOpen(t){e.onOpen("popup",t.el)},popupOpened(t){e.onOpened("popup",t.el)},popupClose(t){e.onClose("popup",t.el)},popupClosed(t){e.onClosed("popup",t.el)}}};return e.params.routableModals&&e.view?e.view.router.navigate({url:e.url,route:{path:e.url,popup:t}}):e.modal=e.app.popup.create(t).open(),e}openSheet(){const e=this;if(e.opened)return e;e.getItemsData();const t={content:e.renderSheet(e.items),backdrop:e.params.sheetBackdrop,scrollToEl:e.$el,closeByOutsideClick:!0,push:e.params.sheetPush,swipeToClose:e.params.sheetSwipeToClose,on:{sheetOpen(t){e.onOpen("sheet",t.el)},sheetOpened(t){e.onOpened("sheet",t.el)},sheetClose(t){e.onClose("sheet",t.el)},sheetClosed(t){e.onClosed("sheet",t.el)}}};return e.params.routableModals&&e.view?e.view.router.navigate({url:e.url,route:{path:e.url,sheet:t}}):e.modal=e.app.sheet.create(t).open(),e}openPopover(){const e=this;if(e.opened)return e;e.getItemsData();const t={content:e.renderPopover(e.items),targetEl:e.$el,on:{popoverOpen(t){e.onOpen("popover",t.el)},popoverOpened(t){e.onOpened("popover",t.el)},popoverClose(t){e.onClose("popover",t.el)},popoverClosed(t){e.onClosed("popover",t.el)}}};return e.params.routableModals&&e.view?e.view.router.navigate({url:e.url,route:{path:e.url,popover:t}}):e.modal=e.app.popover.create(t).open(),e}open(e){const t=this;if(t.opened)return t;let a=!1;function s(){a=!0}if(t.$el&&t.$el.trigger("smartselect:beforeopen",{prevent:s}),t.emit("local::beforeOpen smartSelectBeforeOpen",t,s),a)return t;return t[`open${(e||t.params.openIn).split("").map(((e,t)=>0===t?e.toUpperCase():e)).join("")}`](),t}close(){const e=this;return e.opened?(e.params.routableModals&&e.view||"page"===e.openedIn?e.view.router.back():(e.modal.once("modalClosed",(()=>{i((()=>{e.destroyed||(e.modal.destroy(),delete e.modal)}))})),e.modal.close()),e):e}init(){this.attachEvents(),this.setValueText()}destroy(){const e=this;e.emit("local::beforeDestroy smartSelectBeforeDestroy",e),e.$el.trigger("smartselect:beforedestroy"),e.detachEvents(),delete e.$el[0].f7SmartSelect,c(e),e.destroyed=!0}}var d={name:"smartSelect",params:{smartSelect:{el:void 0,valueEl:void 0,setValueText:!0,formatValueText:null,openIn:"page",popupPush:!1,popupSwipeToClose:void 0,sheetPush:!1,sheetSwipeToClose:void 0,sheetBackdrop:!1,pageTitle:void 0,pageBackLinkText:"Back",popupCloseLinkText:"Close",popupTabletFullscreen:!1,sheetCloseLinkText:"Done",searchbar:!1,searchbarPlaceholder:"Search",searchbarDisableText:"Cancel",searchbarDisableButton:void 0,searchbarSpellcheck:!1,closeOnSelect:!1,virtualList:!1,virtualListHeight:void 0,scrollToSelectedItem:!1,formColorTheme:void 0,navbarColorTheme:void 0,routableModals:!1,url:"select/",cssClass:"",renderPage:void 0,renderPopup:void 0,renderSheet:void 0,renderPopover:void 0,renderItems:void 0,renderItem:void 0,renderSearchbar:void 0}},static:{SmartSelect:p},create(){const e=this;e.smartSelect=o(l({defaultSelector:".smart-select",constructor:p,app:e,domProp:"f7SmartSelect"}),{open(t){const a=e.smartSelect.get(t);if(a&&a.open)return a.open()},close(t){const a=e.smartSelect.get(t);if(a&&a.close)return a.close()}})},on:{tabMounted(e){const t=this;a(e).find(".smart-select-init").each((e=>{t.smartSelect.create(o({el:e},a(e).dataset()))}))},tabBeforeRemove(e){a(e).find(".smart-select-init").each((e=>{e.f7SmartSelect&&e.f7SmartSelect.destroy&&e.f7SmartSelect.destroy()}))},pageInit(e){const t=this;e.$el.find(".smart-select-init").each((e=>{t.smartSelect.create(o({el:e},a(e).dataset()))}))},pageBeforeRemove(e){e.$el.find(".smart-select-init").each((e=>{e.f7SmartSelect&&e.f7SmartSelect.destroy&&e.f7SmartSelect.destroy()}))}},clicks:{".smart-select":function(e,t){const a=this;if(!e[0].f7SmartSelect){a.smartSelect.create(o({el:e},t)).open()}}},vnode:{"smart-select-init":{insert(e){const t=e.elm;this.smartSelect.create(o({el:t},a(t).dataset()))},destroy(e){const t=e.elm;t.f7SmartSelect&&t.f7SmartSelect.destroy&&t.f7SmartSelect.destroy()}}}};if(t){if(e.prototype.modules&&e.prototype.modules[d.name])return;e.use(d),e.instance&&(e.instance.useModuleParams(d,e.instance.params),e.instance.useModule(d))}return d}(Framework7, typeof Framework7AutoInstallComponent === 'undefined' ? undefined : Framework7AutoInstallComponent))

package/components/sortable/sortable-rtl.css

@@ -1 +1 @@
-:root{--f7-sortable-handler-color:rgba(0, 0, 0, 0.22);--f7-sortable-sorting-item-bg-color:rgba(255, 255, 255, 0.8)}:root .theme-dark,:root.theme-dark{--f7-sortable-sorting-item-bg-color:rgba(50, 50, 50, 0.8);--f7-sortable-handler-color:rgba(255, 255, 255, 0.55)}.ios{--f7-sortable-handler-width:36px;--f7-sortable-sorting-item-box-shadow:0px 2px 8px rgba(0, 0, 0, 0.6)}.md{--f7-sortable-handler-width:42px;--f7-sortable-sorting-item-box-shadow:var(--f7-elevation-2)}.aurora{--f7-sortable-handler-width:42px;--f7-sortable-sorting-item-box-shadow:var(--f7-elevation-2)}.sortable .sortable-handler{width:var(--f7-sortable-handler-width);height:100%;position:absolute;top:0;z-index:10;opacity:0;pointer-events:none;cursor:move;transition-duration:.3s;display:flex;align-items:center;justify-content:center;overflow:hidden;left:var(--f7-safe-area-left)}.sortable .sortable-handler:after{font-family:framework7-core-icons;font-weight:400;font-style:normal;line-height:1;letter-spacing:normal;text-transform:none;white-space:nowrap;word-wrap:normal;direction:ltr;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale;font-feature-settings:'liga';text-align:center;display:block;width:100%;height:100%;font-size:20px;transition-duration:.3s;transform:translateX(10px);color:var(--f7-sortable-handler-color);overflow:hidden;height:20px;width:18px}.sortable li.sorting{z-index:50;background:var(--f7-sortable-sorting-item-bg-color);transition-duration:0s;box-shadow:var(--f7-sortable-sorting-item-box-shadow)}.sortable li.sorting .item-inner:after{display:none!important}.sortable-opposite .sortable-handler{right:var(--f7-safe-area-left);left:auto}.sortable-opposite .sortable-handler:after{transform:translateX(-10px)}.sortable-opposite .item-content,.sortable-opposite.links-list li a,.sortable.simple-list li,.sortable:not(.sortable-opposite) .item-inner{transition-duration:.3s;transition-property:all}.sortable-sorting li{transition-duration:.3s}.sortable-enabled li:not(.no-sorting):not(.disallow-sorting) .sortable-handler{pointer-events:auto;opacity:1}.sortable-enabled li:not(.no-sorting):not(.disallow-sorting) .sortable-handler:after{transform:translateX(0px)}.sortable-enabled:not(.sortable-opposite) li:not(.no-sorting):not(.disallow-sorting) .item-link .item-inner:before,.sortable-enabled:not(.sortable-opposite) li:not(.no-sorting):not(.disallow-sorting) .item-link .item-title-row:before,.sortable-enabled:not(.sortable-opposite).links-list li:not(.no-sorting):not(.disallow-sorting)>a:before{display:none}.links-list.sortable-enabled:not(.sortable-opposite) li:not(.no-sorting):not(.disallow-sorting) a,.no-chevron .sortable-enabled:not(.sortable-opposite) li:not(.no-sorting):not(.disallow-sorting) .item-link .item-inner,.simple-list.sortable-enabled:not(.sortable-opposite) li:not(.no-sorting):not(.disallow-sorting),.sortable-enabled :not(.sortable-opposite).no-chevron .item-link .item-inner,.sortable-enabled.no-chevron:not(.sortable-opposite) li:not(.no-sorting):not(.disallow-sorting) .item-link .item-inner,.sortable-enabled:not(.sortable-opposite) li:not(.no-sorting):not(.disallow-sorting) .item-inner,.sortable-enabled:not(.sortable-opposite) li:not(.no-sorting):not(.disallow-sorting) .item-link .item-inner,.sortable-enabled:not(.sortable-opposite) li:not(.no-sorting):not(.disallow-sorting) .item-link.no-chevron .item-inner{padding-left:calc(var(--f7-sortable-handler-width) + var(--f7-safe-area-right))}.links-list.sortable-opposite.sortable-enabled li:not(.no-sorting):not(.disallow-sorting) a,.simple-list.sortable-opposite.sortable-enabled li:not(.no-sorting):not(.disallow-sorting),.sortable-opposite.sortable-enabled li:not(.no-sorting):not(.disallow-sorting) .item-content{padding-right:calc(var(--f7-sortable-handler-width) + var(--f7-safe-area-right))}.ios .sortable-handler:after{content:'sort_ios'}.md .sortable-handler:after{content:'sort_md'}.aurora .sortable-handler:after{content:'sort_md'}
+:root{--f7-sortable-handler-color:rgba(0, 0, 0, 0.22);--f7-sortable-sorting-item-bg-color:rgba(255, 255, 255, 0.8)}:root .dark,:root.dark{--f7-sortable-sorting-item-bg-color:rgba(50, 50, 50, 0.8);--f7-sortable-handler-color:rgba(255, 255, 255, 0.55)}.ios{--f7-sortable-handler-width:36px;--f7-sortable-sorting-item-box-shadow:0px 2px 8px rgba(0, 0, 0, 0.6)}.md{--f7-sortable-handler-width:42px;--f7-sortable-sorting-item-box-shadow:var(--f7-elevation-2)}.aurora{--f7-sortable-handler-width:42px;--f7-sortable-sorting-item-box-shadow:var(--f7-elevation-2)}.sortable .sortable-handler{width:var(--f7-sortable-handler-width);height:100%;position:absolute;top:0;z-index:10;opacity:0;pointer-events:none;cursor:move;transition-duration:.3s;display:flex;align-items:center;justify-content:center;overflow:hidden;left:var(--f7-safe-area-left)}.sortable .sortable-handler:after{font-family:framework7-core-icons;font-weight:400;font-style:normal;line-height:1;letter-spacing:normal;text-transform:none;white-space:nowrap;word-wrap:normal;direction:ltr;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale;font-feature-settings:'liga';text-align:center;display:block;width:100%;height:100%;font-size:20px;transition-duration:.3s;transform:translateX(10px);color:var(--f7-sortable-handler-color);overflow:hidden;height:20px;width:18px}.sortable li.sorting{z-index:50;background:var(--f7-sortable-sorting-item-bg-color);transition-duration:0s;box-shadow:var(--f7-sortable-sorting-item-box-shadow)}.sortable li.sorting .item-inner:after{display:none!important}.sortable-opposite .sortable-handler{right:var(--f7-safe-area-left);left:auto}.sortable-opposite .sortable-handler:after{transform:translateX(-10px)}.sortable-opposite .item-content,.sortable-opposite.links-list li a,.sortable.simple-list li,.sortable:not(.sortable-opposite) .item-inner{transition-duration:.3s;transition-property:all}.sortable-sorting li{transition-duration:.3s}.sortable-enabled li:not(.no-sorting):not(.disallow-sorting) .sortable-handler{pointer-events:auto;opacity:1}.sortable-enabled li:not(.no-sorting):not(.disallow-sorting) .sortable-handler:after{transform:translateX(0px)}.sortable-enabled:not(.sortable-opposite) li:not(.no-sorting):not(.disallow-sorting) .item-link .item-inner:before,.sortable-enabled:not(.sortable-opposite) li:not(.no-sorting):not(.disallow-sorting) .item-link .item-title-row:before,.sortable-enabled:not(.sortable-opposite).links-list li:not(.no-sorting):not(.disallow-sorting)>a:before{display:none}.links-list.sortable-enabled:not(.sortable-opposite) li:not(.no-sorting):not(.disallow-sorting) a,.no-chevron .sortable-enabled:not(.sortable-opposite) li:not(.no-sorting):not(.disallow-sorting) .item-link .item-inner,.simple-list.sortable-enabled:not(.sortable-opposite) li:not(.no-sorting):not(.disallow-sorting),.sortable-enabled :not(.sortable-opposite).no-chevron .item-link .item-inner,.sortable-enabled.no-chevron:not(.sortable-opposite) li:not(.no-sorting):not(.disallow-sorting) .item-link .item-inner,.sortable-enabled:not(.sortable-opposite) li:not(.no-sorting):not(.disallow-sorting) .item-inner,.sortable-enabled:not(.sortable-opposite) li:not(.no-sorting):not(.disallow-sorting) .item-link .item-inner,.sortable-enabled:not(.sortable-opposite) li:not(.no-sorting):not(.disallow-sorting) .item-link.no-chevron .item-inner{padding-left:calc(var(--f7-sortable-handler-width) + var(--f7-safe-area-right))}.links-list.sortable-opposite.sortable-enabled li:not(.no-sorting):not(.disallow-sorting) a,.simple-list.sortable-opposite.sortable-enabled li:not(.no-sorting):not(.disallow-sorting),.sortable-opposite.sortable-enabled li:not(.no-sorting):not(.disallow-sorting) .item-content{padding-right:calc(var(--f7-sortable-handler-width) + var(--f7-safe-area-right))}.ios .sortable-handler:after{content:'sort_ios'}.md .sortable-handler:after{content:'sort_md'}.aurora .sortable-handler:after{content:'sort_md'}

package/components/sortable/sortable.css

@@ -1 +1 @@
-:root{--f7-sortable-handler-color:rgba(0, 0, 0, 0.22);--f7-sortable-sorting-item-bg-color:rgba(255, 255, 255, 0.8)}:root .theme-dark,:root.theme-dark{--f7-sortable-sorting-item-bg-color:rgba(50, 50, 50, 0.8);--f7-sortable-handler-color:rgba(255, 255, 255, 0.55)}.ios{--f7-sortable-handler-width:36px;--f7-sortable-sorting-item-box-shadow:0px 2px 8px rgba(0, 0, 0, 0.6)}.md{--f7-sortable-handler-width:42px;--f7-sortable-sorting-item-box-shadow:var(--f7-elevation-2)}.aurora{--f7-sortable-handler-width:42px;--f7-sortable-sorting-item-box-shadow:var(--f7-elevation-2)}.sortable .sortable-handler{width:var(--f7-sortable-handler-width);height:100%;position:absolute;top:0;z-index:10;opacity:0;pointer-events:none;cursor:move;transition-duration:.3s;display:flex;align-items:center;justify-content:center;overflow:hidden;right:var(--f7-safe-area-right)}.sortable .sortable-handler:after{font-family:framework7-core-icons;font-weight:400;font-style:normal;line-height:1;letter-spacing:normal;text-transform:none;white-space:nowrap;word-wrap:normal;direction:ltr;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale;font-feature-settings:'liga';text-align:center;display:block;width:100%;height:100%;font-size:20px;transition-duration:.3s;transform:translateX(10px);color:var(--f7-sortable-handler-color);overflow:hidden;height:20px;width:18px}.sortable li.sorting{z-index:50;background:var(--f7-sortable-sorting-item-bg-color);transition-duration:0s;box-shadow:var(--f7-sortable-sorting-item-box-shadow)}.sortable li.sorting .item-inner:after{display:none!important}.sortable-opposite .sortable-handler{left:var(--f7-safe-area-right);right:auto}.sortable-opposite .sortable-handler:after{transform:translateX(-10px)}.sortable-opposite .item-content,.sortable-opposite.links-list li a,.sortable.simple-list li,.sortable:not(.sortable-opposite) .item-inner{transition-duration:.3s;transition-property:all}.sortable-sorting li{transition-duration:.3s}.sortable-enabled li:not(.no-sorting):not(.disallow-sorting) .sortable-handler{pointer-events:auto;opacity:1}.sortable-enabled li:not(.no-sorting):not(.disallow-sorting) .sortable-handler:after{transform:translateX(0px)}.sortable-enabled:not(.sortable-opposite) li:not(.no-sorting):not(.disallow-sorting) .item-link .item-inner:before,.sortable-enabled:not(.sortable-opposite) li:not(.no-sorting):not(.disallow-sorting) .item-link .item-title-row:before,.sortable-enabled:not(.sortable-opposite).links-list li:not(.no-sorting):not(.disallow-sorting)>a:before{display:none}.links-list.sortable-enabled:not(.sortable-opposite) li:not(.no-sorting):not(.disallow-sorting) a,.no-chevron .sortable-enabled:not(.sortable-opposite) li:not(.no-sorting):not(.disallow-sorting) .item-link .item-inner,.simple-list.sortable-enabled:not(.sortable-opposite) li:not(.no-sorting):not(.disallow-sorting),.sortable-enabled :not(.sortable-opposite).no-chevron .item-link .item-inner,.sortable-enabled.no-chevron:not(.sortable-opposite) li:not(.no-sorting):not(.disallow-sorting) .item-link .item-inner,.sortable-enabled:not(.sortable-opposite) li:not(.no-sorting):not(.disallow-sorting) .item-inner,.sortable-enabled:not(.sortable-opposite) li:not(.no-sorting):not(.disallow-sorting) .item-link .item-inner,.sortable-enabled:not(.sortable-opposite) li:not(.no-sorting):not(.disallow-sorting) .item-link.no-chevron .item-inner{padding-right:calc(var(--f7-sortable-handler-width) + var(--f7-safe-area-right))}.links-list.sortable-opposite.sortable-enabled li:not(.no-sorting):not(.disallow-sorting) a,.simple-list.sortable-opposite.sortable-enabled li:not(.no-sorting):not(.disallow-sorting),.sortable-opposite.sortable-enabled li:not(.no-sorting):not(.disallow-sorting) .item-content{padding-left:calc(var(--f7-sortable-handler-width) + var(--f7-safe-area-right))}.ios .sortable-handler:after{content:'sort_ios'}.md .sortable-handler:after{content:'sort_md'}.aurora .sortable-handler:after{content:'sort_md'}
+:root{--f7-sortable-handler-color:rgba(0, 0, 0, 0.22);--f7-sortable-sorting-item-bg-color:rgba(255, 255, 255, 0.8)}:root .dark,:root.dark{--f7-sortable-sorting-item-bg-color:rgba(50, 50, 50, 0.8);--f7-sortable-handler-color:rgba(255, 255, 255, 0.55)}.ios{--f7-sortable-handler-width:36px;--f7-sortable-sorting-item-box-shadow:0px 2px 8px rgba(0, 0, 0, 0.6)}.md{--f7-sortable-handler-width:42px;--f7-sortable-sorting-item-box-shadow:var(--f7-elevation-2)}.aurora{--f7-sortable-handler-width:42px;--f7-sortable-sorting-item-box-shadow:var(--f7-elevation-2)}.sortable .sortable-handler{width:var(--f7-sortable-handler-width);height:100%;position:absolute;top:0;z-index:10;opacity:0;pointer-events:none;cursor:move;transition-duration:.3s;display:flex;align-items:center;justify-content:center;overflow:hidden;right:var(--f7-safe-area-right)}.sortable .sortable-handler:after{font-family:framework7-core-icons;font-weight:400;font-style:normal;line-height:1;letter-spacing:normal;text-transform:none;white-space:nowrap;word-wrap:normal;direction:ltr;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale;font-feature-settings:'liga';text-align:center;display:block;width:100%;height:100%;font-size:20px;transition-duration:.3s;transform:translateX(10px);color:var(--f7-sortable-handler-color);overflow:hidden;height:20px;width:18px}.sortable li.sorting{z-index:50;background:var(--f7-sortable-sorting-item-bg-color);transition-duration:0s;box-shadow:var(--f7-sortable-sorting-item-box-shadow)}.sortable li.sorting .item-inner:after{display:none!important}.sortable-opposite .sortable-handler{left:var(--f7-safe-area-right);right:auto}.sortable-opposite .sortable-handler:after{transform:translateX(-10px)}.sortable-opposite .item-content,.sortable-opposite.links-list li a,.sortable.simple-list li,.sortable:not(.sortable-opposite) .item-inner{transition-duration:.3s;transition-property:all}.sortable-sorting li{transition-duration:.3s}.sortable-enabled li:not(.no-sorting):not(.disallow-sorting) .sortable-handler{pointer-events:auto;opacity:1}.sortable-enabled li:not(.no-sorting):not(.disallow-sorting) .sortable-handler:after{transform:translateX(0px)}.sortable-enabled:not(.sortable-opposite) li:not(.no-sorting):not(.disallow-sorting) .item-link .item-inner:before,.sortable-enabled:not(.sortable-opposite) li:not(.no-sorting):not(.disallow-sorting) .item-link .item-title-row:before,.sortable-enabled:not(.sortable-opposite).links-list li:not(.no-sorting):not(.disallow-sorting)>a:before{display:none}.links-list.sortable-enabled:not(.sortable-opposite) li:not(.no-sorting):not(.disallow-sorting) a,.no-chevron .sortable-enabled:not(.sortable-opposite) li:not(.no-sorting):not(.disallow-sorting) .item-link .item-inner,.simple-list.sortable-enabled:not(.sortable-opposite) li:not(.no-sorting):not(.disallow-sorting),.sortable-enabled :not(.sortable-opposite).no-chevron .item-link .item-inner,.sortable-enabled.no-chevron:not(.sortable-opposite) li:not(.no-sorting):not(.disallow-sorting) .item-link .item-inner,.sortable-enabled:not(.sortable-opposite) li:not(.no-sorting):not(.disallow-sorting) .item-inner,.sortable-enabled:not(.sortable-opposite) li:not(.no-sorting):not(.disallow-sorting) .item-link .item-inner,.sortable-enabled:not(.sortable-opposite) li:not(.no-sorting):not(.disallow-sorting) .item-link.no-chevron .item-inner{padding-right:calc(var(--f7-sortable-handler-width) + var(--f7-safe-area-right))}.links-list.sortable-opposite.sortable-enabled li:not(.no-sorting):not(.disallow-sorting) a,.simple-list.sortable-opposite.sortable-enabled li:not(.no-sorting):not(.disallow-sorting),.sortable-opposite.sortable-enabled li:not(.no-sorting):not(.disallow-sorting) .item-content{padding-left:calc(var(--f7-sortable-handler-width) + var(--f7-safe-area-right))}.ios .sortable-handler:after{content:'sort_ios'}.md .sortable-handler:after{content:'sort_md'}.aurora .sortable-handler:after{content:'sort_md'}

package/components/sortable/sortable.js

@@ -1 +1,293 @@
-(function framework7ComponentLoader(t,e){void 0===e&&(e=!0);var a=t.$,s=t.utils,o=(t.getDevice,t.getSupport),r=(t.Class,t.Modal,t.ConstructorMethods,t.ModalMethods,s.bindMethods),i={init:function(){var t,e,s,r,i,l,n,d,p,v,u,b,f,g,c,h,m,x,w,C,M,I=this;function T(o,r){e=!1,t=!0,M=!1,s="touchstart"===o.type?o.targetTouches[0].pageY:o.pageY,i=a(o.target).closest("li").eq(0),f=i.index(),n=i.parents(".sortable");var d=i.parents(".list-group");d.length&&d.parents(n).length&&(n=d),l=n.children("ul").children("li:not(.disallow-sorting):not(.no-sorting)"),I.panel&&(I.panel.allowOpen=!1),I.swipeout&&(I.swipeout.allow=!1),r&&(i.addClass("sorting"),n.addClass("sortable-sorting"),M=!0)}var L=!!o().passiveListener&&{passive:!1,capture:!1};a(document).on(I.touchEvents.start,".list.sortable .sortable-handler",T,L),I.on("touchmove:active",(function(o){if(t&&i){var f="touchmove"===o.type?o.targetTouches[0].pageY:o.pageY;if(!e){g=i.parents(".page"),c=i.parents(".page-content");var M=parseInt(c.css("padding-top"),10),I=parseInt(c.css("padding-bottom"),10);C=c[0].scrollTop,m=g.offset().top+M,h=g.height()-M-I,i.addClass("sorting"),n.addClass("sortable-sorting"),x=i[0].offsetTop,p=i[0].offsetTop,v=i.parent().height()-x-i.height(),d=i[0].offsetHeight,w=i.offset().top}e=!0,o.preventDefault(),o.f7PreventSwipePanel=!0,r=f-s;var T=c[0].scrollTop-C,L=Math.min(Math.max(r+T,-p),v);i.transform("translate3d(0,"+L+"px,0)");var E,y=44,V=!0;r+T+y<-p&&(V=!1),r+T-y>v&&(V=!1),b=void 0,u=void 0,V&&(w+r+d+y>m+h&&(E=w+r+d+y-(m+h)),w+r<m+y&&(E=w+r-m-y),E&&(c[0].scrollTop+=E)),l.each((function(t){var e=a(t);if(e[0]!==i[0]){var s=e[0].offsetTop,o=e.height(),r=x+L;r>=s-o/2&&i.index()<e.index()?(e.transform("translate3d(0, "+-d+"px,0)"),u=e,b=void 0):r<=s+o/2&&i.index()>e.index()?(e.transform("translate3d(0, "+d+"px,0)"),u=void 0,b||(b=e)):e.transform("translate3d(0, 0%,0)")}}))}})),I.on("touchend:passive",(function(){if(!t||!e)return t&&!e&&(I.panel&&(I.panel.allowOpen=!0),I.swipeout&&(I.swipeout.allow=!0),M&&(i.removeClass("sorting"),n.removeClass("sortable-sorting"))),t=!1,void(e=!1);var a;I.panel&&(I.panel.allowOpen=!0),I.swipeout&&(I.swipeout.allow=!0),l.transform(""),i.removeClass("sorting"),n.removeClass("sortable-sorting"),u?a=u.index():b&&(a=b.index());var s=n.dataset().sortableMoveElements;if(void 0===s&&(s=I.params.sortable.moveElements),s&&(u&&i.insertAfter(u),b&&i.insertBefore(b)),(u||b)&&n.hasClass("virtual-list")){void 0===(f=i[0].f7VirtualListIndex)&&(f=i.attr("data-virtual-list-index")),b?void 0===(a=b[0].f7VirtualListIndex)&&(a=b.attr("data-virtual-list-index")):void 0===(a=u[0].f7VirtualListIndex)&&(a=u.attr("data-virtual-list-index")),a=null!==a?parseInt(a,10):void 0;var o=n[0].f7VirtualList;f&&(f=parseInt(f,10)),a&&(a=parseInt(a,10)),o&&o.moveItem(f,a)}void 0===a||Number.isNaN(a)||a===f||(i.trigger("sortable:sort",{from:f,to:a}),I.emit("sortableSort",i[0],{from:f,to:a,el:i[0]},n[0])),b=void 0,u=void 0,t=!1,e=!1})),a(document).on("taphold",".sortable-tap-hold",(function(t,e){T(e,!0)}))},enable:function(t){void 0===t&&(t=".list.sortable");var e=a(t);0!==e.length&&(e.addClass("sortable-enabled"),e.trigger("sortable:enable"),this.emit("sortableEnable",e[0]))},disable:function(t){void 0===t&&(t=".list.sortable");var e=a(t);0!==e.length&&(e.removeClass("sortable-enabled"),e.trigger("sortable:disable"),this.emit("sortableDisable",e[0]))},toggle:function(t){void 0===t&&(t=".list.sortable");var e=a(t);0!==e.length&&(e.hasClass("sortable-enabled")?this.sortable.disable(e):this.sortable.enable(e))}},l={name:"sortable",params:{sortable:{moveElements:!0}},create:function(){r(this,{sortable:i})},on:{init:function(){this.params.sortable&&this.sortable.init()}},clicks:{".sortable-enable":function(t,e){void 0===e&&(e={});this.sortable.enable(e.sortable)},".sortable-disable":function(t,e){void 0===e&&(e={});this.sortable.disable(e.sortable)},".sortable-toggle":function(t,e){void 0===e&&(e={});this.sortable.toggle(e.sortable)}}};if(e){if(t.prototype.modules&&t.prototype.modules[l.name])return;t.use(l),t.instance&&(t.instance.useModuleParams(l,t.instance.params),t.instance.useModule(l))}return l}(Framework7, typeof Framework7AutoInstallComponent === 'undefined' ? undefined : Framework7AutoInstallComponent))
+import { getDocument } from 'ssr-window';
+import $ from '../../shared/dom7';
+import { bindMethods } from '../../shared/utils';
+import { getSupport } from '../../shared/get-support';
+const Sortable = {
+  init() {
+    const app = this;
+    const document = getDocument();
+    let isTouched;
+    let isMoved;
+    let touchStartY;
+    let touchesDiff;
+    let $sortingEl;
+    let $sortingItems;
+    let $sortableContainer;
+    let sortingElHeight;
+    let minTop;
+    let maxTop;
+    let $insertAfterEl;
+    let $insertBeforeEl;
+    let indexFrom;
+    let $pageEl;
+    let $pageContentEl;
+    let pageHeight;
+    let pageOffset;
+    let sortingElOffsetLocal;
+    let sortingElOffsetTop;
+    let initialScrollTop;
+    let wasTapHold;
+
+    function handleTouchStart(e, isTapHold) {
+      isMoved = false;
+      isTouched = true;
+      wasTapHold = false;
+      touchStartY = e.type === 'touchstart' ? e.targetTouches[0].pageY : e.pageY;
+      $sortingEl = $(e.target).closest('li').eq(0);
+      indexFrom = $sortingEl.index();
+      $sortableContainer = $sortingEl.parents('.sortable');
+      const $listGroup = $sortingEl.parents('.list-group');
+
+      if ($listGroup.length && $listGroup.parents($sortableContainer).length) {
+        $sortableContainer = $listGroup;
+      }
+
+      $sortingItems = $sortableContainer.children('ul').children('li:not(.disallow-sorting):not(.no-sorting)');
+      if (app.panel) app.panel.allowOpen = false;
+      if (app.swipeout) app.swipeout.allow = false;
+
+      if (isTapHold) {
+        $sortingEl.addClass('sorting');
+        $sortableContainer.addClass('sortable-sorting');
+        wasTapHold = true;
+      }
+    }
+
+    function handleTouchMove(e) {
+      if (!isTouched || !$sortingEl) return;
+      const pageY = e.type === 'touchmove' ? e.targetTouches[0].pageY : e.pageY;
+
+      if (!isMoved) {
+        $pageEl = $sortingEl.parents('.page');
+        $pageContentEl = $sortingEl.parents('.page-content');
+        const paddingTop = parseInt($pageContentEl.css('padding-top'), 10);
+        const paddingBottom = parseInt($pageContentEl.css('padding-bottom'), 10);
+        initialScrollTop = $pageContentEl[0].scrollTop;
+        pageOffset = $pageEl.offset().top + paddingTop;
+        pageHeight = $pageEl.height() - paddingTop - paddingBottom;
+        $sortingEl.addClass('sorting');
+        $sortableContainer.addClass('sortable-sorting');
+        sortingElOffsetLocal = $sortingEl[0].offsetTop;
+        minTop = $sortingEl[0].offsetTop;
+        maxTop = $sortingEl.parent().height() - sortingElOffsetLocal - $sortingEl.height();
+        sortingElHeight = $sortingEl[0].offsetHeight;
+        sortingElOffsetTop = $sortingEl.offset().top;
+      }
+
+      isMoved = true;
+      e.preventDefault();
+      e.f7PreventSwipePanel = true;
+      touchesDiff = pageY - touchStartY;
+      const translateScrollOffset = $pageContentEl[0].scrollTop - initialScrollTop;
+      const translate = Math.min(Math.max(touchesDiff + translateScrollOffset, -minTop), maxTop);
+      $sortingEl.transform(`translate3d(0,${translate}px,0)`);
+      const scrollAddition = 44;
+      let allowScroll = true;
+
+      if (touchesDiff + translateScrollOffset + scrollAddition < -minTop) {
+        allowScroll = false;
+      }
+
+      if (touchesDiff + translateScrollOffset - scrollAddition > maxTop) {
+        allowScroll = false;
+      }
+
+      $insertBeforeEl = undefined;
+      $insertAfterEl = undefined;
+      let scrollDiff;
+
+      if (allowScroll) {
+        if (sortingElOffsetTop + touchesDiff + sortingElHeight + scrollAddition > pageOffset + pageHeight) {
+          // To Bottom
+          scrollDiff = sortingElOffsetTop + touchesDiff + sortingElHeight + scrollAddition - (pageOffset + pageHeight);
+        }
+
+        if (sortingElOffsetTop + touchesDiff < pageOffset + scrollAddition) {
+          // To Top
+          scrollDiff = sortingElOffsetTop + touchesDiff - pageOffset - scrollAddition;
+        }
+
+        if (scrollDiff) {
+          $pageContentEl[0].scrollTop += scrollDiff;
+        }
+      }
+
+      $sortingItems.each(el => {
+        const $currentEl = $(el);
+        if ($currentEl[0] === $sortingEl[0]) return;
+        const currentElOffset = $currentEl[0].offsetTop;
+        const currentElHeight = $currentEl.height();
+        const sortingElOffset = sortingElOffsetLocal + translate;
+
+        if (sortingElOffset >= currentElOffset - currentElHeight / 2 && $sortingEl.index() < $currentEl.index()) {
+          $currentEl.transform(`translate3d(0, ${-sortingElHeight}px,0)`);
+          $insertAfterEl = $currentEl;
+          $insertBeforeEl = undefined;
+        } else if (sortingElOffset <= currentElOffset + currentElHeight / 2 && $sortingEl.index() > $currentEl.index()) {
+          $currentEl.transform(`translate3d(0, ${sortingElHeight}px,0)`);
+          $insertAfterEl = undefined;
+          if (!$insertBeforeEl) $insertBeforeEl = $currentEl;
+        } else {
+          $currentEl.transform('translate3d(0, 0%,0)');
+        }
+      });
+    }
+
+    function handleTouchEnd() {
+      if (!isTouched || !isMoved) {
+        if (isTouched && !isMoved) {
+          if (app.panel) app.panel.allowOpen = true;
+          if (app.swipeout) app.swipeout.allow = true;
+
+          if (wasTapHold) {
+            $sortingEl.removeClass('sorting');
+            $sortableContainer.removeClass('sortable-sorting');
+          }
+        }
+
+        isTouched = false;
+        isMoved = false;
+        return;
+      }
+
+      if (app.panel) app.panel.allowOpen = true;
+      if (app.swipeout) app.swipeout.allow = true;
+      $sortingItems.transform('');
+      $sortingEl.removeClass('sorting');
+      $sortableContainer.removeClass('sortable-sorting');
+      let indexTo;
+      if ($insertAfterEl) indexTo = $insertAfterEl.index();else if ($insertBeforeEl) indexTo = $insertBeforeEl.index();
+      let moveElements = $sortableContainer.dataset().sortableMoveElements;
+
+      if (typeof moveElements === 'undefined') {
+        moveElements = app.params.sortable.moveElements;
+      }
+
+      if (moveElements) {
+        if ($insertAfterEl) {
+          $sortingEl.insertAfter($insertAfterEl);
+        }
+
+        if ($insertBeforeEl) {
+          $sortingEl.insertBefore($insertBeforeEl);
+        }
+      }
+
+      if (($insertAfterEl || $insertBeforeEl) && $sortableContainer.hasClass('virtual-list')) {
+        indexFrom = $sortingEl[0].f7VirtualListIndex;
+        if (typeof indexFrom === 'undefined') indexFrom = $sortingEl.attr('data-virtual-list-index');
+
+        if ($insertBeforeEl) {
+          indexTo = $insertBeforeEl[0].f7VirtualListIndex;
+          if (typeof indexTo === 'undefined') indexTo = $insertBeforeEl.attr('data-virtual-list-index');
+        } else {
+          indexTo = $insertAfterEl[0].f7VirtualListIndex;
+          if (typeof indexTo === 'undefined') indexTo = $insertAfterEl.attr('data-virtual-list-index');
+        }
+
+        if (indexTo !== null) indexTo = parseInt(indexTo, 10);else indexTo = undefined;
+        const virtualList = $sortableContainer[0].f7VirtualList;
+        if (indexFrom) indexFrom = parseInt(indexFrom, 10);
+        if (indexTo) indexTo = parseInt(indexTo, 10);
+        if (virtualList) virtualList.moveItem(indexFrom, indexTo);
+      }
+
+      if (typeof indexTo !== 'undefined' && !Number.isNaN(indexTo) && indexTo !== indexFrom) {
+        $sortingEl.trigger('sortable:sort', {
+          from: indexFrom,
+          to: indexTo
+        });
+        app.emit('sortableSort', $sortingEl[0], {
+          from: indexFrom,
+          to: indexTo,
+          el: $sortingEl[0]
+        }, $sortableContainer[0]);
+      }
+
+      $insertBeforeEl = undefined;
+      $insertAfterEl = undefined;
+      isTouched = false;
+      isMoved = false;
+    }
+
+    const activeListener = getSupport().passiveListener ? {
+      passive: false,
+      capture: false
+    } : false;
+    $(document).on(app.touchEvents.start, '.list.sortable .sortable-handler', handleTouchStart, activeListener);
+    app.on('touchmove:active', handleTouchMove);
+    app.on('touchend:passive', handleTouchEnd);
+    $(document).on('taphold', '.sortable-tap-hold', (e, pointerEvent) => {
+      handleTouchStart(pointerEvent, true);
+    });
+  },
+
+  enable(el = '.list.sortable') {
+    const app = this;
+    const $el = $(el);
+    if ($el.length === 0) return;
+    $el.addClass('sortable-enabled');
+    $el.trigger('sortable:enable');
+    app.emit('sortableEnable', $el[0]);
+  },
+
+  disable(el = '.list.sortable') {
+    const app = this;
+    const $el = $(el);
+    if ($el.length === 0) return;
+    $el.removeClass('sortable-enabled');
+    $el.trigger('sortable:disable');
+    app.emit('sortableDisable', $el[0]);
+  },
+
+  toggle(el = '.list.sortable') {
+    const app = this;
+    const $el = $(el);
+    if ($el.length === 0) return;
+
+    if ($el.hasClass('sortable-enabled')) {
+      app.sortable.disable($el);
+    } else {
+      app.sortable.enable($el);
+    }
+  }
+
+};
+export default {
+  name: 'sortable',
+  params: {
+    sortable: {
+      moveElements: true
+    }
+  },
+
+  create() {
+    const app = this;
+    bindMethods(app, {
+      sortable: Sortable
+    });
+  },
+
+  on: {
+    init() {
+      const app = this;
+      if (!app.params.sortable) return;
+      app.sortable.init();
+    }
+
+  },
+  clicks: {
+    '.sortable-enable': function enable($clickedEl, data = {}) {
+      const app = this;
+      app.sortable.enable(data.sortable);
+    },
+    '.sortable-disable': function disable($clickedEl, data = {}) {
+      const app = this;
+      app.sortable.disable(data.sortable);
+    },
+    '.sortable-toggle': function toggle($clickedEl, data = {}) {
+      const app = this;
+      app.sortable.toggle(data.sortable);
+    }
+  }
+};

package/components/sortable/sortable.umd.js

@@ -0,0 +1 @@
+(function framework7ComponentLoader(t,e){void 0===e&&(e=!0);var s=t.$,o=t.utils,a=(t.getDevice,t.getSupport),l=(t.Class,t.Modal,t.ConstructorMethods,t.ModalMethods,o.bindMethods);const r={init(){const t=this,e=getDocument();let o,l,r,n,i,d,p,b,c,u,g,h,f,m,v,x,w,C,M,I,T;function L(e,a){l=!1,o=!0,T=!1,r="touchstart"===e.type?e.targetTouches[0].pageY:e.pageY,i=s(e.target).closest("li").eq(0),f=i.index(),p=i.parents(".sortable");const n=i.parents(".list-group");n.length&&n.parents(p).length&&(p=n),d=p.children("ul").children("li:not(.disallow-sorting):not(.no-sorting)"),t.panel&&(t.panel.allowOpen=!1),t.swipeout&&(t.swipeout.allow=!1),a&&(i.addClass("sorting"),p.addClass("sortable-sorting"),T=!0)}const E=!!a().passiveListener&&{passive:!1,capture:!1};s(e).on(t.touchEvents.start,".list.sortable .sortable-handler",L,E),t.on("touchmove:active",(function(t){if(!o||!i)return;const e="touchmove"===t.type?t.targetTouches[0].pageY:t.pageY;if(!l){m=i.parents(".page"),v=i.parents(".page-content");const t=parseInt(v.css("padding-top"),10),e=parseInt(v.css("padding-bottom"),10);I=v[0].scrollTop,w=m.offset().top+t,x=m.height()-t-e,i.addClass("sorting"),p.addClass("sortable-sorting"),C=i[0].offsetTop,c=i[0].offsetTop,u=i.parent().height()-C-i.height(),b=i[0].offsetHeight,M=i.offset().top}l=!0,t.preventDefault(),t.f7PreventSwipePanel=!0,n=e-r;const a=v[0].scrollTop-I,f=Math.min(Math.max(n+a,-c),u);i.transform(`translate3d(0,${f}px,0)`);const T=44;let L,E=!0;n+a+T<-c&&(E=!1),n+a-T>u&&(E=!1),h=void 0,g=void 0,E&&(M+n+b+T>w+x&&(L=M+n+b+T-(w+x)),M+n<w+T&&(L=M+n-w-T),L&&(v[0].scrollTop+=L)),d.each((t=>{const e=s(t);if(e[0]===i[0])return;const o=e[0].offsetTop,a=e.height(),l=C+f;l>=o-a/2&&i.index()<e.index()?(e.transform(`translate3d(0, ${-b}px,0)`),g=e,h=void 0):l<=o+a/2&&i.index()>e.index()?(e.transform(`translate3d(0, ${b}px,0)`),g=void 0,h||(h=e)):e.transform("translate3d(0, 0%,0)")}))})),t.on("touchend:passive",(function(){if(!o||!l)return o&&!l&&(t.panel&&(t.panel.allowOpen=!0),t.swipeout&&(t.swipeout.allow=!0),T&&(i.removeClass("sorting"),p.removeClass("sortable-sorting"))),o=!1,void(l=!1);let e;t.panel&&(t.panel.allowOpen=!0),t.swipeout&&(t.swipeout.allow=!0),d.transform(""),i.removeClass("sorting"),p.removeClass("sortable-sorting"),g?e=g.index():h&&(e=h.index());let s=p.dataset().sortableMoveElements;if(void 0===s&&(s=t.params.sortable.moveElements),s&&(g&&i.insertAfter(g),h&&i.insertBefore(h)),(g||h)&&p.hasClass("virtual-list")){f=i[0].f7VirtualListIndex,void 0===f&&(f=i.attr("data-virtual-list-index")),h?(e=h[0].f7VirtualListIndex,void 0===e&&(e=h.attr("data-virtual-list-index"))):(e=g[0].f7VirtualListIndex,void 0===e&&(e=g.attr("data-virtual-list-index"))),e=null!==e?parseInt(e,10):void 0;const t=p[0].f7VirtualList;f&&(f=parseInt(f,10)),e&&(e=parseInt(e,10)),t&&t.moveItem(f,e)}void 0===e||Number.isNaN(e)||e===f||(i.trigger("sortable:sort",{from:f,to:e}),t.emit("sortableSort",i[0],{from:f,to:e,el:i[0]},p[0])),h=void 0,g=void 0,o=!1,l=!1})),s(e).on("taphold",".sortable-tap-hold",((t,e)=>{L(e,!0)}))},enable(t=".list.sortable"){const e=s(t);0!==e.length&&(e.addClass("sortable-enabled"),e.trigger("sortable:enable"),this.emit("sortableEnable",e[0]))},disable(t=".list.sortable"){const e=s(t);0!==e.length&&(e.removeClass("sortable-enabled"),e.trigger("sortable:disable"),this.emit("sortableDisable",e[0]))},toggle(t=".list.sortable"){const e=this,o=s(t);0!==o.length&&(o.hasClass("sortable-enabled")?e.sortable.disable(o):e.sortable.enable(o))}};var n={name:"sortable",params:{sortable:{moveElements:!0}},create(){l(this,{sortable:r})},on:{init(){this.params.sortable&&this.sortable.init()}},clicks:{".sortable-enable":function(t,e={}){this.sortable.enable(e.sortable)},".sortable-disable":function(t,e={}){this.sortable.disable(e.sortable)},".sortable-toggle":function(t,e={}){this.sortable.toggle(e.sortable)}}};if(e){if(t.prototype.modules&&t.prototype.modules[n.name])return;t.use(n),t.instance&&(t.instance.useModuleParams(n,t.instance.params),t.instance.useModule(n))}return n}(Framework7, typeof Framework7AutoInstallComponent === 'undefined' ? undefined : Framework7AutoInstallComponent))