uikit 3.16.11-dev.bde560a72 → 3.16.11-dev.cc1aeb568

package/dist/js/components/lightbox-panel.js

@@ -1,4 +1,4 @@
-/*! UIkit 3.16.11-dev.bde560a72 | 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(require('uikit-util')) :
@@ -266,500 +266,16 @@
       );
     }
 
-    const hyphenateRe = /\B([A-Z])/g;
-    const hyphenate = memoize((str) => str.replace(hyphenateRe, "-$1").toLowerCase());
-    const ucfirst = memoize((str) => str.charAt(0).toUpperCase() + str.slice(1));
-    function startsWith(str, search) {
-      var _a;
-      return (_a = str == null ? void 0 : str.startsWith) == null ? void 0 : _a.call(str, search);
-    }
-    function includes(obj, search) {
-      var _a;
-      return (_a = obj == null ? void 0 : obj.includes) == null ? void 0 : _a.call(obj, search);
-    }
-    function findIndex(array, predicate) {
-      var _a;
-      return (_a = array == null ? void 0 : array.findIndex) == null ? void 0 : _a.call(array, predicate);
-    }
-    const { isArray, from: toArray } = Array;
-    function isFunction(obj) {
-      return typeof obj === "function";
-    }
-    function isObject(obj) {
-      return obj !== null && typeof obj === "object";
-    }
-    function isWindow(obj) {
-      return isObject(obj) && obj === obj.window;
-    }
-    function isDocument(obj) {
-      return nodeType(obj) === 9;
-    }
-    function isNode(obj) {
-      return nodeType(obj) >= 1;
-    }
-    function isElement(obj) {
-      return nodeType(obj) === 1;
-    }
-    function nodeType(obj) {
-      return !isWindow(obj) && isObject(obj) && obj.nodeType;
-    }
-    function isString(value) {
-      return typeof value === "string";
-    }
-    function isNumber(value) {
-      return typeof value === "number";
-    }
-    function isNumeric(value) {
-      return isNumber(value) || isString(value) && !isNaN(value - parseFloat(value));
-    }
-    function isUndefined(value) {
-      return value === void 0;
-    }
-    function toFloat(value) {
-      return parseFloat(value) || 0;
-    }
-    function toNode(element) {
-      return toNodes(element)[0];
-    }
-    function toNodes(element) {
-      return isNode(element) ? [element] : Array.from(element || []).filter(isNode);
-    }
-    function toWindow(element) {
-      if (isWindow(element)) {
-        return element;
-      }
-      element = toNode(element);
-      const document = isDocument(element) ? element : element == null ? void 0 : element.ownerDocument;
-      return (document == null ? void 0 : document.defaultView) || window;
-    }
-    function each(obj, cb) {
-      for (const key in obj) {
-        if (false === cb(obj[key], key)) {
-          return false;
-        }
-      }
-      return true;
-    }
-    function sumBy(array, iteratee) {
-      return array.reduce(
-        (sum, item) => sum + toFloat(isFunction(iteratee) ? iteratee(item) : item[iteratee]),
-        0
-      );
-    }
-    function memoize(fn) {
-      const cache = /* @__PURE__ */ Object.create(null);
-      return (key) => cache[key] || (cache[key] = fn(key));
-    }
-
-    function attr(element, name, value) {
-      var _a;
-      if (isObject(name)) {
-        for (const key in name) {
-          attr(element, key, name[key]);
-        }
-        return;
-      }
-      if (isUndefined(value)) {
-        return (_a = toNode(element)) == null ? void 0 : _a.getAttribute(name);
-      } else {
-        for (const el of toNodes(element)) {
-          if (isFunction(value)) {
-            value = value.call(el, attr(el, name));
-          }
-          if (value === null) {
-            removeAttr(el, name);
-          } else {
-            el.setAttribute(name, value);
-          }
-        }
-      }
-    }
-    function removeAttr(element, name) {
-      toNodes(element).forEach((element2) => element2.removeAttribute(name));
-    }
-
-    function parent(element) {
-      var _a;
-      return (_a = toNode(element)) == null ? void 0 : _a.parentElement;
-    }
-    function filter(element, selector) {
-      return toNodes(element).filter((element2) => matches(element2, selector));
-    }
-    function matches(element, selector) {
-      return toNodes(element).some((element2) => element2.matches(selector));
-    }
-    function closest(element, selector) {
-      return isElement(element) ? element.closest(startsWith(selector, ">") ? selector.slice(1) : selector) : toNodes(element).map((element2) => closest(element2, selector)).filter(Boolean);
-    }
-    function within(element, selector) {
-      return isString(selector) ? !!closest(element, selector) : toNode(selector).contains(toNode(element));
-    }
-    function parents(element, selector) {
-      const elements = [];
-      while (element = parent(element)) {
-        if (!selector || matches(element, selector)) {
-          elements.push(element);
-        }
-      }
-      return elements;
-    }
-    function children(element, selector) {
-      element = toNode(element);
-      const children2 = element ? toNodes(element.children) : [];
-      return selector ? filter(children2, selector) : children2;
-    }
-    function index(element, ref) {
-      return ref ? toNodes(element).indexOf(toNode(ref)) : children(parent(element)).indexOf(element);
-    }
-
-    function findAll(selector, context) {
-      return toNodes(_query(selector, toNode(context), "querySelectorAll"));
-    }
-    const contextSelectorRe = /(^|[^\\],)\s*[!>+~-]/;
-    const isContextSelector = memoize((selector) => selector.match(contextSelectorRe));
-    const contextSanitizeRe = /([!>+~-])(?=\s+[!>+~-]|\s*$)/g;
-    const sanatize = memoize((selector) => selector.replace(contextSanitizeRe, "$1 *"));
-    function _query(selector, context = document, queryFn) {
-      if (!selector || !isString(selector)) {
-        return selector;
-      }
-      selector = sanatize(selector);
-      if (isContextSelector(selector)) {
-        const split = splitSelector(selector);
-        selector = "";
-        for (let sel of split) {
-          let ctx = context;
-          if (sel[0] === "!") {
-            const selectors = sel.substr(1).trim().split(" ");
-            ctx = closest(parent(context), selectors[0]);
-            sel = selectors.slice(1).join(" ").trim();
-            if (!sel.length && split.length === 1) {
-              return ctx;
-            }
-          }
-          if (sel[0] === "-") {
-            const selectors = sel.substr(1).trim().split(" ");
-            const prev = (ctx || context).previousElementSibling;
-            ctx = matches(prev, sel.substr(1)) ? prev : null;
-            sel = selectors.slice(1).join(" ");
-          }
-          if (ctx) {
-            selector += `${selector ? "," : ""}${domPath(ctx)} ${sel}`;
-          }
-        }
-        context = document;
-      }
-      try {
-        return context[queryFn](selector);
-      } catch (e) {
-        return null;
-      }
-    }
-    const selectorRe = /.*?[^\\](?:,|$)/g;
-    const splitSelector = memoize(
-      (selector) => selector.match(selectorRe).map((selector2) => selector2.replace(/,$/, "").trim())
-    );
-    function domPath(element) {
-      const names = [];
-      while (element.parentNode) {
-        const id = attr(element, "id");
-        if (id) {
-          names.unshift(`#${escape(id)}`);
-          break;
-        } else {
-          let { tagName } = element;
-          if (tagName !== "HTML") {
-            tagName += `:nth-child(${index(element) + 1})`;
-          }
-          names.unshift(tagName);
-          element = element.parentNode;
-        }
-      }
-      return names.join(" > ");
-    }
-    function escape(css) {
-      return isString(css) ? CSS.escape(css) : "";
-    }
-
-    function on(...args) {
-      let [targets, types, selector, listener, useCapture = false] = getArgs(args);
-      if (listener.length > 1) {
-        listener = detail(listener);
-      }
-      if (useCapture == null ? void 0 : useCapture.self) {
-        listener = selfFilter(listener);
-      }
-      if (selector) {
-        listener = delegate(selector, listener);
-      }
-      for (const type of types) {
-        for (const target of targets) {
-          target.addEventListener(type, listener, useCapture);
-        }
-      }
-      return () => off(targets, types, listener, useCapture);
-    }
-    function off(...args) {
-      let [targets, types, , listener, useCapture = false] = getArgs(args);
-      for (const type of types) {
-        for (const target of targets) {
-          target.removeEventListener(type, listener, useCapture);
-        }
-      }
-    }
-    function getArgs(args) {
-      args[0] = toEventTargets(args[0]);
-      if (isString(args[1])) {
-        args[1] = args[1].split(" ");
-      }
-      if (isFunction(args[2])) {
-        args.splice(2, 0, false);
-      }
-      return args;
-    }
-    function delegate(selector, listener) {
-      return (e) => {
-        const current = selector[0] === ">" ? findAll(selector, e.currentTarget).reverse().filter((element) => within(e.target, element))[0] : closest(e.target, selector);
-        if (current) {
-          e.current = current;
-          listener.call(this, e);
-          delete e.current;
-        }
-      };
-    }
-    function detail(listener) {
-      return (e) => isArray(e.detail) ? listener(e, ...e.detail) : listener(e);
-    }
-    function selfFilter(listener) {
-      return function(e) {
-        if (e.target === e.currentTarget || e.target === e.current) {
-          return listener.call(null, e);
-        }
-      };
-    }
-    function isEventTarget(target) {
-      return target && "addEventListener" in target;
-    }
-    function toEventTarget(target) {
-      return isEventTarget(target) ? target : toNode(target);
-    }
-    function toEventTargets(target) {
-      return isArray(target) ? target.map(toEventTarget).filter(Boolean) : isString(target) ? findAll(target) : isEventTarget(target) ? [target] : toNodes(target);
-    }
-
-    const cssNumber = {
-      "animation-iteration-count": true,
-      "column-count": true,
-      "fill-opacity": true,
-      "flex-grow": true,
-      "flex-shrink": true,
-      "font-weight": true,
-      "line-height": true,
-      opacity: true,
-      order: true,
-      orphans: true,
-      "stroke-dasharray": true,
-      "stroke-dashoffset": true,
-      widows: true,
-      "z-index": true,
-      zoom: true
-    };
-    function css(element, property, value, priority) {
-      const elements = toNodes(element);
-      for (const element2 of elements) {
-        if (isString(property)) {
-          property = propName(property);
-          if (isUndefined(value)) {
-            return getComputedStyle(element2).getPropertyValue(property);
-          } else {
-            element2.style.setProperty(
-              property,
-              isNumeric(value) && !cssNumber[property] ? `${value}px` : value || isNumber(value) ? value : "",
-              priority
-            );
-          }
-        } else if (isArray(property)) {
-          const props = {};
-          for (const prop of property) {
-            props[prop] = css(element2, prop);
-          }
-          return props;
-        } else if (isObject(property)) {
-          priority = value;
-          each(property, (value2, property2) => css(element2, property2, value2, priority));
-        }
-      }
-      return elements[0];
-    }
-    const propName = memoize((name) => vendorPropName(name));
-    function vendorPropName(name) {
-      if (startsWith(name, "--")) {
-        return name;
-      }
-      name = hyphenate(name);
-      const { style } = document.documentElement;
-      if (name in style) {
-        return name;
-      }
-      for (const prefix of ["webkit", "moz"]) {
-        const prefixedName = `-${prefix}-${name}`;
-        if (prefixedName in style) {
-          return prefixedName;
-        }
-      }
-    }
-
-    const dirs = {
-      width: ["left", "right"],
-      height: ["top", "bottom"]
-    };
-    function dimensions(element) {
-      const rect = isElement(element) ? toNode(element).getBoundingClientRect() : { height: height(element), width: width(element), top: 0, left: 0 };
-      return {
-        height: rect.height,
-        width: rect.width,
-        top: rect.top,
-        left: rect.left,
-        bottom: rect.top + rect.height,
-        right: rect.left + rect.width
-      };
-    }
-    function offset(element, coordinates) {
-      const currentOffset = dimensions(element);
-      if (element) {
-        const { scrollY, scrollX } = toWindow(element);
-        const offsetBy = { height: scrollY, width: scrollX };
-        for (const dir in dirs) {
-          for (const prop of dirs[dir]) {
-            currentOffset[prop] += offsetBy[dir];
-          }
-        }
-      }
-      if (!coordinates) {
-        return currentOffset;
-      }
-      const pos = css(element, "position");
-      each(
-        css(element, ["left", "top"]),
-        (value, prop) => css(
-          element,
-          prop,
-          coordinates[prop] - currentOffset[prop] + toFloat(pos === "absolute" && value === "auto" ? position(element)[prop] : value)
-        )
-      );
-    }
-    function position(element) {
-      let { top, left } = offset(element);
-      const {
-        ownerDocument: { body, documentElement },
-        offsetParent
-      } = toNode(element);
-      let parent = offsetParent || documentElement;
-      while (parent && (parent === body || parent === documentElement) && css(parent, "position") === "static") {
-        parent = parent.parentNode;
-      }
-      if (isElement(parent)) {
-        const parentOffset = offset(parent);
-        top -= parentOffset.top + toFloat(css(parent, "borderTopWidth"));
-        left -= parentOffset.left + toFloat(css(parent, "borderLeftWidth"));
-      }
-      return {
-        top: top - toFloat(css(element, "marginTop")),
-        left: left - toFloat(css(element, "marginLeft"))
-      };
-    }
-    const height = dimension("height");
-    const width = dimension("width");
-    function dimension(prop) {
-      const propName = ucfirst(prop);
-      return (element, value) => {
-        if (isUndefined(value)) {
-          if (isWindow(element)) {
-            return element[`inner${propName}`];
-          }
-          if (isDocument(element)) {
-            const doc = element.documentElement;
-            return Math.max(doc[`offset${propName}`], doc[`scroll${propName}`]);
-          }
-          element = toNode(element);
-          value = css(element, prop);
-          value = value === "auto" ? element[`offset${propName}`] : toFloat(value) || 0;
-          return value - boxModelAdjust(element, prop);
-        } else {
-          return css(
-            element,
-            prop,
-            !value && value !== 0 ? "" : +value + boxModelAdjust(element, prop) + "px"
-          );
-        }
-      };
-    }
-    function boxModelAdjust(element, prop, sizing = "border-box") {
-      return css(element, "boxSizing") === sizing ? sumBy(
-        dirs[prop].map(ucfirst),
-        (prop2) => toFloat(css(element, `padding${prop2}`)) + toFloat(css(element, `border${prop2}Width`))
-      ) : 0;
-    }
-
-    function scrollParents(element, scrollable = false, props = []) {
-      const scrollEl = scrollingElement(element);
-      let ancestors = parents(element).reverse();
-      ancestors = ancestors.slice(ancestors.indexOf(scrollEl) + 1);
-      const fixedIndex = findIndex(ancestors, (el) => css(el, "position") === "fixed");
-      if (~fixedIndex) {
-        ancestors = ancestors.slice(fixedIndex);
-      }
-      return [scrollEl].concat(
-        ancestors.filter(
-          (parent) => css(parent, "overflow").split(" ").some((prop) => includes(["auto", "scroll", ...props], prop)) && (!scrollable || parent.scrollHeight > offsetViewport(parent).height)
-        )
-      ).reverse();
-    }
-    function offsetViewport(scrollElement) {
-      const window = toWindow(scrollElement);
-      const {
-        visualViewport,
-        document: { documentElement }
-      } = window;
-      let viewportElement = scrollElement === scrollingElement(scrollElement) ? window : scrollElement;
-      if (isWindow(viewportElement) && visualViewport) {
-        let { height, width, scale, pageTop: top, pageLeft: left } = visualViewport;
-        height = Math.round(height * scale);
-        width = Math.round(width * scale);
-        return { height, width, top, left, bottom: top + height, right: left + width };
-      }
-      let rect = offset(viewportElement);
-      if (css(viewportElement, "display") === "inline") {
-        return rect;
-      }
-      for (let [prop, dir, start, end] of [
-        ["width", "x", "left", "right"],
-        ["height", "y", "top", "bottom"]
-      ]) {
-        if (isWindow(viewportElement)) {
-          viewportElement = documentElement;
-        } else {
-          rect[start] += toFloat(css(viewportElement, `border-${start}-width`));
-        }
-        rect[prop] = rect[dir] = viewportElement[`client${ucfirst(prop)}`];
-        rect[end] = rect[prop] + rect[start];
-      }
-      return rect;
-    }
-    function scrollingElement(element) {
-      return toWindow(element).document.scrollingElement;
-    }
-
     let prevented;
     function preventBackgroundScroll(el) {
-      const off = on(
+      const off = util.on(
         el,
         "touchmove",
         (e) => {
-          if (e.targetTouches.length !== 1 || matches(e.target, 'input[type="range"')) {
+          if (e.targetTouches.length !== 1 || util.matches(e.target, 'input[type="range"')) {
             return;
           }
-          let [{ scrollHeight, clientHeight }] = scrollParents(e.target);
+          let [{ scrollHeight, clientHeight }] = util.scrollParents(e.target);
           if (clientHeight >= scrollHeight && e.cancelable) {
             e.preventDefault();
           }
@@ -771,15 +287,15 @@
       }
       prevented = true;
       const { scrollingElement } = document;
-      css(scrollingElement, {
+      util.css(scrollingElement, {
         overflowY: CSS.supports("overflow", "clip") ? "clip" : "hidden",
         touchAction: "none",
-        paddingRight: width(window) - scrollingElement.clientWidth || ""
+        paddingRight: util.width(window) - scrollingElement.clientWidth || ""
       });
       return () => {
         prevented = false;
         off();
-        css(scrollingElement, { overflowY: "", touchAction: "", paddingRight: "" });
+        util.css(scrollingElement, { overflowY: "", touchAction: "", paddingRight: "" });
       };
     }
 
@@ -1103,28 +619,81 @@
         role: "region"
       },
       computed: {
-        nav: {
-          get({ selNav }, $el) {
-            return util.$(selNav, $el);
-          },
-          watch(nav, prev) {
-            util.attr(nav, "role", "tablist");
-            if (prev) {
-              this.$emit();
-            }
-          },
-          immediate: true
+        nav({ selNav }, $el) {
+          return util.$(selNav, $el);
+        },
+        navChildren() {
+          return util.children(this.nav);
         },
         selNavItem({ attrItem }) {
           return `[${attrItem}],[data-${attrItem}]`;
         },
-        navItems: {
-          get(_, $el) {
-            return util.$$(this.selNavItem, $el);
-          },
-          watch() {
+        navItems(_, $el) {
+          return util.$$(this.selNavItem, $el);
+        }
+      },
+      watch: {
+        nav(nav, prev) {
+          util.attr(nav, "role", "tablist");
+          if (prev) {
             this.$emit();
           }
+        },
+        list(list) {
+          util.attr(list, "role", "presentation");
+        },
+        navChildren(children2) {
+          util.attr(children2, "role", "presentation");
+        },
+        navItems(items) {
+          for (const el of items) {
+            const cmd = util.data(el, this.attrItem);
+            const button = util.$("a,button", el) || el;
+            let ariaLabel;
+            let ariaControls = null;
+            if (util.isNumeric(cmd)) {
+              const item = util.toNumber(cmd);
+              const slide = this.slides[item];
+              if (slide) {
+                if (!slide.id) {
+                  slide.id = generateId(this, slide, `-item-${cmd}`);
+                }
+                ariaControls = slide.id;
+              }
+              ariaLabel = this.t("slideX", util.toFloat(cmd) + 1);
+              util.attr(button, "role", "tab");
+            } else {
+              if (this.list) {
+                if (!this.list.id) {
+                  this.list.id = generateId(this, this.list, "-items");
+                }
+                ariaControls = this.list.id;
+              }
+              ariaLabel = this.t(cmd);
+            }
+            util.attr(button, {
+              "aria-controls": ariaControls,
+              "aria-label": util.attr(button, "aria-label") || ariaLabel
+            });
+          }
+        },
+        slides(slides) {
+          slides.forEach(
+            (slide, i) => util.attr(slide, {
+              role: this.nav ? "tabpanel" : "group",
+              "aria-label": this.t("slideLabel", i + 1, this.length),
+              "aria-roledescription": this.nav ? null : "slide"
+            })
+          );
+        },
+        length(length) {
+          const navLength = this.navChildren.length;
+          if (this.nav && length !== navLength) {
+            util.empty(this.nav);
+            for (let i = 0; i < length; i++) {
+              util.append(this.nav, `<li ${this.attrItem}="${i}"><a href></a></li>`);
+            }
+          }
         }
       },
       connected() {
@@ -1134,54 +703,6 @@
         });
       },
       update: [
-        {
-          write() {
-            this.slides.forEach(
-              (slide, i) => util.attr(slide, {
-                role: this.nav ? "tabpanel" : "group",
-                "aria-label": this.t("slideLabel", i + 1, this.length),
-                "aria-roledescription": this.nav ? null : "slide"
-              })
-            );
-            if (this.nav && this.length !== this.nav.children.length) {
-              util.html(
-                this.nav,
-                this.slides.map((_, i) => `<li ${this.attrItem}="${i}"><a href></a></li>`).join("")
-              );
-            }
-            util.attr(util.children(this.nav).concat(this.list), "role", "presentation");
-            for (const el of this.navItems) {
-              const cmd = util.data(el, this.attrItem);
-              const button = util.$("a,button", el) || el;
-              let ariaLabel;
-              let ariaControls = null;
-              if (util.isNumeric(cmd)) {
-                const item = util.toNumber(cmd);
-                const slide = this.slides[item];
-                if (slide) {
-                  if (!slide.id) {
-                    slide.id = generateId(this, slide, `-item-${cmd}`);
-                  }
-                  ariaControls = slide.id;
-                }
-                ariaLabel = this.t("slideX", util.toFloat(cmd) + 1);
-                util.attr(button, "role", "tab");
-              } else {
-                if (this.list) {
-                  if (!this.list.id) {
-                    this.list.id = generateId(this, this.list, "-items");
-                  }
-                  ariaControls = this.list.id;
-                }
-                ariaLabel = this.t(cmd);
-              }
-              util.attr(button, {
-                "aria-controls": ariaControls,
-                "aria-label": util.attr(button, "aria-label") || ariaLabel
-              });
-            }
-          }
-        },
         {
           write() {
             this.navItems.concat(this.nav).forEach((el) => el && (el.hidden = !this.maxIndex));
@@ -1519,18 +1040,20 @@
         maxIndex() {
           return this.length - 1;
         },
-        slides: {
-          get() {
-            return util.children(this.list);
-          },
-          watch() {
-            this.$emit();
-          }
+        slides() {
+          return util.children(this.list);
         },
         length() {
           return this.slides.length;
         }
       },
+      watch: {
+        slides(slides, prev) {
+          if (prev) {
+            this.$emit();
+          }
+        }
+      },
       observe: resize(),
       methods: {
         show(index, force = false) {