framework7 8.0.0-beta.7 → 8.0.0-beta.9

package/framework7-bundle.js

@@ -1,5 +1,5 @@
 /**
- * Framework7 8.0.0-beta.7
+ * Framework7 8.0.0-beta.9
  * Full featured mobile HTML framework for building iOS & Android apps
  * https://framework7.io/
  *
@@ -7,7 +7,7 @@
  *
  * Released under the MIT License
  *
- * Released on: March 27, 2023
+ * Released on: March 31, 2023
  */
 
 (function (global, factory) {
@@ -4476,11 +4476,11 @@
           tapHoldPreventClicks: true,
           // Active State
           activeState: true,
-          activeStateElements: 'a, button, label, span, .actions-button, .stepper-button, .stepper-button-plus, .stepper-button-minus, .card-expandable, .menu-item, .link, .item-link, .accordion-item-toggle',
+          activeStateElements: 'a, button, label, span, .actions-button, .stepper-button, .stepper-button-plus, .stepper-button-minus, .card-expandable, .link, .item-link, .accordion-item-toggle',
           activeStateOnMouseMove: false,
           mdTouchRipple: true,
           iosTouchRipple: false,
-          touchRippleElements: '.ripple, .link, .item-link, .list label.item-content, .list-button, .links-list a, .button, button, .input-clear-button, .dialog-button, .tab-link, .item-radio, .item-checkbox, .actions-button, .searchbar-disable-button, .fab a, .checkbox, .radio, .data-table .sortable-cell:not(.input-cell), .notification-close-button, .stepper-button, .stepper-button-minus, .stepper-button-plus, .menu-item-content, .list.accordion-list .accordion-item-toggle',
+          touchRippleElements: '.ripple, .link, .item-link, .list label.item-content, .list-button, .links-list a, .button, button, .input-clear-button, .dialog-button, .tab-link, .item-radio, .item-checkbox, .actions-button, .searchbar-disable-button, .fab a, .checkbox, .radio, .data-table .sortable-cell:not(.input-cell), .notification-close-button, .stepper-button, .stepper-button-minus, .stepper-button-plus, .list.accordion-list .accordion-item-toggle',
           touchRippleInsetElements: '.ripple-inset, .icon-only, .searchbar-disable-button, .input-clear-button, .notification-close-button, .md .navbar .link.back'
         }
       },
@@ -10760,6 +10760,118 @@
     };
 
     /* eslint no-underscore-dangle: "off" */
+
+    /* eslint-disable no-shadow */
+    /* eslint-disable no-return-assign */
+    /* eslint-disable no-plusplus */
+    /* eslint-disable no-param-reassign */
+    /* eslint-disable no-sequences */
+    const types = [{
+      name: 'array',
+      init: i => i,
+      type: i => [i].find(Array.isArray),
+      update: (i, o) => [o].filter(Array.isArray).find(() => (i.length = 0, i.push(...o))),
+      insert: function (i, x, o) {
+        if (o === void 0) {
+          o = [];
+        }
+        return i.splice(Math.max(x, 0), 0, ...[o].flat());
+      },
+      replace: function (i, x, o) {
+        if (o === void 0) {
+          o = [];
+        }
+        return i.splice(Math.max(x, 0), Math.min(++x, 1), ...[o].flat());
+      },
+      append: function (i, o) {
+        if (o === void 0) {
+          o = [];
+        }
+        return i.push(...[o].flat());
+      },
+      prepend: function (i, o) {
+        if (o === void 0) {
+          o = [];
+        }
+        return i.unshift(...[o].flat());
+      },
+      swap: (i, a, b) => {
+        [i[a], i[b]] = [i[b], i[a]];
+      },
+      fromTo: function (i, a, b) {
+        if (b === void 0) {
+          b = a;
+        }
+        return i.splice(Math.max(b, 0), 0, ...i.splice(Math.max(a, 0), 1));
+      },
+      remove: function (i, o, a) {
+        if (a === void 0) {
+          a = i.map((_, x) => x);
+        }
+        return [o].flat().filter(i => a.includes(i)).sort((a, b) => b - a).forEach(x => i.splice(x, 1));
+      },
+      clear: i => i.length = 0
+    }, {
+      name: 'object',
+      init: i => i,
+      type: i => [i].filter(i => [i !== null, i !== undefined].every(i => i)).find(i => Object.getPrototypeOf(i) === Object.prototype),
+      update: (i, o) => Object.assign(i, o),
+      insert: () => {},
+      replace: () => {},
+      append: () => {},
+      prepend: () => {},
+      swap: () => ({}),
+      // N/A
+      fromTo: () => ({}),
+      // N/A
+      remove: (i, o) => [o].flat().forEach(k => delete i[k]),
+      clear: i => Object.keys(i).forEach(k => delete i[k])
+    }, {
+      name: 'atoms',
+      type: () => true,
+      init: function (i, o) {
+        if (o === void 0) {
+          o = {};
+        }
+        return Object.defineProperty(o, 'value', {
+          get: () => i,
+          set: v => {
+            // eslint-disable-next-line
+            i = v;
+          }
+        }), o;
+      },
+      update: function (i, v) {
+        if (v === void 0) {
+          v = i.value;
+        }
+        i.value = v;
+      },
+      insert: () => ({}),
+      // N/A
+      replace: () => ({}),
+      // N/A
+      append: () => ({}),
+      // N/A
+      prepend: () => ({}),
+      // N/A
+      swap: () => ({}),
+      // N/A
+      fromTo: () => ({}),
+      // N/A
+      remove: () => ({}),
+      // N/A
+      clear: i => {
+        i.value = undefined;
+      }
+    }];
+
+    /* eslint-enable no-shadow */
+    /* eslint-enable no-return-assign */
+    /* eslint-enable no-plusplus */
+    /* eslint-enable no-param-reassign */
+    /* eslint-enable no-sequences */
+
     class Component {
       constructor(app, component, props, _temp) {
         if (props === void 0) {
@@ -10904,6 +11016,66 @@
         });
         return $store;
       }
