@scalar/components 0.11.6 → 0.12.1

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

@@ -1,17 +1,17 @@
 import { defineComponent as a, openBlock as p, createBlock as i, unref as o, withCtx as t, createVNode as l, mergeProps as m, renderSlot as s, createElementVNode as f } from "vue";
 import { Menu as u, MenuItems as d, MenuButton as c } from "@headlessui/vue";
 import _ from "../ScalarFloating/ScalarFloating.vue.js";
-const h = /* @__PURE__ */ f("div", { class: "absolute inset-0 -z-1 rounded bg-b-1 shadow-lg brightness-lifted" }, null, -1), w = /* @__PURE__ */ a({
+const g = /* @__PURE__ */ f("div", { class: "absolute inset-0 -z-1 rounded bg-b-1 shadow-lg brightness-lifted" }, null, -1), w = /* @__PURE__ */ a({
   inheritAttrs: !1,
   __name: "ScalarDropdown",
   props: {
     placement: {},
     resize: { type: Boolean },
     isOpen: { type: Boolean },
-    teleport: { type: Boolean }
+    teleport: { type: [Boolean, String] }
   },
-  setup(B) {
-    return (e, b) => (p(), i(o(u), null, {
+  setup(h) {
+    return (e, B) => (p(), i(o(u), null, {
       default: t(({ open: r }) => [
         l(o(_), {
           isOpen: r ?? e.isOpen,
@@ -26,7 +26,7 @@ const h = /* @__PURE__ */ f("div", { class: "absolute inset-0 -z-1 rounded bg-b-
             }, e.$attrs), {
               default: t(() => [
                 s(e.$slots, "items"),
-                h
+                g
               ]),
               _: 2
             }, 1040, ["style"])

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

@@ -1,20 +1,20 @@
 import { defineComponent as s, openBlock as i, createBlock as l, unref as t, withCtx as d, createElementVNode as p, normalizeClass as m, renderSlot as c } from "vue";
 import { MenuItem as b } from "@headlessui/vue";
 import { cva as u, cx as f } from "../../cva.js";
-const g = /* @__PURE__ */ s({
+const w = /* @__PURE__ */ s({
   __name: "ScalarDropdownItem",
   props: {
     disabled: { type: Boolean }
   },
   emits: ["click"],
   setup(x) {
-    const o = u({
+    const r = u({
       base: [
         // Layout
         "min-w-0 items-center gap-3 rounded px-2.5 py-1.5 text-left",
         "first-of-type:mt-0.75 last-of-type:mb-0.75",
         // Text / background style
-        "truncate bg-transparent text-xs text-c-1",
+        "truncate text-xs text-c-1",
         // Interaction
         "cursor-pointer hover:bg-b-2 hover:text-c-1"
       ],
@@ -23,12 +23,12 @@ const g = /* @__PURE__ */ s({
         active: { true: "bg-b-2 text-c-1" }
       }
     });
-    return (e, r) => (i(), l(t(b), { disabled: e.disabled }, {
+    return (e, o) => (i(), l(t(b), { disabled: e.disabled }, {
       default: d(({ active: a }) => [
         p("button", {
-          class: m(["item", t(f)("scalar-dropdown-item", t(o)({ active: a, disabled: e.disabled }))]),
+          class: m(["item", t(f)("scalar-dropdown-item", t(r)({ active: a, disabled: e.disabled }))]),
           type: "button",
-          onClick: r[0] || (r[0] = (n) => e.$emit("click", n))
+          onClick: o[0] || (o[0] = (n) => e.$emit("click", n))
         }, [
           c(e.$slots, "default")
         ], 2)
@@ -38,5 +38,5 @@ const g = /* @__PURE__ */ s({
   }
 });
 export {
-  g as default
+  w as default
 };

package/dist/components/ScalarFloating/ScalarFloating.vue.js

@@ -1,8 +1,8 @@
-import { defineComponent as w, ref as s, computed as t, openBlock as d, createElementBlock as z, Fragment as b, createElementVNode as p, normalizeClass as k, renderSlot as m, createBlock as B, Teleport as R, normalizeStyle as S, unref as f, createCommentVNode as C } from "vue";
+import { defineComponent as w, ref as d, computed as t, openBlock as p, createElementBlock as z, Fragment as S, createElementVNode as r, normalizeClass as b, renderSlot as m, createBlock as k, Teleport as B, normalizeStyle as R, unref as f, createCommentVNode as C } from "vue";
 import { getSideAxis as c } from "@floating-ui/utils";
 import { useFloating as E, autoUpdate as F, offset as _, flip as $, shift as A } from "@floating-ui/vue";
 import { useResizeWithTarget as N } from "./useResizeWithTarget.js";
-const D = /* @__PURE__ */ w({
+const O = { class: "scalar-app" }, H = /* @__PURE__ */ w({
   inheritAttrs: !1,
   __name: "ScalarFloating",
   props: {
@@ -10,21 +10,21 @@ const D = /* @__PURE__ */ w({
     resize: { type: Boolean },
     middleware: {},
     isOpen: { type: Boolean },
-    teleport: { type: Boolean }
+    teleport: { type: [Boolean, String] }
   },
   setup(u) {
-    const o = u, r = s(null), l = s(null), n = t(
+    const o = u, n = d(null), l = d(null), i = t(
       () => {
         var e, a;
         return (((a = (e = l.value) == null ? void 0 : e.children) == null ? void 0 : a[0]) || l.value) ?? void 0;
       }
-    ), i = N(n, {
+    ), s = N(i, {
       enabled: t(() => o.resize)
     }), g = t(
-      () => c(o.placement || "bottom") === "y" ? i.width.value : void 0
+      () => c(o.placement || "bottom") === "y" ? s.width.value : void 0
     ), h = t(
-      () => c(o.placement || "bottom") === "x" ? i.height.value : void 0
-    ), { floatingStyles: v, middlewareData: y } = E(n, r, {
+      () => c(o.placement || "bottom") === "x" ? s.height.value : void 0
+    ), { floatingStyles: v, middlewareData: y } = E(i, n, {
       placement: t(() => o.placement),
       whileElementsMounted: F,
       middleware: t(() => [
@@ -34,35 +34,37 @@ const D = /* @__PURE__ */ w({
         ...o.middleware ?? []
       ])
     });
-    return (e, a) => (d(), z(b, null, [
-      p("div", {
+    return (e, a) => (p(), z(S, null, [
+      r("div", {
         ref_key: "wrapperRef",
         ref: l,
-        class: k({ contents: !!e.$slots.default })
+        class: b({ contents: !!e.$slots.default })
       }, [
         m(e.$slots, "default")
       ], 2),
-      e.isOpen ? (d(), B(R, {
+      e.isOpen ? (p(), k(B, {
         key: 0,
         disabled: !e.teleport,
-        to: "body"
+        to: typeof e.teleport == "string" ? e.teleport : "body"
       }, [
-        p("div", {
-          ref_key: "floatingRef",
-          ref: r,
-          class: "relative z-overlay",
-          style: S(f(v))
-        }, [
-          m(e.$slots, "floating", {
-            data: f(y),
-            height: h.value,
-            width: g.value
-          })
-        ], 4)
-      ], 8, ["disabled"])) : C("", !0)
+        r("div", O, [
+          r("div", {
+            ref_key: "floatingRef",
+            ref: n,
+            class: "relative z-overlay",
+            style: R(f(v))
+          }, [
+            m(e.$slots, "floating", {
+              data: f(y),
+              height: h.value,
+              width: g.value
+            })
+          ], 4)
+        ])
+      ], 8, ["disabled", "to"])) : C("", !0)
     ], 64));
   }
 });
 export {
-  D as default
+  H as default
 };

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

@@ -1,14 +1,14 @@
-import { defineComponent as u, ref as a, watch as m, openBlock as n, createElementBlock as z, normalizeClass as r, unref as o, createBlock as p, resolveDynamicComponent as f } from "vue";
-import { cva as k, cx as v } from "../../cva.js";
-import { getIcon as d } from "./icons/index.js";
-const B = /* @__PURE__ */ u({
+import { defineComponent as c, shallowRef as u, ref as m, watch as z, openBlock as i, createElementBlock as f, normalizeClass as n, unref as o, createBlock as p, resolveDynamicComponent as k } from "vue";
+import { cva as v, cx as d } from "../../cva.js";
+import { getIcon as x } from "./icons/index.js";
+const w = /* @__PURE__ */ c({
   __name: "ScalarIcon",
   props: {
     icon: {},
     size: {}
   },
-  setup(t) {
-    const c = t, i = k({
+  setup(r) {
+    const t = r, l = v({
       variants: {
         size: {
           xs: "size-3 stroke-[1.4]",
@@ -24,22 +24,22 @@ const B = /* @__PURE__ */ u({
       defaultVariants: {
         size: "full"
       }
-    }), l = a(null), s = a(!0);
-    return m(
-      () => c.icon,
+    }), a = u(null), s = m(!0);
+    return z(
+      () => t.icon,
       async (e) => {
-        s.value = !0, l.value = await d(e), s.value = !1;
+        s.value = !0, a.value = await x(e), s.value = !1;
       },
       { immediate: !0 }
-    ), (e, x) => s.value ? (n(), z("div", {
+    ), (e, y) => s.value ? (i(), f("div", {
       key: 0,
-      class: r(o(i)({ size: e.size ? e.size : "xs" }))
-    }, null, 2)) : (n(), p(f(l.value), {
+      class: n(o(l)({ size: e.size ? e.size : "xs" }))
+    }, null, 2)) : (i(), p(k(a.value), {
       key: 1,
-      class: r(o(v)("scalar-icon", o(i)({ size: e.size })))
+      class: n(o(d)("scalar-icon", o(l)({ size: e.size })))
     }, null, 8, ["class"]));
   }
 });
 export {
-  B as default
+  w as default
 };

package/dist/components/ScalarListbox/ScalarListbox.vue.js

@@ -1,26 +1,28 @@
-import { defineComponent as b, openBlock as i, createBlock as d, unref as t, withCtx as s, createVNode as a, mergeProps as x, createElementBlock as v, Fragment as g, renderList as y, createElementVNode as o, normalizeClass as m, toDisplayString as _, renderSlot as h } from "vue";
-import { Listbox as V, ListboxOptions as k, ListboxOption as z, ListboxButton as B } from "@headlessui/vue";
+import { defineComponent as b, openBlock as i, createBlock as u, unref as t, normalizeClass as n, withCtx as l, createVNode as a, mergeProps as y, createElementBlock as g, Fragment as v, renderList as x, createElementVNode as o, toDisplayString as h, renderSlot as B } from "vue";
+import { Listbox as V, ListboxOptions as k, ListboxOption as z, ListboxButton as _ } from "@headlessui/vue";
 import { cva as w, cx as L } from "../../cva.js";
 import O from "../ScalarFloating/ScalarFloating.vue.js";
 import $ from "../ScalarIcon/ScalarIcon.vue.js";
-const C = { class: "inline-block min-w-0 flex-1 truncate text-c-1" }, S = /* @__PURE__ */ o("div", { class: "absolute inset-0 -z-1 rounded bg-b-1 shadow-md brightness-lifted" }, null, -1), P = /* @__PURE__ */ b({
+const C = { class: "inline-block min-w-0 flex-1 truncate text-c-1" }, S = /* @__PURE__ */ o("div", { class: "absolute inset-0 -z-1 rounded bg-b-1 shadow-md brightness-lifted" }, null, -1), F = /* @__PURE__ */ b({
   inheritAttrs: !1,
   __name: "ScalarListbox",
   props: {
+    multiple: { type: Boolean, default: !1 },
     options: {},
     modelValue: {},
+    fullWidth: { type: Boolean },
     placement: {},
     resize: { type: Boolean },
     isOpen: { type: Boolean },
-    teleport: { type: Boolean }
+    teleport: { type: [Boolean, String] }
   },
   emits: ["update:modelValue"],
-  setup(E) {
-    const u = w({
+  setup(j) {
+    const m = w({
       base: [
         // Layout
         "group",
-        "text-lef flex min-w-0 items-center gap-1.5 rounded px-2 py-1.5",
+        "flex min-w-0 items-center gap-1.5 rounded px-2 py-1.5 text-left",
         "first-of-type:mt-0.75 last-of-type:mb-0.75",
         // Text / background style
         "truncate bg-transparent text-c-1",
@@ -33,46 +35,47 @@ const C = { class: "inline-block min-w-0 flex-1 truncate text-c-1" }, S = /* @__
         disabled: { true: "pointer-events-none opacity-50" }
       }
     });
-    return (e, n) => (i(), d(t(V), {
+    return (e, p) => (i(), u(t(V), {
       as: "div",
-      class: "text-xs",
+      class: n([{ "w-full": e.fullWidth }, "text-xs"]),
       modelValue: e.modelValue,
-      "onUpdate:modelValue": n[0] || (n[0] = (r) => e.$emit("update:modelValue", r))
+      multiple: e.multiple,
+      "onUpdate:modelValue": p[0] || (p[0] = (r) => e.$emit("update:modelValue", r))
     }, {
-      default: s(({ open: r }) => [
+      default: l(({ open: r }) => [
         a(t(O), {
           isOpen: r ?? e.isOpen,
           placement: e.placement ?? "bottom-start",
           resize: e.resize,
           teleport: e.teleport
         }, {
-          floating: s(({ width: c }) => [
-            a(t(k), x({
-              class: "relative flex w-40 flex-col p-0.75",
-              style: { width: c }
+          floating: l(({ width: f }) => [
+            a(t(k), y({
+              class: "relative flex w-40 flex-col rounded border p-0.75",
+              style: { width: f }
             }, e.$attrs), {
-              default: s(() => [
-                (i(!0), v(g, null, y(e.options, (l) => (i(), d(t(z), {
-                  key: l.id,
+              default: l(() => [
+                (i(!0), g(v, null, x(e.options, (s) => (i(), u(t(z), {
+                  key: s.id,
                   as: "template",
-                  disabled: l.disabled,
-                  value: l
+                  disabled: s.disabled,
+                  value: s
                 }, {
-                  default: s(({ active: f, selected: p }) => [
+                  default: l(({ active: c, selected: d }) => [
                     o("li", {
-                      class: m(
-                        t(L)(t(u)({ active: f, selected: p, disabled: l.disabled }))
+                      class: n(
+                        t(L)(t(m)({ active: c, selected: d, disabled: s.disabled }))
                       )
                     }, [
                       o("div", {
-                        class: m(["flex size-4 items-center justify-center rounded-full p-[3px] group-hover:shadow-border", p ? "bg-blue text-b-1" : "text-transparent"])
+                        class: n(["flex size-4 items-center justify-center rounded-full p-[3px] group-hover:shadow-border", d ? "bg-blue text-b-1" : "text-transparent"])
                       }, [
                         a(t($), {
                           class: "relative top-[0.5px] size-2.5 stroke-[1.75]",
                           icon: "Checkmark"
                         })
                       ], 2),
-                      o("span", C, _(l.label), 1)
+                      o("span", C, h(s.label), 1)
                     ], 2)
                   ]),
                   _: 2
@@ -82,10 +85,13 @@ const C = { class: "inline-block min-w-0 flex-1 truncate text-c-1" }, S = /* @__
               _: 2
             }, 1040, ["style"])
           ]),
-          default: s(() => [
-            a(t(B), { as: "template" }, {
-              default: s(() => [
-                h(e.$slots, "default")
+          default: l(() => [
+            a(t(_), {
+              as: "template",
+              class: "justify-start"
+            }, {
+              default: l(() => [
+                B(e.$slots, "default")
               ]),
               _: 3
             })
@@ -94,9 +100,9 @@ const C = { class: "inline-block min-w-0 flex-1 truncate text-c-1" }, S = /* @__
         }, 1032, ["isOpen", "placement", "resize", "teleport"])
       ]),
       _: 3
-    }, 8, ["modelValue"]));
+    }, 8, ["class", "modelValue", "multiple"]));
   }
 });
 export {
-  P as default
+  F as default
 };

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

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

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

@@ -1,7 +1,7 @@
-import { defineComponent as c, openBlock as l, createBlock as s, unref as a, withCtx as o, createElementVNode as f, normalizeClass as t, createVNode as u, normalizeStyle as v, createTextVNode as h, toDisplayString as y, createCommentVNode as b, createElementBlock as g, renderSlot as i, reactive as x } from "vue";
+import { defineComponent as p, openBlock as l, createBlock as o, unref as a, withCtx as s, createElementVNode as f, normalizeClass as t, createVNode as u, normalizeStyle as v, createTextVNode as h, toDisplayString as y, createCommentVNode as b, createElementBlock as g, renderSlot as i, reactive as x } from "vue";
 import { Dialog as w, DialogPanel as z, DialogTitle as C, DialogDescription as k } from "@headlessui/vue";
 import { cva as d, cx as n } from "../../cva.js";
-const W = () => x({
+const j = () => x({
   open: !1,
   show() {
     this.open = !0;
@@ -9,7 +9,7 @@ const W = () => x({
   hide() {
     this.open = !1;
   }
-}), $ = /* @__PURE__ */ c({
+}), W = /* @__PURE__ */ p({
   __name: "ScalarModal",
   props: {
     state: {},
@@ -38,7 +38,7 @@ const W = () => x({
           search: "scalar-modal-search"
         }
       }
-    }), p = d({
+    }), c = d({
       base: [
         "scalar-modal-body",
         "relative max-h-[calc(100dvh-240px)] overflow-y-auto rounded-lg bg-b-1 px-6 pb-4 pt-6"
@@ -50,15 +50,15 @@ const W = () => x({
         }
       }
     });
-    return (e, r) => (l(), s(a(w), {
+    return (e, r) => (l(), o(a(w), {
       open: e.state.open,
       onClose: r[0] || (r[0] = (B) => e.state.hide())
     }, {
-      default: o(() => [
+      default: s(() => [
         f("div", {
           class: t(
             a(n)(
-              "scalar-modal-layout fixed left-0 top-0",
+              "scalar-modal-layout fixed left-0 top-0 flex items-center justify-center",
               "z-[1001] h-[100dvh] w-[100dvw]",
               "bg-backdrop opacity-0",
               e.size === "full" && "flex"
@@ -69,12 +69,12 @@ const W = () => x({
             class: t(a(m)({ size: e.size, variant: e.variant })),
             style: v({ maxWidth: e.maxWidth })
           }, {
-            default: o(() => [
-              e.title ? (l(), s(a(C), {
+            default: s(() => [
+              e.title ? (l(), o(a(C), {
                 key: 0,
                 class: t(["scalar-modal-header font-semiBold m-0 rounded-lg px-6 py-3 text-left text-xs text-c-1", { "pb-0 pt-6": e.variant === "history" }])
               }, {
-                default: o(() => [
+                default: s(() => [
                   h(y(e.title), 1)
                 ]),
                 _: 1
@@ -84,11 +84,11 @@ const W = () => x({
                 class: t(e.bodyClass)
               }, [
                 i(e.$slots, "default", {}, void 0, !0)
-              ], 2)) : (l(), s(a(k), {
+              ], 2)) : (l(), o(a(k), {
                 key: 2,
-                class: t(a(n)(e.bodyClass, a(p)({ variant: e.variant })))
+                class: t(a(n)(e.bodyClass, a(c)({ variant: e.variant })))
               }, {
-                default: o(() => [
+                default: s(() => [
                   i(e.$slots, "default", {}, void 0, !0)
                 ]),
                 _: 3
@@ -103,6 +103,6 @@ const W = () => x({
   }
 });
 export {
-  $ as default,
-  W as useModal
+  W as default,
+  j as useModal
 };

package/dist/components/ScalarPopover/ScalarPopover.vue.js

@@ -1,37 +1,37 @@
-import { defineComponent as i, openBlock as f, createBlock as d, unref as t, withCtx as o, createVNode as l, mergeProps as r, renderSlot as s, createElementVNode as u } from "vue";
+import { defineComponent as i, openBlock as f, createBlock as d, unref as o, withCtx as t, createVNode as l, mergeProps as r, renderSlot as s, createElementVNode as u } from "vue";
 import { Popover as m, PopoverPanel as c, PopoverButton as _ } from "@headlessui/vue";
 import v from "../ScalarFloating/ScalarFloating.vue.js";
-const h = /* @__PURE__ */ u("div", { class: "absolute inset-0 -z-1 rounded bg-b-1 shadow-lg brightness-lifted" }, null, -1), b = /* @__PURE__ */ i({
+const g = /* @__PURE__ */ u("div", { class: "absolute inset-0 -z-1 rounded bg-b-1 shadow-lg brightness-lifted" }, null, -1), b = /* @__PURE__ */ i({
   inheritAttrs: !1,
   __name: "ScalarPopover",
   props: {
     placement: {},
     resize: { type: Boolean },
     isOpen: { type: Boolean },
-    teleport: { type: Boolean }
+    teleport: { type: [Boolean, String] }
   },
-  setup(B) {
-    return (e, P) => (f(), d(t(m), null, {
-      default: o(({ open: p }) => [
-        l(t(v), r(e.$props, {
+  setup(h) {
+    return (e, B) => (f(), d(o(m), null, {
+      default: t(({ open: p }) => [
+        l(o(v), r(e.$props, {
           isOpen: p ?? e.isOpen,
           teleport: e.teleport
         }), {
-          floating: o(({ width: a, height: n }) => [
-            l(t(c), r({
+          floating: t(({ width: n, height: a }) => [
+            l(o(c), r({
               class: "relative flex flex-col p-0.75",
-              style: { width: a, height: n }
+              style: { width: n, height: a }
             }, e.$attrs), {
-              default: o(() => [
+              default: t(() => [
                 s(e.$slots, "popover"),
-                h
+                g
               ]),
               _: 2
             }, 1040, ["style"])
           ]),
-          default: o(() => [
-            l(t(_), { as: "template" }, {
-              default: o(() => [
+          default: t(() => [
+            l(o(_), { as: "template" }, {
+              default: t(() => [
                 s(e.$slots, "default")
               ]),
               _: 3

package/dist/components/ScalarTooltip/ScalarTooltip.vue.js

@@ -0,0 +1,57 @@
+import { defineComponent as r, openBlock as n, createBlock as c, unref as l, withCtx as t, createVNode as o, renderSlot as a, normalizeClass as d } from "vue";
+import { TooltipProvider as p, TooltipRoot as f, TooltipTrigger as u, TooltipPortal as k, TooltipContent as m } from "radix-vue";
+const T = /* @__PURE__ */ r({
+  __name: "ScalarTooltip",
+  props: {
+    click: {},
+    delay: {},
+    skipDelay: { default: 1e3 },
+    side: { default: "top" },
+    sideOffset: {},
+    class: {}
+  },
+  emits: ["click"],
+  setup(i) {
+    const e = i;
+    return (s, _) => (n(), c(l(p), {
+      delayDuration: e.delay,
+      skipDelayDuration: e.skipDelay
+    }, {
+      default: t(() => [
+        o(l(f), null, {
+          default: t(() => [
+            o(l(u), {
+              class: "w-full",
+              onClick: e.click
+            }, {
+              default: t(() => [
+                a(s.$slots, "trigger")
+              ]),
+              _: 3
+            }, 8, ["onClick"]),
+            o(l(k), null, {
+              default: t(() => [
+                o(l(m), {
+                  class: d(["scalar-app", e.class]),
+                  side: e.side,
+                  sideOffset: e.sideOffset
+                }, {
+                  default: t(() => [
+                    a(s.$slots, "content")
+                  ]),
+                  _: 3
+                }, 8, ["class", "side", "sideOffset"])
+              ]),
+              _: 3
+            })
+          ]),
+          _: 3
+        })
+      ]),
+      _: 3
+    }, 8, ["delayDuration", "skipDelayDuration"]));
+  }
+});
+export {
+  T as default
+};

package/dist/components/ScalarTooltip/ScalarTooltip.vue2.js

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

package/dist/index.d.ts

@@ -24,6 +24,8 @@ declare type __VLS_NonUndefinedable_15<T> = T extends undefined ? never : T;
 
 declare type __VLS_NonUndefinedable_16<T> = T extends undefined ? never : T;
 
+declare type __VLS_NonUndefinedable_17<T> = T extends undefined ? never : T;
+
 declare type __VLS_NonUndefinedable_2<T> = T extends undefined ? never : T;
 
 declare type __VLS_NonUndefinedable_3<T> = T extends undefined ? never : T;
@@ -68,6 +70,14 @@ declare type __VLS_Prettify_7<T> = {
     [K in keyof T]: T[K];
 } & {};
 
+declare type __VLS_Prettify_8<T> = {
+    [K in keyof T]: T[K];
+} & {};
+
+declare type __VLS_Prettify_9<T> = {
+    [K in keyof T]: T[K];
+} & {};
+
 declare type __VLS_TypePropsToRuntimeProps<T> = {
     [K in keyof T]-?: {} extends Pick<T, K> ? {
         type: PropType<__VLS_NonUndefinedable<T[K]>>;
@@ -140,6 +150,15 @@ declare type __VLS_TypePropsToRuntimeProps_16<T> = {
     };
 };
 
+declare type __VLS_TypePropsToRuntimeProps_17<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: PropType<__VLS_NonUndefinedable_17<T[K]>>;
+    } : {
+        type: PropType<T[K]>;
+        required: true;
+    };
+};
+
 declare type __VLS_TypePropsToRuntimeProps_2<T> = {
     [K in keyof T]-?: {} extends Pick<T, K> ? {
         type: PropType<__VLS_NonUndefinedable_2<T[K]>>;
@@ -254,6 +273,18 @@ declare type __VLS_WithDefaults_7<P, D> = {
     }> : P[K];
 };
 
+declare type __VLS_WithDefaults_8<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify_8<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+
+declare type __VLS_WithDefaults_9<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify_9<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+
 declare type __VLS_WithTemplateSlots<T, S> = T & {
     new (): {
         $slots: S;
@@ -272,6 +303,12 @@ declare type __VLS_WithTemplateSlots_11<T, S> = T & {
     };
 };
 
+declare type __VLS_WithTemplateSlots_12<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+
 declare type __VLS_WithTemplateSlots_2<T, S> = T & {
     new (): {
         $slots: S;
@@ -342,10 +379,11 @@ declare type FloatingOptions = {
      */
     isOpen?: boolean;
     /**
-     * Whether to teleport the floating element to the end of the document body.
+     * Whether to teleport the floating element.
+     * Can be an `id` to teleport to or `true` to teleport to the `<body>`.
      * @default false
      */
-    teleport?: boolean;
+    teleport?: boolean | string;
 };
 
 export declare type Icon = (typeof ICONS)[number];
@@ -565,17 +603,37 @@ size: "sm" | "md" | "xs" | "full" | "xxs";
 variant: string;
 }, {}>;
 
-export declare const ScalarListbox: __VLS_WithTemplateSlots_5<DefineComponent<__VLS_TypePropsToRuntimeProps_9<{
+export declare const ScalarListbox: __VLS_WithTemplateSlots_5<DefineComponent<__VLS_WithDefaults_5<__VLS_TypePropsToRuntimeProps_9<{
+/**
+* Allow selecting multiple values
+*
+* @default false
+*/
+multiple?: boolean | undefined;
 options: ScalarListboxOption[];
 modelValue?: ScalarListboxOption | undefined;
-} & Omit<FloatingOptions, "middleware" | "offset">>, {}, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
+fullWidth?: boolean | undefined;
+} & Omit<FloatingOptions, "middleware" | "offset">>, {
+multiple: boolean;
+}>, {}, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
 "update:modelValue": (v: ScalarListboxOption) => void;
-}, string, PublicProps, Readonly<ExtractPropTypes<__VLS_TypePropsToRuntimeProps_9<{
+}, string, PublicProps, Readonly<ExtractPropTypes<__VLS_WithDefaults_5<__VLS_TypePropsToRuntimeProps_9<{
+/**
+* Allow selecting multiple values
+*
+* @default false
+*/
+multiple?: boolean | undefined;
 options: ScalarListboxOption[];
 modelValue?: ScalarListboxOption | undefined;
-} & Omit<FloatingOptions, "middleware" | "offset">>>> & {
+fullWidth?: boolean | undefined;
+} & Omit<FloatingOptions, "middleware" | "offset">>, {
+multiple: boolean;
+}>>> & {
 "onUpdate:modelValue"?: ((v: ScalarListboxOption) => any) | undefined;
-}, {}, {}>, {
+}, {
+multiple: boolean;
+}, {}>, {
     default?(_: {}): any;
 }>;
 
@@ -586,12 +644,12 @@ export declare type ScalarListboxOption = {
     [x: string]: any;
 };
 
-export declare const ScalarLoading: DefineComponent<__VLS_WithDefaults_5<__VLS_TypePropsToRuntimeProps_10<{
+export declare const ScalarLoading: DefineComponent<__VLS_WithDefaults_6<__VLS_TypePropsToRuntimeProps_10<{
 loadingState: LoadingState;
 size?: string | undefined;
 }>, {
 size: string;
-}>, {}, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<__VLS_WithDefaults_5<__VLS_TypePropsToRuntimeProps_10<{
+}>, {}, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<__VLS_WithDefaults_6<__VLS_TypePropsToRuntimeProps_10<{
 loadingState: LoadingState;
 size?: string | undefined;
 }>, {
@@ -614,7 +672,7 @@ withImages: boolean;
 withImages: boolean;
 }, {}>;
 
-export declare const ScalarModal: __VLS_WithTemplateSlots_6<DefineComponent<__VLS_WithDefaults_6<__VLS_TypePropsToRuntimeProps_11<{
+export declare const ScalarModal: __VLS_WithTemplateSlots_6<DefineComponent<__VLS_WithDefaults_7<__VLS_TypePropsToRuntimeProps_11<{
 state: ReturnType<typeof useModal>;
 title?: string | undefined;
 bodyClass?: string | undefined;
@@ -623,7 +681,7 @@ size?: "sm" | "md" | "xs" | "lg" | "full" | undefined;
 variant?: "search" | "history" | undefined;
 }>, {
 size: string;
-}>, {}, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<__VLS_WithDefaults_6<__VLS_TypePropsToRuntimeProps_11<{
+}>, {}, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<__VLS_WithDefaults_7<__VLS_TypePropsToRuntimeProps_11<{
 state: ReturnType<typeof useModal>;
 title?: string | undefined;
 bodyClass?: string | undefined;
@@ -697,7 +755,7 @@ noResults?: boolean | undefined;
     default?(_: {}): any;
 }>;
 
-export declare const ScalarTextField: __VLS_WithTemplateSlots_11<DefineComponent<__VLS_WithDefaults_7<__VLS_TypePropsToRuntimeProps_16<{
+export declare const ScalarTextField: __VLS_WithTemplateSlots_11<DefineComponent<__VLS_WithDefaults_8<__VLS_TypePropsToRuntimeProps_16<{
 modelValue: string;
 placeholder?: string | undefined;
 label?: string | undefined;
@@ -718,7 +776,7 @@ disableTrim: boolean;
 }>, {}, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
 submit: (v: string) => void;
 "update:modelValue": (v: string) => void;
-}, string, PublicProps, Readonly<ExtractPropTypes<__VLS_WithDefaults_7<__VLS_TypePropsToRuntimeProps_16<{
+}, string, PublicProps, Readonly<ExtractPropTypes<__VLS_WithDefaults_8<__VLS_TypePropsToRuntimeProps_16<{
 modelValue: string;
 placeholder?: string | undefined;
 label?: string | undefined;
@@ -747,6 +805,38 @@ disableTrim: boolean;
     default?(_: {}): any;
 }>;
 
+export declare const ScalarTooltip: __VLS_WithTemplateSlots_12<DefineComponent<__VLS_WithDefaults_9<__VLS_TypePropsToRuntimeProps_17<{
+click?: (() => void) | undefined;
+delay?: number | undefined;
+skipDelay?: number | undefined;
+side?: "bottom" | "left" | "right" | "top" | undefined;
+sideOffset?: number | undefined;
+class?: string | undefined;
+}>, {
+skipDelay: number;
+side: string;
+}>, {}, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
+click: () => void;
+}, string, PublicProps, Readonly<ExtractPropTypes<__VLS_WithDefaults_9<__VLS_TypePropsToRuntimeProps_17<{
+click?: (() => void) | undefined;
+delay?: number | undefined;
+skipDelay?: number | undefined;
+side?: "bottom" | "left" | "right" | "top" | undefined;
+sideOffset?: number | undefined;
+class?: string | undefined;
+}>, {
+skipDelay: number;
+side: string;
+}>>> & {
+onClick?: (() => any) | undefined;
+}, {
+skipDelay: number;
+side: "bottom" | "left" | "right" | "top";
+}, {}>, {
+    trigger?(_: {}): any;
+    content?(_: {}): any;
+}>;
+
 /**
  * Handles isLoading spinner for the FlowLoader Component
  * - stateIsLoading will trigger the spinner

package/dist/index.js

@@ -13,12 +13,13 @@ import { default as h } from "./components/ScalarIconButton/ScalarIconButton.vue
 import { default as M } from "./components/ScalarListbox/ScalarListbox.vue.js";
 import { default as v } from "./components/ScalarLoading/ScalarLoading.vue.js";
 import { default as R } from "./components/ScalarPopover/ScalarPopover.vue.js";
-import { default as C } from "./components/ScalarSearchInput/ScalarSearchInput.vue.js";
-import { default as T } from "./components/ScalarSearchResults/ScalarSearchResultItem.vue.js";
+import { default as b } from "./components/ScalarSearchInput/ScalarSearchInput.vue.js";
+import { default as P } from "./components/ScalarSearchResults/ScalarSearchResultItem.vue.js";
 import { default as q } from "./components/ScalarSearchResults/ScalarSearchResultList.vue.js";
 import { default as z } from "./components/ScalarTextField/ScalarTextField.vue.js";
-import { useLoadingState as E } from "./components/ScalarLoading/ScalarLoading.vue2.js";
-import { useModal as H } from "./components/ScalarModal/ScalarModal.vue2.js";
+import { default as E } from "./components/ScalarTooltip/ScalarTooltip.vue.js";
+import { useLoadingState as H } from "./components/ScalarLoading/ScalarLoading.vue2.js";
+import { useModal as K } from "./components/ScalarModal/ScalarModal.vue2.js";
 export {
   f as ScalarButton,
   p as ScalarCodeBlock,
@@ -33,10 +34,11 @@ export {
   c as ScalarMarkdown,
   e as ScalarModal,
   R as ScalarPopover,
-  C as ScalarSearchInput,
-  T as ScalarSearchResultItem,
+  b as ScalarSearchInput,
+  P as ScalarSearchResultItem,
   q as ScalarSearchResultList,
   z as ScalarTextField,
-  E as useLoadingState,
-  H as useModal
+  E as ScalarTooltip,
+  H as useLoadingState,
+  K as useModal
 };

package/dist/style.css

@@ -1 +1 @@
-.scalar-modal-layout[data-v-03b82fd9]{animation:modal-fade-03b82fd9 .2s forwards}.scalar-modal[data-v-03b82fd9]{animation:modal-pop-03b82fd9 .15s .15s forwards;height:calc(100% - 120px);width:calc(100% - 8px);max-width:1390px;position:fixed;left:0;top:0;bottom:0;right:0;margin:auto}.scalar-modal.scalar-modal-search[data-v-03b82fd9]{max-width:540px;background-color:transparent}.modal-content-search .modal-body[data-v-03b82fd9]{padding:0;overflow:hidden;display:flex;flex-direction:column;max-height:440px}@media (max-width: 1280px){.scalar-modal[data-v-03b82fd9]{height:calc(100% - 56px);top:46px}}@keyframes modal-fade-03b82fd9{0%{opacity:0}to{opacity:1}}@keyframes modal-pop-03b82fd9{0%{opacity:0}to{opacity:1}}@layer scalar-base,scalar-theme;:where(.scalar-app){font-family:var(--scalar-font);line-height:1.15;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4}:where(.scalar-app) *,:where(.scalar-app) *:before,:where(.scalar-app) *:after{box-sizing:border-box;border-width:0;border-style:solid;border-color:var(--scalar-border-color);font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:unset;font-weight:inherit;line-height:inherit;color:inherit;margin:unset;padding:unset;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}:where(.scalar-app) button,:where(.scalar-app) input,:where(.scalar-app) optgroup,:where(.scalar-app) select,:where(.scalar-app) textarea,:where(.scalar-app) ::file-selector-button{background:transparent}:where(.scalar-app) input:where(:not([type=button],[type=reset],[type=submit])),:where(.scalar-app) select,:where(.scalar-app) textarea{border-radius:var(--scalar-radius);border-width:1px}:where(.scalar-app) input::placeholder,:where(.scalar-app) input:-ms-input-placeholder,:where(.scalar-app) input::-webkit-input-placeholder{color:var(--scalar-color-3);font-family:var(--scalar-font)}:where(.scalar-app) input:-webkit-autofill{-webkit-background-clip:text!important;background-clip:text!important}.scalar-app .cm-scroller,.scalar-app .custom-scroll{overflow-y:auto;scrollbar-color:transparent transparent;scrollbar-width:thin;-webkit-overflow-scrolling:touch}.scalar-app .custom-scroll-self-contain-overflow{overscroll-behavior:contain}@supports (-moz-appearance: none){.scalar-app .cm-scroller,.scalar-app .custom-scroll{padding-right:12px}}.scalar-app .cm-scroller:hover,.scalar-app .custom-scroll:hover{scrollbar-color:var(--scalar-scrollbar-color, transparent)}.scalar-app .cm-scroller:hover::-webkit-scrollbar-thumb,.scalar-app .custom-scroll:hover::-webkit-scrollbar-thumb{background:var(--scalar-scrollbar-color);background-clip:content-box;border:3px solid transparent}.scalar-app .cm-scroller::-webkit-scrollbar-thumb:active,.scalar-app .custom-scroll::-webkit-scrollbar-thumb:active{background:var(--scalar-scrollbar-color-active);background-clip:content-box;border:3px solid transparent}.scalar-app .cm-scroller::-webkit-scrollbar-corner,.scalar-app .custom-scroll::-webkit-scrollbar-corner{background:transparent}.scalar-app .cm-scroller::-webkit-scrollbar,.scalar-app .custom-scroll::-webkit-scrollbar{height:12px;width:12px}.scalar-app .cm-scroller::-webkit-scrollbar-track,.scalar-app .custom-scroll::-webkit-scrollbar-track{background:transparent}.scalar-app .cm-scroller::-webkit-scrollbar-thumb,.scalar-app .custom-scroll::-webkit-scrollbar-thumb{border-radius:20px;background:transparent;background-clip:content-box;border:3px solid transparent}@media (pointer: coarse){.scalar-app .cm-scroller,.scalar-app .custom-scroll{padding-right:12px}}@layer scalar-base{:root{--scalar-border-width: 1px;--scalar-radius: 3px;--scalar-radius-lg: 6px;--scalar-radius-xl: 8px;--scalar-font: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;--scalar-font-code: "JetBrains Mono", ui-monospace, Menlo, Monaco, "Cascadia Mono", "Segoe UI Mono", "Roboto Mono", "Oxygen Mono", "Ubuntu Monospace", "Source Code Pro", "Fira Mono", "Droid Sans Mono", "Courier New", monospace;--scalar-heading-1: 40px;--scalar-page-description: 24px;--scalar-heading-2: 24px;--scalar-heading-3: 20px;--scalar-heading-4: 16px;--scalar-heading-5: 16px;--scalar-heading-6: 16px;--scalar-paragraph: 16px;--scalar-small: 14px;--scalar-mini: 13px;--scalar-micro: 12px;--scalar-bold: 600;--scalar-semibold: 500;--scalar-regular: 400;--scalar-font-size-1: 24px;--scalar-font-size-2: 16px;--scalar-font-size-3: 14px;--scalar-font-size-4: 13px;--scalar-font-size-5: 12px;--scalar-font-size-6: 12px;--scalar-font-size-7: 10px;--scalar-line-height-1: 32px;--scalar-line-height-2: 24px;--scalar-line-height-3: 20px;--scalar-line-height-4: 18px;--scalar-line-height-5: 16px;--scalar-font-medium: 500;--scalar-font-bold: 700;--scalar-text-decoration: none;--scalar-text-decoration-hover: underline}.dark-mode{color-scheme:dark;--scalar-scrollbar-color: rgba(255, 255, 255, .18);--scalar-scrollbar-color-active: rgba(255, 255, 255, .36);--scalar-button-1: rgba(255, 255, 255, 1);--scalar-button-1-hover: rgba(255, 255, 255, .9);--scalar-button-1-color: black;--scalar-shadow-1: 0 1px 3px 0 rgb(0, 0, 0, .1);--scalar-shadow-2: rgba(15, 15, 15, .2) 0px 3px 6px, rgba(15, 15, 15, .4) 0px 9px 24px, 0 0 0 1px rgba(255, 255, 255, .1);--scalar-sidebar-indent-border: transparent;--scalar-sidebar-indent-border-hover: transparent;--scalar-sidebar-indent-border-active: transparent}.light-mode{color-scheme:light;--scalar-scrollbar-color-active: rgba(0, 0, 0, .36);--scalar-scrollbar-color: rgba(0, 0, 0, .18);--scalar-button-1: rgba(0, 0, 0, 1);--scalar-button-1-hover: rgba(0, 0, 0, .8);--scalar-button-1-color: rgba(255, 255, 255, .9);--scalar-shadow-1: 0 1px 3px 0 rgba(0, 0, 0, .11);--scalar-shadow-2: rgba(0, 0, 0, .08) 0px 13px 20px 0px, rgba(0, 0, 0, .08) 0px 3px 8px 0px, #eeeeed 0px 0 0 1px;--scalar-sidebar-indent-border: transparent;--scalar-sidebar-indent-border-hover: transparent;--scalar-sidebar-indent-border-active: transparent}.light-mode .dark-mode{color-scheme:dark!important}@media (max-width: 460px){:root{--scalar-font-size-1: 22px;--scalar-font-size-2: 14px;--scalar-font-size-3: 12px}}@media (max-width: 720px){:root{--scalar-heading-1: 24px;--scalar-page-description: 20px}}.light-mode{--scalar-background-1: #fff;--scalar-background-2: #f6f6f6;--scalar-background-3: #e7e7e7;--scalar-background-accent: #8ab4f81f;--scalar-color-1: #2a2f45;--scalar-color-2: #757575;--scalar-color-3: #8e8e8e;--scalar-color-accent: #0099ff;--scalar-border-color: rgba(0, 0, 0, .1)}.dark-mode{--scalar-background-1: #0f0f0f;--scalar-background-2: #1a1a1a;--scalar-background-3: #272727;--scalar-color-1: rgba(255, 255, 255, .9);--scalar-color-2: rgba(255, 255, 255, .62);--scalar-color-3: rgba(255, 255, 255, .44);--scalar-color-accent: #3ea6ff;--scalar-background-accent: #3ea6ff1f;--scalar-border-color: rgba(255, 255, 255, .1)}.light-mode .t-doc__sidebar,.dark-mode .t-doc__sidebar{--scalar-sidebar-background-1: var(--scalar-background-1);--scalar-sidebar-color-1: var(--scalar-color-1);--scalar-sidebar-color-2: var(--scalar-color-2);--scalar-sidebar-border-color: var(--scalar-border-color);--scalar-sidebar-item-hover-background: var(--scalar-background-2);--scalar-sidebar-item-hover-color: currentColor;--scalar-sidebar-item-active-background: var(--scalar-background-2);--scalar-sidebar-color-active: var(--scalar-color-1);--scalar-sidebar-search-background: transparent;--scalar-sidebar-search-color: var(--scalar-color-3);--scalar-sidebar-search-border-color: var(--scalar-border-color)}.light-mode{--scalar-color-green: #069061;--scalar-color-red: #ef0006;--scalar-color-yellow: #edbe20;--scalar-color-blue: #0082d0;--scalar-color-orange: #fb892c;--scalar-color-purple: #5203d1;--scalar-button-1: rgba(0, 0, 0, 1);--scalar-button-1-hover: rgba(0, 0, 0, .8);--scalar-button-1-color: rgba(255, 255, 255, .9)}.dark-mode{--scalar-color-green: #00b648;--scalar-color-red: #dc1b19;--scalar-color-yellow: #ffc90d;--scalar-color-blue: #4eb3ec;--scalar-color-orange: #ff8d4d;--scalar-color-purple: #b191f9;--scalar-button-1: rgba(255, 255, 255, 1);--scalar-button-1-hover: rgba(255, 255, 255, .9);--scalar-button-1-color: black}}*,:before,:after{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgb(59 130 246 / .5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgb(59 130 246 / .5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }.scalar-app .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.scalar-app .pointer-events-none{pointer-events:none}.scalar-app .visible{visibility:visible}.scalar-app .fixed{position:fixed}.scalar-app .absolute{position:absolute}.scalar-app .relative{position:relative}.scalar-app .inset-0{top:0;right:0;bottom:0;left:0}.scalar-app .left-0{left:0}.scalar-app .top-0{top:0}.scalar-app .top-\[0\.5px\]{top:.5px}.scalar-app .-z-1{z-index:-1}.scalar-app .z-\[1001\]{z-index:1001}.scalar-app .z-overlay{z-index:10000}.scalar-app .m-0{margin:0}.scalar-app .-mx-0{margin-left:-0px;margin-right:-0px}.scalar-app .-mx-0\.75{margin-left:-3px;margin-right:-3px}.scalar-app .mx-2{margin-left:8px;margin-right:8px}.scalar-app .mx-auto{margin-left:auto;margin-right:auto}.scalar-app .my-0{margin-top:0;margin-bottom:0}.scalar-app .my-0\.75{margin-top:3px;margin-bottom:3px}.scalar-app .my-3{margin-top:12px;margin-bottom:12px}.scalar-app .mb-0{margin-bottom:0}.scalar-app .ml-1{margin-left:4px}.scalar-app .ml-2{margin-left:8px}.scalar-app .mr-2{margin-right:8px}.scalar-app .mr-3{margin-right:12px}.scalar-app .mt-0{margin-top:0}.scalar-app .mt-1{margin-top:4px}.scalar-app .mt-1\.5{margin-top:6px}.scalar-app .mt-20{margin-top:80px}.scalar-app .block{display:block}.scalar-app .inline-block{display:inline-block}.scalar-app .flex{display:flex}.scalar-app .grid{display:grid}.scalar-app .contents{display:contents}.scalar-app .hidden{display:none}.scalar-app .aspect-square{aspect-ratio:1 / 1}.scalar-app .size-10{width:40px;height:40px}.scalar-app .size-2{width:8px;height:8px}.scalar-app .size-2\.5{width:10px;height:10px}.scalar-app .size-3{width:12px;height:12px}.scalar-app .size-3\.5{width:14px;height:14px}.scalar-app .size-4{width:16px;height:16px}.scalar-app .size-5{width:20px;height:20px}.scalar-app .size-6{width:24px;height:24px}.scalar-app .size-8{width:32px;height:32px}.scalar-app .size-full{width:100%;height:100%}.scalar-app .h-10{height:40px}.scalar-app .h-4{height:16px}.scalar-app .h-\[100dvh\]{height:100dvh}.scalar-app .h-full{height:100%}.scalar-app .h-px{height:1px}.scalar-app .h-screen{height:100vh}.scalar-app .max-h-\[440px\]{max-height:440px}.scalar-app .max-h-\[calc\(100dvh-240px\)\]{max-height:calc(100dvh - 240px)}.scalar-app .min-h-\[77px\]{min-height:77px}.scalar-app .w-4{width:16px}.scalar-app .w-40{width:160px}.scalar-app .w-48{width:192px}.scalar-app .w-56{width:224px}.scalar-app .w-\[100dvw\]{width:100dvw}.scalar-app .w-full{width:100%}.scalar-app .min-w-0{min-width:0px}.scalar-app .max-w-screen-lg{max-width:800px}.scalar-app .max-w-screen-md{max-width:640px}.scalar-app .max-w-screen-sm{max-width:540px}.scalar-app .max-w-screen-xs{max-width:480px}.scalar-app .flex-1{flex:1 1 0%}.scalar-app .origin-top-left{transform-origin:top left}.scalar-app .rotate-90{--tw-rotate:90deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.scalar-app .transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.scalar-app .cursor-not-allowed{cursor:not-allowed}.scalar-app .cursor-pointer{cursor:pointer}.scalar-app .resize-none{resize:none}.scalar-app .resize{resize:both}.scalar-app .appearance-none{-webkit-appearance:none;-moz-appearance:none;appearance:none}.scalar-app .flex-col{flex-direction:column}.scalar-app .flex-wrap{flex-wrap:wrap}.scalar-app .items-start{align-items:flex-start}.scalar-app .items-center{align-items:center}.scalar-app .justify-center{justify-content:center}.scalar-app .justify-between{justify-content:space-between}.scalar-app .gap-0{gap:0px}.scalar-app .gap-0\.75{gap:3px}.scalar-app .gap-1{gap:4px}.scalar-app .gap-1\.5{gap:6px}.scalar-app .gap-2{gap:8px}.scalar-app .gap-3{gap:12px}.scalar-app .gap-4{gap:16px}.scalar-app .divide-y>:not([hidden])~:not([hidden]){--tw-divide-y-reverse:0;border-top-width:calc(var(--scalar-border-width) * calc(1 - var(--tw-divide-y-reverse)));border-bottom-width:calc(var(--scalar-border-width) * var(--tw-divide-y-reverse))}.scalar-app .self-center{align-self:center}.scalar-app .overflow-hidden{overflow:hidden}.scalar-app .overflow-y-auto{overflow-y:auto}.scalar-app .truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.scalar-app .text-wrap{text-wrap:wrap}.scalar-app .rounded{border-radius:var(--scalar-radius)}.scalar-app .rounded-full{border-radius:9999px}.scalar-app .rounded-lg{border-radius:var(--scalar-radius-lg)}.scalar-app .border{border-width:var(--scalar-border-width)}.scalar-app .border-0{border-width:0}.scalar-app .border-solid{border-style:solid}.scalar-app .border-none{border-style:none}.scalar-app .border-border{border-color:var(--scalar-border-color)}.scalar-app .border-c-3{border-color:var(--scalar-color-3)}.scalar-app .border-error{border-color:var(--scalar-error-color)}.scalar-app .bg-b-1{background-color:var(--scalar-background-1)}.scalar-app .bg-b-2{background-color:var(--scalar-background-2)}.scalar-app .bg-b-btn{background-color:var(--scalar-button-1)}.scalar-app .bg-backdrop{background-color:#00000070}.scalar-app .bg-blue{background-color:var(--scalar-color-blue)}.scalar-app .bg-border{background-color:var(--scalar-border-color)}.scalar-app .bg-error{background-color:var(--scalar-error-color)}.scalar-app .bg-transparent{background-color:transparent}.scalar-app .stroke-\[0\.92\]{stroke-width:.92}.scalar-app .stroke-\[0\.96\]{stroke-width:.96}.scalar-app .stroke-\[0\.9\]{stroke-width:.9}.scalar-app .stroke-\[1\.1\]{stroke-width:1.1}.scalar-app .stroke-\[1\.2\]{stroke-width:1.2}.scalar-app .stroke-\[1\.4\]{stroke-width:1.4}.scalar-app .stroke-\[1\.75\]{stroke-width:1.75}.scalar-app .p-0{padding:0}.scalar-app .p-0\.5{padding:2px}.scalar-app .p-0\.75{padding:3px}.scalar-app .p-1{padding:4px}.scalar-app .p-2{padding:8px}.scalar-app .p-3{padding:12px}.scalar-app .p-\[3px\]{padding:3px}.scalar-app .px-1{padding-left:4px;padding-right:4px}.scalar-app .px-2{padding-left:8px;padding-right:8px}.scalar-app .px-2\.5{padding-left:10px;padding-right:10px}.scalar-app .px-3{padding-left:12px;padding-right:12px}.scalar-app .px-4{padding-left:16px;padding-right:16px}.scalar-app .px-6{padding-left:24px;padding-right:24px}.scalar-app .px-9{padding-left:36px;padding-right:36px}.scalar-app .py-1{padding-top:4px;padding-bottom:4px}.scalar-app .py-1\.5{padding-top:6px;padding-bottom:6px}.scalar-app .py-3{padding-top:12px;padding-bottom:12px}.scalar-app .py-4{padding-top:16px;padding-bottom:16px}.scalar-app .pb-0{padding-bottom:0}.scalar-app .pb-4{padding-bottom:16px}.scalar-app .pl-9{padding-left:36px}.scalar-app .pr-3{padding-right:12px}.scalar-app .pt-3{padding-top:12px}.scalar-app .pt-6{padding-top:24px}.scalar-app .text-left{text-align:left}.scalar-app .font-code{font-family:var(--scalar-font-code)}.scalar-app .text-lg{font-size:var(--scalar-font-size-2)}.scalar-app .text-sm{font-size:var(--scalar-font-size-4)}.scalar-app .text-xs{font-size:var(--scalar-font-size-5)}.scalar-app .text-xxs{font-size:var(--scalar-font-size-6)}.scalar-app .font-bold{font-weight:var(--scalar-bold)}.scalar-app .font-medium{font-weight:var(--scalar-semibold)}.scalar-app .leading-snug{line-height:1.375}.scalar-app .text-b-1{color:var(--scalar-background-1)}.scalar-app .text-c-1{color:var(--scalar-color-1)}.scalar-app .text-c-2{color:var(--scalar-color-2)}.scalar-app .text-c-3{color:var(--scalar-color-3)}.scalar-app .text-c-btn{color:var(--scalar-button-1-color)}.scalar-app .text-c-ghost{color:var(--scalar-color-ghost)}.scalar-app .text-error{color:var(--scalar-error-color)}.scalar-app .text-transparent{color:transparent}.scalar-app .text-white{--tw-text-opacity:1;color:rgb(255 255 255 / var(--tw-text-opacity))}.scalar-app .no-underline{text-decoration-line:none}.scalar-app .opacity-0{opacity:0}.scalar-app .opacity-50{opacity:.5}.scalar-app .shadow{--tw-shadow:var(--scalar-shadow-1);--tw-shadow-colored:var(--scalar-shadow-1);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.scalar-app .shadow-lg{--tw-shadow:var(--scalar-shadow-2);--tw-shadow-colored:var(--scalar-shadow-2);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.scalar-app .shadow-md{--tw-shadow:var(--scalar-shadow-1);--tw-shadow-colored:var(--scalar-shadow-1);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.scalar-app .shadow-none{--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.scalar-app .shadow-sm{--tw-shadow:rgba(0, 0, 0, .09) 0px 1px 4px;--tw-shadow-colored:0px 1px 4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.scalar-app .shadow-current{--tw-shadow-color:currentColor;--tw-shadow:var(--tw-shadow-colored)}.scalar-app .outline-none{outline:2px solid transparent;outline-offset:2px}.scalar-app .outline{outline-style:solid}.scalar-app .blur{--tw-blur:blur(8px);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.scalar-app .brightness-lifted{--tw-brightness:brightness(var(--scalar-lifted-brightness));filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.scalar-app .filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.scalar-app .transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.scalar-app .transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.scalar-app .transition-opacity{transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.scalar-app .transition-transform{transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.scalar-app .ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}.scalar-app .bg-b-1{--tw-bg-base:var(--scalar-background-1)}.scalar-app .bg-b-2{--tw-bg-base:var(--scalar-background-2)}.scalar-app .bg-b-btn{--tw-bg-base:var(--scalar-button-1)}.scalar-app .bg-backdrop{--tw-bg-base:rgba(0, 0, 0, .44)}.scalar-app .bg-blue{--tw-bg-base:var(--scalar-color-blue)}.scalar-app .bg-border{--tw-bg-base:var(--scalar-border-color)}.scalar-app .bg-error{--tw-bg-base:var(--scalar-error-color)}.scalar-app .bg-transparent{--tw-bg-base:transparent}.scalar-app .row{display:flex;flex-direction:row}.scalar-app .col{display:flex;flex-direction:column}.before\:mr-1:before{content:var(--tw-content);margin-right:4px}.before\:mr-1\.5:before{content:var(--tw-content);margin-right:6px}.before\:block:before{content:var(--tw-content);display:block}.before\:h-4:before{content:var(--tw-content);height:16px}.before\:w-4:before{content:var(--tw-content);width:16px}.before\:rounded-full:before{content:var(--tw-content);border-radius:9999px}.before\:bg-error:before{content:var(--tw-content);background-color:var(--scalar-error-color)}.before\:text-center:before{content:var(--tw-content);text-align:center}.before\:text-xxs:before{content:var(--tw-content);font-size:var(--scalar-font-size-6)}.before\:leading-4:before{content:var(--tw-content);line-height:var(--scalar-line-height-4)}.before\:text-white:before{content:var(--tw-content);--tw-text-opacity:1;color:rgb(255 255 255 / var(--tw-text-opacity))}.before\:content-\[\'\!\'\]:before{--tw-content:"!";content:var(--tw-content)}.before\:bg-error:before{content:var(--tw-content);--tw-bg-base:var(--scalar-error-color)}.first-of-type\:mt-0:first-of-type{margin-top:0}.first-of-type\:mt-0\.75:first-of-type{margin-top:3px}.last-of-type\:mb-0:last-of-type{margin-bottom:0}.last-of-type\:mb-0\.75:last-of-type{margin-bottom:3px}.empty\:hidden:empty{display:none}.focus-within\:border-c-1:focus-within{border-color:var(--scalar-color-1)}.hover\:bg-b-2:hover{background-color:var(--scalar-background-2)}.hover\:text-c-1:hover{color:var(--scalar-color-1)}.hover\:bg-b-2:hover{--tw-bg-base:var(--scalar-background-2)}.active\:bg-b-btn:active{background-color:var(--scalar-button-1)}.active\:text-c-1:active{color:var(--scalar-color-1)}.active\:shadow-none:active{--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.active\:brightness-90:active{--tw-brightness:brightness(.9);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.active\:bg-b-btn:active{--tw-bg-base:var(--scalar-button-1)}.group:hover .group-hover\:text-c-1{color:var(--scalar-color-1)}.group:hover .group-hover\:shadow-border{--tw-shadow:inset 0 0 0 1px var(--scalar-border-color);--tw-shadow-colored:inset 0 0 0 1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow);--tw-shadow-color:var(--scalar-border-color);--tw-shadow:var(--tw-shadow-colored)}.ui-open\:rotate-180[data-headlessui-state~=open]{--tw-rotate:180deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}:where([data-headlessui-state~=open]) .ui-open\:rotate-180{--tw-rotate:180deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.has-actv-btn\:border:has(button:active){border-width:var(--scalar-border-width)}.has-actv-btn\:border-border:has(button:active){border-color:var(--scalar-border-color)}.\!empty\:flex:not(:empty){display:flex}.\!empty\:w-7:not(:empty){width:28px}.\!empty\:items-center:not(:empty){align-items:center}.\!empty\:pr-3:not(:empty){padding-right:12px}.hocus\:bg-border:hover{background-color:var(--scalar-border-color)}.hocus\:bg-h-btn:hover{background-color:var(--scalar-button-1-hover)}.hocus\:text-c-1:hover{color:var(--scalar-color-1)}.hocus\:brightness-90:hover{--tw-brightness:brightness(.9);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.hocus\:bg-border:hover{--tw-bg-base:var(--scalar-border-color)}.hocus\:bg-h-btn:hover{--tw-bg-base:var(--scalar-button-1-hover)}.hocus\:bg-border:focus-visible{background-color:var(--scalar-border-color)}.hocus\:bg-h-btn:focus-visible{background-color:var(--scalar-button-1-hover)}.hocus\:text-c-1:focus-visible{color:var(--scalar-color-1)}.hocus\:brightness-90:focus-visible{--tw-brightness:brightness(.9);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.hocus\:bg-border:focus-visible{--tw-bg-base:var(--scalar-border-color)}.hocus\:bg-h-btn:focus-visible{--tw-bg-base:var(--scalar-button-1-hover)}@media (min-width: 800px){.md\:row{display:flex;flex-direction:row}}.loader-wrapper[data-v-47faceda]{position:relative;height:var(--d6cae758);width:var(--d6cae758);display:flex;align-items:center;justify-content:center;--loader-size: 50%}.svg-loader[data-v-47faceda]{width:var(--loader-size);height:var(--loader-size);top:1rem;right:.9rem;overflow:visible;fill:none;background-color:transparent;stroke:currentColor}.svg-path[data-v-47faceda]{stroke-width:14;fill:none;transition:.3s}.svg-x-mark[data-v-47faceda]{stroke-dasharray:57;stroke-dashoffset:57;transition-delay:0s}.svg-check-mark[data-v-47faceda]{stroke-dasharray:149;stroke-dashoffset:149;transition-delay:0s}.icon-is-invalid .svg-x-mark[data-v-47faceda],.icon-is-valid .svg-check-mark[data-v-47faceda]{stroke-dashoffset:0;transition-delay:.3s}.circular-loader[data-v-47faceda]{animation:rotate-47faceda .7s linear infinite,fade-in-47faceda .4s;transform-origin:center center;transform:scale(5);background:transparent}.loader-path[data-v-47faceda]{stroke-dasharray:50,200;stroke-dashoffset:-100;stroke-linecap:round}.loader-path-off[data-v-47faceda]{stroke-dasharray:50,200;stroke-dashoffset:-100;transition:opacity .3s;opacity:0}@keyframes fade-in-47faceda{0%{opacity:0}70%{opacity:0}to{opacity:1}}@keyframes rotate-47faceda{0%{transform:scale(5) rotate(0)}to{transform:scale(5) rotate(360deg)}}.scalar-codeblock-pre{margin:0;padding:.5rem;overflow:auto;background:transparent;text-wrap:nowrap;white-space-collapse:preserve;border-radius:0}.scalar-input-wrapper-focus .scalar-input-label[data-v-94574cc9]{color:var(--scalar-color-1)}.scalar-input-wrapper-error .scalar-input-label[data-v-94574cc9]{color:var(--scalar-color-error-color)}.scalar-input[data-v-94574cc9]::-moz-selection{color:var(--scalar-color-1);background:#ffa55859}.scalar-input[data-v-94574cc9]::selection{color:var(--scalar-color-1);background:#ffa55859}.scalar-input[data-v-94574cc9]:has(+.scalar-input-label){opacity:0}.scalar-input[data-v-94574cc9]:not(:-moz-placeholder-shown){opacity:1;-moz-transition:opacity .2s ease-in-out .15s;transition:opacity .2s ease-in-out .15s}.scalar-input[data-v-94574cc9]:not(:placeholder-shown),.scalar-input-wrapper-focus .scalar-input[data-v-94574cc9]{opacity:1;transition:opacity .2s ease-in-out .15s}.scalar-input[data-v-94574cc9]:-webkit-autofill,.scalar-input[data-v-94574cc9]:-webkit-autofill:hover,.scalar-input[data-v-94574cc9]:-webkit-autofill:focus,.scalar-input[data-v-94574cc9]:-webkit-autofill:active,.scalar-input[data-v-94574cc9]:focus-within:-webkit-autofill,.scalar-input[data-v-94574cc9]:focus-within:-webkit-autofill:hover,.scalar-input[data-v-94574cc9]:focus-within:-webkit-autofill:focus,.scalar-input[data-v-94574cc9]:focus-within:-webkit-autofill:active{-webkit-box-shadow:0 0 0px 1000px var(--scalar-background-1) inset!important;-webkit-text-fill-color:var(--scalar-color-1);color:var(--scalar-color-1);border-radius:var(--scalar-radius)}.scalar-input:not(:-moz-placeholder-shown)+.scalar-input-label[data-v-94574cc9]{transform:translate3d(0,-20px,0) scale(.8);transform-origin:top left}.scalar-input-wrapper-focus .scalar-input-label[data-v-94574cc9],.scalar-input:not(:placeholder-shown)+.scalar-input-label[data-v-94574cc9]{transform:translate3d(0,-20px,0) scale(.8);transform-origin:top left}.scalar-input-wrapper-focus:has(button:active) .scalar-input-label[data-v-94574cc9]{color:var(--scalar-color-3)!important}
+.scalar-modal-layout[data-v-647be2f3]{animation:modal-fade-647be2f3 .2s forwards}.scalar-modal[data-v-647be2f3]{animation:modal-pop-647be2f3 .15s .15s forwards;height:calc(100% - 120px);width:calc(100% - 8px);max-width:1390px;position:fixed;left:0;top:0;bottom:0;right:0;margin:auto}.scalar-modal.scalar-modal-search[data-v-647be2f3]{max-width:540px;background-color:transparent}.modal-content-search .modal-body[data-v-647be2f3]{padding:0;overflow:hidden;display:flex;flex-direction:column;max-height:440px}@media (max-width: 1280px){.scalar-modal[data-v-647be2f3]{height:calc(100% - 56px);top:46px}}@keyframes modal-fade-647be2f3{0%{opacity:0}to{opacity:1}}@keyframes modal-pop-647be2f3{0%{opacity:0}to{opacity:1}}@layer scalar-base,scalar-theme;:where(.scalar-app){font-family:var(--scalar-font);line-height:1.15;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4}:where(.scalar-app) *,:where(.scalar-app) *:before,:where(.scalar-app) *:after{box-sizing:border-box;border-width:0;border-style:solid;border-color:var(--scalar-border-color);font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:unset;font-weight:inherit;line-height:inherit;color:inherit;margin:unset;padding:unset;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}:where(.scalar-app) button,:where(.scalar-app) input,:where(.scalar-app) optgroup,:where(.scalar-app) select,:where(.scalar-app) textarea,:where(.scalar-app) ::file-selector-button{background:transparent}:where(.scalar-app) input:where(:not([type=button],[type=reset],[type=submit])),:where(.scalar-app) select,:where(.scalar-app) textarea{border-radius:var(--scalar-radius);border-width:1px}:where(.scalar-app) input::placeholder,:where(.scalar-app) input:-ms-input-placeholder,:where(.scalar-app) input::-webkit-input-placeholder{color:var(--scalar-color-3);font-family:var(--scalar-font)}:where(.scalar-app) input:-webkit-autofill{-webkit-background-clip:text!important;background-clip:text!important}.scalar-app .cm-scroller,.scalar-app .custom-scroll{overflow-y:auto;scrollbar-color:transparent transparent;scrollbar-width:thin;-webkit-overflow-scrolling:touch}.scalar-app .custom-scroll-self-contain-overflow{overscroll-behavior:contain}@supports (-moz-appearance: none){.scalar-app .cm-scroller,.scalar-app .custom-scroll{padding-right:12px}}.scalar-app .cm-scroller:hover,.scalar-app .custom-scroll:hover{scrollbar-color:var(--scalar-scrollbar-color, transparent)}.scalar-app .cm-scroller:hover::-webkit-scrollbar-thumb,.scalar-app .custom-scroll:hover::-webkit-scrollbar-thumb{background:var(--scalar-scrollbar-color);background-clip:content-box;border:3px solid transparent}.scalar-app .cm-scroller::-webkit-scrollbar-thumb:active,.scalar-app .custom-scroll::-webkit-scrollbar-thumb:active{background:var(--scalar-scrollbar-color-active);background-clip:content-box;border:3px solid transparent}.scalar-app .cm-scroller::-webkit-scrollbar-corner,.scalar-app .custom-scroll::-webkit-scrollbar-corner{background:transparent}.scalar-app .cm-scroller::-webkit-scrollbar,.scalar-app .custom-scroll::-webkit-scrollbar{height:12px;width:12px}.scalar-app .cm-scroller::-webkit-scrollbar-track,.scalar-app .custom-scroll::-webkit-scrollbar-track{background:transparent}.scalar-app .cm-scroller::-webkit-scrollbar-thumb,.scalar-app .custom-scroll::-webkit-scrollbar-thumb{border-radius:20px;background:transparent;background-clip:content-box;border:3px solid transparent}@media (pointer: coarse){.scalar-app .cm-scroller,.scalar-app .custom-scroll{padding-right:12px}}@layer scalar-base{:root{--scalar-border-width: 1px;--scalar-radius: 3px;--scalar-radius-lg: 6px;--scalar-radius-xl: 8px;--scalar-font: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;--scalar-font-code: "JetBrains Mono", ui-monospace, Menlo, Monaco, "Cascadia Mono", "Segoe UI Mono", "Roboto Mono", "Oxygen Mono", "Ubuntu Monospace", "Source Code Pro", "Fira Mono", "Droid Sans Mono", "Courier New", monospace;--scalar-heading-1: 40px;--scalar-page-description: 24px;--scalar-heading-2: 24px;--scalar-heading-3: 20px;--scalar-heading-4: 16px;--scalar-heading-5: 16px;--scalar-heading-6: 16px;--scalar-paragraph: 16px;--scalar-small: 14px;--scalar-mini: 13px;--scalar-micro: 12px;--scalar-bold: 600;--scalar-semibold: 500;--scalar-regular: 400;--scalar-font-size-1: 24px;--scalar-font-size-2: 16px;--scalar-font-size-3: 14px;--scalar-font-size-4: 13px;--scalar-font-size-5: 12px;--scalar-font-size-6: 12px;--scalar-font-size-7: 10px;--scalar-line-height-1: 32px;--scalar-line-height-2: 24px;--scalar-line-height-3: 20px;--scalar-line-height-4: 18px;--scalar-line-height-5: 16px;--scalar-font-medium: 500;--scalar-font-bold: 700;--scalar-text-decoration: none;--scalar-text-decoration-hover: underline}.dark-mode{color-scheme:dark;--scalar-scrollbar-color: rgba(255, 255, 255, .18);--scalar-scrollbar-color-active: rgba(255, 255, 255, .36);--scalar-button-1: rgba(255, 255, 255, 1);--scalar-button-1-hover: rgba(255, 255, 255, .9);--scalar-button-1-color: black;--scalar-shadow-1: 0 1px 3px 0 rgb(0, 0, 0, .1);--scalar-shadow-2: rgba(15, 15, 15, .2) 0px 3px 6px, rgba(15, 15, 15, .4) 0px 9px 24px, 0 0 0 1px rgba(255, 255, 255, .1);--scalar-sidebar-indent-border: transparent;--scalar-sidebar-indent-border-hover: transparent;--scalar-sidebar-indent-border-active: transparent}.light-mode{color-scheme:light;--scalar-scrollbar-color-active: rgba(0, 0, 0, .36);--scalar-scrollbar-color: rgba(0, 0, 0, .18);--scalar-button-1: rgba(0, 0, 0, 1);--scalar-button-1-hover: rgba(0, 0, 0, .8);--scalar-button-1-color: rgba(255, 255, 255, .9);--scalar-shadow-1: 0 1px 3px 0 rgba(0, 0, 0, .11);--scalar-shadow-2: rgba(0, 0, 0, .08) 0px 13px 20px 0px, rgba(0, 0, 0, .08) 0px 3px 8px 0px, #eeeeed 0px 0 0 1px;--scalar-sidebar-indent-border: transparent;--scalar-sidebar-indent-border-hover: transparent;--scalar-sidebar-indent-border-active: transparent}.light-mode .dark-mode{color-scheme:dark!important}@media (max-width: 460px){:root{--scalar-font-size-1: 22px;--scalar-font-size-2: 14px;--scalar-font-size-3: 12px}}@media (max-width: 720px){:root{--scalar-heading-1: 24px;--scalar-page-description: 20px}}.light-mode{--scalar-background-1: #fff;--scalar-background-2: #f6f6f6;--scalar-background-3: #e7e7e7;--scalar-background-accent: #8ab4f81f;--scalar-color-1: #2a2f45;--scalar-color-2: #757575;--scalar-color-3: #8e8e8e;--scalar-color-accent: #0099ff;--scalar-border-color: rgba(0, 0, 0, .1)}.dark-mode{--scalar-background-1: #0f0f0f;--scalar-background-2: #1a1a1a;--scalar-background-3: #272727;--scalar-color-1: rgba(255, 255, 255, .9);--scalar-color-2: rgba(255, 255, 255, .62);--scalar-color-3: rgba(255, 255, 255, .44);--scalar-color-accent: #3ea6ff;--scalar-background-accent: #3ea6ff1f;--scalar-border-color: rgba(255, 255, 255, .1)}.light-mode .t-doc__sidebar,.dark-mode .t-doc__sidebar{--scalar-sidebar-background-1: var(--scalar-background-1);--scalar-sidebar-color-1: var(--scalar-color-1);--scalar-sidebar-color-2: var(--scalar-color-2);--scalar-sidebar-border-color: var(--scalar-border-color);--scalar-sidebar-item-hover-background: var(--scalar-background-2);--scalar-sidebar-item-hover-color: currentColor;--scalar-sidebar-item-active-background: var(--scalar-background-2);--scalar-sidebar-color-active: var(--scalar-color-1);--scalar-sidebar-search-background: transparent;--scalar-sidebar-search-color: var(--scalar-color-3);--scalar-sidebar-search-border-color: var(--scalar-border-color)}.light-mode{--scalar-color-green: #069061;--scalar-color-red: #ef0006;--scalar-color-yellow: #edbe20;--scalar-color-blue: #0082d0;--scalar-color-orange: #fb892c;--scalar-color-purple: #5203d1;--scalar-button-1: rgba(0, 0, 0, 1);--scalar-button-1-hover: rgba(0, 0, 0, .8);--scalar-button-1-color: rgba(255, 255, 255, .9)}.dark-mode{--scalar-color-green: #00b648;--scalar-color-red: #dc1b19;--scalar-color-yellow: #ffc90d;--scalar-color-blue: #4eb3ec;--scalar-color-orange: #ff8d4d;--scalar-color-purple: #b191f9;--scalar-button-1: rgba(255, 255, 255, 1);--scalar-button-1-hover: rgba(255, 255, 255, .9);--scalar-button-1-color: black}*,:before,:after{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgb(59 130 246 / .5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgb(59 130 246 / .5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }}:where(.scalar-app) .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}:where(.scalar-app) .pointer-events-none{pointer-events:none}:where(.scalar-app) .visible{visibility:visible}:where(.scalar-app) .fixed{position:fixed}:where(.scalar-app) .absolute{position:absolute}:where(.scalar-app) .relative{position:relative}:where(.scalar-app) .inset-0{top:0;right:0;bottom:0;left:0}:where(.scalar-app) .left-0{left:0}:where(.scalar-app) .top-0{top:0}:where(.scalar-app) .top-\[0\.5px\]{top:.5px}:where(.scalar-app) .-z-1{z-index:-1}:where(.scalar-app) .z-\[1001\]{z-index:1001}:where(.scalar-app) .z-overlay{z-index:10000}:where(.scalar-app) .m-0{margin:0}:where(.scalar-app) .-mx-0{margin-left:-0px;margin-right:-0px}:where(.scalar-app) .-mx-0\.75{margin-left:-3px;margin-right:-3px}:where(.scalar-app) .mx-2{margin-left:8px;margin-right:8px}:where(.scalar-app) .mx-auto{margin-left:auto;margin-right:auto}:where(.scalar-app) .my-0{margin-top:0;margin-bottom:0}:where(.scalar-app) .my-0\.75{margin-top:3px;margin-bottom:3px}:where(.scalar-app) .my-3{margin-top:12px;margin-bottom:12px}:where(.scalar-app) .mb-0{margin-bottom:0}:where(.scalar-app) .ml-1{margin-left:4px}:where(.scalar-app) .ml-2{margin-left:8px}:where(.scalar-app) .mr-2{margin-right:8px}:where(.scalar-app) .mr-3{margin-right:12px}:where(.scalar-app) .mt-0{margin-top:0}:where(.scalar-app) .mt-1{margin-top:4px}:where(.scalar-app) .mt-1\.5{margin-top:6px}:where(.scalar-app) .mt-20{margin-top:80px}:where(.scalar-app) .block{display:block}:where(.scalar-app) .inline-block{display:inline-block}:where(.scalar-app) .flex{display:flex}:where(.scalar-app) .grid{display:grid}:where(.scalar-app) .contents{display:contents}:where(.scalar-app) .hidden{display:none}:where(.scalar-app) .aspect-square{aspect-ratio:1 / 1}:where(.scalar-app) .size-10{width:40px;height:40px}:where(.scalar-app) .size-2{width:8px;height:8px}:where(.scalar-app) .size-2\.5{width:10px;height:10px}:where(.scalar-app) .size-3{width:12px;height:12px}:where(.scalar-app) .size-3\.5{width:14px;height:14px}:where(.scalar-app) .size-4{width:16px;height:16px}:where(.scalar-app) .size-5{width:20px;height:20px}:where(.scalar-app) .size-6{width:24px;height:24px}:where(.scalar-app) .size-8{width:32px;height:32px}:where(.scalar-app) .size-full{width:100%;height:100%}:where(.scalar-app) .h-10{height:40px}:where(.scalar-app) .h-4{height:16px}:where(.scalar-app) .h-\[100dvh\]{height:100dvh}:where(.scalar-app) .h-full{height:100%}:where(.scalar-app) .h-px{height:1px}:where(.scalar-app) .h-screen{height:100vh}:where(.scalar-app) .max-h-\[440px\]{max-height:440px}:where(.scalar-app) .max-h-\[calc\(100dvh-240px\)\]{max-height:calc(100dvh - 240px)}:where(.scalar-app) .min-h-\[77px\]{min-height:77px}:where(.scalar-app) .w-4{width:16px}:where(.scalar-app) .w-40{width:160px}:where(.scalar-app) .w-48{width:192px}:where(.scalar-app) .w-56{width:224px}:where(.scalar-app) .w-\[100dvw\]{width:100dvw}:where(.scalar-app) .w-full{width:100%}:where(.scalar-app) .min-w-0{min-width:0px}:where(.scalar-app) .max-w-screen-lg{max-width:800px}:where(.scalar-app) .max-w-screen-md{max-width:640px}:where(.scalar-app) .max-w-screen-sm{max-width:540px}:where(.scalar-app) .max-w-screen-xs{max-width:480px}:where(.scalar-app) .flex-1{flex:1 1 0%}:where(.scalar-app) .origin-top-left{transform-origin:top left}:where(.scalar-app) .rotate-90{--tw-rotate:90deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}:where(.scalar-app) .transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}:where(.scalar-app) .cursor-not-allowed{cursor:not-allowed}:where(.scalar-app) .cursor-pointer{cursor:pointer}:where(.scalar-app) .resize-none{resize:none}:where(.scalar-app) .resize{resize:both}:where(.scalar-app) .appearance-none{-webkit-appearance:none;-moz-appearance:none;appearance:none}:where(.scalar-app) .flex-col{flex-direction:column}:where(.scalar-app) .flex-wrap{flex-wrap:wrap}:where(.scalar-app) .items-start{align-items:flex-start}:where(.scalar-app) .items-center{align-items:center}:where(.scalar-app) .justify-start{justify-content:flex-start}:where(.scalar-app) .justify-center{justify-content:center}:where(.scalar-app) .justify-between{justify-content:space-between}:where(.scalar-app) .gap-0{gap:0px}:where(.scalar-app) .gap-0\.75{gap:3px}:where(.scalar-app) .gap-1{gap:4px}:where(.scalar-app) .gap-1\.5{gap:6px}:where(.scalar-app) .gap-2{gap:8px}:where(.scalar-app) .gap-3{gap:12px}:where(.scalar-app) .gap-4{gap:16px}:where(.scalar-app) .divide-y>:not([hidden])~:not([hidden]){--tw-divide-y-reverse:0;border-top-width:calc(var(--scalar-border-width) * calc(1 - var(--tw-divide-y-reverse)));border-bottom-width:calc(var(--scalar-border-width) * var(--tw-divide-y-reverse))}:where(.scalar-app) .self-center{align-self:center}:where(.scalar-app) .overflow-hidden{overflow:hidden}:where(.scalar-app) .overflow-y-auto{overflow-y:auto}:where(.scalar-app) .truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:where(.scalar-app) .text-wrap{text-wrap:wrap}:where(.scalar-app) .rounded{border-radius:var(--scalar-radius)}:where(.scalar-app) .rounded-full{border-radius:9999px}:where(.scalar-app) .rounded-lg{border-radius:var(--scalar-radius-lg)}:where(.scalar-app) .border{border-width:var(--scalar-border-width)}:where(.scalar-app) .border-0{border-width:0}:where(.scalar-app) .border-solid{border-style:solid}:where(.scalar-app) .border-none{border-style:none}:where(.scalar-app) .border-border{border-color:var(--scalar-border-color)}:where(.scalar-app) .border-c-3{border-color:var(--scalar-color-3)}:where(.scalar-app) .border-error{border-color:var(--scalar-error-color)}:where(.scalar-app) .bg-b-1{background-color:var(--scalar-background-1)}:where(.scalar-app) .bg-b-2{background-color:var(--scalar-background-2)}:where(.scalar-app) .bg-b-btn{background-color:var(--scalar-button-1)}:where(.scalar-app) .bg-backdrop{background-color:#00000070}:where(.scalar-app) .bg-blue{background-color:var(--scalar-color-blue)}:where(.scalar-app) .bg-border{background-color:var(--scalar-border-color)}:where(.scalar-app) .bg-error{background-color:var(--scalar-error-color)}:where(.scalar-app) .bg-transparent{background-color:transparent}:where(.scalar-app) .stroke-\[0\.92\]{stroke-width:.92}:where(.scalar-app) .stroke-\[0\.96\]{stroke-width:.96}:where(.scalar-app) .stroke-\[0\.9\]{stroke-width:.9}:where(.scalar-app) .stroke-\[1\.1\]{stroke-width:1.1}:where(.scalar-app) .stroke-\[1\.2\]{stroke-width:1.2}:where(.scalar-app) .stroke-\[1\.4\]{stroke-width:1.4}:where(.scalar-app) .stroke-\[1\.75\]{stroke-width:1.75}:where(.scalar-app) .p-0{padding:0}:where(.scalar-app) .p-0\.5{padding:2px}:where(.scalar-app) .p-0\.75{padding:3px}:where(.scalar-app) .p-1{padding:4px}:where(.scalar-app) .p-2{padding:8px}:where(.scalar-app) .p-3{padding:12px}:where(.scalar-app) .p-\[3px\]{padding:3px}:where(.scalar-app) .px-1{padding-left:4px;padding-right:4px}:where(.scalar-app) .px-2{padding-left:8px;padding-right:8px}:where(.scalar-app) .px-2\.5{padding-left:10px;padding-right:10px}:where(.scalar-app) .px-3{padding-left:12px;padding-right:12px}:where(.scalar-app) .px-4{padding-left:16px;padding-right:16px}:where(.scalar-app) .px-6{padding-left:24px;padding-right:24px}:where(.scalar-app) .px-9{padding-left:36px;padding-right:36px}:where(.scalar-app) .py-1{padding-top:4px;padding-bottom:4px}:where(.scalar-app) .py-1\.5{padding-top:6px;padding-bottom:6px}:where(.scalar-app) .py-3{padding-top:12px;padding-bottom:12px}:where(.scalar-app) .py-4{padding-top:16px;padding-bottom:16px}:where(.scalar-app) .pb-0{padding-bottom:0}:where(.scalar-app) .pb-4{padding-bottom:16px}:where(.scalar-app) .pl-9{padding-left:36px}:where(.scalar-app) .pr-3{padding-right:12px}:where(.scalar-app) .pt-3{padding-top:12px}:where(.scalar-app) .pt-6{padding-top:24px}:where(.scalar-app) .text-left{text-align:left}:where(.scalar-app) .font-code{font-family:var(--scalar-font-code)}:where(.scalar-app) .text-lg{font-size:var(--scalar-font-size-2)}:where(.scalar-app) .text-sm{font-size:var(--scalar-font-size-4)}:where(.scalar-app) .text-xs{font-size:var(--scalar-font-size-5)}:where(.scalar-app) .text-xxs{font-size:var(--scalar-font-size-6)}:where(.scalar-app) .font-bold{font-weight:var(--scalar-bold)}:where(.scalar-app) .font-medium{font-weight:var(--scalar-semibold)}:where(.scalar-app) .leading-snug{line-height:1.375}:where(.scalar-app) .text-b-1{color:var(--scalar-background-1)}:where(.scalar-app) .text-c-1{color:var(--scalar-color-1)}:where(.scalar-app) .text-c-2{color:var(--scalar-color-2)}:where(.scalar-app) .text-c-3{color:var(--scalar-color-3)}:where(.scalar-app) .text-c-btn{color:var(--scalar-button-1-color)}:where(.scalar-app) .text-c-ghost{color:var(--scalar-color-ghost)}:where(.scalar-app) .text-error{color:var(--scalar-error-color)}:where(.scalar-app) .text-transparent{color:transparent}:where(.scalar-app) .text-white{--tw-text-opacity:1;color:rgb(255 255 255 / var(--tw-text-opacity))}:where(.scalar-app) .no-underline{text-decoration-line:none}:where(.scalar-app) .opacity-0{opacity:0}:where(.scalar-app) .opacity-50{opacity:.5}:where(.scalar-app) .shadow{--tw-shadow:var(--scalar-shadow-1);--tw-shadow-colored:var(--scalar-shadow-1);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}:where(.scalar-app) .shadow-lg{--tw-shadow:var(--scalar-shadow-2);--tw-shadow-colored:var(--scalar-shadow-2);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}:where(.scalar-app) .shadow-md{--tw-shadow:var(--scalar-shadow-1);--tw-shadow-colored:var(--scalar-shadow-1);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}:where(.scalar-app) .shadow-none{--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}:where(.scalar-app) .shadow-sm{--tw-shadow:rgba(0, 0, 0, .09) 0px 1px 4px;--tw-shadow-colored:0px 1px 4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}:where(.scalar-app) .shadow-current{--tw-shadow-color:currentColor;--tw-shadow:var(--tw-shadow-colored)}:where(.scalar-app) .outline-none{outline:2px solid transparent;outline-offset:2px}:where(.scalar-app) .outline{outline-style:solid}:where(.scalar-app) .blur{--tw-blur:blur(8px);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}:where(.scalar-app) .brightness-lifted{--tw-brightness:brightness(var(--scalar-lifted-brightness));filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}:where(.scalar-app) .filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}:where(.scalar-app) .transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}:where(.scalar-app) .transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}:where(.scalar-app) .transition-opacity{transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}:where(.scalar-app) .transition-transform{transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}:where(.scalar-app) .ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}:where(.scalar-app) .bg-b-1{--tw-bg-base:var(--scalar-background-1)}:where(.scalar-app) .bg-b-2{--tw-bg-base:var(--scalar-background-2)}:where(.scalar-app) .bg-b-btn{--tw-bg-base:var(--scalar-button-1)}:where(.scalar-app) .bg-backdrop{--tw-bg-base:rgba(0, 0, 0, .44)}:where(.scalar-app) .bg-blue{--tw-bg-base:var(--scalar-color-blue)}:where(.scalar-app) .bg-border{--tw-bg-base:var(--scalar-border-color)}:where(.scalar-app) .bg-error{--tw-bg-base:var(--scalar-error-color)}:where(.scalar-app) .bg-transparent{--tw-bg-base:transparent}:where(.scalar-app) .row{display:flex;flex-direction:row}:where(.scalar-app) .col{display:flex;flex-direction:column}:where(.scalar-app) .centered{left:50%;--tw-translate-x: -50%;top:50%;--tw-translate-y: -50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}:where(.scalar-app) .before\:mr-1:before{content:var(--tw-content);margin-right:4px}:where(.scalar-app) .before\:mr-1\.5:before{content:var(--tw-content);margin-right:6px}:where(.scalar-app) .before\:block:before{content:var(--tw-content);display:block}:where(.scalar-app) .before\:h-4:before{content:var(--tw-content);height:16px}:where(.scalar-app) .before\:w-4:before{content:var(--tw-content);width:16px}:where(.scalar-app) .before\:rounded-full:before{content:var(--tw-content);border-radius:9999px}:where(.scalar-app) .before\:bg-error:before{content:var(--tw-content);background-color:var(--scalar-error-color)}:where(.scalar-app) .before\:text-center:before{content:var(--tw-content);text-align:center}:where(.scalar-app) .before\:text-xxs:before{content:var(--tw-content);font-size:var(--scalar-font-size-6)}:where(.scalar-app) .before\:leading-4:before{content:var(--tw-content);line-height:var(--scalar-line-height-4)}:where(.scalar-app) .before\:text-white:before{content:var(--tw-content);--tw-text-opacity:1;color:rgb(255 255 255 / var(--tw-text-opacity))}:where(.scalar-app) .before\:content-\[\'\!\'\]:before{--tw-content:"!";content:var(--tw-content)}:where(.scalar-app) .before\:bg-error:before{content:var(--tw-content);--tw-bg-base:var(--scalar-error-color)}:where(.scalar-app) .first-of-type\:mt-0:first-of-type{margin-top:0}:where(.scalar-app) .first-of-type\:mt-0\.75:first-of-type{margin-top:3px}:where(.scalar-app) .last-of-type\:mb-0:last-of-type{margin-bottom:0}:where(.scalar-app) .last-of-type\:mb-0\.75:last-of-type{margin-bottom:3px}:where(.scalar-app) .empty\:hidden:empty{display:none}:where(.scalar-app) .focus-within\:border-c-1:focus-within{border-color:var(--scalar-color-1)}:where(.scalar-app) .hover\:bg-b-2:hover{background-color:var(--scalar-background-2)}:where(.scalar-app) .hover\:text-c-1:hover{color:var(--scalar-color-1)}:where(.scalar-app) .hover\:bg-b-2:hover{--tw-bg-base:var(--scalar-background-2)}:where(.scalar-app) .active\:bg-b-btn:active{background-color:var(--scalar-button-1)}:where(.scalar-app) .active\:text-c-1:active{color:var(--scalar-color-1)}:where(.scalar-app) .active\:shadow-none:active{--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}:where(.scalar-app) .active\:brightness-90:active{--tw-brightness:brightness(.9);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}:where(.scalar-app) .active\:bg-b-btn:active{--tw-bg-base:var(--scalar-button-1)}:where(.scalar-app) .group:hover .group-hover\:text-c-1{color:var(--scalar-color-1)}:where(.scalar-app) .group:hover .group-hover\:shadow-border{--tw-shadow:inset 0 0 0 1px var(--scalar-border-color);--tw-shadow-colored:inset 0 0 0 1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}:where(.scalar-app) .group:hover .group-hover\:shadow-border{--tw-shadow-color:var(--scalar-border-color);--tw-shadow:var(--tw-shadow-colored)}:where(.scalar-app) .ui-open\:rotate-180[data-headlessui-state~=open]{--tw-rotate:180deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}:where(.scalar-app) :where([data-headlessui-state~=open]) .ui-open\:rotate-180{--tw-rotate:180deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}:where(.scalar-app) .has-actv-btn\:border:has(button:active){border-width:var(--scalar-border-width)}:where(.scalar-app) .has-actv-btn\:border-border:has(button:active){border-color:var(--scalar-border-color)}:where(.scalar-app) .\!empty\:flex:not(:empty){display:flex}:where(.scalar-app) .\!empty\:w-7:not(:empty){width:28px}:where(.scalar-app) .\!empty\:items-center:not(:empty){align-items:center}:where(.scalar-app) .\!empty\:pr-3:not(:empty){padding-right:12px}:where(.scalar-app) .hocus\:bg-border:hover{background-color:var(--scalar-border-color)}:where(.scalar-app) .hocus\:bg-h-btn:hover{background-color:var(--scalar-button-1-hover)}:where(.scalar-app) .hocus\:text-c-1:hover{color:var(--scalar-color-1)}:where(.scalar-app) .hocus\:brightness-90:hover{--tw-brightness:brightness(.9);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}:where(.scalar-app) .hocus\:bg-border:hover{--tw-bg-base:var(--scalar-border-color)}:where(.scalar-app) .hocus\:bg-h-btn:hover{--tw-bg-base:var(--scalar-button-1-hover)}:where(.scalar-app) .hocus\:bg-border:focus-visible{background-color:var(--scalar-border-color)}:where(.scalar-app) .hocus\:bg-h-btn:focus-visible{background-color:var(--scalar-button-1-hover)}:where(.scalar-app) .hocus\:text-c-1:focus-visible{color:var(--scalar-color-1)}:where(.scalar-app) .hocus\:brightness-90:focus-visible{--tw-brightness:brightness(.9);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}:where(.scalar-app) .hocus\:bg-border:focus-visible{--tw-bg-base:var(--scalar-border-color)}:where(.scalar-app) .hocus\:bg-h-btn:focus-visible{--tw-bg-base:var(--scalar-button-1-hover)}@media (min-width: 800px){:where(.scalar-app) .md\:row{display:flex;flex-direction:row}}.loader-wrapper[data-v-47faceda]{position:relative;height:var(--d6cae758);width:var(--d6cae758);display:flex;align-items:center;justify-content:center;--loader-size: 50%}.svg-loader[data-v-47faceda]{width:var(--loader-size);height:var(--loader-size);top:1rem;right:.9rem;overflow:visible;fill:none;background-color:transparent;stroke:currentColor}.svg-path[data-v-47faceda]{stroke-width:14;fill:none;transition:.3s}.svg-x-mark[data-v-47faceda]{stroke-dasharray:57;stroke-dashoffset:57;transition-delay:0s}.svg-check-mark[data-v-47faceda]{stroke-dasharray:149;stroke-dashoffset:149;transition-delay:0s}.icon-is-invalid .svg-x-mark[data-v-47faceda],.icon-is-valid .svg-check-mark[data-v-47faceda]{stroke-dashoffset:0;transition-delay:.3s}.circular-loader[data-v-47faceda]{animation:rotate-47faceda .7s linear infinite,fade-in-47faceda .4s;transform-origin:center center;transform:scale(5);background:transparent}.loader-path[data-v-47faceda]{stroke-dasharray:50,200;stroke-dashoffset:-100;stroke-linecap:round}.loader-path-off[data-v-47faceda]{stroke-dasharray:50,200;stroke-dashoffset:-100;transition:opacity .3s;opacity:0}@keyframes fade-in-47faceda{0%{opacity:0}70%{opacity:0}to{opacity:1}}@keyframes rotate-47faceda{0%{transform:scale(5) rotate(0)}to{transform:scale(5) rotate(360deg)}}.scalar-codeblock-pre{margin:0;padding:.5rem;overflow:auto;background:transparent;text-wrap:nowrap;white-space-collapse:preserve;border-radius:0}.scalar-input-wrapper-focus .scalar-input-label[data-v-94574cc9]{color:var(--scalar-color-1)}.scalar-input-wrapper-error .scalar-input-label[data-v-94574cc9]{color:var(--scalar-color-error-color)}.scalar-input[data-v-94574cc9]::-moz-selection{color:var(--scalar-color-1);background:#ffa55859}.scalar-input[data-v-94574cc9]::selection{color:var(--scalar-color-1);background:#ffa55859}.scalar-input[data-v-94574cc9]:has(+.scalar-input-label){opacity:0}.scalar-input[data-v-94574cc9]:not(:-moz-placeholder-shown){opacity:1;-moz-transition:opacity .2s ease-in-out .15s;transition:opacity .2s ease-in-out .15s}.scalar-input[data-v-94574cc9]:not(:placeholder-shown),.scalar-input-wrapper-focus .scalar-input[data-v-94574cc9]{opacity:1;transition:opacity .2s ease-in-out .15s}.scalar-input[data-v-94574cc9]:-webkit-autofill,.scalar-input[data-v-94574cc9]:-webkit-autofill:hover,.scalar-input[data-v-94574cc9]:-webkit-autofill:focus,.scalar-input[data-v-94574cc9]:-webkit-autofill:active,.scalar-input[data-v-94574cc9]:focus-within:-webkit-autofill,.scalar-input[data-v-94574cc9]:focus-within:-webkit-autofill:hover,.scalar-input[data-v-94574cc9]:focus-within:-webkit-autofill:focus,.scalar-input[data-v-94574cc9]:focus-within:-webkit-autofill:active{-webkit-box-shadow:0 0 0px 1000px var(--scalar-background-1) inset!important;-webkit-text-fill-color:var(--scalar-color-1);color:var(--scalar-color-1);border-radius:var(--scalar-radius)}.scalar-input:not(:-moz-placeholder-shown)+.scalar-input-label[data-v-94574cc9]{transform:translate3d(0,-20px,0) scale(.8);transform-origin:top left}.scalar-input-wrapper-focus .scalar-input-label[data-v-94574cc9],.scalar-input:not(:placeholder-shown)+.scalar-input-label[data-v-94574cc9]{transform:translate3d(0,-20px,0) scale(.8);transform-origin:top left}.scalar-input-wrapper-focus:has(button:active) .scalar-input-label[data-v-94574cc9]{color:var(--scalar-color-3)!important}

package/package.json

@@ -10,7 +10,7 @@
     "url": "https://github.com/scalar/scalar.git",
     "directory": "packages/components"
   },
-  "version": "0.11.6",
+  "version": "0.12.1",
   "engines": {
     "node": ">=18"
   },
@@ -36,10 +36,11 @@
     "@vueuse/core": "^10.10.0",
     "cva": "1.0.0-beta.1",
     "nanoid": "^5.0.7",
+    "radix-vue": "^1.8.4",
     "tailwind-merge": "^2.3.0",
     "vue": "^3.4.22",
     "@scalar/code-highlight": "0.0.4",
-    "@scalar/oas-utils": "0.2.3"
+    "@scalar/oas-utils": "0.2.4"
   },
   "devDependencies": {
     "@headlessui/tailwindcss": "^0.2.0",
@@ -73,8 +74,8 @@
     "vite-svg-loader": "^5.1.0",
     "vitest": "^1.6.0",
     "vue-tsc": "^2.0.13",
-    "@scalar/themes": "0.9.5",
-    "@scalar/build-tooling": "0.1.6"
+    "@scalar/build-tooling": "0.1.6",
+    "@scalar/themes": "0.9.5"
   },
   "scripts": {
     "build": "run-p typegen:icons types:check \"build-only {@}\" --",