@scalar/components 0.21.2 → 0.21.4

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

@@ -1 +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":""}
+{"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          <div\n            class=\"flex flex-col gap-px sticky top-(--scalar-sidebar-sticky-offset,0) p-(--scalar-sidebar-padding) -m-(--scalar-sidebar-padding) mb-0 pb-0 bg-sidebar-b-1 z-1 animate-sidebar-border-bottom border-b-sidebar-border\">\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          </div>\n          <slot name=\"items\" />\n        </ScalarSidebarItems>\n      </div>\n    </Transition>\n  </li>\n</template>\n\n<style>\n@reference \"../../style.css\";\n\n.animate-sidebar-border-bottom {\n  animation: border-bottom forwards;\n  animation-timeline: scroll();\n  animation-range-end: 1px;\n}\n\n@keyframes border-bottom {\n  from {\n    border-bottom-width: 0;\n  }\n  to {\n    border-bottom-width: var(--scalar-border-width);\n  }\n}\n</style>\n"],"mappings":""}

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

@@ -4,13 +4,14 @@ 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 { Transition, createCommentVNode, createElementBlock, createElementVNode, 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 _hoisted_2 = { class: "flex flex-col gap-px sticky top-(--scalar-sidebar-sticky-offset,0) p-(--scalar-sidebar-padding) -m-(--scalar-sidebar-padding) mb-0 pb-0 bg-sidebar-b-1 z-1 animate-sidebar-border-bottom border-b-sidebar-border" };
 var ScalarSidebarNestedItems_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
 	inheritAttrs: false,
 	__name: "ScalarSidebarNestedItems",
@@ -100,19 +101,15 @@ var ScalarSidebarNestedItems_vue_vue_type_script_setup_true_lang_default = /* @_
 				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")
-					]),
+					default: withCtx(() => [createElementVNode("div", _hoisted_2, [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

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

@@ -1 +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"}
+{"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          <div\n            class=\"flex flex-col gap-px sticky top-(--scalar-sidebar-sticky-offset,0) p-(--scalar-sidebar-padding) -m-(--scalar-sidebar-padding) mb-0 pb-0 bg-sidebar-b-1 z-1 animate-sidebar-border-bottom border-b-sidebar-border\">\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          </div>\n          <slot name=\"items\" />\n        </ScalarSidebarItems>\n      </div>\n    </Transition>\n  </li>\n</template>\n\n<style>\n@reference \"../../style.css\";\n\n.animate-sidebar-border-bottom {\n  animation: border-bottom forwards;\n  animation-timeline: scroll();\n  animation-range-end: 1px;\n}\n\n@keyframes border-bottom {\n  from {\n    border-bottom-width: 0;\n  }\n  to {\n    border-bottom-width: var(--scalar-border-width);\n  }\n}\n</style>\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,mBA2DK,MAAA;aA1DC;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,YA6Ba,YAAA;IA5BV,UAAU;IACX,kBAAiB;IACjB,kBAAiB;IAChB,cAAY;IACZ,SAAO;IACP,SAAO;;2BAsBF,CApBE,KAAA,SAAA,WAAA,EADR,mBAqBM,OArBN,YAqBM,CAlBJ,YAiBqB,4BAAA,eAAA,mBAjBOD,KAAAA,OAAM,CAAA,EAAA;4BAe1B,CAdN,mBAcM,OAdN,YAcM,CAZJ,WAUO,KAAA,QAAA,QAAA,EAAA,QAAA,CATL,YAQsB,6BAAA;MAPpB,IAAG;MACH,OAAM;MACL,SAAO;;MACG,MAAI,cACgD,CAA7D,YAA6D,MAAA,oBAAA,EAAA,EAAxC,OAAM,iCAA+B,CAAA,CAAA,CAAA;6BAEzB,CAAnC,WAAmC,KAAA,QAAA,cAAA,EAAA,QAAA,CAAA,OAAA,OAAA,OAAA,KAAA,gBAAX,QAAI,GAAA,EAAA,CAAA,CAAA,CAAA;;WAGhC,YAAmC,6BAAA,EAAd,OAAM,OAAK,CAAA,CAAA,CAAA,EAElC,WAAqB,KAAA,QAAA,QAAA,CAAA,CAAA"}

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

@@ -12,6 +12,16 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
      * @default 20 (px)
      */
     indent?: number;
+    /**
+     * Overrides --scalar-sidebar-padding
+     * @default 12 (px)
+     */
+    padding?: number;
+    /**
+     * Overrides --scalar-sidebar-width
+     * @default 288 (px)
+     */
+    width?: number;
     /**
      * Sets --scalar-sidebar-background-1
      * @default var(--scalar-background-1)
@@ -92,6 +102,16 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
      * @default 20 (px)
      */
     indent?: number;
+    /**
+     * Overrides --scalar-sidebar-padding
+     * @default 12 (px)
+     */
+    padding?: number;
+    /**
+     * Overrides --scalar-sidebar-width
+     * @default 288 (px)
+     */
+    width?: number;
     /**
      * Sets --scalar-sidebar-background-1
      * @default var(--scalar-background-1)

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

@@ -1 +1 @@
-{"version":3,"file":"ScalarSidebarPlayground.vue.d.ts","sourceRoot":"","sources":["../../../src/components/ScalarSidebar/ScalarSidebarPlayground.vue"],"names":[],"mappings":"AAiJA;;;;;GAKG;wBACkB,OAAO,YAAY;AAAxC,wBAAyC;AAGzC,QAAA,MAAM,YAAY;IAEhB;;;OAGG;aACM,MAAM;IACf;;;OAGG;oBACa,MAAM;IACtB;;;OAGG;eACQ,MAAM;IACjB;;;OAGG;eACQ,MAAM;IACjB;;;OAGG;kBACW,MAAM;IACpB;;;OAGG;0BACmB,MAAM;IAC5B;;;OAGG;qBACc,MAAM;IACvB;;;OAGG;2BACoB,MAAM;IAC7B;;;OAGG;sBACe,MAAM;IACxB;;;OAGG;mBACY,MAAM;IACrB;;;OAGG;wBACiB,MAAM;IAC1B;;;OAGG;yBACkB,MAAM;IAC3B;;;OAGG;uBACgB,MAAM;IACzB;;;OAGG;kBACW,MAAM;IACpB;;;OAGG;wBACiB,MAAM;;eAQf,MAAM;;;;IAlFjB;;;OAGG;aACM,MAAM;IACf;;;OAGG;oBACa,MAAM;IACtB;;;OAGG;eACQ,MAAM;IACjB;;;OAGG;eACQ,MAAM;IACjB;;;OAGG;kBACW,MAAM;IACpB;;;OAGG;0BACmB,MAAM;IAC5B;;;OAGG;qBACc,MAAM;IACvB;;;OAGG;2BACoB,MAAM;IAC7B;;;OAGG;sBACe,MAAM;IACxB;;;OAGG;mBACY,MAAM;IACrB;;;OAGG;wBACiB,MAAM;IAC1B;;;OAGG;yBACkB,MAAM;IAC3B;;;OAGG;uBACgB,MAAM;IACzB;;;OAGG;kBACW,MAAM;IACpB;;;OAGG;wBACiB,MAAM;;eAQf,MAAM;;;;aA0IN,CAAC,KAAK,IAAgB,KAAK,GAAG;;cAC7B,CAAC,KAAK,IAAiB,KAAK,GAAG;;aAChC,CAAC,KAAK,IAAiB,KAAK,GAAG;EAUxC,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":"ScalarSidebarPlayground.vue.d.ts","sourceRoot":"","sources":["../../../src/components/ScalarSidebar/ScalarSidebarPlayground.vue"],"names":[],"mappings":"AAgKA;;;;;GAKG;wBACkB,OAAO,YAAY;AAAxC,wBAAyC;AAGzC,QAAA,MAAM,YAAY;IAEhB;;;OAGG;aACM,MAAM;IACf;;;OAGG;cACO,MAAM;IAChB;;;OAGG;YACK,MAAM;IACd;;;OAGG;oBACa,MAAM;IACtB;;;OAGG;eACQ,MAAM;IACjB;;;OAGG;eACQ,MAAM;IACjB;;;OAGG;kBACW,MAAM;IACpB;;;OAGG;0BACmB,MAAM;IAC5B;;;OAGG;qBACc,MAAM;IACvB;;;OAGG;2BACoB,MAAM;IAC7B;;;OAGG;sBACe,MAAM;IACxB;;;OAGG;mBACY,MAAM;IACrB;;;OAGG;wBACiB,MAAM;IAC1B;;;OAGG;yBACkB,MAAM;IAC3B;;;OAGG;uBACgB,MAAM;IACzB;;;OAGG;kBACW,MAAM;IACpB;;;OAGG;wBACiB,MAAM;;eAQf,MAAM;;;;IA5FjB;;;OAGG;aACM,MAAM;IACf;;;OAGG;cACO,MAAM;IAChB;;;OAGG;YACK,MAAM;IACd;;;OAGG;oBACa,MAAM;IACtB;;;OAGG;eACQ,MAAM;IACjB;;;OAGG;eACQ,MAAM;IACjB;;;OAGG;kBACW,MAAM;IACpB;;;OAGG;0BACmB,MAAM;IAC5B;;;OAGG;qBACc,MAAM;IACvB;;;OAGG;2BACoB,MAAM;IAC7B;;;OAGG;sBACe,MAAM;IACxB;;;OAGG;mBACY,MAAM;IACrB;;;OAGG;wBACiB,MAAM;IAC1B;;;OAGG;yBACkB,MAAM;IAC3B;;;OAGG;uBACgB,MAAM;IACzB;;;OAGG;kBACW,MAAM;IACpB;;;OAGG;wBACiB,MAAM;;eAQf,MAAM;;;;aAmJN,CAAC,KAAK,IAAgB,KAAK,GAAG;;cAC7B,CAAC,KAAK,IAAiB,KAAK,GAAG;;aAChC,CAAC,KAAK,IAAiB,KAAK,GAAG;EAUxC,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/ScalarWrappingText/ScalarWrappingText.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ScalarWrappingText.vue.d.ts","sourceRoot":"","sources":["../../../src/components/ScalarWrappingText/ScalarWrappingText.vue"],"names":[],"mappings":"AAwDA,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,SAAS,CAAA;AAGtD;;;;;;;;;GASG;wBACkB,OAAO,YAAY;AAAxC,wBAAyC;AAGzC,QAAA,MAAM,YAAY,0TAyDd,CAAC"}
+{"version":3,"file":"ScalarWrappingText.vue.d.ts","sourceRoot":"","sources":["../../../src/components/ScalarWrappingText/ScalarWrappingText.vue"],"names":[],"mappings":"AAwDA,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,SAAS,CAAA;AAGtD;;;;;;;;;GASG;wBACkB,OAAO,YAAY;AAAxC,wBAAyC;AAGzC,QAAA,MAAM,YAAY,0TA2Dd,CAAC"}

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

@@ -1 +1 @@
-{"version":3,"file":"ScalarWrappingText.vue.js","names":[],"sources":["../../../src/components/ScalarWrappingText/ScalarWrappingText.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Scalar Text Wrapping component\n *\n * Adds word breaks to the text to allow improved line wrapping\n *\n * Does not inherit any attributes because it returns a set of html nodes\n *\n * @example\n * <ScalarWrappingText text=\"/this/is/a/long/path/that/needs/to/be/wrapped\" />\n */\nexport default {}\n</script>\n<script setup lang=\"ts\">\nimport { computed } from 'vue'\n\nimport { PRESETS } from './constants'\nimport type { ScalarWrappingTextProps } from './types'\n\nconst {\n  text = '',\n  preset = 'path',\n  regex,\n} = defineProps<ScalarWrappingTextProps>()\n\n/**\n * Unicode character for zero-width non-joiner\n *\n * @see https://en.wikipedia.org/wiki/Zero-width_non-joiner\n */\nconst ZWNJ = '\\u2060'\n\n// We don't want to inherit any attributes because we going to return many nodes\ndefineOptions({ inheritAttrs: false })\n\nconst words = computed<string[]>(() => {\n  const wrapRegex = new RegExp(regex ?? PRESETS[preset], 'g')\n  // Insert the marker before each delimiter\n  const marked = text.replace(wrapRegex, `${ZWNJ}$&`)\n  // Split on the marker and filter out any empty strings\n  return marked.split(ZWNJ).filter(Boolean)\n})\n</script>\n<template>\n  <template\n    v-for=\"(word, i) in words\"\n    :key=\"i\">\n    <wbr />{{ word }}\n  </template>\n</template>\n"],"mappings":""}
+{"version":3,"file":"ScalarWrappingText.vue.js","names":[],"sources":["../../../src/components/ScalarWrappingText/ScalarWrappingText.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Scalar Text Wrapping component\n *\n * Adds word breaks to the text to allow improved line wrapping\n *\n * Does not inherit any attributes because it returns a set of html nodes\n *\n * @example\n * <ScalarWrappingText text=\"/this/is/a/long/path/that/needs/to/be/wrapped\" />\n */\nexport default {}\n</script>\n<script setup lang=\"ts\">\nimport { computed } from 'vue'\n\nimport { PRESETS } from './constants'\nimport type { ScalarWrappingTextProps } from './types'\n\nconst {\n  text = '',\n  preset = 'path',\n  regex,\n} = defineProps<ScalarWrappingTextProps>()\n\n/**\n * Unicode character for zero-width non-joiner\n *\n * @see https://en.wikipedia.org/wiki/Zero-width_non-joiner\n */\nconst ZWNJ = '\\u2060'\n\n// We don't want to inherit any attributes because we going to return many nodes\ndefineOptions({ inheritAttrs: false })\n\nconst words = computed<string[]>(() => {\n  const wrapRegex = new RegExp(regex ?? PRESETS[preset], 'g')\n  // Insert the marker before each delimiter\n  const marked = text.replace(wrapRegex, `${ZWNJ}$&`)\n  // Split on the marker and filter out any empty strings\n  return marked.split(ZWNJ).filter(Boolean)\n})\n</script>\n<template>\n  <template\n    v-for=\"(word, i) in words\"\n    :key=\"i\">\n    <wbr v-if=\"i !== 0\" />{{ word }}\n  </template>\n</template>\n"],"mappings":""}

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