+
+      /* eslint-disable no-sequences */
+      getUseState() {
+        var _this = this;
+        return o => {
+          const obj = [o].reduce(function (t, _i, _x, _a, i) {
+            if (i === void 0) {
+              i = t.init(_i);
+            }
+            return {
+              state: i,
+              update: v => (t.update(i, v), _this.update()),
+              remove: v => (t.remove(i, v), _this.update()),
+              clear: () => (t.clear(i), _this.update()),
+              insert: (x, v) => (t.insert(i, x, v), _this.update()),
+              replace: (x, v) => (t.replace(i, x, v), _this.update()),
+              append: v => (t.append(i, v), _this.update()),
+              prepend: v => (t.prepend(i, v), _this.update()),
+              swap: (a, b) => (t.swap(i, a, b), _this.update()),
+              fromTo: (a, b) => (t.fromTo(i, a, b), _this.update()),
+              method: function (f) {
+                if (f === void 0) {
+                  f = () => ({});
+                }
+                return f(i), _this.update();
+              },
+              async: function (f) {
+                if (f === void 0) {
+                  f = () => Promise.reject(i);
+                }
+                return f(i).then(() => _this.update());
+              }
+            };
+          }, types.find(i => i.type(o)));
+          obj.length = 12;
+          obj[Symbol.iterator] = function Iterate() {
+            const values = Object.values(this);
+            values.splice(values.indexOf(12), 1);
+            let index = 0;
+            return {
+              next() {
+                if (index < values.length) {
+                  const val = values[index];
+                  index += 1;
+                  return {
+                    value: val,
+                    done: false
+                  };
+                }
+                return {
+                  done: true
+                };
+              }
+            };
+          };
+          return obj;
+        };
+      }
+      /* eslint-enable no-sequences */
+
       getComponentContext(includeHooks) {
         const ctx = {
           $f7route: this.context.f7route,
@@ -10919,7 +11091,8 @@
           $emit: this.emit.bind(this),
           $store: this.getComponentStore(),
           $ref: this.getComponentRef(),
-          $el: {}
+          $el: {},
+          $useState: this.getUseState()
         };
         Object.defineProperty(ctx.$el, 'value', {
           get: () => {
@@ -11141,6 +11314,7 @@
           var $update = $$ctx.$update;
           var $store = $$ctx.$store;
           var $ref = $$ctx.$ref;
+          var $useState = $$ctx.$useState;
 
           return $h\`${template}\`
         }
@@ -12763,7 +12937,7 @@
         if (!isInset && $el.css('overflow') === 'hidden') {
           const distanceFromCenter = ((center.x - width / 2) ** 2 + (center.y - height / 2) ** 2) ** 0.5;
           const scale = (diameter / 2 + distanceFromCenter) / (diameter / 2);
-          ripple.rippleTransform = `translate3d(0px, 0px, 0) scale(${scale})`;
+          ripple.rippleTransform = `translate3d(0px, 0px, 0) scale(${scale * 2})`;
         } else {
           // prettier-ignore
           ripple.rippleTransform = `translate3d(${-center.x + width / 2}px, ${-center.y + height / 2}px, 0) scale(1)`;
@@ -12771,7 +12945,7 @@
         if (isInset) {
           $el.addClass('ripple-inset');
         }
-        ripple.$rippleWaveEl = $(`<div class="ripple-wave" style="width: ${diameter}px; height: ${diameter}px; margin-top:-${diameter / 2}px; margin-left:-${diameter / 2}px; left:${center.x}px; top:${center.y}px; --f7-ripple-transform: ${ripple.rippleTransform}"></div>`);
+        ripple.$rippleWaveEl = $(`<div class="ripple-wave${isInset ? ' ripple-wave-inset' : ''}" style="width: ${diameter}px; height: ${diameter}px; margin-top:-${diameter / 2}px; margin-left:-${diameter / 2}px; left:${center.x}px; top:${center.y}px; --f7-ripple-transform: ${ripple.rippleTransform}"></div>`);
         $el.prepend(ripple.$rippleWaveEl);
         ripple.$rippleWaveEl.animationEnd(() => {
           if (!ripple.$rippleWaveEl) return;