@scalar/components 0.20.12 → 0.21.0

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

@@ -0,0 +1,115 @@
+import ScalarSidebarIndent_default from "./ScalarSidebarIndent.vue.js";
+import ScalarSidebarButton_default from "./ScalarSidebarButton.vue.js";
+import ScalarSidebarGroupToggle_default from "./ScalarSidebarGroupToggle.vue.js";
+import { useSidebarGroups } from "./useSidebarGroups.js";
+import { useBindCx } from "@scalar/use-hooks/useBindCx";
+import { createBlock, createCommentVNode, createElementBlock, createElementVNode, createSlots, createTextVNode, createVNode, defineComponent, guardReactiveProps, mergeModels, normalizeClass, normalizeProps, openBlock, renderSlot, resolveDynamicComponent, toDisplayString, unref, useModel, withCtx } from "vue";
+//#region src/components/ScalarSidebar/ScalarSidebarGroup.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = { class: "group/group-button relative flex flex-col text-base" };
+var _hoisted_2 = {
+	key: 0,
+	class: "size-4"
+};
+var _hoisted_3 = ["aria-expanded"];
+var _hoisted_4 = {
+	key: 0,
+	class: "group/items flex flex-col gap-px"
+};
+var ScalarSidebarGroup_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "ScalarSidebarGroup",
+	props: /* @__PURE__ */ mergeModels({
+		is: { default: "li" },
+		icon: { type: [Object, Function] },
+		active: { type: Boolean },
+		selected: { type: Boolean },
+		disabled: { type: Boolean },
+		indent: {},
+		controlled: { type: Boolean },
+		discrete: { type: Boolean }
+	}, {
+		"open": {
+			type: Boolean,
+			default: false
+		},
+		"openModifiers": {}
+	}),
+	emits: /* @__PURE__ */ mergeModels(["click", "toggle"], ["update:open"]),
+	setup(__props, { emit: __emit }) {
+		const emit = __emit;
+		const open = useModel(__props, "open");
+		const { level } = useSidebarGroups({ increment: true });
+		const { cx } = useBindCx();
+		/** Handle the click event for the group toggle */
+		const handleClick = (event) => {
+			emit("click", event);
+			if (!__props.controlled && !__props.discrete) open.value = !open.value;
+		};
+		/** Handle the click event for the group toggle */
+		const handleToggle = (event) => {
+			emit("toggle", event);
+			if (!__props.controlled && __props.discrete) open.value = !open.value;
+		};
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(resolveDynamicComponent(__props.is), normalizeProps(guardReactiveProps(unref(cx)("group/item flex flex-col gap-px"))), {
+				default: withCtx(() => [createElementVNode("div", _hoisted_1, [
+					renderSlot(_ctx.$slots, "before", { open: open.value }),
+					renderSlot(_ctx.$slots, "button", {
+						level: unref(level),
+						open: open.value
+					}, () => [createVNode(ScalarSidebarButton_default, {
+						is: "button",
+						active: __props.active,
+						"aria-expanded": open.value,
+						disabled: __props.disabled,
+						icon: __props.icon,
+						indent: unref(level),
+						selected: __props.selected,
+						onClick: handleClick
+					}, createSlots({
+						indent: withCtx(() => [createVNode(ScalarSidebarIndent_default, {
+							class: "mr-0 -my-2",
+							indent: unref(level),
+							selected: __props.selected
+						}, null, 8, ["indent", "selected"])]),
+						aside: withCtx(() => [renderSlot(_ctx.$slots, "aside", { open: open.value }), __props.discrete ? (openBlock(), createElementBlock("div", _hoisted_2)) : renderSlot(_ctx.$slots, "toggle", {
+							key: 1,
+							open: open.value
+						}, () => [createVNode(ScalarSidebarGroupToggle_default, {
+							class: "text-sidebar-c-2",
+							open: open.value
+						}, null, 8, ["open"])])]),
+						default: withCtx(() => [renderSlot(_ctx.$slots, "default", { open: open.value })]),
+						_: 2
+					}, [_ctx.$slots.icon ? {
+						name: "icon",
+						fn: withCtx(() => [renderSlot(_ctx.$slots, "icon", { open: open.value })]),
+						key: "0"
+					} : void 0]), 1032, [
+						"active",
+						"aria-expanded",
+						"disabled",
+						"icon",
+						"indent",
+						"selected"
+					]), __props.discrete ? (openBlock(), createElementBlock("button", {
+						key: 0,
+						"aria-expanded": open.value,
+						class: normalizeClass(["absolute top-[1lh] -translate-y-1/2 p-0.75 rounded right-1.25 text-sidebar-c-2", __props.selected ? "hover:bg-sidebar-b-1 hover:text-sidebar-c-1" : "hover:bg-sidebar-b-hover hover:text-sidebar-c-hover"]),
+						type: "button",
+						onClick: handleToggle
+					}, [renderSlot(_ctx.$slots, "toggle", { open: open.value }, () => [createVNode(ScalarSidebarGroupToggle_default, { open: open.value }, {
+						label: withCtx(() => [createTextVNode(toDisplayString(open.value ? "Close" : "Open") + " ", 1), renderSlot(_ctx.$slots, "default", { open: open.value })]),
+						_: 3
+					}, 8, ["open"])])], 10, _hoisted_3)) : createCommentVNode("", true)]),
+					renderSlot(_ctx.$slots, "after", { open: open.value })
+				]), open.value ? (openBlock(), createElementBlock("ul", _hoisted_4, [renderSlot(_ctx.$slots, "items", { open: open.value })])) : createCommentVNode("", true)]),
+				_: 3
+			}, 16);
+		};
+	}
+});
+//#endregion
+export { ScalarSidebarGroup_vue_vue_type_script_setup_true_lang_default as default };
+
+//# sourceMappingURL=ScalarSidebarGroup.vue.script.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ScalarSidebarGroup.vue.script.js","names":["$slots"],"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":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAyCA,MAAM,OAAO;EAWb,MAAM,OAAO,SAAoB,SAAC,OAA0B;EAI5D,MAAM,EAAE,UAAU,iBAAiB,EAAE,WAAW,MAAM,CAAA;EAGtD,MAAM,EAAE,OAAO,WAAU;;EAGzB,MAAM,eAAe,UAAsB;AAEzC,QAAK,SAAS,MAAK;AACnB,OAAI,CAAC,QAAA,cAAc,CAAC,QAAA,SAElB,MAAK,QAAQ,CAAC,KAAK;;;EAKvB,MAAM,gBAAgB,UAAsB;AAE1C,QAAK,UAAU,MAAK;AACpB,OAAI,CAAC,QAAA,cAAc,QAAA,SAEjB,MAAK,QAAQ,CAAC,KAAK;;;uBAKrB,YAsFY,wBApFL,QAAA,GAAE,EAAA,eAAA,mBADC,MAAA,GAAE,CAAA,kCAAA,CAAA,CAAA,EAAA;2BA6EJ,CA3EN,mBA2EM,OA3EN,YA2EM;KA1EJ,WAEU,KAAA,QAAA,UAAA,EAAP,MAAA,KAAA,OAAI,CAAA;KACP,WAmEO,KAAA,QAAA,UAAA;MAlEJ,OAAO,MAAA,MAAK;MAEZ,MAAA,KAAA;cAgEI,CA/DL,YAyCsB,6BAAA;MAxCpB,IAAG;MACF,QAAA,QAAA;MACA,iBAAe,KAAA;MACf,UAAA,QAAA;MACA,MAAA,QAAA;MACA,QAAQ,MAAA,MAAK;MACb,UAAA,QAAA;MACA,SAAO;;MACG,QAAM,cAID,CAHd,YAGc,6BAAA;OAFZ,OAAM;OACL,QAAQ,MAAA,MAAK;OACb,UAAA,QAAA;;MASM,OAAK,cAGJ,CAFV,WAEU,KAAA,QAAA,SAAA,EAAP,MAAA,KAAA,OAAI,CAAA,EAEC,QAAA,YAAA,WAAA,EADR,mBAIM,OAJN,WAIM,IACN,WAOO,KAAA,QAAA,UAAA;;OAJJ,MAAA,KAAA;eAII,CAHL,YAEU,kCAAA;OADR,OAAM;OACL,MAAA,KAAA;;6BAGO,CAAd,WAAc,KAAA,QAAA,WAAA,EAAP,MAAA,KAAA,OAAI,CAAA,CAAA,CAAA;;SAxBHA,KAAAA,OAAO,OAAA;YACZ;wBAGS,CAFV,WAEU,KAAA,QAAA,QAAA,EAAP,MAAA,KAAA,OAAI,CAAA,CAAA,CAAA;;;;;;;;;SAuBH,QAAA,YAAA,WAAA,EADR,mBAoBS,UAAA;;MAlBN,iBAAe,KAAA;MAChB,OAAK,eAAA,CAAC,kFACe,QAAA,WAAA,gDAAA,sDAAA,CAAA;MAKrB,MAAK;MACJ,SAAO;SACR,WAQO,KAAA,QAAA,UAAA,EANJ,MAAA,KAAA,OAAI,QAMA,CALL,YAI2B,kCAAA,EAJA,MAAA,KAAA,OAAI,EAAA;MAClB,OAAK,cACe,CAAA,gBAAA,gBAA1B,KAAA,QAAI,UAAA,OAAA,GAAsB,KAAC,EAAA,EAAA,WAAqB,KAAA,QAAA,WAAA,EAAd,MAAM,KAAA,OAAI,CAAA,CAAA,CAAA;;;KAMzD,WAEU,KAAA,QAAA,SAAA,EAAP,MAAA,KAAA,OAAI,CAAA;QAGD,KAAA,SAAA,WAAA,EADR,mBAMK,MANL,YAMK,CAHH,WAEU,KAAA,QAAA,SAAA,EAAP,MAAA,KAAA,OAAI,CAAA,CAAA,CAAA,IAAA,mBAAA,IAAA,KAAA,CAAA,CAAA"}

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"ScalarSidebarGroupToggle.vue.js","names":[],"sources":["../../../src/components/ScalarSidebar/ScalarSidebarGroupToggle.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Scalar Sidebar Group toggle component\n *\n * Provides the toggle icon for a ScalarSidebarGroup\n *\n * @example\n * <ScalarSidebarGroupToggle :open=\"...\" />\n */\nexport default {}\n</script>\n<script setup lang=\"ts\">\nimport { ScalarIconCaretRight } from '@scalar/icons'\nimport type { ScalarIconComponent } from '@scalar/icons/types'\nimport { cva, useBindCx } from '@scalar/use-hooks/useBindCx'\nimport type { Component } from 'vue'\n\nimport { type Icon, ScalarIconLegacyAdapter } from '../ScalarIcon'\n\nconst { is = 'div', open = false } = defineProps<{\n  /** Override the element tag */\n  is?: Component | string\n  /** Whether or not the toggle is open */\n  open?: boolean\n  /** Overrides the icon */\n  icon?: Icon | ScalarIconComponent\n}>()\n\ndefineSlots<{\n  /** Override the toggle icon */\n  default?(props: { open: boolean }): unknown\n  /** Override the screen reader label */\n  label?(props: { open: boolean }): unknown\n}>()\n\nconst variants = cva({\n  base: 'size-4 flex items-center justify-center transition-transform duration-100',\n  variants: { open: { true: 'rotate-90' } },\n  defaultVariants: { open: false },\n})\ndefineOptions({ inheritAttrs: false })\nconst { cx } = useBindCx()\n</script>\n<template>\n  <component\n    :is=\"is\"\n    :type=\"is === 'button' ? 'button' : undefined\"\n    v-bind=\"cx(variants({ open }))\">\n    <slot :open=\"open\">\n      <ScalarIconLegacyAdapter\n        v-if=\"icon\"\n        :icon=\"icon\" />\n      <ScalarIconCaretRight\n        v-else\n        class=\"size-3\"\n        weight=\"bold\" />\n    </slot>\n    <span class=\"sr-only\">\n      <slot\n        name=\"label\"\n        :open=\"open\">\n        {{ open ? 'Close' : 'Open' }} Group\n      </slot>\n    </span>\n  </component>\n</template>\n"],"mappings":""}

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

