@scalar/components 0.20.12 → 0.21.0

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

@@ -0,0 +1,55 @@
+import ScalarFloating_default from "../ScalarFloating/ScalarFloating.vue.js";
+import ScalarFloatingBackdrop_default from "../ScalarFloating/ScalarFloatingBackdrop.vue.js";
+import { useBindCx } from "@scalar/use-hooks/useBindCx";
+import { createBlock, createVNode, defineComponent, guardReactiveProps, mergeProps, normalizeProps, openBlock, renderSlot, unref, withCtx } from "vue";
+import { Popover, PopoverButton, PopoverPanel } from "@headlessui/vue";
+//#region src/components/ScalarPopover/ScalarPopover.vue?vue&type=script&setup=true&lang.ts
+var ScalarPopover_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "ScalarPopover",
+	props: {
+		focus: { type: Boolean },
+		placement: {},
+		offset: { type: [
+			Number,
+			Object,
+			Function
+		] },
+		resize: { type: Boolean },
+		target: {},
+		middleware: {},
+		teleport: { type: [Boolean, String] }
+	},
+	setup(__props) {
+		const { cx } = useBindCx();
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(Popover), { as: "template" }, {
+				default: withCtx(({ open }) => [createVNode(unref(ScalarFloating_default), normalizeProps(guardReactiveProps(_ctx.$props)), {
+					floating: withCtx(({ width, height }) => [createVNode(unref(PopoverPanel), mergeProps({
+						focus: __props.focus,
+						style: {
+							width,
+							height
+						}
+					}, unref(cx)("relative flex flex-col p-0.75")), {
+						default: withCtx(({ close }) => [renderSlot(_ctx.$slots, "popover", {
+							close: () => close(),
+							open
+						}), renderSlot(_ctx.$slots, "backdrop", { open }, () => [createVNode(unref(ScalarFloatingBackdrop_default))])]),
+						_: 2
+					}, 1040, ["focus", "style"])]),
+					default: withCtx(() => [createVNode(unref(PopoverButton), { as: "template" }, {
+						default: withCtx(() => [renderSlot(_ctx.$slots, "default", { open })]),
+						_: 2
+					}, 1024)]),
+					_: 2
+				}, 1040)]),
+				_: 3
+			});
+		};
+	}
+});
+//#endregion
+export { ScalarPopover_vue_vue_type_script_setup_true_lang_default as default };
+
+//# sourceMappingURL=ScalarPopover.vue.script.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ScalarPopover.vue.script.js","names":["$props"],"sources":["../../../src/components/ScalarPopover/ScalarPopover.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { Popover, PopoverButton, PopoverPanel } from '@headlessui/vue'\nimport { useBindCx } from '@scalar/use-hooks/useBindCx'\n\nimport {\n  ScalarFloating,\n  ScalarFloatingBackdrop,\n  type ScalarFloatingOptions,\n} from '../ScalarFloating'\nimport type { Slots } from './types'\n\ndefineProps<\n  {\n    /** Automatically focus the popover panel when it opens */\n    focus?: boolean\n  } & ScalarFloatingOptions\n>()\n\ndefineSlots<Slots>()\n\ndefineOptions({ inheritAttrs: false })\nconst { cx } = useBindCx()\n</script>\n<template>\n  <Popover\n    v-slot=\"{ open }\"\n    as=\"template\">\n    <ScalarFloating v-bind=\"$props\">\n      <PopoverButton as=\"template\">\n        <slot :open=\"open\" />\n      </PopoverButton>\n      <template #floating=\"{ width, height }\">\n        <PopoverPanel\n          v-slot=\"{ close }\"\n          :focus=\"focus\"\n          :style=\"{ width, height }\"\n          v-bind=\"cx('relative flex flex-col p-0.75')\">\n          <slot\n            :close=\"() => close()\"\n            name=\"popover\"\n            :open=\"open\" />\n          <slot\n            name=\"backdrop\"\n            :open=\"open\">\n            <ScalarFloatingBackdrop />\n          </slot>\n        </PopoverPanel>\n      </template>\n    </ScalarFloating>\n  </Popover>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;EAqBA,MAAM,EAAE,OAAO,WAAU;;uBAGvB,YAyBU,MAAA,QAAA,EAAA,EAvBR,IAAG,YAAU,EAAA;sBAsBI,EAvBP,WAAI,CAEd,YAqBiB,MAAA,uBAAA,EAAA,eAAA,mBArBOA,KAAAA,OAAM,CAAA,EAAA;KAIjB,UAAQ,SAeF,EAfM,OAAO,aAAM,CAClC,YAce,MAAA,aAAA,EAdf,WAce;MAZZ,OAAO,QAAA;MACP,OAAK;OAAI;OAAO;OAAM;QACf,MAAA,GAAE,CAAA,gCAAA,CAAA,EAAA;wBAIO,EAPP,YAAK,CAIf,WAGiB,KAAA,QAAA,WAAA;OAFd,aAAa,OAAK;OAEZ;UACT,WAIO,KAAA,QAAA,YAAA,EAFE,MAAI,QAEN,CADL,YAA0B,MAAA,+BAAA,CAAA,CAAA,CAAA,CAAA,CAAA;;;4BAdhB,CAFhB,YAEgB,MAAA,cAAA,EAAA,EAFD,IAAG,YAAU,EAAA;6BACL,CAArB,WAAqB,KAAA,QAAA,WAAA,EAAR,MAAI,CAAA,CAAA,CAAA"}

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

@@ -1,3 +1,3 @@
-export { default as ScalarPopover } from './ScalarPopover.vue';
+export { default as ScalarPopover } from './ScalarPopover.vue.js';
 export type { Slots as ScalarPopoverSlots } from './types';
 //# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1,7 @@
+import ScalarSearchInput_vue_vue_type_script_setup_true_lang_default from "./ScalarSearchInput.vue.script.js";
+//#region src/components/ScalarSearchInput/ScalarSearchInput.vue
+var ScalarSearchInput_default = ScalarSearchInput_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { ScalarSearchInput_default as default };
+
+//# sourceMappingURL=ScalarSearchInput.vue.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ScalarSearchInput.vue.js","names":[],"sources":["../../../src/components/ScalarSearchInput/ScalarSearchInput.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Scalar search input component\n *\n * Provides an large input field with a loading state and a clear button,\n * intended to be used with the ScalarSearchResults component.\n *\n * If you want a smaller input field for use in a sidebar, use\n * the ScalarSidebarSearchInput component instead.\n *\n * @example\n * <ScalarSearchInput v-model=\"search\" />\n */\nexport default {}\n</script>\n<script setup lang=\"ts\">\nimport { ScalarIconMagnifyingGlass, ScalarIconX } from '@scalar/icons'\nimport { useBindCx } from '@scalar/use-hooks/useBindCx'\nimport { ref } from 'vue'\n\nimport { ScalarIconButton } from '../ScalarIconButton'\nimport { type LoadingState, ScalarLoading } from '../ScalarLoading'\n\ndefineProps<{\n  loader?: LoadingState\n  label?: string\n}>()\n\nconst model = defineModel<string>()\n\nconst inputRef = ref<HTMLInputElement | null>(null)\n\nfunction handleClear() {\n  model.value = ''\n  // Push focus back to the input\n  if (inputRef.value) {\n    inputRef.value.focus()\n  }\n}\n\ndefineOptions({ inheritAttrs: false })\nconst { stylingAttrsCx, otherAttrs } = useBindCx()\n</script>\n<template>\n  <label\n    v-bind=\"\n      stylingAttrsCx(\n        'flex items-center text-lg font-medium h-10 pl-3 pr-1.5 py-2 gap-2.25',\n      )\n    \">\n    <ScalarIconMagnifyingGlass class=\"text-sidebar-c-search size-4\" />\n    <input\n      ref=\"inputRef\"\n      v-bind=\"otherAttrs\"\n      v-model=\"model\"\n      :aria-label=\"label ?? 'Enter search query'\"\n      autocapitalize=\"off\"\n      autocomplete=\"off\"\n      autocorrect=\"off\"\n      class=\"flex-1 appearance-none rounded border-none bg-transparent outline-none\"\n      placeholder=\"Search...\"\n      spellcheck=\"false\"\n      type=\"search\" />\n    <ScalarLoading\n      v-if=\"loader && loader.isActive\"\n      class=\"mr-1\"\n      :loader\n      size=\"lg\" />\n    <ScalarIconButton\n      v-else-if=\"model\"\n      class=\"-my-1\"\n      :icon=\"ScalarIconX\"\n      label=\"Clear Search\"\n      size=\"sm\"\n      weight=\"bold\"\n      @click.stop.prevent=\"handleClear\" />\n  </label>\n</template>\n"],"mappings":""}

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

