@scalar/components 0.15.0 → 0.16.0

package/dist/components/ScalarButton/ScalarButton.vue.js

@@ -1,7 +1,7 @@
 import { defineComponent as g, createBlock as r, openBlock as i, resolveDynamicComponent as l, mergeProps as p, unref as a, withCtx as v, createElementBlock as s, createCommentVNode as d, renderSlot as o, normalizeClass as t, createVNode as f } from "vue";
 import { cva as n, useBindCx as z } from "@scalar/use-hooks/useBindCx";
-import { BUTTON_VARIANT_STYLES as h } from "./constants.js";
-import y from "../ScalarLoading/ScalarLoading.vue.js";
+import { BUTTON_VARIANT_STYLES as y } from "./constants.js";
+import h from "../ScalarLoading/ScalarLoading.vue.js";
 const k = {
   key: 3,
   class: "centered"
@@ -14,7 +14,7 @@ const k = {
     variant: { default: "solid" },
     size: { default: "md" },
     disabled: { type: Boolean },
-    icon: {},
+    icon: { type: [Object, Function] },
     loading: {}
   },
   setup(S) {
@@ -27,7 +27,7 @@ const k = {
           sm: "px-3.5 py-2 text-sm leading-5",
           md: "px-5 py-3 text-sm leading-5"
         },
-        variant: h
+        variant: y
       },
       compoundVariants: [
         {
@@ -84,7 +84,7 @@ const k = {
           o(e.$slots, "default")
         ], 2)) : o(e.$slots, "default", { key: 2 }),
         e.loading?.isLoading ? (i(), s("div", k, [
-          f(a(y), {
+          f(a(h), {
             class: t(a(b)({ size: e.size })),
             loadingState: e.loading
           }, null, 8, ["class", "loadingState"])

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

@@ -1 +1 @@
-{"version":3,"file":"ScalarCard.vue.d.ts","sourceRoot":"","sources":["../../../src/components/ScalarCard/ScalarCard.vue"],"names":[],"mappings":"AAkEA;;;;;;;;;;;;;GAaG;;IAGD,yCAAyC;YACjC,MAAM;;IADd,yCAAyC;YACjC,MAAM;;cA4CF,CAAC,KAAK,IAAgB,KAAK,GAAG;;AA/C5C,wBA6EC;AAOD,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
+{"version":3,"file":"ScalarCard.vue.d.ts","sourceRoot":"","sources":["../../../src/components/ScalarCard/ScalarCard.vue"],"names":[],"mappings":"AAmEA;;;;;;;;;;;;;GAaG;;IAGD,yCAAyC;YACjC,MAAM;;IADd,yCAAyC;YACjC,MAAM;;cA6CF,CAAC,KAAK,IAAgB,KAAK,GAAG;;AAhD5C,wBA8EC;AAOD,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}

package/dist/components/ScalarCard/ScalarCard.vue.js

@@ -1,25 +1,25 @@
-import { defineComponent as o, computed as n, createElementBlock as i, openBlock as d, normalizeProps as s, guardReactiveProps as u, unref as c, renderSlot as f } from "vue";
-import { useBindCx as m } from "@scalar/use-hooks/useBindCx";
-import { useCardRegion as b } from "./useCardHeading.js";
-const p = {}, h = /* @__PURE__ */ o({
-  ...p,
+import { defineComponent as o, computed as n, createElementBlock as d, openBlock as i, mergeProps as u, unref as s, renderSlot as c } from "vue";
+import { useBindCx as f } from "@scalar/use-hooks/useBindCx";
+import { useCardRegion as m } from "./useCardHeading.js";
+const b = {}, x = /* @__PURE__ */ o({
+  ...b,
   inheritAttrs: !1,
   __name: "ScalarCard",
   props: {
     label: {}
   },
   setup(e) {
-    const { id: r } = b(), t = n(() => e.label ? { "aria-label": e.label } : r.value ? { "aria-labelledby": r.value } : {}), { cx: a } = m();
-    return (l, _) => (d(), i("section", s(u({
+    const { id: r } = m(), t = n(() => e.label ? { "aria-label": e.label } : r.value ? { "aria-labelledby": r.value } : {}), { cx: l } = f();
+    return (a, p) => (i(), d("div", u({ role: "group" }, {
       ...t.value,
-      ...c(a)(
+      ...s(l)(
         "scalar-card bg-b-2 flex flex-col divide-y rounded-lg border *:first:rounded-t-[inherit] *:last:rounded-b-[inherit]"
       )
-    })), [
-      f(l.$slots, "default")
+    }), [
+      c(a.$slots, "default")
     ], 16));
   }
 });
 export {
-  h as default
+  x as default
 };

package/dist/components/ScalarCheckboxInput/ScalarCheckboxInput.vue.js

@@ -1,23 +1,23 @@
-import { defineComponent as u, mergeModels as c, useModel as m, createBlock as p, openBlock as f, unref as o, mergeProps as s, withCtx as _, createVNode as y, createElementVNode as r, withDirectives as h, renderSlot as v, vModelDynamic as x } from "vue";
+import { defineComponent as u, mergeModels as m, useModel as p, createBlock as c, openBlock as f, unref as o, mergeProps as s, withCtx as _, createVNode as y, createElementVNode as r, withDirectives as h, renderSlot as v, vModelDynamic as x } from "vue";
 import { useBindCx as V } from "@scalar/use-hooks/useBindCx";
 import b from "./ScalarCheckbox.vue.js";
-import k from "../ScalarForm/ScalarFormInput.vue.js";
-const C = { class: "flex-1 text-left min-w-0 truncate" }, g = ["type"], B = {}, D = /* @__PURE__ */ u({
+import g from "../ScalarForm/ScalarFormInput.vue.js";
+const k = { class: "flex-1 text-left min-w-0 truncate" }, C = ["type"], B = {}, D = /* @__PURE__ */ u({
   ...B,
   inheritAttrs: !1,
   __name: "ScalarCheckboxInput",
-  props: /* @__PURE__ */ c({
+  props: /* @__PURE__ */ m({
     type: { default: "checkbox" }
   }, {
     modelValue: { type: Boolean },
     modelModifiers: {}
   }),
   emits: ["update:modelValue"],
-  setup(a) {
-    const e = m(a, "modelValue"), { classCx: n, otherAttrs: d } = V();
-    return (t, l) => (f(), p(o(k), s(
+  setup(n) {
+    const e = p(n, "modelValue"), { stylingAttrsCx: a, otherAttrs: i } = V();
+    return (t, l) => (f(), c(o(g), s(
       { is: "label" },
-      o(n)("cursor-pointer gap-2 hover:bg-b-2", { "text-c-1": e.value })
+      o(a)("cursor-pointer gap-2 hover:bg-b-2", { "text-c-1": e.value })
     ), {
       default: _(() => [
         y(b, {
@@ -25,14 +25,14 @@ const C = { class: "flex-1 text-left min-w-0 truncate" }, g = ["type"], B = {},
           type: t.type,
           class: "shrink-0"
         }, null, 8, ["selected", "type"]),
-        r("div", C, [
+        r("div", k, [
           v(t.$slots, "default")
         ]),
         h(r("input", s({
           type: t.type,
-          "onUpdate:modelValue": l[0] || (l[0] = (i) => e.value = i),
+          "onUpdate:modelValue": l[0] || (l[0] = (d) => e.value = d),
           class: "sr-only"
-        }, o(d)), null, 16, g), [
+        }, o(i)), null, 16, C), [
           [x, e.value]
         ])
       ]),

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

@@ -1,17 +1,31 @@
-/**
- * Uses highlight.js for syntax highlighting
- */
-type __VLS_Props = {
-    content: string | object;
+type BaseProps = {
+    content?: string | object;
+    prettyPrintedContent?: string;
     lang?: string;
     lineNumbers?: boolean;
     hideCredentials?: string | string[];
     copy?: boolean;
 };
-declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
-    lang: string;
-    lineNumbers: boolean;
-    copy: boolean;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: import("vue").DefineComponent<(BaseProps & {
+    /** Raw unformatted object or string content */
+    content: string | object;
+}) | (BaseProps & {
+    /**
+     * Pre-pretty printed content string for better performance
+     *
+     * Avoids unnecessary costly re-serialization of large content
+     */
+    prettyPrintedContent: string;
+}), {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<(BaseProps & {
+    /** Raw unformatted object or string content */
+    content: string | object;
+}) | (BaseProps & {
+    /**
+     * Pre-pretty printed content string for better performance
+     *
+     * Avoids unnecessary costly re-serialization of large content
+     */
+    prettyPrintedContent: string;
+})> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 export default _default;
 //# sourceMappingURL=ScalarCodeBlock.vue.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"ScalarCodeBlock.vue.d.ts","sourceRoot":"","sources":["../../../src/components/ScalarCodeBlock/ScalarCodeBlock.vue"],"names":[],"mappings":"AA0FA;;GAEG;AACH,KAAK,WAAW,GAAG;IACf,OAAO,EAAE,MAAM,GAAG,MAAM,CAAA;IACxB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,eAAe,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAA;IACnC,IAAI,CAAC,EAAE,OAAO,CAAA;CACf,CAAC;;UAJO,MAAM;iBACC,OAAO;UAEd,OAAO;;AAsGlB,wBAOG"}
+{"version":3,"file":"ScalarCodeBlock.vue.d.ts","sourceRoot":"","sources":["../../../src/components/ScalarCodeBlock/ScalarCodeBlock.vue"],"names":[],"mappings":"AAoHA,KAAK,SAAS,GAAG;IACf,OAAO,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACzB,oBAAoB,CAAC,EAAE,MAAM,CAAA;IAC7B,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,eAAe,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAA;IACnC,IAAI,CAAC,EAAE,OAAO,CAAA;CACf,CAAA;;IAUS,+CAA+C;aACtC,MAAM,GAAG,MAAM;;IAGxB;;;;OAIG;0BACmB,MAAM;;IAT5B,+CAA+C;aACtC,MAAM,GAAG,MAAM;;IAGxB;;;;OAIG;0BACmB,MAAM;;AAwGtC,wBAMG"}

package/dist/components/ScalarCodeBlock/ScalarCodeBlock.vue.js

@@ -1,40 +1,43 @@
-import { defineComponent as d, useId as u, computed as l, createElementBlock as m, openBlock as c, createBlock as p, createCommentVNode as f, createElementVNode as h, unref as t } from "vue";
-import { syntaxHighlight as g, standardLanguages as k } from "@scalar/code-highlight";
-import { prettyPrintJson as r } from "@scalar/oas-utils/helpers";
-import C from "./ScalarCodeBlockCopy.vue.js";
-const _ = {
+import { defineComponent as s, useId as u, computed as n, createElementBlock as d, openBlock as r, createBlock as m, createCommentVNode as p, createElementVNode as f, unref as o } from "vue";
+import { syntaxHighlight as h, standardLanguages as C } from "@scalar/code-highlight";
+import { prettyPrintJson as g } from "@scalar/oas-utils/helpers";
+import y from "./ScalarCodeBlockCopy.vue.js";
+const k = {
   class: "scalar-code-block group/code-block custom-scroll min-h-12 focus-visible:outline",
   tabindex: "0"
-}, b = ["id", "innerHTML"], H = /* @__PURE__ */ d({
+}, v = ["id", "innerHTML"], L = /* @__PURE__ */ s({
   __name: "ScalarCodeBlock",
   props: {
     content: {},
+    prettyPrintedContent: {},
     lang: { default: "plaintext" },
     lineNumbers: { type: Boolean, default: !1 },
     hideCredentials: {},
     copy: { type: Boolean, default: !0 }
   },
-  setup(a) {
-    const e = a, n = u(), s = l(() => g(r(e.content), {
+  setup(e) {
+    const l = u(), t = n(
+      () => e.prettyPrintedContent || g(e.content ?? "")
+    ), c = n(() => h(t.value, {
       lang: e.lang.trim(),
-      languages: k,
+      languages: C,
       lineNumbers: e.lineNumbers,
       maskCredentials: e.hideCredentials
-    }).slice(5, -6)), i = l(() => e.content !== null && e.content !== "null" && e.content !== "404 Not Found");
-    return (o, y) => (c(), m("div", _, [
-      o.copy && i.value ? (c(), p(t(C), {
+    }).slice(5, -6)), i = n(() => t.value !== null && t.value !== "null" && t.value !== "404 Not Found");
+    return (a, b) => (r(), d("div", k, [
+      a.copy && i.value ? (r(), m(o(y), {
         key: 0,
-        content: t(r)(e.content),
-        controls: t(n)
-      }, null, 8, ["content", "controls"])) : f("", !0),
-      h("pre", {
-        id: t(n),
+        content: t.value,
+        controls: o(l)
+      }, null, 8, ["content", "controls"])) : p("", !0),
+      f("pre", {
+        id: o(l),
         class: "scalar-codeblock-pre",
-        innerHTML: s.value
-      }, null, 8, b)
+        innerHTML: c.value
+      }, null, 8, v)
     ]));
   }
 });
 export {
-  H as default
+  L as default
 };

package/dist/components/ScalarColorModeToggle/ScalarColorModeToggleIcon.vue2.js

@@ -1,6 +1,6 @@
 import { defineComponent as a, computed as r, createBlock as i, openBlock as c, resolveDynamicComponent as u, mergeProps as m, unref as p, withCtx as g, createElementVNode as e } from "vue";
 import { useBindCx as d } from "@scalar/use-hooks/useBindCx";
-const f = {}, b = /* @__PURE__ */ a({
+const f = {}, _ = /* @__PURE__ */ a({
   ...f,
   inheritAttrs: !1,
   __name: "ScalarColorModeToggleIcon",
@@ -17,7 +17,7 @@ const f = {}, b = /* @__PURE__ */ a({
       class: `toggle-icon-${o.mode}`,
       type: o.is === "button" ? "button" : void 0
     }, p(n)("size-3 flex items-center justify-center text-c-1")), {
-      default: g(() => t[0] || (t[0] = [
+      default: g(() => [...t[0] || (t[0] = [
         e("span", { class: "toggle-icon-sun-ray" }, null, -1),
         e("span", { class: "toggle-icon-sun-ray" }, null, -1),
         e("span", { class: "toggle-icon-sun-ray" }, null, -1),
@@ -25,12 +25,11 @@ const f = {}, b = /* @__PURE__ */ a({
         e("span", { class: "toggle-icon-ellipse" }, [
           e("span", { class: "toggle-icon-moon-mask" })
         ], -1)
-      ])),
-      _: 1,
-      __: [0]
+      ])]),
+      _: 1
     }, 16, ["aria-label", "class", "type"]));
   }
 });
 export {
-  b as default
+  _ as default
 };

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

@@ -1,9 +1,9 @@
 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 s, 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 { ScalarIconMagnifyingGlass as le, ScalarIconPlus as oe } from "@scalar/icons";
 import P from "./ScalarComboboxOption.vue.js";
-import ne from "./ScalarComboboxOptionGroup.vue.js";
+import ie from "./ScalarComboboxOptionGroup.vue.js";
 import { isGroups as U } from "./types.js";
-import ie from "../ScalarListbox/ScalarListboxCheckbox.vue.js";
+import ne from "../ScalarListbox/ScalarListboxCheckbox.vue.js";
 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",
@@ -17,7 +17,7 @@ const ae = { class: "relative flex" }, se = ["aria-activedescendant", "placehold
   }),
   emits: /* @__PURE__ */ O(["add"], ["update:modelValue"]),
   setup(B, { emit: j }) {
-    const d = B, i = X(B, "modelValue"), H = j, g = Y(), $ = `scalar-combobox-items-${z()}`, f = { id: `${z()}-add`, label: "Add a new option" };
+    const d = B, H = j, n = X(B, "modelValue"), g = Y(), $ = `scalar-combobox-items-${z()}`, f = { id: `${z()}-add`, label: "Add a new option" };
     function p(t) {
       return `${$}-${t.id}`;
     }
@@ -32,10 +32,10 @@ const ae = { class: "relative flex" }, se = ["aria-activedescendant", "placehold
         [{ label: "", options: d.options }]
       )
       // G is OptionGroup<O>
-    ), u = M(""), l = M(i.value?.[0] ?? r.value[0]);
-    D(async () => {
-      u.value = "", l.value = i.value?.[0] ?? r.value[0], i.value[0] && setTimeout(() => {
-        const e = i.value[0];
+    ), u = M(""), l = M(n.value?.[0] ?? r.value[0]);
+    D(() => {
+      u.value = "", l.value = n.value?.[0] ?? r.value[0], n.value[0] && setTimeout(() => {
+        const e = n.value[0];
         e && document?.getElementById(p(e))?.scrollIntoView({ block: "nearest" });
       }, 10);
     }), Z(
@@ -53,14 +53,14 @@ const ae = { class: "relative flex" }, se = ["aria-activedescendant", "placehold
           T();
           return;
         }
-        d.multiselect ? i.value.some((e) => e.id === t.id) ? i.value = i.value.filter((e) => e.id !== t.id) : i.value = [
-          ...i.value,
+        d.multiselect ? n.value.some((e) => e.id === t.id) ? n.value = n.value.filter((e) => e.id !== t.id) : n.value = [
+          ...n.value,
           r.value.find((e) => e.id === t.id)
-        ] : i.value = [r.value.find((e) => e.id === t.id)];
+        ] : n.value = [r.value.find((e) => e.id === t.id)];
       }
     }
     function E(t) {
-      const e = N.value, v = e.findIndex((n) => n.id === l.value?.id) + t;
+      const e = N.value, v = e.findIndex((i) => i.id === l.value?.id) + t;
       v < 0 || v > e.length - 1 || (l.value = e[v], l.value && document?.getElementById(p(l.value))?.scrollIntoView({
         behavior: "smooth",
         block: "nearest"
@@ -74,9 +74,9 @@ const ae = { class: "relative flex" }, se = ["aria-activedescendant", "placehold
       k("div", ae, [
         I(h(le), { class: "pointer-events-none absolute left-2.5 top-1/2 -translate-y-1/2 text-c-3 size-4" }),
         G(k("input", {
-          "onUpdate:modelValue": e[0] || (e[0] = (o) => u.value = o),
           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-autocomplete": "list",
           "aria-controls": $,
@@ -102,12 +102,12 @@ const ae = { class: "relative flex" }, se = ["aria-activedescendant", "placehold
         role: "listbox",
         tabindex: "-1"
       }, [
-        (s(!0), c(m, null, q(J.value, (o, v) => (s(), C(ne, {
+        (s(!0), c(m, null, q(J.value, (o, v) => (s(), C(ie, {
           id: `${$}-group-${v}`,
           key: v,
           hidden: (
             // Only show the group label if there are some results
-            !o.options.some((n) => b.value.some((a) => a.id === n.id)) || // And it has a label
+            !o.options.some((i) => b.value.some((a) => a.id === i.id)) || // And it has a label
             !o.label
           )
         }, {
@@ -120,31 +120,31 @@ const ae = { class: "relative flex" }, se = ["aria-activedescendant", "placehold
             ], 64))
           ]),
           default: x(() => [
-            (s(!0), c(m, null, q(b.value, (n) => (s(), c(m, {
-              key: n.id
+            (s(!0), c(m, null, q(b.value, (i) => (s(), c(m, {
+              key: i.id
             }, [
-              o.options.some((a) => a.id === n.id) ? (s(), C(P, {
+              o.options.some((a) => a.id === i.id) ? (s(), C(P, {
                 key: 0,
-                id: p(n),
-                active: l.value?.id === n.id,
-                selected: i.value.some((a) => a.id === n.id),
-                onClick: (a) => A(n),
+                id: p(i),
+                active: l.value?.id === i.id,
+                selected: n.value.some((a) => a.id === i.id),
+                onClick: (a) => A(i),
                 onMousedown: e[4] || (e[4] = y(() => {
                 }, ["prevent"])),
-                onMouseenter: (a) => l.value = n
+                onMouseenter: (a) => l.value = i
               }, {
                 default: x(({ active: a, selected: Q }) => [
                   t.$slots.option ? S(t.$slots, "option", {
                     key: 0,
-                    option: n,
                     active: a,
+                    option: i,
                     selected: Q
                   }) : (s(), c(m, { key: 1 }, [
-                    I(h(ie), {
-                      selected: i.value.some((R) => R.id === n.id),
-                      multiselect: t.multiselect
-                    }, null, 8, ["selected", "multiselect"]),
-                    k("span", ue, F(n.label), 1)
+                    I(h(ne), {
+                      multiselect: t.multiselect,
+                      selected: n.value.some((R) => R.id === i.id)
+                    }, null, 8, ["multiselect", "selected"]),
+                    k("span", ue, F(i.label), 1)
                   ], 64))
                 ]),
                 _: 2

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

@@ -19,8 +19,8 @@ const f = {}, B = /* @__PURE__ */ a({
           default: t(() => [
             p(e.$slots, "default", {}, void 0, !0)
           ]),
-          _: 2
-        }, 1032, ["active", "disabled"])
+          _: 3
+        }, 8, ["active", "disabled"])
       ]),
       _: 3
     }, 8, ["disabled"]));

package/dist/components/ScalarFileUpload/ScalarFileUploadDropTarget.vue.js

@@ -16,7 +16,7 @@ const _ = { class: "pointer-events-none flex size-full items-center justify-cent
         d(t(m), { class: "size-4" }),
         o("span", x, [
           p(s.$slots, "default", {}, () => [
-            e[0] || (e[0] = u("Drop to upload"))
+            e[0] || (e[0] = u("Drop to upload", -1))
           ])
         ])
       ])

package/dist/components/ScalarFileUpload/ScalarFileUploadFileList.vue.js

@@ -31,22 +31,20 @@ const B = { class: "border rounded p-1 text-xs" }, $ = { class: "flex items-cent
           size: "xs",
           onClick: e[0] || (e[0] = (s) => c.$emit("upload"))
         }, {
-          default: a(() => e[2] || (e[2] = [
-            m(" Upload ")
-          ])),
-          _: 1,
-          __: [2]
+          default: a(() => [...e[2] || (e[2] = [
+            m(" Upload ", -1)
+          ])]),
+          _: 1
         }),
         d(l(u), {
           size: "xs",
           variant: "outlined",
           onClick: e[1] || (e[1] = (s) => r.value = [])
         }, {
-          default: a(() => e[3] || (e[3] = [
-            m(" Clear ")
-          ])),
-          _: 1,
-          __: [3]
+          default: a(() => [...e[3] || (e[3] = [
+            m(" Clear ", -1)
+          ])]),
+          _: 1
         })
       ])
     ], 16));

package/dist/components/ScalarFileUpload/ScalarFileUploadInput.vue.js

@@ -29,11 +29,10 @@ const v = { class: "flex items-center gap-1.5 whitespace-nowrap" }, B = { class:
           variant: "outlined",
           onClick: e[0] || (e[0] = (d) => t.$emit("click", d))
         }, {
-          default: x(() => e[2] || (e[2] = [
-            o(" Browse files ")
-          ])),
-          _: 1,
-          __: [2]
+          default: x(() => [...e[2] || (e[2] = [
+            o(" Browse files ", -1)
+          ])]),
+          _: 1
         })
       ]),
       r(t.$slots, "sublabel", {}, () => [

package/dist/components/ScalarIcon/ScalarIconLegacyAdapter.vue.js

@@ -2,12 +2,12 @@ import { defineComponent as a, createBlock as o, openBlock as n, mergeProps as r
 import { useBindCx as l } from "@scalar/use-hooks/useBindCx";
 import p from "./ScalarIcon.vue.js";
 import { variants as c } from "./variants.js";
-const m = {}, y = /* @__PURE__ */ a({
+const m = {}, d = /* @__PURE__ */ a({
   ...m,
   inheritAttrs: !1,
   __name: "ScalarIconLegacyAdapter",
   props: {
-    icon: {},
+    icon: { type: [Object, Function] },
     label: {},
     weight: {},
     logo: {},
@@ -24,5 +24,5 @@ const m = {}, y = /* @__PURE__ */ a({
   }
 });
 export {
-  y as default
+  d as default
 };

package/dist/components/ScalarIcon/icons/Add.svg.js

@@ -5,14 +5,14 @@ const t = {
   viewBox: "0 0 24 24"
 };
 function l(d, e) {
-  return n(), o("svg", t, e[0] || (e[0] = [
+  return n(), o("svg", t, [...e[0] || (e[0] = [
     r("path", {
       stroke: "currentColor",
       "stroke-linecap": "round",
       "stroke-linejoin": "round",
       d: "M5 11.988h14M12.006 5v14"
     }, null, -1)
-  ]));
+  ])]);
 }
 const c = { render: l };
 export {

package/dist/components/ScalarIcon/icons/AddTab.svg.js

@@ -5,14 +5,14 @@ const t = {
   viewBox: "0 0 24 24"
 };
 function l(d, e) {
-  return n(), o("svg", t, e[0] || (e[0] = [
+  return n(), o("svg", t, [...e[0] || (e[0] = [
     r("path", {
       stroke: "currentColor",
       "stroke-linecap": "round",
       "stroke-linejoin": "round",
       d: "M8.143 12h7.714M12 8.143v7.714M5.571 3H18.43A2.57 2.57 0 0 1 21 5.571V18.43A2.57 2.57 0 0 1 18.429 21H5.57A2.57 2.57 0 0 1 3 18.429V5.57A2.57 2.57 0 0 1 5.571 3"
     }, null, -1)
-  ]));
+  ])]);
 }
 const c = { render: l };
 export {

package/dist/components/ScalarIcon/icons/Alert.svg.js

@@ -5,14 +5,14 @@ const n = {
   viewBox: "0 0 24 24"
 };
 function l(s, e) {
-  return r(), o("svg", n, e[0] || (e[0] = [
+  return r(), o("svg", n, [...e[0] || (e[0] = [
     t("path", {
       stroke: "currentColor",
       "stroke-linecap": "round",
       "stroke-linejoin": "round",
       d: "M12 8v4m0 4h.01M22 12c0 5.523-4.477 10-10 10S2 17.523 2 12 6.477 2 12 2s10 4.477 10 10"
     }, null, -1)
-  ]));
+  ])]);
 }
 const d = { render: l };
 export {

package/dist/components/ScalarIcon/icons/ArrowLeft.svg.js

@@ -4,7 +4,7 @@ const n = {
   viewBox: "0 0 24 24"
 };
 function l(s, e) {
-  return r(), o("svg", n, e[0] || (e[0] = [
+  return r(), o("svg", n, [...e[0] || (e[0] = [
     t("path", {
       fill: "none",
       stroke: "currentColor",
@@ -12,7 +12,7 @@ function l(s, e) {
       "stroke-linejoin": "round",
       d: "M22 12H2m9.3-9.3L2 12l9.3 9.3"
     }, null, -1)
-  ]));
+  ])]);
 }
 const d = { render: l };
 export {

package/dist/components/ScalarIcon/icons/ArrowRight.svg.js

@@ -4,7 +4,7 @@ const n = {
   viewBox: "0 0 24 24"
 };
 function l(s, e) {
-  return r(), o("svg", n, e[0] || (e[0] = [
+  return r(), o("svg", n, [...e[0] || (e[0] = [
     t("path", {
       fill: "none",
       stroke: "currentColor",
@@ -12,7 +12,7 @@ function l(s, e) {
       "stroke-linejoin": "round",
       d: "M2 12h20m-9.3 9.3L22 12l-9.3-9.3"
     }, null, -1)
-  ]));
+  ])]);
 }
 const c = { render: l };
 export {

package/dist/components/ScalarIcon/icons/Brackets.svg.js

@@ -5,14 +5,14 @@ const n = {
   viewBox: "0 0 24 24"
 };
 function l(a, e) {
-  return r(), o("svg", n, e[0] || (e[0] = [
+  return r(), o("svg", n, [...e[0] || (e[0] = [
     t("path", {
       stroke: "currentColor",
       "stroke-linecap": "round",
       "stroke-linejoin": "round",
       d: "M8 3H7a2 2 0 0 0-2 2v5a2 2 0 0 1-2 2 2 2 0 0 1 2 2v5c0 1.1.9 2 2 2h1m8 0h1a2 2 0 0 0 2-2v-5c0-1.1.9-2 2-2a2 2 0 0 1-2-2V5a2 2 0 0 0-2-2h-1"
     }, null, -1)
-  ]));
+  ])]);
 }
 const s = { render: l };
 export {

package/dist/components/ScalarIcon/icons/Branch.svg.js

@@ -8,7 +8,7 @@ const o = {
   viewBox: "0 0 24 24"
 };
 function c(t, r) {
-  return l(), n("svg", o, r[0] || (r[0] = [
+  return l(), n("svg", o, [...r[0] || (r[0] = [
     e("path", { d: "M16.4 6.8v5.6H7.6m0-5.6v10.4" }, null, -1),
     e("circle", {
       cx: "7.6",
@@ -25,7 +25,7 @@ function c(t, r) {
       cy: "4.4",
       r: "2.4"
     }, null, -1)
-  ]));
+  ])]);
 }
 const s = { render: c };
 export {

package/dist/components/ScalarIcon/icons/Changelog.svg.js

@@ -8,11 +8,11 @@ const r = {
   viewBox: "0 0 24 24"
 };
 function l(a, n) {
-  return t(), o("svg", r, n[0] || (n[0] = [
+  return t(), o("svg", r, [...n[0] || (n[0] = [
     e("path", { d: "M12 22.125V4.712S9.545 1.985 1.268 1.875a.5.5 0 0 0-.366.15.52.52 0 0 0-.152.369v16.375a.515.515 0 0 0 .5.519C9.543 19.4 12 22.125 12 22.125" }, null, -1),
     e("path", { d: "M9 11.18a21.3 21.3 0 0 0-5.26-1.055M9 15.375a21.3 21.3 0 0 0-5.26-1.055M15 11.18a21.3 21.3 0 0 1 5.26-1.055M15 15.375a21.3 21.3 0 0 1 5.26-1.055" }, null, -1),
     e("path", { d: "M12 22.125V4.712s2.455-2.727 10.732-2.837a.5.5 0 0 1 .366.15.52.52 0 0 1 .152.369v16.375a.515.515 0 0 1-.5.519C14.457 19.4 12 22.125 12 22.125" }, null, -1)
-  ]));
+  ])]);
 }
 const d = { render: l };
 export {