@scalar/sidebar - npm Package Compare versions

+1

-1

dist/components/SidebarItem.vue.d.ts.map

		@@ -1,1 +0,1 @@
		{"version":3,"file":"SidebarItem.vue.d.ts","sourceRoot":"","sources":["../../src/components/SidebarItem.vue"],"names":[],"mappings":"AAsXA,OAAO,EAEL,KAAK,YAAY,EACjB,KAAK,WAAW,EAChB,KAAK,mBAAmB,EACzB,MAAM,uBAAuB,CAAA;AAC9B,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,SAAS,CAAA;AAK3C,KAAK,WAAW,GAAG;IACjB;;OAEG;IACH,IAAI,EAAE,IAAI,CAAA;IACV;;OAEG;IACH,MAAM,EAAE,MAAM,CAAA;IACd;;OAEG;IACH,UAAU,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,OAAO,CAAA;IACnC;;OAEG;IACH,UAAU,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,OAAO,CAAA;IACnC;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;QAChB,oBAAoB,EAAE,MAAM,GAAG,SAAS,CAAA;QACxC;;;;WAIG;QACH,4BAA4B,EAAE,OAAO,CAAA;KACtC,CAAC,CAAA;IAEF;;;;OAIG;IACH,WAAW,CAAC,EAAE,mBAAmB,CAAC,aAAa,CAAC,CAAA;IAChD;;;;OAIG;IACH,WAAW,CAAC,EAAE,mBAAmB,CAAC,aAAa,CAAC,CAAA;CACjD,CAAC;AAiCF,KAAK,WAAW,GAAG;IACjB;;;OAGG;IACH,SAAS,CAAC,CAAC,KAAK,EAAE;QAAE,IAAI,EAAE,IAAI,CAAA;KAAE,GAAG,OAAO,CAAA;IAC1C;;;OAGG;IACH,KAAK,CAAC,CAAC,KAAK,EAAE;QAAE,IAAI,EAAE,IAAI,CAAA;KAAE,GAAG,OAAO,CAAA;IACtC;;;OAGG;IACH,IAAI,CAAC,CAAC,KAAK,EAAE;QAAE,IAAI,EAAE,IAAI,CAAC;QAAC,IAAI,EAAE,OAAO,CAAA;KAAE,GAAG,OAAO,CAAA;CACrD,CAAC;AAyjBF,QAAA,MAAM,UAAU;;;;;;;;kFAGd,CAAC;AACH,QAAA,MAAM,YAAY,EAAS,eAAe,CAAC,OAAO,UAAU,EAAE,WAAW,CAAC,CAAC;wBACtD,OAAO,YAAY;AAAxC,wBAAyC;AACzC,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KACV,CAAA;CACD,CAAC"}
		{"version":3,"file":"SidebarItem.vue.d.ts","sourceRoot":"","sources":["../../src/components/SidebarItem.vue"],"names":[],"mappings":"AA8XA,OAAO,EAEL,KAAK,YAAY,EACjB,KAAK,WAAW,EAChB,KAAK,mBAAmB,EACzB,MAAM,uBAAuB,CAAA;AAC9B,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,SAAS,CAAA;AAK3C,KAAK,WAAW,GAAG;IACjB;;OAEG;IACH,IAAI,EAAE,IAAI,CAAA;IACV;;OAEG;IACH,MAAM,EAAE,MAAM,CAAA;IACd;;OAEG;IACH,UAAU,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,OAAO,CAAA;IACnC;;OAEG;IACH,UAAU,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,OAAO,CAAA;IACnC;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;QAChB,oBAAoB,EAAE,MAAM,GAAG,SAAS,CAAA;QACxC;;;;WAIG;QACH,4BAA4B,EAAE,OAAO,CAAA;KACtC,CAAC,CAAA;IAEF;;;;OAIG;IACH,WAAW,CAAC,EAAE,mBAAmB,CAAC,aAAa,CAAC,CAAA;IAChD;;;;OAIG;IACH,WAAW,CAAC,EAAE,mBAAmB,CAAC,aAAa,CAAC,CAAA;CACjD,CAAC;AAiCF,KAAK,WAAW,GAAG;IACjB;;;OAGG;IACH,SAAS,CAAC,CAAC,KAAK,EAAE;QAAE,IAAI,EAAE,IAAI,CAAA;KAAE,GAAG,OAAO,CAAA;IAC1C;;;OAGG;IACH,KAAK,CAAC,CAAC,KAAK,EAAE;QAAE,IAAI,EAAE,IAAI,CAAA;KAAE,GAAG,OAAO,CAAA;IACtC;;;OAGG;IACH,IAAI,CAAC,CAAC,KAAK,EAAE;QAAE,IAAI,EAAE,IAAI,CAAC;QAAC,IAAI,EAAE,OAAO,CAAA;KAAE,GAAG,OAAO,CAAA;CACrD,CAAC;AA+jBF,QAAA,MAAM,UAAU;;;;;;;;kFAGd,CAAC;AACH,QAAA,MAAM,YAAY,EAAS,eAAe,CAAC,OAAO,UAAU,EAAE,WAAW,CAAC,CAAC;wBACtD,OAAO,YAAY;AAAxC,wBAAyC;AACzC,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KACV,CAAA;CACD,CAAC"}

+1

-1