@@ -0,0 +1,65 @@
+import ScalarLoading_default from "../ScalarLoading/ScalarLoading.vue.js";
+import ScalarIconButton_default from "../ScalarIconButton/ScalarIconButton.vue.js";
+import { useBindCx } from "@scalar/use-hooks/useBindCx";
+import { createBlock, createCommentVNode, createElementBlock, createElementVNode, createVNode, defineComponent, guardReactiveProps, mergeModels, mergeProps, normalizeProps, openBlock, ref, unref, useModel, vModelText, withDirectives, withModifiers } from "vue";
+import { ScalarIconMagnifyingGlass, ScalarIconX } from "@scalar/icons";
+//#region src/components/ScalarSearchInput/ScalarSearchInput.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = ["aria-label"];
+var ScalarSearchInput_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "ScalarSearchInput",
+	props: /* @__PURE__ */ mergeModels({
+		loader: {},
+		label: {}
+	}, {
+		"modelValue": {},
+		"modelModifiers": {}
+	}),
+	emits: ["update:modelValue"],
+	setup(__props) {
+		const model = useModel(__props, "modelValue");
+		const inputRef = ref(null);
+		function handleClear() {
+			model.value = "";
+			if (inputRef.value) inputRef.value.focus();
+		}
+		const { stylingAttrsCx, otherAttrs } = useBindCx();
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("label", normalizeProps(guardReactiveProps(unref(stylingAttrsCx)("flex items-center text-lg font-medium h-10 pl-3 pr-1.5 py-2 gap-2.25"))), [
+				createVNode(unref(ScalarIconMagnifyingGlass), { class: "text-sidebar-c-search size-4" }),
+				withDirectives(createElementVNode("input", mergeProps({
+					ref_key: "inputRef",
+					ref: inputRef
+				}, unref(otherAttrs), {
+					"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => model.value = $event),
+					"aria-label": __props.label ?? "Enter search query",
+					autocapitalize: "off",
+					autocomplete: "off",
+					autocorrect: "off",
+					class: "flex-1 appearance-none rounded border-none bg-transparent outline-none",
+					placeholder: "Search...",
+					spellcheck: "false",
+					type: "search"
+				}), null, 16, _hoisted_1), [[vModelText, model.value]]),
+				__props.loader && __props.loader.isActive ? (openBlock(), createBlock(unref(ScalarLoading_default), {
+					key: 0,
+					class: "mr-1",
+					loader: __props.loader,
+					size: "lg"
+				}, null, 8, ["loader"])) : model.value ? (openBlock(), createBlock(unref(ScalarIconButton_default), {
+					key: 1,
+					class: "-my-1",
+					icon: unref(ScalarIconX),
+					label: "Clear Search",
+					size: "sm",
+					weight: "bold",
+					onClick: withModifiers(handleClear, ["stop", "prevent"])
+				}, null, 8, ["icon"])) : createCommentVNode("", true)
+			], 16);
+		};
+	}
+});
+//#endregion
+export { ScalarSearchInput_vue_vue_type_script_setup_true_lang_default as default };
+
+//# sourceMappingURL=ScalarSearchInput.vue.script.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ScalarSearchInput.vue.script.js","names":[],"sources":["../../../src/components/ScalarSearchInput/ScalarSearchInput.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Scalar search input component\n *\n * Provides an large input field with a loading state and a clear button,\n * intended to be used with the ScalarSearchResults component.\n *\n * If you want a smaller input field for use in a sidebar, use\n * the ScalarSidebarSearchInput component instead.\n *\n * @example\n * <ScalarSearchInput v-model=\"search\" />\n */\nexport default {}\n</script>\n<script setup lang=\"ts\">\nimport { ScalarIconMagnifyingGlass, ScalarIconX } from '@scalar/icons'\nimport { useBindCx } from '@scalar/use-hooks/useBindCx'\nimport { ref } from 'vue'\n\nimport { ScalarIconButton } from '../ScalarIconButton'\nimport { type LoadingState, ScalarLoading } from '../ScalarLoading'\n\ndefineProps<{\n  loader?: LoadingState\n  label?: string\n}>()\n\nconst model = defineModel<string>()\n\nconst inputRef = ref<HTMLInputElement | null>(null)\n\nfunction handleClear() {\n  model.value = ''\n  // Push focus back to the input\n  if (inputRef.value) {\n    inputRef.value.focus()\n  }\n}\n\ndefineOptions({ inheritAttrs: false })\nconst { stylingAttrsCx, otherAttrs } = useBindCx()\n</script>\n<template>\n  <label\n    v-bind=\"\n      stylingAttrsCx(\n        'flex items-center text-lg font-medium h-10 pl-3 pr-1.5 py-2 gap-2.25',\n      )\n    \">\n    <ScalarIconMagnifyingGlass class=\"text-sidebar-c-search size-4\" />\n    <input\n      ref=\"inputRef\"\n      v-bind=\"otherAttrs\"\n      v-model=\"model\"\n      :aria-label=\"label ?? 'Enter search query'\"\n      autocapitalize=\"off\"\n      autocomplete=\"off\"\n      autocorrect=\"off\"\n      class=\"flex-1 appearance-none rounded border-none bg-transparent outline-none\"\n      placeholder=\"Search...\"\n      spellcheck=\"false\"\n      type=\"search\" />\n    <ScalarLoading\n      v-if=\"loader && loader.isActive\"\n      class=\"mr-1\"\n      :loader\n      size=\"lg\" />\n    <ScalarIconButton\n      v-else-if=\"model\"\n      class=\"-my-1\"\n      :icon=\"ScalarIconX\"\n      label=\"Clear Search\"\n      size=\"sm\"\n      weight=\"bold\"\n      @click.stop.prevent=\"handleClear\" />\n  </label>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;EA4BA,MAAM,QAAQ,SAAmB,SAAA,aAAC;EAElC,MAAM,WAAW,IAA6B,KAAI;EAElD,SAAS,cAAc;AACrB,SAAM,QAAQ;AAEd,OAAI,SAAS,MACX,UAAS,MAAM,OAAM;;EAKzB,MAAM,EAAE,gBAAgB,eAAe,WAAU;;uBAG/C,mBAgCQ,SAAA,eAAA,mBA/BS,MAAA,eAAc,CAAA,uEAAA,CAAA,CAAA,EAAA;IAK7B,YAAkE,MAAA,0BAAA,EAAA,EAAvC,OAAM,gCAA8B,CAAA;mBAC/D,mBAWkB,SAXlB,WAWkB;cAVZ;KAAJ,KAAI;OACI,MAAA,WAAU,EAAA;wEACJ,QAAA;KACb,cAAY,QAAA,SAAK;KAClB,gBAAe;KACf,cAAa;KACb,aAAY;KACZ,OAAM;KACN,aAAY;KACZ,YAAW;KACX,MAAK;6CARI,MAAA,MAAK,CAAA,CAAA;IAUR,QAAA,UAAU,QAAA,OAAO,YAAA,WAAA,EADzB,YAIc,MAAA,sBAAA,EAAA;;KAFZ,OAAM;KACL,QAAA,QAAA;KACD,MAAK;+BAEM,MAAA,SAAA,WAAA,EADb,YAOsC,MAAA,yBAAA,EAAA;;KALpC,OAAM;KACL,MAAM,MAAA,YAAW;KAClB,OAAM;KACN,MAAK;KACL,QAAO;KACN,SAAK,cAAe,aAAW,CAAA,QAAA,UAAA,CAAA"}

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