@@ -0,0 +1,43 @@
+import ScalarIconLegacyAdapter_default from "../ScalarIcon/ScalarIconLegacyAdapter.vue.js";
+import { cva, useBindCx } from "@scalar/use-hooks/useBindCx";
+import { createBlock, createElementVNode, createTextVNode, defineComponent, mergeProps, openBlock, renderSlot, resolveDynamicComponent, toDisplayString, unref, withCtx } from "vue";
+import { ScalarIconCaretRight } from "@scalar/icons";
+//#region src/components/ScalarSidebar/ScalarSidebarGroupToggle.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = { class: "sr-only" };
+var ScalarSidebarGroupToggle_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "ScalarSidebarGroupToggle",
+	props: {
+		is: { default: "div" },
+		open: {
+			type: Boolean,
+			default: false
+		},
+		icon: { type: [Object, Function] }
+	},
+	setup(__props) {
+		const variants = cva({
+			base: "size-4 flex items-center justify-center transition-transform duration-100",
+			variants: { open: { true: "rotate-90" } },
+			defaultVariants: { open: false }
+		});
+		const { cx } = useBindCx();
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(resolveDynamicComponent(__props.is), mergeProps({ type: __props.is === "button" ? "button" : void 0 }, unref(cx)(unref(variants)({ open: __props.open }))), {
+				default: withCtx(() => [renderSlot(_ctx.$slots, "default", { open: __props.open }, () => [__props.icon ? (openBlock(), createBlock(unref(ScalarIconLegacyAdapter_default), {
+					key: 0,
+					icon: __props.icon
+				}, null, 8, ["icon"])) : (openBlock(), createBlock(unref(ScalarIconCaretRight), {
+					key: 1,
+					class: "size-3",
+					weight: "bold"
+				}))]), createElementVNode("span", _hoisted_1, [renderSlot(_ctx.$slots, "label", { open: __props.open }, () => [createTextVNode(toDisplayString(__props.open ? "Close" : "Open") + " Group ", 1)])])]),
+				_: 3
+			}, 16, ["type"]);
+		};
+	}
+});
+//#endregion
+export { ScalarSidebarGroupToggle_vue_vue_type_script_setup_true_lang_default as default };
+
+//# sourceMappingURL=ScalarSidebarGroupToggle.vue.script.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ScalarSidebarGroupToggle.vue.script.js","names":[],"sources":["../../../src/components/ScalarSidebar/ScalarSidebarGroupToggle.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Scalar Sidebar Group toggle component\n *\n * Provides the toggle icon for a ScalarSidebarGroup\n *\n * @example\n * <ScalarSidebarGroupToggle :open=\"...\" />\n */\nexport default {}\n</script>\n<script setup lang=\"ts\">\nimport { ScalarIconCaretRight } from '@scalar/icons'\nimport type { ScalarIconComponent } from '@scalar/icons/types'\nimport { cva, useBindCx } from '@scalar/use-hooks/useBindCx'\nimport type { Component } from 'vue'\n\nimport { type Icon, ScalarIconLegacyAdapter } from '../ScalarIcon'\n\nconst { is = 'div', open = false } = defineProps<{\n  /** Override the element tag */\n  is?: Component | string\n  /** Whether or not the toggle is open */\n  open?: boolean\n  /** Overrides the icon */\n  icon?: Icon | ScalarIconComponent\n}>()\n\ndefineSlots<{\n  /** Override the toggle icon */\n  default?(props: { open: boolean }): unknown\n  /** Override the screen reader label */\n  label?(props: { open: boolean }): unknown\n}>()\n\nconst variants = cva({\n  base: 'size-4 flex items-center justify-center transition-transform duration-100',\n  variants: { open: { true: 'rotate-90' } },\n  defaultVariants: { open: false },\n})\ndefineOptions({ inheritAttrs: false })\nconst { cx } = useBindCx()\n</script>\n<template>\n  <component\n    :is=\"is\"\n    :type=\"is === 'button' ? 'button' : undefined\"\n    v-bind=\"cx(variants({ open }))\">\n    <slot :open=\"open\">\n      <ScalarIconLegacyAdapter\n        v-if=\"icon\"\n        :icon=\"icon\" />\n      <ScalarIconCaretRight\n        v-else\n        class=\"size-3\"\n        weight=\"bold\" />\n    </slot>\n    <span class=\"sr-only\">\n      <slot\n        name=\"label\"\n        :open=\"open\">\n        {{ open ? 'Close' : 'Open' }} Group\n      </slot>\n    </span>\n  </component>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;EAmCA,MAAM,WAAW,IAAI;GACnB,MAAM;GACN,UAAU,EAAE,MAAM,EAAE,MAAM,aAAa,EAAE;GACzC,iBAAiB,EAAE,MAAM,OAAO;GACjC,CAAA;EAED,MAAM,EAAE,OAAO,WAAU;;uBAGvB,YAoBY,wBAnBL,QAAA,GAAE,EADT,WAoBY,EAlBT,MAAM,QAAA,OAAE,WAAA,WAA2B,KAAA,GAAA,EAC5B,MAAA,GAAE,CAAC,MAAA,SAAQ,CAAA,EAAA,MAAG,QAAA,MAAI,CAAA,CAAA,CAAA,EAAA;2BASnB,CARP,WAQO,KAAA,QAAA,WAAA,EARA,MAAM,QAAA,MAAI,QAQV,CANG,QAAA,QAAA,WAAA,EADR,YAEiB,MAAA,gCAAA,EAAA;;KAAd,MAAM,QAAA;2CACT,YAGkB,MAAA,qBAAA,EAAA;;KADhB,OAAM;KACN,QAAO;WAEX,mBAMO,QANP,YAMO,CALL,WAIO,KAAA,QAAA,SAAA,EAFJ,MAAM,QAAA,MAAI,QAEN,CAAA,gBAAA,gBADF,QAAA,OAAI,UAAA,OAAA,GAAsB,WAC/B,EAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA"}

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

