@scalar/api-client 3.2.2 → 3.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +11 -0
- package/dist/style.css +102 -130
- package/dist/v2/blocks/operation-block/OperationBlock.vue.d.ts.map +1 -1
- package/dist/v2/blocks/operation-block/OperationBlock.vue.js.map +1 -1
- package/dist/v2/blocks/operation-block/OperationBlock.vue.script.js +9 -0
- package/dist/v2/blocks/operation-block/OperationBlock.vue.script.js.map +1 -1
- package/dist/v2/blocks/operation-block/components/Header.vue.d.ts +2 -0
- package/dist/v2/blocks/operation-block/components/Header.vue.d.ts.map +1 -1
- package/dist/v2/blocks/operation-block/components/Header.vue.js +1 -1
- package/dist/v2/blocks/operation-block/components/Header.vue.js.map +1 -1
- package/dist/v2/blocks/operation-block/components/Header.vue.script.js +20 -10
- package/dist/v2/blocks/operation-block/components/Header.vue.script.js.map +1 -1
- package/dist/v2/blocks/request-block/components/RequestTable.vue.d.ts +2 -2
- package/dist/v2/blocks/request-block/components/RequestTableRow.vue.d.ts +2 -2
- package/dist/v2/blocks/response-block/components/ResponseEmpty.vue.d.ts +2 -2
- package/dist/v2/components/server/ServerDropdown.vue.d.ts +2 -2
- package/dist/v2/components/sidebar/Sidebar.vue.script.js +2 -2
- package/dist/v2/components/sidebar/Sidebar.vue.script.js.map +1 -1
- package/dist/v2/constants.js +1 -1
- package/dist/v2/features/app/App.vue.d.ts +22 -4
- package/dist/v2/features/app/App.vue.d.ts.map +1 -1
- package/dist/v2/features/app/App.vue.js.map +1 -1
- package/dist/v2/features/app/App.vue.script.js +57 -54
- package/dist/v2/features/app/App.vue.script.js.map +1 -1
- package/dist/v2/features/app/app-events.d.ts.map +1 -1
- package/dist/v2/features/app/app-events.js +4 -0
- package/dist/v2/features/app/app-events.js.map +1 -1
- package/dist/v2/features/app/app-state.d.ts +6 -0
- package/dist/v2/features/app/app-state.d.ts.map +1 -1
- package/dist/v2/features/app/app-state.js +15 -1
- package/dist/v2/features/app/app-state.js.map +1 -1
- package/dist/v2/features/app/components/AppHeader.vue.d.ts +20 -0
- package/dist/v2/features/app/components/AppHeader.vue.d.ts.map +1 -0
- package/dist/v2/features/app/components/AppHeader.vue.js +7 -0
- package/dist/v2/features/app/components/AppHeader.vue.js.map +1 -0
- package/dist/v2/features/app/components/AppHeader.vue.script.js +43 -0
- package/dist/v2/features/app/components/AppHeader.vue.script.js.map +1 -0
- package/dist/v2/features/app/components/AppSidebar.vue.d.ts +17 -56
- package/dist/v2/features/app/components/AppSidebar.vue.d.ts.map +1 -1
- package/dist/v2/features/app/components/AppSidebar.vue.js +1 -1
- package/dist/v2/features/app/components/AppSidebar.vue.js.map +1 -1
- package/dist/v2/features/app/components/AppSidebar.vue.script.js +437 -271
- package/dist/v2/features/app/components/AppSidebar.vue.script.js.map +1 -1
- package/dist/v2/features/app/helpers/load-registry-document.d.ts +18 -0
- package/dist/v2/features/app/helpers/load-registry-document.d.ts.map +1 -0
- package/dist/v2/features/app/helpers/load-registry-document.js +45 -0
- package/dist/v2/features/app/helpers/load-registry-document.js.map +1 -0
- package/dist/v2/features/app/helpers/routes.d.ts +6 -1
- package/dist/v2/features/app/helpers/routes.d.ts.map +1 -1
- package/dist/v2/features/app/helpers/routes.js +84 -75
- package/dist/v2/features/app/helpers/routes.js.map +1 -1
- package/dist/v2/features/app/hooks/use-document-filter.d.ts +38 -0
- package/dist/v2/features/app/hooks/use-document-filter.d.ts.map +1 -0
- package/dist/v2/features/app/hooks/use-document-filter.js +63 -0
- package/dist/v2/features/app/hooks/use-document-filter.js.map +1 -0
- package/dist/v2/features/app/hooks/use-sidebar-context-menu.d.ts +17258 -0
- package/dist/v2/features/app/hooks/use-sidebar-context-menu.d.ts.map +1 -0
- package/dist/v2/features/app/hooks/use-sidebar-context-menu.js +107 -0
- package/dist/v2/features/app/hooks/use-sidebar-context-menu.js.map +1 -0
- package/dist/v2/features/app/hooks/use-sidebar-documents.d.ts +95 -0
- package/dist/v2/features/app/hooks/use-sidebar-documents.d.ts.map +1 -0
- package/dist/v2/features/app/hooks/use-sidebar-documents.js +97 -0
- package/dist/v2/features/app/hooks/use-sidebar-documents.js.map +1 -0
- package/dist/v2/features/app/index.d.ts +1 -0
- package/dist/v2/features/app/index.d.ts.map +1 -1
- package/dist/v2/features/collection/components/GetStarted.vue.d.ts +13 -0
- package/dist/v2/features/collection/components/GetStarted.vue.d.ts.map +1 -0
- package/dist/v2/features/collection/components/GetStarted.vue.js +7 -0
- package/dist/v2/features/collection/components/GetStarted.vue.js.map +1 -0
- package/dist/v2/features/collection/components/GetStarted.vue.script.js +101 -0
- package/dist/v2/features/collection/components/GetStarted.vue.script.js.map +1 -0
- package/dist/v2/features/command-palette/helpers/generate-unique-slug.d.ts +4 -0
- package/dist/v2/features/command-palette/helpers/generate-unique-slug.d.ts.map +1 -1
- package/dist/v2/features/command-palette/helpers/generate-unique-slug.js +5 -1
- package/dist/v2/features/command-palette/helpers/generate-unique-slug.js.map +1 -1
- package/dist/v2/features/search/components/DocumentSearchModal.vue.d.ts +16 -0
- package/dist/v2/features/search/components/DocumentSearchModal.vue.d.ts.map +1 -0
- package/dist/v2/features/search/components/DocumentSearchModal.vue.js +9 -0
- package/dist/v2/features/search/components/DocumentSearchModal.vue.js.map +1 -0
- package/dist/v2/features/search/components/DocumentSearchModal.vue.script.js +123 -0
- package/dist/v2/features/search/components/DocumentSearchModal.vue.script.js.map +1 -0
- package/dist/v2/features/search/components/SearchResult.vue.d.ts +11 -0
- package/dist/v2/features/search/components/SearchResult.vue.d.ts.map +1 -0
- package/dist/v2/features/search/components/SearchResult.vue.js +7 -0
- package/dist/v2/features/search/components/SearchResult.vue.js.map +1 -0
- package/dist/v2/features/search/components/SearchResult.vue.script.js +71 -0
- package/dist/v2/features/search/components/SearchResult.vue.script.js.map +1 -0
- package/dist/v2/features/search/hooks/use-document-search.d.ts +19 -0
- package/dist/v2/features/search/hooks/use-document-search.d.ts.map +1 -0
- package/dist/v2/features/search/hooks/use-document-search.js +42 -0
- package/dist/v2/features/search/hooks/use-document-search.js.map +1 -0
- package/dist/v2/features/search/index.d.ts +2 -0
- package/dist/v2/features/search/index.d.ts.map +1 -1
- package/dist/v2/features/search/index.js +3 -1
- package/dist/v2/helpers/handle-hotkeys.d.ts.map +1 -1
- package/dist/v2/helpers/handle-hotkeys.js +8 -4
- package/dist/v2/helpers/handle-hotkeys.js.map +1 -1
- package/dist/v2/types/configuration.d.ts +1 -0
- package/dist/v2/types/configuration.d.ts.map +1 -1
- package/package.json +11 -10
- package/dist/assets/rabbit.ascii.virtual.js +0 -6
- package/dist/assets/rabbit.ascii.virtual.js.map +0 -1
- package/dist/assets/rabbitjump.ascii.virtual.js +0 -6
- package/dist/assets/rabbitjump.ascii.virtual.js.map +0 -1
- package/dist/v2/features/app/components/DownloadAppButton.vue.d.ts +0 -4
- package/dist/v2/features/app/components/DownloadAppButton.vue.d.ts.map +0 -1
- package/dist/v2/features/app/components/DownloadAppButton.vue.js +0 -9
- package/dist/v2/features/app/components/DownloadAppButton.vue.js.map +0 -1
- package/dist/v2/features/app/components/DownloadAppButton.vue.script.js +0 -21
- package/dist/v2/features/app/components/DownloadAppButton.vue.script.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"app-state.js","names":[],"sources":["../../../../src/v2/features/app/app-state.ts"],"sourcesContent":["import type { ScalarListboxOption, WorkspaceGroup } from '@scalar/components'\nimport { isDefined } from '@scalar/helpers/array/is-defined'\nimport { sortByOrder } from '@scalar/helpers/array/sort-by-order'\nimport type { HttpMethod } from '@scalar/helpers/http/http-methods'\nimport type { LoaderPlugin } from '@scalar/json-magic/bundle'\nimport { migrateLocalStorageToIndexDb } from '@scalar/oas-utils/migrations'\nimport { createSidebarState, generateReverseIndex } from '@scalar/sidebar'\nimport type { Theme } from '@scalar/themes'\nimport { type WorkspaceStore, createWorkspaceStore } from '@scalar/workspace-store/client'\nimport {\n type OperationExampleMeta,\n type WorkspaceEventBus,\n createWorkspaceEventBus,\n} from '@scalar/workspace-store/events'\nimport { generateUniqueValue } from '@scalar/workspace-store/helpers/generate-unique-value'\nimport { getParentEntry } from '@scalar/workspace-store/navigation'\nimport { createWorkspaceStorePersistence, getWorkspaceId } from '@scalar/workspace-store/persistence'\nimport { persistencePlugin } from '@scalar/workspace-store/plugins/client'\nimport { getActiveEnvironment } from '@scalar/workspace-store/request-example'\nimport type { Workspace, WorkspaceDocument } from '@scalar/workspace-store/schemas'\nimport { extensions } from '@scalar/workspace-store/schemas/extensions'\nimport type { XScalarEnvironment } from '@scalar/workspace-store/schemas/extensions/document/x-scalar-environments'\nimport type { Tab } from '@scalar/workspace-store/schemas/extensions/workspace/x-scalar-tabs'\nimport type { TraversedEntry } from '@scalar/workspace-store/schemas/navigation'\nimport {\n type ComputedRef,\n type MaybeRefOrGetter,\n type Ref,\n type ShallowRef,\n computed,\n readonly,\n ref,\n shallowRef,\n watch,\n} from 'vue'\nimport type { RouteLocationNormalizedGeneric, RouteLocationRaw, Router } from 'vue-router'\n\nimport type { ApiClientAppOptions } from '@/v2/features/app/helpers/create-api-client-app'\nimport { getRouteParam } from '@/v2/features/app/helpers/get-route-param'\nimport { groupWorkspacesByTeam } from '@/v2/features/app/helpers/group-workspaces'\nimport { useTheme } from '@/v2/features/app/hooks/use-theme'\nimport { getTabDetails } from '@/v2/helpers/get-tab-details'\nimport { slugify } from '@/v2/helpers/slugify'\nimport { workspaceStorage } from '@/v2/helpers/storage'\n\nimport { initializeAppEventHandlers } from './app-events'\nimport { canLoadWorkspace, filterWorkspacesByTeam } from './helpers/filter-workspaces'\n\n// ---------------------------------------------------------------------------\n// Types\n// ---------------------------------------------------------------------------\nexport type GetEntryByLocation = (location: {\n document: string\n path?: string\n method?: HttpMethod\n example?: string\n}) =>\n | (TraversedEntry & {\n parent?: TraversedEntry | undefined\n })\n | undefined\n\ntype WorkspaceOption = ScalarListboxOption & { teamUid: string; namespace: string; slug: string }\n\n/** Defines the overall application state structure and its main feature modules */\nexport type AppState = {\n /** The workspace store */\n store: ShallowRef<WorkspaceStore | null>\n /** The sidebar management */\n sidebar: {\n /** The sidebar state */\n state: ReturnType<typeof createSidebarState<TraversedEntry>>\n /** The width of the sidebar */\n width: ComputedRef<number>\n /** Whether the sidebar is open */\n isOpen: Ref<boolean>\n /** Handles the selection of an item in the sidebar */\n handleSelectItem: (id: string) => void\n /** Handles the width update of the sidebar */\n handleSidebarWidthUpdate: (width: number) => void\n /** Gets the entry by location */\n getEntryByLocation: GetEntryByLocation\n }\n /** The tabs management */\n tabs: {\n /** The tabs state */\n state: Ref<Tab[]>\n /** The active tab index */\n activeTabIndex: Ref<number>\n /** Copies the URL of the tab at the given index to the clipboard */\n copyTabUrl: (index: number) => Promise<void>\n }\n /** The workspace management */\n workspace: {\n /** Creates a new workspace and navigates to it */\n create: (payload: {\n teamUid?: string\n namespace?: string\n slug?: string\n name: string\n }) => Promise<{ name: string; namespace: string; slug: string; teamUid: string } | undefined>\n /** All workspace list */\n workspaceList: Ref<WorkspaceOption[]>\n /** Filtered workspace list, based on the current teamUid */\n filteredWorkspaceList: ComputedRef<WorkspaceOption[]>\n /**\n * Groups workspaces into team and local categories for display in the workspace picker.\n * Team workspaces are shown first (when not on local team), followed by local workspaces.\n */\n workspaceGroups: ComputedRef<WorkspaceGroup[]>\n /** The currently active workspace */\n activeWorkspace: ShallowRef<{ id: string; label: string } | null>\n /** Navigates to the specified workspace */\n navigateToWorkspace: (namespace?: string, slug?: string) => Promise<void>\n /** Whether the workspace page is open */\n isOpen: ComputedRef<boolean>\n }\n /** The workspace event bus for handling workspace-level events */\n eventBus: WorkspaceEventBus\n /** The router instance */\n router: Router\n /** The current route derived from the router */\n currentRoute: Ref<RouteLocationNormalizedGeneric | null>\n /** Whether the workspace is currently syncing */\n loading: Ref<boolean>\n /** Runtime behaviour overrides */\n options?: ApiClientAppOptions\n /** The currently active entities */\n activeEntities: {\n /** The namespace of the current entity, e.g. \"default\" or a custom namespace */\n namespace: Ref<string | undefined>\n /** The slug identifying the current workspace */\n workspaceSlug: Ref<string | undefined>\n /** The slug of the currently selected document in the workspace */\n documentSlug: Ref<string | undefined>\n /** The API path currently selected (e.g. \"/users/{id}\") */\n path: Ref<string | undefined>\n /** The HTTP method for the currently selected API path (e.g. GET, POST) */\n method: Ref<HttpMethod | undefined>\n /** The name of the currently selected example (for examples within an endpoint) */\n exampleName: Ref<string | undefined>\n /** The unique identifier for the selected team context (read-only; use setTeamUid to change) */\n teamUid: Readonly<Ref<string>>\n /** Sets the current team context by team UID */\n setTeamUid: (value: string) => void\n }\n /** The currently active environment */\n environment: ComputedRef<XScalarEnvironment>\n /** The currently active document */\n document: ComputedRef<WorkspaceDocument | null>\n /** Whether the current color mode is dark */\n isDarkMode: ComputedRef<boolean>\n /** The currently active theme */\n theme: {\n /** The computed CSS styles for the current theme, as a string */\n styles: ComputedRef<{ themeStyles: string; themeSlug: string }>\n /** The computed value for the <style> tag containing the current theme styles */\n themeStyleTag: ComputedRef<string>\n /** The custom themes to use */\n customThemes: MaybeRefOrGetter<Theme[]>\n }\n telemetry: Ref<boolean>\n}\n\n// ---------------------------------------------------------------------------\n// Constants\n// ---------------------------------------------------------------------------\n/** Default debounce delay in milliseconds for workspace store persistence. */\nconst DEFAULT_DEBOUNCE_DELAY = 1000\n/** Default sidebar width in pixels. */\nconst DEFAULT_SIDEBAR_WIDTH = 288\n\n// ---------------------------------------------------------------------------\n// App State\n// ---------------------------------------------------------------------------\nexport const createAppState = async ({\n router,\n fileLoader,\n fallbackThemeSlug = () => 'default',\n customThemes = () => [],\n telemetryDefault,\n options,\n}: {\n router: Router\n fileLoader?: LoaderPlugin\n customThemes?: MaybeRefOrGetter<Theme[]>\n fallbackThemeSlug?: MaybeRefOrGetter<string>\n telemetryDefault?: boolean\n /** Runtime behaviour overrides */\n options?: ApiClientAppOptions\n}): Promise<AppState> => {\n /** Workspace event bus for handling workspace-level events. */\n const eventBus = createWorkspaceEventBus({\n debug: import.meta.env.DEV,\n })\n\n const { workspace: persistence } = await createWorkspaceStorePersistence()\n\n /**\n * Run migration from localStorage to IndexedDB if needed\n * This happens once per user and transforms old data structure to new workspace format\n */\n await migrateLocalStorageToIndexDb()\n\n // ---------------------------------------------------------------------------\n // Active entities\n // ---------------------------------------------------------------------------\n const teamUid = ref<string>('local')\n const namespace = ref<string | undefined>(undefined)\n const workspaceSlug = ref<string | undefined>(undefined)\n const documentSlug = ref<string | undefined>(undefined)\n const method = ref<HttpMethod | undefined>(undefined)\n const path = ref<string | undefined>(undefined)\n const exampleName = ref<string | undefined>(undefined)\n\n // ---------------------------------------------------------------------------\n // Loading states\n const isSyncingWorkspace = ref(false)\n\n // ---------------------------------------------------------------------------\n // Router state\n router.afterEach((to) => handleRouteChange(to))\n const currentRoute = computed(() => router.currentRoute.value ?? null)\n\n // ---------------------------------------------------------------------------\n // Workspace persistence state management\n const activeWorkspace = shallowRef<{ id: string; label: string } | null>(null)\n const workspaces = ref<WorkspaceOption[]>([])\n const filteredWorkspaces = computed(() => filterWorkspacesByTeam(workspaces.value, teamUid.value))\n const workspaceGroups = computed(() => groupWorkspacesByTeam(filteredWorkspaces.value, teamUid.value))\n const store = shallowRef<WorkspaceStore | null>(null)\n\n // Load persisted telemetry preference, falling back to the provided default\n const persistedTelemetry = workspaceStorage.getTelemetry()\n const telemetry = ref(persistedTelemetry !== null ? persistedTelemetry : Boolean(telemetryDefault))\n watch(telemetry, (value) => workspaceStorage.setTelemetry(value))\n\n const activeDocument = computed(() => {\n return store.value?.workspace.documents[documentSlug.value ?? ''] || null\n })\n\n /**\n * Merged environment variables from workspace and document levels.\n * Variables from both sources are combined, with document variables\n * taking precedence in case of naming conflicts.\n */\n const environment = computed<XScalarEnvironment>(\n () => getActiveEnvironment(store.value, activeDocument.value).environment,\n )\n\n /** Update the workspace list when the component is mounted */\n workspaces.value = await persistence.getAll().then((w) =>\n w.map(({ teamUid, namespace, slug, name }) => ({\n id: getWorkspaceId(namespace, slug),\n teamUid,\n namespace,\n slug,\n label: name,\n })),\n )\n\n /**\n * Renames the currently active workspace.\n * Updates the workspace name in persistence and updates activeWorkspace if successful.\n * Returns early if namespace or workspaceSlug is not set, or if update fails.\n */\n const renameWorkspace = async (name: string) => {\n const namespaceValue = namespace.value\n const slugValue = workspaceSlug.value\n if (!namespaceValue || !slugValue) {\n return\n }\n const workspaceId = getWorkspaceId(namespaceValue, slugValue)\n const updateResult = await persistence.updateName({ namespace: namespaceValue, slug: slugValue }, name)\n\n // If the update fails, return early\n if (updateResult === undefined) {\n return\n }\n\n // Update the workspace list\n workspaces.value = workspaces.value.map((workspace) => {\n // If the workspace is the currently active workspace, update the label\n if (workspace.id === workspaceId) {\n return { ...workspace, label: name }\n }\n return workspace\n })\n activeWorkspace.value = { id: workspaceId, label: name }\n }\n\n /**\n * Creates a client-side workspace store with persistence enabled for the given workspace id.\n */\n const createClientStore = async ({\n namespace,\n slug,\n }: {\n namespace: string\n slug: string\n }): Promise<WorkspaceStore> => {\n return createWorkspaceStore({\n plugins: [\n await persistencePlugin({\n workspaceId: getWorkspaceId(namespace, slug),\n debounceDelay: DEFAULT_DEBOUNCE_DELAY,\n }),\n ],\n fileLoader,\n fetch: options?.customFetch,\n })\n }\n\n /**\n * Attempts to load and activate a workspace by id.\n * Returns true when the workspace was found and activated.\n */\n const loadWorkspace = async (\n namespace: string,\n slug: string,\n ): Promise<{ success: true; workspace: Workspace } | { success: false }> => {\n const workspace = await persistence.getItem({ namespace, slug })\n\n if (!workspace) {\n return {\n success: false,\n }\n }\n\n const client = await createClientStore({ namespace, slug })\n client.loadWorkspace(workspace.workspace)\n activeWorkspace.value = { id: getWorkspaceId(workspace.namespace, workspace.slug), label: workspace.name }\n store.value = client\n\n return {\n success: true,\n workspace: client.workspace,\n }\n }\n\n /**\n * Creates and persists the default workspace with a blank draft document.\n * Used when no workspaces exist yet.\n */\n const createAndPersistWorkspace = async ({\n name,\n teamUid,\n namespace,\n slug,\n }: {\n name: string\n teamUid?: string\n namespace?: string\n slug: string\n }) => {\n const draftStore = createWorkspaceStore()\n await draftStore.addDocument({\n name: 'drafts',\n document: {\n openapi: '3.1.0',\n info: {\n title: 'Drafts',\n version: '1.0.0',\n },\n paths: {\n '/': {\n get: {},\n },\n },\n 'x-scalar-original-document-hash': 'drafts',\n 'x-scalar-icon': 'interface-edit-tool-pencil',\n },\n })\n\n // Persist the workspace\n const workspace = await persistence.setItem(\n { namespace, slug },\n {\n name: name,\n teamUid,\n workspace: draftStore.exportWorkspace(),\n },\n )\n\n // Update the workspace list\n workspaces.value.push({\n id: getWorkspaceId(workspace.namespace, workspace.slug),\n teamUid: workspace.teamUid,\n namespace: workspace.namespace,\n slug: workspace.slug,\n label: workspace.name,\n })\n return workspace\n }\n\n /**\n * Navigates to the overview page of the specified workspace.\n *\n * @param namespace - The workspace namespace.\n * @param slug - The unique workspace slug (identifier).\n */\n const navigateToWorkspace = async (namespace?: string, slug?: string): Promise<void> => {\n if (!namespace || !slug) {\n await router.push('/')\n return\n }\n\n // We should always have this drafts document available in a new workspace\n await router.push({\n name: 'example',\n params: {\n namespace,\n workspaceSlug: slug,\n documentSlug: 'drafts',\n pathEncoded: encodeURIComponent('/'),\n method: 'get',\n exampleName: 'default',\n },\n })\n }\n\n /**\n * Creates a new workspace with the provided name.\n * - Generates a unique slug for the workspace (uses the provided slug if it is unique, otherwise generates a unique slug).\n * - Adds a default blank document (\"drafts\") to the workspace.\n * - Persists the workspace and navigates to it.\n *\n * Example usage:\n * await createWorkspace({ name: 'My Awesome API' })\n * // -> Navigates to /workspace/my-awesome-api (if available)\n */\n const createWorkspace = async ({\n teamUid,\n namespace,\n slug,\n name,\n }: {\n teamUid?: string\n namespace?: string\n slug?: string\n name: string\n }) => {\n // Clear up the current store, in order to show the loading state\n store.value = null\n\n // Generate a unique slug/id for the workspace, based on the name.\n const newWorkspaceSlug = await generateUniqueValue({\n defaultValue: slug ?? name, // Use the provided id if it exists, otherwise use the name\n validation: async (value) => !(await persistence.has({ namespace: namespace ?? 'local', slug: value })),\n maxRetries: 100,\n transformation: slugify,\n })\n\n // Failed to generate a unique workspace id, so we can't create the workspace.\n if (!newWorkspaceSlug) {\n return undefined\n }\n\n const newWorkspaceDetails = {\n teamUid,\n namespace,\n slug: newWorkspaceSlug,\n name,\n }\n\n // Create a new client store with the workspace ID and add a default document.\n const createdWorkspace = await createAndPersistWorkspace(newWorkspaceDetails)\n\n // Navigate to the newly created workspace.\n await navigateToWorkspace(createdWorkspace.namespace, createdWorkspace.slug)\n return createdWorkspace\n }\n\n /**\n * Handles changing the active workspace when the workspace slug changes in the route.\n * This function:\n * - Clears the current workspace store and sets loading state.\n * - Attempts to load the workspace by slug.\n * - If found, navigates to the active tab path (if available).\n * - If not found, creates the default workspace and navigates to it.\n */\n const changeWorkspace = async (namespace: string, slug: string, to?: RouteLocationNormalizedGeneric) => {\n /** For initial load we want to fall through to our router default behaviour */\n const isInitialLoad = activeWorkspace.value === null\n\n // Clear the current store and set loading to true before loading new workspace.\n store.value = null\n isSyncingWorkspace.value = true\n\n // Try to load the workspace\n const result = await loadWorkspace(namespace, slug)\n\n if (result.success) {\n // Navigate to the correct tab if the workspace has a tab already\n const index = result.workspace['x-scalar-active-tab'] ?? 0\n const tabs = result.workspace['x-scalar-tabs']\n const tab = tabs?.[index]\n\n // On initial load let the URL-based routing (catch-all → getLastPath) take precedence\n if (tab && !isInitialLoad) {\n // Preserve query parameters when navigating to the active tab\n await router.replace({\n path: tab.path,\n query: currentRoute.value?.query ?? {},\n })\n }\n\n // Heal the active tab index if it is out of bounds\n if (tabs && index >= tabs.length) {\n eventBus.emit('tabs:update:tabs', {\n 'x-scalar-active-tab': 0,\n })\n }\n\n // Initialize the tabs if they does not exist\n if (!tabs) {\n eventBus.emit('tabs:update:tabs', {\n 'x-scalar-tabs': [createTabFromRoute(currentRoute.value)],\n 'x-scalar-active-tab': 0,\n })\n }\n\n // On initial load the router.replace above is skipped, so syncTabs/syncSidebar\n // are never reached via handleRouteChange's normal flow. Call them here to\n // align the tab bar and sidebar with the URL-based route.\n if (isInitialLoad && to) {\n syncTabs(to)\n syncSidebar(to)\n }\n\n isSyncingWorkspace.value = false\n return\n }\n\n // Navigate to the default workspace, or fall back to the first available workspace\n const targetWorkspace =\n filteredWorkspaces.value.find((workspace) => workspace.teamUid === 'local' && workspace.slug === 'default') ??\n filteredWorkspaces.value[0]\n\n if (targetWorkspace) {\n return navigateToWorkspace(targetWorkspace.namespace, targetWorkspace.slug)\n }\n\n // If loading failed (workspace does not exist), create the default workspace and navigate to it.\n const createResult = await createWorkspace({\n name: 'Default Workspace',\n slug: 'default',\n })\n\n isSyncingWorkspace.value = false\n\n if (!createResult) {\n return console.error('Failed to create the default workspace, something went wrong, can not load the workspace')\n }\n\n // Must reset the sidebar state when the workspace changes\n sidebarState.reset()\n }\n\n /**\n * Sets the current team context. If the active workspace is not accessible\n * with the new team, navigates to the default workspace for that team.\n */\n const setTeamUid = (value: string) => {\n // Update the new teamUid\n teamUid.value = value\n\n // Find the current workspace\n const workspace = filteredWorkspaces.value.find(\n (w) => w.namespace === namespace.value && w.slug === workspaceSlug.value,\n )\n\n // Check if new teamUid is accessible to the current workspace\n if (workspace && canLoadWorkspace(workspace.teamUid, value)) {\n return\n }\n\n return navigateToWorkspace('local', 'default')\n }\n\n // ---------------------------------------------------------------------------\n // Sidebar state management\n\n const entries = computed(() => {\n const activeStore = store.value\n if (!activeStore) {\n return []\n }\n\n const order = activeStore.workspace['x-scalar-order'] ?? Object.keys(activeStore.workspace.documents)\n\n return sortByOrder(Object.keys(activeStore.workspace.documents), order, (item) => item)\n .map((doc) => activeStore.workspace.documents[doc]?.['x-scalar-navigation'])\n .filter(isDefined) as TraversedEntry[]\n })\n\n const sidebarState = createSidebarState(entries)\n\n /**\n * Generates a unique string ID for an API location, based on the document, path, method, and example.\n * Filters out undefined values and serializes the composite array into a stable string.\n *\n * @param params - An object containing document, path, method, and optional example name.\n * @returns A stringified array representing the unique location identifier.\n *\n * Example:\n * generateId({ document: 'mydoc', path: '/users', method: 'get', example: 'default' })\n * // => '[\"mydoc\",\"/users\",\"get\",\"default\"]'\n */\n const generateId = ({\n document,\n path,\n method,\n example,\n }: {\n document: string\n path?: string\n method?: HttpMethod\n example?: string\n }) => {\n return JSON.stringify([document, path, method, example].filter(isDefined))\n }\n\n /**\n * Computed index for fast lookup of sidebar nodes by their unique API location.\n *\n * - Only indexes nodes of type 'document', 'operation', or 'example'.\n * - The lookup key is a serialized array of: [documentName, operationPath, operationMethod, exampleName?].\n * - Supports precise resolution of sidebar entries given an API \"location\".\n */\n const locationIndex = computed(() =>\n generateReverseIndex({\n items: entries.value,\n nestedKey: 'children',\n filter: (node) => node.type === 'document' || node.type === 'operation' || node.type === 'example',\n getId: (node) => {\n const document = getParentEntry('document', node)\n const operation = getParentEntry('operation', node)\n return generateId({\n document: document?.name ?? '',\n path: operation?.path,\n method: operation?.method,\n example: node.type === 'example' ? node.name : undefined,\n })\n },\n }),\n )\n\n /**\n * Looks up a sidebar entry by its unique API location.\n * - First tries to find an entry matching all provided properties (including example).\n * - If not found, falls back to matching only the operation (ignores example field).\n * This allows resolving either examples, operations, or documents as appropriate.\n *\n * @param location - Object specifying the document name, path, method, and optional example name.\n * @returns The matching sidebar entry, or undefined if none found.\n *\n * Example:\n * const entry = getEntryByLocation({\n * document: 'pets',\n * path: '/pets',\n * method: 'get',\n * example: 'default',\n * })\n */\n const getEntryByLocation: GetEntryByLocation = (location) => {\n // Try to find an entry with the most-specific location (including example)\n const entryWithExample = locationIndex.value.get(generateId(location))\n\n if (entryWithExample) {\n return entryWithExample\n }\n\n // Fallback to the operation (ignoring example) if an example wasn't found or specified\n return locationIndex.value.get(\n generateId({\n document: location.document,\n path: location.path,\n method: location.method,\n }),\n )\n }\n\n /**\n * Handles item selection from the sidebar and routes navigation accordingly.\n *\n * Example:\n * handleSelectItem('id-of-entry')\n */\n const handleSelectItem = (id: string) => {\n const entry = sidebarState.getEntryById(id)\n\n if (!entry) {\n console.warn(`Could not find sidebar entry with id ${id} to select`)\n return\n }\n\n /** Close sidebar and navigate. Used for every branch that performs navigation. */\n const navigate = (route: RouteLocationRaw) => {\n isSidebarOpen.value = false\n return router.push(route)\n }\n\n // Navigate to the document overview page\n if (entry.type === 'document') {\n // If we are already in the document, just toggle expansion\n if (sidebarState.selectedItem.value === id) {\n sidebarState.setExpanded(id, !sidebarState.isExpanded(id))\n return\n }\n\n // Otherwise, select it\n sidebarState.setSelected(id)\n sidebarState.setExpanded(id, true)\n return navigate({\n name: 'document.overview',\n params: { documentSlug: entry.name },\n })\n }\n\n // Navigate to the example page\n if (entry.type === 'operation') {\n // If we are already in an operation child we just want to toggle the explanstion\n if (sidebarState.isSelected(id) && sidebarState.selectedItem.value !== id) {\n sidebarState.setExpanded(id, !sidebarState.isExpanded(id))\n return\n }\n\n // Otherwise, select the first example\n const firstExample = entry.children?.find((child) => child.type === 'example')\n\n if (firstExample) {\n sidebarState.setSelected(firstExample.id)\n sidebarState.setExpanded(firstExample.id, true)\n } else {\n sidebarState.setSelected(id)\n }\n\n return navigate({\n name: 'example',\n params: {\n documentSlug: getParentEntry('document', entry)?.name,\n pathEncoded: encodeURIComponent(entry.path),\n method: entry.method,\n exampleName: firstExample?.name ?? 'default',\n },\n })\n }\n\n // Navigate to the example page\n if (entry.type === 'example') {\n sidebarState.setSelected(id)\n const operation = getParentEntry('operation', entry)\n return navigate({\n name: 'example',\n params: {\n documentSlug: getParentEntry('document', entry)?.name,\n pathEncoded: encodeURIComponent(operation?.path ?? ''),\n method: operation?.method,\n exampleName: entry.name,\n },\n })\n }\n\n if (entry.type === 'text') {\n return navigate({\n name: 'document.overview',\n params: {\n documentSlug: getParentEntry('document', entry)?.name,\n },\n })\n }\n\n sidebarState.setExpanded(id, !sidebarState.isExpanded(id))\n return\n }\n\n /**\n * Navigates to the currently active tab's path using the router.\n * Returns early if the workspace store or active tab is unavailable.\n */\n const navigateToCurrentTab = async (): Promise<void> => {\n if (!store.value) {\n return\n }\n\n const activeTabIndex = store.value.workspace['x-scalar-active-tab'] ?? 0\n const activeTab = store.value.workspace['x-scalar-tabs']?.[activeTabIndex]\n if (!activeTab) {\n return\n }\n\n await router.replace(activeTab.path)\n }\n\n /**\n * Rebuilds the sidebar for the given document.\n * This is used to refresh the sidebar state after structural changes (e.g. after adding or removing items).\n *\n * @param documentName - The name (id) of the document for which to rebuild the sidebar\n */\n const rebuildSidebar = (documentName: string | undefined) => {\n if (documentName) {\n store.value?.buildSidebar(documentName)\n }\n }\n\n /**\n * Ensures the sidebar is refreshed after a new example is created.\n *\n * If the sidebar entry for the new example does not exist or is of a different type,\n * this will rebuild the sidebar for the current document. This helps keep the sidebar state\n * consistent (e.g., after adding a new example via the UI).\n */\n const refreshSidebarAfterExampleCreation = (payload: OperationExampleMeta & { documentName?: string }) => {\n const documentName = payload.documentName ?? activeDocument.value?.['x-scalar-navigation']?.name\n if (!documentName) {\n return\n }\n\n const entry = getEntryByLocation({\n document: documentName,\n path: payload.path,\n method: payload.method,\n example: payload.exampleKey,\n })\n\n if (!entry || entry.type !== 'example') {\n // Sidebar entry for this example doesn't exist, so rebuild sidebar for consistency.\n rebuildSidebar(documentName)\n if (currentRoute.value) {\n syncSidebar(currentRoute.value)\n }\n }\n return\n }\n\n /** Width of the sidebar, with fallback to default. */\n const sidebarWidth = computed(() => store.value?.workspace?.['x-scalar-sidebar-width'] ?? DEFAULT_SIDEBAR_WIDTH)\n\n /** Handler for sidebar width changes. */\n const handleSidebarWidthUpdate = (width: number) => store.value?.update('x-scalar-sidebar-width', width)\n\n /** Controls the visibility of the sidebar. */\n const isSidebarOpen = ref(false)\n // ---------------------------------------------------------------------------\n // Tab Management\n\n /** Constants for workspace store keys */\n const TABS_KEY = 'x-scalar-tabs' as const\n const ACTIVE_TAB_KEY = 'x-scalar-active-tab' as const\n\n /**\n * Creates a tab object based on the current route and workspace state.\n * Used as a fallback when no tabs exist or when creating new tabs.\n */\n const createTabFromRoute = (to: RouteLocationNormalizedGeneric | null): Tab => {\n const method = getRouteParam('method', to)\n const path = getRouteParam('pathEncoded', to)\n const document = getRouteParam('documentSlug', to)\n const workspace = getRouteParam('workspaceSlug', to)\n return {\n ...getTabDetails({\n workspace,\n document,\n path,\n method,\n getEntryByLocation,\n }),\n path: currentRoute.value?.path ?? '',\n }\n }\n\n const tabs = computed(() => {\n return store.value?.workspace[TABS_KEY] ?? [createTabFromRoute(currentRoute.value)]\n })\n\n const activeTabIndex = computed(() => {\n return store.value?.workspace[ACTIVE_TAB_KEY] ?? 0\n })\n\n /**\n * Copies the URL of the tab at the given index to the clipboard.\n * Constructs the full URL using the current origin and the tab path.\n *\n * Note: Will silently fail if clipboard API is unavailable or the tab does not exist.\n */\n const copyTabUrl = async (index: number): Promise<void> => {\n const tab = tabs.value[index]\n\n if (!tab) {\n console.warn(`Cannot copy URL: tab at index ${index} does not exist`)\n return\n }\n\n const url = `${window.location.origin}${tab.path}`\n\n try {\n await navigator.clipboard.writeText(url)\n } catch (error) {\n console.error('Failed to copy URL to clipboard:', error)\n }\n }\n\n // ---------------------------------------------------------------------------\n // Path syncing\n\n /** When the route changes we need to update the active entities in the store */\n const handleRouteChange = (to: RouteLocationNormalizedGeneric) => {\n const slug = getRouteParam('workspaceSlug', to)\n const document = getRouteParam('documentSlug', to)\n const namespaceValue = getRouteParam('namespace', to)\n\n // Must have an active workspace to syncs\n if (!namespaceValue || !slug) {\n return\n }\n\n // Try to see if the user can load this workspace based on the teamUid and namespace\n const workspace = workspaces.value.find(\n (workspace) => workspace.slug === slug && workspace.namespace === namespaceValue,\n )\n\n // If the workspace is not found or the teamUid does not match, try to redirect to the default workspace\n if (workspace && !canLoadWorkspace(workspace.teamUid, teamUid.value)) {\n // try to redirect to the default workspace\n return navigateToWorkspace('local', 'default')\n }\n\n namespace.value = namespaceValue\n workspaceSlug.value = slug\n documentSlug.value = document\n method.value = getRouteParam('method', to)\n path.value = getRouteParam('pathEncoded', to)\n exampleName.value = getRouteParam('exampleName', to)\n\n // Save the current path to the persistence storage\n if (to.path !== '') {\n workspaceStorage.setCurrentPath(to.path)\n }\n\n if (getWorkspaceId(namespace.value, slug) !== activeWorkspace.value?.id) {\n return changeWorkspace(namespace.value, slug, to)\n }\n\n // Update the active document if the document slug has changes\n if (document && document !== store.value?.workspace[extensions.workspace.activeDocument]) {\n store?.value?.update('x-scalar-active-document', document)\n }\n\n syncTabs(to)\n syncSidebar(to)\n return\n }\n\n /** Aligns the tabs with any potential slug changes */\n const syncTabs = (to: RouteLocationNormalizedGeneric) => {\n const tabs = store.value?.workspace['x-scalar-tabs'] ?? []\n const index = store.value?.workspace['x-scalar-active-tab'] ?? 0\n\n const tab = tabs[index]\n\n // If there is no tab or the tab path is the same we leave the tab state alone\n if (!tab || tab.path === to.path) {\n // Already on the correct path, do nothing\n return\n }\n\n // Otherwise we replace the tab content with the new route\n tabs[index] = createTabFromRoute(to)\n }\n\n /** Aligns the sidebar state with any potential slug changes */\n const syncSidebar = (to: RouteLocationNormalizedGeneric) => {\n const document = getRouteParam('documentSlug', to)\n\n if (!document) {\n // Reset selection if no document is selected\n sidebarState.setSelected(null)\n return\n }\n\n const entry = getEntryByLocation({\n document,\n path: getRouteParam('pathEncoded', to),\n method: getRouteParam('method', to),\n example: getRouteParam('exampleName', to),\n })\n\n if (entry) {\n sidebarState.setSelected(entry.id)\n sidebarState.setExpanded(entry.id, true)\n }\n }\n\n // ---------------------------------------------------------------------------\n // Events handling\n\n initializeAppEventHandlers({\n eventBus,\n router,\n store,\n navigateToCurrentTab,\n rebuildSidebar,\n onAfterExampleCreation: refreshSidebarAfterExampleCreation,\n onSelectSidebarItem: handleSelectItem,\n onCopyTabUrl: (index) => copyTabUrl(index),\n onToggleSidebar: () => (isSidebarOpen.value = !isSidebarOpen.value),\n closeSidebar: () => (isSidebarOpen.value = false),\n renameWorkspace,\n })\n\n const theme = useTheme({\n fallbackThemeSlug,\n customThemes,\n store: store,\n })\n\n const isDarkMode = computed(() => {\n const colorMode = store.value?.workspace['x-scalar-color-mode'] ?? 'system'\n if (colorMode === 'system') {\n return window.matchMedia?.('(prefers-color-scheme: dark)')?.matches ?? false\n }\n return colorMode === 'dark'\n })\n\n return {\n /** Active workspace store */\n store,\n sidebar: {\n state: sidebarState,\n width: sidebarWidth,\n isOpen: isSidebarOpen,\n handleSelectItem,\n handleSidebarWidthUpdate,\n getEntryByLocation,\n },\n tabs: {\n state: tabs,\n activeTabIndex,\n copyTabUrl,\n },\n workspace: {\n create: createWorkspace,\n workspaceList: workspaces,\n filteredWorkspaceList: filteredWorkspaces,\n workspaceGroups,\n activeWorkspace,\n navigateToWorkspace,\n isOpen: computed(() => Boolean(workspaceSlug.value && !documentSlug.value)),\n },\n eventBus,\n router,\n currentRoute,\n loading: isSyncingWorkspace,\n activeEntities: {\n namespace,\n workspaceSlug,\n documentSlug,\n path,\n method,\n exampleName,\n teamUid: readonly(teamUid),\n setTeamUid,\n },\n environment,\n document: activeDocument,\n isDarkMode,\n theme: {\n styles: theme.themeStyles,\n themeStyleTag: theme.themeStyleTag,\n customThemes,\n },\n telemetry,\n options,\n }\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"app-state.js","names":[],"sources":["../../../../src/v2/features/app/app-state.ts"],"sourcesContent":["import type { ScalarListboxOption, WorkspaceGroup } from '@scalar/components'\nimport { isDefined } from '@scalar/helpers/array/is-defined'\nimport { sortByOrder } from '@scalar/helpers/array/sort-by-order'\nimport type { HttpMethod } from '@scalar/helpers/http/http-methods'\nimport type { LoaderPlugin } from '@scalar/json-magic/bundle'\nimport { migrateLocalStorageToIndexDb } from '@scalar/oas-utils/migrations'\nimport { createSidebarState, generateReverseIndex } from '@scalar/sidebar'\nimport type { Theme } from '@scalar/themes'\nimport { type WorkspaceStore, createWorkspaceStore } from '@scalar/workspace-store/client'\nimport {\n type OperationExampleMeta,\n type WorkspaceEventBus,\n createWorkspaceEventBus,\n} from '@scalar/workspace-store/events'\nimport { generateUniqueValue } from '@scalar/workspace-store/helpers/generate-unique-value'\nimport { getParentEntry } from '@scalar/workspace-store/navigation'\nimport { createWorkspaceStorePersistence, getWorkspaceId } from '@scalar/workspace-store/persistence'\nimport { persistencePlugin } from '@scalar/workspace-store/plugins/client'\nimport { getActiveEnvironment } from '@scalar/workspace-store/request-example'\nimport type { Workspace, WorkspaceDocument } from '@scalar/workspace-store/schemas'\nimport { extensions } from '@scalar/workspace-store/schemas/extensions'\nimport type { XScalarEnvironment } from '@scalar/workspace-store/schemas/extensions/document/x-scalar-environments'\nimport type { Tab } from '@scalar/workspace-store/schemas/extensions/workspace/x-scalar-tabs'\nimport type { TraversedEntry } from '@scalar/workspace-store/schemas/navigation'\nimport {\n type ComputedRef,\n type MaybeRefOrGetter,\n type Ref,\n type ShallowRef,\n computed,\n readonly,\n ref,\n shallowRef,\n watch,\n} from 'vue'\nimport type { RouteLocationNormalizedGeneric, RouteLocationRaw, Router } from 'vue-router'\n\nimport type { ApiClientAppOptions } from '@/v2/features/app/helpers/create-api-client-app'\nimport { getRouteParam } from '@/v2/features/app/helpers/get-route-param'\nimport { groupWorkspacesByTeam } from '@/v2/features/app/helpers/group-workspaces'\nimport { useTheme } from '@/v2/features/app/hooks/use-theme'\nimport { getTabDetails } from '@/v2/helpers/get-tab-details'\nimport { slugify } from '@/v2/helpers/slugify'\nimport { workspaceStorage } from '@/v2/helpers/storage'\n\nimport { initializeAppEventHandlers } from './app-events'\nimport { canLoadWorkspace, filterWorkspacesByTeam } from './helpers/filter-workspaces'\n\n// ---------------------------------------------------------------------------\n// Types\n// ---------------------------------------------------------------------------\nexport type GetEntryByLocation = (location: {\n document: string\n path?: string\n method?: HttpMethod\n example?: string\n}) =>\n | (TraversedEntry & {\n parent?: TraversedEntry | undefined\n })\n | undefined\n\ntype WorkspaceOption = ScalarListboxOption & { teamUid: string; namespace: string; slug: string }\n\n/** Defines the overall application state structure and its main feature modules */\nexport type AppState = {\n /** The workspace store */\n store: ShallowRef<WorkspaceStore | null>\n /** The sidebar management */\n sidebar: {\n /** The sidebar state */\n state: ReturnType<typeof createSidebarState<TraversedEntry>>\n /** The width of the sidebar */\n width: ComputedRef<number>\n /** Whether the sidebar is open */\n isOpen: Ref<boolean>\n /** Handles the selection of an item in the sidebar */\n handleSelectItem: (id: string) => void\n /** Handles the width update of the sidebar */\n handleSidebarWidthUpdate: (width: number) => void\n /** Gets the entry by location */\n getEntryByLocation: GetEntryByLocation\n }\n /** The tabs management */\n tabs: {\n /** The tabs state */\n state: Ref<Tab[]>\n /** The active tab index */\n activeTabIndex: Ref<number>\n /** Copies the URL of the tab at the given index to the clipboard */\n copyTabUrl: (index: number) => Promise<void>\n }\n /** The workspace management */\n workspace: {\n /** Creates a new workspace and navigates to it */\n create: (payload: {\n teamUid?: string\n namespace?: string\n slug?: string\n name: string\n }) => Promise<{ name: string; namespace: string; slug: string; teamUid: string } | undefined>\n /** All workspace list */\n workspaceList: Ref<WorkspaceOption[]>\n /** Filtered workspace list, based on the current teamUid */\n filteredWorkspaceList: ComputedRef<WorkspaceOption[]>\n /**\n * Groups workspaces into team and local categories for display in the workspace picker.\n * Team workspaces are shown first (when not on local team), followed by local workspaces.\n */\n workspaceGroups: ComputedRef<WorkspaceGroup[]>\n /** The currently active workspace */\n activeWorkspace: ShallowRef<{ id: string; label: string } | null>\n /** Navigates to the specified workspace */\n navigateToWorkspace: (namespace?: string, slug?: string) => Promise<void>\n /** Whether the workspace page is open */\n isOpen: ComputedRef<boolean>\n /**\n * Whether the currently active workspace is a team workspace (i.e. has a\n * `teamUid` other than `'local'`). Useful for gating team-only UI such as\n * the registry-backed document list and its loading state.\n */\n isTeamWorkspace: ComputedRef<boolean>\n }\n /** The workspace event bus for handling workspace-level events */\n eventBus: WorkspaceEventBus\n /** The router instance */\n router: Router\n /** The current route derived from the router */\n currentRoute: Ref<RouteLocationNormalizedGeneric | null>\n /** Whether the workspace is currently syncing */\n loading: Ref<boolean>\n /** Runtime behaviour overrides */\n options?: ApiClientAppOptions\n /** The currently active entities */\n activeEntities: {\n /** The namespace of the current entity, e.g. \"default\" or a custom namespace */\n namespace: Ref<string | undefined>\n /** The slug identifying the current workspace */\n workspaceSlug: Ref<string | undefined>\n /** The slug of the currently selected document in the workspace */\n documentSlug: Ref<string | undefined>\n /** The API path currently selected (e.g. \"/users/{id}\") */\n path: Ref<string | undefined>\n /** The HTTP method for the currently selected API path (e.g. GET, POST) */\n method: Ref<HttpMethod | undefined>\n /** The name of the currently selected example (for examples within an endpoint) */\n exampleName: Ref<string | undefined>\n /** The unique identifier for the selected team context (read-only; use setTeamUid to change) */\n teamUid: Readonly<Ref<string>>\n /** Sets the current team context by team UID */\n setTeamUid: (value: string) => void\n }\n /** The currently active environment */\n environment: ComputedRef<XScalarEnvironment>\n /** The currently active document */\n document: ComputedRef<WorkspaceDocument | null>\n /** Whether the current color mode is dark */\n isDarkMode: ComputedRef<boolean>\n /** The currently active theme */\n theme: {\n /** The computed CSS styles for the current theme, as a string */\n styles: ComputedRef<{ themeStyles: string; themeSlug: string }>\n /** The computed value for the <style> tag containing the current theme styles */\n themeStyleTag: ComputedRef<string>\n /** The custom themes to use */\n customThemes: MaybeRefOrGetter<Theme[]>\n }\n telemetry: Ref<boolean>\n}\n\n// ---------------------------------------------------------------------------\n// Constants\n// ---------------------------------------------------------------------------\n/** Default debounce delay in milliseconds for workspace store persistence. */\nconst DEFAULT_DEBOUNCE_DELAY = 1000\n/** Default sidebar width in pixels. */\nconst DEFAULT_SIDEBAR_WIDTH = 288\n\n// ---------------------------------------------------------------------------\n// App State\n// ---------------------------------------------------------------------------\nexport const createAppState = async ({\n router,\n fileLoader,\n fallbackThemeSlug = () => 'default',\n customThemes = () => [],\n telemetryDefault,\n options,\n}: {\n router: Router\n fileLoader?: LoaderPlugin\n customThemes?: MaybeRefOrGetter<Theme[]>\n fallbackThemeSlug?: MaybeRefOrGetter<string>\n telemetryDefault?: boolean\n /** Runtime behaviour overrides */\n options?: ApiClientAppOptions\n}): Promise<AppState> => {\n /** Workspace event bus for handling workspace-level events. */\n const eventBus = createWorkspaceEventBus({\n debug: import.meta.env.DEV,\n })\n\n const { workspace: persistence } = await createWorkspaceStorePersistence()\n\n /**\n * Run migration from localStorage to IndexedDB if needed\n * This happens once per user and transforms old data structure to new workspace format\n */\n await migrateLocalStorageToIndexDb()\n\n // ---------------------------------------------------------------------------\n // Active entities\n // ---------------------------------------------------------------------------\n const teamUid = ref<string>('local')\n const namespace = ref<string | undefined>(undefined)\n const workspaceSlug = ref<string | undefined>(undefined)\n const documentSlug = ref<string | undefined>(undefined)\n const method = ref<HttpMethod | undefined>(undefined)\n const path = ref<string | undefined>(undefined)\n const exampleName = ref<string | undefined>(undefined)\n\n // ---------------------------------------------------------------------------\n // Loading states\n const isSyncingWorkspace = ref(false)\n\n // ---------------------------------------------------------------------------\n // Router state\n router.afterEach((to) => handleRouteChange(to))\n const currentRoute = computed(() => router.currentRoute.value ?? null)\n\n // ---------------------------------------------------------------------------\n // Workspace persistence state management\n const activeWorkspace = shallowRef<{ id: string; label: string } | null>(null)\n const workspaces = ref<WorkspaceOption[]>([])\n const filteredWorkspaces = computed(() => filterWorkspacesByTeam(workspaces.value, teamUid.value))\n const workspaceGroups = computed(() => groupWorkspacesByTeam(filteredWorkspaces.value, teamUid.value))\n /**\n * `true` when the active workspace is backed by a team (i.e. not the\n * built-in `'local'` team). We look the workspace up in the full\n * `workspaces` list because `activeWorkspace` only stores `{ id, label }`,\n * whereas `WorkspaceOption` carries the `teamUid` we need. Consumers can\n * read this via `app.workspace.isTeamWorkspace` to gate team-only UI.\n */\n const isTeamWorkspace = computed(() => {\n const id = activeWorkspace.value?.id\n if (!id) {\n return false\n }\n const workspace = workspaces.value.find((w) => w.id === id)\n return Boolean(workspace && workspace.teamUid !== 'local')\n })\n const store = shallowRef<WorkspaceStore | null>(null)\n\n // Load persisted telemetry preference, falling back to the provided default\n const persistedTelemetry = workspaceStorage.getTelemetry()\n const telemetry = ref(persistedTelemetry !== null ? persistedTelemetry : Boolean(telemetryDefault))\n watch(telemetry, (value) => workspaceStorage.setTelemetry(value))\n\n const activeDocument = computed(() => {\n return store.value?.workspace.documents[documentSlug.value ?? ''] || null\n })\n\n /**\n * Merged environment variables from workspace and document levels.\n * Variables from both sources are combined, with document variables\n * taking precedence in case of naming conflicts.\n */\n const environment = computed<XScalarEnvironment>(\n () => getActiveEnvironment(store.value, activeDocument.value).environment,\n )\n\n /** Update the workspace list when the component is mounted */\n workspaces.value = await persistence.getAll().then((w) =>\n w.map(({ teamUid, namespace, slug, name }) => ({\n id: getWorkspaceId(namespace, slug),\n teamUid,\n namespace,\n slug,\n label: name,\n })),\n )\n\n /**\n * Renames the currently active workspace.\n * Updates the workspace name in persistence and updates activeWorkspace if successful.\n * Returns early if namespace or workspaceSlug is not set, or if update fails.\n */\n const renameWorkspace = async (name: string) => {\n const namespaceValue = namespace.value\n const slugValue = workspaceSlug.value\n if (!namespaceValue || !slugValue) {\n return\n }\n const workspaceId = getWorkspaceId(namespaceValue, slugValue)\n const updateResult = await persistence.updateName({ namespace: namespaceValue, slug: slugValue }, name)\n\n // If the update fails, return early\n if (updateResult === undefined) {\n return\n }\n\n // Update the workspace list\n workspaces.value = workspaces.value.map((workspace) => {\n // If the workspace is the currently active workspace, update the label\n if (workspace.id === workspaceId) {\n return { ...workspace, label: name }\n }\n return workspace\n })\n activeWorkspace.value = { id: workspaceId, label: name }\n }\n\n /**\n * Creates a client-side workspace store with persistence enabled for the given workspace id.\n */\n const createClientStore = async ({\n namespace,\n slug,\n }: {\n namespace: string\n slug: string\n }): Promise<WorkspaceStore> => {\n return createWorkspaceStore({\n plugins: [\n await persistencePlugin({\n workspaceId: getWorkspaceId(namespace, slug),\n debounceDelay: DEFAULT_DEBOUNCE_DELAY,\n }),\n ],\n fileLoader,\n fetch: options?.customFetch,\n })\n }\n\n /**\n * Attempts to load and activate a workspace by id.\n * Returns true when the workspace was found and activated.\n */\n const loadWorkspace = async (\n namespace: string,\n slug: string,\n ): Promise<{ success: true; workspace: Workspace } | { success: false }> => {\n const workspace = await persistence.getItem({ namespace, slug })\n\n if (!workspace) {\n return {\n success: false,\n }\n }\n\n const client = await createClientStore({ namespace, slug })\n client.loadWorkspace(workspace.workspace)\n activeWorkspace.value = { id: getWorkspaceId(workspace.namespace, workspace.slug), label: workspace.name }\n store.value = client\n\n return {\n success: true,\n workspace: client.workspace,\n }\n }\n\n /**\n * Creates and persists the default workspace with a blank draft document.\n * Used when no workspaces exist yet.\n */\n const createAndPersistWorkspace = async ({\n name,\n teamUid,\n namespace,\n slug,\n }: {\n name: string\n teamUid?: string\n namespace?: string\n slug: string\n }) => {\n const draftStore = createWorkspaceStore()\n await draftStore.addDocument({\n name: 'drafts',\n document: {\n openapi: '3.1.0',\n info: {\n title: 'Drafts',\n version: '1.0.0',\n },\n paths: {\n '/': {\n get: {},\n },\n },\n 'x-scalar-original-document-hash': 'drafts',\n 'x-scalar-icon': 'interface-edit-tool-pencil',\n },\n })\n\n // Persist the workspace\n const workspace = await persistence.setItem(\n { namespace, slug },\n {\n name: name,\n teamUid,\n workspace: draftStore.exportWorkspace(),\n },\n )\n\n // Update the workspace list\n workspaces.value.push({\n id: getWorkspaceId(workspace.namespace, workspace.slug),\n teamUid: workspace.teamUid,\n namespace: workspace.namespace,\n slug: workspace.slug,\n label: workspace.name,\n })\n return workspace\n }\n\n /**\n * Navigates to the overview page of the specified workspace.\n *\n * @param namespace - The workspace namespace.\n * @param slug - The unique workspace slug (identifier).\n */\n const navigateToWorkspace = async (namespace?: string, slug?: string): Promise<void> => {\n if (!namespace || !slug) {\n await router.push('/')\n return\n }\n\n // We should always have this drafts document available in a new workspace\n await router.push({\n name: 'example',\n params: {\n namespace,\n workspaceSlug: slug,\n documentSlug: 'drafts',\n pathEncoded: encodeURIComponent('/'),\n method: 'get',\n exampleName: 'default',\n },\n })\n }\n\n /**\n * Creates a new workspace with the provided name.\n * - Generates a unique slug for the workspace (uses the provided slug if it is unique, otherwise generates a unique slug).\n * - Adds a default blank document (\"drafts\") to the workspace.\n * - Persists the workspace and navigates to it.\n *\n * Example usage:\n * await createWorkspace({ name: 'My Awesome API' })\n * // -> Navigates to /workspace/my-awesome-api (if available)\n */\n const createWorkspace = async ({\n teamUid,\n namespace,\n slug,\n name,\n }: {\n teamUid?: string\n namespace?: string\n slug?: string\n name: string\n }) => {\n // Clear up the current store, in order to show the loading state\n store.value = null\n\n // Generate a unique slug/id for the workspace, based on the name.\n const newWorkspaceSlug = await generateUniqueValue({\n defaultValue: slug ?? name, // Use the provided id if it exists, otherwise use the name\n validation: async (value) => !(await persistence.has({ namespace: namespace ?? 'local', slug: value })),\n maxRetries: 100,\n transformation: slugify,\n })\n\n // Failed to generate a unique workspace id, so we can't create the workspace.\n if (!newWorkspaceSlug) {\n return undefined\n }\n\n const newWorkspaceDetails = {\n teamUid,\n namespace,\n slug: newWorkspaceSlug,\n name,\n }\n\n // Create a new client store with the workspace ID and add a default document.\n const createdWorkspace = await createAndPersistWorkspace(newWorkspaceDetails)\n\n // Navigate to the newly created workspace.\n await navigateToWorkspace(createdWorkspace.namespace, createdWorkspace.slug)\n return createdWorkspace\n }\n\n /**\n * Handles changing the active workspace when the workspace slug changes in the route.\n * This function:\n * - Clears the current workspace store and sets loading state.\n * - Attempts to load the workspace by slug.\n * - If found, navigates to the active tab path (if available).\n * - If not found, creates the default workspace and navigates to it.\n */\n const changeWorkspace = async (namespace: string, slug: string, to?: RouteLocationNormalizedGeneric) => {\n /** For initial load we want to fall through to our router default behaviour */\n const isInitialLoad = activeWorkspace.value === null\n\n // Clear the current store and set loading to true before loading new workspace.\n store.value = null\n isSyncingWorkspace.value = true\n\n // Try to load the workspace\n const result = await loadWorkspace(namespace, slug)\n\n if (result.success) {\n // Navigate to the correct tab if the workspace has a tab already\n const index = result.workspace['x-scalar-active-tab'] ?? 0\n const tabs = result.workspace['x-scalar-tabs']\n const tab = tabs?.[index]\n\n // On initial load let the URL-based routing (catch-all → getLastPath) take precedence\n if (tab && !isInitialLoad) {\n // Preserve query parameters when navigating to the active tab\n await router.replace({\n path: tab.path,\n query: currentRoute.value?.query ?? {},\n })\n }\n\n // Heal the active tab index if it is out of bounds\n if (tabs && index >= tabs.length) {\n eventBus.emit('tabs:update:tabs', {\n 'x-scalar-active-tab': 0,\n })\n }\n\n // Initialize the tabs if they does not exist\n if (!tabs) {\n eventBus.emit('tabs:update:tabs', {\n 'x-scalar-tabs': [createTabFromRoute(currentRoute.value)],\n 'x-scalar-active-tab': 0,\n })\n }\n\n // On initial load the router.replace above is skipped, so syncTabs/syncSidebar\n // are never reached via handleRouteChange's normal flow. Call them here to\n // align the tab bar and sidebar with the URL-based route.\n if (isInitialLoad && to) {\n syncTabs(to)\n syncSidebar(to)\n }\n\n isSyncingWorkspace.value = false\n return\n }\n\n // Navigate to the default workspace, or fall back to the first available workspace\n const targetWorkspace =\n filteredWorkspaces.value.find((workspace) => workspace.teamUid === 'local' && workspace.slug === 'default') ??\n filteredWorkspaces.value[0]\n\n if (targetWorkspace) {\n return navigateToWorkspace(targetWorkspace.namespace, targetWorkspace.slug)\n }\n\n // If loading failed (workspace does not exist), create the default workspace and navigate to it.\n const createResult = await createWorkspace({\n name: 'Default Workspace',\n slug: 'default',\n })\n\n isSyncingWorkspace.value = false\n\n if (!createResult) {\n return console.error('Failed to create the default workspace, something went wrong, can not load the workspace')\n }\n\n // Must reset the sidebar state when the workspace changes\n sidebarState.reset()\n }\n\n /**\n * Sets the current team context. If the active workspace is not accessible\n * with the new team, navigates to the default workspace for that team.\n */\n const setTeamUid = (value: string) => {\n // Update the new teamUid\n teamUid.value = value\n\n // Find the current workspace\n const workspace = filteredWorkspaces.value.find(\n (w) => w.namespace === namespace.value && w.slug === workspaceSlug.value,\n )\n\n // Check if new teamUid is accessible to the current workspace\n if (workspace && canLoadWorkspace(workspace.teamUid, value)) {\n return\n }\n\n return navigateToWorkspace('local', 'default')\n }\n\n // ---------------------------------------------------------------------------\n // Sidebar state management\n\n const entries = computed(() => {\n const activeStore = store.value\n if (!activeStore) {\n return []\n }\n\n const order = activeStore.workspace['x-scalar-order'] ?? Object.keys(activeStore.workspace.documents)\n\n return sortByOrder(Object.keys(activeStore.workspace.documents), order, (item) => item)\n .map((doc) => activeStore.workspace.documents[doc]?.['x-scalar-navigation'])\n .filter(isDefined) as TraversedEntry[]\n })\n\n const sidebarState = createSidebarState(entries)\n\n /**\n * Generates a unique string ID for an API location, based on the document, path, method, and example.\n * Filters out undefined values and serializes the composite array into a stable string.\n *\n * @param params - An object containing document, path, method, and optional example name.\n * @returns A stringified array representing the unique location identifier.\n *\n * Example:\n * generateId({ document: 'mydoc', path: '/users', method: 'get', example: 'default' })\n * // => '[\"mydoc\",\"/users\",\"get\",\"default\"]'\n */\n const generateId = ({\n document,\n path,\n method,\n example,\n }: {\n document: string\n path?: string\n method?: HttpMethod\n example?: string\n }) => {\n return JSON.stringify([document, path, method, example].filter(isDefined))\n }\n\n /**\n * Computed index for fast lookup of sidebar nodes by their unique API location.\n *\n * - Only indexes nodes of type 'document', 'operation', or 'example'.\n * - The lookup key is a serialized array of: [documentName, operationPath, operationMethod, exampleName?].\n * - Supports precise resolution of sidebar entries given an API \"location\".\n */\n const locationIndex = computed(() =>\n generateReverseIndex({\n items: entries.value,\n nestedKey: 'children',\n filter: (node) => node.type === 'document' || node.type === 'operation' || node.type === 'example',\n getId: (node) => {\n const document = getParentEntry('document', node)\n const operation = getParentEntry('operation', node)\n return generateId({\n document: document?.name ?? '',\n path: operation?.path,\n method: operation?.method,\n example: node.type === 'example' ? node.name : undefined,\n })\n },\n }),\n )\n\n /**\n * Looks up a sidebar entry by its unique API location.\n * - First tries to find an entry matching all provided properties (including example).\n * - If not found, falls back to matching only the operation (ignores example field).\n * This allows resolving either examples, operations, or documents as appropriate.\n *\n * @param location - Object specifying the document name, path, method, and optional example name.\n * @returns The matching sidebar entry, or undefined if none found.\n *\n * Example:\n * const entry = getEntryByLocation({\n * document: 'pets',\n * path: '/pets',\n * method: 'get',\n * example: 'default',\n * })\n */\n const getEntryByLocation: GetEntryByLocation = (location) => {\n // Try to find an entry with the most-specific location (including example)\n const entryWithExample = locationIndex.value.get(generateId(location))\n\n if (entryWithExample) {\n return entryWithExample\n }\n\n // Fallback to the operation (ignoring example) if an example wasn't found or specified\n return locationIndex.value.get(\n generateId({\n document: location.document,\n path: location.path,\n method: location.method,\n }),\n )\n }\n\n /**\n * Handles item selection from the sidebar and routes navigation accordingly.\n *\n * Example:\n * handleSelectItem('id-of-entry')\n */\n const handleSelectItem = (id: string) => {\n const entry = sidebarState.getEntryById(id)\n\n if (!entry) {\n console.warn(`Could not find sidebar entry with id ${id} to select`)\n return\n }\n\n /** Close sidebar and navigate. Used for every branch that performs navigation. */\n const navigate = (route: RouteLocationRaw) => {\n isSidebarOpen.value = false\n return router.push(route)\n }\n\n // Navigate to the document overview page\n if (entry.type === 'document') {\n // If we are already in the document, just toggle expansion\n if (sidebarState.selectedItem.value === id) {\n sidebarState.setExpanded(id, !sidebarState.isExpanded(id))\n return\n }\n\n // Otherwise, select it\n sidebarState.setSelected(id)\n sidebarState.setExpanded(id, true)\n return navigate({\n name: 'document.overview',\n params: { documentSlug: entry.name },\n })\n }\n\n // Navigate to the example page\n if (entry.type === 'operation') {\n // If we are already in an operation child we just want to toggle the explanstion\n if (sidebarState.isSelected(id) && sidebarState.selectedItem.value !== id) {\n sidebarState.setExpanded(id, !sidebarState.isExpanded(id))\n return\n }\n\n // Otherwise, select the first example\n const firstExample = entry.children?.find((child) => child.type === 'example')\n\n if (firstExample) {\n sidebarState.setSelected(firstExample.id)\n sidebarState.setExpanded(firstExample.id, true)\n } else {\n sidebarState.setSelected(id)\n }\n\n return navigate({\n name: 'example',\n params: {\n documentSlug: getParentEntry('document', entry)?.name,\n pathEncoded: encodeURIComponent(entry.path),\n method: entry.method,\n exampleName: firstExample?.name ?? 'default',\n },\n })\n }\n\n // Navigate to the example page\n if (entry.type === 'example') {\n sidebarState.setSelected(id)\n const operation = getParentEntry('operation', entry)\n return navigate({\n name: 'example',\n params: {\n documentSlug: getParentEntry('document', entry)?.name,\n pathEncoded: encodeURIComponent(operation?.path ?? ''),\n method: operation?.method,\n exampleName: entry.name,\n },\n })\n }\n\n if (entry.type === 'text') {\n return navigate({\n name: 'document.overview',\n params: {\n documentSlug: getParentEntry('document', entry)?.name,\n },\n })\n }\n\n sidebarState.setExpanded(id, !sidebarState.isExpanded(id))\n return\n }\n\n /**\n * Navigates to the currently active tab's path using the router.\n * Returns early if the workspace store or active tab is unavailable.\n */\n const navigateToCurrentTab = async (): Promise<void> => {\n if (!store.value) {\n return\n }\n\n const activeTabIndex = store.value.workspace['x-scalar-active-tab'] ?? 0\n const activeTab = store.value.workspace['x-scalar-tabs']?.[activeTabIndex]\n if (!activeTab) {\n return\n }\n\n await router.replace(activeTab.path)\n }\n\n /**\n * Rebuilds the sidebar for the given document.\n * This is used to refresh the sidebar state after structural changes (e.g. after adding or removing items).\n *\n * @param documentName - The name (id) of the document for which to rebuild the sidebar\n */\n const rebuildSidebar = (documentName: string | undefined) => {\n if (documentName) {\n store.value?.buildSidebar(documentName)\n }\n }\n\n /**\n * Ensures the sidebar is refreshed after a new example is created.\n *\n * If the sidebar entry for the new example does not exist or is of a different type,\n * this will rebuild the sidebar for the current document. This helps keep the sidebar state\n * consistent (e.g., after adding a new example via the UI).\n */\n const refreshSidebarAfterExampleCreation = (payload: OperationExampleMeta & { documentName?: string }) => {\n const documentName = payload.documentName ?? activeDocument.value?.['x-scalar-navigation']?.name\n if (!documentName) {\n return\n }\n\n const entry = getEntryByLocation({\n document: documentName,\n path: payload.path,\n method: payload.method,\n example: payload.exampleKey,\n })\n\n if (!entry || entry.type !== 'example') {\n // Sidebar entry for this example doesn't exist, so rebuild sidebar for consistency.\n rebuildSidebar(documentName)\n if (currentRoute.value) {\n syncSidebar(currentRoute.value)\n }\n }\n return\n }\n\n /** Width of the sidebar, with fallback to default. */\n const sidebarWidth = computed(() => store.value?.workspace?.['x-scalar-sidebar-width'] ?? DEFAULT_SIDEBAR_WIDTH)\n\n /** Handler for sidebar width changes. */\n const handleSidebarWidthUpdate = (width: number) => store.value?.update('x-scalar-sidebar-width', width)\n\n /** Controls the visibility of the sidebar. */\n const isSidebarOpen = ref(false)\n // ---------------------------------------------------------------------------\n // Tab Management\n\n /** Constants for workspace store keys */\n const TABS_KEY = 'x-scalar-tabs' as const\n const ACTIVE_TAB_KEY = 'x-scalar-active-tab' as const\n\n /**\n * Creates a tab object based on the current route and workspace state.\n * Used as a fallback when no tabs exist or when creating new tabs.\n */\n const createTabFromRoute = (to: RouteLocationNormalizedGeneric | null): Tab => {\n const method = getRouteParam('method', to)\n const path = getRouteParam('pathEncoded', to)\n const document = getRouteParam('documentSlug', to)\n const workspace = getRouteParam('workspaceSlug', to)\n return {\n ...getTabDetails({\n workspace,\n document,\n path,\n method,\n getEntryByLocation,\n }),\n path: currentRoute.value?.path ?? '',\n }\n }\n\n const tabs = computed(() => {\n return store.value?.workspace[TABS_KEY] ?? [createTabFromRoute(currentRoute.value)]\n })\n\n const activeTabIndex = computed(() => {\n return store.value?.workspace[ACTIVE_TAB_KEY] ?? 0\n })\n\n /**\n * Copies the URL of the tab at the given index to the clipboard.\n * Constructs the full URL using the current origin and the tab path.\n *\n * Note: Will silently fail if clipboard API is unavailable or the tab does not exist.\n */\n const copyTabUrl = async (index: number): Promise<void> => {\n const tab = tabs.value[index]\n\n if (!tab) {\n console.warn(`Cannot copy URL: tab at index ${index} does not exist`)\n return\n }\n\n const url = `${window.location.origin}${tab.path}`\n\n try {\n await navigator.clipboard.writeText(url)\n } catch (error) {\n console.error('Failed to copy URL to clipboard:', error)\n }\n }\n\n // ---------------------------------------------------------------------------\n // Path syncing\n\n /** When the route changes we need to update the active entities in the store */\n const handleRouteChange = (to: RouteLocationNormalizedGeneric) => {\n const slug = getRouteParam('workspaceSlug', to)\n const document = getRouteParam('documentSlug', to)\n const namespaceValue = getRouteParam('namespace', to)\n\n // Must have an active workspace to syncs\n if (!namespaceValue || !slug) {\n return\n }\n\n // Try to see if the user can load this workspace based on the teamUid and namespace\n const workspace = workspaces.value.find(\n (workspace) => workspace.slug === slug && workspace.namespace === namespaceValue,\n )\n\n // If the workspace is not found or the teamUid does not match, try to redirect to the default workspace\n if (workspace && !canLoadWorkspace(workspace.teamUid, teamUid.value)) {\n // try to redirect to the default workspace\n return navigateToWorkspace('local', 'default')\n }\n\n namespace.value = namespaceValue\n workspaceSlug.value = slug\n documentSlug.value = document\n method.value = getRouteParam('method', to)\n path.value = getRouteParam('pathEncoded', to)\n exampleName.value = getRouteParam('exampleName', to)\n\n // Save the current path to the persistence storage\n if (to.path !== '') {\n workspaceStorage.setCurrentPath(to.path)\n }\n\n if (getWorkspaceId(namespace.value, slug) !== activeWorkspace.value?.id) {\n return changeWorkspace(namespace.value, slug, to)\n }\n\n // Update the active document if the document slug has changes\n if (document && document !== store.value?.workspace[extensions.workspace.activeDocument]) {\n store?.value?.update('x-scalar-active-document', document)\n }\n\n syncTabs(to)\n syncSidebar(to)\n return\n }\n\n /** Aligns the tabs with any potential slug changes */\n const syncTabs = (to: RouteLocationNormalizedGeneric) => {\n const tabs = store.value?.workspace['x-scalar-tabs'] ?? []\n const index = store.value?.workspace['x-scalar-active-tab'] ?? 0\n\n const tab = tabs[index]\n\n // If there is no tab or the tab path is the same we leave the tab state alone\n if (!tab || tab.path === to.path) {\n // Already on the correct path, do nothing\n return\n }\n\n // Otherwise we replace the tab content with the new route\n tabs[index] = createTabFromRoute(to)\n }\n\n /** Aligns the sidebar state with any potential slug changes */\n const syncSidebar = (to: RouteLocationNormalizedGeneric) => {\n const document = getRouteParam('documentSlug', to)\n\n if (!document) {\n // Reset selection if no document is selected\n sidebarState.setSelected(null)\n return\n }\n\n const entry = getEntryByLocation({\n document,\n path: getRouteParam('pathEncoded', to),\n method: getRouteParam('method', to),\n example: getRouteParam('exampleName', to),\n })\n\n if (entry) {\n sidebarState.setSelected(entry.id)\n sidebarState.setExpanded(entry.id, true)\n }\n }\n\n // ---------------------------------------------------------------------------\n // Events handling\n\n initializeAppEventHandlers({\n eventBus,\n router,\n store,\n navigateToCurrentTab,\n rebuildSidebar,\n onAfterExampleCreation: refreshSidebarAfterExampleCreation,\n onSelectSidebarItem: handleSelectItem,\n onCopyTabUrl: (index) => copyTabUrl(index),\n onToggleSidebar: () => (isSidebarOpen.value = !isSidebarOpen.value),\n closeSidebar: () => (isSidebarOpen.value = false),\n renameWorkspace,\n })\n\n const theme = useTheme({\n fallbackThemeSlug,\n customThemes,\n store: store,\n })\n\n const isDarkMode = computed(() => {\n const colorMode = store.value?.workspace['x-scalar-color-mode'] ?? 'system'\n if (colorMode === 'system') {\n return window.matchMedia?.('(prefers-color-scheme: dark)')?.matches ?? false\n }\n return colorMode === 'dark'\n })\n\n return {\n /** Active workspace store */\n store,\n sidebar: {\n state: sidebarState,\n width: sidebarWidth,\n isOpen: isSidebarOpen,\n handleSelectItem,\n handleSidebarWidthUpdate,\n getEntryByLocation,\n },\n tabs: {\n state: tabs,\n activeTabIndex,\n copyTabUrl,\n },\n workspace: {\n create: createWorkspace,\n workspaceList: workspaces,\n filteredWorkspaceList: filteredWorkspaces,\n workspaceGroups,\n activeWorkspace,\n navigateToWorkspace,\n isOpen: computed(() => Boolean(workspaceSlug.value && !documentSlug.value)),\n isTeamWorkspace,\n },\n eventBus,\n router,\n currentRoute,\n loading: isSyncingWorkspace,\n activeEntities: {\n namespace,\n workspaceSlug,\n documentSlug,\n path,\n method,\n exampleName,\n teamUid: readonly(teamUid),\n setTeamUid,\n },\n environment,\n document: activeDocument,\n isDarkMode,\n theme: {\n styles: theme.themeStyles,\n themeStyleTag: theme.themeStyleTag,\n customThemes,\n },\n telemetry,\n options,\n }\n}\n"],"mappings":"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"}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
type __VLS_Slots = {
|
|
2
|
+
/** Slot for customizing the menu items */
|
|
3
|
+
menuItems?(): unknown;
|
|
4
|
+
/** Slot for customizing the end of the header */
|
|
5
|
+
end?(): unknown;
|
|
6
|
+
};
|
|
7
|
+
declare const __VLS_base: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
|
|
8
|
+
"navigate:to:settings": () => any;
|
|
9
|
+
}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{
|
|
10
|
+
"onNavigate:to:settings"?: (() => any) | undefined;
|
|
11
|
+
}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
|
|
12
|
+
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
13
|
+
declare const _default: typeof __VLS_export;
|
|
14
|
+
export default _default;
|
|
15
|
+
type __VLS_WithSlots<T, S> = T & {
|
|
16
|
+
new (): {
|
|
17
|
+
$slots: S;
|
|
18
|
+
};
|
|
19
|
+
};
|
|
20
|
+
//# sourceMappingURL=AppHeader.vue.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AppHeader.vue.d.ts","sourceRoot":"","sources":["../../../../../src/v2/features/app/components/AppHeader.vue"],"names":[],"mappings":"AA4EA,KAAK,WAAW,GAAG;IACjB,0CAA0C;IAC1C,SAAS,CAAC,IAAI,OAAO,CAAA;IACrB,iDAAiD;IACjD,GAAG,CAAC,IAAI,OAAO,CAAA;CAChB,CAAC;AAqJF,QAAA,MAAM,UAAU;;;;iFAEd,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"}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import AppHeader_vue_vue_type_script_setup_true_lang_default from "./AppHeader.vue.script.js";
|
|
2
|
+
//#region src/v2/features/app/components/AppHeader.vue
|
|
3
|
+
var AppHeader_default = AppHeader_vue_vue_type_script_setup_true_lang_default;
|
|
4
|
+
//#endregion
|
|
5
|
+
export { AppHeader_default as default };
|
|
6
|
+
|
|
7
|
+
//# sourceMappingURL=AppHeader.vue.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AppHeader.vue.js","names":[],"sources":["../../../../../src/v2/features/app/components/AppHeader.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport {\n ScalarHeader,\n ScalarMenu,\n ScalarMenuLink,\n ScalarMenuProducts,\n ScalarMenuResources,\n ScalarMenuSection,\n} from '@scalar/components'\nimport { ScalarIconGear } from '@scalar/icons'\n\nconst emit = defineEmits<{\n /** Emitted when the user wants to open the workspace settings */\n (e: 'navigate:to:settings'): void\n}>()\n\nconst slots = defineSlots<{\n /** Slot for customizing the menu items */\n menuItems?(): unknown\n /** Slot for customizing the end of the header */\n end?(): unknown\n}>()\n</script>\n\n<template>\n <ScalarHeader class=\"w-full pl-3 *:first:flex-none\">\n <template #start>\n <ScalarMenu>\n <template #products>\n <ScalarMenuProducts selected=\"client\" />\n </template>\n <template #sections=\"{ close }\">\n <ScalarMenuSection>\n <slot name=\"menuItems\" />\n <ScalarMenuLink\n is=\"button\"\n :icon=\"ScalarIconGear\"\n @click=\"\n () => {\n close()\n emit('navigate:to:settings')\n }\n \">\n Settings\n </ScalarMenuLink>\n </ScalarMenuSection>\n <ScalarMenuResources />\n </template>\n </ScalarMenu>\n </template>\n <template\n v-if=\"slots.end\"\n #end>\n <slots.end />\n </template>\n </ScalarHeader>\n</template>\n"],"mappings":""}
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
import { createBlock, createSlots, createTextVNode, createVNode, defineComponent, openBlock, renderSlot, unref, useSlots, withCtx } from "vue";
|
|
2
|
+
import { ScalarHeader, ScalarMenu, ScalarMenuLink, ScalarMenuProducts, ScalarMenuResources, ScalarMenuSection } from "@scalar/components";
|
|
3
|
+
import { ScalarIconGear } from "@scalar/icons";
|
|
4
|
+
//#region src/v2/features/app/components/AppHeader.vue?vue&type=script&setup=true&lang.ts
|
|
5
|
+
var AppHeader_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
|
|
6
|
+
__name: "AppHeader",
|
|
7
|
+
emits: ["navigate:to:settings"],
|
|
8
|
+
setup(__props, { emit: __emit }) {
|
|
9
|
+
const emit = __emit;
|
|
10
|
+
const slots = useSlots();
|
|
11
|
+
return (_ctx, _cache) => {
|
|
12
|
+
return openBlock(), createBlock(unref(ScalarHeader), { class: "w-full pl-3 *:first:flex-none" }, createSlots({
|
|
13
|
+
start: withCtx(() => [createVNode(unref(ScalarMenu), null, {
|
|
14
|
+
products: withCtx(() => [createVNode(unref(ScalarMenuProducts), { selected: "client" })]),
|
|
15
|
+
sections: withCtx(({ close }) => [createVNode(unref(ScalarMenuSection), null, {
|
|
16
|
+
default: withCtx(() => [renderSlot(_ctx.$slots, "menuItems"), createVNode(unref(ScalarMenuLink), {
|
|
17
|
+
is: "button",
|
|
18
|
+
icon: unref(ScalarIconGear),
|
|
19
|
+
onClick: () => {
|
|
20
|
+
close();
|
|
21
|
+
emit("navigate:to:settings");
|
|
22
|
+
}
|
|
23
|
+
}, {
|
|
24
|
+
default: withCtx(() => [..._cache[0] || (_cache[0] = [createTextVNode(" Settings ", -1)])]),
|
|
25
|
+
_: 1
|
|
26
|
+
}, 8, ["icon", "onClick"])]),
|
|
27
|
+
_: 2
|
|
28
|
+
}, 1024), createVNode(unref(ScalarMenuResources))]),
|
|
29
|
+
_: 3
|
|
30
|
+
})]),
|
|
31
|
+
_: 2
|
|
32
|
+
}, [slots.end ? {
|
|
33
|
+
name: "end",
|
|
34
|
+
fn: withCtx(() => [createVNode(slots.end)]),
|
|
35
|
+
key: "0"
|
|
36
|
+
} : void 0]), 1024);
|
|
37
|
+
};
|
|
38
|
+
}
|
|
39
|
+
});
|
|
40
|
+
//#endregion
|
|
41
|
+
export { AppHeader_vue_vue_type_script_setup_true_lang_default as default };
|
|
42
|
+
|
|
43
|
+
//# sourceMappingURL=AppHeader.vue.script.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AppHeader.vue.script.js","names":[],"sources":["../../../../../src/v2/features/app/components/AppHeader.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport {\n ScalarHeader,\n ScalarMenu,\n ScalarMenuLink,\n ScalarMenuProducts,\n ScalarMenuResources,\n ScalarMenuSection,\n} from '@scalar/components'\nimport { ScalarIconGear } from '@scalar/icons'\n\nconst emit = defineEmits<{\n /** Emitted when the user wants to open the workspace settings */\n (e: 'navigate:to:settings'): void\n}>()\n\nconst slots = defineSlots<{\n /** Slot for customizing the menu items */\n menuItems?(): unknown\n /** Slot for customizing the end of the header */\n end?(): unknown\n}>()\n</script>\n\n<template>\n <ScalarHeader class=\"w-full pl-3 *:first:flex-none\">\n <template #start>\n <ScalarMenu>\n <template #products>\n <ScalarMenuProducts selected=\"client\" />\n </template>\n <template #sections=\"{ close }\">\n <ScalarMenuSection>\n <slot name=\"menuItems\" />\n <ScalarMenuLink\n is=\"button\"\n :icon=\"ScalarIconGear\"\n @click=\"\n () => {\n close()\n emit('navigate:to:settings')\n }\n \">\n Settings\n </ScalarMenuLink>\n </ScalarMenuSection>\n <ScalarMenuResources />\n </template>\n </ScalarMenu>\n </template>\n <template\n v-if=\"slots.end\"\n #end>\n <slots.end />\n </template>\n </ScalarHeader>\n</template>\n"],"mappings":";;;;;;;;EAWA,MAAM,OAAO;EAKb,MAAM,QAAQ,UAAA;;uBASZ,YA8Be,MAAA,aAAA,EAAA,EA9BD,OAAM,iCAA+B,EAAA,YAAA;IACtC,OAAK,cAsBD,CArBb,YAqBa,MAAA,WAAA,EAAA,MAAA;KApBA,UAAQ,cACuB,CAAxC,YAAwC,MAAA,mBAAA,EAAA,EAApB,UAAS,UAAQ,CAAA,CAAA,CAAA;KAE5B,UAAQ,SAcG,EAdC,YAAK,CAC1B,YAaoB,MAAA,kBAAA,EAAA,MAAA;6BAZO,CAAzB,WAAyB,KAAA,QAAA,YAAA,EACzB,YAUiB,MAAA,eAAA,EAAA;OATf,IAAG;OACF,MAAM,MAAA,eAAc;OACpB,eAAA;AAAkD,eAAK;AAAqB,aAAI,uBAAA;;;8BAOnF,CAAA,GAAA,OAAA,OAAA,OAAA,KAAA,CAAA,gBAFI,cAEJ,GAAA,CAAA,EAAA,CAAA;;;;eAEF,YAAuB,MAAA,oBAAA,CAAA,CAAA,CAAA;;;;OAKrB,MAAM,MAAA;UACX;sBACY,CAAb,YAAa,MAAA,IAAA,CAAA,CAAA"}
|
|
@@ -1,72 +1,33 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import type
|
|
3
|
-
import type {
|
|
4
|
-
import type { WorkspaceEventBus } from '@scalar/workspace-store/events';
|
|
5
|
-
import type { TraversedEntry } from '@scalar/workspace-store/schemas/navigation';
|
|
6
|
-
import type { ClientLayout } from '../../../../v2/types/layout';
|
|
1
|
+
import type { AppState } from '@scalar/api-client/v2/features/app';
|
|
2
|
+
import { type RegistryDocumentsState } from '../../../../v2/features/app/hooks/use-sidebar-documents.js';
|
|
3
|
+
import type { ImportDocumentFromRegistry } from '../../../../v2/types/configuration';
|
|
7
4
|
type __VLS_Props = {
|
|
5
|
+
/** The app state from @scalar/api-client. */
|
|
6
|
+
app: AppState;
|
|
7
|
+
/** Horizontal indent applied to nested sidebar items, in pixels. */
|
|
8
|
+
indent?: number;
|
|
8
9
|
/**
|
|
9
|
-
* The
|
|
10
|
+
* The list of all available registry documents, wrapped in a loading state
|
|
11
|
+
* so the sidebar can render skeleton placeholders while the registry is
|
|
12
|
+
* still being fetched.
|
|
10
13
|
*/
|
|
11
|
-
|
|
12
|
-
/**
|
|
13
|
-
|
|
14
|
-
*/
|
|
15
|
-
sidebarState: SidebarState<TraversedEntry>;
|
|
16
|
-
/**
|
|
17
|
-
* Whether the workspace overview sidebar is currently open
|
|
18
|
-
*/
|
|
19
|
-
isWorkspaceOpen?: boolean;
|
|
20
|
-
/**
|
|
21
|
-
* The currently active workspace.
|
|
22
|
-
* This represents the workspace that the user is currently working in.
|
|
23
|
-
*/
|
|
24
|
-
activeWorkspace: {
|
|
25
|
-
id: string;
|
|
26
|
-
label: string;
|
|
27
|
-
};
|
|
28
|
-
/**
|
|
29
|
-
* The list of all available workspaces.
|
|
30
|
-
* Used to render options for workspace switching and selection.
|
|
31
|
-
*/
|
|
32
|
-
workspaces: WorkspaceGroup[];
|
|
33
|
-
/**
|
|
34
|
-
* The workspace event bus for handling workspace-level events.
|
|
35
|
-
* Used for triggering and responding to workspace changes and actions.
|
|
36
|
-
*/
|
|
37
|
-
eventBus: WorkspaceEventBus;
|
|
38
|
-
/**
|
|
39
|
-
* The WorkspaceStore instance for managing workspace state and actions.
|
|
40
|
-
* Provides methods and state for interacting with the current workspace.
|
|
41
|
-
*/
|
|
42
|
-
store: WorkspaceStore;
|
|
43
|
-
};
|
|
44
|
-
type __VLS_Slots = {
|
|
45
|
-
/** Slot for customizing the actions section of the sidebar menu. */
|
|
46
|
-
sidebarMenuActions?(): unknown;
|
|
14
|
+
registryDocuments?: RegistryDocumentsState;
|
|
15
|
+
/** A function to fetch a registry document */
|
|
16
|
+
fetchRegistryDocument?: ImportDocumentFromRegistry;
|
|
47
17
|
};
|
|
48
18
|
type __VLS_ModelProps = {
|
|
49
|
-
/** Controls the visibility of the sidebar */
|
|
50
|
-
'isSidebarOpen': boolean;
|
|
51
19
|
/** Controls the width of the sidebar */
|
|
52
20
|
'sidebarWidth': number;
|
|
53
21
|
};
|
|
54
22
|
type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
|
|
23
|
+
declare var __VLS_150: {};
|
|
24
|
+
type __VLS_Slots = {} & {
|
|
25
|
+
footer?: (props: typeof __VLS_150) => any;
|
|
26
|
+
};
|
|
55
27
|
declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
|
|
56
28
|
"update:sidebarWidth": (value: number) => any;
|
|
57
|
-
"update:isSidebarOpen": (value: boolean) => any;
|
|
58
|
-
} & {
|
|
59
|
-
"create:workspace": () => any;
|
|
60
|
-
"select:workspace": (id?: string | undefined) => any;
|
|
61
|
-
selectItem: (id: string) => any;
|
|
62
|
-
"click:workspace": () => any;
|
|
63
29
|
}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
|
|
64
|
-
"onCreate:workspace"?: (() => any) | undefined;
|
|
65
|
-
"onSelect:workspace"?: ((id?: string | undefined) => any) | undefined;
|
|
66
|
-
onSelectItem?: ((id: string) => any) | undefined;
|
|
67
30
|
"onUpdate:sidebarWidth"?: ((value: number) => any) | undefined;
|
|
68
|
-
"onClick:workspace"?: (() => any) | undefined;
|
|
69
|
-
"onUpdate:isSidebarOpen"?: ((value: boolean) => any) | undefined;
|
|
70
31
|
}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
71
32
|
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
72
33
|
declare const _default: typeof __VLS_export;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AppSidebar.vue.d.ts","sourceRoot":"","sources":["../../../../../src/v2/features/app/components/AppSidebar.vue"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"AppSidebar.vue.d.ts","sourceRoot":"","sources":["../../../../../src/v2/features/app/components/AppSidebar.vue"],"names":[],"mappings":"AAorBA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,oCAAoC,CAAA;AAwClE,OAAO,EAEL,KAAK,sBAAsB,EAE5B,MAAM,+CAA+C,CAAA;AAGtD,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,0BAA0B,CAAA;AAE1E,KAAK,WAAW,GAAG;IACjB,6CAA6C;IAC7C,GAAG,EAAE,QAAQ,CAAA;IACb,oEAAoE;IACpE,MAAM,CAAC,EAAE,MAAM,CAAA;IACf;;;;OAIG;IACH,iBAAiB,CAAC,EAAE,sBAAsB,CAAA;IAC1C,8CAA8C;IAC9C,qBAAqB,CAAC,EAAE,0BAA0B,CAAA;CACnD,CAAC;AAmVF,KAAK,gBAAgB,GAAG;IACxB,wCAAwC;IACxC,cAAc,EAAE,MAAM,CAAC;CACtB,CAAC;AAKF,KAAK,iBAAiB,GAAG,WAAW,GAAG,gBAAgB,CAAC;AAyzBxD,QAAA,IAAI,SAAS,IAAa,CAAE;AAC5B,KAAK,WAAW,GAAG,EAAE,GACnB;IAAE,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,SAAS,KAAK,GAAG,CAAA;CAAE,CAAC;AAKhD,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"}
|
|
@@ -2,7 +2,7 @@ import _plugin_vue_export_helper_default from "../../../../_virtual/_plugin-vue_
|
|
|
2
2
|
import AppSidebar_vue_vue_type_script_setup_true_lang_default from "./AppSidebar.vue.script.js";
|
|
3
3
|
/* empty css */
|
|
4
4
|
//#region src/v2/features/app/components/AppSidebar.vue
|
|
5
|
-
var AppSidebar_default = /* @__PURE__ */ _plugin_vue_export_helper_default(AppSidebar_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-
|
|
5
|
+
var AppSidebar_default = /* @__PURE__ */ _plugin_vue_export_helper_default(AppSidebar_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-e803152c"]]);
|
|
6
6
|
//#endregion
|
|
7
7
|
export { AppSidebar_default as default };
|
|
8
8
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AppSidebar.vue.js","names":[],"sources":["../../../../../src/v2/features/app/components/AppSidebar.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport {\n ScalarButton,\n ScalarIconButton,\n ScalarModal,\n ScalarSidebarItem,\n useModal,\n type WorkspaceGroup,\n} from '@scalar/components'\nimport { isMacOS } from '@scalar/helpers/general/is-mac-os'\nimport {\n ScalarIconDotsThree,\n ScalarIconGearSix,\n ScalarIconPlus,\n} from '@scalar/icons'\nimport { LibraryIcon } from '@scalar/icons/library'\nimport type { DraggingItem, HoveredItem, SidebarState } from '@scalar/sidebar'\nimport type { WorkspaceStore } from '@scalar/workspace-store/client'\nimport type { WorkspaceEventBus } from '@scalar/workspace-store/events'\nimport { getParentEntry } from '@scalar/workspace-store/navigation'\nimport type {\n TraversedEntry,\n TraversedOperation,\n} from '@scalar/workspace-store/schemas/navigation'\nimport { capitalize, computed, nextTick, ref } from 'vue'\n\nimport Rabbit from '@/assets/rabbit.ascii?raw'\nimport RabbitJump from '@/assets/rabbitjump.ascii?raw'\nimport ScalarAsciiArt from '@/components/ScalarAsciiArt.vue'\nimport DeleteSidebarListElement from '@/components/Sidebar/Actions/DeleteSidebarListElement.vue'\nimport { Sidebar } from '@/v2/components/sidebar'\nimport DownloadAppButton from '@/v2/features/app/components/DownloadAppButton.vue'\nimport SidebarItemMenu from '@/v2/features/app/components/SidebarItemMenu.vue'\nimport { createTempOperation } from '@/v2/features/app/helpers/create-temp-operation'\nimport { dragHandleFactory } from '@/v2/helpers/drag-handle-factory'\nimport type { ClientLayout } from '@/v2/types/layout'\n\nconst { sidebarState, layout, activeWorkspace, workspaces, store, eventBus } =\n defineProps<{\n /**\n * The current layout of the app (e.g., 'desktop', 'web')\n */\n layout: ClientLayout\n\n /**\n * The sidebar state, holding navigation items and state\n */\n sidebarState: SidebarState<TraversedEntry>\n\n /**\n * Whether the workspace overview sidebar is currently open\n */\n isWorkspaceOpen?: boolean\n /**\n * The currently active workspace.\n * This represents the workspace that the user is currently working in.\n */\n activeWorkspace: { id: string; label: string }\n /**\n * The list of all available workspaces.\n * Used to render options for workspace switching and selection.\n */\n workspaces: WorkspaceGroup[]\n /**\n * The workspace event bus for handling workspace-level events.\n * Used for triggering and responding to workspace changes and actions.\n */\n eventBus: WorkspaceEventBus\n /**\n * The WorkspaceStore instance for managing workspace state and actions.\n * Provides methods and state for interacting with the current workspace.\n */\n store: WorkspaceStore\n }>()\n\nconst emit = defineEmits<{\n /** Emitted when the workspace button in the sidebar is clicked */\n (e: 'click:workspace'): void\n /** Emitted when a navigation or sidebar item is selected by ID */\n (e: 'selectItem', id: string): void\n /** Emitted when a workspace is selected by optional ID */\n (e: 'select:workspace', id?: string): void\n /** Emitted when the user requests to create a new workspace */\n (e: 'create:workspace'): void\n}>()\n\ndefineSlots<{\n /** Slot for customizing the actions section of the sidebar menu. */\n sidebarMenuActions?(): unknown\n}>()\n\n/** The label for the workspace button in the sidebar */\nconst workspaceLabel = computed(() => capitalize(activeWorkspace.label))\n\n/** Controls the visibility of the sidebar */\nconst isSidebarOpen = defineModel<boolean>('isSidebarOpen', {\n required: true,\n})\n\n/** Controls the width of the sidebar */\nconst sidebarWidth = defineModel<number>('sidebarWidth', {\n required: true,\n default: 288,\n})\n\n/** Calculate if we should show the getting started section */\nconst showGettingStarted = computed(() => sidebarState.items.value.length <= 1)\n\n/*\n * Setup drag and drop handlers for sidebar items.\n * The dragHandleFactory takes the current workspace store and sidebar state,\n * and returns the appropriate handlers for drag ending and droppability.\n *\n * We use computed to ensure the handlers are recreated when the store or sidebarState changes,\n * so they always have access to the latest values.\n */\nconst dragHandlers = computed(() =>\n dragHandleFactory({\n store,\n sidebarState,\n }),\n)\n\nconst handleDragEnd = (\n draggingItem: DraggingItem,\n hoveredItem: HoveredItem,\n): boolean => {\n return dragHandlers.value.handleDragEnd(draggingItem, hoveredItem)\n}\n\nconst isDroppable = (\n draggingItem: DraggingItem,\n hoveredItem: HoveredItem,\n): boolean => {\n return dragHandlers.value.isDroppable(draggingItem, hoveredItem)\n}\n\n/** The current target for the dropdown menu */\nconst menuTarget = ref<{\n /** The sidebar item that the menu is targeting */\n item: TraversedEntry\n /** A reference to the element that the menu is for */\n el: HTMLElement\n /** Whether or not to show the menu */\n showMenu: boolean\n} | null>(null)\n\nconst deleteModalState = useModal()\n\n/** Computes the message for the delete modal */\nconst deleteMessage = computed(() => {\n const item = menuTarget.value?.item\n\n if (item?.type === 'document') {\n return \"This cannot be undone. You're about to delete the document and all tags and operations inside it.\"\n }\n\n return `Are you sure you want to delete this ${item?.type ?? 'item'}? This action cannot be undone.`\n})\n\n/** Deletes an item from the sidebar by emitting the appropriate event */\nconst handleDelete = () => {\n const item = menuTarget.value?.item\n\n if (!item) {\n return\n }\n\n const result = sidebarState.getEntryById(item.id)\n\n const document = getParentEntry('document', result)\n const operation = getParentEntry('operation', result)\n\n if (!document) {\n return\n }\n\n if (item.type === 'document') {\n eventBus.emit('document:delete:document', { name: document.name })\n } else if (item.type === 'tag') {\n eventBus.emit('tag:delete:tag', {\n documentName: document.name,\n name: item.name,\n })\n } else if (item.type === 'operation') {\n if (!operation) {\n return\n }\n\n eventBus.emit('operation:delete:operation', {\n meta: {\n method: operation.method,\n path: operation.path,\n },\n documentName: document.name,\n })\n } else if (item.type === 'example') {\n if (!operation) {\n return\n }\n\n eventBus.emit('operation:delete:example', {\n meta: {\n method: operation.method,\n path: operation.path,\n exampleKey: item.name,\n },\n documentName: document.name,\n })\n }\n\n /** Clean up after deletion */\n deleteModalState.hide()\n menuTarget.value = null\n}\n\n/** Opens the dropdown menu for the given item */\nconst openMenu = async (\n event: MouseEvent | KeyboardEvent,\n item: TraversedEntry,\n) => {\n if (menuTarget.value?.showMenu) {\n return\n }\n\n const el = event.currentTarget as HTMLElement\n menuTarget.value = { item, el, showMenu: true }\n\n // Wait for the target to bind to the element\n await nextTick()\n\n // Re-dispatch the event on the target to open the menu\n const cloned =\n event instanceof MouseEvent\n ? new MouseEvent(event.type, event)\n : new KeyboardEvent(event.type, event)\n\n menuTarget.value?.el.dispatchEvent(cloned)\n}\n\n/** Closes the dropdown menu */\nconst closeMenu = () => {\n if (menuTarget.value) {\n menuTarget.value.showMenu = false\n }\n}\n\n/**\n * Creates a new operation directly from the empty folder slot.\n * Uses a unique temporary path to avoid conflicts, then navigates to the operation,\n * updates the path to `/`, and focuses the address bar so the user can immediately start typing.\n */\nconst handleAddEmptyFolder = (item: TraversedEntry) => {\n const itemWithParent = sidebarState.getEntryById(item.id)\n const documentName = getParentEntry('document', itemWithParent)?.name\n const tagName = getParentEntry('tag', itemWithParent)?.name\n\n if (!documentName) {\n console.error('Document name not found')\n return\n }\n createTempOperation(documentName, {\n existingPaths: new Set(\n Object.keys(store.workspace.documents[documentName]?.paths ?? {}),\n ),\n eventBus,\n tags: tagName ? [tagName] : undefined,\n })\n}\n\n/**\n * Navigates to the operations page for the provided operation item.\n * Emits a navigation event for the operation overview page.\n */\nconst navigateToOperationsPage = (item: TraversedOperation) => {\n const operationWithParent = sidebarState.getEntryById(item.id)\n const documentSlug = getParentEntry('document', operationWithParent)?.name\n\n eventBus.emit('ui:navigate', {\n page: 'operation',\n path: 'overview',\n operationPath: item.path,\n method: item.method,\n documentSlug: documentSlug,\n })\n}\n</script>\n\n<template>\n <div class=\"flex\">\n <Sidebar\n v-model:sidebarWidth=\"sidebarWidth\"\n :activeWorkspace=\"activeWorkspace\"\n :class=\"[\n 'max-md:inset-y-0 max-md:z-2 max-md:w-full!',\n isSidebarOpen ? 'max-md:absolute! max-md:flex!' : 'max-md:hidden!',\n ]\"\n :documents=\"Object.values(store.workspace.documents)\"\n :isDroppable=\"isDroppable\"\n :layout=\"layout\"\n :sidebarState=\"sidebarState\"\n :workspaces=\"workspaces\"\n @create:workspace=\"emit('create:workspace')\"\n @navigate:to:settings=\"\n eventBus.emit('ui:navigate', { page: 'workspace', path: 'settings' })\n \"\n @reorder=\"\n (draggingItem, hoveredItem) => handleDragEnd(draggingItem, hoveredItem)\n \"\n @select:workspace=\"(id) => emit('select:workspace', id)\"\n @selectItem=\"(id) => emit('selectItem', id)\">\n <template #sidebarMenuActions>\n <slot name=\"sidebarMenuActions\" />\n </template>\n <!-- Workspace Identifier -->\n <template #workspaceButton>\n <ScalarSidebarItem\n is=\"button\"\n :active=\"isWorkspaceOpen\"\n @click=\"emit('click:workspace')\">\n {{ workspaceLabel }}\n </ScalarSidebarItem>\n </template>\n\n <!-- Decorator dropdown menu -->\n <template #decorator=\"{ item }\">\n <div class=\"flex items-center gap-0.5\">\n <ScalarIconButton\n v-if=\"item.type === 'operation'\"\n :icon=\"ScalarIconGearSix\"\n label=\"Operation settings\"\n size=\"sm\"\n weight=\"bold\"\n @click.stop=\"navigateToOperationsPage(item)\"\n @keydown.enter.stop=\"navigateToOperationsPage(item)\"\n @keydown.space.stop=\"navigateToOperationsPage(item)\" />\n <ScalarIconButton\n aria-expanded=\"false\"\n aria-haspopup=\"menu\"\n :icon=\"ScalarIconDotsThree\"\n label=\"More options\"\n size=\"sm\"\n weight=\"bold\"\n @click.stop=\"(e: MouseEvent) => openMenu(e, item)\"\n @keydown.down.stop=\"(e: KeyboardEvent) => openMenu(e, item)\"\n @keydown.enter.stop=\"(e: KeyboardEvent) => openMenu(e, item)\"\n @keydown.space.stop=\"(e: KeyboardEvent) => openMenu(e, item)\"\n @keydown.up.stop=\"(e: KeyboardEvent) => openMenu(e, item)\" />\n </div>\n </template>\n\n <!-- Dirty document icon slot -->\n <template #icon=\"{ item }\">\n <template\n v-if=\"\n item.type === 'document' &&\n store.workspace.documents[item.name]?.['x-scalar-is-dirty'] === true\n \">\n <div class=\"relative flex items-center\">\n <LibraryIcon\n class=\"block\"\n :src=\"\n ('icon' in item && item.icon) || 'interface-content-folder'\n \" />\n <div\n class=\"bg-c-accent absolute -top-0.5 -right-0.5 size-1.5 rounded-full\">\n <span class=\"sr-only\">Unsaved changes</span>\n </div>\n </div>\n </template>\n </template>\n\n <!-- Empty folder slot -->\n <template #empty=\"{ item }\">\n <ScalarSidebarItem\n is=\"button\"\n @click=\"handleAddEmptyFolder(item)\">\n <template #icon>\n <ScalarIconPlus />\n </template>\n <template #default>Add operation</template>\n </ScalarSidebarItem>\n </template>\n\n <!-- Getting started section -->\n <template\n v-if=\"layout !== 'modal'\"\n #footer>\n <div\n :class=\"{\n 'empty-sidebar-item border-t': showGettingStarted,\n }\">\n <div\n v-if=\"showGettingStarted\"\n class=\"empty-sidebar-item-content overflow-hidden px-2.5 py-2.5\">\n <div class=\"rabbit-ascii relative m-auto mt-2 h-[68px] w-[60px]\">\n <ScalarAsciiArt\n :art=\"Rabbit\"\n class=\"rabbitsit font-bold\" />\n <ScalarAsciiArt\n :art=\"RabbitJump\"\n class=\"rabbitjump absolute top-0 left-0 font-bold\" />\n </div>\n <div class=\"mt-2 mb-2 text-center text-sm text-balance\">\n <b class=\"font-medium\">Let's Get Started</b>\n <p class=\"mt-2 leading-5\">\n Create request, folder, collection or import from\n OpenAPI/Postman\n </p>\n </div>\n </div>\n\n <div class=\"flex flex-col gap-1.5 p-2\">\n <ScalarButton\n v-if=\"showGettingStarted\"\n class=\"w-full\"\n size=\"sm\"\n @click=\"\n eventBus.emit('ui:open:command-palette', {\n action: 'import-from-openapi-swagger-postman-curl',\n payload: undefined,\n })\n \">\n Import Collection\n </ScalarButton>\n\n <ScalarButton\n class=\"w-full\"\n hotkey=\"K\"\n size=\"sm\"\n variant=\"outlined\"\n @click=\"eventBus.emit('ui:open:command-palette')\">\n Add Item \n\n <span\n class=\"text-sidebar-c-2 rounded border px-1.25 py-1 text-xs leading-none font-medium uppercase\">\n <template v-if=\"isMacOS()\">\n <span class=\"sr-only\">Command</span>\n <span aria-hidden=\"true\">⌘</span>\n </template>\n <template v-else>\n <span class=\"sr-only\">CTRL</span>\n <span aria-hidden=\"true\">⌃</span>\n </template>\n K\n </span>\n </ScalarButton>\n <DownloadAppButton v-if=\"layout === 'web'\" />\n </div>\n </div>\n </template>\n </Sidebar>\n <SidebarItemMenu\n v-if=\"menuTarget?.showMenu\"\n :eventBus=\"eventBus\"\n :item=\"menuTarget.item\"\n :sidebarState=\"sidebarState\"\n :target=\"menuTarget.el\"\n :workspaceStore=\"store\"\n @closeMenu=\"closeMenu\"\n @showDeleteModal=\"deleteModalState.show()\" />\n\n <!-- Delete Modal -->\n <ScalarModal\n v-if=\"menuTarget\"\n size=\"xxs\"\n :state=\"deleteModalState\"\n :title=\"`Delete ${menuTarget.item.title}`\">\n <DeleteSidebarListElement\n :variableName=\"menuTarget.item.title\"\n :warningMessage=\"deleteMessage\"\n @close=\"deleteModalState.hide()\"\n @delete=\"handleDelete\" />\n </ScalarModal>\n </div>\n</template>\n\n<style scoped>\n.empty-sidebar-item-content {\n display: none;\n}\n.empty-sidebar-item .empty-sidebar-item-content {\n display: block;\n}\n.rabbitjump {\n opacity: 0;\n}\n.empty-sidebar-item:hover .rabbitjump {\n opacity: 1;\n animation: rabbitAnimation 0.5s steps(1) infinite;\n}\n.empty-sidebar-item:hover .rabbitsit {\n opacity: 0;\n animation: rabbitAnimation2 0.5s steps(1) infinite;\n}\n.empty-sidebar-item:hover .rabbit-ascii {\n animation: rabbitRun 8s infinite linear;\n}\n@keyframes rabbitRun {\n 0% {\n transform: translate3d(0, 0, 0);\n }\n 25% {\n transform: translate3d(250px, 0, 0);\n }\n 25.01% {\n transform: translate3d(-250px, 0, 0);\n }\n 75% {\n transform: translate3d(250px, 0, 0);\n }\n 75.01% {\n transform: translate3d(-250px, 0, 0);\n }\n 100% {\n transform: translate3d(0, 0, 0);\n }\n}\n@keyframes rabbitAnimation {\n 0%,\n 100% {\n opacity: 1;\n }\n 50% {\n opacity: 0;\n }\n}\n@keyframes rabbitAnimation2 {\n 0%,\n 100% {\n opacity: 0;\n }\n 50% {\n opacity: 1;\n transform: translate3d(0, -8px, 0);\n }\n}\n</style>\n"],"mappings":""}
|
|
1
|
+
{"version":3,"file":"AppSidebar.vue.js","names":[],"sources":["../../../../../src/v2/features/app/components/AppSidebar.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { AppState } from '@scalar/api-client/v2/features/app'\nimport {\n ScalarIconButton,\n ScalarModal,\n ScalarSidebar,\n ScalarSidebarButton,\n ScalarSidebarItem,\n ScalarSidebarItems,\n ScalarSidebarNestedItems,\n ScalarSidebarSearchInput,\n ScalarSidebarSection,\n useModal,\n} from '@scalar/components'\nimport {\n ScalarIconCaretLeft,\n ScalarIconDotsThree,\n ScalarIconFolderDashed,\n ScalarIconFunnel,\n ScalarIconGearSix,\n ScalarIconMagnifyingGlass,\n ScalarIconPlus,\n} from '@scalar/icons'\nimport {\n filterItems,\n SidebarItem,\n type DraggingItem,\n type HoveredItem,\n} from '@scalar/sidebar'\nimport { useToasts } from '@scalar/use-toasts'\nimport { getParentEntry } from '@scalar/workspace-store/navigation'\nimport type { TraversedEntry } from '@scalar/workspace-store/schemas/navigation'\nimport { computed, onBeforeMount, onBeforeUnmount, ref } from 'vue'\n\nimport DeleteSidebarListElement from '@/components/Sidebar/Actions/DeleteSidebarListElement.vue'\nimport { Resize } from '@/v2/components/resize'\nimport SidebarItemMenu from '@/v2/features/app/components/SidebarItemMenu.vue'\nimport { createTempOperation } from '@/v2/features/app/helpers/create-temp-operation'\nimport { loadRegistryDocument } from '@/v2/features/app/helpers/load-registry-document'\nimport { useDocumentFilter } from '@/v2/features/app/hooks/use-document-filter'\nimport { useSidebarContextMenu } from '@/v2/features/app/hooks/use-sidebar-context-menu'\nimport {\n useSidebarDocuments,\n type RegistryDocumentsState,\n type SidebarDocumentItem,\n} from '@/v2/features/app/hooks/use-sidebar-documents'\nimport { DocumentSearchModal } from '@/v2/features/search'\nimport { dragHandleFactory } from '@/v2/helpers/drag-handle-factory'\nimport type { ImportDocumentFromRegistry } from '@/v2/types/configuration'\n\nconst {\n app,\n indent = 20,\n registryDocuments = { status: 'success', documents: [] },\n fetchRegistryDocument,\n} = defineProps<{\n /** The app state from @scalar/api-client. */\n app: AppState\n /** Horizontal indent applied to nested sidebar items, in pixels. */\n indent?: number\n /**\n * The list of all available registry documents, wrapped in a loading state\n * so the sidebar can render skeleton placeholders while the registry is\n * still being fetched.\n */\n registryDocuments?: RegistryDocumentsState\n /** A function to fetch a registry document */\n fetchRegistryDocument?: ImportDocumentFromRegistry\n}>()\n\nconst { toast } = useToasts()\n\n/**\n * Whether the caller is still fetching the list of registry documents. We\n * only surface the loading state on team workspaces because local workspaces\n * never consult the registry\n */\nconst isLoadingRegistry = computed(\n () =>\n registryDocuments.status === 'loading' &&\n app.workspace.isTeamWorkspace.value,\n)\n\nconst { rest } = useSidebarDocuments({\n app,\n managedDocs: () => registryDocuments.documents ?? [],\n})\n\n/**\n * Whether the workspace truly has no documents to show. Distinct from the\n * filter producing no results: we only surface the \"No APIs yet\" empty state\n * when the workspace is genuinely empty so users see a clear call-to-action\n * instead of a confusing blank space.\n */\nconst isEmpty = computed(\n () => !isLoadingRegistry.value && rest.value.length === 0,\n)\n\n/**\n * Fuzzy filter over the top-level documents. Owns its own input visibility,\n * query string and Fuse index. See `use-document-filter.ts` for details.\n */\nconst {\n isVisible: isFilterVisible,\n query: filterQuery,\n filteredItems: filteredRest,\n toggle: toggleFilter,\n} = useDocumentFilter(rest)\n\nconst sidebarState = app.sidebar.state\n\n/** Which registry documents are currently being fetched. */\nconst loadingKeys = ref<Record<string, boolean>>({})\n\n/**\n * Check if the given {@link SidebarDocumentItem} is the currently active document (from the sidebar state).\n */\nconst isDocActive = (item: SidebarDocumentItem) => {\n if (!item.navigation) {\n return false\n }\n\n return (\n sidebarState.selectedItem.value === item.navigation.id ||\n Boolean(sidebarState.selectedItems.value[item.navigation.id])\n )\n}\n\nconst handleDocumentClick = async (item: SidebarDocumentItem) => {\n if (item.navigation) {\n app.sidebar.handleSelectItem(item.navigation.id)\n return\n }\n\n if (!item.registry || !app.store.value) {\n console.warn('Document does not have a sidebar navigation, skipping...')\n return\n }\n\n if (!fetchRegistryDocument) {\n console.warn(\n 'You need to provide a fetchRegistryDocument function to load registry documents',\n )\n return\n }\n\n if (loadingKeys.value[item.key]) {\n return\n }\n\n loadingKeys.value[item.key] = true\n\n const result = await loadRegistryDocument({\n fetcher: fetchRegistryDocument,\n workspaceStore: app.store.value,\n namespace: item.registry.namespace,\n slug: item.registry.slug,\n })\n\n loadingKeys.value[item.key] = false\n\n if (!result.ok) {\n toast(result.error, 'error')\n return\n }\n\n // After loading, route to the document overview. `syncSidebar` will then\n // mark the document as selected and the template's `:open=\"isDocActive\"`\n // binding drills the sidebar in automatically — no local state needed.\n app.eventBus.emit('ui:navigate', {\n page: 'document',\n path: 'overview',\n documentSlug: result.documentName,\n })\n}\n\nconst isSelected = (id: string) => sidebarState.isSelected(id)\nconst isExpanded = (id: string) => sidebarState.isExpanded(id)\n\nconst handleSelectItem = (id: string) => {\n app.sidebar.handleSelectItem(id)\n}\n\nconst handleToggleGroup = (id: string) => {\n sidebarState.setExpanded(id, !sidebarState.isExpanded(id))\n}\n\n/**\n * Drag-and-drop handlers for sidebar items. The factory reads from the live\n * workspace store and shared sidebar state, so it reflects the latest\n * navigation tree on every drag. Mirrors the behaviour of the old\n * `AppSidebar.vue` (documents, tags, and operations can be reordered, and\n * operations can be moved between tags/documents).\n */\nconst dragHandlers = computed(() =>\n dragHandleFactory({\n store: app.store,\n sidebarState,\n }),\n)\n\nconst handleDragEnd = (\n draggingItem: DraggingItem,\n hoveredItem: HoveredItem,\n): boolean => dragHandlers.value.handleDragEnd(draggingItem, hoveredItem)\n\nconst isDroppable = (\n draggingItem: DraggingItem,\n hoveredItem: HoveredItem,\n): boolean => dragHandlers.value.isDroppable(draggingItem, hoveredItem)\n\n/**\n * Contextual \"more\" dropdown for tags, operations and examples, together\n * with the shared delete-confirmation modal it triggers.\n */\nconst {\n menuTarget,\n deleteModalState,\n deleteMessage,\n openMenu,\n closeMenu,\n handleDelete,\n} = useSidebarContextMenu({\n eventBus: app.eventBus,\n sidebarState,\n})\n\n/**\n * Create a new operation from an empty folder slot inside a tag or document.\n * If the entry is a tag, the new operation inherits that tag so it stays\n * grouped under the same folder.\n */\nconst handleAddEmptyFolder = (item: TraversedEntry) => {\n const itemWithParent = sidebarState.getEntryById(item.id)\n const documentName = getParentEntry('document', itemWithParent)?.name\n const tagName = getParentEntry('tag', itemWithParent)?.name\n const store = app.store.value\n\n if (!documentName || !store) {\n console.error('Document name not found')\n return\n }\n\n createTempOperation(documentName, {\n existingPaths: new Set(\n Object.keys(store.workspace.documents[documentName]?.paths ?? {}),\n ),\n eventBus: app.eventBus,\n tags: tagName ? [tagName] : undefined,\n })\n}\n\nconst handleCreate = () => {\n app.eventBus.emit('ui:open:command-palette', {\n action: 'create-openapi-document',\n payload: undefined,\n })\n}\n\n/**\n * Create a new operation inside the given document and immediately navigate to\n * it. Uses `createTempOperation` so the operation gets a unique `/temp…` path,\n * then the sidebar focuses the new example and the address bar is focused so\n * the user can start typing the real path right away.\n */\nconst handleCreateOperation = (item: SidebarDocumentItem) => {\n const documentName = item.documentName\n const store = app.store.value\n\n if (!documentName || !store) {\n console.warn('Cannot create an operation: no document loaded')\n return\n }\n\n createTempOperation(documentName, {\n existingPaths: new Set(\n Object.keys(store.workspace.documents[documentName]?.paths ?? {}),\n ),\n eventBus: app.eventBus,\n })\n}\n\n/**\n * Navigates back to the workspace \"Get started\" page.\n */\nconst handleBack = () => {\n app.eventBus.emit('ui:navigate', {\n page: 'workspace',\n path: 'get-started',\n })\n}\n\n/**\n * True when the user is currently viewing a document (any of its subpages).\n * When inside a document, the sidebar actions are scoped to that document:\n * the gear icon opens the document (collection) settings and the filter icon\n * becomes a search icon that focuses the search input.\n */\nconst isOnDocumentPage = computed(() =>\n Boolean(app.activeEntities.documentSlug.value),\n)\n\nconst handleOpenSettings = () => {\n if (isOnDocumentPage.value) {\n app.eventBus.emit('ui:navigate', {\n page: 'document',\n path: 'settings',\n documentSlug: app.activeEntities.documentSlug.value,\n })\n return\n }\n\n app.eventBus.emit('ui:navigate', {\n page: 'workspace',\n path: 'settings',\n })\n}\n\n/**\n * Controls the per-document search modal. Only used when the user is drilled\n * into a single document and clicks the magnifying-glass icon.\n */\nconst searchModal = useModal()\n\n/**\n * The OpenAPI document currently selected in the workspace. The search modal\n * scopes its Fuse index to this document so results never leak across\n * collections.\n */\nconst activeDocument = computed(() => app.store.value?.workspace.activeDocument)\n\nconst handleFilterOrSearch = () => {\n // Inside a document, this icon opens a modal search that is scoped to that\n // single document (similar to the reference search modal), so users can jump\n // to any operation / tag / heading without noise from other documents.\n if (isOnDocumentPage.value) {\n searchModal.show()\n return\n }\n\n // At the top-level documents view, the icon toggles a lightweight filter\n // that narrows the visible documents by title.\n toggleFilter()\n}\n\n/**\n * Handle the `ui:focus:search` event. Dispatch is driven by the shared\n * `handleHotkeys` helper (Cmd/Ctrl+J) or by programmatic callers such as the\n * workspace \"Get started\" page. When a `KeyboardEvent` is included we\n * preventDefault to override the browser's Cmd+J (downloads panel), then\n * delegate to `handleFilterOrSearch`, which already branches on whether the\n * user is viewing a document or the workspace root.\n */\nconst handleSearchHotkey = (payload: { event: KeyboardEvent } | undefined) => {\n payload?.event.preventDefault()\n handleFilterOrSearch()\n}\n\n/**\n * Handle the `ui:open:settings` event (Cmd/Ctrl+I). Same delegation model as\n * `handleSearchHotkey`: preventDefault on the originating keyboard event (if\n * any) and hand off to `handleOpenSettings`, which routes to the document-\n * level settings page when a document is active and the workspace-level\n * settings page otherwise.\n */\nconst handleSettingsHotkey = (\n payload: { event: KeyboardEvent } | undefined,\n) => {\n payload?.event.preventDefault()\n handleOpenSettings()\n}\n\nonBeforeMount(() => {\n app.eventBus.on('ui:focus:search', handleSearchHotkey)\n app.eventBus.on('ui:open:settings', handleSettingsHotkey)\n})\nonBeforeUnmount(() => {\n app.eventBus.off('ui:focus:search', handleSearchHotkey)\n app.eventBus.off('ui:open:settings', handleSettingsHotkey)\n})\n\n/**\n * Navigate to the selected search result. `scroll-to:nav-item` is already\n * wired up through the app event bus to update the sidebar + route, matching\n * the behaviour used elsewhere in the app.\n */\nconst handleSearchSelect = (id: string) => {\n app.eventBus.emit('scroll-to:nav-item', { id })\n}\n\n/** Controls the width of the sidebar */\nconst sidebarWidth = defineModel<number>('sidebarWidth', {\n required: true,\n default: 288,\n})\n</script>\n\n<template>\n <Resize\n v-model:width=\"sidebarWidth\"\n class=\"flex flex-col max-md:inset-y-0 max-md:z-2 max-md:w-full!\"\n :class=\"{\n 'max-md:absolute! max-md:flex!': app.sidebar.isOpen.value,\n 'max-md:hidden!': !app.sidebar.isOpen.value,\n }\">\n <template #default>\n <div class=\"flex flex-1\">\n <ScalarSidebar\n class=\"flex min-h-0 flex-1 flex-col max-md:pt-12\"\n :style=\"{ '--scalar-sidebar-indent': indent + 'px' }\">\n <!-- Top-level sidebar header -->\n <div\n v-if=\"!isOnDocumentPage\"\n class=\"flex flex-col gap-1.5 p-(--scalar-sidebar-padding)\">\n <div class=\"flex items-center gap-1\">\n <ScalarSidebarButton\n is=\"div\"\n class=\"text-sidebar-c-1 font-sidebar-active flex-1\"\n disabled>\n All Documents\n </ScalarSidebarButton>\n <ScalarIconButton\n :icon=\"ScalarIconGearSix\"\n label=\"Workspace settings\"\n size=\"sm\"\n @click=\"handleOpenSettings\" />\n <ScalarIconButton\n :icon=\"ScalarIconFunnel\"\n label=\"Filter documents\"\n size=\"sm\"\n @click=\"handleFilterOrSearch\" />\n <ScalarIconButton\n class=\"rounded-full border\"\n :icon=\"ScalarIconPlus\"\n label=\"Add document\"\n size=\"sm\"\n @click=\"handleCreate\" />\n </div>\n <ScalarSidebarSearchInput\n v-if=\"isFilterVisible\"\n v-model=\"filterQuery\"\n autofocus />\n </div>\n\n <!-- Document list (top-level) -->\n <div class=\"custom-scroll flex flex-1 flex-col\">\n <!--\n Empty state: no documents in the workspace yet. Matches the\n minimal `empty folder` appearance.\n -->\n <div\n v-if=\"isEmpty && !isOnDocumentPage\"\n class=\"text-c-3 flex flex-1 flex-col items-center justify-center gap-2 p-6 text-center select-none\">\n <ScalarIconFolderDashed\n class=\"size-10\"\n weight=\"light\" />\n <p class=\"text-sm font-medium\">No APIs yet</p>\n </div>\n <ScalarSidebarItems v-else>\n <!-- Show pinned documents after we add support for it -->\n <!-- <ScalarSidebarSection v-if=\"pinned.length\">\n Pinned\n <template #items>\n <ScalarSidebarNestedItems\n v-for=\"item in pinned\"\n :key=\"item.key\"\n :active=\"isDocActive(item)\"\n controlled\n :open=\"Boolean(openKeys[item.key])\"\n @back=\"openKeys[item.key] = false\"\n @click=\"handleDocumentClick(item)\">\n <span class=\"truncate\">{{ item.title }}</span>\n <template #back-label>{{ item.title }}</template>\n <template #items>\n <SidebarItem\n v-for=\"child in filterItems(item.navigation?.children ?? [])\"\n :key=\"child.id\"\n :isDraggable=\"false\"\n :isDroppable=\"isDroppable\"\n :isExpanded=\"isExpanded\"\n :isSelected=\"isSelected\"\n :item=\"child\"\n layout=\"client\"\n @selectItem=\"handleSelectItem\"\n @toggleGroup=\"handleToggleGroup\" />\n </template>\n </ScalarSidebarNestedItems>\n </template>\n </ScalarSidebarSection> -->\n\n <ScalarSidebarSection>\n All documents\n <template #items>\n <!--\n Skeleton rows shown while the caller is still fetching\n the registry document list. We only render skeletons in\n the top-level view (when no document is drilled-in) so\n the collection view is never masked by placeholders.\n -->\n <template v-if=\"isLoadingRegistry && !isOnDocumentPage\">\n <li\n v-for=\"n in 4\"\n :key=\"`registry-skeleton-${n}`\"\n aria-hidden=\"true\"\n class=\"sidebar-skeleton-row px-(--scalar-sidebar-padding) py-1\">\n <span class=\"bg-b-3 block h-6 rounded-md\" />\n </li>\n </template>\n <ScalarSidebarNestedItems\n v-for=\"item in filteredRest\"\n :key=\"item.key\"\n :active=\"isDocActive(item)\"\n controlled\n :open=\"isDocActive(item)\"\n @back=\"handleBack\"\n @click=\"handleDocumentClick(item)\">\n <span>{{ item.title }}</span>\n <template\n v-if=\"loadingKeys[item.key]\"\n #aside>\n <span class=\"text-c-3 text-xs\">Loading…</span>\n </template>\n <!-- Document back row -->\n <template #back>\n <div class=\"flex items-center gap-1\">\n <ScalarSidebarButton\n is=\"button\"\n class=\"text-sidebar-c-1 font-sidebar-active hover:text-sidebar-c-1 flex-1\"\n @click=\"handleBack\">\n <template #icon>\n <ScalarIconCaretLeft\n class=\"text-sidebar-c-2 -m-px size-4\" />\n </template>\n Back\n </ScalarSidebarButton>\n <ScalarIconButton\n :icon=\"ScalarIconGearSix\"\n label=\"Collection settings\"\n size=\"sm\"\n @click=\"handleOpenSettings\" />\n <ScalarIconButton\n :icon=\"ScalarIconMagnifyingGlass\"\n label=\"Search collection\"\n size=\"sm\"\n @click=\"handleFilterOrSearch\" />\n <ScalarIconButton\n class=\"rounded-full border\"\n :icon=\"ScalarIconPlus\"\n label=\"Add operation\"\n size=\"sm\"\n @click=\"handleCreateOperation(item)\" />\n </div>\n </template>\n <!-- Document items (operations, tags, examples) -->\n <template #items>\n <template v-if=\"item.navigation?.children?.length\">\n <SidebarItem\n v-for=\"child in filterItems(\n 'client',\n item.navigation.children,\n )\"\n :key=\"child.id\"\n :isDroppable=\"isDroppable\"\n :isExpanded=\"isExpanded\"\n :isSelected=\"isSelected\"\n :item=\"child\"\n layout=\"client\"\n @onDragEnd=\"handleDragEnd\"\n @selectItem=\"handleSelectItem\"\n @toggleGroup=\"handleToggleGroup\">\n <!--\n Per-item \"more\" dropdown for tags, operations and\n examples (add / edit / delete…). The dropdown is\n rendered once at the sidebar root and anchors\n itself to whichever icon button opened it.\n Operation settings live on the operation header\n (next to the environment selector), not here.\n -->\n <template #decorator=\"{ item: entry }\">\n <ScalarIconButton\n aria-expanded=\"false\"\n aria-haspopup=\"menu\"\n class=\"bg-b-2\"\n :icon=\"ScalarIconDotsThree\"\n label=\"More options\"\n size=\"sm\"\n variant=\"ghost\"\n weight=\"bold\"\n @click.stop=\"\n (e: MouseEvent) => openMenu(e, entry)\n \"\n @keydown.down.stop=\"\n (e: KeyboardEvent) => openMenu(e, entry)\n \"\n @keydown.enter.stop=\"\n (e: KeyboardEvent) => openMenu(e, entry)\n \"\n @keydown.space.stop=\"\n (e: KeyboardEvent) => openMenu(e, entry)\n \"\n @keydown.up.stop=\"\n (e: KeyboardEvent) => openMenu(e, entry)\n \" />\n </template>\n <!--\n Empty tag / folder slot. Matches the \"Add operation\"\n affordance from the old sidebar so users can create\n an operation directly inside the hovered tag.\n -->\n <template #empty=\"{ item: emptyItem }\">\n <ScalarSidebarItem\n is=\"button\"\n @click=\"handleAddEmptyFolder(emptyItem)\">\n <template #icon>\n <ScalarIconPlus />\n </template>\n <template #default>Add operation</template>\n </ScalarSidebarItem>\n </template>\n </SidebarItem>\n </template>\n <li\n v-else\n class=\"text-c-3 px-3 py-1 text-xs\">\n Empty document\n </li>\n </template>\n </ScalarSidebarNestedItems>\n </template>\n </ScalarSidebarSection>\n </ScalarSidebarItems>\n </div>\n\n <slot name=\"footer\" />\n </ScalarSidebar>\n </div>\n <DocumentSearchModal\n :document=\"activeDocument\"\n :modalState=\"searchModal\"\n @select=\"handleSearchSelect\" />\n <!--\n Contextual dropdown menu for tags, operations and examples. Rendered\n once for the whole sidebar and re-anchored to the triggering icon via\n `menuTarget.el`, so we do not create a dropdown per item.\n -->\n <SidebarItemMenu\n v-if=\"app.store.value && menuTarget?.showMenu\"\n :eventBus=\"app.eventBus\"\n :item=\"menuTarget.item\"\n :sidebarState=\"sidebarState\"\n :target=\"menuTarget.el\"\n :workspaceStore=\"app.store.value\"\n @closeMenu=\"closeMenu\"\n @showDeleteModal=\"deleteModalState.show()\" />\n <!-- Delete confirmation modal, triggered from the dropdown menu above. -->\n <ScalarModal\n v-if=\"menuTarget\"\n size=\"xxs\"\n :state=\"deleteModalState\"\n :title=\"`Delete ${menuTarget.item.title}`\">\n <DeleteSidebarListElement\n :variableName=\"menuTarget.item.title\"\n :warningMessage=\"deleteMessage\"\n @close=\"deleteModalState.hide()\"\n @delete=\"handleDelete\" />\n </ScalarModal>\n </template>\n </Resize>\n</template>\n\n<style scoped>\n/*\n * Gentle pulse for the registry loading skeletons. Matches the existing\n * `LoadingSkeleton.vue` easing/duration used in `@scalar/api-reference` so\n * any skeleton in the app feels consistent.\n */\n.sidebar-skeleton-row > span {\n animation: sidebar-skeleton-pulse 1.5s infinite alternate;\n}\n\n@keyframes sidebar-skeleton-pulse {\n from {\n opacity: 1;\n }\n to {\n opacity: 0.33;\n }\n}\n</style>\n"],"mappings":""}
|