@@ -1,5 +1,7 @@
 import { PRESETS } from "./constants.js";
-import { Fragment, computed, createElementBlock, createElementVNode, createTextVNode, defineComponent, openBlock, renderList, toDisplayString } from "vue";
+import { Fragment, computed, createCommentVNode, createElementBlock, createTextVNode, defineComponent, openBlock, renderList, toDisplayString } from "vue";
+//#region src/components/ScalarWrappingText/ScalarWrappingText.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = { key: 0 };
 var ScalarWrappingText_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
 	inheritAttrs: false,
 	__name: "ScalarWrappingText",
@@ -21,7 +23,7 @@ var ScalarWrappingText_vue_vue_type_script_setup_true_lang_default = /* @__PURE_
 		});
 		return (_ctx, _cache) => {
 			return openBlock(true), createElementBlock(Fragment, null, renderList(words.value, (word, i) => {
-				return openBlock(), createElementBlock(Fragment, { key: i }, [_cache[0] || (_cache[0] = createElementVNode("wbr", null, null, -1)), createTextVNode(toDisplayString(word), 1)], 64);
+				return openBlock(), createElementBlock(Fragment, { key: i }, [i !== 0 ? (openBlock(), createElementBlock("wbr", _hoisted_1)) : createCommentVNode("", true), createTextVNode(toDisplayString(word), 1)], 64);
 			}), 128);
 		};
 	}

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

@@ -1 +1 @@
-{"version":3,"file":"ScalarWrappingText.vue.script.js","names":[],"sources":["../../../src/components/ScalarWrappingText/ScalarWrappingText.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Scalar Text Wrapping component\n *\n * Adds word breaks to the text to allow improved line wrapping\n *\n * Does not inherit any attributes because it returns a set of html nodes\n *\n * @example\n * <ScalarWrappingText text=\"/this/is/a/long/path/that/needs/to/be/wrapped\" />\n */\nexport default {}\n</script>\n<script setup lang=\"ts\">\nimport { computed } from 'vue'\n\nimport { PRESETS } from './constants'\nimport type { ScalarWrappingTextProps } from './types'\n\nconst {\n  text = '',\n  preset = 'path',\n  regex,\n} = defineProps<ScalarWrappingTextProps>()\n\n/**\n * Unicode character for zero-width non-joiner\n *\n * @see https://en.wikipedia.org/wiki/Zero-width_non-joiner\n */\nconst ZWNJ = '\\u2060'\n\n// We don't want to inherit any attributes because we going to return many nodes\ndefineOptions({ inheritAttrs: false })\n\nconst words = computed<string[]>(() => {\n  const wrapRegex = new RegExp(regex ?? PRESETS[preset], 'g')\n  // Insert the marker before each delimiter\n  const marked = text.replace(wrapRegex, `${ZWNJ}$&`)\n  // Split on the marker and filter out any empty strings\n  return marked.split(ZWNJ).filter(Boolean)\n})\n</script>\n<template>\n  <template\n    v-for=\"(word, i) in words\"\n    :key=\"i\">\n    <wbr />{{ word }}\n  </template>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;EA8BA,MAAM,OAAO;EAKb,MAAM,QAAQ,eAAyB;GACrC,MAAM,YAAY,IAAI,OAAO,QAAA,SAAS,QAAQ,QAAA,SAAS,IAAG;AAI1D,UAFe,QAAA,KAAK,QAAQ,WAAW,GAAG,KAAK,IAAG,CAEpC,MAAM,KAAK,CAAC,OAAO,QAAO;IACzC;;2BAGC,mBAIW,UAAA,MAAA,WAHW,MAAA,QAAZ,MAAM,MAAC;4DACT,GAAC,EAAA,CAAA,OAAA,OAAA,OAAA,KACP,mBAAO,OAAA,MAAA,MAAA,GAAA,GAAA,gBAAA,gBAAG,KAAI,EAAA,EAAA,CAAA,EAAA,GAAA"}
+{"version":3,"file":"ScalarWrappingText.vue.script.js","names":[],"sources":["../../../src/components/ScalarWrappingText/ScalarWrappingText.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Scalar Text Wrapping component\n *\n * Adds word breaks to the text to allow improved line wrapping\n *\n * Does not inherit any attributes because it returns a set of html nodes\n *\n * @example\n * <ScalarWrappingText text=\"/this/is/a/long/path/that/needs/to/be/wrapped\" />\n */\nexport default {}\n</script>\n<script setup lang=\"ts\">\nimport { computed } from 'vue'\n\nimport { PRESETS } from './constants'\nimport type { ScalarWrappingTextProps } from './types'\n\nconst {\n  text = '',\n  preset = 'path',\n  regex,\n} = defineProps<ScalarWrappingTextProps>()\n\n/**\n * Unicode character for zero-width non-joiner\n *\n * @see https://en.wikipedia.org/wiki/Zero-width_non-joiner\n */\nconst ZWNJ = '\\u2060'\n\n// We don't want to inherit any attributes because we going to return many nodes\ndefineOptions({ inheritAttrs: false })\n\nconst words = computed<string[]>(() => {\n  const wrapRegex = new RegExp(regex ?? PRESETS[preset], 'g')\n  // Insert the marker before each delimiter\n  const marked = text.replace(wrapRegex, `${ZWNJ}$&`)\n  // Split on the marker and filter out any empty strings\n  return marked.split(ZWNJ).filter(Boolean)\n})\n</script>\n<template>\n  <template\n    v-for=\"(word, i) in words\"\n    :key=\"i\">\n    <wbr v-if=\"i !== 0\" />{{ word }}\n  </template>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;EA8BA,MAAM,OAAO;EAKb,MAAM,QAAQ,eAAyB;GACrC,MAAM,YAAY,IAAI,OAAO,QAAA,SAAS,QAAQ,QAAA,SAAS,IAAG;AAI1D,UAFe,QAAA,KAAK,QAAQ,WAAW,GAAG,KAAK,IAAG,CAEpC,MAAM,KAAK,CAAC,OAAO,QAAO;IACzC;;2BAGC,mBAIW,UAAA,MAAA,WAHW,MAAA,QAAZ,MAAM,MAAC;4DACT,GAAC,EAAA,CACI,MAAC,KAAA,WAAA,EAAZ,mBAAsB,OAAA,WAAA,IAAA,mBAAA,IAAA,KAAA,EAAA,gBAAA,gBAAG,KAAI,EAAA,EAAA,CAAA,EAAA,GAAA"}

package/dist/index.d.ts

@@ -1,39 +1,50 @@
 import './style.css';
 export { compose, cva, cx, tw, useBindCx } from '@scalar/use-hooks/useBindCx';
-/** biome-ignore-start lint/performance/noReExportAll: re-exports indexes */
-export * from './components/ScalarButton';
-export * from './components/ScalarCard';
-export * from './components/ScalarCheckboxInput';
-export * from './components/ScalarCodeBlock';
-export * from './components/ScalarColorModeToggle';
-export * from './components/ScalarCombobox';
-export * from './components/ScalarCopy';
-export * from './components/ScalarDropdown';
-export * from './components/ScalarErrorBoundary';
-export * from './components/ScalarFileUpload';
-export * from './components/ScalarFloating';
-export * from './components/ScalarForm';
-export * from './components/ScalarHeader';
-export * from './components/ScalarHotkey';
-export * from './components/ScalarIcon';
-export * from './components/ScalarIconButton';
-export * from './components/ScalarListbox';
-export * from './components/ScalarLoading';
-export * from './components/ScalarMarkdown';
-export * from './components/ScalarMenu';
-export * from './components/ScalarModal';
-export * from './components/ScalarPopover';
-export * from './components/ScalarSearchInput';
-export * from './components/ScalarSearchResults';
-export * from './components/ScalarSidebar';
-export * from './components/ScalarTeleport';
-export * from './components/ScalarTextArea';
-export * from './components/ScalarTextInput';
-export * from './components/ScalarThemeSwatches';
-export * from './components/ScalarToggle';
-export * from './components/ScalarTooltip';
-export * from './components/ScalarVirtualText';
-export * from './components/ScalarWrappingText';
-export * from './helpers';
-/** biome-ignore-end lint/performance/noReExportAll: re-exports indexes */
+export type { ScalarButtonSize, ScalarButtonVariant } from './components/ScalarButton';
+export { ScalarButton } from './components/ScalarButton';
+export { ScalarCard, ScalarCardFooter, ScalarCardHeader, ScalarCardSection } from './components/ScalarCard';
+export type { ScalarCheckboxOption, ScalarCheckboxType } from './components/ScalarCheckboxInput';
+export { ScalarCheckbox, ScalarCheckboxGroup, ScalarCheckboxInput, ScalarCheckboxRadioGroup, } from './components/ScalarCheckboxInput';
+export { ScalarCodeBlock, ScalarCodeBlockCopy } from './components/ScalarCodeBlock';
+export { ScalarColorModeToggle, ScalarColorModeToggleButton, ScalarColorModeToggleIcon, } from './components/ScalarColorModeToggle';
+export type { ScalarComboboxFilterFunction, ScalarComboboxOption, ScalarComboboxOptionGroup, ScalarComboboxOptionsOrGroups, } from './components/ScalarCombobox';
+export { ScalarCombobox, ScalarComboboxMultiselect, isScalarComboboxGroups } from './components/ScalarCombobox';
+export { ScalarCopy, ScalarCopyBackdrop, ScalarCopyButton } from './components/ScalarCopy';
+export { ScalarDropdown, ScalarDropdownButton, ScalarDropdownDivider, ScalarDropdownItem, ScalarDropdownMenu, } from './components/ScalarDropdown';
+export { ScalarErrorBoundary } from './components/ScalarErrorBoundary';
+export { ScalarFileUpload, ScalarFileUploadDropTarget, ScalarFileUploadError, ScalarFileUploadFileList, ScalarFileUploadInput, ScalarFileUploadInputCompact, ScalarFileUploadLoading, } from './components/ScalarFileUpload';
+export type { ScalarFloatingOptions } from './components/ScalarFloating';
+export { ScalarFloating, ScalarFloatingBackdrop } from './components/ScalarFloating';
+export { ScalarForm, ScalarFormError, ScalarFormField, ScalarFormInput, ScalarFormInputGroup, ScalarFormSection, } from './components/ScalarForm';
+export { ScalarHeader, ScalarHeaderButton } from './components/ScalarHeader';
+export type { ScalarHotkeyModifier } from './components/ScalarHotkey';
+export { ScalarHotkey, formatHotkeySymbols } from './components/ScalarHotkey';
+export type { Icon } from './components/ScalarIcon';
+export { ScalarIcon, ScalarIconLegacyAdapter } from './components/ScalarIcon';
+export { ScalarIconButton } from './components/ScalarIconButton';
+export type { ScalarListboxOption } from './components/ScalarListbox';
+export { ScalarListbox, ScalarListboxCheckbox, ScalarListboxInput, ScalarListboxItem } from './components/ScalarListbox';
+export type { LoadingState } from './components/ScalarLoading';
+export { ScalarLoading, useLoadingState } from './components/ScalarLoading';
+export { ScalarMarkdown, ScalarMarkdownSummary } from './components/ScalarMarkdown';
+export type { ScalarMenuTeamOption, WorkspaceGroup } from './components/ScalarMenu';
+export { ScalarMenu, ScalarMenuButton, ScalarMenuLink, ScalarMenuProduct, ScalarMenuProducts, ScalarMenuResources, ScalarMenuSection, ScalarMenuSupport, ScalarMenuTeamPicker, ScalarMenuTeamProfile, ScalarMenuWorkspacePicker, } from './components/ScalarMenu';
+export type { ModalState } from './components/ScalarModal';
+export { ScalarModal, useModal } from './components/ScalarModal';
+export type { ScalarPopoverSlots } from './components/ScalarPopover';
+export { ScalarPopover } from './components/ScalarPopover';
+export { ScalarSavePrompt } from './components/ScalarSavePrompt';
+export { ScalarSearchInput } from './components/ScalarSearchInput';
+export { ScalarSearchResultItem, ScalarSearchResultList } from './components/ScalarSearchResults';
+export { ScalarSidebar, ScalarSidebarButton, ScalarSidebarFooter, ScalarSidebarGroup, ScalarSidebarGroupToggle, ScalarSidebarIndent, ScalarSidebarItem, ScalarSidebarItems, ScalarSidebarNestedItems, ScalarSidebarSearchButton, ScalarSidebarSearchInput, ScalarSidebarSection, ScalarSidebarSpacer, } from './components/ScalarSidebar';
+export { ScalarTeleport, ScalarTeleportRoot, TELEPORT_SYMBOL, useProvideTeleport, useTeleport, } from './components/ScalarTeleport';
+export { ScalarTextArea } from './components/ScalarTextArea';
+export { ScalarTextInput, ScalarTextInputCopy } from './components/ScalarTextInput';
+export { ScalarThemeSwatches, useThemeSwatches } from './components/ScalarThemeSwatches';
+export { ScalarToggle, ScalarToggleGroup, ScalarToggleInput } from './components/ScalarToggle';
+export type { ScalarTooltipPlacement, TooltipConfiguration } from './components/ScalarTooltip';
+export { ScalarHotkeyTooltip, ScalarTooltip, useTooltip } from './components/ScalarTooltip';
+export { ScalarVirtualText } from './components/ScalarVirtualText';
+export { ScalarWrappingText } from './components/ScalarWrappingText';
+export { addScalarClassesToHeadless } from './helpers';
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,aAAa,CAAA;AAEpB,OAAO,EAAE,OAAO,EAAE,GAAG,EAAE,EAAE,EAAE,EAAE,EAAE,SAAS,EAAE,MAAM,6BAA6B,CAAA;AAE7E,4EAA4E;AAC5E,cAAc,2BAA2B,CAAA;AACzC,cAAc,yBAAyB,CAAA;AACvC,cAAc,kCAAkC,CAAA;AAChD,cAAc,8BAA8B,CAAA;AAC5C,cAAc,oCAAoC,CAAA;AAClD,cAAc,6BAA6B,CAAA;AAC3C,cAAc,yBAAyB,CAAA;AACvC,cAAc,6BAA6B,CAAA;AAC3C,cAAc,kCAAkC,CAAA;AAChD,cAAc,+BAA+B,CAAA;AAC7C,cAAc,6BAA6B,CAAA;AAC3C,cAAc,yBAAyB,CAAA;AACvC,cAAc,2BAA2B,CAAA;AACzC,cAAc,2BAA2B,CAAA;AACzC,cAAc,yBAAyB,CAAA;AACvC,cAAc,+BAA+B,CAAA;AAC7C,cAAc,4BAA4B,CAAA;AAC1C,cAAc,4BAA4B,CAAA;AAC1C,cAAc,6BAA6B,CAAA;AAC3C,cAAc,yBAAyB,CAAA;AACvC,cAAc,0BAA0B,CAAA;AACxC,cAAc,4BAA4B,CAAA;AAC1C,cAAc,gCAAgC,CAAA;AAC9C,cAAc,kCAAkC,CAAA;AAChD,cAAc,4BAA4B,CAAA;AAC1C,cAAc,6BAA6B,CAAA;AAC3C,cAAc,6BAA6B,CAAA;AAC3C,cAAc,8BAA8B,CAAA;AAC5C,cAAc,kCAAkC,CAAA;AAChD,cAAc,2BAA2B,CAAA;AACzC,cAAc,4BAA4B,CAAA;AAC1C,cAAc,gCAAgC,CAAA;AAC9C,cAAc,iCAAiC,CAAA;AAC/C,cAAc,WAAW,CAAA;AACzB,0EAA0E"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}

package/dist/index.js

@@ -75,6 +75,7 @@ import ScalarMenuWorkspacePicker_default from "./components/ScalarMenu/ScalarMen
 import { useModal } from "./components/ScalarModal/ScalarModal.vue.script.js";
 import ScalarModal_default from "./components/ScalarModal/ScalarModal.vue.js";
 import ScalarPopover_default from "./components/ScalarPopover/ScalarPopover.vue.js";
+import ScalarSavePrompt_default from "./components/ScalarSavePrompt/ScalarSavePrompt.vue.js";
 import ScalarSearchInput_default from "./components/ScalarSearchInput/ScalarSearchInput.vue.js";
 import ScalarSearchResultItem_default from "./components/ScalarSearchResults/ScalarSearchResultItem.vue.js";
 import ScalarSearchResultList_default from "./components/ScalarSearchResults/ScalarSearchResultList.vue.js";
@@ -103,9 +104,4 @@ import ScalarVirtualText_default from "./components/ScalarVirtualText/ScalarVirt
 import ScalarWrappingText_default from "./components/ScalarWrappingText/ScalarWrappingText.vue.js";
 import { addScalarClassesToHeadless } from "./helpers/add-scalar-classes.js";
 import { compose, cva, cx, tw, useBindCx } from "@scalar/use-hooks/useBindCx";
-//#region src/index.ts
-/** biome-ignore-end lint/performance/noReExportAll: re-exports indexes */
-//#endregion
-export { ScalarButton_default as ScalarButton, ScalarCard_default as ScalarCard, ScalarCardFooter_default as ScalarCardFooter, ScalarCardHeader_default as ScalarCardHeader, ScalarCardSection_default as ScalarCardSection, ScalarCheckbox_default as ScalarCheckbox, ScalarCheckboxGroup_default as ScalarCheckboxGroup, ScalarCheckboxInput_default as ScalarCheckboxInput, ScalarCheckboxRadioGroup_default as ScalarCheckboxRadioGroup, ScalarCodeBlock_default as ScalarCodeBlock, ScalarCodeBlockCopy_default as ScalarCodeBlockCopy, ScalarColorModeToggle_default as ScalarColorModeToggle, ScalarColorModeToggleButton_default as ScalarColorModeToggleButton, ScalarColorModeToggleIcon_default as ScalarColorModeToggleIcon, ScalarCombobox_default as ScalarCombobox, ScalarComboboxMultiselect_default as ScalarComboboxMultiselect, ScalarCopy_default as ScalarCopy, ScalarCopyBackdrop_default as ScalarCopyBackdrop, ScalarCopyButton_default as ScalarCopyButton, ScalarDropdown_default as ScalarDropdown, ScalarDropdownButton_default as ScalarDropdownButton, ScalarDropdownDivider_default as ScalarDropdownDivider, ScalarDropdownItem_default as ScalarDropdownItem, ScalarDropdownMenu_default as ScalarDropdownMenu, ScalarErrorBoundary_default as ScalarErrorBoundary, ScalarFileUpload_default as ScalarFileUpload, ScalarFileUploadDropTarget_default as ScalarFileUploadDropTarget, ScalarFileUploadError_default as ScalarFileUploadError, ScalarFileUploadFileList_default as ScalarFileUploadFileList, ScalarFileUploadInput_default as ScalarFileUploadInput, ScalarFileUploadInputCompact_default as ScalarFileUploadInputCompact, ScalarFileUploadLoading_default as ScalarFileUploadLoading, ScalarFloating_default as ScalarFloating, ScalarFloatingBackdrop_default as ScalarFloatingBackdrop, ScalarForm_default as ScalarForm, ScalarFormError_default as ScalarFormError, ScalarFormField_default as ScalarFormField, ScalarFormInput_default as ScalarFormInput, ScalarFormInputGroup_default as ScalarFormInputGroup, ScalarFormSection_default as ScalarFormSection, ScalarHeader_default as ScalarHeader, ScalarHeaderButton_default as ScalarHeaderButton, ScalarHotkey_default as ScalarHotkey, ScalarHotkeyTooltip_default as ScalarHotkeyTooltip, ScalarIcon_default as ScalarIcon, ScalarIconButton_default as ScalarIconButton, ScalarIconLegacyAdapter_default as ScalarIconLegacyAdapter, ScalarListbox_default as ScalarListbox, ScalarListboxCheckbox_default as ScalarListboxCheckbox, ScalarListboxInput_default as ScalarListboxInput, ScalarListboxItem_default as ScalarListboxItem, ScalarLoading_default as ScalarLoading, ScalarMarkdown_default as ScalarMarkdown, ScalarMarkdownSummary_default as ScalarMarkdownSummary, ScalarMenu_default as ScalarMenu, ScalarMenuButton_default as ScalarMenuButton, ScalarMenuLink_default as ScalarMenuLink, ScalarMenuProduct_default as ScalarMenuProduct, ScalarMenuProducts_default as ScalarMenuProducts, ScalarMenuResources_default as ScalarMenuResources, ScalarMenuSection_default as ScalarMenuSection, ScalarMenuSupport_default as ScalarMenuSupport, ScalarMenuTeamPicker_default as ScalarMenuTeamPicker, ScalarMenuTeamProfile_default as ScalarMenuTeamProfile, ScalarMenuWorkspacePicker_default as ScalarMenuWorkspacePicker, ScalarModal_default as ScalarModal, ScalarPopover_default as ScalarPopover, ScalarSearchInput_default as ScalarSearchInput, ScalarSearchResultItem_default as ScalarSearchResultItem, ScalarSearchResultList_default as ScalarSearchResultList, ScalarSidebar_default as ScalarSidebar, ScalarSidebarButton_default as ScalarSidebarButton, ScalarSidebarFooter_default as ScalarSidebarFooter, ScalarSidebarGroup_default as ScalarSidebarGroup, ScalarSidebarGroupToggle_default as ScalarSidebarGroupToggle, ScalarSidebarIndent_default as ScalarSidebarIndent, ScalarSidebarItem_default as ScalarSidebarItem, ScalarSidebarItems_default as ScalarSidebarItems, ScalarSidebarNestedItems_default as ScalarSidebarNestedItems, ScalarSidebarSearchButton_default as ScalarSidebarSearchButton, ScalarSidebarSearchInput_default as ScalarSidebarSearchInput, ScalarSidebarSection_default as ScalarSidebarSection, ScalarSidebarSpacer_default as ScalarSidebarSpacer, ScalarTeleport_default as ScalarTeleport, ScalarTeleportRoot_default as ScalarTeleportRoot, ScalarTextArea_default as ScalarTextArea, ScalarTextInput_default as ScalarTextInput, ScalarTextInputCopy_default as ScalarTextInputCopy, ScalarThemeSwatches_default as ScalarThemeSwatches, ScalarToggle_default as ScalarToggle, ScalarToggleGroup_default as ScalarToggleGroup, ScalarToggleInput_default as ScalarToggleInput, ScalarTooltip_default as ScalarTooltip, ScalarVirtualText_default as ScalarVirtualText, ScalarWrappingText_default as ScalarWrappingText, TELEPORT_SYMBOL, addScalarClassesToHeadless, compose, cva, cx, formatHotkeySymbols, isGroups as isScalarComboboxGroups, tw, useBindCx, useLoadingState, useModal, useProvideTeleport, useTeleport, useThemeSwatches, useTooltip };
-
-//# sourceMappingURL=index.js.map
+export { ScalarButton_default as ScalarButton, ScalarCard_default as ScalarCard, ScalarCardFooter_default as ScalarCardFooter, ScalarCardHeader_default as ScalarCardHeader, ScalarCardSection_default as ScalarCardSection, ScalarCheckbox_default as ScalarCheckbox, ScalarCheckboxGroup_default as ScalarCheckboxGroup, ScalarCheckboxInput_default as ScalarCheckboxInput, ScalarCheckboxRadioGroup_default as ScalarCheckboxRadioGroup, ScalarCodeBlock_default as ScalarCodeBlock, ScalarCodeBlockCopy_default as ScalarCodeBlockCopy, ScalarColorModeToggle_default as ScalarColorModeToggle, ScalarColorModeToggleButton_default as ScalarColorModeToggleButton, ScalarColorModeToggleIcon_default as ScalarColorModeToggleIcon, ScalarCombobox_default as ScalarCombobox, ScalarComboboxMultiselect_default as ScalarComboboxMultiselect, ScalarCopy_default as ScalarCopy, ScalarCopyBackdrop_default as ScalarCopyBackdrop, ScalarCopyButton_default as ScalarCopyButton, ScalarDropdown_default as ScalarDropdown, ScalarDropdownButton_default as ScalarDropdownButton, ScalarDropdownDivider_default as ScalarDropdownDivider, ScalarDropdownItem_default as ScalarDropdownItem, ScalarDropdownMenu_default as ScalarDropdownMenu, ScalarErrorBoundary_default as ScalarErrorBoundary, ScalarFileUpload_default as ScalarFileUpload, ScalarFileUploadDropTarget_default as ScalarFileUploadDropTarget, ScalarFileUploadError_default as ScalarFileUploadError, ScalarFileUploadFileList_default as ScalarFileUploadFileList, ScalarFileUploadInput_default as ScalarFileUploadInput, ScalarFileUploadInputCompact_default as ScalarFileUploadInputCompact, ScalarFileUploadLoading_default as ScalarFileUploadLoading, ScalarFloating_default as ScalarFloating, ScalarFloatingBackdrop_default as ScalarFloatingBackdrop, ScalarForm_default as ScalarForm, ScalarFormError_default as ScalarFormError, ScalarFormField_default as ScalarFormField, ScalarFormInput_default as ScalarFormInput, ScalarFormInputGroup_default as ScalarFormInputGroup, ScalarFormSection_default as ScalarFormSection, ScalarHeader_default as ScalarHeader, ScalarHeaderButton_default as ScalarHeaderButton, ScalarHotkey_default as ScalarHotkey, ScalarHotkeyTooltip_default as ScalarHotkeyTooltip, ScalarIcon_default as ScalarIcon, ScalarIconButton_default as ScalarIconButton, ScalarIconLegacyAdapter_default as ScalarIconLegacyAdapter, ScalarListbox_default as ScalarListbox, ScalarListboxCheckbox_default as ScalarListboxCheckbox, ScalarListboxInput_default as ScalarListboxInput, ScalarListboxItem_default as ScalarListboxItem, ScalarLoading_default as ScalarLoading, ScalarMarkdown_default as ScalarMarkdown, ScalarMarkdownSummary_default as ScalarMarkdownSummary, ScalarMenu_default as ScalarMenu, ScalarMenuButton_default as ScalarMenuButton, ScalarMenuLink_default as ScalarMenuLink, ScalarMenuProduct_default as ScalarMenuProduct, ScalarMenuProducts_default as ScalarMenuProducts, ScalarMenuResources_default as ScalarMenuResources, ScalarMenuSection_default as ScalarMenuSection, ScalarMenuSupport_default as ScalarMenuSupport, ScalarMenuTeamPicker_default as ScalarMenuTeamPicker, ScalarMenuTeamProfile_default as ScalarMenuTeamProfile, ScalarMenuWorkspacePicker_default as ScalarMenuWorkspacePicker, ScalarModal_default as ScalarModal, ScalarPopover_default as ScalarPopover, ScalarSavePrompt_default as ScalarSavePrompt, ScalarSearchInput_default as ScalarSearchInput, ScalarSearchResultItem_default as ScalarSearchResultItem, ScalarSearchResultList_default as ScalarSearchResultList, ScalarSidebar_default as ScalarSidebar, ScalarSidebarButton_default as ScalarSidebarButton, ScalarSidebarFooter_default as ScalarSidebarFooter, ScalarSidebarGroup_default as ScalarSidebarGroup, ScalarSidebarGroupToggle_default as ScalarSidebarGroupToggle, ScalarSidebarIndent_default as ScalarSidebarIndent, ScalarSidebarItem_default as ScalarSidebarItem, ScalarSidebarItems_default as ScalarSidebarItems, ScalarSidebarNestedItems_default as ScalarSidebarNestedItems, ScalarSidebarSearchButton_default as ScalarSidebarSearchButton, ScalarSidebarSearchInput_default as ScalarSidebarSearchInput, ScalarSidebarSection_default as ScalarSidebarSection, ScalarSidebarSpacer_default as ScalarSidebarSpacer, ScalarTeleport_default as ScalarTeleport, ScalarTeleportRoot_default as ScalarTeleportRoot, ScalarTextArea_default as ScalarTextArea, ScalarTextInput_default as ScalarTextInput, ScalarTextInputCopy_default as ScalarTextInputCopy, ScalarThemeSwatches_default as ScalarThemeSwatches, ScalarToggle_default as ScalarToggle, ScalarToggleGroup_default as ScalarToggleGroup, ScalarToggleInput_default as ScalarToggleInput, ScalarTooltip_default as ScalarTooltip, ScalarVirtualText_default as ScalarVirtualText, ScalarWrappingText_default as ScalarWrappingText, TELEPORT_SYMBOL, addScalarClassesToHeadless, compose, cva, cx, formatHotkeySymbols, isGroups as isScalarComboboxGroups, tw, useBindCx, useLoadingState, useModal, useProvideTeleport, useTeleport, useThemeSwatches, useTooltip };

package/dist/style.css

@@ -1098,6 +1098,20 @@ img,
   display: flex;
 }
 /*! tailwindcss v4.2.1 | MIT License | https://tailwindcss.com */