@@ -1,4 +1,4 @@
-import type { SidebarGroupLevel } from './useSidebarGroups';
+import type { SidebarGroupLevel } from './useSidebarGroups.js';
 /**
  * Scalar Sidebar Indent component
  *

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

@@ -0,0 +1,9 @@
+import _plugin_vue_export_helper_default from "../../_virtual/_plugin-vue_export-helper.js";
+import ScalarSidebarIndent_vue_vue_type_script_setup_true_lang_default from "./ScalarSidebarIndent.vue.script.js";
+/* empty css                                  */
+//#region src/components/ScalarSidebar/ScalarSidebarIndent.vue
+var ScalarSidebarIndent_default = /* @__PURE__ */ _plugin_vue_export_helper_default(ScalarSidebarIndent_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-3e080c68"]]);
+//#endregion
+export { ScalarSidebarIndent_default as default };
+
+//# sourceMappingURL=ScalarSidebarIndent.vue.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ScalarSidebarIndent.vue.js","names":[],"sources":["../../../src/components/ScalarSidebar/ScalarSidebarIndent.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Scalar Sidebar Indent component\n *\n * @example\n *   <ScalarSidebarIndent :indent=\"1\" />\n */\nexport default {}\n</script>\n<script setup lang=\"ts\">\nimport { useBindCx } from '@scalar/use-hooks/useBindCx'\nimport { computed } from 'vue'\n\nimport type { SidebarGroupLevel } from './useSidebarGroups'\n\nconst { indent = 0, selected = false } = defineProps<{\n  /** The number of indents to render @default 0 */\n  indent?: SidebarGroupLevel\n  /** Whether the indent is selected @default false */\n  selected?: boolean\n  /** Whether the indent hover is disabled @default false */\n  disabled?: boolean\n}>()\n\nconst indents = computed<number[]>(() => {\n  return Array.from({ length: indent }, (_, i) => i)\n})\n\ndefineOptions({ inheritAttrs: false })\nconst { cx } = useBindCx()\n</script>\n<template>\n  <div\n    v-bind=\"\n      cx('scalar-sidebar-indent flex justify-center', {\n        'mr-[calc(20px-var(--scalar-sidebar-indent))]': indent > 0,\n        'scalar-sidebar-indent-selected': selected,\n      })\n    \">\n    <div\n      v-for=\"(block, index) in indents\"\n      :key=\"block\"\n      class=\"relative w-[var(--scalar-sidebar-indent)]\">\n      <!-- Indent Border -->\n      <div\n        class=\"scalar-sidebar-indent-border absolute left-2 inset-y-0 w-border bg-sidebar-indent-border\" />\n      <!-- Indent Border Active or Hover -->\n      <div\n        v-if=\"index === indents.length - 1\"\n        class=\"absolute left-2 inset-y-0 w-border\"\n        :class=\"\n          disabled\n            ? ''\n            : selected\n              ? 'bg-sidebar-indent-border-active'\n              : 'group-hover/button:bg-sidebar-indent-border-hover'\n        \" />\n    </div>\n  </div>\n</template>\n<style scoped>\n@reference \"../../style.css\";\n\n/* Add extra height to the indent border to account for the px spacing between the items */\n.group\\/item > * > .scalar-sidebar-indent .scalar-sidebar-indent-border {\n  @apply -inset-y-px;\n}\n\n/* Push the border down for the first item in a group */\n.group\\/item:first-child\n  > *\n  > .scalar-sidebar-indent\n  .scalar-sidebar-indent-border {\n  @apply top-0;\n}\n\n/* Push the border up for the last item in a group */\n.group\\/item:last-child\n  > *\n  > .scalar-sidebar-indent\n  .scalar-sidebar-indent-border {\n  @apply bottom-0;\n}\n</style>\n"],"mappings":""}

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

@@ -0,0 +1,38 @@
+import { useBindCx } from "@scalar/use-hooks/useBindCx";
+import { Fragment, computed, createCommentVNode, createElementBlock, createElementVNode, defineComponent, guardReactiveProps, normalizeClass, normalizeProps, openBlock, renderList, unref } from "vue";
+var ScalarSidebarIndent_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "ScalarSidebarIndent",
+	props: {
+		indent: { default: 0 },
+		selected: {
+			type: Boolean,
+			default: false
+		},
+		disabled: { type: Boolean }
+	},
+	setup(__props) {
+		const indents = computed(() => {
+			return Array.from({ length: __props.indent }, (_, i) => i);
+		});
+		const { cx } = useBindCx();
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", normalizeProps(guardReactiveProps(unref(cx)("scalar-sidebar-indent flex justify-center", {
+				"mr-[calc(20px-var(--scalar-sidebar-indent))]": __props.indent > 0,
+				"scalar-sidebar-indent-selected": __props.selected
+			}))), [(openBlock(true), createElementBlock(Fragment, null, renderList(indents.value, (block, index) => {
+				return openBlock(), createElementBlock("div", {
+					key: block,
+					class: "relative w-[var(--scalar-sidebar-indent)]"
+				}, [_cache[0] || (_cache[0] = createElementVNode("div", { class: "scalar-sidebar-indent-border absolute left-2 inset-y-0 w-border bg-sidebar-indent-border" }, null, -1)), index === indents.value.length - 1 ? (openBlock(), createElementBlock("div", {
+					key: 0,
+					class: normalizeClass(["absolute left-2 inset-y-0 w-border", __props.disabled ? "" : __props.selected ? "bg-sidebar-indent-border-active" : "group-hover/button:bg-sidebar-indent-border-hover"])
+				}, null, 2)) : createCommentVNode("", true)]);
+			}), 128))], 16);
+		};
+	}
+});
+//#endregion
+export { ScalarSidebarIndent_vue_vue_type_script_setup_true_lang_default as default };
+
+//# sourceMappingURL=ScalarSidebarIndent.vue.script.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ScalarSidebarIndent.vue.script.js","names":[],"sources":["../../../src/components/ScalarSidebar/ScalarSidebarIndent.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Scalar Sidebar Indent component\n *\n * @example\n *   <ScalarSidebarIndent :indent=\"1\" />\n */\nexport default {}\n</script>\n<script setup lang=\"ts\">\nimport { useBindCx } from '@scalar/use-hooks/useBindCx'\nimport { computed } from 'vue'\n\nimport type { SidebarGroupLevel } from './useSidebarGroups'\n\nconst { indent = 0, selected = false } = defineProps<{\n  /** The number of indents to render @default 0 */\n  indent?: SidebarGroupLevel\n  /** Whether the indent is selected @default false */\n  selected?: boolean\n  /** Whether the indent hover is disabled @default false */\n  disabled?: boolean\n}>()\n\nconst indents = computed<number[]>(() => {\n  return Array.from({ length: indent }, (_, i) => i)\n})\n\ndefineOptions({ inheritAttrs: false })\nconst { cx } = useBindCx()\n</script>\n<template>\n  <div\n    v-bind=\"\n      cx('scalar-sidebar-indent flex justify-center', {\n        'mr-[calc(20px-var(--scalar-sidebar-indent))]': indent > 0,\n        'scalar-sidebar-indent-selected': selected,\n      })\n    \">\n    <div\n      v-for=\"(block, index) in indents\"\n      :key=\"block\"\n      class=\"relative w-[var(--scalar-sidebar-indent)]\">\n      <!-- Indent Border -->\n      <div\n        class=\"scalar-sidebar-indent-border absolute left-2 inset-y-0 w-border bg-sidebar-indent-border\" />\n      <!-- Indent Border Active or Hover -->\n      <div\n        v-if=\"index === indents.length - 1\"\n        class=\"absolute left-2 inset-y-0 w-border\"\n        :class=\"\n          disabled\n            ? ''\n            : selected\n              ? 'bg-sidebar-indent-border-active'\n              : 'group-hover/button:bg-sidebar-indent-border-hover'\n        \" />\n    </div>\n  </div>\n</template>\n<style scoped>\n@reference \"../../style.css\";\n\n/* Add extra height to the indent border to account for the px spacing between the items */\n.group\\/item > * > .scalar-sidebar-indent .scalar-sidebar-indent-border {\n  @apply -inset-y-px;\n}\n\n/* Push the border down for the first item in a group */\n.group\\/item:first-child\n  > *\n  > .scalar-sidebar-indent\n  .scalar-sidebar-indent-border {\n  @apply top-0;\n}\n\n/* Push the border up for the last item in a group */\n.group\\/item:last-child\n  > *\n  > .scalar-sidebar-indent\n  .scalar-sidebar-indent-border {\n  @apply bottom-0;\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;EAwBA,MAAM,UAAU,eAAyB;AACvC,UAAO,MAAM,KAAK,EAAE,QAAQ,QAAA,QAAQ,GAAG,GAAG,MAAM,EAAC;IAClD;EAGD,MAAM,EAAE,OAAO,WAAU;;uBAGvB,mBA0BM,OAAA,eAAA,mBAzBW,MAAA,GAAE,CAAA,6CAAA;oDAAwG,QAAA,SAAM;sCAAgD,QAAA;4BAM/K,mBAkBM,UAAA,MAAA,WAjBqB,QAAA,QAAjB,OAAO,UAAK;wBADtB,mBAkBM,OAAA;KAhBH,KAAK;KACN,OAAM;kCAEN,mBACqG,OAAA,EAAnG,OAAM,4FAA0F,EAAA,MAAA,GAAA,GAG1F,UAAU,QAAA,MAAQ,SAAM,KAAA,WAAA,EADhC,mBASM,OAAA;;KAPJ,OAAK,eAAA,CAAC,sCACa,QAAA,WAAA,KAAwC,QAAA,WAAA,oCAAA,oDAAA,CAAA"}

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"ScalarSidebarItem.vue.js","names":[],"sources":["../../../src/components/ScalarSidebar/ScalarSidebarItem.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Scalar Sidebar Item component\n *\n * Provides a ScalarSidebarButton wrapped in an `<li>` to\n * meet accessibility requirements and automatically indents\n * the button based on the level of the sidebar group\n *\n * @example\n * <ScalarSidebarItem>\n *   <template #icon>\n *     <!-- Overrides the icon slot -->\n *   </template>\n *   <!-- Button text -->\n *   <template #aside>\n *     <!-- After the button text -->\n *   </template>\n *   <!-- Content to display before the button but inside the list item -->\n *   <template #before>\n *     <!-- Before the button -->\n *   </template>\n *   <!-- Content to display after the button but inside the list item -->\n *   <template #after>\n *     <!-- After the button -->\n *   </template>\n * </ScalarSidebarItem>\n */\nexport default {}\n</script>\n<script setup lang=\"ts\">\nimport { useBindCx } from '@scalar/use-hooks/useBindCx'\n\nimport ScalarSidebarButton from './ScalarSidebarButton.vue'\nimport type { ScalarSidebarItemProps, ScalarSidebarItemSlots } from './types'\nimport { useSidebarGroups } from './useSidebarGroups'\n\nconst props = defineProps<ScalarSidebarItemProps>()\n\ndefineSlots<ScalarSidebarItemSlots>()\n\nconst { level } = useSidebarGroups()\n\nconst { cx } = useBindCx()\ndefineOptions({ inheritAttrs: false })\n</script>\n<template>\n  <li v-bind=\"cx('group/item flex flex-col text-base')\">\n    <slot name=\"before\" />\n    <slot\n      :level=\"level\"\n      name=\"button\">\n      <ScalarSidebarButton\n        v-bind=\"props\"\n        :indent=\"indent ?? level\">\n        <!-- Pass through all the slots -->\n        <template\n          v-if=\"$slots.default\"\n          #default>\n          <slot />\n        </template>\n        <template\n          v-if=\"$slots.icon\"\n          #icon>\n          <slot name=\"icon\" />\n        </template>\n        <template\n          v-if=\"$slots.aside\"\n          #aside>\n          <slot name=\"aside\" />\n        </template>\n      </ScalarSidebarButton>\n    </slot>\n    <slot name=\"after\" />\n  </li>\n</template>\n"],"mappings":""}

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

