[Summary view] [Print] [Text view]

   1  function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
   2  
   3  function t(e) {
   4    return (t = "function" == typeof Symbol && "symbol" == _typeof(Symbol.iterator) ? function (t) {
   5      return _typeof(t);
   6    } : function (t) {
   7      return t && "function" == typeof Symbol && t.constructor === Symbol && t !== Symbol.prototype ? "symbol" : _typeof(t);
   8    })(e);
   9  }
  10  
  11  function e(t) {
  12    return function (t) {
  13      if (Array.isArray(t)) return i(t);
  14    }(t) || function (t) {
  15      if ("undefined" != typeof Symbol && null != t[Symbol.iterator] || null != t["@@iterator"]) return Array.from(t);
  16    }(t) || n(t) || function () {
  17      throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
  18    }();
  19  }
  20  
  21  function n(t, e) {
  22    if (t) {
  23      if ("string" == typeof t) return i(t, e);
  24      var n = Object.prototype.toString.call(t).slice(8, -1);
  25      return "Object" === n && t.constructor && (n = t.constructor.name), "Map" === n || "Set" === n ? Array.from(t) : "Arguments" === n || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n) ? i(t, e) : void 0;
  26    }
  27  }
  28  
  29  function i(t, e) {
  30    (null == e || e > t.length) && (e = t.length);
  31  
  32    for (var n = 0, i = new Array(e); n < e; n++) {
  33      i[n] = t[n];
  34    }
  35  
  36    return i;
  37  }
  38  
  39  function a(t, e) {
  40    for (var n = 0; n < e.length; n++) {
  41      var i = e[n];
  42      i.enumerable = i.enumerable || !1, i.configurable = !0, "value" in i && (i.writable = !0), Object.defineProperty(t, i.key, i);
  43    }
  44  }
  45  
  46  function r(t, e) {
  47    if (!(t instanceof e)) throw new TypeError("Cannot call a class as a function");
  48  }
  49  
  50  function o(t, e) {
  51    if ("function" != typeof e && null !== e) throw new TypeError("Super expression must either be null or a function");
  52    t.prototype = Object.create(e && e.prototype, {
  53      constructor: {
  54        value: t,
  55        writable: !0,
  56        configurable: !0
  57      }
  58    }), e && d(t, e);
  59  }
  60  
  61  function s(t) {
  62    var e = h();
  63    return function () {
  64      var n,
  65          i = f(t);
  66  
  67      if (e) {
  68        var a = f(this).constructor;
  69        n = Reflect.construct(i, arguments, a);
  70      } else n = i.apply(this, arguments);
  71  
  72      return u(this, n);
  73    };
  74  }
  75  
  76  function u(e, n) {
  77    return !n || "object" !== t(n) && "function" != typeof n ? c(e) : n;
  78  }
  79  
  80  function c(t) {
  81    if (void 0 === t) throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
  82    return t;
  83  }
  84  
  85  function b(t) {
  86    var e = "function" == typeof Map ? new Map() : void 0;
  87    return (b = function b(t) {
  88      if (null === t || (n = t, -1 === Function.toString.call(n).indexOf("[native code]"))) return t;
  89      var n;
  90      if ("function" != typeof t) throw new TypeError("Super expression must either be null or a function");
  91  
  92      if (void 0 !== e) {
  93        if (e.has(t)) return e.get(t);
  94        e.set(t, i);
  95      }
  96  
  97      function i() {
  98        return l(t, arguments, f(this).constructor);
  99      }
 100  
 101      return i.prototype = Object.create(t.prototype, {
 102        constructor: {
 103          value: i,
 104          enumerable: !1,
 105          writable: !0,
 106          configurable: !0
 107        }
 108      }), d(i, t);
 109    })(t);
 110  }
 111  
 112  function l(t, e, n) {
 113    return (l = h() ? Reflect.construct : function (t, e, n) {
 114      var i = [null];
 115      i.push.apply(i, e);
 116      var a = new (Function.bind.apply(t, i))();
 117      return n && d(a, n.prototype), a;
 118    }).apply(null, arguments);
 119  }
 120  
 121  function h() {
 122    if ("undefined" == typeof Reflect || !Reflect.construct) return !1;
 123    if (Reflect.construct.sham) return !1;
 124    if ("function" == typeof Proxy) return !0;
 125  
 126    try {
 127      return Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})), !0;
 128    } catch (t) {
 129      return !1;
 130    }
 131  }
 132  
 133  function d(t, e) {
 134    return (d = Object.setPrototypeOf || function (t, e) {
 135      return t.__proto__ = e, t;
 136    })(t, e);
 137  }
 138  
 139  function f(t) {
 140    return (f = Object.setPrototypeOf ? Object.getPrototypeOf : function (t) {
 141      return t.__proto__ || Object.getPrototypeOf(t);
 142    })(t);
 143  }
 144  
 145  var v = function (t) {
 146    o(n, b(HTMLElement));
 147    var e = s(n);
 148  
 149    function n() {
 150      return r(this, n), e.apply(this, arguments);
 151    }
 152  
 153    return n;
 154  }();
 155  
 156  customElements.define("joomla-tab-element", v);
 157  
 158  var m = function (t) {
 159    o(d, b(HTMLElement));
 160    var i,
 161        u,
 162        l,
 163        h = s(d);
 164  
 165    function d() {
 166      var t;
 167      return r(this, d), (t = h.call(this)).tabs = [], t.tabsElements = [], t.previousActive = null, t.onMutation = t.onMutation.bind(c(t)), t.keyBehaviour = t.keyBehaviour.bind(c(t)), t.activateTab = t.activateTab.bind(c(t)), t.deactivateTabs = t.deactivateTabs.bind(c(t)), t.checkView = t.checkView.bind(c(t)), t.observer = new MutationObserver(t.onMutation), t.observer.observe(c(t), {
 168        attributes: !1,
 169        childList: !0,
 170        subtree: !0
 171      }), t;
 172    }
 173  
 174    return i = d, l = [{
 175      key: "observedAttributes",
 176      get: function get() {
 177        return ["recall", "orientation", "view", "breakpoint"];
 178      }
 179    }], (u = [{
 180      key: "recall",
 181      get: function get() {
 182        return this.getAttribute("recall");
 183      },
 184      set: function set(t) {
 185        this.setAttribute("recall", t);
 186      }
 187    }, {
 188      key: "view",
 189      get: function get() {
 190        return this.getAttribute("view");
 191      },
 192      set: function set(t) {
 193        this.setAttribute("view", t);
 194      }
 195    }, {
 196      key: "orientation",
 197      get: function get() {
 198        return this.getAttribute("orientation");
 199      },
 200      set: function set(t) {
 201        this.setAttribute("orientation", t);
 202      }
 203    }, {
 204      key: "breakpoint",
 205      get: function get() {
 206        return parseInt(this.getAttribute("breakpoint"), 10);
 207      },
 208      set: function set(t) {
 209        this.setAttribute("breakpoint", t);
 210      }
 211    }, {
 212      key: "connectedCallback",
 213      value: function value() {
 214        var t = this;
 215  
 216        if ((!this.orientation || this.orientation && !["horizontal", "vertical"].includes(this.orientation)) && (this.orientation = "horizontal"), (!this.view || this.view && !["tabs", "accordion"].includes(this.view)) && (this.view = "tabs"), this.tabsElements = [].slice.call(this.children).filter(function (t) {
 217          return "joomla-tab-element" === t.tagName.toLowerCase();
 218        }), this.tabsElements.length) {
 219          if (this.isNested = this.parentNode.closest("joomla-tab") instanceof HTMLElement, this.hydrate(), this.hasAttribute("recall") && !this.isNested && this.activateFromState(), window.location.hash) {
 220            var e = window.location.hash.substr(1),
 221                n = this.tabs.filter(function (t) {
 222              return t.tab.id === e;
 223            });
 224            n.length && this.activateTab(n[0].tab, !1);
 225          }
 226  
 227          this.tabs.filter(function (t) {
 228            return t.tab.hasAttribute("active");
 229          }).length || this.activateTab(this.tabs[0].tab, !1), this.addEventListener("keyup", this.keyBehaviour), this.breakpoint && (this.checkView(), window.addEventListener("resize", function () {
 230            t.checkView();
 231          }));
 232        }
 233      }
 234    }, {
 235      key: "disconnectedCallback",
 236      value: function value() {
 237        var t = this;
 238        this.tabs.map(function (e) {
 239          return e.tabButton.removeEventListener("click", t.activateTab), e.accordionButton.removeEventListener("click", t.activateTab), e;
 240        }), this.removeEventListener("keyup", this.keyBehaviour);
 241      }
 242    }, {
 243      key: "attributeChangedCallback",
 244      value: function value(t, e, n) {
 245        switch (t) {
 246          case "view":
 247            (!n || n && !["tabs", "accordion"].includes(n)) && (this.view = "tabs"), "tabs" === n && n !== e ? (this.tabButtonContainer && this.tabButtonContainer.removeAttribute("hidden"), this.tabs.map(function (t) {
 248              return t.accordionButton.setAttribute("hidden", "");
 249            })) : "accordion" === n && n !== e && (this.tabButtonContainer && this.tabButtonContainer.setAttribute("hidden", ""), this.tabs.map(function (t) {
 250              return t.accordionButton.removeAttribute("hidden");
 251            }));
 252        }
 253      }
 254    }, {
 255      key: "hydrate",
 256      value: function value() {
 257        var t = this;
 258        this.tabButtonContainer = document.createElement("div"), this.tabButtonContainer.setAttribute("role", "tablist"), this.insertAdjacentElement("afterbegin", this.tabButtonContainer), "accordion" === this.view && this.tabButtonContainer.setAttribute("hidden", ""), this.tabsElements.map(function (e) {
 259          var n = document.createElement("button");
 260          n.setAttribute("aria-expanded", !!e.hasAttribute("active")), n.setAttribute("aria-controls", e.id), n.setAttribute("type", "button"), n.innerHTML = '<span class="accordion-title">'.concat(e.getAttribute("name"), '<span class="accordion-icon"></span></span>'), e.insertAdjacentElement("beforebegin", n), "tabs" === t.view && n.setAttribute("hidden", ""), n.addEventListener("click", t.activateTab);
 261          var i = document.createElement("button");
 262          return i.setAttribute("aria-expanded", !!e.hasAttribute("active")), i.setAttribute("aria-controls", e.id), i.setAttribute("role", "tab"), i.setAttribute("type", "button"), i.innerHTML = "".concat(e.getAttribute("name")), t.tabButtonContainer.appendChild(i), i.addEventListener("click", t.activateTab), "tabs" === t.view ? e.setAttribute("role", "tabpanel") : e.setAttribute("role", "region"), t.tabs.push({
 263            tab: e,
 264            tabButton: i,
 265            accordionButton: n
 266          }), e;
 267        });
 268      }
 269    }, {
 270      key: "onMutation",
 271      value: function value(t) {
 272        var e,
 273            i = this,
 274            a = function (t, e) {
 275          var i = "undefined" != typeof Symbol && t[Symbol.iterator] || t["@@iterator"];
 276  
 277          if (!i) {
 278            if (Array.isArray(t) || (i = n(t)) || e && t && "number" == typeof t.length) {
 279              i && (t = i);
 280  
 281              var a = 0,
 282                  r = function r() {};
 283  
 284              return {
 285                s: r,
 286                n: function n() {
 287                  return a >= t.length ? {
 288                    done: !0
 289                  } : {
 290                    done: !1,
 291                    value: t[a++]
 292                  };
 293                },
 294                e: function e(t) {
 295                  throw t;
 296                },
 297                f: r
 298              };
 299            }
 300  
 301            throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
 302          }
 303  
 304          var o,
 305              s = !0,
 306              u = !1;
 307          return {
 308            s: function s() {
 309              i = i.call(t);
 310            },
 311            n: function n() {
 312              var t = i.next();
 313              return s = t.done, t;
 314            },
 315            e: function e(t) {
 316              u = !0, o = t;
 317            },
 318            f: function f() {
 319              try {
 320                s || null == i["return"] || i["return"]();
 321              } finally {
 322                if (u) throw o;
 323              }
 324            }
 325          };
 326        }(t);
 327  
 328        try {
 329          for (a.s(); !(e = a.n()).done;) {
 330            var r = e.value;
 331            "childList" === r.type && (r.addedNodes.length && [].slice.call(r.addedNodes).map(function (t) {
 332              return i.createNavs(t);
 333            }), r.removedNodes.length && [].slice.call(r.addedNodes).map(function (t) {
 334              return i.removeNavs(t);
 335            }));
 336          }
 337        } catch (t) {
 338          a.e(t);
 339        } finally {
 340          a.f();
 341        }
 342      }
 343    }, {
 344      key: "keyBehaviour",
 345      value: function value(t) {
 346        if ([].concat(e(this.tabs.map(function (t) {
 347          return t.tabButton;
 348        })), e(this.tabs.map(function (t) {
 349          return t.accordionButton;
 350        }))).includes(document.activeElement) && !t.metaKey && !t.altKey) {
 351          var n, i;
 352  
 353          if ("tabs" === this.view) {
 354            var a = this.tabs.findIndex(function (t) {
 355              return t.tab.hasAttribute("active");
 356            });
 357            n = a - 1 >= 0 ? this.tabs[a - 1] : this.tabs[this.tabs.length - 1], i = a + 1 <= this.tabs.length - 1 ? this.tabs[a + 1] : this.tabs[0];
 358          } else {
 359            var r = this.tabs.map(function (t) {
 360              return t.accordionButton;
 361            }).findIndex(function (t) {
 362              return t === document.activeElement;
 363            });
 364            n = r - 1 >= 0 ? this.tabs[r - 1] : this.tabs[this.tabs.length - 1], i = r + 1 <= this.tabs.length - 1 ? this.tabs[r + 1] : this.tabs[0];
 365          }
 366  
 367          switch (t.keyCode) {
 368            case 37:
 369            case 38:
 370              "tabs" === this.view ? (n.tabButton.click(), n.tabButton.focus()) : n.accordionButton.focus(), t.preventDefault();
 371              break;
 372  
 373            case 39:
 374            case 40:
 375              "tabs" === this.view ? (i.tabButton.click(), i.tabButton.focus()) : i.accordionButton.focus(), t.preventDefault();
 376          }
 377        }
 378      }
 379    }, {
 380      key: "deactivateTabs",
 381      value: function value() {
 382        var t = this;
 383        this.tabs.map(function (e) {
 384          return e.accordionButton.removeAttribute("aria-disabled"), e.tabButton.removeAttribute("aria-expanded"), e.accordionButton.setAttribute("aria-expanded", !1), e.tab.hasAttribute("active") && (t.dispatchCustomEvent("joomla.tab.hide", "tabs" === t.view ? e.tabButton : e.accordionButton, t.previousActive), e.tab.removeAttribute("active"), e.tab.setAttribute("tabindex", "-1"), t.dispatchCustomEvent("joomla.tab.hidden", "tabs" === t.view ? e.tabButton : e.accordionButton, t.previousActive), t.previousActive = "tabs" === t.view ? e.tabButton : e.accordionButton), e;
 385        });
 386      }
 387    }, {
 388      key: "activateTab",
 389      value: function value(t) {
 390        var e,
 391            n = this,
 392            i = !(arguments.length > 1 && void 0 !== arguments[1]) || arguments[1];
 393  
 394        if (t.currentTarget ? e = this.tabs.find(function (e) {
 395          return ("tabs" === n.view ? e.tabButton : e.accordionButton) === t.currentTarget;
 396        }) : t instanceof HTMLElement ? e = this.tabs.find(function (e) {
 397          return e.tab === t;
 398        }) : Number.isInteger(t) && (e = this.tabs[t]), e) {
 399          if ("accordion" === this.view && this.tabs.find(function (t) {
 400            return "true" === t.accordionButton.getAttribute("aria-expanded");
 401          }) === e) return e.tab.hasAttribute("active") ? void e.tab.removeAttribute("active") : void e.tab.setAttribute("active", "");
 402          this.deactivateTabs(), e.tabButton.setAttribute("aria-expanded", !0), e.accordionButton.setAttribute("aria-expanded", !0), e.accordionButton.setAttribute("aria-disabled", !0), e.tab.setAttribute("active", ""), e.tabButton.removeAttribute("tabindex"), this.dispatchCustomEvent("joomla.tab.show", "tabs" === this.view ? e.tabButton : e.accordionButton, this.previousActive), i && ("tabs" === this.view ? e.tabButton.focus() : e.accordionButton.focus()), i && this.saveState(e.tab.id), this.dispatchCustomEvent("joomla.tab.shown", "tabs" === this.view ? e.tabButton : e.accordionButton, this.previousActive);
 403        }
 404      }
 405    }, {
 406      key: "createNavs",
 407      value: function value(t) {
 408        if (!(t instanceof Element && "joomla-tab-element" !== t.tagName.toLowerCase()) && [].some.call(this.children, function (e) {
 409          return e === t;
 410        }).length && t.getAttribute("name") && t.getAttribute("id")) {
 411          var e = [].slice.call(this.children).filter(function (t) {
 412            return "joomla-tab-element" === t.tagName.toLowerCase();
 413          }),
 414              n = e.findIndex(function (e) {
 415            return e === t;
 416          }),
 417              i = document.createElement("button");
 418          i.setAttribute("aria-expanded", !!t.hasAttribute("active")), i.setAttribute("aria-controls", t.id), i.setAttribute("type", "button"), i.innerHTML = '<span class="accordion-title">'.concat(t.getAttribute("name"), '<span class="accordion-icon"></span></span>'), t.insertAdjacentElement("beforebegin", i), "tabs" === this.view && i.setAttribute("hidden", ""), i.addEventListener("click", this.activateTab);
 419          var a = document.createElement("button");
 420          a.setAttribute("aria-expanded", !!t.hasAttribute("active")), a.setAttribute("aria-controls", t.id), a.setAttribute("role", "tab"), a.setAttribute("type", "button"), a.innerHTML = "".concat(t.getAttribute("name")), e.length - 1 === n ? (this.tabButtonContainer.appendChild(a), this.tabs.push({
 421            tab: t,
 422            tabButton: a,
 423            accordionButton: i
 424          })) : 0 === n ? (this.tabButtonContainer.insertAdjacentElement("afterbegin", a), this.tabs.slice(0, 0, {
 425            tab: t,
 426            tabButton: a,
 427            accordionButton: i
 428          })) : (this.tabs[n - 1].tabButton.insertAdjacentElement("afterend", a), this.tabs.slice(n - 1, 0, {
 429            tab: t,
 430            tabButton: a,
 431            accordionButton: i
 432          })), a.addEventListener("click", this.activateTab);
 433        }
 434      }
 435    }, {
 436      key: "removeNavs",
 437      value: function value(t) {
 438        if (!(t instanceof Element && "joomla-tab-element" !== t.tagName.toLowerCase()) && [].some.call(this.children, function (e) {
 439          return e === t;
 440        }).length && t.getAttribute("name") && t.getAttribute("id")) {
 441          var e = t.previousSilbingElement;
 442          e && "button" === e.tagName.toLowerCase() && (e.removeEventListener("click", this.keyBehaviour), e.parentNode.removeChild(e));
 443          var n = this.tabButtonContainer.querySelector("[aria-controls=".concat(e.id, "]"));
 444          n && (n.removeEventListener("click", this.keyBehaviour), n.parentNode.removeChild(n));
 445          var i = this.tabs.findIndex(function (e) {
 446            return e.tabs === t;
 447          });
 448          i - 1 == 0 ? this.tabs.shift() : i - 1 === this.tabs.length ? this.tabs.pop() : this.tabs.splice(i - 1, 1);
 449        }
 450      }
 451    }, {
 452      key: "checkView",
 453      value: function value() {
 454        if (this.breakpoint) if (document.body.getBoundingClientRect().width > this.breakpoint) {
 455          if ("tabs" === this.view) return;
 456          this.tabButtonContainer.removeAttribute("hidden"), this.tabs.map(function (t) {
 457            return t.accordionButton.setAttribute("hidden", ""), t.accordionButton.setAttribute("role", "tabpanel"), "true" === t.accordionButton.getAttribute("aria-expanded") && t.tab.setAttribute("active", ""), t;
 458          }), this.setAttribute("view", "tabs");
 459        } else {
 460          if ("accordion" === this.view) return;
 461          this.tabButtonContainer.setAttribute("hidden", ""), this.tabs.map(function (t) {
 462            return t.accordionButton.removeAttribute("hidden"), t.accordionButton.setAttribute("role", "region"), t;
 463          }), this.setAttribute("view", "accordion");
 464        }
 465      }
 466    }, {
 467      key: "getStorageKey",
 468      value: function value() {
 469        return window.location.href.toString().split(window.location.host)[1].replace(/&return=[a-zA-Z0-9%]+/, "").split("#")[0];
 470      }
 471    }, {
 472      key: "saveState",
 473      value: function value(t) {
 474        var e = this.getStorageKey();
 475        sessionStorage.setItem(e, t);
 476      }
 477    }, {
 478      key: "activateFromState",
 479      value: function value() {
 480        var t = this;
 481        this.hasNested = this.querySelector("joomla-tab") instanceof HTMLElement;
 482        var e = sessionStorage.getItem(this.getStorageKey());
 483  
 484        if (e) {
 485          var n = this.tabs.findIndex(function (t) {
 486            return t.tab.id === e;
 487          });
 488          if (n >= 0) this.activateTab(n, !1);else if (this.hasNested && this.querySelector("joomla-tab")) {
 489            var i = [].slice.call(this.querySelectorAll("joomla-tab-element")).reverse().filter(function (t) {
 490              return t.id === e;
 491            });
 492  
 493            if (i.length) {
 494              var a = i[0].closest("joomla-tab");
 495              [].slice.call(a.querySelectorAll("joomla-tab-element")).forEach(function (t) {
 496                t.removeAttribute("active"), t.id === e && t.setAttribute("active", "");
 497              });
 498  
 499              for (var r = function r() {
 500                var t = a.closest("joomla-tab"),
 501                    e = a.parentNode.closest("joomla-tab-element");
 502                [].slice.call(t.querySelectorAll("joomla-tab-element")).forEach(function (t) {
 503                  t.removeAttribute("active"), e === t && (t.setAttribute("active", ""), a = e);
 504                });
 505              }; a.parentNode.closest("joomla-tab") !== this;) {
 506                r();
 507              }
 508  
 509              [].slice.call(this.children).filter(function (t) {
 510                return "joomla-tab-element" === t.tagName.toLowerCase();
 511              }).forEach(function (e) {
 512                e.removeAttribute("active"), e.querySelector("joomla-tab-element[active]") && t.activateTab(e, !1);
 513              });
 514            }
 515          }
 516        }
 517      }
 518    }, {
 519      key: "dispatchCustomEvent",
 520      value: function value(t, e, n) {
 521        var i = new CustomEvent(t, {
 522          bubbles: !0,
 523          cancelable: !0
 524        });
 525        i.relatedTarget = n, e.dispatchEvent(i);
 526      }
 527    }]) && a(i.prototype, u), l && a(i, l), d;
 528  }();
 529  
 530  customElements.define("joomla-tab", m);