+.animate-sidebar-border-bottom {
+  animation: forwards border-bottom;
+  animation-timeline: scroll();
+  animation-range-end: 1px;
+}
+@keyframes border-bottom {
+from {
+    border-bottom-width: 0;
+}
+to {
+    border-bottom-width: var(--scalar-border-width);
+}
+}
+/*! tailwindcss v4.2.1 | MIT License | https://tailwindcss.com */
 .group\/sidebar-section:first-of-type > .group\/spacer-before, .group\/sidebar-section:last-of-type > .group\/spacer-after {
   height: 0;
 }
@@ -1405,6 +1419,7 @@ img,
     --scalar-text-decoration-hover: underline;
     --scalar-link-font-weight: inherit;
     --scalar-sidebar-indent: 20px;
+    --scalar-sidebar-padding: 12px;
   }
 
   .dark-mode {
@@ -1837,6 +1852,10 @@ img,
   }
 }
 
+:where(.scalar-app) [class*="rotate-"], :where(.scalar-app) [class*="translate-"], :where(.scalar-app) [class*="scale-"] {
+  transform: none;
+}
+
 .scalar-app .pointer-events-none {
   pointer-events: none;
 }
@@ -1930,6 +1949,10 @@ img,
   top: var(--nested-items-offset) !important;
 }
 
