bj-web-components 0.2.34 → 0.2.36

package/dist/web/Tabs/BTabs.js

@@ -1 +1,260 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const r=require("react/jsx-runtime"),c=require("react"),M=require("./TabPane.js");;/* empty css            */function I(...s){return s.filter(Boolean).join(" ")}function q(s,n){const[t,a]=c.useState(s);return[n===void 0?t:n,a]}function D(s,n){return c.useMemo(()=>s?s.filter(t=>!!(t&&typeof t=="object"&&"key"in t)):c.Children.toArray(n).flatMap(t=>{if(!c.isValidElement(t))return[];const{tab:a,tabKey:b,...y}=t.props,i=b??t.key;return i===null?[]:[{...y,key:String(i),label:a}]}),[n,s])}function E({active:s,id:n,item:t,onClick:a,onKeyDown:b,tabCount:y,tabIndex:i}){return r.jsxs("button",{"aria-controls":`${n}-panel-${t.key}`,"aria-disabled":t.disabled,"aria-selected":s,className:I("bj-tabs__tab",s&&"bj-tabs__tab--active",t.disabled&&"bj-tabs__tab--disabled"),disabled:t.disabled,id:`${n}-tab-${t.key}`,onClick:a,onKeyDown:b,role:"tab",tabIndex:t.disabled?-1:s?0:-1,type:"button",children:[r.jsx("span",{className:"bj-tabs__tab-btn",children:t.label}),r.jsx("span",{className:"bj-tabs__sr-only",children:`Tab ${i+1} of ${y}`})]})}function L({activeKey:s,id:n,items:t}){return r.jsx("div",{className:"bj-tabs__content-holder",children:r.jsx("div",{className:"bj-tabs__content",children:t.map(a=>{const b=a.key===s;return!b&&!a.forceRender?null:r.jsx("div",{"aria-hidden":!b,"aria-labelledby":`${n}-tab-${a.key}`,className:I("bj-tabs__tabpane",b&&"bj-tabs__tabpane--active",a.className),id:`${n}-panel-${a.key}`,role:"tabpanel",style:a.style,tabIndex:b?0:-1,children:a.children},a.key)})})})}function m({activeKey:s,children:n,centered:t,className:a,defaultActiveKey:b,id:y,items:i,onChange:f,onTabClick:_,style:w,tabBarGutter:F,tabBarStyle:S,tabPosition:x="top",type:T="line"}){const l=D(i,n),K=c.useRef(`bj-tabs-${Math.random().toString(36).slice(2,10)}`),p=y??K.current,[o,v]=q(()=>{var e;return b??((e=l[0])==null?void 0:e.key)},s),[$,P]=c.useState(()=>l.findIndex(e=>e.key===o));c.useEffect(()=>{var d;let e=l.findIndex(u=>u.key===o);e===-1&&(e=Math.max(0,Math.min($,l.length-1)),v((d=l[e])==null?void 0:d.key)),P(e)},[$,o,v,l]);const B=(e,d)=>{_==null||_(e,d),e!==o&&(v(e),f==null||f(e))},R=(e,d)=>{var N;const g=x==="left"||x==="right"?e.key==="ArrowDown"?1:e.key==="ArrowUp"?-1:0:e.key==="ArrowRight"?1:e.key==="ArrowLeft"?-1:0;if(!g)return;e.preventDefault();const j=l.filter(h=>!h.disabled),V=j.findIndex(h=>{var A;return h.key===((A=l[d])==null?void 0:A.key)}),k=j[(V+g+j.length)%j.length];(N=document.getElementById(`${p}-tab-${k==null?void 0:k.key}`))==null||N.focus()};return r.jsxs("div",{className:I("bj-tabs",`bj-tabs--${x}`,`bj-tabs--${T}`,t&&"bj-tabs--centered",a),style:w,children:[r.jsx("div",{className:"bj-tabs__nav",role:"tablist",style:S,children:r.jsx("div",{className:"bj-tabs__nav-wrap",children:r.jsx("div",{className:"bj-tabs__nav-list",children:l.map((e,d)=>r.jsx(E,{active:e.key===o,id:p,item:e,onClick:u=>B(e.key,u),onKeyDown:u=>R(u,d),tabCount:l.length,tabIndex:d},e.key))})})}),r.jsx(L,{activeKey:o,id:p,items:l})]})}m.TabPane=M.TabPane;exports.TabPane=M.TabPane;exports.default=m;
+"use strict";
+
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
+function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t.return || t.return(); } finally { if (u) throw o; } } }; }
+function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+Object.defineProperties(exports, _defineProperty({
+  __esModule: {
+    value: !0
+  }
+}, Symbol.toStringTag, {
+  value: "Module"
+}));
+var s = require("react/jsx-runtime"),
+  c = require("react"),
+  w = require("./TabPane.js");
+; /* empty css            */
+var q = Object.defineProperty,
+  L = Object.defineProperties,
+  C = Object.getOwnPropertyDescriptors,
+  v = Object.getOwnPropertySymbols,
+  N = Object.prototype.hasOwnProperty,
+  T = Object.prototype.propertyIsEnumerable,
+  m = function m(a, t, e) {
+    return t in a ? q(a, t, {
+      enumerable: !0,
+      configurable: !0,
+      writable: !0,
+      value: e
+    }) : a[t] = e;
+  },
+  F = function F(a, t) {
+    for (var e in t || (t = {})) N.call(t, e) && m(a, e, t[e]);
+    if (v) {
+      var _iterator = _createForOfIteratorHelper(v(t)),
+        _step;
+      try {
+        for (_iterator.s(); !(_step = _iterator.n()).done;) {
+          var e = _step.value;
+          T.call(t, e) && m(a, e, t[e]);
+        }
+      } catch (err) {
+        _iterator.e(err);
+      } finally {
+        _iterator.f();
+      }
+    }
+    return a;
+  },
+  G = function G(a, t) {
+    return L(a, C(t));
+  },
+  U = function U(a, t) {
+    var e = {};
+    for (var r in a) N.call(a, r) && t.indexOf(r) < 0 && (e[r] = a[r]);
+    if (a != null && v) {
+      var _iterator2 = _createForOfIteratorHelper(v(a)),
+        _step2;
+      try {
+        for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
+          var r = _step2.value;
+          t.indexOf(r) < 0 && T.call(a, r) && (e[r] = a[r]);
+        }
+      } catch (err) {
+        _iterator2.e(err);
+      } finally {
+        _iterator2.f();
+      }
+    }
+    return e;
+  };
+function h() {
+  for (var _len = arguments.length, a = new Array(_len), _key = 0; _key < _len; _key++) {
+    a[_key] = arguments[_key];
+  }
+  return a.filter(Boolean).join(" ");
+}
+function z(a, t) {
+  var _c$useState = c.useState(a),
+    _c$useState2 = _slicedToArray(_c$useState, 2),
+    e = _c$useState2[0],
+    r = _c$useState2[1];
+  return [t === void 0 ? e : t, r];
+}
+function H(a, t) {
+  return c.useMemo(function () {
+    return a ? a.filter(function (e) {
+      return !!(e && _typeof(e) == "object" && "key" in e);
+    }) : c.Children.toArray(t).flatMap(function (e) {
+      if (!c.isValidElement(e)) return [];
+      var r = e.props,
+        l = r.tab,
+        d = r.tabKey,
+        f = U(r, ["tab", "tabKey"]),
+        _ = d != null ? d : e.key;
+      return _ === null ? [] : [G(F({}, f), {
+        key: String(_),
+        label: l
+      })];
+    });
+  }, [t, a]);
+}
+function J(_ref) {
+  var a = _ref.active,
+    t = _ref.id,
+    e = _ref.item,
+    r = _ref.onClick,
+    l = _ref.onKeyDown,
+    d = _ref.tabCount,
+    f = _ref.tabIndex;
+  return s.jsxs("button", {
+    "aria-controls": "".concat(t, "-panel-").concat(e.key),
+    "aria-disabled": e.disabled,
+    "aria-selected": a,
+    className: h("bj-tabs__tab", a && "bj-tabs__tab--active", e.disabled && "bj-tabs__tab--disabled"),
+    disabled: e.disabled,
+    id: "".concat(t, "-tab-").concat(e.key),
+    onClick: r,
+    onKeyDown: l,
+    role: "tab",
+    tabIndex: e.disabled ? -1 : a ? 0 : -1,
+    type: "button",
+    children: [s.jsx("span", {
+      className: "bj-tabs__tab-btn",
+      children: e.label
+    }), s.jsx("span", {
+      className: "bj-tabs__sr-only",
+      children: "Tab ".concat(f + 1, " of ").concat(d)
+    })]
+  });
+}
+function Q(_ref2) {
+  var a = _ref2.activeKey,
+    t = _ref2.id,
+    e = _ref2.items;
+  return s.jsx("div", {
+    className: "bj-tabs__content-holder",
+    children: s.jsx("div", {
+      className: "bj-tabs__content",
+      children: e.map(function (r) {
+        var l = r.key === a;
+        return !l && !r.forceRender ? null : s.jsx("div", {
+          "aria-hidden": !l,
+          "aria-labelledby": "".concat(t, "-tab-").concat(r.key),
+          className: h("bj-tabs__tabpane", l && "bj-tabs__tabpane--active", r.className),
+          id: "".concat(t, "-panel-").concat(r.key),
+          role: "tabpanel",
+          style: r.style,
+          tabIndex: l ? 0 : -1,
+          children: r.children
+        }, r.key);
+      })
+    })
+  });
+}
+function M(_ref3) {
+  var a = _ref3.activeKey,
+    t = _ref3.children,
+    e = _ref3.centered,
+    r = _ref3.className,
+    l = _ref3.defaultActiveKey,
+    d = _ref3.id,
+    f = _ref3.items,
+    _ = _ref3.onChange,
+    k = _ref3.onTabClick,
+    S = _ref3.style,
+    W = _ref3.tabBarGutter,
+    A = _ref3.tabBarStyle,
+    _ref3$tabPosition = _ref3.tabPosition,
+    j = _ref3$tabPosition === void 0 ? "top" : _ref3$tabPosition,
+    _ref3$type = _ref3.type,
+    K = _ref3$type === void 0 ? "line" : _ref3$type;
+  var o = H(f, t),
+    R = c.useRef("bj-tabs-".concat(Math.random().toString(36).slice(2, 10))),
+    p = d != null ? d : R.current,
+    _z = z(function () {
+      var n;
+      return l != null ? l : (n = o[0]) == null ? void 0 : n.key;
+    }, a),
+    _z2 = _slicedToArray(_z, 2),
+    u = _z2[0],
+    x = _z2[1],
+    _c$useState3 = c.useState(function () {
+      return o.findIndex(function (n) {
+        return n.key === u;
+      });
+    }),
+    _c$useState4 = _slicedToArray(_c$useState3, 2),
+    P = _c$useState4[0],
+    V = _c$useState4[1];
+  c.useEffect(function () {
+    var n;
+    var b = o.findIndex(function (i) {
+      return i.key === u;
+    });
+    b === -1 && (b = Math.max(0, Math.min(P, o.length - 1)), x((n = o[b]) == null ? void 0 : n.key)), V(b);
+  }, [P, u, x, o]);
+  var B = function B(n, b) {
+      k == null || k(n, b), n !== u && (x(n), _ == null || _(n));
+    },
+    D = function D(n, b) {
+      var i;
+      var I = j === "left" || j === "right" ? n.key === "ArrowDown" ? 1 : n.key === "ArrowUp" ? -1 : 0 : n.key === "ArrowRight" ? 1 : n.key === "ArrowLeft" ? -1 : 0;
+      if (!I) return;
+      n.preventDefault();
+      var y = o.filter(function (g) {
+          return !g.disabled;
+        }),
+        E = y.findIndex(function (g) {
+          var $;
+          return g.key === (($ = o[b]) == null ? void 0 : $.key);
+        }),
+        O = y[(E + I + y.length) % y.length];
+      (i = document.getElementById("".concat(p, "-tab-").concat(O == null ? void 0 : O.key))) == null || i.focus();
+    };
+  return s.jsxs("div", {
+    className: h("bj-tabs", "bj-tabs--".concat(j), "bj-tabs--".concat(K), e && "bj-tabs--centered", r),
+    style: S,
+    children: [s.jsx("div", {
+      className: "bj-tabs__nav",
+      role: "tablist",
+      style: A,
+      children: s.jsx("div", {
+        className: "bj-tabs__nav-wrap",
+        children: s.jsx("div", {
+          className: "bj-tabs__nav-list",
+          children: o.map(function (n, b) {
+            return s.jsx(J, {
+              active: n.key === u,
+              id: p,
+              item: n,
+              onClick: function onClick(i) {
+                return B(n.key, i);
+              },
+              onKeyDown: function onKeyDown(i) {
+                return D(i, b);
+              },
+              tabCount: o.length,
+              tabIndex: b
+            }, n.key);
+          })
+        })
+      })
+    }), s.jsx(Q, {
+      activeKey: u,
+      id: p,
+      items: o
+    })]
+  });
+}
+M.TabPane = w.TabPane;
+exports.TabPane = w.TabPane;
+exports.default = M;