@@ -1,2 +1,2 @@
-export { default as ScalarSearchInput } from './ScalarSearchInput.vue';
+export { default as ScalarSearchInput } from './ScalarSearchInput.vue.js';
 //# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1,7 @@
+import ScalarSearchResultItem_vue_vue_type_script_setup_true_lang_default from "./ScalarSearchResultItem.vue.script.js";
+//#region src/components/ScalarSearchResults/ScalarSearchResultItem.vue
+var ScalarSearchResultItem_default = ScalarSearchResultItem_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { ScalarSearchResultItem_default as default };
+
+//# sourceMappingURL=ScalarSearchResultItem.vue.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ScalarSearchResultItem.vue.js","names":[],"sources":["../../../src/components/ScalarSearchResults/ScalarSearchResultItem.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { ScalarIconComponent } from '@scalar/icons/types'\nimport { useBindCx } from '@scalar/use-hooks/useBindCx'\n\nimport { type Icon, ScalarIconLegacyAdapter } from '../ScalarIcon'\n\ndefineProps<{\n  icon?: Icon | ScalarIconComponent\n  selected?: boolean\n}>()\n\ndefineOptions({ inheritAttrs: false })\nconst { cx } = useBindCx()\n</script>\n<template>\n  <a\n    :aria-selected=\"selected\"\n    role=\"option\"\n    tabindex=\"-1\"\n    v-bind=\"\n      cx(\n        'group flex cursor-pointer gap-2 rounded px-2 py-1.5 no-underline hover:bg-b-2 text-base/5',\n        { 'bg-b-2': selected },\n      )\n    \">\n    <!-- Icon -->\n    <div\n      v-if=\"icon\"\n      class=\"flex h-fit items-center text-sm font-medium text-c-3 group-hover:text-c-1\">\n      <slot name=\"icon\">\n        <ScalarIconLegacyAdapter\n          v-if=\"icon\"\n          class=\"size-4\"\n          :icon=\"icon\" />\n      </slot>\n      <span>&hairsp;</span>\n    </div>\n    <!-- Content -->\n    <div class=\"flex min-w-0 flex-1 flex-col gap-0.5\">\n      <div class=\"flex items-center gap-1\">\n        <div\n          class=\"flex-1 truncate zoomed:whitespace-normal! wrap-break-word font-medium\">\n          <slot />\n        </div>\n        <div\n          v-if=\"$slots.addon\"\n          class=\"text-base text-c-2\">\n          <slot name=\"addon\" />\n        </div>\n      </div>\n      <div\n        v-if=\"$slots.description\"\n        class=\"truncate zoomed:whitespace-normal! wrap-break-word text-c-2\">\n        <slot name=\"description\" />\n      </div>\n    </div>\n  </a>\n</template>\n"],"mappings":""}

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

@@ -0,0 +1,46 @@
+import ScalarIconLegacyAdapter_default from "../ScalarIcon/ScalarIconLegacyAdapter.vue.js";
+import { useBindCx } from "@scalar/use-hooks/useBindCx";
+import { createBlock, createCommentVNode, createElementBlock, createElementVNode, defineComponent, mergeProps, openBlock, renderSlot, unref } from "vue";
+//#region src/components/ScalarSearchResults/ScalarSearchResultItem.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = ["aria-selected"];
+var _hoisted_2 = {
+	key: 0,
+	class: "flex h-fit items-center text-sm font-medium text-c-3 group-hover:text-c-1"
+};
+var _hoisted_3 = { class: "flex min-w-0 flex-1 flex-col gap-0.5" };
+var _hoisted_4 = { class: "flex items-center gap-1" };
+var _hoisted_5 = { class: "flex-1 truncate zoomed:whitespace-normal! wrap-break-word font-medium" };
+var _hoisted_6 = {
+	key: 0,
+	class: "text-base text-c-2"
+};
+var _hoisted_7 = {
+	key: 0,
+	class: "truncate zoomed:whitespace-normal! wrap-break-word text-c-2"
+};
+var ScalarSearchResultItem_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "ScalarSearchResultItem",
+	props: {
+		icon: { type: [Object, Function] },
+		selected: { type: Boolean }
+	},
+	setup(__props) {
+		const { cx } = useBindCx();
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("a", mergeProps({
+				"aria-selected": __props.selected,
+				role: "option",
+				tabindex: "-1"
+			}, unref(cx)("group flex cursor-pointer gap-2 rounded px-2 py-1.5 no-underline hover:bg-b-2 text-base/5", { "bg-b-2": __props.selected })), [__props.icon ? (openBlock(), createElementBlock("div", _hoisted_2, [renderSlot(_ctx.$slots, "icon", {}, () => [__props.icon ? (openBlock(), createBlock(unref(ScalarIconLegacyAdapter_default), {
+				key: 0,
+				class: "size-4",
+				icon: __props.icon
+			}, null, 8, ["icon"])) : createCommentVNode("", true)]), _cache[0] || (_cache[0] = createElementVNode("span", null, " ", -1))])) : createCommentVNode("", true), createElementVNode("div", _hoisted_3, [createElementVNode("div", _hoisted_4, [createElementVNode("div", _hoisted_5, [renderSlot(_ctx.$slots, "default")]), _ctx.$slots.addon ? (openBlock(), createElementBlock("div", _hoisted_6, [renderSlot(_ctx.$slots, "addon")])) : createCommentVNode("", true)]), _ctx.$slots.description ? (openBlock(), createElementBlock("div", _hoisted_7, [renderSlot(_ctx.$slots, "description")])) : createCommentVNode("", true)])], 16, _hoisted_1);
+		};
+	}
+});
+//#endregion
+export { ScalarSearchResultItem_vue_vue_type_script_setup_true_lang_default as default };
+
+//# sourceMappingURL=ScalarSearchResultItem.vue.script.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ScalarSearchResultItem.vue.script.js","names":["$slots"],"sources":["../../../src/components/ScalarSearchResults/ScalarSearchResultItem.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { ScalarIconComponent } from '@scalar/icons/types'\nimport { useBindCx } from '@scalar/use-hooks/useBindCx'\n\nimport { type Icon, ScalarIconLegacyAdapter } from '../ScalarIcon'\n\ndefineProps<{\n  icon?: Icon | ScalarIconComponent\n  selected?: boolean\n}>()\n\ndefineOptions({ inheritAttrs: false })\nconst { cx } = useBindCx()\n</script>\n<template>\n  <a\n    :aria-selected=\"selected\"\n    role=\"option\"\n    tabindex=\"-1\"\n    v-bind=\"\n      cx(\n        'group flex cursor-pointer gap-2 rounded px-2 py-1.5 no-underline hover:bg-b-2 text-base/5',\n        { 'bg-b-2': selected },\n      )\n    \">\n    <!-- Icon -->\n    <div\n      v-if=\"icon\"\n      class=\"flex h-fit items-center text-sm font-medium text-c-3 group-hover:text-c-1\">\n      <slot name=\"icon\">\n        <ScalarIconLegacyAdapter\n          v-if=\"icon\"\n          class=\"size-4\"\n          :icon=\"icon\" />\n      </slot>\n      <span>&hairsp;</span>\n    </div>\n    <!-- Content -->\n    <div class=\"flex min-w-0 flex-1 flex-col gap-0.5\">\n      <div class=\"flex items-center gap-1\">\n        <div\n          class=\"flex-1 truncate zoomed:whitespace-normal! wrap-break-word font-medium\">\n          <slot />\n        </div>\n        <div\n          v-if=\"$slots.addon\"\n          class=\"text-base text-c-2\">\n          <slot name=\"addon\" />\n        </div>\n      </div>\n      <div\n        v-if=\"$slots.description\"\n        class=\"truncate zoomed:whitespace-normal! wrap-break-word text-c-2\">\n        <slot name=\"description\" />\n      </div>\n    </div>\n  </a>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;EAYA,MAAM,EAAE,OAAO,WAAU;;uBAGvB,mBAyCI,KAzCJ,WAyCI;IAxCD,iBAAe,QAAA;IAChB,MAAK;IACL,UAAS;MACM,MAAA,GAAE,CAAA,6FAAA,EAAA,UAA2H,QAAA,UAAQ,CAAA,CAAA,EAAA,CAQ5I,QAAA,QAAA,WAAA,EADR,mBAUM,OAVN,YAUM,CAPJ,WAKO,KAAA,QAAA,QAAA,EAAA,QAAA,CAHG,QAAA,QAAA,WAAA,EADR,YAGiB,MAAA,gCAAA,EAAA;;IADf,OAAM;IACL,MAAM,QAAA;sFAEX,mBAAqB,QAAA,MAAf,KAAQ,GAAA,EAAA,CAAA,IAAA,mBAAA,IAAA,KAAA,EAGhB,mBAiBM,OAjBN,YAiBM,CAhBJ,mBAUM,OAVN,YAUM,CATJ,mBAGM,OAHN,YAGM,CADJ,WAAQ,KAAA,QAAA,UAAA,CAAA,CAAA,EAGFA,KAAAA,OAAO,SAAA,WAAA,EADf,mBAIM,OAJN,YAIM,CADJ,WAAqB,KAAA,QAAA,QAAA,CAAA,CAAA,IAAA,mBAAA,IAAA,KAAA,CAAA,CAAA,EAIjBA,KAAAA,OAAO,eAAA,WAAA,EADf,mBAIM,OAJN,YAIM,CADJ,WAA2B,KAAA,QAAA,cAAA,CAAA,CAAA,IAAA,mBAAA,IAAA,KAAA,CAAA,CAAA,CAAA,EAAA,IAAA,WAAA"}

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