dist/components/SidebarItem.vue.js.map

		@@ -1,1 +0,1 @@
		{"version":3,"file":"SidebarItem.vue.js","names":[],"sources":["../../src/components/SidebarItem.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport {\n ScalarSidebarGroup,\n ScalarSidebarItem,\n ScalarSidebarSection,\n} from '@scalar/components'\nimport { LibraryIcon } from '@scalar/icons/library'\nimport { computed } from 'vue'\n\nimport SidebarItemDecorator from '@/components/SidebarItemDecorator.vue'\nimport { filterItems } from '@/helpers/filter-items'\nimport { hasChildren } from '@/helpers/has-children'\nimport { isSidebarFolder } from '@/helpers/is-sidebar-folder'\nimport {\n useDraggable,\n type DraggingItem,\n type HoveredItem,\n type UseDraggableOptions,\n} from '@/hooks/use-draggable'\nimport type { Item, Layout } from '@/types'\n\nimport SidebarHttpBadge from './SidebarHttpBadge.vue'\nimport SidebarItemLabel from './SidebarItemLabel.vue'\n\nconst {\n item,\n layout,\n isSelected,\n isExpanded,\n isDraggable,\n isDroppable,\n options,\n} = defineProps<{\n /*\n The sidebar item to render.\n /\n item: Item\n /\n The layout mode for the sidebar ('client' or 'reference').\n /\n layout: Layout\n /\n Function to determine if an item is currently selected by id.\n /\n isSelected: (id: string) => boolean\n /\n Function to determine if an item is currently expanded (showing its children) by id.\n /\n isExpanded: (id: string) => boolean\n /\n Sidebar configuration options.\n * - operationTitleSource: sets whether operations show their path or summary as the display title.\n /\n options?: Partial<{\n operationTitleSource: 'path' \| 'summary'\n /\n Whether to hide the default examples for operations if there are no other examples.\n \n @default false\n /\n hideOperationDefaultExamples: boolean\n }>\n\n /\n Prevents this item from being dragged.\n \n @default true\n /\n isDraggable?: UseDraggableOptions['isDraggable']\n /\n Prevents this item from being hovered and dropped into. Can be either a function or a boolean.\n \n @default true\n /\n isDroppable?: UseDraggableOptions['isDroppable']\n}>()\n\nconst emit = defineEmits<{\n /\n Emitted when the item is selected\n * @param id - The id of the selected item\n /\n (e: 'selectItem', id: string): void\n /\n Emitted when a drag operation ends for this item\n * @param draggingItem - The item being dragged\n * @param hoveredItem - The item currently being hovered over\n /\n (e: 'onDragEnd', draggingItem: DraggingItem, hoveredItem: HoveredItem): void\n\n /\n Emitted when the group is toggled\n * @param id - The id of the group\n /\n (e: 'toggleGroup', id: string): void\n}>()\n\nconst slots = defineSlots<{\n /\n Adds an optional decorator for each item, such as an edit menu.\n * The slot receives an object with the current item.\n /\n decorator?(props: { item: Item }): unknown\n /\n Adds an optional empty state for an item.\n * The slot receives an object with the current item.\n /\n empty?(props: { item: Item }): unknown\n /\n Adds an optional icon for each item.\n * The slot receives an object with the current item and the open state.\n /\n icon?(props: { item: Item; open: boolean }): unknown\n}>()\n\nconst isGroup = (\n currentItem: Item,\n): currentItem is Item & { isGroup: true } => {\n return 'isGroup' in currentItem && currentItem.isGroup\n}\n\nconst isDeprecated = (\n currentItem: Item,\n): currentItem is Item & { isDeprecated: true } => {\n return ('isDeprecated' in currentItem && currentItem.isDeprecated) ?? false\n}\n\n/\n Handle drag end event and bubble it up to parent.\n /\nconst onDragEnd = (draggingItem: DraggingItem, hoveredItem: HoveredItem) => {\n emit('onDragEnd', draggingItem, hoveredItem)\n}\nconst { draggableAttrs, draggableEvents } = useDraggable({\n id: item.id,\n isDraggable,\n isDroppable,\n onDragEnd,\n})\n\nconst children = computed(() =>\n hasChildren(item)\n ? filterItems(layout, item.children, options?.hideOperationDefaultExamples)\n : [],\n)\n</script>\n<template>\n <!-- Sidebar section -->\n <ScalarSidebarSection\n v-if=\"children.length > 0 && isGroup(item)\"\n :data-sidebar-id=\"item.id\"\n v-bind=\"draggableAttrs\"\n v-on=\"draggableEvents\">\n {{ item.title }}\n <template #items>\n <SidebarItem\n v-for=\"child in children\"\n :key=\"child.id\"\n :isDraggable=\"isDraggable\"\n :isDroppable=\"isDroppable\"\n :isExpanded=\"isExpanded\"\n :isSelected=\"isSelected\"\n :item=\"child\"\n :layout=\"layout\"\n :options=\"options\"\n @onDragEnd=\"onDragEnd\"\n @selectItem=\"(id) => emit('selectItem', id)\"\n @toggleGroup=\"(id) => emit('toggleGroup', id)\">\n <template\n v-if=\"slots.decorator\"\n #decorator=\"slotProps\">\n <slot\n v-bind=\"slotProps\"\n name=\"decorator\" />\n </template>\n <template\n v-if=\"slots.empty\"\n #empty=\"slotProps\">\n <slot\n v-bind=\"slotProps\"\n name=\"empty\" />\n </template>\n <template\n v-if=\"slots.icon\"\n #icon=\"slotProps\">\n <slot\n v-bind=\"slotProps\"\n name=\"icon\" />\n </template>\n </SidebarItem>\n </template>\n </ScalarSidebarSection>\n\n <!-- Sidebar group (folder) -->\n <ScalarSidebarGroup\n v-else-if=\"\n isSidebarFolder(\n layout,\n item,\n slots.empty !== undefined,\n options?.hideOperationDefaultExamples ?? false,\n )\n \"\n :active=\"isSelected(item.id)\"\n class=\"relative\"\n controlled\n :data-sidebar-id=\"item.id\"\n v-bind=\"draggableAttrs\"\n :discrete=\"layout === 'reference' && item.type === 'text'\"\n :open=\"isExpanded(item.id)\"\n v-on=\"draggableEvents\"\n @click=\"() => emit('selectItem', item.id)\"\n @toggle=\"() => emit('toggleGroup', item.id)\">\n <template\n v-if=\"item.type === 'document'\"\n #icon=\"{ open }\">\n <slot\n :item=\"item\"\n name=\"icon\"\n :open=\"open\">\n <LibraryIcon\n class=\"block\"\n :src=\"('icon' in item && item.icon) \|\| 'interface-content-folder'\" />\n </slot>\n </template>\n <span\n v-if=\"isDeprecated(item)\"\n class=\"line-through\">\n <SidebarItemLabel\n :item\n :operationTitleSource=\"options?.operationTitleSource\" />\n </span>\n <SidebarItemLabel\n v-else\n :item\n :operationTitleSource=\"options?.operationTitleSource\" />\n <template\n v-if=\"'method' in item\"\n #aside>\n <SidebarHttpBadge\n :active=\"isSelected(item.id)\"\n class=\"mr-1 ml-2 h-4 self-start\"\n :class=\"{\n // Hide the badge when we're showing the decorator\n 'group-hover/button:opacity-0 group-focus-visible/button:opacity-0 group-has-[~_[aria-expanded=true]]/button:opacity-0 group-has-[~:focus-within]/button:opacity-0 group-has-[~:hover]/button:opacity-0':\n slots.decorator,\n }\"\n :method=\"item.method\"\n :webhook=\"item.type === 'webhook'\" />\n </template>\n <template\n v-if=\"slots.decorator\"\n #after>\n <SidebarItemDecorator>\n <slot\n :item\n name=\"decorator\" />\n </SidebarItemDecorator>\n </template>\n <template #items>\n <SidebarItem\n v-for=\"child in children\"\n :key=\"child.id\"\n :isDraggable=\"isDraggable\"\n :isDroppable=\"isDroppable\"\n :isExpanded=\"isExpanded\"\n :isSelected=\"isSelected\"\n :item=\"child\"\n :layout=\"layout\"\n :options=\"options\"\n :parentIds=\"[]\"\n @onDragEnd=\"onDragEnd\"\n @selectItem=\"(id) => emit('selectItem', id)\"\n @toggleGroup=\"(id) => emit('toggleGroup', id)\">\n <template\n v-if=\"slots.decorator\"\n #decorator=\"slotProps\">\n <slot\n v-bind=\"slotProps\"\n name=\"decorator\" />\n </template>\n <template\n v-if=\"slots.empty\"\n #empty=\"slotProps\">\n <slot\n v-bind=\"slotProps\"\n name=\"empty\" />\n </template>\n <template\n v-if=\"slots.icon\"\n #icon=\"slotProps\">\n <slot\n v-bind=\"slotProps\"\n name=\"icon\" />\n </template>\n </SidebarItem>\n <template v-if=\"slots.empty && (item.children?.length ?? 0) === 0\">\n <slot\n :item\n name=\"empty\" />\n </template>\n </template>\n </ScalarSidebarGroup>\n\n <!-- Sidebar item (leaf node) -->\n <ScalarSidebarItem\n is=\"button\"\n v-else\n v-bind=\"draggableAttrs\"\n class=\"relative\"\n :data-sidebar-id=\"item.id\"\n :selected=\"isSelected(item.id)\"\n v-on=\"draggableEvents\"\n @click=\"() => emit('selectItem', item.id)\">\n <template\n v-if=\"slots.icon\"\n #icon>\n <slot\n :item=\"item\"\n name=\"icon\"\n :open=\"true\" />\n </template>\n <span\n v-if=\"isDeprecated(item)\"\n class=\"line-through\">\n <SidebarItemLabel\n :item\n :operationTitleSource=\"options?.operationTitleSource\" />\n </span>\n <SidebarItemLabel\n v-else\n :item\n :operationTitleSource=\"options?.operationTitleSource\" />\n <template\n v-if=\"'method' in item\"\n #aside>\n <SidebarHttpBadge\n v-if=\"'method' in item\"\n :active=\"isSelected(item.id)\"\n class=\"ml-2 h-4 self-start\"\n :class=\"{\n // Hide the badge when we're showing the decorator\n 'group-hover/button:opacity-0 group-focus-visible/button:opacity-0 group-has-[~_[aria-expanded=true]]/button:opacity-0 group-has-[~:focus-within]/button:opacity-0 group-has-[~*:hover]/button:opacity-0':\n slots.decorator,\n }\"\n :method=\"item.method\"\n :webhook=\"item.type === 'webhook'\" />\n </template>\n <template\n v-if=\"slots.decorator\"\n #after>\n <SidebarItemDecorator>\n <slot\n :item\n name=\"decorator\" />\n </SidebarItemDecorator>\n </template>\n </ScalarSidebarItem>\n</template>\n"],"mappings":""}
		{"version":3,"file":"SidebarItem.vue.js","names":[],"sources":["../../src/components/SidebarItem.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport {\n ScalarSidebarGroup,\n ScalarSidebarItem,\n ScalarSidebarSection,\n} from '@scalar/components'\nimport { LibraryIcon } from '@scalar/icons/library'\nimport { computed } from 'vue'\n\nimport SidebarItemDecorator from '@/components/SidebarItemDecorator.vue'\nimport { filterItems } from '@/helpers/filter-items'\nimport { hasChildren } from '@/helpers/has-children'\nimport { isSidebarFolder } from '@/helpers/is-sidebar-folder'\nimport {\n useDraggable,\n type DraggingItem,\n type HoveredItem,\n type UseDraggableOptions,\n} from '@/hooks/use-draggable'\nimport type { Item, Layout } from '@/types'\n\nimport SidebarHttpBadge from './SidebarHttpBadge.vue'\nimport SidebarItemLabel from './SidebarItemLabel.vue'\n\nconst {\n item,\n layout,\n isSelected,\n isExpanded,\n isDraggable,\n isDroppable,\n options,\n} = defineProps<{\n /*\n The sidebar item to render.\n /\n item: Item\n /\n The layout mode for the sidebar ('client' or 'reference').\n /\n layout: Layout\n /\n Function to determine if an item is currently selected by id.\n /\n isSelected: (id: string) => boolean\n /\n Function to determine if an item is currently expanded (showing its children) by id.\n /\n isExpanded: (id: string) => boolean\n /\n Sidebar configuration options.\n * - operationTitleSource: sets whether operations show their path or summary as the display title.\n /\n options?: Partial<{\n operationTitleSource: 'path' \| 'summary'\n /\n Whether to hide the default examples for operations if there are no other examples.\n \n @default false\n /\n hideOperationDefaultExamples: boolean\n }>\n\n /\n Prevents this item from being dragged.\n \n @default true\n /\n isDraggable?: UseDraggableOptions['isDraggable']\n /\n Prevents this item from being hovered and dropped into. Can be either a function or a boolean.\n \n @default true\n /\n isDroppable?: UseDraggableOptions['isDroppable']\n}>()\n\nconst emit = defineEmits<{\n /\n Emitted when the item is selected\n * @param id - The id of the selected item\n /\n (e: 'selectItem', id: string): void\n /\n Emitted when a drag operation ends for this item\n * @param draggingItem - The item being dragged\n * @param hoveredItem - The item currently being hovered over\n /\n (e: 'onDragEnd', draggingItem: DraggingItem, hoveredItem: HoveredItem): void\n\n /\n Emitted when the group is toggled\n * @param id - The id of the group\n /\n (e: 'toggleGroup', id: string): void\n}>()\n\nconst slots = defineSlots<{\n /\n Adds an optional decorator for each item, such as an edit menu.\n * The slot receives an object with the current item.\n /\n decorator?(props: { item: Item }): unknown\n /\n Adds an optional empty state for an item.\n * The slot receives an object with the current item.\n /\n empty?(props: { item: Item }): unknown\n /\n Adds an optional icon for each item.\n * The slot receives an object with the current item and the open state.\n /\n icon?(props: { item: Item; open: boolean }): unknown\n}>()\n\nconst isGroup = (\n currentItem: Item,\n): currentItem is Item & { isGroup: true } => {\n return 'isGroup' in currentItem && currentItem.isGroup\n}\n\nconst isDeprecated = (\n currentItem: Item,\n): currentItem is Item & { isDeprecated: true } => {\n return ('isDeprecated' in currentItem && currentItem.isDeprecated) ?? false\n}\n\n/\n Handle drag end event and bubble it up to parent.\n /\nconst onDragEnd = (draggingItem: DraggingItem, hoveredItem: HoveredItem) => {\n emit('onDragEnd', draggingItem, hoveredItem)\n}\nconst { draggableAttrs, draggableEvents } = useDraggable({\n id: item.id,\n isDraggable,\n isDroppable,\n onDragEnd,\n})\n\nconst children = computed(() =>\n hasChildren(item)\n ? filterItems(layout, item.children, options?.hideOperationDefaultExamples)\n : [],\n)\n</script>\n<template>\n <!-- Sidebar section -->\n <ScalarSidebarSection\n v-if=\"children.length > 0 && isGroup(item)\"\n :data-sidebar-id=\"item.id\"\n v-bind=\"draggableAttrs\"\n v-on=\"draggableEvents\">\n {{ item.title }}\n <template #items>\n <SidebarItem\n v-for=\"child in children\"\n :key=\"child.id\"\n :isDraggable=\"isDraggable\"\n :isDroppable=\"isDroppable\"\n :isExpanded=\"isExpanded\"\n :isSelected=\"isSelected\"\n :item=\"child\"\n :layout=\"layout\"\n :options=\"options\"\n @onDragEnd=\"onDragEnd\"\n @selectItem=\"(id) => emit('selectItem', id)\"\n @toggleGroup=\"(id) => emit('toggleGroup', id)\">\n <template\n v-if=\"slots.decorator\"\n #decorator=\"slotProps\">\n <slot\n v-bind=\"slotProps\"\n name=\"decorator\" />\n </template>\n <template\n v-if=\"slots.empty\"\n #empty=\"slotProps\">\n <slot\n v-bind=\"slotProps\"\n name=\"empty\" />\n </template>\n <template\n v-if=\"slots.icon\"\n #icon=\"slotProps\">\n <slot\n v-bind=\"slotProps\"\n name=\"icon\" />\n </template>\n </SidebarItem>\n </template>\n </ScalarSidebarSection>\n\n <!-- Sidebar group (folder) -->\n <ScalarSidebarGroup\n v-else-if=\"\n isSidebarFolder(\n layout,\n item,\n slots.empty !== undefined,\n options?.hideOperationDefaultExamples ?? false,\n )\n \"\n :active=\"isSelected(item.id)\"\n class=\"relative\"\n controlled\n :data-sidebar-id=\"item.id\"\n v-bind=\"draggableAttrs\"\n :discrete=\"layout === 'reference' && item.type === 'text'\"\n :open=\"isExpanded(item.id)\"\n v-on=\"draggableEvents\"\n @click=\"() => emit('selectItem', item.id)\"\n @toggle=\"() => emit('toggleGroup', item.id)\">\n <template\n v-if=\"item.type === 'document'\"\n #icon=\"{ open }\">\n <slot\n :item=\"item\"\n name=\"icon\"\n :open=\"open\">\n <LibraryIcon\n class=\"block\"\n :src=\"('icon' in item && item.icon) \|\| 'interface-content-folder'\" />\n </slot>\n </template>\n <span\n v-if=\"isDeprecated(item)\"\n class=\"line-through\">\n <SidebarItemLabel\n :item\n :operationTitleSource=\"options?.operationTitleSource\" />\n </span>\n <SidebarItemLabel\n v-else\n :item\n :operationTitleSource=\"options?.operationTitleSource\" />\n <template\n v-if=\"'method' in item\"\n #aside>\n <SidebarHttpBadge\n :active=\"isSelected(item.id)\"\n class=\"ml-2 h-4 self-start\"\n :class=\"{\n // Hide the badge when we're showing the decorator\n 'group-hover/button:opacity-0 group-focus-visible/button:opacity-0 group-has-[~_[aria-expanded=true]]/button:opacity-0 group-has-[~:focus-within]/button:opacity-0 group-has-[~:hover]/button:opacity-0':\n slots.decorator,\n }\"\n :method=\"item.method\"\n :webhook=\"item.type === 'webhook'\" />\n </template>\n <!--\n Hide the chevron\n -->\n <template\n v-if=\"'method' in item\"\n #toggle>\n <!-- Nothing -->\n </template>\n <template\n v-if=\"slots.decorator\"\n #after>\n <SidebarItemDecorator>\n <slot\n :item\n name=\"decorator\" />\n </SidebarItemDecorator>\n </template>\n <template #items>\n <SidebarItem\n v-for=\"child in children\"\n :key=\"child.id\"\n :isDraggable=\"isDraggable\"\n :isDroppable=\"isDroppable\"\n :isExpanded=\"isExpanded\"\n :isSelected=\"isSelected\"\n :item=\"child\"\n :layout=\"layout\"\n :options=\"options\"\n :parentIds=\"[]\"\n @onDragEnd=\"onDragEnd\"\n @selectItem=\"(id) => emit('selectItem', id)\"\n @toggleGroup=\"(id) => emit('toggleGroup', id)\">\n <template\n v-if=\"slots.decorator\"\n #decorator=\"slotProps\">\n <slot\n v-bind=\"slotProps\"\n name=\"decorator\" />\n </template>\n <template\n v-if=\"slots.empty\"\n #empty=\"slotProps\">\n <slot\n v-bind=\"slotProps\"\n name=\"empty\" />\n </template>\n <template\n v-if=\"slots.icon\"\n #icon=\"slotProps\">\n <slot\n v-bind=\"slotProps\"\n name=\"icon\" />\n </template>\n </SidebarItem>\n <template v-if=\"slots.empty && (item.children?.length ?? 0) === 0\">\n <slot\n :item\n name=\"empty\" />\n </template>\n </template>\n </ScalarSidebarGroup>\n\n <!-- Sidebar item (leaf node) -->\n <ScalarSidebarItem\n is=\"button\"\n v-else\n v-bind=\"draggableAttrs\"\n class=\"relative\"\n :data-sidebar-id=\"item.id\"\n :selected=\"isSelected(item.id)\"\n v-on=\"draggableEvents\"\n @click=\"() => emit('selectItem', item.id)\">\n <template\n v-if=\"slots.icon\"\n #icon>\n <slot\n :item=\"item\"\n name=\"icon\"\n :open=\"true\" />\n </template>\n <span\n v-if=\"isDeprecated(item)\"\n class=\"line-through\">\n <SidebarItemLabel\n :item\n :operationTitleSource=\"options?.operationTitleSource\" />\n </span>\n <SidebarItemLabel\n v-else\n :item\n :operationTitleSource=\"options?.operationTitleSource\" />\n <template\n v-if=\"'method' in item\"\n #aside>\n <SidebarHttpBadge\n v-if=\"'method' in item\"\n :active=\"isSelected(item.id)\"\n class=\"ml-2 h-4 self-start\"\n :class=\"{\n // Hide the badge when we're showing the decorator\n 'group-hover/button:opacity-0 group-focus-visible/button:opacity-0 group-has-[~_[aria-expanded=true]]/button:opacity-0 group-has-[~:focus-within]/button:opacity-0 group-has-[~*:hover]/button:opacity-0':\n slots.decorator,\n }\"\n :method=\"item.method\"\n :webhook=\"item.type === 'webhook'\" />\n </template>\n <template\n v-if=\"slots.decorator\"\n #after>\n <SidebarItemDecorator>\n <slot\n :item\n name=\"decorator\" />\n </SidebarItemDecorator>\n </template>\n </ScalarSidebarItem>\n</template>\n"],"mappings":""}