package/dist/web/Tabs/BTabs.mjs

@@ -1,130 +1,247 @@
-import { jsxs as g, jsx as b } from "react/jsx-runtime";
-import { useRef as E, useState as A, useEffect as L, useMemo as T, Children as P, isValidElement as F } from "react";
-import { TabPane as G } from "./TabPane.mjs";
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
+function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t.return || t.return(); } finally { if (u) throw o; } } }; }
+function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
+import { jsxs as N, jsx as b } from "react/jsx-runtime";
+import { useRef as R, useState as O, useEffect as L, useMemo as C, Children as F, isValidElement as G } from "react";
+import { TabPane as U } from "./TabPane.mjs";
 /* empty css            */
-function I(...n) {
-  return n.filter(Boolean).join(" ");
+var q = Object.defineProperty,
+  z = Object.defineProperties,
+  H = Object.getOwnPropertyDescriptors,
+  y = Object.getOwnPropertySymbols,
+  P = Object.prototype.hasOwnProperty,
+  A = Object.prototype.propertyIsEnumerable,
+  w = function w(a, t, e) {
+    return t in a ? q(a, t, {
+      enumerable: !0,
+      configurable: !0,
+      writable: !0,
+      value: e
+    }) : a[t] = e;
+  },
+  J = function J(a, t) {
+    for (var e in t || (t = {})) P.call(t, e) && w(a, e, t[e]);
+    if (y) {
+      var _iterator = _createForOfIteratorHelper(y(t)),
+        _step;
+      try {
+        for (_iterator.s(); !(_step = _iterator.n()).done;) {
+          var e = _step.value;
+          A.call(t, e) && w(a, e, t[e]);
+        }
+      } catch (err) {
+        _iterator.e(err);
+      } finally {
+        _iterator.f();
+      }
+    }
+    return a;
+  },
+  Q = function Q(a, t) {
+    return z(a, H(t));
+  },
+  W = function W(a, t) {
+    var e = {};
+    for (var r in a) P.call(a, r) && t.indexOf(r) < 0 && (e[r] = a[r]);
+    if (a != null && y) {
+      var _iterator2 = _createForOfIteratorHelper(y(a)),
+        _step2;
+      try {
+        for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
+          var r = _step2.value;
+          t.indexOf(r) < 0 && A.call(a, r) && (e[r] = a[r]);
+        }
+      } catch (err) {
+        _iterator2.e(err);
+      } finally {
+        _iterator2.f();
+      }
+    }
+    return e;
+  };
+function g() {
+  for (var _len = arguments.length, a = new Array(_len), _key = 0; _key < _len; _key++) {
+    a[_key] = arguments[_key];
+  }
+  return a.filter(Boolean).join(" ");
 }
