@scalar/components 0.15.0 → 0.16.0

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

@@ -0,0 +1,94 @@
+import { defineComponent as k, mergeModels as m, useModel as x, createBlock as u, openBlock as n, unref as e, withCtx as a, createVNode as l, mergeProps as _, createElementVNode as d, createElementBlock as S, Fragment as V, renderList as b, toDisplayString as v, createTextVNode as w } from "vue";
+import { ScalarIconSwap as C, ScalarIconCaretRight as I, ScalarIconPlus as M } from "@scalar/icons";
+import { DropdownMenu as r } from "radix-vue/namespaced";
+import $ from "./ScalarMenuLink.vue.js";
+import B from "../ScalarDropdown/ScalarDropdownMenu.vue.js";
+import c from "../ScalarDropdown/ScalarDropdownButton.vue.js";
+import P from "../ScalarListbox/ScalarListboxCheckbox.vue.js";
+const z = { class: "flex h-full items-center gap-1 flex-1 truncate" }, E = /* @__PURE__ */ k({
+  inheritAttrs: !1,
+  __name: "ScalarMenuWorkspacePicker",
+  props: /* @__PURE__ */ m({
+    workspaceOptions: {}
+  }, {
+    modelValue: {},
+    modelModifiers: {}
+  }),
+  emits: /* @__PURE__ */ m(["createWorkspace"], ["update:modelValue"]),
+  setup(p, { emit: f }) {
+    const g = f, s = x(p, "modelValue");
+    return (i, t) => (n(), u(e(r).Sub, null, {
+      default: a(() => [
+        l($, _({
+          is: e(r).SubTrigger,
+          icon: e(C)
+        }, i.$attrs), {
+          default: a(() => [
+            t[2] || (t[2] = d("div", null, "Change workspace", -1)),
+            l(e(I), {
+              class: "ml-auto text-c-2 -mr-0.25 size-3",
+              weight: "bold"
+            })
+          ]),
+          _: 1
+        }, 16, ["is", "icon"]),
+        l(e(r).Portal, null, {
+          default: a(() => [
+            l(e(r).SubContent, {
+              as: e(B),
+              class: "max-h-radix-popper z-context-plus",
+              sideOffset: 3
+            }, {
+              default: a(() => [
+                l(e(r).RadioGroup, {
+                  modelValue: s.value,
+                  "onUpdate:modelValue": t[0] || (t[0] = (o) => s.value = o),
+                  class: "contents"
+                }, {
+                  default: a(() => [
+                    (n(!0), S(V, null, b(i.workspaceOptions, (o) => (n(), u(e(r).RadioItem, {
+                      key: o.id,
+                      as: e(c),
+                      class: "group/item flex items-center",
+                      value: o.id
+                    }, {
+                      default: a(() => [
+                        d("div", z, v(o.label), 1),
+                        l(e(P), {
+                          class: "ml-auto",
+                          selected: o.id === s.value
+                        }, null, 8, ["selected"])
+                      ]),
+                      _: 2
+                    }, 1032, ["as", "value"]))), 128))
+                  ]),
+                  _: 1
+                }, 8, ["modelValue"]),
+                l(e(r).Item, {
+                  as: e(c),
+                  class: "flex items-center",
+                  onClick: t[1] || (t[1] = (o) => g("createWorkspace"))
+                }, {
+                  default: a(() => [
+                    l(e(M), {
+                      class: "bg-b-3 -ml-0.75 rounded p-1 size-5 text-c-3",
+                      weight: "bold"
+                    }),
+                    t[3] || (t[3] = w(" Create workspace ", -1))
+                  ]),
+                  _: 1
+                }, 8, ["as"])
+              ]),
+              _: 1
+            }, 8, ["as"])
+          ]),
+          _: 1
+        })
+      ]),
+      _: 1
+    }));
+  }
+});
+export {
+  E as default
+};

package/dist/components/ScalarMenu/ScalarMenuWorkspacePicker.vue2.js

@@ -0,0 +1,4 @@
+import f from "./ScalarMenuWorkspacePicker.vue.js";
+export {
+  f as default
+};

package/dist/components/ScalarMenu/fixtures.d.ts

@@ -0,0 +1,2 @@
+export declare const images: string[];
+//# sourceMappingURL=fixtures.d.ts.map

