uikit 3.16.11-dev.85cdca725 → 3.16.11-dev.cc1aeb568

package/dist/js/uikit.js

@@ -1,4 +1,4 @@
-/*! UIkit 3.16.11-dev.85cdca725 | https://www.getuikit.com | (c) 2014 - 2023 YOOtheme | MIT License */
+/*! UIkit 3.16.11-dev.cc1aeb568 | https://www.getuikit.com | (c) 2014 - 2023 YOOtheme | MIT License */
 
 (function (global, factory) {
     typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
@@ -1666,51 +1666,45 @@
         wrapInner: wrapInner
     });
 
-    function initComputed(instance) {
-      const { computed } = instance.$options;
-      instance._computed = {};
-      if (computed) {
-        for (const key in computed) {
-          registerComputed(instance, key, computed[key]);
+    function initWatches(instance) {
+      instance._watches = [];
+      for (const watches of instance.$options.watch || []) {
+        for (const [name, watch] of Object.entries(watches)) {
+          registerWatch(instance, watch, name);
         }
       }
+      instance._initial = true;
     }
-    function resetComputed(instance) {
-      const values = { ...instance._computed };
-      instance._computed = {};
-      return values;
+    function registerWatch(instance, watch, name) {
+      instance._watches.push({
+        name,
+        ...isPlainObject(watch) ? watch : { handler: watch }
+      });
     }
-    function registerComputed(instance, key, cb) {
-      Object.defineProperty(instance, key, {
-        enumerable: true,
-        get() {
-          const { _computed, $props, $el } = instance;
-          if (!hasOwn(_computed, key)) {
-            _computed[key] = (cb.get || cb).call(instance, $props, $el);
-          }
-          return _computed[key];
-        },
-        set(value) {
-          const { _computed } = instance;
-          _computed[key] = cb.set ? cb.set.call(instance, value) : value;
-          if (isUndefined(_computed[key])) {
-            delete _computed[key];
-          }
+    function runWatches(instance, values) {
+      for (const { name, handler, immediate = true } of instance._watches) {
+        if (instance._initial ? immediate : hasOwn(values, name) && !isEqual(values[name], instance[name])) {
+          handler.call(instance, instance[name], instance._initial ? void 0 : values[name]);
         }
-      });
+      }
+      instance._initial = false;
     }
 
     function initUpdates(instance) {
+      instance._data = {};
       instance._updates = [...instance.$options.update || []];
     }
     function prependUpdate(instance, update) {
       instance._updates.unshift(update);
     }
+    function clearUpdateData(instance) {
+      delete instance._data;
+    }
     function callUpdate(instance, e = "update") {
       if (!instance._connected) {
         return;
       }
-      if (!instance.$options.update) {
+      if (!instance._updates.length) {
         return;
       }
       if (!instance._queued) {
@@ -1746,39 +1740,71 @@
       }
     }
 
-    function initWatches(instance) {
-      instance._watches = [];
-      for (const watches of instance.$options.watch || []) {
-        for (const [name, watch] of Object.entries(watches)) {
-          registerWatch(instance, watch, name);
+    function initComputed(instance) {
+      const { computed } = instance.$options;
+      instance._computed = {};
+      if (computed) {
+        for (const key in computed) {
+          registerComputed(instance, key, computed[key]);
         }
       }
-      instance._initial = true;
-      prependUpdate(instance, { read: () => callWatches(instance), events: ["resize"] });
     }
-    function registerWatch(instance, watch, name) {
-      instance._watches.push({
-        name,
-        ...isPlainObject(watch) ? watch : { handler: watch }
+    function registerComputed(instance, key, cb) {
+      instance._hasComputed = true;
+      Object.defineProperty(instance, key, {
+        enumerable: true,
+        get() {
+          const { _computed, $props, $el } = instance;
+          if (!hasOwn(_computed, key)) {
+            _computed[key] = (cb.get || cb).call(instance, $props, $el);
+          }
+          return _computed[key];
+        },
+        set(value) {
+          const { _computed } = instance;
+          _computed[key] = cb.set ? cb.set.call(instance, value) : value;
+          if (isUndefined(_computed[key])) {
+            delete _computed[key];
+          }
+        }
       });
-      if (watch.document) {
-        instance._observeTarget = instance.$options.el.ownerDocumentocument;
-      }
     }
-    function callWatches(instance) {
-      if (!instance._connected) {
+    function initComputedUpdates(instance) {
+      if (!instance._hasComputed) {
         return;
       }
-      runWatches(instance, instance._initial);
-      instance._initial = false;
+      prependUpdate(instance, {
+        read: () => runWatches(instance, resetComputed(instance)),
+        events: ["resize", "computed"]
+      });
+      registerComputedObserver();
+      instances$1.add(instance);
     }
-    function runWatches(instance, initial) {
-      const values = resetComputed(instance);
-      for (const { name, handler, immediate = true } of instance._watches) {
-        if (initial && immediate || hasOwn(values, name) && !isEqual(values[name], instance[name])) {
-          handler.call(instance, instance[name], initial ? void 0 : values[name]);
-        }
+    function disconnectComputedUpdates(instance) {
+      instances$1 == null ? void 0 : instances$1.delete(instance);
+      resetComputed(instance);
+    }
+    function resetComputed(instance) {
+      const values = { ...instance._computed };
+      instance._computed = {};
+      return values;
+    }
+    let observer;
+    let instances$1;
+    function registerComputedObserver() {
+      if (observer) {
+        return;
       }
+      instances$1 = /* @__PURE__ */ new Set();
+      observer = new MutationObserver(() => {
+        for (const instance of instances$1) {
+          callUpdate(instance, "computed");
+        }
+      });
+      observer.observe(document, {
+        childList: true,
+        subtree: true
+      });
     }
 
     function initEvents(instance) {
@@ -1844,44 +1870,29 @@
         return;
       }
       const key = `_observe${instance._observers.length}`;
-      if (isFunction(target) && !(key in instance)) {
+      if (isFunction(target) && !hasOwn(instance, key)) {
         registerComputed(instance, key, () => target.call(instance, instance));
       }
       handler = isString(handler) ? instance[handler] : handler.bind(instance);
       if (isFunction(options)) {
         options = options.call(instance, instance);
       }
-      const observer = observe(key in instance ? instance[key] : target, handler, options, args);
+      const targets = hasOwn(instance, key) ? instance[key] : target;
+      const observer = observe(targets, handler, options, args);
       if (isFunction(target) && isArray(instance[key]) && observer.unobserve) {
-        registerWatch(
-          instance,
-          {
-            handler(targets, prev) {
-              for (const target2 of prev) {
-                !includes(targets, target2) && observer.unobserve(target2);
-              }
-              for (const target2 of targets) {
-                !includes(prev, target2) && observer.observe(target2);
-              }
-            },
-            immediate: false
-          },
-          key
-        );
+        registerWatch(instance, { handler: updateTargets(observer), immediate: false }, key);
       }
       registerObserver(instance, observer);
     }
-    function initWatchObserver(instance) {
-      let { el, computed } = instance.$options;
-      if (!computed && !instance._watches) {
-        return;
-      }
-      const observer = new MutationObserver(() => callWatches(instance));
-      observer.observe(instance._observeTarget || el, {
-        childList: true,
-        subtree: true
-      });
-      registerObserver(instance, observer);
+    function updateTargets(observer) {
+      return (targets, prev) => {
+        for (const target of prev) {
+          !includes(targets, target) && observer.unobserve(target);
+        }
+        for (const target of targets) {
+          !includes(prev, target) && observer.observe(target);
+        }
+      };
     }
 
     const strats = {};
@@ -2068,8 +2079,6 @@
       if (instance._connected) {
         return;
       }
-      instance._data = {};
-      instance._computed = {};
       initProps(instance);
       callHook(instance, "beforeConnect");
       instance._connected = true;
@@ -2078,7 +2087,7 @@
       initWatches(instance);
       initObservers(instance);
       initPropsObserver(instance);
-      initWatchObserver(instance);
+      initComputedUpdates(instance);
       callHook(instance, "connected");
       callUpdate(instance);
     }
@@ -2087,11 +2096,12 @@
         return;
       }
       callHook(instance, "beforeDisconnect");
-      disconnectObservers(instance);
       unbindEvents(instance);
+      clearUpdateData(instance);
+      disconnectObservers(instance);
+      disconnectComputedUpdates(instance);
       callHook(instance, "disconnected");
       instance._connected = false;
-      delete instance._watch;
     }
 
     let uid = 0;
@@ -2148,7 +2158,7 @@
     };
     App.util = util;
     App.options = {};
-    App.version = "3.16.11-dev.85cdca725";
+    App.version = "3.16.11-dev.cc1aeb568";
 
     const PREFIX = "uk-";
     const DATA = "__uikit__";
@@ -3565,40 +3575,31 @@
         }
       },
       watch: {
-        dropbar: {
-          handler(dropbar) {
-            addClass(
-              dropbar,
-              "uk-dropbar",
-              "uk-dropbar-top",
-              this.clsDropbar,
-              `uk-${this.$options.name}-dropbar`
-            );
-          },
-          immediate: true
+        dropbar(dropbar) {
+          addClass(
+            dropbar,
+            "uk-dropbar",
+            "uk-dropbar-top",
+            this.clsDropbar,
+            `uk-${this.$options.name}-dropbar`
+          );
         },
-        dropdowns: {
-          handler(dropdowns) {
-            this.$create(
-              "drop",
-              dropdowns.filter((el) => !this.getDropdown(el)),
-              {
-                ...this.$props,
-                flip: false,
-                shift: true,
-                pos: `bottom-${this.align}`,
-                boundary: this.boundary === true ? this.$el : this.boundary
-              }
-            );
-          },
-          immediate: true
+        dropdowns(dropdowns) {
+          this.$create(
+            "drop",
+            dropdowns.filter((el) => !this.getDropdown(el)),
+            {
+              ...this.$props,
+              flip: false,
+              shift: true,
+              pos: `bottom-${this.align}`,
+              boundary: this.boundary === true ? this.$el : this.boundary
+            }
+          );
         },
-        items: {
-          handler(items) {
-            attr(items, "tabindex", -1);
-            attr(items[0], "tabindex", 0);
-          },
-          immediate: true
+        items(items) {
+          attr(items, "tabindex", -1);
+          attr(items[0], "tabindex", 0);
         }
       },
       disconnected() {
@@ -4636,9 +4637,10 @@
         ensureSrcAttribute(this.$el);
       },
       disconnected() {
-        if (this._data.image) {
-          this._data.image.onload = "";
+        if (this.img) {
+          this.img.onload = "";
         }
+        delete this.img;
       },
       observe: intersection({
         target: ({ $el, $props }) => [$el, ...queryAll($props.target, $el)],
@@ -4651,13 +4653,13 @@
       }),
       methods: {
         load() {
-          if (this._data.image) {
-            return this._data.image;
+          if (this.img) {
+            return this.img;
           }
           const image = isImg(this.$el) ? this.$el : getImageFromElement(this.$el, this.dataSrc, this.sources);
           removeAttr(image, "loading");
           setSrcAttrs(this.$el, image.currentSrc);
-          return this._data.image = image;
+          return this.img = image;
         }
       }
     };
@@ -5138,24 +5140,21 @@
         // Simplify with :where() selector once browser target is Safari 14+
       },
       watch: {
-        items: {
-          handler() {
-            const justify = hasClass(this.$el, "uk-navbar-justify");
-            for (const container of $$(
-              ".uk-navbar-nav, .uk-navbar-left, .uk-navbar-right",
-              this.$el
-            )) {
-              css(
-                container,
-                "flexGrow",
-                justify ? $$(
-                  ".uk-navbar-nav > li > a, .uk-navbar-item, .uk-navbar-toggle",
-                  container
-                ).length : ""
-              );
-            }
-          },
-          immediate: true
+        items() {
+          const justify = hasClass(this.$el, "uk-navbar-justify");
+          for (const container of $$(
+            ".uk-navbar-nav, .uk-navbar-left, .uk-navbar-right",
+            this.$el
+          )) {
+            css(
+              container,
+              "flexGrow",
+              justify ? $$(
+                ".uk-navbar-nav > li > a, .uk-navbar-item, .uk-navbar-toggle",
+                container
+              ).length : ""
+            );
+          }
         }
       }
     };
@@ -5445,17 +5444,18 @@
         }
       },
       connected() {
-        this._data.elements = /* @__PURE__ */ new Map();
+        this.elementData = /* @__PURE__ */ new Map();
       },
       disconnected() {
-        for (const [el, state] of this._data.elements.entries()) {
+        for (const [el, state] of this.elementData.entries()) {
           removeClass(el, this.inViewClass, (state == null ? void 0 : state.cls) || "");
         }
+        delete this.elementData;
       },
       observe: intersection({
         target: ({ elements }) => elements,
         handler(records) {
-          const elements = this._data.elements;
+          const elements = this.elementData;
           for (const { target: el, isIntersecting } of records) {
             if (!elements.has(el)) {
               elements.set(el, {
@@ -5476,7 +5476,7 @@
       update: [
         {
           write(data) {
-            for (const [el, state] of data.elements.entries()) {
+            for (const [el, state] of this.elementData.entries()) {
               if (state.show && !state.inview && !state.queued) {
                 state.queued = true;
                 data.promise = (data.promise || Promise.resolve()).then(() => new Promise((resolve) => setTimeout(resolve, this.delay))).then(() => {
@@ -5496,7 +5496,7 @@
       methods: {
         toggle(el, inview) {
           var _a;
-          const state = this._data.elements.get(el);
+          const state = this.elementData.get(el);
           if (!state) {
             return;
           }
@@ -5987,14 +5987,11 @@
         }
       },
       watch: {
-        connects: {
-          handler(connects) {
-            if (this.swiping) {
-              css(connects, "touchAction", "pan-y pinch-zoom");
-            }
-            this.$emit();
-          },
-          document: true
+        connects(connects) {
+          if (this.swiping) {
+            css(connects, "touchAction", "pan-y pinch-zoom");
+          }
+          this.$emit();
         },
         connectChildren() {
           const index = this.index();
@@ -6164,12 +6161,9 @@
         queued: true
       },
       computed: {
-        target: {
-          get({ href, target }, $el) {
-            target = queryAll(target || href, $el);
-            return target.length && target || [$el];
-          },
-          document: true
+        target({ href, target }, $el) {
+          target = queryAll(target || href, $el);
+          return target.length && target || [$el];
         }
       },
       connected() {