@scalar/components 0.16.20 → 0.16.22

package/dist/components/ScalarCombobox/ScalarComboboxOption.vue.js

@@ -1,13 +1,13 @@
-import { defineComponent as o, createElementBlock as r, openBlock as s, normalizeClass as n, unref as t, renderSlot as c } from "vue";
-import { cva as l, cx as i } from "@scalar/use-hooks/useBindCx";
-const p = ["aria-selected"], b = /* @__PURE__ */ o({
+import { defineComponent as o, createElementBlock as n, openBlock as r, normalizeClass as l, unref as t, renderSlot as s } from "vue";
+import { cva as i, cx as d } from "@scalar/use-hooks/useBindCx";
+const m = ["aria-selected"], b = /* @__PURE__ */ o({
   __name: "ScalarComboboxOption",
   props: {
     active: { type: Boolean },
     selected: { type: Boolean }
   },
-  setup(d) {
-    const a = l({
+  setup(e) {
+    const a = i({
       base: [
         // Group
         "group/item",
@@ -23,17 +23,17 @@ const p = ["aria-selected"], b = /* @__PURE__ */ o({
         active: { true: "bg-b-2" }
       }
     });
-    return (e, m) => (s(), r("li", {
+    return (c, u) => (r(), n("li", {
       "aria-selected": e.selected,
-      class: n(t(i)(t(a)({ active: e.active, selected: e.selected }))),
+      class: l(t(d)(t(a)({ active: e.active, selected: e.selected }))),
       role: "option",
       tabindex: "-1"
     }, [
-      c(e.$slots, "default", {
+      s(c.$slots, "default", {
         active: e.active,
         selected: e.selected
       })
-    ], 10, p));
+    ], 10, m));
   }
 });
 export {

package/dist/components/ScalarCombobox/ScalarComboboxOptionGroup.vue.js

@@ -1,26 +1,26 @@
-import { defineComponent as a, useId as i, createElementBlock as o, openBlock as d, createCommentVNode as t, renderSlot as l } from "vue";
-const n = ["id", "aria-labelledby", "role"], r = ["id"], m = /* @__PURE__ */ a({
+import { defineComponent as a, useId as i, createElementBlock as t, openBlock as l, createCommentVNode as n, renderSlot as o } from "vue";
+const r = ["id", "aria-labelledby", "role"], c = ["id"], m = /* @__PURE__ */ a({
   __name: "ScalarComboboxOptionGroup",
   props: {
     id: { default: () => i() },
     hidden: { type: Boolean, default: !1 }
   },
-  setup(s) {
-    return (e, p) => (d(), o("div", {
+  setup(e) {
+    return (d, s) => (l(), t("div", {
       id: e.id,
       "aria-labelledby": e.id ? `${e.id}-label` : void 0,
       class: "contents",
       role: e.hidden ? void 0 : "group"
     }, [
-      e.hidden ? t("", !0) : (d(), o("div", {
+      e.hidden ? n("", !0) : (l(), t("div", {
         key: 0,
         id: `${e.id}-label`,
         class: "min-w-0 truncate px-2.5 py-1.5 text-c-2"
       }, [
-        l(e.$slots, "label")
-      ], 8, r)),
-      l(e.$slots, "default")
-    ], 8, n));
+        o(d.$slots, "label")
+      ], 8, c)),
+      o(d.$slots, "default")
+    ], 8, r));
   }
 });
 export {

package/dist/components/ScalarCombobox/ScalarComboboxOptions.vue.js

@@ -1,10 +1,10 @@
-import { defineComponent as W, mergeModels as O, useModel as X, useSlots as Y, useId as z, computed as w, ref as M, onMounted as D, watch as Z, createElementBlock as c, openBlock as a, Fragment as m, createElementVNode as k, withDirectives as G, createVNode as I, unref as h, withKeys as V, withModifiers as y, vModelText as _, createBlock as C, createCommentVNode as K, renderList as q, withCtx as x, renderSlot as S, toDisplayString as F, createTextVNode as ee, vShow as te } from "vue";
+import { defineComponent as W, mergeModels as O, useModel as X, useSlots as Y, useId as z, computed as w, ref as I, onMounted as D, watch as Z, createElementBlock as v, openBlock as s, Fragment as m, createElementVNode as k, withDirectives as G, createVNode as h, unref as V, withKeys as C, withModifiers as y, vModelText as _, createBlock as S, createCommentVNode as K, renderList as q, withCtx as g, renderSlot as B, toDisplayString as F, createTextVNode as ee, vShow as te } from "vue";
 import { ScalarIconMagnifyingGlass as le, ScalarIconPlus as oe } from "@scalar/icons";
 import P from "./ScalarComboboxOption.vue.js";
 import ne from "./ScalarComboboxOptionGroup.vue.js";
 import { isGroups as R } from "./types.js";
 import ie from "../ScalarListbox/ScalarListboxCheckbox.vue.js";
-const se = { class: "relative flex" }, ae = ["aria-activedescendant", "placeholder"], de = ["aria-multiselectable"], ue = { class: "inline-block min-w-0 flex-1 truncate text-c-1" }, be = /* @__PURE__ */ W({
+const ae = { class: "relative flex" }, se = ["aria-activedescendant", "placeholder"], de = ["aria-multiselectable"], ue = { class: "inline-block min-w-0 flex-1 truncate text-c-1" }, be = /* @__PURE__ */ W({
   inheritAttrs: !1,
   __name: "ScalarComboboxOptions",
   props: /* @__PURE__ */ O({
@@ -16,9 +16,9 @@ const se = { class: "relative flex" }, ae = ["aria-activedescendant", "placehold
     modelModifiers: {}
   }),
   emits: /* @__PURE__ */ O(["add"], ["update:modelValue"]),
-  setup(B, { emit: U }) {
-    const d = B, j = U, i = X(B, "modelValue"), g = Y(), $ = `scalar-combobox-items-${z()}`, f = { id: `${z()}-add`, label: "Add a new option" };
-    function p(t) {
+  setup(f, { emit: U }) {
+    const d = f, j = U, i = X(f, "modelValue"), M = Y(), $ = `scalar-combobox-items-${z()}`, p = { id: `${z()}-add`, label: "Add a new option" };
+    function b(t) {
       return `${$}-${t.id}`;
     }
     const r = w(
@@ -32,24 +32,24 @@ const se = { class: "relative flex" }, ae = ["aria-activedescendant", "placehold
         [{ label: "", options: d.options }]
       )
       // G is OptionGroup<O>
-    ), u = M(""), l = M(i.value?.[0] ?? r.value[0]);
+    ), u = I(""), l = I(i.value?.[0] ?? r.value[0]);
     D(() => {
       u.value = "", l.value = i.value?.[0] ?? r.value[0], i.value[0] && setTimeout(() => {
         const e = i.value[0];
-        e && document?.getElementById(p(e))?.scrollIntoView({ block: "nearest" });
+        e && document?.getElementById(b(e))?.scrollIntoView({ block: "nearest" });
       }, 10);
     }), Z(
       () => u.value,
       () => l.value = N.value[0]
     );
-    const b = w(
+    const x = w(
       () => u.value === "" ? r.value : r.value.filter((t) => t.label.toLowerCase().includes(u.value.toLowerCase()))
     ), N = w(
-      () => g.add ? [...b.value, f] : b.value
+      () => M.add ? [...x.value, p] : x.value
     );
     function A(t) {
       if (t) {
-        if (t.id === f.id) {
+        if (t.id === p.id) {
           T();
           return;
         }
@@ -60,10 +60,10 @@ const se = { class: "relative flex" }, ae = ["aria-activedescendant", "placehold
       }
     }
     function E(t) {
-      const e = N.value, v = e.findIndex(
+      const e = N.value, c = e.findIndex(
         (n) => n.id === l.value?.id
       ) + t;
-      v < 0 || v > e.length - 1 || (l.value = e[v], l.value && document?.getElementById(p(l.value))?.scrollIntoView({
+      c < 0 || c > e.length - 1 || (l.value = e[c], l.value && document?.getElementById(b(l.value))?.scrollIntoView({
         behavior: "smooth",
         block: "nearest"
       }));
@@ -71,79 +71,79 @@ const se = { class: "relative flex" }, ae = ["aria-activedescendant", "placehold
     function T() {
       j("add"), u.value = "";
     }
-    const L = M(null);
-    return D(() => setTimeout(() => L.value?.focus(), 0)), (t, e) => (a(), c(m, null, [
-      k("div", se, [
-        I(h(le), { class: "pointer-events-none absolute left-2.5 top-1/2 -translate-y-1/2 text-c-3 size-4" }),
+    const L = I(null);
+    return D(() => setTimeout(() => L.value?.focus(), 0)), (t, e) => (s(), v(m, null, [
+      k("div", ae, [
+        h(V(le), { class: "pointer-events-none absolute left-2.5 top-1/2 -translate-y-1/2 text-c-3 size-4" }),
         G(k("input", {
           ref_key: "input",
           ref: L,
           "onUpdate:modelValue": e[0] || (e[0] = (o) => u.value = o),
-          "aria-activedescendant": l.value ? p(l.value) : void 0,
+          "aria-activedescendant": l.value ? b(l.value) : void 0,
           "aria-autocomplete": "list",
           "aria-controls": $,
           class: "min-w-0 flex-1 rounded border-0 py-2.5 pl-8 pr-3 leading-none text-c-1 -outline-offset-1",
           "data-1p-ignore": "",
-          placeholder: t.placeholder,
+          placeholder: f.placeholder,
           role: "combobox",
           tabindex: "0",
           type: "text",
           onKeydown: [
-            e[1] || (e[1] = V(y((o) => E(1), ["prevent"]), ["down"])),
-            e[2] || (e[2] = V(y((o) => l.value && A(l.value), ["prevent"]), ["enter"])),
-            e[3] || (e[3] = V(y((o) => E(-1), ["prevent"]), ["up"]))
+            e[1] || (e[1] = C(y((o) => E(1), ["prevent"]), ["down"])),
+            e[2] || (e[2] = C(y((o) => l.value && A(l.value), ["prevent"]), ["enter"])),
+            e[3] || (e[3] = C(y((o) => E(-1), ["prevent"]), ["up"]))
           ]
-        }, null, 40, ae), [
+        }, null, 40, se), [
           [_, u.value]
         ])
       ]),
       G(k("ul", {
         id: $,
-        "aria-multiselectable": t.multiselect,
+        "aria-multiselectable": f.multiselect,
         class: "border-t p-0.75 custom-scroll overscroll-contain flex-1 min-h-0",
         role: "listbox",
         tabindex: "-1"
       }, [
-        (a(!0), c(m, null, q(H.value, (o, v) => (a(), C(ne, {
-          id: `${$}-group-${v}`,
-          key: v,
+        (s(!0), v(m, null, q(H.value, (o, c) => (s(), S(ne, {
+          id: `${$}-group-${c}`,
+          key: c,
           hidden: (
             // Only show the group label if there are some results
-            !o.options.some((n) => b.value.some((s) => s.id === n.id)) || // And it has a label
+            !o.options.some((n) => x.value.some((a) => a.id === n.id)) || // And it has a label
             !o.label
           )
         }, {
-          label: x(() => [
-            t.$slots.group ? S(t.$slots, "group", {
+          label: g(() => [
+            t.$slots.group ? B(t.$slots, "group", {
               key: 0,
               group: o
-            }) : (a(), c(m, { key: 1 }, [
+            }) : (s(), v(m, { key: 1 }, [
               ee(F(o.label), 1)
             ], 64))
           ]),
-          default: x(() => [
-            (a(!0), c(m, null, q(b.value, (n) => (a(), c(m, {
+          default: g(() => [
+            (s(!0), v(m, null, q(x.value, (n) => (s(), v(m, {
               key: n.id
             }, [
-              o.options.some((s) => s.id === n.id) ? (a(), C(P, {
+              o.options.some((a) => a.id === n.id) ? (s(), S(P, {
                 key: 0,
-                id: p(n),
+                id: b(n),
                 active: l.value?.id === n.id,
-                selected: i.value.some((s) => s.id === n.id),
-                onClick: (s) => A(n),
+                selected: i.value.some((a) => a.id === n.id),
+                onClick: (a) => A(n),
                 onMousedown: e[4] || (e[4] = y(() => {
                 }, ["prevent"])),
-                onMouseenter: (s) => l.value = n
+                onMouseenter: (a) => l.value = n
               }, {
-                default: x(({ active: s, selected: J }) => [
-                  t.$slots.option ? S(t.$slots, "option", {
+                default: g(({ active: a, selected: J }) => [
+                  t.$slots.option ? B(t.$slots, "option", {
                     key: 0,
-                    active: s,
+                    active: a,
                     option: n,
                     selected: J
-                  }) : (a(), c(m, { key: 1 }, [
-                    I(h(ie), {
-                      multiselect: t.multiselect,
+                  }) : (s(), v(m, { key: 1 }, [
+                    h(V(ie), {
+                      multiselect: f.multiselect,
                       selected: i.value.some((Q) => Q.id === n.id)
                     }, null, 8, ["multiselect", "selected"]),
                     k("span", ue, F(n.label), 1)
@@ -155,23 +155,23 @@ const se = { class: "relative flex" }, ae = ["aria-activedescendant", "placehold
           ]),
           _: 2
         }, 1032, ["id", "hidden"]))), 128)),
-        g.add ? (a(), C(P, {
+        M.add ? (s(), S(P, {
           key: 0,
-          id: p(f),
-          active: l.value?.id === f.id,
+          id: b(p),
+          active: l.value?.id === p.id,
           onClick: T,
           onMousedown: e[5] || (e[5] = y(() => {
           }, ["prevent"])),
-          onMouseenter: e[6] || (e[6] = (o) => l.value = f)
+          onMouseenter: e[6] || (e[6] = (o) => l.value = p)
         }, {
-          default: x(({ active: o }) => [
-            I(h(oe), { class: "size-4 p-px" }),
-            S(t.$slots, "add", { active: o })
+          default: g(({ active: o }) => [
+            h(V(oe), { class: "size-4 p-px" }),
+            B(t.$slots, "add", { active: o })
           ]),
           _: 3
         }, 8, ["id", "active"])) : K("", !0)
       ], 8, de), [
-        [te, b.value.length || g.add]
+        [te, x.value.length || M.add]
       ])
     ], 64));
   }

package/dist/components/ScalarContextMenu/ScalarContextMenu.vue.js

@@ -1,5 +1,5 @@
-import { defineComponent as d, createBlock as r, openBlock as i, unref as e, withCtx as t, createVNode as n, normalizeClass as f, renderSlot as a } from "vue";
-import { ContextMenuRoot as u, ContextMenuTrigger as c, ContextMenuPortal as g, ContextMenuContent as C, ContextMenuItem as p } from "radix-vue";
+import { defineComponent as d, createBlock as r, openBlock as i, unref as e, withCtx as t, createVNode as n, normalizeClass as f, renderSlot as o } from "vue";
+import { ContextMenuRoot as u, ContextMenuTrigger as c, ContextMenuPortal as g, ContextMenuContent as C, ContextMenuItem as m } from "radix-vue";
 const M = /* @__PURE__ */ d({
   __name: "ScalarContextMenu",
   props: {
@@ -9,16 +9,16 @@ const M = /* @__PURE__ */ d({
     disabled: { type: Boolean, default: !1 },
     triggerClass: {}
   },
-  setup(o) {
-    const l = o;
-    return (s, m) => (i(), r(e(u), null, {
+  setup(s) {
+    const l = s;
+    return (a, p) => (i(), r(e(u), null, {
       default: t(() => [
         n(e(c), {
           class: f(s.triggerClass),
           disabled: l.disabled
         }, {
           default: t(() => [
-            a(s.$slots, "trigger")
+            o(a.$slots, "trigger")
           ]),
           _: 3
         }, 8, ["class", "disabled"]),
@@ -30,9 +30,9 @@ const M = /* @__PURE__ */ d({
               sideOffset: l.sideOffset
             }, {
               default: t(() => [
-                n(e(p), null, {
+                n(e(m), null, {
                   default: t(() => [
-                    a(s.$slots, "content")
+                    o(a.$slots, "content")
                   ]),
                   _: 3
                 })

package/dist/components/ScalarDropdown/ScalarDropdown.vue.js

@@ -1,4 +1,4 @@
-import { defineComponent as B, mergeModels as D, ref as b, useModel as g, useId as _, watch as $, computed as K, createBlock as L, openBlock as M, unref as m, mergeProps as I, createSlots as N, withCtx as A, renderSlot as R, createVNode as q, createElementVNode as O, withKeys as a, withModifiers as i, nextTick as C } from "vue";
+import { defineComponent as B, mergeModels as D, ref as b, useModel as g, useId as $, watch as I, computed as K, createBlock as L, openBlock as M, unref as m, mergeProps as R, createSlots as N, withCtx as A, renderSlot as C, createVNode as q, createElementVNode as O, withKeys as a, withModifiers as r, nextTick as E } from "vue";
 import { useBindCx as U } from "@scalar/use-hooks/useBindCx";
 import { onClickOutside as V } from "@vueuse/core";
 import j from "./ScalarDropdownMenu.vue.js";
@@ -20,24 +20,24 @@ const P = ["id", "aria-activedescendant", "aria-labelledby", "onKeydown"], G = {
     openModifiers: {}
   }),
   emits: ["update:open"],
-  setup(E) {
-    const l = b(), r = b(), n = g(E, "open"), { active: o } = z(), v = _(), f = b(v), y = _();
-    async function k() {
-      n.value = !n.value, await C(), n.value && r.value?.focus();
+  setup(k) {
+    const l = b(), i = b(), n = g(k, "open"), { active: o } = z(), v = $(), f = b(v), y = $();
+    async function x() {
+      n.value = !n.value, await E(), n.value && i.value?.focus();
     }
     async function h(e) {
       if (["ArrowDown", "ArrowUp", " ", "Enter"].includes(e.key))
         e.preventDefault();
       else return;
-      n.value || (n.value = !0), await C(), r.value?.focus(), ["ArrowDown", " ", "Enter"].includes(e.key) ? d(1) : e.key === "ArrowUp" && d(-1);
+      n.value || (n.value = !0), await E(), i.value?.focus(), ["ArrowDown", " ", "Enter"].includes(e.key) ? c(1) : e.key === "ArrowUp" && c(-1);
     }
-    $(
+    I(
       () => l.value?.targetRef,
       (e, t) => {
-        e && (e.id ? f.value = e.id : (f.value = v, e.setAttribute("id", f.value)), e.setAttribute("aria-haspopup", "menu"), e.setAttribute("aria-expanded", `${n.value}`), n.value && e.setAttribute("aria-controls", y), e.addEventListener("click", k), e.addEventListener("keydown", h)), t && t !== e && (t.id === v && t.removeAttribute("id"), t.removeAttribute("aria-controls"), t.removeAttribute("aria-haspopup"), t.removeAttribute("aria-expanded"), t.removeEventListener("click", k), t.removeEventListener("keydown", h));
+        e && (e.id ? f.value = e.id : (f.value = v, e.setAttribute("id", f.value)), e.setAttribute("aria-haspopup", "menu"), e.setAttribute("aria-expanded", `${n.value}`), n.value && e.setAttribute("aria-controls", y), e.addEventListener("click", x), e.addEventListener("keydown", h)), t && t !== e && (t.id === v && t.removeAttribute("id"), t.removeAttribute("aria-controls"), t.removeAttribute("aria-haspopup"), t.removeAttribute("aria-expanded"), t.removeEventListener("click", x), t.removeEventListener("keydown", h));
       },
       { immediate: !0 }
-    ), $(
+    ), I(
       n,
       (e) => {
         const t = l.value?.targetRef;
@@ -48,75 +48,75 @@ const P = ["id", "aria-activedescendant", "aria-labelledby", "onKeydown"], G = {
     async function u() {
       l.value?.targetRef?.focus(), n.value = !1;
     }
-    function x() {
-      if (!o.value || !r.value) return;
-      const e = r.value.querySelector(
+    function w() {
+      if (!o.value || !i.value) return;
+      const e = i.value.querySelector(
         `#${o.value}[role="menuitem"]:not([aria-disabled="true"])`
       );
       e && (e.click(), u());
     }
-    function d(e) {
-      if (!n.value || !r.value) return;
+    function c(e) {
+      if (!n.value || !i.value) return;
       const t = Array.from(
-        r.value.querySelectorAll(
+        i.value.querySelectorAll(
           '[role="menuitem"]:not([aria-disabled="true"])'
         )
       );
       if (t.length === 0) return;
-      const c = t.findIndex((p) => p.id === o.value);
-      if (c === -1) {
+      const d = t.findIndex((p) => p.id === o.value);
+      if (d === -1) {
         const p = t[e > 0 ? 0 : t.length - 1];
         p?.id && (o.value = p.id);
         return;
       }
-      const s = c + e;
+      const s = d + e;
       if (s < 0 || s > t.length - 1)
         return;
-      const w = t[s];
-      w?.id && (o.value = w.id);
+      const _ = t[s];
+      _?.id && (o.value = _.id);
     }
-    V(r, u, {
+    V(i, u, {
       ignore: [K(() => l.value?.targetRef)]
     });
     const { cx: S } = U();
-    return (e, t) => (M(), L(m(F), I({
+    return (e, t) => (M(), L(m(F), R({
       ref_key: "floatingRef",
       ref: l
     }, e.$props, {
-      placement: e.placement ?? "bottom-start"
+      placement: k.placement ?? "bottom-start"
     }), N({
       default: A(() => [
-        R(e.$slots, "default", { open: n.value })
+        C(e.$slots, "default", { open: n.value })
       ]),
       _: 2
     }, [
       n.value ? {
         name: "floating",
-        fn: A(({ width: c }) => [
-          q(j, I({
-            style: { width: c }
+        fn: A(({ width: d }) => [
+          q(j, R({
+            style: { width: d }
           }, m(S)("max-h-[inherit] max-w-[inherit]")), {
             menu: A(() => [
               O("div", {
                 id: m(y),
                 ref_key: "menuRef",
-                ref: r,
+                ref: i,
                 "aria-activedescendant": m(o),
                 "aria-labelledby": f.value,
                 class: "flex flex-col p-0.75 outline-none",
                 role: "menu",
                 tabindex: "-1",
-                onClick: i(u, ["stop"]),
+                onClick: r(u, ["stop"]),
                 onKeydown: [
-                  t[0] || (t[0] = a(i((s) => d(1), ["prevent", "stop"]), ["down"])),
-                  a(i(x, ["prevent", "stop"]), ["enter"]),
-                  a(i(u, ["prevent", "stop"]), ["escape"]),
-                  a(i(x, ["prevent", "stop"]), ["space"]),
-                  a(i(u, ["prevent", "stop"]), ["tab"]),
-                  t[1] || (t[1] = a(i((s) => d(-1), ["prevent", "stop"]), ["up"]))
+                  t[0] || (t[0] = a(r((s) => c(1), ["prevent", "stop"]), ["down"])),
+                  a(r(w, ["prevent", "stop"]), ["enter"]),
+                  a(r(u, ["prevent", "stop"]), ["escape"]),
+                  a(r(w, ["prevent", "stop"]), ["space"]),
+                  a(r(u, ["prevent", "stop"]), ["tab"]),
+                  t[1] || (t[1] = a(r((s) => c(-1), ["prevent", "stop"]), ["up"]))
                 ]
               }, [
-                R(e.$slots, "items", { open: n.value })
+                C(e.$slots, "items", { open: n.value })
               ], 40, P)
             ]),
             _: 3

package/dist/components/ScalarDropdown/ScalarDropdownButton.vue2.js

@@ -1,15 +1,15 @@
-import { defineComponent as o, createBlock as n, openBlock as s, resolveDynamicComponent as r, normalizeClass as i, unref as t, withCtx as d, renderSlot as l } from "vue";
-import { cva as c, cx as p } from "@scalar/use-hooks/useBindCx";
-const u = {}, _ = /* @__PURE__ */ o({
-  ...u,
+import { defineComponent as o, createBlock as i, openBlock as s, resolveDynamicComponent as r, normalizeClass as d, unref as t, withCtx as l, renderSlot as c } from "vue";
+import { cva as u, cx as b } from "@scalar/use-hooks/useBindCx";
+const m = {}, x = /* @__PURE__ */ o({
+  ...m,
   __name: "ScalarDropdownButton",
   props: {
     is: { default: "button" },
     active: { type: Boolean },
     disabled: { type: Boolean }
   },
-  setup(b) {
-    const a = c({
+  setup(e) {
+    const a = u({
       base: [
         // Layout
         "block h-8 min-w-0 gap-1.5 rounded px-2.5 py-1.5 text-left",
@@ -24,18 +24,18 @@ const u = {}, _ = /* @__PURE__ */ o({
       },
       compoundVariants: [{ disabled: !1, active: !0, class: "bg-b-2" }]
     });
-    return (e, m) => (s(), n(r(e.is), {
+    return (n, p) => (s(), i(r(e.is), {
       "aria-disabled": e.disabled,
-      class: i(["item", t(p)("scalar-dropdown-item", t(a)({ active: e.active, disabled: e.disabled }))]),
+      class: d(["item", t(b)("scalar-dropdown-item", t(a)({ active: e.active, disabled: e.disabled }))]),
       type: e.is === "button" ? "button" : void 0
     }, {
-      default: d(() => [
-        l(e.$slots, "default", {}, void 0, !0)
+      default: l(() => [
+        c(n.$slots, "default", {}, void 0, !0)
       ]),
       _: 3
     }, 8, ["aria-disabled", "class", "type"]));
   }
 });
 export {
-  _ as default
+  x as default
 };

package/dist/components/ScalarDropdown/ScalarDropdownItem.vue2.js

@@ -1,27 +1,27 @@
-import { defineComponent as i, useId as r, createBlock as n, openBlock as l, unref as a, withCtx as s, renderSlot as u } from "vue";
-import m from "./ScalarDropdownButton.vue.js";
-import { useDropdownItem as p } from "./useDropdown.js";
-const f = {}, w = /* @__PURE__ */ i({
-  ...f,
+import { defineComponent as n, useId as l, createBlock as r, openBlock as a, unref as u, withCtx as m, renderSlot as s } from "vue";
+import f from "./ScalarDropdownButton.vue.js";
+import { useDropdownItem as c } from "./useDropdown.js";
+const p = {}, w = /* @__PURE__ */ n({
+  ...p,
   __name: "ScalarDropdownItem",
   props: {
-    id: { default: () => r() },
+    id: { default: () => l() },
     disabled: { type: Boolean }
   },
   emits: ["click"],
-  setup(c) {
-    const { active: t } = p();
-    return (e, o) => (l(), n(m, {
+  setup(e) {
+    const { active: o } = c();
+    return (d, t) => (a(), r(f, {
       id: e.id,
-      active: a(t) === e.id,
+      active: u(o) === e.id,
       disabled: e.disabled,
       role: "menuitem",
       tabindex: "-1",
-      onClick: o[0] || (o[0] = (d) => e.$emit("click", d)),
-      onMouseenter: o[1] || (o[1] = (d) => t.value = e.id)
+      onClick: t[0] || (t[0] = (i) => d.$emit("click", i)),
+      onMouseenter: t[1] || (t[1] = (i) => o.value = e.id)
     }, {
-      default: s(() => [
-        u(e.$slots, "default", {}, void 0, !0)
+      default: m(() => [
+        s(d.$slots, "default", {}, void 0, !0)
       ]),
       _: 3
     }, 8, ["id", "active", "disabled"]));

package/dist/components/ScalarDropdown/ScalarDropdownMenu.vue.js

@@ -1,25 +1,25 @@
-import { defineComponent as n, createBlock as l, openBlock as a, resolveDynamicComponent as i, normalizeProps as c, guardReactiveProps as d, unref as s, withCtx as m, createElementVNode as t, renderSlot as o, createVNode as p } from "vue";
-import { useBindCx as f } from "@scalar/use-hooks/useBindCx";
-import _ from "../ScalarFloating/ScalarFloatingBackdrop.vue.js";
-const u = { class: "custom-scroll min-h-0 flex-1" }, h = { class: "flex flex-col p-0.75" }, v = {}, B = /* @__PURE__ */ n({
-  ...v,
+import { defineComponent as l, createBlock as a, openBlock as c, resolveDynamicComponent as i, normalizeProps as d, guardReactiveProps as m, unref as t, withCtx as f, createElementVNode as s, renderSlot as o, createVNode as p } from "vue";
+import { useBindCx as _ } from "@scalar/use-hooks/useBindCx";
+import u from "../ScalarFloating/ScalarFloatingBackdrop.vue.js";
+const h = { class: "custom-scroll min-h-0 flex-1" }, v = { class: "flex flex-col p-0.75" }, x = {}, B = /* @__PURE__ */ l({
+  ...x,
   inheritAttrs: !1,
   __name: "ScalarDropdownMenu",
   props: {
     is: {}
   },
-  setup(x) {
-    const { cx: r } = f();
-    return (e, C) => (a(), l(i(e.is ?? "div"), c(d(s(r)("relative flex w-56"))), {
-      default: m(() => [
-        t("div", u, [
+  setup(r) {
+    const { cx: n } = _();
+    return (e, C) => (c(), a(i(r.is ?? "div"), d(m(t(n)("relative flex w-56"))), {
+      default: f(() => [
+        s("div", h, [
           o(e.$slots, "menu", {}, () => [
-            t("div", h, [
+            s("div", v, [
               o(e.$slots, "default")
             ])
           ]),
           o(e.$slots, "backdrop", {}, () => [
-            p(s(_))
+            p(t(u))
           ])
         ])
       ]),