x-next 1.1.0 → 1.3.0

package/dist/es/components/image/ImagePreviewGroup.vue2.js

@@ -1,9 +1,9 @@
-import { defineComponent as D, toRefs as E, reactive as w, computed as u, ref as h, watch as B, provide as F } from "vue";
-import A from "../../_hooks/use-merge-state.js";
+import { defineComponent as T, toRefs as q, reactive as b, computed as r, ref as D, watch as E, provide as F } from "vue";
+import C from "../../_hooks/use-merge-state.js";
 import H from "./ImagePreview.vue.js";
 import { PreviewGroupInjectionKey as J } from "./context.js";
-import { isArray as S, isUndefined as c } from "../../_utils/is.js";
-const $ = /* @__PURE__ */ D({
+import { isArray as A, isUndefined as s } from "../../_utils/is.js";
+const $ = /* @__PURE__ */ T({
   name: "ImagePreviewGroup",
   components: {
     ImagePreview: H
@@ -116,109 +116,108 @@ const $ = /* @__PURE__ */ D({
    * @slot actions
    * @version 2.46.0
    */
-  setup(N, {
-    emit: g
+  setup(B, {
+    emit: m
   }) {
     const {
-      srcList: a,
-      visible: O,
-      defaultVisible: R,
-      current: z,
-      defaultCurrent: L,
-      infinite: C
-    } = E(N), [M, _] = A(R.value, w({
-      value: O
-    })), m = (e) => {
-      e !== M.value && (g("visible-change", e), g("update:visible", e), _(e));
-    }, b = u(() => new Map(S(a == null ? void 0 : a.value) ? a == null ? void 0 : a.value.map((e, t) => [t, {
+      srcList: n,
+      visible: U,
+      defaultVisible: M,
+      current: S,
+      defaultCurrent: N,
+      infinite: w
+    } = q(B), [h, O] = C(M.value, b({
+      value: U
+    })), g = (e) => {
+      e !== h.value && (m("visible-change", e), m("update:visible", e), O(e));
+    }, k = r(() => new Map(A(n == null ? void 0 : n.value) ? n == null ? void 0 : n.value.map((e, t) => [t, {
       url: e,
       canPreview: !0
-    }]) : [])), U = u(() => S(a == null ? void 0 : a.value)), v = h(new Map(b.value || [])), x = h(/* @__PURE__ */ new Map()), p = h([]), d = u(() => Array.from(v.value.keys())), i = u(() => d.value.length);
-    function j(e, t, r) {
-      return U.value ? (x.value.set(e, {
+    }]) : [])), x = r(() => A(n == null ? void 0 : n.value)), c = D(/* @__PURE__ */ new Map()), f = r(() => x.value ? k.value : c.value), z = r(() => Array.from(c.value.keys())), d = r(() => Array.from(f.value.keys())), i = r(() => d.value.length);
+    function L(e, t, u) {
+      return c.value.set(e, {
         url: t,
-        canPreview: r
-      }), p.value.includes(e) || p.value.push(e), function() {
-        x.value.delete(e), p.value = p.value.filter((s) => s !== e);
-      }) : (v.value.set(e, {
-        url: t,
-        canPreview: r
+        canPreview: u
       }), function() {
-        v.value.delete(e);
-      });
+        c.value.delete(e);
+      };
     }
-    B(b, () => {
-      v.value = new Map(b.value || []);
-    });
-    const [n, k] = A(L.value, w({
-      value: z
-    })), f = (e) => {
-      e !== n.value && (g("change", e), g("update:current", e), k(e));
-    }, G = u(() => d.value[n.value]), V = (e) => {
+    const [a, R] = C(N.value, b({
+      value: S
+    })), v = (e) => {
+      e !== a.value && (m("change", e), m("update:current", e), R(e));
+    }, _ = r(() => d.value[a.value]), j = (e) => {
       const t = d.value.indexOf(e);
-      t >= 0 && t !== n.value && f(t);
-    }, K = u(() => {
+      t >= 0 && t !== a.value && v(t);
+    }, G = r(() => {
       var e;
-      return (e = v.value.get(G.value)) == null ? void 0 : e.url;
+      return (e = f.value.get(_.value)) == null ? void 0 : e.url;
     });
-    B([i, n], () => {
-      if (i.value === 0) {
-        m(!1);
-        return;
-      }
-      if (n.value < 0) {
-        f(0);
-        return;
+    E(
+      [i, a],
+      () => {
+        if (i.value === 0) {
+          g(!1);
+          return;
+        }
+        if (a.value < 0) {
+          v(0);
+          return;
+        }
+        a.value >= i.value && v(i.value - 1);
+      },
+      // 自动收集模式须等子图片注册；显式列表在 setup 时即可检查边界。
+      {
+        immediate: x.value
       }
-      n.value >= i.value && f(i.value - 1);
-    }), F(J, w({
-      registerImageUrl: j,
+    ), F(J, b({
+      registerImageUrl: L,
       preview: (e) => {
-        if (U.value) {
-          const r = x.value.get(e), l = r != null && r.canPreview ? p.value.indexOf(e) : -1;
-          l >= 0 && l < i.value && (f(l), m(!0));
+        if (x.value) {
+          const u = c.value.get(e), o = u != null && u.canPreview ? z.value.indexOf(e) : -1;
+          o >= 0 && o < i.value && (v(o), g(!0));
           return;
         }
-        const t = v.value.get(e);
-        t != null && t.canPreview && (V(e), m(!0));
+        const t = f.value.get(e);
+        t != null && t.canPreview && (j(e), g(!0));
       }
     }));
-    const y = u(() => {
-      const e = (r, l) => {
-        var s;
-        for (let o = r; o <= l; o++) {
-          const P = d.value[o];
-          if ((s = v.value.get(P)) != null && s.canPreview)
-            return o;
+    const y = r(() => {
+      const e = (u, o) => {
+        var p;
+        for (let l = u; l <= o; l++) {
+          const P = d.value[l];
+          if ((p = f.value.get(P)) != null && p.canPreview)
+            return l;
         }
-      }, t = e(n.value + 1, i.value - 1);
-      return c(t) && C.value ? e(0, n.value - 1) : t;
-    }), I = u(() => {
-      const e = (r, l) => {
-        var s;
-        for (let o = r; o >= l; o--) {
-          const P = d.value[o];
-          if ((s = v.value.get(P)) != null && s.canPreview)
-            return o;
+      }, t = e(a.value + 1, i.value - 1);
+      return s(t) && w.value ? e(0, a.value - 1) : t;
+    }), I = r(() => {
+      const e = (u, o) => {
+        var p;
+        for (let l = u; l >= o; l--) {
+          const P = d.value[l];
+          if ((p = f.value.get(P)) != null && p.canPreview)
+            return l;
         }
-      }, t = e(n.value - 1, 0);
-      return c(t) && C.value ? e(i.value - 1, n.value + 1) : t;
-    }), T = u(() => c(I.value) ? void 0 : () => {
-      !c(I.value) && f(I.value);
-    }), q = u(() => c(y.value) ? void 0 : () => {
-      !c(y.value) && f(y.value);
+      }, t = e(a.value - 1, 0);
+      return s(t) && w.value ? e(i.value - 1, a.value + 1) : t;
+    }), V = r(() => s(I.value) ? void 0 : () => {
+      !s(I.value) && v(I.value);
+    }), K = r(() => s(y.value) ? void 0 : () => {
+      !s(y.value) && v(y.value);
     });
     return {
-      mergedVisible: M,
-      currentUrl: K,
+      mergedVisible: h,
+      currentUrl: G,
       prevIndex: I,
       nextIndex: y,
       onClose() {
-        m(!1);
+        g(!1);
       },
-      groupArrowProps: w({
-        onPrev: T,
-        onNext: q
+      groupArrowProps: b({
+        onPrev: V,
+        onNext: K
       })
     };
   }

package/dist/es/components/rate/Rate.js

@@ -1,16 +1,16 @@
-import { defineComponent as Z, toRefs as $, toRef as ee, ref as g, computed as v, watch as le, onMounted as ae, createVNode as r, mergeProps as te } from "vue";
-import b from "../../node_modules/.pnpm/number-precision@1.6.0/node_modules/number-precision/build/index.es.js";
-import { getClassNameMixin as re } from "../../_utils/config.js";
-import { isUndefined as ne, isNull as oe, isString as ue, isObject as ce } from "../../_utils/is.js";
-import { useFormItem as ie } from "../../_hooks/use-form-item.js";
-const se = () => r("svg", {
+import { defineComponent as ee, toRefs as le, toRef as ae, ref as b, computed as v, watch as te, onMounted as re, createVNode as r, mergeProps as ne } from "vue";
+import x from "../../node_modules/.pnpm/number-precision@1.6.0/node_modules/number-precision/build/index.es.js";
+import { getClassNameMixin as oe } from "../../_utils/config.js";
+import { isUndefined as ue, isNull as ce, isString as ie, isObject as se } from "../../_utils/is.js";
+import { useFormItem as de, useFormItemControl as fe } from "../../_hooks/use-form-item.js";
+const ve = () => r("svg", {
   viewBox: "0 0 24 24",
   "aria-hidden": "true",
   focusable: "false"
 }, [r("path", {
   d: "M12 2.8l2.75 5.57 6.15.9-4.45 4.33 1.05 6.12L12 16.83l-5.5 2.89 1.05-6.12L3.1 9.27l6.15-.9L12 2.8z",
   fill: "currentColor"
-}, null)]), de = () => r("svg", {
+}, null)]), me = () => r("svg", {
   viewBox: "0 0 24 24",
   "aria-hidden": "true",
   focusable: "false"
@@ -60,7 +60,7 @@ const se = () => r("svg", {
   stroke: "var(--x-rate-face-detail-color)",
   "stroke-width": "1.7",
   "stroke-linecap": "round"
-}, null)]), fe = () => r("svg", {
+}, null)]), he = () => r("svg", {
   viewBox: "0 0 24 24",
   "aria-hidden": "true",
   focusable: "false"
@@ -85,7 +85,7 @@ const se = () => r("svg", {
   stroke: "var(--x-rate-face-detail-color)",
   "stroke-width": "1.7",
   "stroke-linecap": "round"
-}, null)]), we = /* @__PURE__ */ Z({
+}, null)]), ke = /* @__PURE__ */ ee({
   name: "Rate",
   inheritAttrs: !1,
   props: {
@@ -223,168 +223,171 @@ const se = () => r("svg", {
    * @binding {boolean} disabled
    */
   setup(t, {
-    attrs: V,
+    attrs: w,
     emit: c,
     expose: _,
-    slots: F
+    slots: I
   }) {
-    const o = re("rate"), {
+    const o = oe("rate"), {
       modelValue: p
-    } = $(t), {
-      mergedDisabled: z,
-      eventHandlers: w
-    } = ie({
-      disabled: ee(t, "disabled")
-    }), M = g(null), x = g(t.defaultValue), h = g(), k = g(!1), C = g(), s = v(() => Math.max(0, t.grading ? 5 : Math.floor(t.count))), d = v(() => z.value), B = v(() => !d.value && !t.readonly), N = (e) => {
-      const l = s.value, a = Number(e ?? 0);
+    } = le(t), {
+      formItemCtx: z,
+      mergedDisabled: E,
+      eventHandlers: C
+    } = de({
+      disabled: ae(t, "disabled")
+    }), K = fe(z, () => w, {
+      labelable: !1
+    }), B = b(null), k = b(t.defaultValue), y = b(), V = b(!1), M = b(), i = v(() => Math.max(0, t.grading ? 5 : Math.floor(t.count))), s = v(() => E.value), N = v(() => !s.value && !t.readonly), A = (e) => {
+      const l = i.value, a = Number(e ?? 0);
       if (!Number.isFinite(a) || a <= 0 || l <= 0)
         return 0;
-      const n = t.allowHalf ? b.times(b.round(b.divide(a, 0.5), 0), 0.5) : Math.round(a);
+      const n = t.allowHalf ? x.times(x.round(x.divide(a, 0.5), 0), 0.5) : Math.round(a);
       return Math.min(l, Math.max(0, n));
-    }, f = v(() => N(t.modelValue ?? x.value)), m = v(() => N(h.value ?? f.value));
-    le(p, (e) => {
-      (ne(e) || oe(e)) && (x.value = 0);
+    }, d = v(() => A(t.modelValue ?? k.value)), m = v(() => A(y.value ?? d.value));
+    te(p, (e) => {
+      (ue(e) || ce(e)) && (k.value = 0);
     });
     const H = v(() => {
-      if (ue(t.color))
+      if (ie(t.color))
         return Array.from({
-          length: s.value
+          length: i.value
         }, () => t.color);
-      if (ce(t.color)) {
+      if (se(t.color)) {
         const e = Object.keys(t.color).map(Number).filter((l) => Number.isFinite(l)).sort((l, a) => l - a);
         return Array.from({
-          length: s.value
+          length: i.value
         }, (l, a) => {
-          const n = a + 1, u = e.find((i) => n <= i) ?? e[e.length - 1];
+          const n = a + 1, u = e.find((h) => n <= h) ?? e[e.length - 1];
           return u ? t.color[u] : void 0;
         });
       }
-    }), I = (e, l) => {
-      var n, u, i, y;
-      const a = N(e);
-      if (a === f.value) {
-        t.allowClear && a !== 0 && (x.value = 0, c("update:modelValue", 0), c("change", 0), (u = (n = w.value) == null ? void 0 : n.onChange) == null || u.call(n, l));
+    }), R = (e, l, a = !1) => {
+      var u, h, f, g;
+      const n = A(e);
+      if (n === d.value) {
+        a && t.allowClear && n !== 0 && (k.value = 0, c("update:modelValue", 0), c("change", 0), (h = (u = C.value) == null ? void 0 : u.onChange) == null || h.call(u, l));
         return;
       }
-      x.value = a, C.value = a, c("update:modelValue", a), c("change", a), (y = (i = w.value) == null ? void 0 : i.onChange) == null || y.call(i, l);
-    }, R = (e, l) => {
+      k.value = n, M.value = n, c("update:modelValue", n), c("change", n), (g = (f = C.value) == null ? void 0 : f.onChange) == null || g.call(f, l);
+    }, L = (e, l) => {
       if (!t.allowHalf)
         return e + 1;
       const n = l.currentTarget.getBoundingClientRect(), u = l.clientX - n.left <= n.width / 2;
       return e + (u ? 0.5 : 1);
-    }, E = (e, l) => {
-      if (!B.value)
-        return;
-      const a = R(e, l);
-      h.value !== a && (h.value = a, c("hoverChange", a));
-    }, K = () => {
-      h.value !== void 0 && (h.value = void 0, c("hoverChange", void 0));
     }, P = (e, l) => {
-      B.value && I(R(e, l), l);
-    }, U = (e) => {
-      if (c("keydown", e), !B.value)
+      if (!N.value)
+        return;
+      const a = L(e, l);
+      y.value !== a && (y.value = a, c("hoverChange", a));
+    }, U = () => {
+      y.value !== void 0 && (y.value = void 0, c("hoverChange", void 0));
+    }, G = (e, l) => {
+      N.value && R(L(e, l), l, !0);
+    }, T = (e) => {
+      if (c("keydown", e), !N.value)
         return;
       const l = t.allowHalf ? 0.5 : 1;
       let a;
       if (e.key === "ArrowRight" || e.key === "ArrowUp")
-        a = b.plus(f.value, l);
+        a = x.plus(d.value, l);
       else if (e.key === "ArrowLeft" || e.key === "ArrowDown")
-        a = b.minus(f.value, l);
+        a = x.minus(d.value, l);
       else if (e.key === "Home")
         a = 0;
       else if (e.key === "End")
-        a = s.value;
+        a = i.value;
       else {
         const n = Number(e.key);
-        Number.isInteger(n) && n >= 0 && n <= s.value && (a = n);
+        Number.isInteger(n) && n >= 0 && n <= i.value && (a = n);
       }
-      a !== void 0 && (e.preventDefault(), I(a, e));
-    }, G = (e) => {
+      a !== void 0 && (e.preventDefault(), R(a, e));
+    }, X = (e) => {
       var l, a;
-      k.value = !0, c("focus", e), (a = (l = w.value) == null ? void 0 : l.onFocus) == null || a.call(l, e);
-    }, T = (e) => {
+      V.value = !0, c("focus", e), (a = (l = C.value) == null ? void 0 : l.onFocus) == null || a.call(l, e);
+    }, q = (e) => {
       var l, a;
-      k.value = !1, c("blur", e), (a = (l = w.value) == null ? void 0 : l.onBlur) == null || a.call(l, e);
-    }, X = () => {
-      C.value = void 0;
-    }, L = () => {
+      V.value = !1, c("blur", e), (a = (l = C.value) == null ? void 0 : l.onBlur) == null || a.call(l, e);
+    }, J = () => {
+      M.value = void 0;
+    }, S = () => {
       var e;
-      d.value || (e = M.value) == null || e.focus();
+      s.value || (e = B.value) == null || e.focus();
     };
     _({
-      focus: L,
+      focus: S,
       blur: () => {
         var e;
-        (e = M.value) == null || e.blur();
+        (e = B.value) == null || e.blur();
       }
-    }), ae(() => {
-      t.autofocus && L();
+    }), re(() => {
+      t.autofocus && S();
     });
-    const q = (e) => e + 1 > m.value ? r(O, null, null) : m.value <= 2 ? r(de, null, null) : m.value <= 3 ? r(O, null, null) : r(fe, null, null), S = (e) => t.grading ? q(e) : F.character ? F.character({
+    const Q = (e) => e + 1 > m.value ? r(O, null, null) : m.value <= 2 ? r(me, null, null) : m.value <= 3 ? r(O, null, null) : r(he, null, null), j = (e) => t.grading ? Q(e) : I.character ? I.character({
       index: e,
-      value: f.value,
-      count: s.value,
-      disabled: d.value
-    }) : r(se, null, null), J = (e) => {
+      value: d.value,
+      count: i.value,
+      disabled: s.value
+    }) : r(ve, null, null), W = (e) => {
       var a, n;
       const l = Math.max(0, Math.ceil(m.value) - 1);
       return ((a = H.value) == null ? void 0 : a[l]) ?? ((n = H.value) == null ? void 0 : n[e]);
-    }, Q = (e, l) => {
+    }, Y = (e, l) => {
       var D;
-      const a = l + 1, n = t.allowHalf && m.value === l + 0.5, u = a <= m.value, i = a <= f.value, y = J(l), j = y ? {
-        color: y
-      } : void 0, Y = [o.element("character"), {
+      const a = l + 1, n = t.allowHalf && m.value === l + 0.5, u = a <= m.value, h = a <= d.value, f = W(l), g = f ? {
+        color: f
+      } : void 0, $ = [o.element("character"), {
         [o.element("character-full")]: u,
         [o.element("character-half")]: n,
-        [o.element("character-checked")]: i,
-        [o.element("character-focused")]: k.value && Math.ceil(f.value) === a,
-        [o.element("character-scale")]: C.value !== void 0 && a <= Math.ceil(C.value),
-        [o.element("character-disabled")]: d.value
+        [o.element("character-checked")]: h,
+        [o.element("character-focused")]: V.value && Math.ceil(d.value) === a,
+        [o.element("character-scale")]: M.value !== void 0 && a <= Math.ceil(M.value),
+        [o.element("character-disabled")]: s.value
       }];
       return r("div", {
         key: l,
-        class: Y,
+        class: $,
         title: (D = t.tooltips) == null ? void 0 : D[l],
         role: "radio",
-        "aria-checked": i,
+        "aria-checked": Math.ceil(d.value) === a,
         "aria-posinset": a,
-        "aria-setsize": s.value,
-        "aria-disabled": d.value || void 0,
-        onMousemove: (A) => E(l, A),
-        onClick: (A) => P(l, A),
-        onAnimationend: X
+        "aria-setsize": i.value,
+        "aria-disabled": s.value || void 0,
+        onMousemove: (F) => P(l, F),
+        onClick: (F) => G(l, F),
+        onAnimationend: J
       }, [r("div", {
         class: o.element("character-left"),
-        style: n ? j : void 0
-      }, [S(l)]), r("div", {
+        style: n ? g : void 0
+      }, [j(l)]), r("div", {
         class: o.element("character-right"),
-        style: u ? j : void 0
-      }, [S(l)])]);
-    }, W = v(() => [o.block, V.class, {
-      [o.modifier("disabled")]: d.value,
+        style: u ? g : void 0
+      }, [j(l)])]);
+    }, Z = v(() => [o.block, w.class, {
+      [o.modifier("disabled")]: s.value,
       [o.modifier("readonly")]: t.readonly,
       [o.modifier("grading")]: t.grading,
-      [o.modifier("focused")]: k.value
+      [o.modifier("focused")]: V.value
     }]);
     return () => {
-      const e = Object.fromEntries(Object.entries(V).filter(([l]) => l !== "class" && l !== "style"));
-      return r("div", te(e, {
-        ref: M,
-        class: W.value,
-        style: V.style,
+      const e = Object.fromEntries(Object.entries(w).filter(([l]) => l !== "class" && l !== "style"));
+      return r("div", ne(e, K.value, {
+        ref: B,
+        class: Z.value,
+        style: w.style,
         role: "radiogroup",
-        tabindex: d.value ? -1 : t.tabindex,
-        "aria-disabled": d.value || void 0,
-        onMouseleave: K,
-        onKeydown: U,
-        onFocus: G,
-        onBlur: T
+        tabindex: s.value ? -1 : t.tabindex,
+        "aria-disabled": s.value || void 0,
+        onMouseleave: U,
+        onKeydown: T,
+        onFocus: X,
+        onBlur: q
       }), [Array.from({
-        length: s.value
-      }).map(Q)]);
+        length: i.value
+      }).map(Y)]);
     };
   }
 });
 export {
-  we as default
+  ke as default
 };

package/dist/es/components/time-picker/TimeColumn.vue.js

@@ -1,34 +1,41 @@
-import d from "./TimeColumn.vue2.js";
-import { resolveComponent as c, openBlock as o, createElementBlock as a, withKeys as t, withModifiers as n, normalizeClass as r, createVNode as m, withCtx as b, createElementVNode as u, Fragment as p, renderList as v, toDisplayString as f } from "vue";
-import N from "../../_virtual/_plugin-vue_export-helper.js";
-const $ = ["aria-label"], y = ["aria-selected", "aria-disabled", "disabled", "onClick"];
-function C(e, s, k, w, S, g) {
-  const i = c("Scrollbar");
-  return o(), a("div", {
+import v from "./TimeColumn.vue2.js";
+import { resolveComponent as u, openBlock as n, createElementBlock as t, withKeys as o, withModifiers as s, normalizeClass as i, createVNode as b, withCtx as p, createElementVNode as c, Fragment as f, renderList as $, toDisplayString as y } from "vue";
+import I from "../../_virtual/_plugin-vue_export-helper.js";
+const N = ["aria-label", "aria-activedescendant", "aria-disabled", "tabindex"], g = ["id", "aria-selected", "aria-disabled", "disabled", "onClick"];
+function B(e, a, C, k, w, S) {
+  const d = u("Scrollbar");
+  return n(), t("div", {
     ref: "columnRef",
-    class: r(e.className.element("column")),
+    class: i(e.className.element("column")),
     role: "listbox",
     "aria-label": e.label,
-    tabindex: "0",
+    "aria-activedescendant": e.activeItem ? e.getItemId(e.activeItem) : void 0,
+    "aria-disabled": !e.activeItem || void 0,
+    tabindex: e.activeItem ? 0 : -1,
     onKeydown: [
-      s[0] || (s[0] = t(n((l) => e.moveActive(-1), ["prevent"]), ["up"])),
-      s[1] || (s[1] = t(n((l) => e.moveActive(1), ["prevent"]), ["down"])),
-      s[2] || (s[2] = t(n((...l) => e.selectActive && e.selectActive(...l), ["prevent"]), ["enter"]))
+      a[1] || (a[1] = o(s((l) => e.moveActive(-1), ["prevent"]), ["up"])),
+      a[2] || (a[2] = o(s((l) => e.moveActive(1), ["prevent"]), ["down"])),
+      a[3] || (a[3] = o(s((...l) => e.selectActive && e.selectActive(...l), ["prevent"]), ["enter"])),
+      a[4] || (a[4] = o(s((l) => e.moveBoundary(!1), ["prevent"]), ["home"])),
+      a[5] || (a[5] = o(s((l) => e.moveBoundary(!0), ["prevent"]), ["end"]))
     ]
   }, [
-    m(i, {
+    b(d, {
+      tabindex: "-1",
       "outer-class": e.className.element("column-scrollbar"),
       "outer-style": { height: "100%" },
       "disable-horizontal": ""
     }, {
-      default: b(() => [
-        u("div", {
-          class: r(e.className.element("column-list"))
+      default: p(() => [
+        c("div", {
+          class: i(e.className.element("column-list"))
         }, [
-          (o(!0), a(p, null, v(e.items, (l) => (o(), a("button", {
+          (n(!0), t(f, null, $(e.items, (l) => (n(), t("button", {
             key: String(l.value),
+            id: e.getItemId(l),
+            tabindex: "-1",
             type: "button",
-            class: r([
+            class: i([
               e.className.element("cell"),
               {
                 [e.className.is("selected")]: l.selected,
@@ -39,15 +46,19 @@ function C(e, s, k, w, S, g) {
             "aria-selected": !!l.selected,
             "aria-disabled": !!l.disabled,
             disabled: l.disabled,
-            onClick: (h) => e.handleSelect(l)
-          }, f(l.label), 11, y))), 128))
+            onClick: (m) => e.handleSelect(l),
+            onFocus: a[0] || (a[0] = (m) => {
+              var r;
+              return (r = e.columnRef) == null ? void 0 : r.focus();
+            })
+          }, y(l.label), 43, g))), 128))
         ], 2)
       ]),
       _: 1
     }, 8, ["outer-class"])
-  ], 42, $);
+  ], 42, N);
 }
-const E = /* @__PURE__ */ N(d, [["render", C]]);
+const F = /* @__PURE__ */ I(v, [["render", B]]);
 export {
-  E as default
+  F as default
 };