@@ -0,0 +1,48 @@
+import ScalarSidebarButton_default from "./ScalarSidebarButton.vue.js";
+import { useSidebarGroups } from "./useSidebarGroups.js";
+import { useBindCx } from "@scalar/use-hooks/useBindCx";
+import { createElementBlock, createSlots, createVNode, defineComponent, guardReactiveProps, mergeProps, normalizeProps, openBlock, renderSlot, unref, withCtx } from "vue";
+var ScalarSidebarItem_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "ScalarSidebarItem",
+	props: {
+		is: {},
+		icon: { type: [Object, Function] },
+		active: { type: Boolean },
+		selected: { type: Boolean },
+		disabled: { type: Boolean },
+		indent: {}
+	},
+	setup(__props) {
+		const props = __props;
+		const { level } = useSidebarGroups();
+		const { cx } = useBindCx();
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("li", normalizeProps(guardReactiveProps(unref(cx)("group/item flex flex-col text-base"))), [
+				renderSlot(_ctx.$slots, "before"),
+				renderSlot(_ctx.$slots, "button", { level: unref(level) }, () => [createVNode(ScalarSidebarButton_default, mergeProps(props, { indent: __props.indent ?? unref(level) }), createSlots({ _: 2 }, [
+					_ctx.$slots.default ? {
+						name: "default",
+						fn: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
+						key: "0"
+					} : void 0,
+					_ctx.$slots.icon ? {
+						name: "icon",
+						fn: withCtx(() => [renderSlot(_ctx.$slots, "icon")]),
+						key: "1"
+					} : void 0,
+					_ctx.$slots.aside ? {
+						name: "aside",
+						fn: withCtx(() => [renderSlot(_ctx.$slots, "aside")]),
+						key: "2"
+					} : void 0
+				]), 1040, ["indent"])]),
+				renderSlot(_ctx.$slots, "after")
+			], 16);
+		};
+	}
+});
+//#endregion
+export { ScalarSidebarItem_vue_vue_type_script_setup_true_lang_default as default };
+
+//# sourceMappingURL=ScalarSidebarItem.vue.script.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ScalarSidebarItem.vue.script.js","names":["$slots"],"sources":["../../../src/components/ScalarSidebar/ScalarSidebarItem.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Scalar Sidebar Item component\n *\n * Provides a ScalarSidebarButton wrapped in an `<li>` to\n * meet accessibility requirements and automatically indents\n * the button based on the level of the sidebar group\n *\n * @example\n * <ScalarSidebarItem>\n *   <template #icon>\n *     <!-- Overrides the icon slot -->\n *   </template>\n *   <!-- Button text -->\n *   <template #aside>\n *     <!-- After the button text -->\n *   </template>\n *   <!-- Content to display before the button but inside the list item -->\n *   <template #before>\n *     <!-- Before the button -->\n *   </template>\n *   <!-- Content to display after the button but inside the list item -->\n *   <template #after>\n *     <!-- After the button -->\n *   </template>\n * </ScalarSidebarItem>\n */\nexport default {}\n</script>\n<script setup lang=\"ts\">\nimport { useBindCx } from '@scalar/use-hooks/useBindCx'\n\nimport ScalarSidebarButton from './ScalarSidebarButton.vue'\nimport type { ScalarSidebarItemProps, ScalarSidebarItemSlots } from './types'\nimport { useSidebarGroups } from './useSidebarGroups'\n\nconst props = defineProps<ScalarSidebarItemProps>()\n\ndefineSlots<ScalarSidebarItemSlots>()\n\nconst { level } = useSidebarGroups()\n\nconst { cx } = useBindCx()\ndefineOptions({ inheritAttrs: false })\n</script>\n<template>\n  <li v-bind=\"cx('group/item flex flex-col text-base')\">\n    <slot name=\"before\" />\n    <slot\n      :level=\"level\"\n      name=\"button\">\n      <ScalarSidebarButton\n        v-bind=\"props\"\n        :indent=\"indent ?? level\">\n        <!-- Pass through all the slots -->\n        <template\n          v-if=\"$slots.default\"\n          #default>\n          <slot />\n        </template>\n        <template\n          v-if=\"$slots.icon\"\n          #icon>\n          <slot name=\"icon\" />\n        </template>\n        <template\n          v-if=\"$slots.aside\"\n          #aside>\n          <slot name=\"aside\" />\n        </template>\n      </ScalarSidebarButton>\n    </slot>\n    <slot name=\"after\" />\n  </li>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;EAoCA,MAAM,QAAQ;EAId,MAAM,EAAE,UAAU,kBAAiB;EAEnC,MAAM,EAAE,OAAO,WAAU;;uBAIvB,mBA2BK,MAAA,eAAA,mBA3BO,MAAA,GAAE,CAAA,qCAAA,CAAA,CAAA,EAAA;IACZ,WAAsB,KAAA,QAAA,SAAA;IACtB,WAuBO,KAAA,QAAA,UAAA,EAtBJ,OAAO,MAAA,MAAK,EAAA,QAsBR,CApBL,YAmBsB,6BAnBtB,WACU,OAAK,EACZ,QAAQ,QAAA,UAAU,MAAA,MAAK,EAAA,CAAA,EAAA,YAAA,EAAA,GAAA,GAAA,EAAA;KAGhBA,KAAAA,OAAO,UAAA;YACZ;wBACO,CAAR,WAAQ,KAAA,QAAA,UAAA,CAAA,CAAA;;;KAGFA,KAAAA,OAAO,OAAA;YACZ;wBACmB,CAApB,WAAoB,KAAA,QAAA,OAAA,CAAA,CAAA;;;KAGdA,KAAAA,OAAO,QAAA;YACZ;wBACoB,CAArB,WAAqB,KAAA,QAAA,QAAA,CAAA,CAAA;;;;IAI3B,WAAqB,KAAA,QAAA,QAAA"}

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