-function U(n, s) {
-  const [t, a] = A(n);
-  return [s === void 0 ? t : s, a];
+function X(a, t) {
+  var _O = O(a),
+    _O2 = _slicedToArray(_O, 2),
+    e = _O2[0],
+    r = _O2[1];
+  return [t === void 0 ? e : t, r];
 }
-function q(n, s) {
-  return T(() => n ? n.filter((t) => !!(t && typeof t == "object" && "key" in t)) : P.toArray(s).flatMap((t) => {
-    if (!F(t)) return [];
-    const { tab: a, tabKey: l, ...u } = t.props, c = l ?? t.key;
-    return c === null ? [] : [{ ...u, key: String(c), label: a }];
-  }), [s, n]);
+function Y(a, t) {
+  return C(function () {
+    return a ? a.filter(function (e) {
+      return !!(e && _typeof(e) == "object" && "key" in e);
+    }) : F.toArray(t).flatMap(function (e) {
+      if (!G(e)) return [];
+      var r = e.props,
+        l = r.tab,
+        i = r.tabKey,
+        f = W(r, ["tab", "tabKey"]),
+        u = i != null ? i : e.key;
+      return u === null ? [] : [Q(J({}, f), {
+        key: String(u),
+        label: l
+      })];
+    });
+  }, [t, a]);
 }
-function z({
-  active: n,
-  id: s,
-  item: t,
-  onClick: a,
-  onKeyDown: l,
-  tabCount: u,
-  tabIndex: c
-}) {
-  return /* @__PURE__ */ g(
-    "button",
-    {
-      "aria-controls": `${s}-panel-${t.key}`,
-      "aria-disabled": t.disabled,
-      "aria-selected": n,
-      className: I("bj-tabs__tab", n && "bj-tabs__tab--active", t.disabled && "bj-tabs__tab--disabled"),
-      disabled: t.disabled,
-      id: `${s}-tab-${t.key}`,
-      onClick: a,
-      onKeyDown: l,
-      role: "tab",
-      tabIndex: t.disabled ? -1 : n ? 0 : -1,
-      type: "button",
-      children: [
-        /* @__PURE__ */ b("span", { className: "bj-tabs__tab-btn", children: t.label }),
-        /* @__PURE__ */ b("span", { className: "bj-tabs__sr-only", children: `Tab ${c + 1} of ${u}` })
-      ]
-    }
-  );
+function Z(_ref) {
+  var a = _ref.active,
+    t = _ref.id,
+    e = _ref.item,
+    r = _ref.onClick,
+    l = _ref.onKeyDown,
+    i = _ref.tabCount,
+    f = _ref.tabIndex;
+  return /* @__PURE__ */N("button", {
+    "aria-controls": "".concat(t, "-panel-").concat(e.key),
+    "aria-disabled": e.disabled,
+    "aria-selected": a,
+    className: g("bj-tabs__tab", a && "bj-tabs__tab--active", e.disabled && "bj-tabs__tab--disabled"),
+    disabled: e.disabled,
+    id: "".concat(t, "-tab-").concat(e.key),
+    onClick: r,
+    onKeyDown: l,
+    role: "tab",
+    tabIndex: e.disabled ? -1 : a ? 0 : -1,
+    type: "button",
+    children: [/* @__PURE__ */b("span", {
+      className: "bj-tabs__tab-btn",
+      children: e.label
+    }), /* @__PURE__ */b("span", {
+      className: "bj-tabs__sr-only",
+      children: "Tab ".concat(f + 1, " of ").concat(i)
+    })]
+  });
 }
-function H({ activeKey: n, id: s, items: t }) {
-  return /* @__PURE__ */ b("div", { className: "bj-tabs__content-holder", children: /* @__PURE__ */ b("div", { className: "bj-tabs__content", children: t.map((a) => {
-    const l = a.key === n;
-    return !l && !a.forceRender ? null : /* @__PURE__ */ b(
-      "div",
-      {
-        "aria-hidden": !l,
-        "aria-labelledby": `${s}-tab-${a.key}`,
-        className: I("bj-tabs__tabpane", l && "bj-tabs__tabpane--active", a.className),
-        id: `${s}-panel-${a.key}`,
-        role: "tabpanel",
-        style: a.style,
-        tabIndex: l ? 0 : -1,
-        children: a.children
-      },
-      a.key
-    );
-  }) }) });
+function ee(_ref2) {
+  var a = _ref2.activeKey,
+    t = _ref2.id,
+    e = _ref2.items;
+  return /* @__PURE__ */b("div", {
+    className: "bj-tabs__content-holder",
+    children: /* @__PURE__ */b("div", {
+      className: "bj-tabs__content",
+      children: e.map(function (r) {
+        var l = r.key === a;
+        return !l && !r.forceRender ? null : /* @__PURE__ */b("div", {
+          "aria-hidden": !l,
+          "aria-labelledby": "".concat(t, "-tab-").concat(r.key),
+          className: g("bj-tabs__tabpane", l && "bj-tabs__tabpane--active", r.className),
+          id: "".concat(t, "-panel-").concat(r.key),
+          role: "tabpanel",
+          style: r.style,
+          tabIndex: l ? 0 : -1,
+          children: r.children
+        }, r.key);
+      })
+    })
+  });
 }
-function J({
-  activeKey: n,
-  children: s,
-  centered: t,
-  className: a,
-  defaultActiveKey: l,
-  id: u,
-  items: c,
-  onChange: f,
-  onTabClick: p,
-  style: w,
-  tabBarGutter: O,
-  tabBarStyle: M,
-  tabPosition: _ = "top",
-  type: K = "line"
-}) {
-  const r = q(c, s), B = E(`bj-tabs-${Math.random().toString(36).slice(2, 10)}`), j = u ?? B.current, [o, k] = U(
-    () => {
-      var e;
-      return l ?? ((e = r[0]) == null ? void 0 : e.key);
+function ae(_ref3) {
+  var a = _ref3.activeKey,
+    t = _ref3.children,
+    e = _ref3.centered,
+    r = _ref3.className,
+    l = _ref3.defaultActiveKey,
+    i = _ref3.id,
+    f = _ref3.items,
+    u = _ref3.onChange,
+    k = _ref3.onTabClick,
+    T = _ref3.style,
+    te = _ref3.tabBarGutter,
+    M = _ref3.tabBarStyle,
+    _ref3$tabPosition = _ref3.tabPosition,
+    p = _ref3$tabPosition === void 0 ? "top" : _ref3$tabPosition,
+    _ref3$type = _ref3.type,
+    K = _ref3$type === void 0 ? "line" : _ref3$type;
+  var s = Y(f, t),
+    S = R("bj-tabs-".concat(Math.random().toString(36).slice(2, 10))),
+    v = i != null ? i : S.current,
+    _X = X(function () {
+      var n;
+      return l != null ? l : (n = s[0]) == null ? void 0 : n.key;
+    }, a),
+    _X2 = _slicedToArray(_X, 2),
+    c = _X2[0],
+    j = _X2[1],
+    _O3 = O(function () {
+      return s.findIndex(function (n) {
+        return n.key === c;
+      });
+    }),
+    _O4 = _slicedToArray(_O3, 2),
+    m = _O4[0],
+    V = _O4[1];
+  L(function () {
+    var n;
+    var o = s.findIndex(function (d) {
+      return d.key === c;
+    });
+    o === -1 && (o = Math.max(0, Math.min(m, s.length - 1)), j((n = s[o]) == null ? void 0 : n.key)), V(o);
+  }, [m, c, j, s]);
+  var B = function B(n, o) {
+      k == null || k(n, o), n !== c && (j(n), u == null || u(n));
     },
-    n
-  ), [$, V] = A(() => r.findIndex((e) => e.key === o));
-  L(() => {
-    var d;
-    let e = r.findIndex((i) => i.key === o);
-    e === -1 && (e = Math.max(0, Math.min($, r.length - 1)), k((d = r[e]) == null ? void 0 : d.key)), V(e);
-  }, [$, o, k, r]);
-  const R = (e, d) => {
-    p == null || p(e, d), e !== o && (k(e), f == null || f(e));
-  }, S = (e, d) => {
-    var m;
-    const x = _ === "left" || _ === "right" ? e.key === "ArrowDown" ? 1 : e.key === "ArrowUp" ? -1 : 0 : e.key === "ArrowRight" ? 1 : e.key === "ArrowLeft" ? -1 : 0;
-    if (!x) return;
-    e.preventDefault();
-    const y = r.filter((h) => !h.disabled), D = y.findIndex((h) => {
-      var N;
-      return h.key === ((N = r[d]) == null ? void 0 : N.key);
-    }), v = y[(D + x + y.length) % y.length];
-    (m = document.getElementById(`${j}-tab-${v == null ? void 0 : v.key}`)) == null || m.focus();
-  };
-  return /* @__PURE__ */ g("div", { className: I("bj-tabs", `bj-tabs--${_}`, `bj-tabs--${K}`, t && "bj-tabs--centered", a), style: w, children: [
-    /* @__PURE__ */ b("div", { className: "bj-tabs__nav", role: "tablist", style: M, children: /* @__PURE__ */ b("div", { className: "bj-tabs__nav-wrap", children: /* @__PURE__ */ b("div", { className: "bj-tabs__nav-list", children: r.map((e, d) => /* @__PURE__ */ b(
-      z,
-      {
-        active: e.key === o,
-        id: j,
-        item: e,
-        onClick: (i) => R(e.key, i),
-        onKeyDown: (i) => S(i, d),
-        tabCount: r.length,
-        tabIndex: d
-      },
-      e.key
-    )) }) }) }),
-    /* @__PURE__ */ b(H, { activeKey: o, id: j, items: r })
-  ] });
+    D = function D(n, o) {
+      var d;
+      var x = p === "left" || p === "right" ? n.key === "ArrowDown" ? 1 : n.key === "ArrowUp" ? -1 : 0 : n.key === "ArrowRight" ? 1 : n.key === "ArrowLeft" ? -1 : 0;
+      if (!x) return;
+      n.preventDefault();
+      var _ = s.filter(function (h) {
+          return !h.disabled;
+        }),
+        E = _.findIndex(function (h) {
+          var $;
+          return h.key === (($ = s[o]) == null ? void 0 : $.key);
+        }),
+        I = _[(E + x + _.length) % _.length];
+      (d = document.getElementById("".concat(v, "-tab-").concat(I == null ? void 0 : I.key))) == null || d.focus();
+    };
+  return /* @__PURE__ */N("div", {
+    className: g("bj-tabs", "bj-tabs--".concat(p), "bj-tabs--".concat(K), e && "bj-tabs--centered", r),
+    style: T,
+    children: [/* @__PURE__ */b("div", {
+      className: "bj-tabs__nav",
+      role: "tablist",
+      style: M,
+      children: /* @__PURE__ */b("div", {
+        className: "bj-tabs__nav-wrap",
+        children: /* @__PURE__ */b("div", {
+          className: "bj-tabs__nav-list",
+          children: s.map(function (n, o) {
+            return /* @__PURE__ */b(Z, {
+              active: n.key === c,
+              id: v,
+              item: n,
+              onClick: function onClick(d) {
+                return B(n.key, d);
+              },
+              onKeyDown: function onKeyDown(d) {
+                return D(d, o);
+              },
+              tabCount: s.length,
+              tabIndex: o
+            }, n.key);
+          })
+        })
+      })
+    }), /* @__PURE__ */b(ee, {
+      activeKey: c,
+      id: v,
+      items: s
+    })]
+  });
 }
-J.TabPane = G;
-export {
-  G as TabPane,
-  J as default
-};
+ae.TabPane = U;
+export { U as TabPane, ae as default };

package/dist/web/Tabs/TabPane.js

@@ -1 +1,19 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});function e(a){return null}e.displayName="BTabs.TabPane";exports.TabPane=e;exports.default=e;
+"use strict";
+
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+Object.defineProperties(exports, _defineProperty({
+  __esModule: {
+    value: !0
+  }
+}, Symbol.toStringTag, {
+  value: "Module"
+}));
+function e(a) {
+  return null;
+}
+e.displayName = "BTabs.TabPane";
+exports.TabPane = e;
+exports.default = e;