package/dist/components/ScalarMenu/fixtures.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"fixtures.d.ts","sourceRoot":"","sources":["../../../src/components/ScalarMenu/fixtures.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,MAAM,UAIlB,CAAA"}

package/dist/components/ScalarMenu/index.d.ts

@@ -1,11 +1,13 @@
 export { default as ScalarMenu } from './ScalarMenu.vue.js';
 export { default as ScalarMenuButton } from './ScalarMenuButton.vue.js';
-export { default as ScalarMenuSection } from './ScalarMenuSection.vue.js';
 export { default as ScalarMenuLink } from './ScalarMenuLink.vue.js';
 export { default as ScalarMenuProduct } from './ScalarMenuProduct.vue.js';
 export { default as ScalarMenuProducts } from './ScalarMenuProducts.vue.js';
+export { default as ScalarMenuResources } from './ScalarMenuResources.vue.js';
+export { default as ScalarMenuSection } from './ScalarMenuSection.vue.js';
+export { default as ScalarMenuSupport } from './ScalarMenuSupport.vue.js';
 export { default as ScalarMenuTeamPicker } from './ScalarMenuTeamPicker.vue.js';
 export { default as ScalarMenuTeamProfile } from './ScalarMenuTeamProfile.vue.js';
-export { default as ScalarMenuResources } from './ScalarMenuResources.vue.js';
+export { default as ScalarMenuWorkspacePicker } from './ScalarMenuWorkspacePicker.vue.js';
 export type { ScalarMenuTeamOption } from './types';
 //# sourceMappingURL=index.d.ts.map

package/dist/components/ScalarMenu/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/ScalarMenu/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,kBAAkB,CAAA;AACxD,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,wBAAwB,CAAA;AACpE,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,yBAAyB,CAAA;AACtE,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,sBAAsB,CAAA;AAChE,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,yBAAyB,CAAA;AACtE,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,0BAA0B,CAAA;AACxE,OAAO,EAAE,OAAO,IAAI,oBAAoB,EAAE,MAAM,4BAA4B,CAAA;AAC5E,OAAO,EAAE,OAAO,IAAI,qBAAqB,EAAE,MAAM,6BAA6B,CAAA;AAC9E,OAAO,EAAE,OAAO,IAAI,mBAAmB,EAAE,MAAM,2BAA2B,CAAA;AAC1E,YAAY,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/ScalarMenu/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,kBAAkB,CAAA;AACxD,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,wBAAwB,CAAA;AACpE,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,sBAAsB,CAAA;AAChE,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,yBAAyB,CAAA;AACtE,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,0BAA0B,CAAA;AACxE,OAAO,EAAE,OAAO,IAAI,mBAAmB,EAAE,MAAM,2BAA2B,CAAA;AAC1E,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,yBAAyB,CAAA;AACtE,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,yBAAyB,CAAA;AACtE,OAAO,EAAE,OAAO,IAAI,oBAAoB,EAAE,MAAM,4BAA4B,CAAA;AAC5E,OAAO,EAAE,OAAO,IAAI,qBAAqB,EAAE,MAAM,6BAA6B,CAAA;AAC9E,OAAO,EAAE,OAAO,IAAI,yBAAyB,EAAE,MAAM,iCAAiC,CAAA;AACtF,YAAY,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAA"}

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