@@ -0,0 +1,7 @@
+import ScalarSearchResultList_vue_vue_type_script_setup_true_lang_default from "./ScalarSearchResultList.vue.script.js";
+//#region src/components/ScalarSearchResults/ScalarSearchResultList.vue
+var ScalarSearchResultList_default = ScalarSearchResultList_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { ScalarSearchResultList_default as default };
+
+//# sourceMappingURL=ScalarSearchResultList.vue.js.map

package/dist/components/ScalarSearchResults/ScalarSearchResultList.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ScalarSearchResultList.vue.js","names":[],"sources":["../../../src/components/ScalarSearchResults/ScalarSearchResultList.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { useBindCx } from '@scalar/use-hooks/useBindCx'\n\ndefineProps<{\n  noResults?: boolean\n}>()\n\ndefineOptions({ inheritAttrs: false })\nconst { cx } = useBindCx()\n</script>\n<template>\n  <div\n    role=\"listbox\"\n    v-bind=\"cx('flex flex-col')\">\n    <slot\n      v-if=\"noResults\"\n      name=\"noResults\">\n      <div class=\"flex flex-col items-center gap-2 px-3 py-4\">\n        <div\n          class=\"text-base font-medium text-c-2\"\n          role=\"alert\">\n          No results found\n        </div>\n      </div>\n    </slot>\n    <slot />\n  </div>\n</template>\n"],"mappings":""}

package/dist/components/ScalarSearchResults/ScalarSearchResultList.vue.script.js

@@ -0,0 +1,21 @@
+import { useBindCx } from "@scalar/use-hooks/useBindCx";
+import { createCommentVNode, createElementBlock, createElementVNode, defineComponent, mergeProps, openBlock, renderSlot, unref } from "vue";
+//#region src/components/ScalarSearchResults/ScalarSearchResultList.vue?vue&type=script&setup=true&lang.ts
+var ScalarSearchResultList_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "ScalarSearchResultList",
+	props: { noResults: { type: Boolean } },
+	setup(__props) {
+		const { cx } = useBindCx();
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", mergeProps({ role: "listbox" }, unref(cx)("flex flex-col")), [__props.noResults ? renderSlot(_ctx.$slots, "noResults", { key: 0 }, () => [_cache[0] || (_cache[0] = createElementVNode("div", { class: "flex flex-col items-center gap-2 px-3 py-4" }, [createElementVNode("div", {
+				class: "text-base font-medium text-c-2",
+				role: "alert"
+			}, " No results found ")], -1))]) : createCommentVNode("", true), renderSlot(_ctx.$slots, "default")], 16);
+		};
+	}
+});
+//#endregion
+export { ScalarSearchResultList_vue_vue_type_script_setup_true_lang_default as default };
+
+//# sourceMappingURL=ScalarSearchResultList.vue.script.js.map

package/dist/components/ScalarSearchResults/ScalarSearchResultList.vue.script.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ScalarSearchResultList.vue.script.js","names":[],"sources":["../../../src/components/ScalarSearchResults/ScalarSearchResultList.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { useBindCx } from '@scalar/use-hooks/useBindCx'\n\ndefineProps<{\n  noResults?: boolean\n}>()\n\ndefineOptions({ inheritAttrs: false })\nconst { cx } = useBindCx()\n</script>\n<template>\n  <div\n    role=\"listbox\"\n    v-bind=\"cx('flex flex-col')\">\n    <slot\n      v-if=\"noResults\"\n      name=\"noResults\">\n      <div class=\"flex flex-col items-center gap-2 px-3 py-4\">\n        <div\n          class=\"text-base font-medium text-c-2\"\n          role=\"alert\">\n          No results found\n        </div>\n      </div>\n    </slot>\n    <slot />\n  </div>\n</template>\n"],"mappings":";;;;;;;;EAQA,MAAM,EAAE,OAAO,WAAU;;uBAGvB,mBAeM,OAfN,WAeM,EAdJ,MAAK,WAAS,EACN,MAAA,GAAE,CAAA,gBAAA,CAAA,EAAA,CAEF,QAAA,YADR,WAUO,KAAA,QAAA,aAAA,EAAA,KAAA,GAAA,QAAA,CAAA,OAAA,OAAA,OAAA,KAPL,mBAMM,OAAA,EAND,OAAM,8CAA4C,EAAA,CACrD,mBAIM,OAAA;IAHJ,OAAM;IACN,MAAK;MAAQ,qBAEf,CAAA,EAAA,GAAA,EAAA,CAAA,GAAA,mBAAA,IAAA,KAAA,EAGJ,WAAQ,KAAA,QAAA,UAAA,CAAA,EAAA,GAAA"}

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

