@scalar/components 0.13.24 → 0.13.26

package/dist/components/ScalarMenu/ScalarMenuTeamPicker.vue.js

@@ -1,10 +1,10 @@
-import { defineComponent as g, computed as b, openBlock as n, createBlock as u, unref as e, withCtx as r, createVNode as a, mergeProps as v, createElementVNode as k, createElementBlock as x, Fragment as C, renderList as S, createTextVNode as w } from "vue";
+import { defineComponent as g, computed as b, openBlock as n, createBlock as u, unref as e, withCtx as r, createVNode as a, mergeProps as v, createElementVNode as x, createElementBlock as k, Fragment as C, renderList as S, createTextVNode as w } from "vue";
 import { DropdownMenu as s } from "radix-vue/namespaced";
 import V from "./ScalarMenuTeamProfile.vue.js";
 import $ from "./ScalarMenuLink.vue.js";
 import B from "../ScalarDropdown/ScalarDropdownMenu.vue.js";
 import c from "../ScalarDropdown/ScalarDropdownButton.vue.js";
-import I from "../ScalarListbox/ScalarListboxCheckbox.vue.js";
+import z from "../ScalarListbox/ScalarListboxCheckbox.vue.js";
 import p from "../ScalarIcon/ScalarIcon.vue.js";
 const M = /* @__PURE__ */ g({
   inheritAttrs: !1,
@@ -32,7 +32,7 @@ const M = /* @__PURE__ */ g({
           icon: "UserSwitch"
         }, o.$attrs), {
           default: r(() => [
-            t[2] || (t[2] = k("div", null, "Change team", -1)),
+            t[2] || (t[2] = x("div", null, "Change team", -1)),
             a(e(p), {
               class: "ml-auto text-c-2 -mr-0.25",
               icon: "ChevronRight",
@@ -45,7 +45,7 @@ const M = /* @__PURE__ */ g({
           default: r(() => [
             a(e(s).SubContent, {
               as: e(B),
-              class: "max-h-radix-popper",
+              class: "max-h-radix-popper z-context-plus",
               sideOffset: 3
             }, {
               default: r(() => [
@@ -55,7 +55,7 @@ const M = /* @__PURE__ */ g({
                   class: "contents"
                 }, {
                   default: r(() => [
-                    (n(!0), x(C, null, S(o.teams, (l) => (n(), u(e(s).RadioItem, {
+                    (n(!0), k(C, null, S(o.teams, (l) => (n(), u(e(s).RadioItem, {
                       key: l.id,
                       as: e(c),
                       class: "group/item",
@@ -67,7 +67,7 @@ const M = /* @__PURE__ */ g({
                           label: l.label,
                           src: l.src
                         }, null, 8, ["label", "src"]),
-                        a(e(I), {
+                        a(e(z), {
                           class: "ml-auto",
                           selected: l.id === m.value
                         }, null, 8, ["selected"])

package/dist/components/ScalarModal/ScalarModal.stories.d.ts

@@ -11,10 +11,8 @@ declare const meta: {
             bodyClass?: string;
             maxWidth?: string;
             size?: "sm" | "lg" | "xs" | "md" | "xl" | "full" | "xxs" | undefined;
-            variant?: "form" | "search" | "error" | "history" | undefined;
-        }> & Readonly<{}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, import("vue").PublicProps, {
-            size: "sm" | "lg" | "xs" | "md" | "xl" | "full" | "xxs";
-        }, false, {}, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, {}, any, import("vue").ComponentProvideOptions, {
+            variant?: "form" | "search" | "error" | undefined;
+        }> & Readonly<{}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, import("vue").PublicProps, {}, false, {}, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, {}, any, import("vue").ComponentProvideOptions, {
             P: {};
             B: {};
             D: {};
@@ -27,10 +25,8 @@ declare const meta: {
             bodyClass?: string;
             maxWidth?: string;
             size?: "sm" | "lg" | "xs" | "md" | "xl" | "full" | "xxs" | undefined;
-            variant?: "form" | "search" | "error" | "history" | undefined;
-        }> & Readonly<{}>, {}, {}, {}, {}, {
-            size: "sm" | "lg" | "xs" | "md" | "xl" | "full" | "xxs";
-        }>;
+            variant?: "form" | "search" | "error" | undefined;
+        }> & Readonly<{}>, {}, {}, {}, {}, {}>;
         __isFragment?: never;
         __isTeleport?: never;
         __isSuspense?: never;
@@ -40,16 +36,17 @@ declare const meta: {
         bodyClass?: string;
         maxWidth?: string;
         size?: "sm" | "lg" | "xs" | "md" | "xl" | "full" | "xxs" | undefined;
-        variant?: "form" | "search" | "error" | "history" | undefined;
-    }> & Readonly<{}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, {
-        size: "sm" | "lg" | "xs" | "md" | "xl" | "full" | "xxs";
-    }, {}, string, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, import("vue").ComponentProvideOptions> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & (new () => {
+        variant?: "form" | "search" | "error" | undefined;
+    }> & Readonly<{}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, {}, {}, string, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, import("vue").ComponentProvideOptions> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & (new () => {
         $slots: {
             default?(_: {}): any;
             default?(_: {}): any;
         };
     });
     tags: string[];
+    parameters: {
+        layout: string;
+    };
     argTypes: {
         size: {
             control: "select";
@@ -64,5 +61,6 @@ declare const meta: {
 export default meta;
 type Story = StoryObj<typeof meta>;
 export declare const Base: Story;
+export declare const Search: Story;
 export declare const Scrolling: Story;
 //# sourceMappingURL=ScalarModal.stories.d.ts.map

package/dist/components/ScalarModal/ScalarModal.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ScalarModal.stories.d.ts","sourceRoot":"","sources":["../../../src/components/ScalarModal/ScalarModal.stories.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,iBAAiB,CAAA;AAGrD,OAAoB,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAEzD;;GAEG;AACH,QAAA,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAU0B,CAAA;AAEpC,eAAe,IAAI,CAAA;AACnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAA;AAElC,eAAO,MAAM,IAAI,EAAE,KAwBlB,CAAA;AAED,eAAO,MAAM,SAAS,EAAE,KA4CvB,CAAA"}
+{"version":3,"file":"ScalarModal.stories.d.ts","sourceRoot":"","sources":["../../../src/components/ScalarModal/ScalarModal.stories.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,iBAAiB,CAAA;AAGrD,OAAoB,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAIzD;;GAEG;AACH,QAAA,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAW0B,CAAA;AAEpC,eAAe,IAAI,CAAA;AACnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAA;AAElC,eAAO,MAAM,IAAI,EAAE,KA8BlB,CAAA;AAED,eAAO,MAAM,MAAM,EAAE,KA6CpB,CAAA;AAED,eAAO,MAAM,SAAS,EAAE,KAoDvB,CAAA"}

package/dist/components/ScalarModal/ScalarModal.vue.d.ts

@@ -10,17 +10,15 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     bodyClass?: string;
     maxWidth?: string;
     size?: "sm" | "lg" | "xs" | "md" | "xl" | "full" | "xxs" | undefined;
-    variant?: "form" | "search" | "error" | "history" | undefined;
+    variant?: "form" | "search" | "error" | undefined;
 }, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{
     state: ReturnType<typeof useModal>;
     title?: string;
     bodyClass?: string;
     maxWidth?: string;
     size?: "sm" | "lg" | "xs" | "md" | "xl" | "full" | "xxs" | undefined;
-    variant?: "form" | "search" | "error" | "history" | undefined;
-}> & Readonly<{}>, {
-    size: "sm" | "lg" | "xs" | "md" | "xl" | "full" | "xxs";
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
+    variant?: "form" | "search" | "error" | undefined;
+}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
     default?(_: {}): any;
     default?(_: {}): any;
 }>;

package/dist/components/ScalarModal/ScalarModal.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ScalarModal.vue.d.ts","sourceRoot":"","sources":["../../../src/components/ScalarModal/ScalarModal.vue"],"names":[],"mappings":"AA6OA,+CAA+C;AAC/C,wBAAgB,QAAQ;;;;EAUvB;;WAOU,UAAU,CAAC,OAAO,QAAQ,CAAC;YAC1B,MAAM;gBACF,MAAM;eACP,MAAM;;;;WAHV,UAAU,CAAC,OAAO,QAAQ,CAAC;YAC1B,MAAM;gBACF,MAAM;eACP,MAAM;;;;;;qBA6NS,GAAG;qBACH,GAAG;;AAtOjC,wBA+QK;AAgBL,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
+{"version":3,"file":"ScalarModal.vue.d.ts","sourceRoot":"","sources":["../../../src/components/ScalarModal/ScalarModal.vue"],"names":[],"mappings":"AA6NA,+CAA+C;AAC/C,wBAAgB,QAAQ;;;;EAUvB;;WAOQ,UAAU,CAAC,OAAO,QAAQ,CAAC;YAC1B,MAAM;gBACF,MAAM;eACP,MAAM;;;;WAHV,UAAU,CAAC,OAAO,QAAQ,CAAC;YAC1B,MAAM;gBACF,MAAM;eACP,MAAM;;;;qBA2MW,GAAG;qBACH,GAAG;;AApNjC,wBA2PK;AAWL,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}

package/dist/components/ScalarModal/ScalarModal.vue.js

@@ -1,9 +1,9 @@
 import o from "./ScalarModal.vue2.js";
-import { useModal as s } from "./ScalarModal.vue2.js";
+import { useModal as e } from "./ScalarModal.vue2.js";
 /* empty css                 */
 import r from "../../_virtual/_plugin-vue_export-helper.js";
-const f = /* @__PURE__ */ r(o, [["__scopeId", "data-v-0f8e0211"]]);
+const p = /* @__PURE__ */ r(o, [["__scopeId", "data-v-12dc7570"]]);
 export {
-  f as default,
-  s as useModal
+  p as default,
+  e as useModal
 };

package/dist/components/ScalarModal/ScalarModal.vue2.js

@@ -1,13 +1,13 @@
-import { defineComponent as v, openBlock as l, createBlock as r, unref as a, withCtx as t, createElementVNode as x, normalizeClass as o, createVNode as i, normalizeStyle as b, createTextVNode as y, toDisplayString as g, createCommentVNode as d, createElementBlock as m, renderSlot as n, reactive as w } from "vue";
+import { defineComponent as p, openBlock as l, createBlock as r, unref as a, withCtx as o, createElementVNode as x, normalizeClass as t, createVNode as i, normalizeStyle as w, createTextVNode as b, toDisplayString as y, createCommentVNode as m, createElementBlock as n, renderSlot as d, reactive as g } from "vue";
 import { Dialog as z, DialogPanel as k, DialogTitle as C, DialogDescription as D } from "@headlessui/vue";
-import { cva as c, cx as u } from "../../cva.js";
+import { cva as f, cx as c } from "../../cva.js";
 import S from "../ScalarIconButton/ScalarIconButton.vue.js";
 const $ = {
   key: 0,
   class: "close-button z-10 fixed right-2 top-2"
 };
 function E() {
-  return w({
+  return g({
     open: !1,
     show() {
       this.open = !0;
@@ -17,7 +17,7 @@ function E() {
     }
   });
 }
-const M = /* @__PURE__ */ v({
+const M = /* @__PURE__ */ p({
   __name: "ScalarModal",
   props: {
     state: {},
@@ -28,48 +28,43 @@ const M = /* @__PURE__ */ v({
     variant: {}
   },
   setup(N) {
-    const f = c({
+    const u = f({
       base: [
         "scalar-modal",
-        "col relative mx-auto mb-0 rounded-lg bg-b-1 p-0 text-left leading-snug text-c-1 opacity-0 md:w-[calc(100vw-16px)] lg:w-[calc(100vw-32px)]"
+        "flex flex-col relative mx-auto mb-0 rounded-lg bg-b-1 p-0 text-left leading-snug text-c-1 opacity-0 w-[calc(100vw-12px)] md:w-[calc(100vw-16px)] lg:w-[calc(100vw-32px)]"
       ].join(" "),
       variants: {
         size: {
-          xxs: "mt-20 max-w-screen-xxs",
-          xs: "mt-20 max-w-screen-xs",
-          sm: "mt-20 max-w-screen-sm",
-          md: "mt-20 max-w-screen-md",
-          lg: "m-auto max-w-screen-lg",
-          xl: "m-auto max-w-screen-xl",
-          full: "full-size-styles mt-0 lg:w-full"
+          xxs: "mt-[20svh] max-h-[60svh] max-w-screen-xxs",
+          xs: "mt-[20svh] max-h-[60svh] max-w-screen-xs",
+          sm: "mt-[20svh] max-h-[60svh] max-w-screen-sm",
+          md: "mt-[20svh] max-h-[60svh] max-w-screen-md",
+          lg: "m-auto max-h-[80svh] max-w-screen-lg",
+          xl: "m-auto max-h-[90svh] max-w-screen-xl",
+          full: "full-size-styles max-h-dvh mt-0 lg:w-full"
         },
         variant: {
           form: "scalar-modal-form",
-          history: "scalar-modal-history bg-b-1",
-          search: "scalar-modal-search",
+          search: "scalar-modal-search mt-[15svh] max-h-[60svh] max-w-[540px]",
           error: "scalar-modal-error"
         }
       }
-    }), p = c({
-      base: [
-        "scalar-modal-body",
-        "relative max-h-[calc(100dvh-240px)] rounded-lg rounded-t-none border-t-1/2 bg-b-1 p-3"
-      ].join(" "),
+    }), v = f({
+      base: ["scalar-modal-body", "relative flex-1 min-h-0 p-3"].join(" "),
       variants: {
         variant: {
           form: "overflow-visible",
-          history: "pt-3",
-          search: "col !m-0 max-h-[440px] overflow-hidden p-0",
+          search: "col !m-0 overflow-hidden p-0",
           error: "overflow-y-scroll"
         },
         size: {
-          xxs: "max-h-[calc(100dvh-240px)]",
-          xs: "max-h-[calc(100dvh-240px)]",
-          sm: "max-h-[calc(100dvh-240px)]",
-          md: "max-h-[calc(100dvh-240px)]",
-          lg: "max-h-[calc(100dvh-180px)]",
-          xl: "m-0 max-h-[calc(100dvh-120px)] p-0",
-          full: "max-h-dvh rounded-none"
+          xxs: "",
+          xs: "",
+          sm: "",
+          md: "",
+          lg: "",
+          xl: "m-0 p-0",
+          full: " rounded-none"
         }
       }
     });
@@ -77,10 +72,10 @@ const M = /* @__PURE__ */ v({
       open: e.state.open,
       onClose: s[1] || (s[1] = (h) => e.state.hide())
     }, {
-      default: t(() => [
+      default: o(() => [
         x("div", {
-          class: o(
-            a(u)(
+          class: t(
+            a(c)(
               e.size === "full" ? "scalar-modal-layout-full" : "scalar-modal-layout",
               "fixed left-0 top-0 flex items-start justify-center",
               "z-[1001] h-[100dvh] w-[100dvw]",
@@ -90,44 +85,44 @@ const M = /* @__PURE__ */ v({
           )
         }, [
           i(a(k), {
-            class: o(a(f)({ size: e.size, variant: e.variant })),
-            style: b({ maxWidth: e.maxWidth })
+            class: t(a(u)({ size: e.size, variant: e.variant })),
+            style: w({ maxWidth: e.maxWidth })
           }, {
-            default: t(() => [
+            default: o(() => [
               e.title ? (l(), r(a(C), {
                 key: 0,
-                class: o(["scalar-modal-header m-0 -mb-1 rounded-lg p-3 text-left text-sm font-medium text-c-1", { "pb-0 pt-6": e.variant === "history" }])
+                class: "scalar-modal-header m-0 -mb-1 rounded-lg pt-3 px-3 text-left text-sm font-medium text-c-1"
               }, {
-                default: t(() => [
-                  y(g(e.title), 1)
+                default: o(() => [
+                  b(y(e.title), 1)
                 ]),
                 _: 1
-              }, 8, ["class"])) : d("", !0),
-              e.size === "full" ? (l(), m("div", {
+              })) : m("", !0),
+              e.size === "full" ? (l(), n("div", {
                 key: 1,
-                class: o(e.bodyClass)
+                class: t(e.bodyClass)
               }, [
-                n(e.$slots, "default", {}, void 0, !0)
+                d(e.$slots, "default", {}, void 0, !0)
               ], 2)) : (l(), r(a(D), {
                 key: 2,
-                class: o(a(u)(a(p)({ size: e.size, variant: e.variant }), e.bodyClass))
+                class: t(a(c)(a(v)({ size: e.size, variant: e.variant }), e.bodyClass))
               }, {
-                default: t(() => [
-                  n(e.$slots, "default", {}, void 0, !0)
+                default: o(() => [
+                  d(e.$slots, "default", {}, void 0, !0)
                 ]),
                 _: 3
               }, 8, ["class"]))
             ]),
             _: 3
           }, 8, ["class", "style"]),
-          e.size === "full" ? (l(), m("div", $, [
+          e.size === "full" ? (l(), n("div", $, [
             i(a(S), {
               class: "hover:bg-b-3 focus:outline-none",
               icon: "Close",
               label: "Clear Search",
               onClose: s[0] || (s[0] = (h) => e.state.hide())
             })
-          ])) : d("", !0)
+          ])) : m("", !0)
         ], 2)
       ]),
       _: 3

package/dist/components/ScalarSearchInput/ScalarSearchInput.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ScalarSearchInput.vue.d.ts","sourceRoot":"","sources":["../../../src/components/ScalarSearchInput/ScalarSearchInput.vue"],"names":[],"mappings":"AA0GA,OAAO,EAAE,KAAK,YAAY,EAAiB,MAAM,kBAAkB,CAAA;AAInE,KAAK,WAAW,GAAG;IACjB,OAAO,CAAC,EAAE,YAAY,CAAA;IACtB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,KAAK,CAAC,EAAE,MAAM,CAAA;CACf,CAAC;;;;;;;;;AA0KF,wBAQG"}
+{"version":3,"file":"ScalarSearchInput.vue.d.ts","sourceRoot":"","sources":["../../../src/components/ScalarSearchInput/ScalarSearchInput.vue"],"names":[],"mappings":"AAgHA,OAAO,EAAE,KAAK,YAAY,EAAiB,MAAM,kBAAkB,CAAA;AAInE,KAAK,WAAW,GAAG;IACjB,OAAO,CAAC,EAAE,YAAY,CAAA;IACtB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,KAAK,CAAC,EAAE,MAAM,CAAA;CACf,CAAC;;;;;;;;;AA4KF,wBAQG"}

package/dist/components/ScalarSearchInput/ScalarSearchInput.vue.js

@@ -1,7 +1,7 @@
 import o from "./ScalarSearchInput.vue2.js";
 /* empty css                       */
 import r from "../../_virtual/_plugin-vue_export-helper.js";
-const p = /* @__PURE__ */ r(o, [["__scopeId", "data-v-2f2316c6"]]);
+const c = /* @__PURE__ */ r(o, [["__scopeId", "data-v-080483f0"]]);
 export {
-  p as default
+  c as default
 };

package/dist/components/ScalarSearchInput/ScalarSearchInput.vue2.js

@@ -1,9 +1,9 @@
-import { defineComponent as b, ref as h, computed as g, useAttrs as k, openBlock as s, createElementBlock as v, normalizeClass as i, unref as a, createBlock as o, createCommentVNode as u, createElementVNode as S, mergeProps as V } from "vue";
-import { cva as y, cx as c } from "../../cva.js";
-import C from "../ScalarIcon/ScalarIcon.vue.js";
-import z from "../ScalarLoading/ScalarLoading.vue.js";
-import B from "../ScalarIconButton/ScalarIconButton.vue.js";
-const I = ["aria-label", "value"], q = /* @__PURE__ */ b({
+import { defineComponent as h, ref as v, computed as g, useAttrs as k, openBlock as s, createElementBlock as S, normalizeClass as i, unref as a, createBlock as o, createCommentVNode as c, createElementVNode as V, mergeProps as y, withModifiers as C } from "vue";
+import { cva as z, cx as u } from "../../cva.js";
+import B from "../ScalarIcon/ScalarIcon.vue.js";
+import I from "../ScalarLoading/ScalarLoading.vue.js";
+import w from "../ScalarIconButton/ScalarIconButton.vue.js";
+const E = ["aria-label", "value"], M = /* @__PURE__ */ h({
   inheritAttrs: !1,
   __name: "ScalarSearchInput",
   props: {
@@ -13,15 +13,18 @@ const I = ["aria-label", "value"], q = /* @__PURE__ */ b({
     label: {}
   },
   emits: ["update:modelValue"],
-  setup(E, { expose: d, emit: m }) {
-    const t = m, r = h(null);
-    function p(e) {
-      t("update:modelValue", e.target.value);
+  setup(N, { expose: d, emit: p }) {
+    const r = p, l = v(null);
+    function m(e) {
+      r("update:modelValue", e.target.value);
     }
-    const n = g(() => {
-      const { class: e, ...l } = k();
-      return { class: e || "", rest: l };
-    }), f = y({
+    function f() {
+      r("update:modelValue", ""), l.value && l.value.focus();
+    }
+    const t = g(() => {
+      const { class: e, ...n } = k();
+      return { class: e || "", rest: n };
+    }), b = z({
       base: "search-background flex items-center rounded border text-sm font-medium has-[:focus-visible]:bg-b-1 has-[:focus-visible]:outline",
       variants: {
         sidebar: {
@@ -33,26 +36,26 @@ const I = ["aria-label", "value"], q = /* @__PURE__ */ b({
     return d({
       focus: () => {
         var e;
-        (e = r.value) == null || e.focus();
+        (e = l.value) == null || e.focus();
       },
       blur: () => {
         var e;
-        (e = r.value) == null || e.blur();
+        (e = l.value) == null || e.blur();
       }
-    }), (e, l) => (s(), v("label", {
-      class: i(a(c)(a(f)({ sidebar: e.sidebar }), n.value.class))
+    }), (e, n) => (s(), S("label", {
+      class: i(a(u)(a(b)({ sidebar: e.sidebar }), t.value.class))
     }, [
-      e.sidebar ? (s(), o(a(C), {
+      e.sidebar ? (s(), o(a(B), {
         key: 0,
         class: "text-c-2",
         icon: "Search",
         size: "xs",
         thickness: "2.5"
-      })) : u("", !0),
-      S("input", V({
+      })) : c("", !0),
+      V("input", y({
         ref_key: "inputRef",
-        ref: r
-      }, n.value.rest, {
+        ref: l
+      }, t.value.rest, {
         "aria-label": e.label ?? "Enter search query",
         autocapitalize: "off",
         autocomplete: "off",
@@ -62,24 +65,24 @@ const I = ["aria-label", "value"], q = /* @__PURE__ */ b({
         spellcheck: "false",
         type: "search",
         value: e.modelValue,
-        onInput: p
-      }), null, 16, I),
-      e.loading && e.loading.isLoading ? (s(), o(a(z), {
+        onInput: m
+      }), null, 16, E),
+      e.loading && e.loading.isLoading ? (s(), o(a(I), {
         key: 1,
         class: "mr-3 self-center",
         loadingState: e.loading,
         size: "md"
-      }, null, 8, ["loadingState"])) : e.modelValue ? (s(), o(a(B), {
+      }, null, 8, ["loadingState"])) : e.modelValue ? (s(), o(a(w), {
         key: 2,
-        class: i(a(c)("p-0", e.sidebar ? "h-4 w-4" : "h-5 w-5")),
+        class: i(a(u)("p-0", e.sidebar ? "h-4 w-4" : "h-5 w-5")),
         icon: "Close",
         label: "Clear Search",
         thickness: e.sidebar ? "1.75" : "1.5",
-        onClick: l[0] || (l[0] = (N) => t("update:modelValue", ""))
-      }, null, 8, ["class", "thickness"])) : u("", !0)
+        onClick: C(f, ["stop", "prevent"])
+      }, null, 8, ["class", "thickness"])) : c("", !0)
     ], 2));
   }
 });
 export {
-  q as default
+  M as default
 };

package/dist/components/ScalarSearchResults/ScalarSearchResultItem.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ScalarSearchResultItem.vue.d.ts","sourceRoot":"","sources":["../../../src/components/ScalarSearchResults/ScalarSearchResultItem.vue"],"names":[],"mappings":"AA6DA,OAAO,EAAE,KAAK,IAAI,EAAc,MAAM,eAAe,CAAA;AAIrD,KAAK,WAAW,GAAG;IACjB,IAAI,CAAC,EAAE,IAAI,CAAA;IACX,MAAM,CAAC,EAAE,OAAO,CAAA;CACjB,CAAC;AAWF,iBAAS,cAAc;WAiGT,OAAO,IAA6B;;sBAXxB,GAAG;yBACA,GAAG;uBACL,GAAG;6BACG,GAAG;;;;EAanC;AAUD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe,kSAMnB,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAWpG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
+{"version":3,"file":"ScalarSearchResultItem.vue.d.ts","sourceRoot":"","sources":["../../../src/components/ScalarSearchResults/ScalarSearchResultItem.vue"],"names":[],"mappings":"AA2DA,OAAO,EAAE,KAAK,IAAI,EAAc,MAAM,eAAe,CAAA;AAIrD,KAAK,WAAW,GAAG;IACjB,IAAI,CAAC,EAAE,IAAI,CAAA;IACX,MAAM,CAAC,EAAE,OAAO,CAAA;CACjB,CAAC;AAWF,iBAAS,cAAc;WAiGT,OAAO,IAA6B;;sBAXxB,GAAG;yBACA,GAAG;uBACL,GAAG;6BACG,GAAG;;;;EAanC;AAUD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe,kSAMnB,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAWpG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}

package/dist/components/ScalarSearchResults/ScalarSearchResultItem.vue.js

@@ -1,10 +1,7 @@
-import { defineComponent as a, openBlock as t, createElementBlock as s, createElementVNode as o, normalizeProps as d, guardReactiveProps as m, unref as l, renderSlot as n, createBlock as p, createCommentVNode as r } from "vue";
+import { defineComponent as a, openBlock as t, createElementBlock as s, createElementVNode as o, normalizeProps as d, guardReactiveProps as m, unref as c, renderSlot as n, createBlock as p, createCommentVNode as r } from "vue";
 import { useBindCx as u } from "../../hooks/useBindCx.js";
 import f from "../ScalarIcon/ScalarIcon.vue.js";
-const h = {
-  class: "contents",
-  role: "option"
-}, v = {
+const h = { class: "contents" }, v = {
   key: 0,
   class: "flex h-fit items-center text-sm font-medium text-c-3 group-hover:text-c-1"
 }, x = { class: "flex min-w-0 flex-1 flex-col gap-0.75" }, _ = { class: "flex items-center gap-1" }, g = { class: "flex-1 truncate text-sm font-medium" }, k = {
@@ -21,10 +18,10 @@ const h = {
     active: { type: Boolean }
   },
   setup($) {
-    const { cx: c } = u();
+    const { cx: l } = u();
     return (e, i) => (t(), s("li", h, [
       o("a", d(m(
-        l(c)(
+        c(l)(
           "group flex cursor-pointer gap-2.5 rounded px-3 py-1.5 no-underline hover:bg-b-2",
           {
             "bg-b-2": e.active
@@ -33,7 +30,7 @@ const h = {
       )), [
         e.icon ? (t(), s("div", v, [
           n(e.$slots, "icon", {}, () => [
-            e.icon ? (t(), p(l(f), {
+            e.icon ? (t(), p(c(f), {
               key: 0,
               icon: e.icon,
               size: "sm"

package/dist/components/ScalarSidebar/ScalarSidebar.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ScalarSidebar.stories.d.ts","sourceRoot":"","sources":["../../../src/components/ScalarSidebar/ScalarSidebar.stories.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAA;AAUrD,QAAA,MAAM,IAAI,EAAE,IAwBX,CAAA;AAED,eAAe,IAAI,CAAA;AACnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAA;AAElC,eAAO,MAAM,IAAI,EAAE,KAAU,CAAA;AAE7B,eAAO,MAAM,YAAY,EAAE,KAqC1B,CAAA;AAED,eAAO,MAAM,gBAAgB,EAAE,KA6D9B,CAAA;AAED,eAAO,MAAM,UAAU,EAAE,KAkBxB,CAAA"}
+{"version":3,"file":"ScalarSidebar.stories.d.ts","sourceRoot":"","sources":["../../../src/components/ScalarSidebar/ScalarSidebar.stories.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAA;AAUrD,QAAA,MAAM,IAAI,EAAE,IAsBX,CAAA;AAED,eAAe,IAAI,CAAA;AACnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAA;AAElC,eAAO,MAAM,IAAI,EAAE,KAAU,CAAA;AAE7B,eAAO,MAAM,YAAY,EAAE,KAqC1B,CAAA;AAED,eAAO,MAAM,gBAAgB,EAAE,KAqF9B,CAAA;AAED,eAAO,MAAM,UAAU,EAAE,KAkBxB,CAAA"}

package/dist/components/ScalarSidebar/ScalarSidebarButton.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ScalarSidebarButton.vue.d.ts","sourceRoot":"","sources":["../../../src/components/ScalarSidebar/ScalarSidebarButton.vue"],"names":[],"mappings":"AAoFA,OAAO,KAAK,EAAE,sBAAsB,EAAE,sBAAsB,EAAE,MAAM,SAAS,CAAA;AAI7E;;;;;;;;;;;;;;;;;;;;;GAqBG;;AACH,wBAyHC;AAWD,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
+{"version":3,"file":"ScalarSidebarButton.vue.d.ts","sourceRoot":"","sources":["../../../src/components/ScalarSidebar/ScalarSidebarButton.vue"],"names":[],"mappings":"AAmFA,OAAO,KAAK,EAAE,sBAAsB,EAAE,sBAAsB,EAAE,MAAM,SAAS,CAAA;AAI7E;;;;;;;;;;;;;;;;;;;;;GAqBG;;AACH,wBA4HC;AAWD,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}

package/dist/components/ScalarSidebar/ScalarSidebarButton.vue.js

@@ -1,12 +1,13 @@
-import { defineComponent as d, openBlock as t, createBlock as r, resolveDynamicComponent as p, mergeProps as c, unref as o, withCtx as u, createElementVNode as f, createElementBlock as n, renderSlot as s, createVNode as m, createCommentVNode as l } from "vue";
+import { defineComponent as r, openBlock as s, createBlock as c, resolveDynamicComponent as u, mergeProps as f, unref as o, withCtx as m, renderSlot as t, createVNode as n, createElementVNode as p, createElementBlock as a, createCommentVNode as l } from "vue";
 import { cva as b } from "../../cva.js";
 import { useBindCx as v } from "../../hooks/useBindCx.js";
+import y from "./ScalarSidebarIndent.vue.js";
 import h from "../ScalarIcon/ScalarIcon.vue.js";
-const y = { class: "flex items-center gap-1 flex-1" }, B = {
+const B = { class: "flex items-center gap-1 flex-1 py-2 leading-5" }, g = {
   key: 0,
   class: "size-3.5"
-}, _ = { key: 0 }, k = {}, N = /* @__PURE__ */ d({
-  ...k,
+}, S = { key: 0 }, $ = {}, w = /* @__PURE__ */ r({
+  ...$,
   inheritAttrs: !1,
   __name: "ScalarSidebarButton",
   props: {
@@ -16,48 +17,46 @@ const y = { class: "flex items-center gap-1 flex-1" }, B = {
     disabled: { type: Boolean },
     indent: { default: 0 }
   },
-  setup(C) {
-    const a = b({
-      base: ["rounded p-1.5 font-medium text-c-2 no-underline"],
+  setup(k) {
+    const d = b({
+      base: ["group/button flex rounded px-1.5 font-medium text-c-2 no-underline"],
       variants: {
         selected: { true: "cursor-auto bg-b-2 text-c-1" },
-        disabled: { true: "cursor-auto" },
-        indent: {
-          0: "pl-[6px]",
-          1: "pl-[24px]",
-          2: "pl-[42px]",
-          3: "pl-[60px]",
-          4: "pl-[78px]",
-          5: "pl-[96px]",
-          6: "pl-[114px]"
-        }
+        disabled: { true: "cursor-auto" }
       },
       compoundVariants: [
         { selected: !1, disabled: !1, class: "hover:bg-b-2" }
       ],
-      defaultVariants: { selected: !1, disabled: !1, indent: 0 }
+      defaultVariants: { selected: !1, disabled: !1 }
     }), { cx: i } = v();
-    return (e, V) => (t(), r(p(e.is), c({
+    return (e, C) => (s(), c(u(e.is), f({
       "aria-level": e.indent,
+      "aria-selected": e.selected,
       type: e.is === "button" ? "button" : void 0
-    }, o(i)(o(a)({ selected: e.selected, disabled: e.disabled, indent: e.indent }))), {
-      default: u(() => [
-        f("div", y, [
-          e.icon || e.$slots.icon ? (t(), n("div", B, [
-            s(e.$slots, "icon", {}, () => [
-              m(o(h), { icon: e.icon }, null, 8, ["icon"])
+    }, o(i)(o(d)({ selected: e.selected, disabled: e.disabled }))), {
+      default: m(() => [
+        t(e.$slots, "indent", {}, () => [
+          n(y, {
+            indent: e.indent,
+            selected: e.selected
+          }, null, 8, ["indent", "selected"])
+        ]),
+        p("div", B, [
+          e.icon || e.$slots.icon ? (s(), a("div", g, [
+            t(e.$slots, "icon", {}, () => [
+              n(o(h), { icon: e.icon }, null, 8, ["icon"])
             ])
           ])) : l("", !0),
-          s(e.$slots, "default")
+          t(e.$slots, "default")
         ]),
-        e.$slots.aside ? (t(), n("div", _, [
-          s(e.$slots, "aside")
+        e.$slots.aside ? (s(), a("div", S, [
+          t(e.$slots, "aside")
         ])) : l("", !0)
       ]),
       _: 3
-    }, 16, ["aria-level", "type"]));
+    }, 16, ["aria-level", "aria-selected", "type"]));
   }
 });
 export {
-  N as default
+  w as default
 };