@scalar/sidebar 0.7.16 → 0.7.18

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

@@ -59,6 +59,11 @@ type __VLS_Slots = {
     empty?(props: {
         item: Item;
     }): unknown;
+    /** Places content when an item is empty */
+    icon?(props: {
+        item: Item;
+        open: boolean;
+    }): unknown;
 };
 declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
     selectItem: (id: string) => any;

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

@@ -1 +1 @@
-{"version":3,"file":"ScalarSidebar.vue.d.ts","sourceRoot":"","sources":["../../src/components/ScalarSidebar.vue"],"names":[],"mappings":"AAuJA,OAAO,KAAK,EACV,YAAY,EACZ,WAAW,EACX,mBAAmB,EACpB,MAAM,uBAAuB,CAAA;AAC9B,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,SAAS,CAAA;AAI3C,KAAK,WAAW,GAAG;IACjB;;;OAGG;IACH,MAAM,EAAE,MAAM,CAAA;IACd;;OAEG;IACH,KAAK,EAAE,IAAI,EAAE,CAAA;IACb;;OAEG;IACH,UAAU,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,OAAO,CAAA;IACnC;;OAEG;IACH,UAAU,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,OAAO,CAAA;IACnC;;;OAGG;IACH,OAAO,CAAC,EAAE;QACR,oBAAoB,EAAE,MAAM,GAAG,SAAS,GAAG,SAAS,CAAA;KACrD,CAAA;IACD;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,CAAA;IACf;;;;OAIG;IACH,WAAW,CAAC,EAAE,mBAAmB,CAAC,aAAa,CAAC,CAAA;IAChD;;;;OAIG;IACH,WAAW,CAAC,EAAE,mBAAmB,CAAC,aAAa,CAAC,CAAA;CACjD,CAAC;AAuBF,KAAK,WAAW,GAAG;IACjB,oCAAoC;IACpC,OAAO,CAAC,IAAI,OAAO,CAAA;IACnB,iEAAiE;IACjE,SAAS,CAAC,CAAC,KAAK,EAAE;QAAE,IAAI,EAAE,IAAI,CAAA;KAAE,GAAG,OAAO,CAAA;IAC1C,yEAAyE;IACzE,MAAM,CAAC,IAAI,OAAO,CAAA;IAClB,4EAA4E;IAC5E,MAAM,CAAC,IAAI,OAAO,CAAA;IAClB,6DAA6D;IAC7D,MAAM,CAAC,IAAI,OAAO,CAAA;IAClB,2CAA2C;IAC3C,KAAK,CAAC,CAAC,KAAK,EAAE;QAAE,IAAI,EAAE,IAAI,CAAA;KAAE,GAAG,OAAO,CAAA;CACvC,CAAC;AAoJF,QAAA,MAAM,eAAe;;;;;;kFAOnB,CAAC;wBACkB,eAAe,CAAC,OAAO,eAAe,EAAE,WAAW,CAAC;AAAzE,wBAA0E;AAQ1E,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
+{"version":3,"file":"ScalarSidebar.vue.d.ts","sourceRoot":"","sources":["../../src/components/ScalarSidebar.vue"],"names":[],"mappings":"AAgKA,OAAO,KAAK,EACV,YAAY,EACZ,WAAW,EACX,mBAAmB,EACpB,MAAM,uBAAuB,CAAA;AAC9B,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,SAAS,CAAA;AAI3C,KAAK,WAAW,GAAG;IACjB;;;OAGG;IACH,MAAM,EAAE,MAAM,CAAA;IACd;;OAEG;IACH,KAAK,EAAE,IAAI,EAAE,CAAA;IACb;;OAEG;IACH,UAAU,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,OAAO,CAAA;IACnC;;OAEG;IACH,UAAU,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,OAAO,CAAA;IACnC;;;OAGG;IACH,OAAO,CAAC,EAAE;QACR,oBAAoB,EAAE,MAAM,GAAG,SAAS,GAAG,SAAS,CAAA;KACrD,CAAA;IACD;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,CAAA;IACf;;;;OAIG;IACH,WAAW,CAAC,EAAE,mBAAmB,CAAC,aAAa,CAAC,CAAA;IAChD;;;;OAIG;IACH,WAAW,CAAC,EAAE,mBAAmB,CAAC,aAAa,CAAC,CAAA;CACjD,CAAC;AAuBF,KAAK,WAAW,GAAG;IACjB,oCAAoC;IACpC,OAAO,CAAC,IAAI,OAAO,CAAA;IACnB,iEAAiE;IACjE,SAAS,CAAC,CAAC,KAAK,EAAE;QAAE,IAAI,EAAE,IAAI,CAAA;KAAE,GAAG,OAAO,CAAA;IAC1C,yEAAyE;IACzE,MAAM,CAAC,IAAI,OAAO,CAAA;IAClB,4EAA4E;IAC5E,MAAM,CAAC,IAAI,OAAO,CAAA;IAClB,6DAA6D;IAC7D,MAAM,CAAC,IAAI,OAAO,CAAA;IAClB,2CAA2C;IAC3C,KAAK,CAAC,CAAC,KAAK,EAAE;QAAE,IAAI,EAAE,IAAI,CAAA;KAAE,GAAG,OAAO,CAAA;IACtC,2CAA2C;IAC3C,IAAI,CAAC,CAAC,KAAK,EAAE;QAAE,IAAI,EAAE,IAAI,CAAC;QAAC,IAAI,EAAE,OAAO,CAAA;KAAE,GAAG,OAAO,CAAA;CACrD,CAAC;AA6JF,QAAA,MAAM,eAAe;;;;;;kFAOnB,CAAC;wBACkB,eAAe,CAAC,OAAO,eAAe,EAAE,WAAW,CAAC;AAAzE,wBAA0E;AAQ1E,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}

package/dist/components/ScalarSidebar.vue.js

@@ -1,8 +1,8 @@
-import { defineComponent as y, createBlock as m, openBlock as s, unref as n, normalizeStyle as p, withCtx as a, renderSlot as o, createVNode as S, createElementVNode as b, createElementBlock as g, Fragment as D, renderList as $, createSlots as E, mergeProps as f } from "vue";
-import { ScalarSidebar as k, ScalarSidebarItems as I } from "@scalar/components";
+import { defineComponent as p, useSlots as S, createBlock as f, openBlock as s, unref as i, normalizeStyle as b, withCtx as a, renderSlot as l, createVNode as g, createElementVNode as D, createElementBlock as E, Fragment as $, renderList as k, createSlots as I, mergeProps as d } from "vue";
+import { ScalarSidebar as v, ScalarSidebarItems as x } from "@scalar/components";
 import { filterItems as F } from "../helpers/filter-items.js";
-import v from "./SidebarItem.vue.js";
-const V = /* @__PURE__ */ y({
+import B from "./SidebarItem.vue.js";
+const w = /* @__PURE__ */ p({
   __name: "ScalarSidebar",
   props: {
     layout: {},
@@ -16,59 +16,66 @@ const V = /* @__PURE__ */ y({
   },
   emits: ["reorder", "selectItem"],
   setup(e, { emit: u }) {
-    const i = u, c = (t, l) => {
-      i("reorder", t, l);
+    const m = u, n = S(), y = (t, r) => {
+      m("reorder", t, r);
     };
-    return (t, l) => (s(), m(n(k), {
+    return (t, r) => (s(), f(i(v), {
       class: "flex min-h-0 flex-col",
-      style: p({
+      style: b({
         "--scalar-sidebar-indent": e.indent + "px"
       })
     }, {
       default: a(() => [
-        o(t.$slots, "header"),
-        o(t.$slots, "default", {}, () => [
-          S(n(I), { class: "custom-scroll pt-0" }, {
+        l(t.$slots, "header"),
+        l(t.$slots, "default", {}, () => [
+          g(i(x), { class: "custom-scroll pt-0" }, {
             default: a(() => [
-              o(t.$slots, "before"),
-              (s(!0), g(D, null, $(n(F)(e.layout, e.items), (d) => (s(), m(v, {
-                key: d.id,
+              l(t.$slots, "before"),
+              (s(!0), E($, null, k(i(F)(e.layout, e.items), (c) => (s(), f(B, {
+                key: c.id,
                 isDraggable: e.isDraggable ?? e.layout === "client",
                 isDroppable: e.isDroppable,
                 isExpanded: e.isExpanded,
                 isSelected: e.isSelected,
-                item: d,
+                item: c,
                 layout: e.layout,
                 options: e.options,
-                onOnDragEnd: c,
-                onSelectItem: l[0] || (l[0] = (r) => i("selectItem", r))
-              }, E({ _: 2 }, [
-                t.$slots.decorator ? {
+                onOnDragEnd: y,
+                onSelectItem: r[0] || (r[0] = (o) => m("selectItem", o))
+              }, I({ _: 2 }, [
+                n.decorator ? {
                   name: "decorator",
-                  fn: a((r) => [
-                    o(t.$slots, "decorator", f({ ref_for: !0 }, r))
+                  fn: a((o) => [
+                    l(t.$slots, "decorator", d({ ref_for: !0 }, o))
                   ]),
                   key: "0"
                 } : void 0,
-                t.$slots.empty ? {
+                n.empty ? {
                   name: "empty",
-                  fn: a((r) => [
-                    o(t.$slots, "empty", f({ ref_for: !0 }, r))
+                  fn: a((o) => [
+                    l(t.$slots, "empty", d({ ref_for: !0 }, o))
                   ]),
                   key: "1"
+                } : void 0,
+                n.icon ? {
+                  name: "icon",
+                  fn: a((o) => [
+                    l(t.$slots, "icon", d({ ref_for: !0 }, o))
+                  ]),
+                  key: "2"
                 } : void 0
               ]), 1032, ["isDraggable", "isDroppable", "isExpanded", "isSelected", "item", "layout", "options"]))), 128))
             ]),
             _: 3
           }),
-          l[1] || (l[1] = b("div", { class: "flex-1" }, null, -1))
+          r[1] || (r[1] = D("div", { class: "flex-1" }, null, -1))
         ]),
-        o(t.$slots, "footer")
+        l(t.$slots, "footer")
       ]),
       _: 3
     }, 8, ["style"]));
   }
 });
 export {
-  V as default
+  w as default
 };

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

@@ -1 +1 @@
-{"version":3,"file":"SidebarHttpBadge.vue.d.ts","sourceRoot":"","sources":["../../src/components/SidebarHttpBadge.vue"],"names":[],"mappings":"AAyDA,KAAK,WAAW,GAAG;IACjB,MAAM,EAAE,MAAM,CAAA;IACd,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB,CAAC;AAkEF,QAAA,IAAI,OAAO,IAAW,CAAE;AACxB,KAAK,WAAW,GAAG,EAAE,GACnB;IAAE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,OAAO,KAAK,GAAG,CAAA;CAAE,CAAC;AAsB/C,QAAA,MAAM,eAAe,kSAMnB,CAAC;wBACkB,eAAe,CAAC,OAAO,eAAe,EAAE,WAAW,CAAC;AAAzE,wBAA0E;AAQ1E,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
+{"version":3,"file":"SidebarHttpBadge.vue.d.ts","sourceRoot":"","sources":["../../src/components/SidebarHttpBadge.vue"],"names":[],"mappings":"AAyDA,KAAK,WAAW,GAAG;IACjB,MAAM,EAAE,MAAM,CAAA;IACd,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB,CAAC;AAgEF,QAAA,IAAI,OAAO,IAAW,CAAE;AACxB,KAAK,WAAW,GAAG,EAAE,GACnB;IAAE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,OAAO,KAAK,GAAG,CAAA;CAAE,CAAC;AAsB/C,QAAA,MAAM,eAAe,kSAMnB,CAAC;wBACkB,eAAe,CAAC,OAAO,eAAe,EAAE,WAAW,CAAC;AAAzE,wBAA0E;AAQ1E,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}

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

@@ -52,6 +52,14 @@ type __VLS_Slots = {
     empty?(props: {
         item: Item;
     }): unknown;
+    /**
+     * Adds an optional icon for each item.
+     * The slot receives an object with the current item and the open state.
+     */
+    icon?(props: {
+        item: Item;
+        open: boolean;
+    }): unknown;
 };
 declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
     onDragEnd: (draggingItem: DraggingItem, hoveredItem: HoveredItem) => any;

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

@@ -1 +1 @@
-{"version":3,"file":"SidebarItem.vue.d.ts","sourceRoot":"","sources":["../../src/components/SidebarItem.vue"],"names":[],"mappings":"AAoTA,OAAO,EAEL,KAAK,YAAY,EACjB,KAAK,WAAW,EAChB,KAAK,mBAAmB,EACzB,MAAM,uBAAuB,CAAA;AAC9B,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,SAAS,CAAA;AAK3C,KAAK,WAAW,GAAG;IACf;;OAEG;IACH,IAAI,EAAE,IAAI,CAAA;IACV;;OAEG;IACH,MAAM,EAAE,MAAM,CAAA;IACd;;OAEG;IACH,UAAU,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,OAAO,CAAA;IACnC;;OAEG;IACH,UAAU,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,OAAO,CAAA;IACnC;;;OAGG;IACH,OAAO,EACH;QACE,oBAAoB,EAAE,MAAM,GAAG,SAAS,GAAG,SAAS,CAAA;KACrD,GACD,SAAS,CAAA;IAEb;;;;OAIG;IACH,WAAW,CAAC,EAAE,mBAAmB,CAAC,aAAa,CAAC,CAAA;IAChD;;;;OAIG;IACH,WAAW,CAAC,EAAE,mBAAmB,CAAC,aAAa,CAAC,CAAA;CACjD,CAAC;AAmBJ,KAAK,WAAW,GAAG;IACjB;;;OAGG;IACH,SAAS,CAAC,CAAC,KAAK,EAAE;QAAE,IAAI,EAAE,IAAI,CAAA;KAAE,GAAG,OAAO,CAAA;IAC1C;;;OAGG;IACH,KAAK,CAAC,CAAC,KAAK,EAAE;QAAE,IAAI,EAAE,IAAI,CAAA;KAAE,GAAG,OAAO,CAAA;CACvC,CAAC;AAqdF,QAAA,MAAM,eAAe;;;;;;kFAOnB,CAAC;wBACkB,eAAe,CAAC,OAAO,eAAe,EAAE,WAAW,CAAC;AAAzE,wBAA0E;AAQ1E,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
+{"version":3,"file":"SidebarItem.vue.d.ts","sourceRoot":"","sources":["../../src/components/SidebarItem.vue"],"names":[],"mappings":"AAoVA,OAAO,EAEL,KAAK,YAAY,EACjB,KAAK,WAAW,EAChB,KAAK,mBAAmB,EACzB,MAAM,uBAAuB,CAAA;AAC9B,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,SAAS,CAAA;AAK3C,KAAK,WAAW,GAAG;IACf;;OAEG;IACH,IAAI,EAAE,IAAI,CAAA;IACV;;OAEG;IACH,MAAM,EAAE,MAAM,CAAA;IACd;;OAEG;IACH,UAAU,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,OAAO,CAAA;IACnC;;OAEG;IACH,UAAU,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,OAAO,CAAA;IACnC;;;OAGG;IACH,OAAO,EACH;QACE,oBAAoB,EAAE,MAAM,GAAG,SAAS,GAAG,SAAS,CAAA;KACrD,GACD,SAAS,CAAA;IAEb;;;;OAIG;IACH,WAAW,CAAC,EAAE,mBAAmB,CAAC,aAAa,CAAC,CAAA;IAChD;;;;OAIG;IACH,WAAW,CAAC,EAAE,mBAAmB,CAAC,aAAa,CAAC,CAAA;CACjD,CAAC;AAmBJ,KAAK,WAAW,GAAG;IACjB;;;OAGG;IACH,SAAS,CAAC,CAAC,KAAK,EAAE;QAAE,IAAI,EAAE,IAAI,CAAA;KAAE,GAAG,OAAO,CAAA;IAC1C;;;OAGG;IACH,KAAK,CAAC,CAAC,KAAK,EAAE;QAAE,IAAI,EAAE,IAAI,CAAA;KAAE,GAAG,OAAO,CAAA;IACtC;;;OAGG;IACH,IAAI,CAAC,CAAC,KAAK,EAAE;QAAE,IAAI,EAAE,IAAI,CAAC;QAAC,IAAI,EAAE,OAAO,CAAA;KAAE,GAAG,OAAO,CAAA;CACrD,CAAC;AA0eF,QAAA,MAAM,eAAe;;;;;;kFAOnB,CAAC;wBACkB,eAAe,CAAC,OAAO,eAAe,EAAE,WAAW,CAAC;AAAzE,wBAA0E;AAQ1E,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}

package/dist/components/SidebarItem.vue.js

@@ -1,20 +1,20 @@
-import { defineComponent as B, useSlots as N, resolveComponent as V, createBlock as m, unref as o, openBlock as a, mergeProps as u, toHandlers as D, withCtx as t, createTextVNode as H, toDisplayString as L, createElementBlock as b, Fragment as I, renderList as x, createSlots as g, renderSlot as c, createVNode as s, createCommentVNode as v, normalizeClass as w } from "vue";
-import { ScalarSidebarSection as O, ScalarSidebarGroup as z, ScalarSidebarGroupToggle as A, ScalarSidebarItem as P } from "@scalar/components";
+import { defineComponent as N, useSlots as V, resolveComponent as H, createBlock as d, unref as n, openBlock as l, mergeProps as c, toHandlers as v, withCtx as i, createTextVNode as L, toDisplayString as O, createElementBlock as f, Fragment as I, renderList as $, createSlots as b, renderSlot as r, createVNode as s, createCommentVNode as D, normalizeClass as w } from "vue";
+import { ScalarSidebarSection as p, ScalarSidebarGroup as z, ScalarSidebarGroupToggle as A, ScalarSidebarItem as P } from "@scalar/components";
 import { LibraryIcon as j } from "@scalar/icons/library";
 import C from "./SidebarItemDecorator.vue.js";
-import { filterItems as $ } from "../helpers/filter-items.js";
+import { filterItems as x } from "../helpers/filter-items.js";
 import { hasChildren as q } from "../helpers/has-children.js";
 import { isSidebarFolder as J } from "../helpers/is-sidebar-folder.js";
 import { useDraggable as K } from "../hooks/use-draggable.js";
-import p from "./SidebarHttpBadge.vue.js";
-import f from "./SidebarItemLabel.vue.js";
+import F from "./SidebarHttpBadge.vue.js";
+import g from "./SidebarItemLabel.vue.js";
 const M = {
   key: 0,
   class: "line-through"
 }, Q = {
   key: 0,
   class: "line-through"
-}, oe = /* @__PURE__ */ B({
+}, oe = /* @__PURE__ */ N({
   __name: "SidebarItem",
   props: {
     item: {},
@@ -26,101 +26,115 @@ const M = {
     isDroppable: { type: Function }
   },
   emits: ["selectItem", "onDragEnd"],
-  setup(e, { emit: F }) {
-    const y = F, l = N(), G = (i) => "isGroup" in i && i.isGroup, E = (i) => ("isDeprecated" in i && i.isDeprecated) ?? !1, S = (i, r) => {
-      y("onDragEnd", i, r);
+  setup(e, { emit: G }) {
+    const y = G, a = V(), B = (t) => "isGroup" in t && t.isGroup, E = (t) => ("isDeprecated" in t && t.isDeprecated) ?? !1, S = (t, m) => {
+      y("onDragEnd", t, m);
     }, { draggableAttrs: h, draggableEvents: k } = K({
       id: e.item.id,
       isDraggable: e.isDraggable,
       isDroppable: e.isDroppable,
       onDragEnd: S
     });
-    return (i, r) => {
-      const T = V("SidebarItem", !0);
-      return o(q)(e.item) && G(e.item) ? (a(), m(o(O), u({ key: 0 }, o(h), D(o(k))), {
-        items: t(() => [
-          (a(!0), b(I, null, x(o($)(e.layout, e.item.children), (d) => (a(), m(T, {
-            key: d.id,
+    return (t, m) => {
+      const T = H("SidebarItem", !0);
+      return n(q)(e.item) && B(e.item) ? (l(), d(n(p), c({ key: 0 }, n(h), v(n(k))), {
+        items: i(() => [
+          (l(!0), f(I, null, $(n(x)(e.layout, e.item.children), (u) => (l(), d(T, {
+            key: u.id,
             isDraggable: e.isDraggable,
             isDroppable: e.isDroppable,
             isExpanded: e.isExpanded,
             isSelected: e.isSelected,
-            item: d,
+            item: u,
             layout: e.layout,
             options: e.options,
             onOnDragEnd: S,
-            onSelectItem: r[0] || (r[0] = (n) => y("selectItem", n))
-          }, g({ _: 2 }, [
-            l.decorator ? {
+            onSelectItem: m[0] || (m[0] = (o) => y("selectItem", o))
+          }, b({ _: 2 }, [
+            a.decorator ? {
               name: "decorator",
-              fn: t((n) => [
-                c(i.$slots, "decorator", u({ ref_for: !0 }, n))
+              fn: i((o) => [
+                r(t.$slots, "decorator", c({ ref_for: !0 }, o))
               ]),
               key: "0"
             } : void 0,
-            l.empty ? {
+            a.empty ? {
               name: "empty",
-              fn: t((n) => [
-                c(i.$slots, "empty", u({ ref_for: !0 }, n))
+              fn: i((o) => [
+                r(t.$slots, "empty", c({ ref_for: !0 }, o))
               ]),
               key: "1"
+            } : void 0,
+            a.icon ? {
+              name: "icon",
+              fn: i((o) => [
+                r(t.$slots, "icon", c({ ref_for: !0 }, o))
+              ]),
+              key: "2"
             } : void 0
           ]), 1032, ["isDraggable", "isDroppable", "isExpanded", "isSelected", "item", "layout", "options"]))), 128))
         ]),
-        default: t(() => [
-          H(L(e.item.title) + " ", 1)
+        default: i(() => [
+          L(O(e.item.title) + " ", 1)
         ]),
         _: 3
-      }, 16)) : o(J)(e.layout, e.item, l.empty !== void 0) ? (a(), m(o(z), u({
+      }, 16)) : n(J)(e.layout, e.item, a.empty !== void 0) ? (l(), d(n(z), c({
         key: 1,
         active: e.isSelected(e.item.id),
         class: "relative",
         controlled: "",
         open: e.isExpanded(e.item.id)
-      }, o(h), D(o(k)), {
-        onClick: r[2] || (r[2] = () => y("selectItem", e.item.id))
-      }), g({
-        items: t(() => [
-          (a(!0), b(I, null, x(o($)(e.layout, e.item.children ?? []), (d) => (a(), m(T, {
-            key: d.id,
+      }, n(h), v(n(k)), {
+        onClick: m[2] || (m[2] = () => y("selectItem", e.item.id))
+      }), b({
+        items: i(() => [
+          (l(!0), f(I, null, $(n(x)(e.layout, e.item.children ?? []), (u) => (l(), d(T, {
+            key: u.id,
             isDraggable: e.isDraggable,
             isDroppable: e.isDroppable,
             isExpanded: e.isExpanded,
             isSelected: e.isSelected,
-            item: d,
+            item: u,
             layout: e.layout,
             options: e.options,
             parentIds: [],
             onOnDragEnd: S,
-            onSelectItem: r[1] || (r[1] = (n) => y("selectItem", n))
-          }, g({ _: 2 }, [
-            l.decorator ? {
+            onSelectItem: m[1] || (m[1] = (o) => y("selectItem", o))
+          }, b({ _: 2 }, [
+            a.decorator ? {
               name: "decorator",
-              fn: t((n) => [
-                c(i.$slots, "decorator", u({ ref_for: !0 }, n))
+              fn: i((o) => [
+                r(t.$slots, "decorator", c({ ref_for: !0 }, o))
               ]),
               key: "0"
             } : void 0,
-            l.empty ? {
+            a.empty ? {
               name: "empty",
-              fn: t((n) => [
-                c(i.$slots, "empty", u({ ref_for: !0 }, n))
+              fn: i((o) => [
+                r(t.$slots, "empty", c({ ref_for: !0 }, o))
               ]),
               key: "1"
+            } : void 0,
+            a.icon ? {
+              name: "icon",
+              fn: i((o) => [
+                r(t.$slots, "icon", c({ ref_for: !0 }, o))
+              ]),
+              key: "2"
             } : void 0
           ]), 1032, ["isDraggable", "isDroppable", "isExpanded", "isSelected", "item", "layout", "options"]))), 128)),
-          l.empty && (e.item.children?.length ?? 0) === 0 ? c(i.$slots, "empty", {
+          a.empty && (e.item.children?.length ?? 0) === 0 ? r(t.$slots, "empty", {
             key: 0,
             item: e.item
-          }) : v("", !0)
+          }) : D("", !0)
         ]),
-        default: t(() => [
-          E(e.item) ? (a(), b("span", M, [
-            s(f, {
+        default: i(() => [
+          E(e.item) ? (l(), f("span", M, [
+            s(g, {
               item: e.item,
               operationTitleSource: e.options?.operationTitleSource
             }, null, 8, ["item", "operationTitleSource"])
-          ])) : (a(), m(f, {
+          ])) : (l(), d(g, {
             key: 1,
             item: e.item,
             operationTitleSource: e.options?.operationTitleSource
@@ -130,62 +144,67 @@ const M = {
       }, [
         e.item.type === "document" ? {
           name: "icon",
-          fn: t(({ open: d }) => [
-            s(o(j), {
-              class: "text-c-3 block group-hover/group-button:hidden",
-              src: e.item.icon ?? "interface-content-folder"
-            }, null, 8, ["src"]),
-            s(o(A), {
-              class: "text-c-3 hidden group-hover/group-button:flex",
-              open: d
-            }, null, 8, ["open"])
+          fn: i(({ open: u }) => [
+            r(t.$slots, "icon", {
+              item: e.item,
+              open: u
+            }, () => [
+              s(n(j), {
+                class: "text-c-3 block group-hover/group-button:hidden",
+                src: "icon" in e.item && e.item.icon || "interface-content-folder"
+              }, null, 8, ["src"]),
+              s(n(A), {
+                class: "text-c-3 hidden group-hover/group-button:flex",
+                open: u
+              }, null, 8, ["open"])
+            ])
           ]),
           key: "0"
         } : void 0,
         "method" in e.item ? {
           name: "aside",
-          fn: t(() => [
-            "method" in e.item ? (a(), m(p, {
+          fn: i(() => [
+            "method" in e.item ? (l(), d(F, {
               key: 0,
               active: e.isSelected(e.item.id),
               class: w(["ml-2 h-4 self-start", {
                 // Hide the badge when we're showing the decorator
-                "group-hover/button:opacity-0 group-focus-visible/button:opacity-0 group-has-[~*_[aria-expanded=true]]/button:opacity-0 group-has-[~*:focus-within]/button:opacity-0 group-has-[~*:hover]/button:opacity-0": l.decorator
+                "group-hover/button:opacity-0 group-focus-visible/button:opacity-0 group-has-[~*_[aria-expanded=true]]/button:opacity-0 group-has-[~*:focus-within]/button:opacity-0 group-has-[~*:hover]/button:opacity-0": a.decorator
               }]),
               method: e.item.method,
               webhook: e.item.type === "webhook"
-            }, null, 8, ["active", "class", "method", "webhook"])) : v("", !0)
+            }, null, 8, ["active", "class", "method", "webhook"])) : D("", !0)
           ]),
           key: "1"
         } : void 0,
-        l.decorator ? {
+        a.decorator ? {
           name: "after",
-          fn: t(() => [
+          fn: i(() => [
             s(C, null, {
-              default: t(() => [
-                c(i.$slots, "decorator", { item: e.item })
+              default: i(() => [
+                r(t.$slots, "decorator", { item: e.item })
               ]),
               _: 3
             })
           ]),
           key: "2"
         } : void 0
-      ]), 1040, ["active", "open"])) : (a(), m(o(P), u({
+      ]), 1040, ["active", "open"])) : (l(), d(n(P), c({
         key: 2,
         is: "button"
-      }, o(h), {
+      }, n(h), {
         class: "relative",
         selected: e.isSelected(e.item.id)
-      }, D(o(k)), {
-        onClick: r[3] || (r[3] = () => y("selectItem", e.item.id))
-      }), g({
-        default: t(() => [
-          E(e.item) ? (a(), b("span", Q, [
-            s(f, {
+      }, v(n(k)), {
+        onClick: m[3] || (m[3] = () => y("selectItem", e.item.id))
+      }), b({
+        default: i(() => [
+          E(e.item) ? (l(), f("span", Q, [
+            s(g, {
               item: e.item,
               operationTitleSource: e.options?.operationTitleSource
             }, null, 8, ["item", "operationTitleSource"])
-          ])) : (a(), m(f, {
+          ])) : (l(), d(g, {
             key: 1,
             item: e.item,
             operationTitleSource: e.options?.operationTitleSource
@@ -193,33 +212,43 @@ const M = {
         ]),
         _: 2
       }, [
+        a.icon ? {
+          name: "icon",
+          fn: i(() => [
+            r(t.$slots, "icon", {
+              item: e.item,
+              open: !0
+            })
+          ]),
+          key: "0"
+        } : void 0,
         "method" in e.item ? {
           name: "aside",
-          fn: t(() => [
-            "method" in e.item ? (a(), m(p, {
+          fn: i(() => [
+            "method" in e.item ? (l(), d(F, {
               key: 0,
               active: e.isSelected(e.item.id),
               class: w(["ml-2 h-4 self-start", {
                 // Hide the badge when we're showing the decorator
-                "group-hover/button:opacity-0 group-focus-visible/button:opacity-0 group-has-[~*_[aria-expanded=true]]/button:opacity-0 group-has-[~*:focus-within]/button:opacity-0 group-has-[~*:hover]/button:opacity-0": l.decorator
+                "group-hover/button:opacity-0 group-focus-visible/button:opacity-0 group-has-[~*_[aria-expanded=true]]/button:opacity-0 group-has-[~*:focus-within]/button:opacity-0 group-has-[~*:hover]/button:opacity-0": a.decorator
               }]),
               method: e.item.method,
               webhook: e.item.type === "webhook"
-            }, null, 8, ["active", "class", "method", "webhook"])) : v("", !0)
+            }, null, 8, ["active", "class", "method", "webhook"])) : D("", !0)
           ]),
-          key: "0"
+          key: "1"
         } : void 0,
-        l.decorator ? {
+        a.decorator ? {
           name: "after",
-          fn: t(() => [
+          fn: i(() => [
             s(C, null, {
-              default: t(() => [
-                c(i.$slots, "decorator", { item: e.item })
+              default: i(() => [
+                r(t.$slots, "decorator", { item: e.item })
               ]),
               _: 3
             })
           ]),
-          key: "1"
+          key: "2"
         } : void 0
       ]), 1040, ["selected"]));
     };

package/package.json

@@ -10,7 +10,7 @@
     "url": "git+https://github.com/scalar/scalar.git",
     "directory": "packages/sidebar"
   },
-  "version": "0.7.16",
+  "version": "0.7.18",
   "engines": {
     "node": ">=20"
   },
@@ -31,12 +31,12 @@
   ],
   "dependencies": {
     "vue": "^3.5.26",
-    "@scalar/components": "0.16.26",
+    "@scalar/components": "0.16.28",
     "@scalar/helpers": "0.2.8",
     "@scalar/themes": "0.13.26",
-    "@scalar/use-hooks": "0.3.6",
     "@scalar/icons": "0.5.2",
-    "@scalar/workspace-store": "0.25.2"
+    "@scalar/use-hooks": "0.3.6",
+    "@scalar/workspace-store": "0.26.0"
   },
   "devDependencies": {
     "@tailwindcss/vite": "^4.1.18",