@@ -1,3 +1,3 @@
-export { default as ScalarSearchResultItem } from './ScalarSearchResultItem.vue';
-export { default as ScalarSearchResultList } from './ScalarSearchResultList.vue';
+export { default as ScalarSearchResultItem } from './ScalarSearchResultItem.vue.js';
+export { default as ScalarSearchResultList } from './ScalarSearchResultList.vue.js';
 //# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1,7 @@
+import ScalarSidebar_vue_vue_type_script_setup_true_lang_default from "./ScalarSidebar.vue.script.js";
+//#region src/components/ScalarSidebar/ScalarSidebar.vue
+var ScalarSidebar_default = ScalarSidebar_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { ScalarSidebar_default as default };
+
+//# sourceMappingURL=ScalarSidebar.vue.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ScalarSidebar.vue.js","names":[],"sources":["../../../src/components/ScalarSidebar/ScalarSidebar.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Scalar Sidebar component\n *\n * A sidebar for navigation and other content.\n *\n * @example\n *   <ScalarSidebar>\n *     <!-- Sidebar content -->\n *   </ScalarSidebar>\n */\nexport default {}\n</script>\n<script lang=\"ts\" setup>\nimport { useBindCx } from '@scalar/use-hooks/useBindCx'\n\ndefineOptions({ inheritAttrs: false })\nconst { cx } = useBindCx()\n</script>\n<template>\n  <aside\n    v-bind=\"\n      cx('flex flex-col border-r bg-sidebar-b-1 border-sidebar-border w-72')\n    \">\n    <slot />\n  </aside>\n</template>\n"],"mappings":""}

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

@@ -0,0 +1,16 @@
+import { useBindCx } from "@scalar/use-hooks/useBindCx";
+import { createElementBlock, defineComponent, guardReactiveProps, normalizeProps, openBlock, renderSlot, unref } from "vue";
+var ScalarSidebar_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "ScalarSidebar",
+	setup(__props) {
+		const { cx } = useBindCx();
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("aside", normalizeProps(guardReactiveProps(unref(cx)("flex flex-col border-r bg-sidebar-b-1 border-sidebar-border w-72"))), [renderSlot(_ctx.$slots, "default")], 16);
+		};
+	}
+});
+//#endregion
+export { ScalarSidebar_vue_vue_type_script_setup_true_lang_default as default };
+
+//# sourceMappingURL=ScalarSidebar.vue.script.js.map

package/dist/components/ScalarSidebar/ScalarSidebar.vue.script.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ScalarSidebar.vue.script.js","names":[],"sources":["../../../src/components/ScalarSidebar/ScalarSidebar.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Scalar Sidebar component\n *\n * A sidebar for navigation and other content.\n *\n * @example\n *   <ScalarSidebar>\n *     <!-- Sidebar content -->\n *   </ScalarSidebar>\n */\nexport default {}\n</script>\n<script lang=\"ts\" setup>\nimport { useBindCx } from '@scalar/use-hooks/useBindCx'\n\ndefineOptions({ inheritAttrs: false })\nconst { cx } = useBindCx()\n</script>\n<template>\n  <aside\n    v-bind=\"\n      cx('flex flex-col border-r bg-sidebar-b-1 border-sidebar-border w-72')\n    \">\n    <slot />\n  </aside>\n</template>\n"],"mappings":";;;;;;EAiBA,MAAM,EAAE,OAAO,WAAU;;uBAGvB,mBAKQ,SAAA,eAAA,mBAJS,MAAA,GAAE,CAAA,mEAAA,CAAA,CAAA,EAAA,CAGjB,WAAQ,KAAA,QAAA,UAAA,CAAA,EAAA,GAAA"}

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

@@ -0,0 +1,7 @@
+import ScalarSidebarButton_vue_vue_type_script_setup_true_lang_default from "./ScalarSidebarButton.vue.script.js";
+//#region src/components/ScalarSidebar/ScalarSidebarButton.vue
+var ScalarSidebarButton_default = ScalarSidebarButton_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { ScalarSidebarButton_default as default };
+
+//# sourceMappingURL=ScalarSidebarButton.vue.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ScalarSidebarButton.vue.js","names":[],"sources":["../../../src/components/ScalarSidebar/ScalarSidebarButton.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Scalar Sidebar Button component\n *\n * Provide a styled link for the ScalarSidebar or similar, supports\n * the same props and slots as ScalarSidebarItem\n *\n * This is used internally by the ScalarSidebarItem component\n *\n * If you're looking to create items in ScalarSidebarItems\n * you probably want the ScalarSidebarItem component\n *\n * @example\n *   <ScalarSidebarButton>\n *     <template #icon>\n *       <!-- Overrides the icon slot -->\n *     </template>\n *     <!-- Button text -->\n *     <template #aside>\n *       <!-- After the button text -->\n *     </template>\n *   </ScalarSidebarButton>\n */\nexport default {}\n</script>\n<script setup lang=\"ts\">\nimport { cva, useBindCx } from '@scalar/use-hooks/useBindCx'\n\nimport { ScalarIconLegacyAdapter } from '../ScalarIcon'\nimport ScalarSidebarIndent from './ScalarSidebarIndent.vue'\nimport type { ScalarSidebarButtonSlots, ScalarSidebarItemProps } from './types'\n\nconst { is = 'a', indent = 0 } = defineProps<ScalarSidebarItemProps>()\n\ndefineSlots<ScalarSidebarButtonSlots>()\n\nconst variants = cva({\n  base: [\n    'group/button peer/button flex items-stretch rounded p-2',\n    'font-sidebar text-base/4  text-sidebar-c-2 no-underline wrap-break-word',\n  ],\n  variants: {\n    active: { true: 'text-sidebar-c-active font-sidebar-active' },\n    disabled: { true: 'cursor-auto' },\n    selected: {\n      true: 'cursor-auto bg-sidebar-b-active text-sidebar-c-active font-sidebar-active',\n    },\n  },\n  compoundVariants: [\n    {\n      selected: false,\n      disabled: false,\n      active: false,\n      class: 'hover:bg-sidebar-b-hover hover:text-sidebar-c-hover',\n    },\n    {\n      selected: false,\n      disabled: false,\n      active: true,\n      class: 'hover:bg-sidebar-b-hover',\n    },\n  ],\n  defaultVariants: { selected: false, disabled: false, active: false },\n})\ndefineOptions({ inheritAttrs: false })\nconst { cx } = useBindCx()\n</script>\n<template>\n  <component\n    :is=\"is\"\n    :aria-selected=\"selected\"\n    :type=\"is === 'button' ? 'button' : undefined\"\n    v-bind=\"cx(variants({ selected, disabled, active }))\">\n    <slot name=\"indent\">\n      <ScalarSidebarIndent\n        class=\"-my-2\"\n        :disabled\n        :indent\n        :selected />\n    </slot>\n    <div\n      v-if=\"icon || $slots.icon\"\n      class=\"h-lh *:size-4 mr-1 flex items-center\">\n      <slot name=\"icon\">\n        <ScalarIconLegacyAdapter\n          v-if=\"icon\"\n          :icon=\"icon\" />\n      </slot>\n    </div>\n    <div class=\"group/button-label flex-1 min-w-0\">\n      <slot />\n    </div>\n    <slot name=\"aside\" />\n  </component>\n</template>\n"],"mappings":""}

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