+.scalar-app .top-\(--scalar-sidebar-sticky-offset\,0\) {
+  top: var(--scalar-sidebar-sticky-offset, 0);
+}
+
 .scalar-app .top-0 {
   top: 0;
 }
@@ -1998,10 +2021,18 @@ img,
   right: 10px;
 }
 
+.scalar-app .bottom-4 {
+  bottom: 16px;
+}
+
 .scalar-app .left-0 {
   left: 0;
 }
 
+.scalar-app .left-1\/2 {
+  left: 50%;
+}
+
 .scalar-app .left-2 {
   left: 8px;
 }
@@ -2107,6 +2138,10 @@ img,
   margin: 0 !important;
 }
 
+.scalar-app .-m-\(--scalar-sidebar-padding\) {
+  margin: calc(var(--scalar-sidebar-padding) * -1);
+}
+
 .scalar-app .-m-0\.5 {
   margin: -2px;
 }
@@ -2119,6 +2154,10 @@ img,
   margin: -6px;
 }
 
+.scalar-app .-m-2 {
+  margin: -8px;
+}
+
 .scalar-app .-m-px {
   margin: -1px;
 }
@@ -2318,11 +2357,6 @@ img,
   height: 14px;
 }
 
-.scalar-app .size-3\.25 {
-  width: 13px;
-  height: 13px;
-}
-
 .scalar-app .size-4 {
   width: 16px;
   height: 16px;
@@ -2471,6 +2505,10 @@ img,
   min-height: 48px;
 }
 