@@ -0,0 +1,8 @@
+import ScalarSidebarItems_vue_vue_type_script_setup_true_lang_default from "./ScalarSidebarItems.vue.script.js";
+/* empty css                                 */
+//#region src/components/ScalarSidebar/ScalarSidebarItems.vue
+var ScalarSidebarItems_default = ScalarSidebarItems_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { ScalarSidebarItems_default as default };
+
+//# sourceMappingURL=ScalarSidebarItems.vue.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ScalarSidebarItems.vue.js","names":[],"sources":["../../../src/components/ScalarSidebar/ScalarSidebarItems.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Scalar Sidebar Items component\n *\n * A base container for ScalarSidebarItem(s), renders as\n * a  `<ul>` by default to meet accessibility requirements\n *\n * @example\n * <ScalarSidebarItems>\n *   <ScalarSidebarItem>...</ScalarSidebarItem>\n *   <ScalarSidebarItem>...</ScalarSidebarItem>\n *   <ScalarSidebarItem>...</ScalarSidebarItem>\n * </ScalarSidebarItems>\n */\nexport default {}\n</script>\n<script setup lang=\"ts\">\nimport { useBindCx } from '@scalar/use-hooks/useBindCx'\nimport type { Component } from 'vue'\n\nimport { useSidebarNestedItems } from './useSidebarNestedItems'\n\nconst { is = 'ul' } = defineProps<{\n  is?: Component | string\n}>()\n\nconst { open } = useSidebarNestedItems()\n\ndefineOptions({ inheritAttrs: false })\nconst { cx } = useBindCx()\n</script>\n<template>\n  <component\n    :is=\"is\"\n    v-bind=\"\n      cx(\n        'group/items relative flex flex-col p-3 gap-px transition-transform duration-300',\n        open ? '-translate-x-full' : 'translate-x-0',\n      )\n    \">\n    <slot />\n  </component>\n</template>\n<style>\n@reference \"../../style.css\";\n\n/* Hide the buttons from the keyboard when a nested item is open */\n.group\\/items.-translate-x-full .group\\/button {\n  /* Required to prevent the button from being focused */\n  display: none;\n  /* Required to prevent the button from taking up scroll space */\n  max-height: 0;\n\n  transition-property: display, max-height;\n  transition-behavior: allow-discrete;\n  transition-duration: 0s;\n  transition-delay: 300ms;\n}\n\n/* Show the buttons within a nested item when it is open */\n.group\\/item.group\\/nested-items-open\n  > *\n  > .group\\/items.translate-x-0\n  .group\\/button {\n  max-height: calc(infinity * 1px);\n  display: flex;\n}\n</style>\n"],"mappings":""}

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

@@ -0,0 +1,22 @@
+import { useSidebarNestedItems } from "./useSidebarNestedItems.js";
+import { useBindCx } from "@scalar/use-hooks/useBindCx";
+import { createBlock, defineComponent, guardReactiveProps, normalizeProps, openBlock, renderSlot, resolveDynamicComponent, unref, withCtx } from "vue";
+var ScalarSidebarItems_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "ScalarSidebarItems",
+	props: { is: { default: "ul" } },
+	setup(__props) {
+		const { open } = useSidebarNestedItems();
+		const { cx } = useBindCx();
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(resolveDynamicComponent(__props.is), normalizeProps(guardReactiveProps(unref(cx)("group/items relative flex flex-col p-3 gap-px transition-transform duration-300", unref(open) ? "-translate-x-full" : "translate-x-0"))), {
+				default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
+				_: 3
+			}, 16);
+		};
+	}
+});
+//#endregion
+export { ScalarSidebarItems_vue_vue_type_script_setup_true_lang_default as default };
+
+//# sourceMappingURL=ScalarSidebarItems.vue.script.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ScalarSidebarItems.vue.script.js","names":[],"sources":["../../../src/components/ScalarSidebar/ScalarSidebarItems.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Scalar Sidebar Items component\n *\n * A base container for ScalarSidebarItem(s), renders as\n * a  `<ul>` by default to meet accessibility requirements\n *\n * @example\n * <ScalarSidebarItems>\n *   <ScalarSidebarItem>...</ScalarSidebarItem>\n *   <ScalarSidebarItem>...</ScalarSidebarItem>\n *   <ScalarSidebarItem>...</ScalarSidebarItem>\n * </ScalarSidebarItems>\n */\nexport default {}\n</script>\n<script setup lang=\"ts\">\nimport { useBindCx } from '@scalar/use-hooks/useBindCx'\nimport type { Component } from 'vue'\n\nimport { useSidebarNestedItems } from './useSidebarNestedItems'\n\nconst { is = 'ul' } = defineProps<{\n  is?: Component | string\n}>()\n\nconst { open } = useSidebarNestedItems()\n\ndefineOptions({ inheritAttrs: false })\nconst { cx } = useBindCx()\n</script>\n<template>\n  <component\n    :is=\"is\"\n    v-bind=\"\n      cx(\n        'group/items relative flex flex-col p-3 gap-px transition-transform duration-300',\n        open ? '-translate-x-full' : 'translate-x-0',\n      )\n    \">\n    <slot />\n  </component>\n</template>\n<style>\n@reference \"../../style.css\";\n\n/* Hide the buttons from the keyboard when a nested item is open */\n.group\\/items.-translate-x-full .group\\/button {\n  /* Required to prevent the button from being focused */\n  display: none;\n  /* Required to prevent the button from taking up scroll space */\n  max-height: 0;\n\n  transition-property: display, max-height;\n  transition-behavior: allow-discrete;\n  transition-duration: 0s;\n  transition-delay: 300ms;\n}\n\n/* Show the buttons within a nested item when it is open */\n.group\\/item.group\\/nested-items-open\n  > *\n  > .group\\/items.translate-x-0\n  .group\\/button {\n  max-height: calc(infinity * 1px);\n  display: flex;\n}\n</style>\n"],"mappings":";;;;;;;;EA0BA,MAAM,EAAE,SAAS,uBAAsB;EAGvC,MAAM,EAAE,OAAO,WAAU;;uBAGvB,YASY,wBARL,QAAA,GAAE,EAAA,eAAA,mBACQ,MAAA,GAAE,CAAA,mFAAqG,MAAA,KAAI,GAAA,sBAAA,gBAAA,CAAA,CAAA,EAAA;2BAMlH,CAAR,WAAQ,KAAA,QAAA,UAAA,CAAA,CAAA"}

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