@@ -0,0 +1,83 @@
+import ScalarIconLegacyAdapter_default from "../ScalarIcon/ScalarIconLegacyAdapter.vue.js";
+import ScalarSidebarIndent_default from "./ScalarSidebarIndent.vue.js";
+import { cva, useBindCx } from "@scalar/use-hooks/useBindCx";
+import { createBlock, createCommentVNode, createElementBlock, createElementVNode, createVNode, defineComponent, mergeProps, openBlock, renderSlot, resolveDynamicComponent, unref, withCtx } from "vue";
+//#region src/components/ScalarSidebar/ScalarSidebarButton.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = {
+	key: 0,
+	class: "h-lh *:size-4 mr-1 flex items-center"
+};
+var _hoisted_2 = { class: "group/button-label flex-1 min-w-0" };
+var ScalarSidebarButton_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "ScalarSidebarButton",
+	props: {
+		is: { default: "a" },
+		icon: { type: [Object, Function] },
+		active: { type: Boolean },
+		selected: { type: Boolean },
+		disabled: { type: Boolean },
+		indent: { default: 0 }
+	},
+	setup(__props) {
+		const variants = cva({
+			base: ["group/button peer/button flex items-stretch rounded p-2", "font-sidebar text-base/4  text-sidebar-c-2 no-underline wrap-break-word"],
+			variants: {
+				active: { true: "text-sidebar-c-active font-sidebar-active" },
+				disabled: { true: "cursor-auto" },
+				selected: { true: "cursor-auto bg-sidebar-b-active text-sidebar-c-active font-sidebar-active" }
+			},
+			compoundVariants: [{
+				selected: false,
+				disabled: false,
+				active: false,
+				class: "hover:bg-sidebar-b-hover hover:text-sidebar-c-hover"
+			}, {
+				selected: false,
+				disabled: false,
+				active: true,
+				class: "hover:bg-sidebar-b-hover"
+			}],
+			defaultVariants: {
+				selected: false,
+				disabled: false,
+				active: false
+			}
+		});
+		const { cx } = useBindCx();
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(resolveDynamicComponent(__props.is), mergeProps({
+				"aria-selected": __props.selected,
+				type: __props.is === "button" ? "button" : void 0
+			}, unref(cx)(unref(variants)({
+				selected: __props.selected,
+				disabled: __props.disabled,
+				active: __props.active
+			}))), {
+				default: withCtx(() => [
+					renderSlot(_ctx.$slots, "indent", {}, () => [createVNode(ScalarSidebarIndent_default, {
+						class: "-my-2",
+						disabled: __props.disabled,
+						indent: __props.indent,
+						selected: __props.selected
+					}, null, 8, [
+						"disabled",
+						"indent",
+						"selected"
+					])]),
+					__props.icon || _ctx.$slots.icon ? (openBlock(), createElementBlock("div", _hoisted_1, [renderSlot(_ctx.$slots, "icon", {}, () => [__props.icon ? (openBlock(), createBlock(unref(ScalarIconLegacyAdapter_default), {
+						key: 0,
+						icon: __props.icon
+					}, null, 8, ["icon"])) : createCommentVNode("", true)])])) : createCommentVNode("", true),
+					createElementVNode("div", _hoisted_2, [renderSlot(_ctx.$slots, "default")]),
+					renderSlot(_ctx.$slots, "aside")
+				]),
+				_: 3
+			}, 16, ["aria-selected", "type"]);
+		};
+	}
+});
+//#endregion
+export { ScalarSidebarButton_vue_vue_type_script_setup_true_lang_default as default };
+
+//# sourceMappingURL=ScalarSidebarButton.vue.script.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ScalarSidebarButton.vue.script.js","names":["$slots"],"sources":["../../../src/components/ScalarSidebar/ScalarSidebarButton.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Scalar Sidebar Button component\n *\n * Provide a styled link for the ScalarSidebar or similar, supports\n * the same props and slots as ScalarSidebarItem\n *\n * This is used internally by the ScalarSidebarItem component\n *\n * If you're looking to create items in ScalarSidebarItems\n * you probably want the ScalarSidebarItem component\n *\n * @example\n *   <ScalarSidebarButton>\n *     <template #icon>\n *       <!-- Overrides the icon slot -->\n *     </template>\n *     <!-- Button text -->\n *     <template #aside>\n *       <!-- After the button text -->\n *     </template>\n *   </ScalarSidebarButton>\n */\nexport default {}\n</script>\n<script setup lang=\"ts\">\nimport { cva, useBindCx } from '@scalar/use-hooks/useBindCx'\n\nimport { ScalarIconLegacyAdapter } from '../ScalarIcon'\nimport ScalarSidebarIndent from './ScalarSidebarIndent.vue'\nimport type { ScalarSidebarButtonSlots, ScalarSidebarItemProps } from './types'\n\nconst { is = 'a', indent = 0 } = defineProps<ScalarSidebarItemProps>()\n\ndefineSlots<ScalarSidebarButtonSlots>()\n\nconst variants = cva({\n  base: [\n    'group/button peer/button flex items-stretch rounded p-2',\n    'font-sidebar text-base/4  text-sidebar-c-2 no-underline wrap-break-word',\n  ],\n  variants: {\n    active: { true: 'text-sidebar-c-active font-sidebar-active' },\n    disabled: { true: 'cursor-auto' },\n    selected: {\n      true: 'cursor-auto bg-sidebar-b-active text-sidebar-c-active font-sidebar-active',\n    },\n  },\n  compoundVariants: [\n    {\n      selected: false,\n      disabled: false,\n      active: false,\n      class: 'hover:bg-sidebar-b-hover hover:text-sidebar-c-hover',\n    },\n    {\n      selected: false,\n      disabled: false,\n      active: true,\n      class: 'hover:bg-sidebar-b-hover',\n    },\n  ],\n  defaultVariants: { selected: false, disabled: false, active: false },\n})\ndefineOptions({ inheritAttrs: false })\nconst { cx } = useBindCx()\n</script>\n<template>\n  <component\n    :is=\"is\"\n    :aria-selected=\"selected\"\n    :type=\"is === 'button' ? 'button' : undefined\"\n    v-bind=\"cx(variants({ selected, disabled, active }))\">\n    <slot name=\"indent\">\n      <ScalarSidebarIndent\n        class=\"-my-2\"\n        :disabled\n        :indent\n        :selected />\n    </slot>\n    <div\n      v-if=\"icon || $slots.icon\"\n      class=\"h-lh *:size-4 mr-1 flex items-center\">\n      <slot name=\"icon\">\n        <ScalarIconLegacyAdapter\n          v-if=\"icon\"\n          :icon=\"icon\" />\n      </slot>\n    </div>\n    <div class=\"group/button-label flex-1 min-w-0\">\n      <slot />\n    </div>\n    <slot name=\"aside\" />\n  </component>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;EAoCA,MAAM,WAAW,IAAI;GACnB,MAAM,CACJ,2DACA,0EACD;GACD,UAAU;IACR,QAAQ,EAAE,MAAM,6CAA6C;IAC7D,UAAU,EAAE,MAAM,eAAe;IACjC,UAAU,EACR,MAAM,6EACP;IACF;GACD,kBAAkB,CAChB;IACE,UAAU;IACV,UAAU;IACV,QAAQ;IACR,OAAO;IACR,EACD;IACE,UAAU;IACV,UAAU;IACV,QAAQ;IACR,OAAO;IACR,CACF;GACD,iBAAiB;IAAE,UAAU;IAAO,UAAU;IAAO,QAAQ;IAAO;GACrE,CAAA;EAED,MAAM,EAAE,OAAO,WAAU;;uBAGvB,YAyBY,wBAxBL,QAAA,GAAE,EADT,WAyBY;IAvBT,iBAAe,QAAA;IACf,MAAM,QAAA,OAAE,WAAA,WAA2B,KAAA;MAC5B,MAAA,GAAE,CAAC,MAAA,SAAQ,CAAA;IAAA,UAAG,QAAA;IAAQ,UAAE,QAAA;IAAQ,QAAE,QAAA;IAAM,CAAA,CAAA,CAAA,EAAA;2BAOzC;KANP,WAMO,KAAA,QAAA,UAAA,EAAA,QAAA,CALL,YAIc,6BAAA;MAHZ,OAAM;MACL,UAAA,QAAA;MACA,QAAA,QAAA;MACA,UAAA,QAAA;;;;;;KAGG,QAAA,QAAQA,KAAAA,OAAO,QAAA,WAAA,EADvB,mBAQM,OARN,YAQM,CALJ,WAIO,KAAA,QAAA,QAAA,EAAA,QAAA,CAFG,QAAA,QAAA,WAAA,EADR,YAEiB,MAAA,gCAAA,EAAA;;MAAd,MAAM,QAAA;;KAGb,mBAEM,OAFN,YAEM,CADJ,WAAQ,KAAA,QAAA,UAAA,CAAA,CAAA;KAEV,WAAqB,KAAA,QAAA,QAAA"}

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