+7

-2

dist/components/SidebarItem.vue.script.js

		@@ -186,3 +186,3 @@ import { filterItems } from "../helpers/filter-items.js";
		active: __props.isSelected(__props.item.id),
		class: normalizeClass(["mr-1 ml-2 h-4 self-start", { "group-hover/button:opacity-0 group-focus-visible/button:opacity-0 group-has-[~_[aria-expanded=true]]/button:opacity-0 group-has-[~:focus-within]/button:opacity-0 group-has-[~*:hover]/button:opacity-0": slots.decorator }]),
		class: normalizeClass(["ml-2 h-4 self-start", { "group-hover/button:opacity-0 group-focus-visible/button:opacity-0 group-has-[~_[aria-expanded=true]]/button:opacity-0 group-has-[~:focus-within]/button:opacity-0 group-has-[~*:hover]/button:opacity-0": slots.decorator }]),
		method: __props.item.method,
		@@ -198,2 +198,7 @@ webhook: __props.item.type === "webhook"
		} : void 0,
		"method" in __props.item ? {
		name: "toggle",
		fn: withCtx(() => []),
		key: "2"
		} : void 0,
		slots.decorator ? {
		@@ -205,3 +210,3 @@ name: "after",
		})]),
		key: "2"
		key: "3"
		} : void 0
		@@ -208,0 +213,0 @@ ]), 1040, [

+1

-1

dist/components/SidebarItem.vue.script.js.map

		@@ -1,1 +0,1 @@
		{"version":3,"file":"SidebarItem.vue.script.js","names":[],"sources":["../../src/components/SidebarItem.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport {\n ScalarSidebarGroup,\n ScalarSidebarItem,\n ScalarSidebarSection,\n} from '@scalar/components'\nimport { LibraryIcon } from '@scalar/icons/library'\nimport { computed } from 'vue'\n\nimport SidebarItemDecorator from '@/components/SidebarItemDecorator.vue'\nimport { filterItems } from '@/helpers/filter-items'\nimport { hasChildren } from '@/helpers/has-children'\nimport { isSidebarFolder } from '@/helpers/is-sidebar-folder'\nimport {\n useDraggable,\n type DraggingItem,\n type HoveredItem,\n type UseDraggableOptions,\n} from '@/hooks/use-draggable'\nimport type { Item, Layout } from '@/types'\n\nimport SidebarHttpBadge from './SidebarHttpBadge.vue'\nimport SidebarItemLabel from './SidebarItemLabel.vue'\n\nconst {\n item,\n layout,\n isSelected,\n isExpanded,\n isDraggable,\n isDroppable,\n options,\n} = defineProps<{\n /*\n The sidebar item to render.\n /\n item: Item\n /\n The layout mode for the sidebar ('client' or 'reference').\n /\n layout: Layout\n /\n Function to determine if an item is currently selected by id.\n /\n isSelected: (id: string) => boolean\n /\n Function to determine if an item is currently expanded (showing its children) by id.\n /\n isExpanded: (id: string) => boolean\n /\n Sidebar configuration options.\n * - operationTitleSource: sets whether operations show their path or summary as the display title.\n /\n options?: Partial<{\n operationTitleSource: 'path' \| 'summary'\n /\n Whether to hide the default examples for operations if there are no other examples.\n \n @default false\n /\n hideOperationDefaultExamples: boolean\n }>\n\n /\n Prevents this item from being dragged.\n \n @default true\n /\n isDraggable?: UseDraggableOptions['isDraggable']\n /\n Prevents this item from being hovered and dropped into. Can be either a function or a boolean.\n \n @default true\n /\n isDroppable?: UseDraggableOptions['isDroppable']\n}>()\n\nconst emit = defineEmits<{\n /\n Emitted when the item is selected\n * @param id - The id of the selected item\n /\n (e: 'selectItem', id: string): void\n /\n Emitted when a drag operation ends for this item\n * @param draggingItem - The item being dragged\n * @param hoveredItem - The item currently being hovered over\n /\n (e: 'onDragEnd', draggingItem: DraggingItem, hoveredItem: HoveredItem): void\n\n /\n Emitted when the group is toggled\n * @param id - The id of the group\n /\n (e: 'toggleGroup', id: string): void\n}>()\n\nconst slots = defineSlots<{\n /\n Adds an optional decorator for each item, such as an edit menu.\n * The slot receives an object with the current item.\n /\n decorator?(props: { item: Item }): unknown\n /\n Adds an optional empty state for an item.\n * The slot receives an object with the current item.\n /\n empty?(props: { item: Item }): unknown\n /\n Adds an optional icon for each item.\n * The slot receives an object with the current item and the open state.\n /\n icon?(props: { item: Item; open: boolean }): unknown\n}>()\n\nconst isGroup = (\n currentItem: Item,\n): currentItem is Item & { isGroup: true } => {\n return 'isGroup' in currentItem && currentItem.isGroup\n}\n\nconst isDeprecated = (\n currentItem: Item,\n): currentItem is Item & { isDeprecated: true } => {\n return ('isDeprecated' in currentItem && currentItem.isDeprecated) ?? false\n}\n\n/\n Handle drag end event and bubble it up to parent.\n /\nconst onDragEnd = (draggingItem: DraggingItem, hoveredItem: HoveredItem) => {\n emit('onDragEnd', draggingItem, hoveredItem)\n}\nconst { draggableAttrs, draggableEvents } = useDraggable({\n id: item.id,\n isDraggable,\n isDroppable,\n onDragEnd,\n})\n\nconst children = computed(() =>\n hasChildren(item)\n ? filterItems(layout, item.children, options?.hideOperationDefaultExamples)\n : [],\n)\n</script>\n<template>\n <!-- Sidebar section -->\n <ScalarSidebarSection\n v-if=\"children.length > 0 && isGroup(item)\"\n :data-sidebar-id=\"item.id\"\n v-bind=\"draggableAttrs\"\n v-on=\"draggableEvents\">\n {{ item.title }}\n <template #items>\n <SidebarItem\n v-for=\"child in children\"\n :key=\"child.id\"\n :isDraggable=\"isDraggable\"\n :isDroppable=\"isDroppable\"\n :isExpanded=\"isExpanded\"\n :isSelected=\"isSelected\"\n :item=\"child\"\n :layout=\"layout\"\n :options=\"options\"\n @onDragEnd=\"onDragEnd\"\n @selectItem=\"(id) => emit('selectItem', id)\"\n @toggleGroup=\"(id) => emit('toggleGroup', id)\">\n <template\n v-if=\"slots.decorator\"\n #decorator=\"slotProps\">\n <slot\n v-bind=\"slotProps\"\n name=\"decorator\" />\n </template>\n <template\n v-if=\"slots.empty\"\n #empty=\"slotProps\">\n <slot\n v-bind=\"slotProps\"\n name=\"empty\" />\n </template>\n <template\n v-if=\"slots.icon\"\n #icon=\"slotProps\">\n <slot\n v-bind=\"slotProps\"\n name=\"icon\" />\n </template>\n </SidebarItem>\n </template>\n </ScalarSidebarSection>\n\n <!-- Sidebar group (folder) -->\n <ScalarSidebarGroup\n v-else-if=\"\n isSidebarFolder(\n layout,\n item,\n slots.empty !== undefined,\n options?.hideOperationDefaultExamples ?? false,\n )\n \"\n :active=\"isSelected(item.id)\"\n class=\"relative\"\n controlled\n :data-sidebar-id=\"item.id\"\n v-bind=\"draggableAttrs\"\n :discrete=\"layout === 'reference' && item.type === 'text'\"\n :open=\"isExpanded(item.id)\"\n v-on=\"draggableEvents\"\n @click=\"() => emit('selectItem', item.id)\"\n @toggle=\"() => emit('toggleGroup', item.id)\">\n <template\n v-if=\"item.type === 'document'\"\n #icon=\"{ open }\">\n <slot\n :item=\"item\"\n name=\"icon\"\n :open=\"open\">\n <LibraryIcon\n class=\"block\"\n :src=\"('icon' in item && item.icon) \|\| 'interface-content-folder'\" />\n </slot>\n </template>\n <span\n v-if=\"isDeprecated(item)\"\n class=\"line-through\">\n <SidebarItemLabel\n :item\n :operationTitleSource=\"options?.operationTitleSource\" />\n </span>\n <SidebarItemLabel\n v-else\n :item\n :operationTitleSource=\"options?.operationTitleSource\" />\n <template\n v-if=\"'method' in item\"\n #aside>\n <SidebarHttpBadge\n :active=\"isSelected(item.id)\"\n class=\"mr-1 ml-2 h-4 self-start\"\n :class=\"{\n // Hide the badge when we're showing the decorator\n 'group-hover/button:opacity-0 group-focus-visible/button:opacity-0 group-has-[~_[aria-expanded=true]]/button:opacity-0 group-has-[~:focus-within]/button:opacity-0 group-has-[~:hover]/button:opacity-0':\n slots.decorator,\n }\"\n :method=\"item.method\"\n :webhook=\"item.type === 'webhook'\" />\n </template>\n <template\n v-if=\"slots.decorator\"\n #after>\n <SidebarItemDecorator>\n <slot\n :item\n name=\"decorator\" />\n </SidebarItemDecorator>\n </template>\n <template #items>\n <SidebarItem\n v-for=\"child in children\"\n :key=\"child.id\"\n :isDraggable=\"isDraggable\"\n :isDroppable=\"isDroppable\"\n :isExpanded=\"isExpanded\"\n :isSelected=\"isSelected\"\n :item=\"child\"\n :layout=\"layout\"\n :options=\"options\"\n :parentIds=\"[]\"\n @onDragEnd=\"onDragEnd\"\n @selectItem=\"(id) => emit('selectItem', id)\"\n @toggleGroup=\"(id) => emit('toggleGroup', id)\">\n <template\n v-if=\"slots.decorator\"\n #decorator=\"slotProps\">\n <slot\n v-bind=\"slotProps\"\n name=\"decorator\" />\n </template>\n <template\n v-if=\"slots.empty\"\n #empty=\"slotProps\">\n <slot\n v-bind=\"slotProps\"\n name=\"empty\" />\n </template>\n <template\n v-if=\"slots.icon\"\n #icon=\"slotProps\">\n <slot\n v-bind=\"slotProps\"\n name=\"icon\" />\n </template>\n </SidebarItem>\n <template v-if=\"slots.empty && (item.children?.length ?? 0) === 0\">\n <slot\n :item\n name=\"empty\" />\n </template>\n </template>\n </ScalarSidebarGroup>\n\n <!-- Sidebar item (leaf node) -->\n <ScalarSidebarItem\n is=\"button\"\n v-else\n v-bind=\"draggableAttrs\"\n class=\"relative\"\n :data-sidebar-id=\"item.id\"\n :selected=\"isSelected(item.id)\"\n v-on=\"draggableEvents\"\n @click=\"() => emit('selectItem', item.id)\">\n <template\n v-if=\"slots.icon\"\n #icon>\n <slot\n :item=\"item\"\n name=\"icon\"\n :open=\"true\" />\n </template>\n <span\n v-if=\"isDeprecated(item)\"\n class=\"line-through\">\n <SidebarItemLabel\n :item\n :operationTitleSource=\"options?.operationTitleSource\" />\n </span>\n <SidebarItemLabel\n v-else\n :item\n :operationTitleSource=\"options?.operationTitleSource\" />\n <template\n v-if=\"'method' in item\"\n #aside>\n <SidebarHttpBadge\n v-if=\"'method' in item\"\n :active=\"isSelected(item.id)\"\n class=\"ml-2 h-4 self-start\"\n :class=\"{\n // Hide the badge when we're showing the decorator\n 'group-hover/button:opacity-0 group-focus-visible/button:opacity-0 group-has-[~_[aria-expanded=true]]/button:opacity-0 group-has-[~:focus-within]/button:opacity-0 group-has-[~*:hover]/button:opacity-0':\n slots.decorator,\n }\"\n :method=\"item.method\"\n :webhook=\"item.type === 'webhook'\" />\n </template>\n <template\n v-if=\"slots.decorator\"\n #after>\n <SidebarItemDecorator>\n <slot\n :item\n name=\"decorator\" />\n </SidebarItemDecorator>\n </template>\n </ScalarSidebarItem>\n</template>\n"],"mappings":"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"}
		{"version":3,"file":"SidebarItem.vue.script.js","names":[],"sources":["../../src/components/SidebarItem.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport {\n ScalarSidebarGroup,\n ScalarSidebarItem,\n ScalarSidebarSection,\n} from '@scalar/components'\nimport { LibraryIcon } from '@scalar/icons/library'\nimport { computed } from 'vue'\n\nimport SidebarItemDecorator from '@/components/SidebarItemDecorator.vue'\nimport { filterItems } from '@/helpers/filter-items'\nimport { hasChildren } from '@/helpers/has-children'\nimport { isSidebarFolder } from '@/helpers/is-sidebar-folder'\nimport {\n useDraggable,\n type DraggingItem,\n type HoveredItem,\n type UseDraggableOptions,\n} from '@/hooks/use-draggable'\nimport type { Item, Layout } from '@/types'\n\nimport SidebarHttpBadge from './SidebarHttpBadge.vue'\nimport SidebarItemLabel from './SidebarItemLabel.vue'\n\nconst {\n item,\n layout,\n isSelected,\n isExpanded,\n isDraggable,\n isDroppable,\n options,\n} = defineProps<{\n /*\n The sidebar item to render.\n /\n item: Item\n /\n The layout mode for the sidebar ('client' or 'reference').\n /\n layout: Layout\n /\n Function to determine if an item is currently selected by id.\n /\n isSelected: (id: string) => boolean\n /\n Function to determine if an item is currently expanded (showing its children) by id.\n /\n isExpanded: (id: string) => boolean\n /\n Sidebar configuration options.\n * - operationTitleSource: sets whether operations show their path or summary as the display title.\n /\n options?: Partial<{\n operationTitleSource: 'path' \| 'summary'\n /\n Whether to hide the default examples for operations if there are no other examples.\n \n @default false\n /\n hideOperationDefaultExamples: boolean\n }>\n\n /\n Prevents this item from being dragged.\n \n @default true\n /\n isDraggable?: UseDraggableOptions['isDraggable']\n /\n Prevents this item from being hovered and dropped into. Can be either a function or a boolean.\n \n @default true\n /\n isDroppable?: UseDraggableOptions['isDroppable']\n}>()\n\nconst emit = defineEmits<{\n /\n Emitted when the item is selected\n * @param id - The id of the selected item\n /\n (e: 'selectItem', id: string): void\n /\n Emitted when a drag operation ends for this item\n * @param draggingItem - The item being dragged\n * @param hoveredItem - The item currently being hovered over\n /\n (e: 'onDragEnd', draggingItem: DraggingItem, hoveredItem: HoveredItem): void\n\n /\n Emitted when the group is toggled\n * @param id - The id of the group\n /\n (e: 'toggleGroup', id: string): void\n}>()\n\nconst slots = defineSlots<{\n /\n Adds an optional decorator for each item, such as an edit menu.\n * The slot receives an object with the current item.\n /\n decorator?(props: { item: Item }): unknown\n /\n Adds an optional empty state for an item.\n * The slot receives an object with the current item.\n /\n empty?(props: { item: Item }): unknown\n /\n Adds an optional icon for each item.\n * The slot receives an object with the current item and the open state.\n /\n icon?(props: { item: Item; open: boolean }): unknown\n}>()\n\nconst isGroup = (\n currentItem: Item,\n): currentItem is Item & { isGroup: true } => {\n return 'isGroup' in currentItem && currentItem.isGroup\n}\n\nconst isDeprecated = (\n currentItem: Item,\n): currentItem is Item & { isDeprecated: true } => {\n return ('isDeprecated' in currentItem && currentItem.isDeprecated) ?? false\n}\n\n/\n Handle drag end event and bubble it up to parent.\n /\nconst onDragEnd = (draggingItem: DraggingItem, hoveredItem: HoveredItem) => {\n emit('onDragEnd', draggingItem, hoveredItem)\n}\nconst { draggableAttrs, draggableEvents } = useDraggable({\n id: item.id,\n isDraggable,\n isDroppable,\n onDragEnd,\n})\n\nconst children = computed(() =>\n hasChildren(item)\n ? filterItems(layout, item.children, options?.hideOperationDefaultExamples)\n : [],\n)\n</script>\n<template>\n <!-- Sidebar section -->\n <ScalarSidebarSection\n v-if=\"children.length > 0 && isGroup(item)\"\n :data-sidebar-id=\"item.id\"\n v-bind=\"draggableAttrs\"\n v-on=\"draggableEvents\">\n {{ item.title }}\n <template #items>\n <SidebarItem\n v-for=\"child in children\"\n :key=\"child.id\"\n :isDraggable=\"isDraggable\"\n :isDroppable=\"isDroppable\"\n :isExpanded=\"isExpanded\"\n :isSelected=\"isSelected\"\n :item=\"child\"\n :layout=\"layout\"\n :options=\"options\"\n @onDragEnd=\"onDragEnd\"\n @selectItem=\"(id) => emit('selectItem', id)\"\n @toggleGroup=\"(id) => emit('toggleGroup', id)\">\n <template\n v-if=\"slots.decorator\"\n #decorator=\"slotProps\">\n <slot\n v-bind=\"slotProps\"\n name=\"decorator\" />\n </template>\n <template\n v-if=\"slots.empty\"\n #empty=\"slotProps\">\n <slot\n v-bind=\"slotProps\"\n name=\"empty\" />\n </template>\n <template\n v-if=\"slots.icon\"\n #icon=\"slotProps\">\n <slot\n v-bind=\"slotProps\"\n name=\"icon\" />\n </template>\n </SidebarItem>\n </template>\n </ScalarSidebarSection>\n\n <!-- Sidebar group (folder) -->\n <ScalarSidebarGroup\n v-else-if=\"\n isSidebarFolder(\n layout,\n item,\n slots.empty !== undefined,\n options?.hideOperationDefaultExamples ?? false,\n )\n \"\n :active=\"isSelected(item.id)\"\n class=\"relative\"\n controlled\n :data-sidebar-id=\"item.id\"\n v-bind=\"draggableAttrs\"\n :discrete=\"layout === 'reference' && item.type === 'text'\"\n :open=\"isExpanded(item.id)\"\n v-on=\"draggableEvents\"\n @click=\"() => emit('selectItem', item.id)\"\n @toggle=\"() => emit('toggleGroup', item.id)\">\n <template\n v-if=\"item.type === 'document'\"\n #icon=\"{ open }\">\n <slot\n :item=\"item\"\n name=\"icon\"\n :open=\"open\">\n <LibraryIcon\n class=\"block\"\n :src=\"('icon' in item && item.icon) \|\| 'interface-content-folder'\" />\n </slot>\n </template>\n <span\n v-if=\"isDeprecated(item)\"\n class=\"line-through\">\n <SidebarItemLabel\n :item\n :operationTitleSource=\"options?.operationTitleSource\" />\n </span>\n <SidebarItemLabel\n v-else\n :item\n :operationTitleSource=\"options?.operationTitleSource\" />\n <template\n v-if=\"'method' in item\"\n #aside>\n <SidebarHttpBadge\n :active=\"isSelected(item.id)\"\n class=\"ml-2 h-4 self-start\"\n :class=\"{\n // Hide the badge when we're showing the decorator\n 'group-hover/button:opacity-0 group-focus-visible/button:opacity-0 group-has-[~_[aria-expanded=true]]/button:opacity-0 group-has-[~:focus-within]/button:opacity-0 group-has-[~:hover]/button:opacity-0':\n slots.decorator,\n }\"\n :method=\"item.method\"\n :webhook=\"item.type === 'webhook'\" />\n </template>\n <!--\n Hide the chevron\n -->\n <template\n v-if=\"'method' in item\"\n #toggle>\n <!-- Nothing -->\n </template>\n <template\n v-if=\"slots.decorator\"\n #after>\n <SidebarItemDecorator>\n <slot\n :item\n name=\"decorator\" />\n </SidebarItemDecorator>\n </template>\n <template #items>\n <SidebarItem\n v-for=\"child in children\"\n :key=\"child.id\"\n :isDraggable=\"isDraggable\"\n :isDroppable=\"isDroppable\"\n :isExpanded=\"isExpanded\"\n :isSelected=\"isSelected\"\n :item=\"child\"\n :layout=\"layout\"\n :options=\"options\"\n :parentIds=\"[]\"\n @onDragEnd=\"onDragEnd\"\n @selectItem=\"(id) => emit('selectItem', id)\"\n @toggleGroup=\"(id) => emit('toggleGroup', id)\">\n <template\n v-if=\"slots.decorator\"\n #decorator=\"slotProps\">\n <slot\n v-bind=\"slotProps\"\n name=\"decorator\" />\n </template>\n <template\n v-if=\"slots.empty\"\n #empty=\"slotProps\">\n <slot\n v-bind=\"slotProps\"\n name=\"empty\" />\n </template>\n <template\n v-if=\"slots.icon\"\n #icon=\"slotProps\">\n <slot\n v-bind=\"slotProps\"\n name=\"icon\" />\n </template>\n </SidebarItem>\n <template v-if=\"slots.empty && (item.children?.length ?? 0) === 0\">\n <slot\n :item\n name=\"empty\" />\n </template>\n </template>\n </ScalarSidebarGroup>\n\n <!-- Sidebar item (leaf node) -->\n <ScalarSidebarItem\n is=\"button\"\n v-else\n v-bind=\"draggableAttrs\"\n class=\"relative\"\n :data-sidebar-id=\"item.id\"\n :selected=\"isSelected(item.id)\"\n v-on=\"draggableEvents\"\n @click=\"() => emit('selectItem', item.id)\">\n <template\n v-if=\"slots.icon\"\n #icon>\n <slot\n :item=\"item\"\n name=\"icon\"\n :open=\"true\" />\n </template>\n <span\n v-if=\"isDeprecated(item)\"\n class=\"line-through\">\n <SidebarItemLabel\n :item\n :operationTitleSource=\"options?.operationTitleSource\" />\n </span>\n <SidebarItemLabel\n v-else\n :item\n :operationTitleSource=\"options?.operationTitleSource\" />\n <template\n v-if=\"'method' in item\"\n #aside>\n <SidebarHttpBadge\n v-if=\"'method' in item\"\n :active=\"isSelected(item.id)\"\n class=\"ml-2 h-4 self-start\"\n :class=\"{\n // Hide the badge when we're showing the decorator\n 'group-hover/button:opacity-0 group-focus-visible/button:opacity-0 group-has-[~_[aria-expanded=true]]/button:opacity-0 group-has-[~:focus-within]/button:opacity-0 group-has-[~*:hover]/button:opacity-0':\n slots.decorator,\n }\"\n :method=\"item.method\"\n :webhook=\"item.type === 'webhook'\" />\n </template>\n <template\n v-if=\"slots.decorator\"\n #after>\n <SidebarItemDecorator>\n <slot\n :item\n name=\"decorator\" />\n </SidebarItemDecorator>\n </template>\n </ScalarSidebarItem>\n</template>\n"],"mappings":"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"}

+6

-6

package.json

		@@ -13,3 +13,3 @@ {
		},
		"version": "0.9.11",
		"version": "0.9.13",
		"engines": {
		@@ -37,8 +37,8 @@ "node": ">=22"
		"vue": "^3.5.30",
		"@scalar/components": "0.24.2",
		"@scalar/icons": "0.7.2",
		"@scalar/helpers": "0.6.0",
		"@scalar/themes": "0.15.3",
		"@scalar/use-hooks": "0.4.3",
		"@scalar/workspace-store": "0.49.3"
		"@scalar/themes": "0.15.5",
		"@scalar/use-hooks": "0.4.5",
		"@scalar/workspace-store": "0.51.0",
		"@scalar/helpers": "0.8.0",
		"@scalar/components": "0.24.4"
		},
		@@ -45,0 +45,0 @@ "devDependencies": {

dist/style.css

Sorry, the diff of this file is too big to display

@scalar/sidebar - npm Package Compare versions

Improved metrics

Dependency changes