@@ -1 +1 @@
-{"version":3,"file":"ScalarSidebarNestedItems.vue.d.ts","sourceRoot":"","sources":["../../../src/components/ScalarSidebar/ScalarSidebarNestedItems.vue"],"names":[],"mappings":"AAyLA;;;;;;;;;;;;;;;GAeG;wBACkB,OAAO,YAAY;AAAxC,wBAAyC;AAGzC,QAAA,MAAM,YAAY;;;;WA2FT,OAAO;;;;;;;;;;WAAP,OAAO;;;;;;IA1Ed,qCAAqC;cACzB,MAAM,OAAO;IACzB,iCAAiC;aACtB,MAAM,OAAO;IACxB,wBAAwB;WACf,MAAM,OAAO;IACtB,8BAA8B;YACpB,MAAM,OAAO;IACvB,+BAA+B;WACtB,MAAM,OAAO;IACtB,qCAAqC;mBACtB,MAAM,OAAO;IAC5B,mCAAmC;YACzB,MAAM,OAAO;EA0RrB,CAAC;AACL,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KACV,CAAA;CACD,CAAC"}
+{"version":3,"file":"ScalarSidebarNestedItems.vue.d.ts","sourceRoot":"","sources":["../../../src/components/ScalarSidebar/ScalarSidebarNestedItems.vue"],"names":[],"mappings":"AA8LA;;;;;;;;;;;;;;;GAeG;wBACkB,OAAO,YAAY;AAAxC,wBAAyC;AAGzC,QAAA,MAAM,YAAY;;;;WA+FT,OAAO;;;;;;;;;;WAAP,OAAO;;;;;;IA9Ed,qCAAqC;cACzB,MAAM,OAAO;IACzB,iCAAiC;aACtB,MAAM,OAAO;IACxB,wBAAwB;WACf,MAAM,OAAO;IACtB,8BAA8B;YACpB,MAAM,OAAO;IACvB,+BAA+B;WACtB,MAAM,OAAO;IACtB,qCAAqC;mBACtB,MAAM,OAAO;IAC5B,mCAAmC;YACzB,MAAM,OAAO;EAoSrB,CAAC;AACL,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KACV,CAAA;CACD,CAAC"}

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"ScalarSidebarNestedItems.vue.js","names":[],"sources":["../../../src/components/ScalarSidebar/ScalarSidebarNestedItems.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Scalar Sidebar Nested Items component\n *\n * A provides list of items thats presented over the parent list\n * Needs to be nested inside a ScalarSidebarItems component\n *\n * @example\n * <ScalarSidebarNestedItems v-model=\"open\">\n *   <!-- Item text -->\n *   <template #items>\n *     <ScalarSidebarItem>...</ScalarSidebarItem>\n *     <ScalarSidebarItem>...</ScalarSidebarItem>\n *     <ScalarSidebarItem>...</ScalarSidebarItem>\n *   </template>\n * </ScalarSidebarNestedItems>\n */\nexport default {}\n</script>\n<script setup lang=\"ts\">\nimport { ScalarIconArrowRight, ScalarIconCaretLeft } from '@scalar/icons'\nimport { nextTick, ref, useTemplateRef } from 'vue'\n\nimport ScalarSidebarButton from './ScalarSidebarButton.vue'\nimport ScalarSidebarItems from './ScalarSidebarItems.vue'\nimport ScalarSidebarSpacer from './ScalarSidebarSpacer.vue'\nimport { findScrollContainer } from './findScrollContainer'\nimport type { ScalarSidebarGroupProps } from './types'\nimport { useSidebarGroups } from './useSidebarGroups'\nimport { useSidebarNestedItem } from './useSidebarNestedItems'\n\nconst { controlled } = defineProps<ScalarSidebarGroupProps>()\n\nconst emit = defineEmits<{\n  /** Emitted when the nested item button is clicked */\n  (e: 'click', event: MouseEvent): void\n  /** Emitted when the back button is clicked */\n  (e: 'back', event: MouseEvent): void\n}>()\n\nconst open = defineModel<boolean>('open', { default: false })\nuseSidebarNestedItem(open)\n\ndefineSlots<{\n  /** The text content of the button */\n  'default'?: () => unknown\n  /** Override the entire button */\n  'button'?: () => unknown\n  /** Override the icon */\n  'icon'?: () => unknown\n  /** Override the aside slot */\n  'aside'?: () => unknown\n  /** Override the back button */\n  'back'?: () => unknown\n  /** Override the back button label */\n  'back-label'?: () => unknown\n  /** The list of sidebar subitems */\n  'items'?: () => unknown\n}>()\n\nconst { level } = useSidebarGroups({ reset: true })\n\n/** The root element ref */\nconst el = useTemplateRef('el')\n\n/** How far down to offset the nested items by when animating them in */\nconst offset = ref(0)\n\n// Transition hooks\n\nfunction onOpen() {\n  // Calculate how far down the nearest scroll container is scrolled\n  // We offset the nested items by this amount when animating them\n  // in so they appear in line with the parent items list.\n  offset.value = findScrollContainer(el.value).scrollTop ?? 0\n\n  // Focus the first button in the nested items\n  nextTick(() =>\n    el.value\n      ?.querySelector<HTMLButtonElement>('button:not([aria-expanded=\"true\"])')\n      ?.focus({ preventScroll: true }),\n  )\n}\nfunction onOpened() {\n  /** Reset the scroll position of the scroll container after opening */\n  findScrollContainer(el.value).scrollTop = 0\n}\nfunction onClose() {\n  nextTick(() => {\n    el.value?.querySelector('button')?.focus({ preventScroll: true })\n    findScrollContainer(el.value).scrollTop = offset.value\n  })\n}\n\ndefineOptions({ inheritAttrs: false })\n\n/** Handle the click event for the nested items button */\nconst handleClick = (event: MouseEvent) => {\n  // Bubble up the click event\n  emit('click', event)\n  if (!controlled) {\n    // Only toggle the open state if the group is uncontrolled\n    open.value = true\n  }\n}\n\n/** Handle the back button click event */\nconst handleBack = (event: MouseEvent) => {\n  // Bubble up the back event\n  emit('back', event)\n  if (!controlled) {\n    // Only toggle the open state if the group is uncontrolled\n    open.value = false\n  }\n}\n</script>\n<template>\n  <li\n    ref=\"el\"\n    class=\"group/item group/nested-items contents\"\n    :class=\"{ 'group/nested-items-open': open }\"\n    :style=\"{ '--nested-items-offset': `${offset}px` }\">\n    <slot name=\"button\">\n      <ScalarSidebarButton\n        is=\"button\"\n        :aria-expanded=\"open\"\n        :disabled\n        :icon\n        :indent=\"level\"\n        :selected\n        v-bind=\"$attrs\"\n        @click=\"handleClick\">\n        <template\n          v-if=\"$slots.icon\"\n          #icon>\n          <slot name=\"icon\" />\n        </template>\n        <slot />\n        <template #aside>\n          <slot name=\"aside\">\n            <ScalarIconArrowRight class=\"size-4 text-sidebar-c-2\" />\n          </slot>\n        </template>\n      </ScalarSidebarButton>\n    </slot>\n    <!-- Make sure the div is around for the entire transition -->\n    <Transition\n      :duration=\"300\"\n      enterActiveClass=\"top-(--nested-items-offset)!\"\n      leaveActiveClass=\"top-(--nested-items-offset)!\"\n      @afterEnter=\"onOpened\"\n      @enter=\"onOpen\"\n      @leave=\"onClose\">\n      <div\n        v-if=\"open\"\n        class=\"absolute inset-0 translate-x-full\">\n        <ScalarSidebarItems v-bind=\"$attrs\">\n          <slot name=\"back\">\n            <ScalarSidebarButton\n              is=\"button\"\n              class=\"text-sidebar-c-1 font-sidebar-active hover:text-sidebar-c-1\"\n              @click=\"handleBack\">\n              <template #icon>\n                <ScalarIconCaretLeft class=\"size-4 -m-px text-sidebar-c-2\" />\n              </template>\n              <slot name=\"back-label\">Back</slot>\n            </ScalarSidebarButton>\n          </slot>\n          <ScalarSidebarSpacer class=\"h-3\" />\n          <slot name=\"items\" />\n        </ScalarSidebarItems>\n      </div>\n    </Transition>\n  </li>\n</template>\n"],"mappings":""}

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