@@ -11,14 +11,18 @@ declare const _default: __VLS_WithSlots<import("vue").DefineComponent<{
     maxWidth?: string;
     size?: "xs" | "sm" | "md" | "lg" | "xl" | "full" | "xxs" | undefined;
     variant?: "form" | "search" | "error" | undefined;
-}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{
+}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+    close: () => any;
+}, string, import("vue").PublicProps, Readonly<{
     state: ReturnType<typeof useModal>;
     title?: string;
     bodyClass?: string;
     maxWidth?: string;
     size?: "xs" | "sm" | "md" | "lg" | "xl" | "full" | "xxs" | undefined;
     variant?: "form" | "search" | "error" | undefined;
-}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
+}> & Readonly<{
+    onClose?: (() => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
     default?: (props: {}) => any;
 } & {
     default?: (props: {}) => 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":"AAgNA,+CAA+C;AAC/C,wBAAgB,QAAQ;;;;EAUvB;;WAMQ,UAAU,CAAC,OAAO,QAAQ,CAAC;YAC1B,MAAM;gBACF,MAAM;eACP,MAAM;;;;WAHV,UAAU,CAAC,OAAO,QAAQ,CAAC;YAC1B,MAAM;gBACF,MAAM;eACP,MAAM;;;;cA+LL,CAAC,KAAK,IAAiB,KAAK,GAAG;;cAC/B,CAAC,KAAK,IAAiB,KAAK,GAAG;;AAvM7C,wBAyOK;AAOL,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,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":"AAyNA,+CAA+C;AAC/C,wBAAgB,QAAQ;;;;EAUvB;;WAMQ,UAAU,CAAC,OAAO,QAAQ,CAAC;YAC1B,MAAM;gBACF,MAAM;eACP,MAAM;;;;;;WAHV,UAAU,CAAC,OAAO,QAAQ,CAAC;YAC1B,MAAM;gBACF,MAAM;eACP,MAAM;;;;;;cAuML,CAAC,KAAK,IAAiB,KAAK,GAAG;;cAC/B,CAAC,KAAK,IAAiB,KAAK,GAAG;;AA/M7C,wBAoPK;AAOL,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,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 f } from "./ScalarModal.vue2.js";
 /* empty css                 */
-import a from "../../_virtual/_plugin-vue_export-helper.js";
-const m = /* @__PURE__ */ a(o, [["__scopeId", "data-v-589f8aa0"]]);
+import r from "../../_virtual/_plugin-vue_export-helper.js";
+const m = /* @__PURE__ */ r(o, [["__scopeId", "data-v-1319c63c"]]);
 export {
   m as default,
-  s as useModal
+  f as useModal
 };

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

@@ -1,13 +1,13 @@
-import { defineComponent as x, createBlock as i, openBlock as l, unref as a, withCtx as t, createElementVNode as c, normalizeClass as o, createVNode as m, createElementBlock as r, createCommentVNode as d, normalizeStyle as w, createTextVNode as b, toDisplayString as y, renderSlot as n, reactive as g } from "vue";
-import { Dialog as z, DialogPanel as k, DialogTitle as C } from "@headlessui/vue";
+import { defineComponent as x, createBlock as i, openBlock as l, unref as a, withCtx as t, createElementVNode as w, normalizeClass as o, createVNode as m, createElementBlock as r, createCommentVNode as d, normalizeStyle as b, createTextVNode as y, toDisplayString as g, renderSlot as n, reactive as z } from "vue";
+import { Dialog as k, DialogPanel as C, DialogTitle as S } from "@headlessui/vue";
 import { cva as f, cx as v } from "@scalar/use-hooks/useBindCx";
-import S from "../ScalarIconButton/ScalarIconButton.vue.js";
-const $ = {
+import D from "../ScalarIconButton/ScalarIconButton.vue.js";
+const N = {
   key: 0,
   class: "close-button z-10 fixed right-2 top-2"
 };
-function W() {
-  return g({
+function M() {
+  return z({
     open: !1,
     show() {
       this.open = !0;
@@ -17,7 +17,7 @@ function W() {
     }
   });
 }
-const E = /* @__PURE__ */ x({
+const T = /* @__PURE__ */ x({
   __name: "ScalarModal",
   props: {
     state: {},
@@ -27,8 +27,9 @@ const E = /* @__PURE__ */ x({
     size: { default: "md" },
     variant: {}
   },
-  setup(D) {
-    const p = f({
+  emits: ["close"],
+  setup(V, { emit: p }) {
+    const u = p, h = f({
       base: [
         "scalar-modal",
         "flex flex-col relative 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)]"
@@ -49,7 +50,7 @@ const E = /* @__PURE__ */ x({
           error: "scalar-modal-error"
         }
       }
-    }), u = f({
+    }), c = f({
       base: ["scalar-modal-body", "relative flex-1 min-h-0 p-3"].join(" "),
       variants: {
         variant: {
@@ -68,12 +69,14 @@ const E = /* @__PURE__ */ x({
         }
       }
     });
-    return (e, s) => (l(), i(a(z), {
+    return (e, s) => (l(), i(a(k), {
       open: e.state.open,
-      onClose: s[1] || (s[1] = (h) => e.state.hide())
+      onClose: s[1] || (s[1] = () => {
+        e.state.hide(), u("close");
+      })
     }, {
       default: t(() => [
-        c("div", {
+        w("div", {
           class: o(
             a(v)(
               e.size === "full" ? "scalar-modal-layout-full" : "scalar-modal-layout",
@@ -84,17 +87,17 @@ const E = /* @__PURE__ */ x({
             )
           )
         }, [
-          m(a(k), {
-            class: o(a(p)({ size: e.size, variant: e.variant })),
-            style: w({ maxWidth: e.maxWidth })
+          m(a(C), {
+            class: o(a(h)({ size: e.size, variant: e.variant })),
+            style: b({ maxWidth: e.maxWidth })
           }, {
             default: t(() => [
-              e.title ? (l(), i(a(C), {
+              e.title ? (l(), i(a(S), {
                 key: 0,
                 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(() => [
-                  b(y(e.title), 1)
+                  y(g(e.title), 1)
                 ]),
                 _: 1
               })) : d("", !0),
@@ -105,19 +108,19 @@ const E = /* @__PURE__ */ x({
                 n(e.$slots, "default", {}, void 0, !0)
               ], 2)) : (l(), r("div", {
                 key: 2,
-                class: o(a(v)(a(u)({ size: e.size, variant: e.variant }), e.bodyClass))
+                class: o(a(v)(a(c)({ size: e.size, variant: e.variant }), e.bodyClass))
               }, [
                 n(e.$slots, "default", {}, void 0, !0)
               ], 2))
             ]),
             _: 3
           }, 8, ["class", "style"]),
-          e.size === "full" ? (l(), r("div", $, [
-            m(a(S), {
+          e.size === "full" ? (l(), r("div", N, [
+            m(a(D), {
               class: "hover:bg-b-3 focus:outline-none",
               icon: "Close",
               label: "Clear Search",
-              onClose: s[0] || (s[0] = (h) => e.state.hide())
+              onClose: s[0] || (s[0] = ($) => e.state.hide())
             })
           ])) : d("", !0)
         ], 2)
@@ -127,6 +130,6 @@ const E = /* @__PURE__ */ x({
   }
 });
 export {
-  E as default,
-  W as useModal
+  T as default,
+  M as useModal
 };

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

@@ -1,10 +1,10 @@
-import { defineComponent as p, mergeModels as f, useModel as m, ref as g, createElementBlock as h, openBlock as t, normalizeProps as v, guardReactiveProps as b, unref as e, createVNode as k, withDirectives as _, createBlock as n, createCommentVNode as C, createElementVNode as S, mergeProps as y, vModelText as V, withModifiers as M } from "vue";
+import { defineComponent as p, mergeModels as f, useModel as m, ref as g, createElementBlock as h, openBlock as t, normalizeProps as v, guardReactiveProps as b, unref as e, createVNode as k, withDirectives as _, createBlock as n, createCommentVNode as y, createElementVNode as C, mergeProps as S, vModelText as V, withModifiers as M } from "vue";
 import { ScalarIconMagnifyingGlass as x } from "@scalar/icons";
 import { useBindCx as z } from "@scalar/use-hooks/useBindCx";
 import B from "../ScalarLoading/ScalarLoading.vue.js";
-import E from "../ScalarIconButton/ScalarIconButton.vue.js";
-const N = ["aria-label"], P = {}, q = /* @__PURE__ */ p({
-  ...P,
+import A from "../ScalarIconButton/ScalarIconButton.vue.js";
+const E = ["aria-label"], N = {}, q = /* @__PURE__ */ p({
+  ...N,
   inheritAttrs: !1,
   __name: "ScalarSearchInput",
   props: /* @__PURE__ */ f({
@@ -20,14 +20,14 @@ const N = ["aria-label"], P = {}, q = /* @__PURE__ */ p({
     function i() {
       a.value = "", o.value && o.value.focus();
     }
-    const { classCx: c, otherAttrs: d } = z();
+    const { stylingAttrsCx: c, otherAttrs: d } = z();
     return (l, r) => (t(), h("label", v(b(
       e(c)(
         "flex items-center text-lg font-medium h-10 pl-3 pr-1 py-2 gap-2.25"
       )
     )), [
       k(e(x), { class: "text-sidebar-c-search size-4" }),
-      _(S("input", y({
+      _(C("input", S({
         ref_key: "inputRef",
         ref: o,
         "aria-label": l.label ?? "Enter search query",
@@ -40,7 +40,7 @@ const N = ["aria-label"], P = {}, q = /* @__PURE__ */ p({
         type: "search"
       }, e(d), {
         "onUpdate:modelValue": r[0] || (r[0] = (u) => a.value = u)
-      }), null, 16, N), [
+      }), null, 16, E), [
         [V, a.value]
       ]),
       l.loading && l.loading.isLoading ? (t(), n(e(B), {
@@ -48,14 +48,14 @@ const N = ["aria-label"], P = {}, q = /* @__PURE__ */ p({
         class: "self-center",
         loadingState: l.loading,
         size: "md"
-      }, null, 8, ["loadingState"])) : a.value ? (t(), n(e(E), {
+      }, null, 8, ["loadingState"])) : a.value ? (t(), n(e(A), {
         key: 1,
         class: "p-0 size-5",
         icon: "Close",
         label: "Clear Search",
         thickness: "1.5",
         onClick: M(i, ["stop", "prevent"])
-      })) : C("", !0)
+      })) : y("", !0)
     ], 16));
   }
 });

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

@@ -4,7 +4,7 @@ import u from "../ScalarIcon/ScalarIconLegacyAdapter.vue.js";
 const f = ["aria-selected"], h = {
   key: 0,
   class: "flex h-fit items-center text-sm font-medium text-c-3 group-hover:text-c-1"
-}, _ = { class: "flex min-w-0 flex-1 flex-col gap-0.75" }, b = { class: "flex items-center gap-1" }, x = { class: "flex-1 truncate zoomed:!whitespace-normal break-words text-base font-medium" }, k = {
+}, b = { class: "flex min-w-0 flex-1 flex-col gap-0.75" }, _ = { class: "flex items-center gap-1" }, x = { class: "flex-1 truncate zoomed:!whitespace-normal break-words text-base font-medium" }, k = {
   key: 0,
   class: "text-base text-c-2"
 }, g = {
@@ -14,7 +14,7 @@ const f = ["aria-selected"], h = {
   inheritAttrs: !1,
   __name: "ScalarSearchResultItem",
   props: {
-    icon: {},
+    icon: { type: [Object, Function] },
     selected: { type: Boolean }
   },
   setup(v) {
@@ -34,14 +34,14 @@ const f = ["aria-selected"], h = {
         r(e.$slots, "icon", {}, () => [
           e.icon ? (t(), m(l(u), {
             key: 0,
-            icon: e.icon,
-            class: "size-4"
+            class: "size-4",
+            icon: e.icon
           }, null, 8, ["icon"])) : s("", !0)
         ]),
         i[0] || (i[0] = n("span", null, " ", -1))
       ])) : s("", !0),
-      n("div", _, [
-        n("div", b, [
+      n("div", b, [
+        n("div", _, [
           n("div", x, [
             r(e.$slots, "default")
           ]),

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":"AA4FA,OAAO,KAAK,EAAE,sBAAsB,EAAE,sBAAsB,EAAE,MAAM,SAAS,CAAA;AAG7E;;;;;;;;;;;;;;;;;;;;;GAqBG;;AACH,wBAmIC;AAOD,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,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":"AAuFA,OAAO,KAAK,EAAE,sBAAsB,EAAE,sBAAsB,EAAE,MAAM,SAAS,CAAA;AAG7E;;;;;;;;;;;;;;;;;;;;;GAqBG;;AACH,wBA2HC;AAOD,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}

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

@@ -1,29 +1,27 @@
-import { defineComponent as r, createBlock as i, openBlock as t, resolveDynamicComponent as c, mergeProps as u, unref as a, withCtx as f, renderSlot as s, createElementVNode as p, createElementBlock as n, createCommentVNode as o, createVNode as m } from "vue";
-import { cva as b, useBindCx as v } from "@scalar/use-hooks/useBindCx";
-import y from "./ScalarSidebarIndent.vue.js";
-import h from "../ScalarIcon/ScalarIconLegacyAdapter.vue.js";
-const B = { class: "flex items-center gap-1 flex-1 py-2 leading-5" }, $ = {
+import { defineComponent as l, createBlock as o, openBlock as s, resolveDynamicComponent as r, mergeProps as c, unref as a, withCtx as u, renderSlot as t, createElementBlock as f, createCommentVNode as n, createElementVNode as b, createVNode as p } from "vue";
+import { cva as m, useBindCx as v } from "@scalar/use-hooks/useBindCx";
+import h from "./ScalarSidebarIndent.vue.js";
+import y from "../ScalarIcon/ScalarIconLegacyAdapter.vue.js";
+const B = {
   key: 0,
-  class: "size-4"
-}, g = {
-  key: 0,
-  class: "flex items-center"
-}, k = {}, w = /* @__PURE__ */ r({
-  ...k,
+  class: "h-[1lh] *:size-4 mr-1"
+}, k = { class: "flex-1 min-w-0" }, $ = {}, E = /* @__PURE__ */ l({
+  ...$,
   inheritAttrs: !1,
   __name: "ScalarSidebarButton",
   props: {
     is: { default: "a" },
-    icon: {},
+    icon: { type: [Object, Function] },
     active: { type: Boolean },
     selected: { type: Boolean },
     disabled: { type: Boolean },
     indent: { default: 0 }
   },
-  setup(C) {
-    const d = b({
+  setup(g) {
+    const i = m({
       base: [
-        "group/button flex items-stretch rounded px-2 font-sidebar text-c-2 no-underline"
+        "group/button flex items-stretch rounded p-2 ",
+        "font-sidebar leading-5 text-c-2 no-underline wrap-break-word"
       ],
       variants: {
         active: { true: "text-c-1 font-sidebar-active" },
@@ -34,38 +32,36 @@ const B = { class: "flex items-center gap-1 flex-1 py-2 leading-5" }, $ = {
         { selected: !1, disabled: !1, class: "hover:bg-b-2" }
       ],
       defaultVariants: { selected: !1, disabled: !1, active: !1 }
-    }), { cx: l } = v();
-    return (e, S) => (t(), i(c(e.is), u({
+    }), { cx: d } = v();
+    return (e, C) => (s(), o(r(e.is), c({
       "aria-selected": e.selected,
       type: e.is === "button" ? "button" : void 0
-    }, a(l)(a(d)({ selected: e.selected, disabled: e.disabled, active: e.active }))), {
-      default: f(() => [
-        s(e.$slots, "indent", {}, () => [
-          m(y, {
+    }, a(d)(a(i)({ selected: e.selected, disabled: e.disabled, active: e.active }))), {
+      default: u(() => [
+        t(e.$slots, "indent", {}, () => [
+          p(h, {
+            disabled: e.disabled,
             indent: e.indent,
-            selected: e.selected,
-            disabled: e.disabled
-          }, null, 8, ["indent", "selected", "disabled"])
+            selected: e.selected
+          }, null, 8, ["disabled", "indent", "selected"])
         ]),
-        p("div", B, [
-          e.icon || e.$slots.icon ? (t(), n("div", $, [
-            s(e.$slots, "icon", {}, () => [
-              e.icon ? (t(), i(a(h), {
-                key: 0,
-                icon: e.icon
-              }, null, 8, ["icon"])) : o("", !0)
-            ])
-          ])) : o("", !0),
-          s(e.$slots, "default")
+        e.icon || e.$slots.icon ? (s(), f("div", B, [
+          t(e.$slots, "icon", {}, () => [
+            e.icon ? (s(), o(a(y), {
+              key: 0,
+              icon: e.icon
+            }, null, 8, ["icon"])) : n("", !0)
+          ])
+        ])) : n("", !0),
+        b("div", k, [
+          t(e.$slots, "default")
         ]),
-        e.$slots.aside ? (t(), n("div", g, [
-          s(e.$slots, "aside")
-        ])) : o("", !0)
+        t(e.$slots, "aside")
       ]),
       _: 3
     }, 16, ["aria-selected", "type"]));
   }
 });
 export {
-  w as default
+  E as default
 };

package/dist/components/ScalarSidebar/ScalarSidebarGroup.vue.d.ts

@@ -1,12 +1,14 @@
-import type { ScalarSidebarItemProps } from '../../components/ScalarSidebar/types';
-import { type SidebarGroupLevel } from './useSidebarGroups.js';
+import type { ScalarSidebarGroupSlots } from './types';
 /**
  * Scalar Sidebar Group component
  *
- * A collapsible ScalarSidebarItem that can contain subitems
+ * A collapsible ScalarSidebarItem that can contain subitems.
+ *
+ * Classes applied to the component are passed to the inner list element.
+ * Other attributes (like click event) are passed to the toggle button.
  *
  * @example
- * <ScalarSidebarGroup v-model="open">
+ * <ScalarSidebarGroup>
  *   <!-- Group toggle text -->
  *   <template #items>
  *     <ScalarSidebarItem>...</ScalarSidebarItem>
@@ -14,34 +16,25 @@ import { type SidebarGroupLevel } from './useSidebarGroups.js';
  *     <ScalarSidebarItem>...</ScalarSidebarItem>
  *   </template>
  * </ScalarSidebarGroup>
+ *
+ *
+ * By default the component has it's own internal open state, but this can be
+ * controlled by passing the `controlled` prop and using binding the :open prop.
+ *
  */
-declare const _default: __VLS_WithSlots<import("vue").DefineComponent<ScalarSidebarItemProps & {
-    modelValue?: boolean;
+declare const _default: __VLS_WithSlots<import("vue").DefineComponent<import("./types").ScalarSidebarItemProps & {
+    controlled?: boolean;
+} & {
+    open?: boolean;
 }, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    "update:modelValue": (value: boolean) => any;
-}, string, import("vue").PublicProps, Readonly<ScalarSidebarItemProps & {
-    modelValue?: boolean;
+    "update:open": (value: boolean) => any;
+}, string, import("vue").PublicProps, Readonly<import("./types").ScalarSidebarItemProps & {
+    controlled?: boolean;
+} & {
+    open?: boolean;
 }> & Readonly<{
-    "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
-}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
-    /** The text content of the toggle */
-    default?(props: {
-        open: boolean;
-    }): unknown;
-    /** Override the entire toggle button */
-    button?(props: {
-        open: boolean;
-        level: SidebarGroupLevel;
-    }): unknown;
-    /** The list of sidebar subitems */
-    items?(props: {
-        open: boolean;
-    }): unknown;
-    /** Side icon for the sidebar group */
-    icon?(props: {
-        open: boolean;
-    }): unknown;
-}>;
+    "onUpdate:open"?: ((value: boolean) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, ScalarSidebarGroupSlots>;
 export default _default;
 type __VLS_WithSlots<T, S> = T & {
     new (): {

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

@@ -1 +1 @@
-{"version":3,"file":"ScalarSidebarGroup.vue.d.ts","sourceRoot":"","sources":["../../../src/components/ScalarSidebar/ScalarSidebarGroup.vue"],"names":[],"mappings":"AA2FA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,kCAAkC,CAAA;AAM9E,OAAO,EAAE,KAAK,iBAAiB,EAAoB,MAAM,oBAAoB,CAAA;AAG7E;;;;;;;;;;;;;;GAcG;;iBA8BU,OAAO;;;;iBAAP,OAAO;;;;IAtBlB,qCAAqC;oBACrB;QAAE,IAAI,EAAE,OAAO,CAAA;KAAE,GAAG,OAAO;IAC3C,wCAAwC;mBACzB;QAAE,IAAI,EAAE,OAAO,CAAC;QAAC,KAAK,EAAE,iBAAiB,CAAA;KAAE,GAAG,OAAO;IACpE,mCAAmC;kBACrB;QAAE,IAAI,EAAE,OAAO,CAAA;KAAE,GAAG,OAAO;IACzC,sCAAsC;iBACzB;QAAE,IAAI,EAAE,OAAO,CAAA;KAAE,GAAG,OAAO;;AAd1C,wBAqKC;AAOD,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
+{"version":3,"file":"ScalarSidebarGroup.vue.d.ts","sourceRoot":"","sources":["../../../src/components/ScalarSidebar/ScalarSidebarGroup.vue"],"names":[],"mappings":"AAuGA,OAAO,KAAK,EAA2B,uBAAuB,EAAE,MAAM,SAAS,CAAA;AAI/E;;;;;;;;;;;;;;;;;;;;;;GAsBG;;;;WAqBM,OAAO;;;;;;WAAP,OAAO;;;;AApBhB,wBAyKC;AAOD,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}