@@ -0,0 +1,7 @@
+import ScalarSidebarFooter_vue_vue_type_script_setup_true_lang_default from "./ScalarSidebarFooter.vue.script.js";
+//#region src/components/ScalarSidebar/ScalarSidebarFooter.vue
+var ScalarSidebarFooter_default = ScalarSidebarFooter_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { ScalarSidebarFooter_default as default };
+
+//# sourceMappingURL=ScalarSidebarFooter.vue.js.map

package/dist/components/ScalarSidebar/ScalarSidebarFooter.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ScalarSidebarFooter.vue.js","names":[],"sources":["../../../src/components/ScalarSidebar/ScalarSidebarFooter.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Scalar Sidebar Footer component\n *\n * A footer for the sidebar, be default it contains a\n * \"Powered by Scalar\" link and a {@link ScalarColorModeToggle} toggle.\n *\n * @example\n *   <ScalarSidebarFooter>\n *     <!-- Footer content at the top of the footer -->\n *     <template #description>\n *       <!-- Replaces the Powered by Scalar link -->\n *     </template>\n *     <template #toggle>\n *       <!-- Replaces the color mode toggle -->\n *     </template>\n *   </ScalarSidebarFooter>\n */\nexport default {}\n</script>\n<script lang=\"ts\" setup>\nimport { useBindCx } from '@scalar/use-hooks/useBindCx'\n\nimport { ScalarColorModeToggle } from '../ScalarColorModeToggle'\n\ndefineSlots<{\n  /** Footer content at the top of the footer */\n  default?(): unknown\n  /** Replaces the Powered by Scalar link */\n  description?(): unknown\n  /** Replaces the color mode toggle */\n  toggle?(): unknown\n}>()\n\ndefineOptions({ inheritAttrs: false })\nconst { cx } = useBindCx()\n</script>\n<template>\n  <div v-bind=\"cx('flex flex-col gap-3 p-3 pt-0 border-sidebar-border')\">\n    <slot />\n    <div class=\"flex items-center\">\n      <div class=\"flex-1 min-w-0 flex items-center text-sm text-sidebar-c-2\">\n        <slot name=\"description\">\n          <a\n            class=\"no-underline hover:underline\"\n            href=\"https://www.scalar.com\"\n            target=\"_blank\">\n            Powered by Scalar\n          </a>\n        </slot>\n      </div>\n      <slot name=\"toggle\">\n        <ScalarColorModeToggle />\n      </slot>\n    </div>\n  </div>\n</template>\n"],"mappings":""}

package/dist/components/ScalarSidebar/ScalarSidebarFooter.vue.script.js

@@ -0,0 +1,24 @@
+import ScalarColorModeToggle_default from "../ScalarColorModeToggle/ScalarColorModeToggle.vue.js";
+import { useBindCx } from "@scalar/use-hooks/useBindCx";
+import { createElementBlock, createElementVNode, createVNode, defineComponent, guardReactiveProps, normalizeProps, openBlock, renderSlot, unref } from "vue";
+//#region src/components/ScalarSidebar/ScalarSidebarFooter.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = { class: "flex items-center" };
+var _hoisted_2 = { class: "flex-1 min-w-0 flex items-center text-sm text-sidebar-c-2" };
+var ScalarSidebarFooter_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "ScalarSidebarFooter",
+	setup(__props) {
+		const { cx } = useBindCx();
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", normalizeProps(guardReactiveProps(unref(cx)("flex flex-col gap-3 p-3 pt-0 border-sidebar-border"))), [renderSlot(_ctx.$slots, "default"), createElementVNode("div", _hoisted_1, [createElementVNode("div", _hoisted_2, [renderSlot(_ctx.$slots, "description", {}, () => [_cache[0] || (_cache[0] = createElementVNode("a", {
+				class: "no-underline hover:underline",
+				href: "https://www.scalar.com",
+				target: "_blank"
+			}, " Powered by Scalar ", -1))])]), renderSlot(_ctx.$slots, "toggle", {}, () => [createVNode(unref(ScalarColorModeToggle_default))])])], 16);
+		};
+	}
+});
+//#endregion
+export { ScalarSidebarFooter_vue_vue_type_script_setup_true_lang_default as default };
+
+//# sourceMappingURL=ScalarSidebarFooter.vue.script.js.map