+.scalar-app .w-\(--scalar-sidebar-width\) {
+  width: var(--scalar-sidebar-width);
+}
+
 .scalar-app .w-3 {
   width: 12px;
 }
@@ -2539,6 +2577,10 @@ img,
   width: var(--scalar-border-width);
 }
 
+.scalar-app .w-content {
+  width: 720px;
+}
+
 .scalar-app .w-dvw {
   width: 100dvw;
 }
@@ -2587,6 +2629,10 @@ img,
   max-width: inherit;
 }
 
+.scalar-app .max-w-screen-padded-4 {
+  max-width: calc(100vw - 32px);
+}
+
 .scalar-app .max-w-xs {
   max-width: 320px;
 }
@@ -2619,6 +2665,11 @@ img,
   flex-shrink: 0;
 }
 
+.scalar-app .-translate-x-1\/2 {
+  --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);
+  translate: var(--tw-translate-x) var(--tw-translate-y);
+}
+
 .scalar-app .-translate-x-full {
   --tw-translate-x: -100%;
   translate: var(--tw-translate-x) var(--tw-translate-y);
@@ -2664,6 +2715,11 @@ img,
   translate: var(--tw-translate-x) var(--tw-translate-y);
 }
 
+.scalar-app .translate-y-\[200\%\] {
+  --tw-translate-y: 200%;
+  translate: var(--tw-translate-x) var(--tw-translate-y);
+}
+
 .scalar-app .scale-0 {
   --tw-scale-x: 0%;
   --tw-scale-y: 0%;
@@ -2997,6 +3053,10 @@ img,
   border-color: var(--scalar-sidebar-search-border-color, var(--scalar-border-color));
 }
 