@@ -0,0 +1,126 @@
+import ScalarSidebarButton_default from "./ScalarSidebarButton.vue.js";
+import { useSidebarGroups } from "./useSidebarGroups.js";
+import { useSidebarNestedItem } from "./useSidebarNestedItems.js";
+import ScalarSidebarItems_default from "./ScalarSidebarItems.vue.js";
+import ScalarSidebarSpacer_default from "./ScalarSidebarSpacer.vue.js";
+import { findScrollContainer } from "./findScrollContainer.js";
+import { Transition, createCommentVNode, createElementBlock, createSlots, createTextVNode, createVNode, defineComponent, guardReactiveProps, mergeModels, mergeProps, nextTick, normalizeClass, normalizeProps, normalizeStyle, openBlock, ref, renderSlot, unref, useModel, useTemplateRef, withCtx } from "vue";
+import { ScalarIconArrowRight, ScalarIconCaretLeft } from "@scalar/icons";
+//#region src/components/ScalarSidebar/ScalarSidebarNestedItems.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = {
+	key: 0,
+	class: "absolute inset-0 translate-x-full"
+};
+var ScalarSidebarNestedItems_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "ScalarSidebarNestedItems",
+	props: /* @__PURE__ */ mergeModels({
+		is: {},
+		icon: { type: [Object, Function] },
+		active: { type: Boolean },
+		selected: { type: Boolean },
+		disabled: { type: Boolean },
+		indent: {},
+		controlled: { type: Boolean },
+		discrete: { type: Boolean }
+	}, {
+		"open": {
+			type: Boolean,
+			default: false
+		},
+		"openModifiers": {}
+	}),
+	emits: /* @__PURE__ */ mergeModels(["click", "back"], ["update:open"]),
+	setup(__props, { emit: __emit }) {
+		const emit = __emit;
+		const open = useModel(__props, "open");
+		useSidebarNestedItem(open);
+		const { level } = useSidebarGroups({ reset: true });
+		/** The root element ref */
+		const el = useTemplateRef("el");
+		/** How far down to offset the nested items by when animating them in */
+		const offset = ref(0);
+		function onOpen() {
+			offset.value = findScrollContainer(el.value).scrollTop ?? 0;
+			nextTick(() => el.value?.querySelector("button:not([aria-expanded=\"true\"])")?.focus({ preventScroll: true }));
+		}
+		function onOpened() {
+			/** Reset the scroll position of the scroll container after opening */
+			findScrollContainer(el.value).scrollTop = 0;
+		}
+		function onClose() {
+			nextTick(() => {
+				el.value?.querySelector("button")?.focus({ preventScroll: true });
+				findScrollContainer(el.value).scrollTop = offset.value;
+			});
+		}
+		/** Handle the click event for the nested items button */
+		const handleClick = (event) => {
+			emit("click", event);
+			if (!__props.controlled) open.value = true;
+		};
+		/** Handle the back button click event */
+		const handleBack = (event) => {
+			emit("back", event);
+			if (!__props.controlled) open.value = false;
+		};
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("li", {
+				ref_key: "el",
+				ref: el,
+				class: normalizeClass(["group/item group/nested-items contents", { "group/nested-items-open": open.value }]),
+				style: normalizeStyle({ "--nested-items-offset": `${offset.value}px` })
+			}, [renderSlot(_ctx.$slots, "button", {}, () => [createVNode(ScalarSidebarButton_default, mergeProps({
+				is: "button",
+				"aria-expanded": open.value,
+				disabled: __props.disabled,
+				icon: __props.icon,
+				indent: unref(level),
+				selected: __props.selected
+			}, _ctx.$attrs, { onClick: handleClick }), createSlots({
+				aside: withCtx(() => [renderSlot(_ctx.$slots, "aside", {}, () => [createVNode(unref(ScalarIconArrowRight), { class: "size-4 text-sidebar-c-2" })])]),
+				default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
+				_: 2
+			}, [_ctx.$slots.icon ? {
+				name: "icon",
+				fn: withCtx(() => [renderSlot(_ctx.$slots, "icon")]),
+				key: "0"
+			} : void 0]), 1040, [
+				"aria-expanded",
+				"disabled",
+				"icon",
+				"indent",
+				"selected"
+			])]), createVNode(Transition, {
+				duration: 300,
+				enterActiveClass: "top-(--nested-items-offset)!",
+				leaveActiveClass: "top-(--nested-items-offset)!",
+				onAfterEnter: onOpened,
+				onEnter: onOpen,
+				onLeave: onClose
+			}, {
+				default: withCtx(() => [open.value ? (openBlock(), createElementBlock("div", _hoisted_1, [createVNode(ScalarSidebarItems_default, normalizeProps(guardReactiveProps(_ctx.$attrs)), {
+					default: withCtx(() => [
+						renderSlot(_ctx.$slots, "back", {}, () => [createVNode(ScalarSidebarButton_default, {
+							is: "button",
+							class: "text-sidebar-c-1 font-sidebar-active hover:text-sidebar-c-1",
+							onClick: handleBack
+						}, {
+							icon: withCtx(() => [createVNode(unref(ScalarIconCaretLeft), { class: "size-4 -m-px text-sidebar-c-2" })]),
+							default: withCtx(() => [renderSlot(_ctx.$slots, "back-label", {}, () => [_cache[0] || (_cache[0] = createTextVNode("Back", -1))])]),
+							_: 3
+						})]),
+						createVNode(ScalarSidebarSpacer_default, { class: "h-3" }),
+						renderSlot(_ctx.$slots, "items")
+					]),
+					_: 3
+				}, 16)])) : createCommentVNode("", true)]),
+				_: 3
+			})], 6);
+		};
+	}
+});
+//#endregion
+export { ScalarSidebarNestedItems_vue_vue_type_script_setup_true_lang_default as default };
+
+//# sourceMappingURL=ScalarSidebarNestedItems.vue.script.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ScalarSidebarNestedItems.vue.script.js","names":["$attrs","$slots"],"sources":["../../../src/components/ScalarSidebar/ScalarSidebarNestedItems.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Scalar Sidebar Nested Items component\n *\n * A provides list of items thats presented over the parent list\n * Needs to be nested inside a ScalarSidebarItems component\n *\n * @example\n * <ScalarSidebarNestedItems v-model=\"open\">\n *   <!-- Item text -->\n *   <template #items>\n *     <ScalarSidebarItem>...</ScalarSidebarItem>\n *     <ScalarSidebarItem>...</ScalarSidebarItem>\n *     <ScalarSidebarItem>...</ScalarSidebarItem>\n *   </template>\n * </ScalarSidebarNestedItems>\n */\nexport default {}\n</script>\n<script setup lang=\"ts\">\nimport { ScalarIconArrowRight, ScalarIconCaretLeft } from '@scalar/icons'\nimport { nextTick, ref, useTemplateRef } from 'vue'\n\nimport ScalarSidebarButton from './ScalarSidebarButton.vue'\nimport ScalarSidebarItems from './ScalarSidebarItems.vue'\nimport ScalarSidebarSpacer from './ScalarSidebarSpacer.vue'\nimport { findScrollContainer } from './findScrollContainer'\nimport type { ScalarSidebarGroupProps } from './types'\nimport { useSidebarGroups } from './useSidebarGroups'\nimport { useSidebarNestedItem } from './useSidebarNestedItems'\n\nconst { controlled } = defineProps<ScalarSidebarGroupProps>()\n\nconst emit = defineEmits<{\n  /** Emitted when the nested item button is clicked */\n  (e: 'click', event: MouseEvent): void\n  /** Emitted when the back button is clicked */\n  (e: 'back', event: MouseEvent): void\n}>()\n\nconst open = defineModel<boolean>('open', { default: false })\nuseSidebarNestedItem(open)\n\ndefineSlots<{\n  /** The text content of the button */\n  'default'?: () => unknown\n  /** Override the entire button */\n  'button'?: () => unknown\n  /** Override the icon */\n  'icon'?: () => unknown\n  /** Override the aside slot */\n  'aside'?: () => unknown\n  /** Override the back button */\n  'back'?: () => unknown\n  /** Override the back button label */\n  'back-label'?: () => unknown\n  /** The list of sidebar subitems */\n  'items'?: () => unknown\n}>()\n\nconst { level } = useSidebarGroups({ reset: true })\n\n/** The root element ref */\nconst el = useTemplateRef('el')\n\n/** How far down to offset the nested items by when animating them in */\nconst offset = ref(0)\n\n// Transition hooks\n\nfunction onOpen() {\n  // Calculate how far down the nearest scroll container is scrolled\n  // We offset the nested items by this amount when animating them\n  // in so they appear in line with the parent items list.\n  offset.value = findScrollContainer(el.value).scrollTop ?? 0\n\n  // Focus the first button in the nested items\n  nextTick(() =>\n    el.value\n      ?.querySelector<HTMLButtonElement>('button:not([aria-expanded=\"true\"])')\n      ?.focus({ preventScroll: true }),\n  )\n}\nfunction onOpened() {\n  /** Reset the scroll position of the scroll container after opening */\n  findScrollContainer(el.value).scrollTop = 0\n}\nfunction onClose() {\n  nextTick(() => {\n    el.value?.querySelector('button')?.focus({ preventScroll: true })\n    findScrollContainer(el.value).scrollTop = offset.value\n  })\n}\n\ndefineOptions({ inheritAttrs: false })\n\n/** Handle the click event for the nested items button */\nconst handleClick = (event: MouseEvent) => {\n  // Bubble up the click event\n  emit('click', event)\n  if (!controlled) {\n    // Only toggle the open state if the group is uncontrolled\n    open.value = true\n  }\n}\n\n/** Handle the back button click event */\nconst handleBack = (event: MouseEvent) => {\n  // Bubble up the back event\n  emit('back', event)\n  if (!controlled) {\n    // Only toggle the open state if the group is uncontrolled\n    open.value = false\n  }\n}\n</script>\n<template>\n  <li\n    ref=\"el\"\n    class=\"group/item group/nested-items contents\"\n    :class=\"{ 'group/nested-items-open': open }\"\n    :style=\"{ '--nested-items-offset': `${offset}px` }\">\n    <slot name=\"button\">\n      <ScalarSidebarButton\n        is=\"button\"\n        :aria-expanded=\"open\"\n        :disabled\n        :icon\n        :indent=\"level\"\n        :selected\n        v-bind=\"$attrs\"\n        @click=\"handleClick\">\n        <template\n          v-if=\"$slots.icon\"\n          #icon>\n          <slot name=\"icon\" />\n        </template>\n        <slot />\n        <template #aside>\n          <slot name=\"aside\">\n            <ScalarIconArrowRight class=\"size-4 text-sidebar-c-2\" />\n          </slot>\n        </template>\n      </ScalarSidebarButton>\n    </slot>\n    <!-- Make sure the div is around for the entire transition -->\n    <Transition\n      :duration=\"300\"\n      enterActiveClass=\"top-(--nested-items-offset)!\"\n      leaveActiveClass=\"top-(--nested-items-offset)!\"\n      @afterEnter=\"onOpened\"\n      @enter=\"onOpen\"\n      @leave=\"onClose\">\n      <div\n        v-if=\"open\"\n        class=\"absolute inset-0 translate-x-full\">\n        <ScalarSidebarItems v-bind=\"$attrs\">\n          <slot name=\"back\">\n            <ScalarSidebarButton\n              is=\"button\"\n              class=\"text-sidebar-c-1 font-sidebar-active hover:text-sidebar-c-1\"\n              @click=\"handleBack\">\n              <template #icon>\n                <ScalarIconCaretLeft class=\"size-4 -m-px text-sidebar-c-2\" />\n              </template>\n              <slot name=\"back-label\">Back</slot>\n            </ScalarSidebarButton>\n          </slot>\n          <ScalarSidebarSpacer class=\"h-3\" />\n          <slot name=\"items\" />\n        </ScalarSidebarItems>\n      </div>\n    </Transition>\n  </li>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAiCA,MAAM,OAAO;EAOb,MAAM,OAAO,SAAoB,SAAC,OAA0B;AAC5D,uBAAqB,KAAI;EAmBzB,MAAM,EAAE,UAAU,iBAAiB,EAAE,OAAO,MAAM,CAAA;;EAGlD,MAAM,KAAK,eAAe,KAAI;;EAG9B,MAAM,SAAS,IAAI,EAAC;EAIpB,SAAS,SAAS;AAIhB,UAAO,QAAQ,oBAAoB,GAAG,MAAM,CAAC,aAAa;AAG1D,kBACE,GAAG,OACC,cAAiC,uCAAoC,EACrE,MAAM,EAAE,eAAe,MAAM,CAAC,CACpC;;EAEF,SAAS,WAAW;;AAElB,uBAAoB,GAAG,MAAM,CAAC,YAAY;;EAE5C,SAAS,UAAU;AACjB,kBAAe;AACb,OAAG,OAAO,cAAc,SAAS,EAAE,MAAM,EAAE,eAAe,MAAM,CAAA;AAChE,wBAAoB,GAAG,MAAM,CAAC,YAAY,OAAO;KAClD;;;EAMH,MAAM,eAAe,UAAsB;AAEzC,QAAK,SAAS,MAAK;AACnB,OAAI,CAAC,QAAA,WAEH,MAAK,QAAQ;;;EAKjB,MAAM,cAAc,UAAsB;AAExC,QAAK,QAAQ,MAAK;AAClB,OAAI,CAAC,QAAA,WAEH,MAAK,QAAQ;;;uBAKf,mBAwDK,MAAA;aAvDC;IAAJ,KAAI;IACJ,OAAK,eAAA,CAAC,0CAAwC,EAAA,2BACT,KAAA,OAAI,CAAA,CAAA;IACxC,OAAK,eAAA,EAAA,yBAAA,GAAgC,OAAA,MAAM,KAAA,CAAA;OAC5C,WAsBO,KAAA,QAAA,UAAA,EAAA,QAAA,CArBL,YAoBsB,6BApBtB,WAoBsB;IAnBpB,IAAG;IACF,iBAAe,KAAA;IACf,UAAA,QAAA;IACA,MAAA,QAAA;IACA,QAAQ,MAAA,MAAK;IACb,UAAA,QAAA;MACOA,KAAAA,QAAM,EACb,SAAO,aAAW,CAAA,EAAA,YAAA;IAOR,OAAK,cAGP,CAFP,WAEO,KAAA,QAAA,SAAA,EAAA,QAAA,CADL,YAAwD,MAAA,qBAAA,EAAA,EAAlC,OAAM,2BAAyB,CAAA,CAAA,CAAA,CAAA,CAAA;2BAHjD,CAAR,WAAQ,KAAA,QAAA,UAAA,CAAA,CAAA;;OAJAC,KAAAA,OAAO,OAAA;UACZ;sBACmB,CAApB,WAAoB,KAAA,QAAA,OAAA,CAAA,CAAA;;;;;;;;SAW1B,YA0Ba,YAAA;IAzBV,UAAU;IACX,kBAAiB;IACjB,kBAAiB;IAChB,cAAY;IACZ,SAAO;IACP,SAAO;;2BAmBF,CAjBE,KAAA,SAAA,WAAA,EADR,mBAkBM,OAlBN,YAkBM,CAfJ,YAcqB,4BAAA,eAAA,mBAdOD,KAAAA,OAAM,CAAA,EAAA;4BAWzB;MAVP,WAUO,KAAA,QAAA,QAAA,EAAA,QAAA,CATL,YAQsB,6BAAA;OAPpB,IAAG;OACH,OAAM;OACL,SAAO;;OACG,MAAI,cACgD,CAA7D,YAA6D,MAAA,oBAAA,EAAA,EAAxC,OAAM,iCAA+B,CAAA,CAAA,CAAA;8BAEzB,CAAnC,WAAmC,KAAA,QAAA,cAAA,EAAA,QAAA,CAAA,OAAA,OAAA,OAAA,KAAA,gBAAX,QAAI,GAAA,EAAA,CAAA,CAAA,CAAA;;;MAGhC,YAAmC,6BAAA,EAAd,OAAM,OAAK,CAAA;MAChC,WAAqB,KAAA,QAAA,QAAA"}

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"ScalarSidebarSearchButton.vue.js","names":[],"sources":["../../../src/components/ScalarSidebar/ScalarSidebarSearchButton.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ScalarIconMagnifyingGlass } from '@scalar/icons'\nimport { useBindCx } from '@scalar/use-hooks/useBindCx'\n\ndefineOptions({ inheritAttrs: false })\nconst { cx } = useBindCx()\n</script>\n<template>\n  <button\n    role=\"search\"\n    type=\"button\"\n    v-bind=\"\n      cx(\n        'flex items-center rounded border text-base h-8 gap-1 pl-2 pr-1',\n        'bg-sidebar-b-search border-sidebar-border-search text-sidebar-c-search',\n      )\n    \">\n    <ScalarIconMagnifyingGlass class=\"size-4\" />\n    <span class=\"flex-1 text-left leading-none\">\n      <slot>Search...</slot>\n    </span>\n    <span\n      v-if=\"$slots.shortcut\"\n      class=\"uppercase text-sidebar-c-2 leading-none py-1 px-1.25 rounded text-xs font-medium border\">\n      <span class=\"sr-only\">Keyboard Shortcut:</span>\n      <kbd>\n        <slot name=\"shortcut\" />\n      </kbd>\n    </span>\n  </button>\n</template>\n"],"mappings":""}