package/dist/components/ScalarSidebar/ScalarSidebarFooter.vue.script.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ScalarSidebarFooter.vue.script.js","names":[],"sources":["../../../src/components/ScalarSidebar/ScalarSidebarFooter.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Scalar Sidebar Footer component\n *\n * A footer for the sidebar, be default it contains a\n * \"Powered by Scalar\" link and a {@link ScalarColorModeToggle} toggle.\n *\n * @example\n *   <ScalarSidebarFooter>\n *     <!-- Footer content at the top of the footer -->\n *     <template #description>\n *       <!-- Replaces the Powered by Scalar link -->\n *     </template>\n *     <template #toggle>\n *       <!-- Replaces the color mode toggle -->\n *     </template>\n *   </ScalarSidebarFooter>\n */\nexport default {}\n</script>\n<script lang=\"ts\" setup>\nimport { useBindCx } from '@scalar/use-hooks/useBindCx'\n\nimport { ScalarColorModeToggle } from '../ScalarColorModeToggle'\n\ndefineSlots<{\n  /** Footer content at the top of the footer */\n  default?(): unknown\n  /** Replaces the Powered by Scalar link */\n  description?(): unknown\n  /** Replaces the color mode toggle */\n  toggle?(): unknown\n}>()\n\ndefineOptions({ inheritAttrs: false })\nconst { cx } = useBindCx()\n</script>\n<template>\n  <div v-bind=\"cx('flex flex-col gap-3 p-3 pt-0 border-sidebar-border')\">\n    <slot />\n    <div class=\"flex items-center\">\n      <div class=\"flex-1 min-w-0 flex items-center text-sm text-sidebar-c-2\">\n        <slot name=\"description\">\n          <a\n            class=\"no-underline hover:underline\"\n            href=\"https://www.scalar.com\"\n            target=\"_blank\">\n            Powered by Scalar\n          </a>\n        </slot>\n      </div>\n      <slot name=\"toggle\">\n        <ScalarColorModeToggle />\n      </slot>\n    </div>\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;EAmCA,MAAM,EAAE,OAAO,WAAU;;uBAGvB,mBAiBM,OAAA,eAAA,mBAjBO,MAAA,GAAE,CAAA,qDAAA,CAAA,CAAA,EAAA,CACb,WAAQ,KAAA,QAAA,UAAA,EACR,mBAcM,OAdN,YAcM,CAbJ,mBASM,OATN,YASM,CARJ,WAOO,KAAA,QAAA,eAAA,EAAA,QAAA,CAAA,OAAA,OAAA,OAAA,KANL,mBAKI,KAAA;IAJF,OAAM;IACN,MAAK;IACL,QAAO;MAAS,uBAElB,GAAA,EAAA,CAAA,CAAA,CAAA,EAGJ,WAEO,KAAA,QAAA,UAAA,EAAA,QAAA,CADL,YAAyB,MAAA,8BAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,EAAA,GAAA"}

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

@@ -0,0 +1,7 @@
+import ScalarSidebarGroup_vue_vue_type_script_setup_true_lang_default from "./ScalarSidebarGroup.vue.script.js";
+//#region src/components/ScalarSidebar/ScalarSidebarGroup.vue
+var ScalarSidebarGroup_default = ScalarSidebarGroup_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { ScalarSidebarGroup_default as default };
+
+//# sourceMappingURL=ScalarSidebarGroup.vue.js.map

package/dist/components/ScalarSidebar/ScalarSidebarGroup.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ScalarSidebarGroup.vue.js","names":[],"sources":["../../../src/components/ScalarSidebar/ScalarSidebarGroup.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Scalar Sidebar Group component\n *\n * A collapsible ScalarSidebarItem that can contain subitems.\n *\n * Classes applied to the component are passed to the inner list element.\n * Other attributes (like click event) are passed to the toggle button.\n *\n * @example\n * <ScalarSidebarGroup>\n *   <!-- Group toggle text -->\n *   <template #items>\n *     <ScalarSidebarItem>...</ScalarSidebarItem>\n *     <ScalarSidebarItem>...</ScalarSidebarItem>\n *     <ScalarSidebarItem>...</ScalarSidebarItem>\n *   </template>\n * </ScalarSidebarGroup>\n *\n *\n * By default the component has it's own internal open state, but this can be\n * controlled by passing the `controlled` prop and using binding the :open prop.\n *\n */\nexport default {}\n</script>\n<script setup lang=\"ts\">\nimport { useBindCx } from '@scalar/use-hooks/useBindCx'\n\nimport ScalarSidebarButton from './ScalarSidebarButton.vue'\nimport ScalarSidebarGroupToggle from './ScalarSidebarGroupToggle.vue'\nimport ScalarSidebarIndent from './ScalarSidebarIndent.vue'\nimport type { ScalarSidebarGroupProps, ScalarSidebarGroupSlots } from './types'\nimport { useSidebarGroups } from './useSidebarGroups'\n\nconst {\n  controlled,\n  discrete,\n  is = 'li',\n} = defineProps<ScalarSidebarGroupProps>()\n\nconst emit = defineEmits<{\n  /** Emitted when the group label is clicked */\n  (e: 'click', event: MouseEvent): void\n  /**\n   * Emitted when _only_ the group toggle button (caret) is clicked\n   *\n   * Note: This is only emitted if the group is discrete\n   */\n  (e: 'toggle', event: MouseEvent): void\n}>()\n\nconst open = defineModel<boolean>('open', { default: false })\n\ndefineSlots<ScalarSidebarGroupSlots>()\n\nconst { level } = useSidebarGroups({ increment: true })\n\ndefineOptions({ inheritAttrs: false })\nconst { cx } = useBindCx()\n\n/** Handle the click event for the group toggle */\nconst handleClick = (event: MouseEvent) => {\n  // Bubble up the click event\n  emit('click', event)\n  if (!controlled && !discrete) {\n    // Only toggle the open state if the group is uncontrolled and not discrete\n    open.value = !open.value\n  }\n}\n\n/** Handle the click event for the group toggle */\nconst handleToggle = (event: MouseEvent) => {\n  // Bubble up the toggle event\n  emit('toggle', event)\n  if (!controlled && discrete) {\n    // Only toggle the open state if the group is uncontrolled and not discrete\n    open.value = !open.value\n  }\n}\n</script>\n<template>\n  <component\n    v-bind=\"cx('group/item flex flex-col gap-px')\"\n    :is=\"is\">\n    <div class=\"group/group-button relative flex flex-col text-base\">\n      <slot\n        name=\"before\"\n        :open />\n      <slot\n        :level=\"level\"\n        name=\"button\"\n        :open>\n        <ScalarSidebarButton\n          is=\"button\"\n          :active\n          :aria-expanded=\"open\"\n          :disabled\n          :icon\n          :indent=\"level\"\n          :selected\n          @click=\"handleClick\">\n          <template #indent>\n            <ScalarSidebarIndent\n              class=\"mr-0 -my-2\"\n              :indent=\"level\"\n              :selected />\n          </template>\n          <template\n            v-if=\"$slots.icon\"\n            #icon>\n            <slot\n              name=\"icon\"\n              :open />\n          </template>\n          <template #aside>\n            <slot\n              name=\"aside\"\n              :open />\n            <div\n              v-if=\"discrete\"\n              class=\"size-4\">\n              <!-- Placeholder for discrete group toggle -->\n            </div>\n            <slot\n              v-else\n              name=\"toggle\"\n              :open>\n              <ScalarSidebarGroupToggle\n                class=\"text-sidebar-c-2\"\n                :open />\n            </slot>\n          </template>\n          <slot :open />\n        </ScalarSidebarButton>\n        <button\n          v-if=\"discrete\"\n          :aria-expanded=\"open\"\n          class=\"absolute top-[1lh] -translate-y-1/2 p-0.75 rounded right-1.25 text-sidebar-c-2\"\n          :class=\"\n            selected\n              ? 'hover:bg-sidebar-b-1 hover:text-sidebar-c-1'\n              : 'hover:bg-sidebar-b-hover hover:text-sidebar-c-hover'\n          \"\n          type=\"button\"\n          @click=\"handleToggle\">\n          <slot\n            name=\"toggle\"\n            :open>\n            <ScalarSidebarGroupToggle :open>\n              <template #label>\n                {{ open ? 'Close' : 'Open' }} <slot :open=\"open\" />\n              </template>\n            </ScalarSidebarGroupToggle>\n          </slot>\n        </button>\n      </slot>\n      <slot\n        name=\"after\"\n        :open />\n    </div>\n    <ul\n      v-if=\"open\"\n      class=\"group/items flex flex-col gap-px\">\n      <slot\n        name=\"items\"\n        :open />\n    </ul>\n  </component>\n</template>\n"],"mappings":""}