+.scalar-app .border-b-sidebar-border {
+  border-bottom-color: var(--scalar-sidebar-border-color, var(--scalar-border-color));
+}
+
 .scalar-app .bg-\(--bg-light\) {
   background-color: var(--bg-light);
 }
@@ -3154,6 +3214,10 @@ img,
   mask-repeat: repeat;
 }
 
+.scalar-app .p-\(--scalar-sidebar-padding\) {
+  padding: var(--scalar-sidebar-padding);
+}
+
 .scalar-app .p-0 {
   padding: 0;
 }
@@ -3619,6 +3683,11 @@ img,
   transition-duration: .3s;
 }
 
+.scalar-app .duration-400 {
+  --tw-duration: .4s;
+  transition-duration: .4s;
+}
+
 .scalar-app .ease-in {
   --tw-ease: var(--ease-in);
   transition-timing-function: var(--ease-in);
@@ -3634,6 +3703,47 @@ img,
   transition-timing-function: var(--ease-out);
 }
 
+.scalar-app .ease-spring {
+  --tw-ease: linear(0,
+    .008 1.1%,
+    .034 2.3%,
+    .134 4.9%,
+    .264 7.3%,
+    .683 14.3%,
+    .797 16.5%,
+    .89 18.6%,
+    .967 20.7%,
+    1.027 22.8%,
+    1.073 25%,
+    1.104 27.3%,
+    1.123 30.6%,
+    1.119 34.3%,
+    1.018 49.5%,
+    .988 58.6%,
+    .985 65.2%,
+    1 84.5%,
+    1);
+  transition-timing-function: linear(0,
+    .008 1.1%,
+    .034 2.3%,
+    .134 4.9%,
+    .264 7.3%,
+    .683 14.3%,
+    .797 16.5%,
+    .89 18.6%,
+    .967 20.7%,
+    1.027 22.8%,
+    1.073 25%,
+    1.104 27.3%,
+    1.123 30.6%,
+    1.119 34.3%,
+    1.018 49.5%,
+    .988 58.6%,
+    .985 65.2%,
+    1 84.5%,
+    1);
+}
+
 .scalar-app .outline-none {
   --tw-outline-style: none;
   outline-style: none;
@@ -3771,12 +3881,12 @@ img,
   font-family: inherit;
 }
 
-.scalar-app .first\:rounded-t-\[inherit\]:first-child, :is(.scalar-app .\*\:first\:rounded-t-\[inherit\] > *):first-child {
+.scalar-app .first\:rounded-t-\[inherit\]:first-child {
   border-top-left-radius: inherit;
   border-top-right-radius: inherit;
 }
 
-.scalar-app .last\:rounded-b-\[inherit\]:last-child, :is(.scalar-app .\*\:last\:rounded-b-\[inherit\] > *):last-child {
+.scalar-app .last\:rounded-b-\[inherit\]:last-child {
   border-bottom-right-radius: inherit;
   border-bottom-left-radius: inherit;
 }