@datarecce/ui 0.1.28 → 0.1.30

package/dist/{state-DyHCt6IJ.mjs → state-B9yzhuKs.mjs}

@@ -1,6 +1,7 @@
 "use client"
-import { n as PUBLIC_API_URL, t as RECCE_SUPPORT_CALENDAR_URL } from "./urls-D7PrPolY.mjs";
-import { createTheme, useTheme } from "@mui/material/styles";
+import { t as colors } from "./mui-theme-CUhybmBq.mjs";
+import { n as PUBLIC_API_URL, t as RECCE_SUPPORT_CALENDAR_URL } from "./urls-B1Ymdoz-.mjs";
+import { useTheme } from "@mui/material/styles";
 import React, { ComponentType, Dispatch, ForwardRefExoticComponent, Fragment, ReactNode, Ref, RefAttributes, SetStateAction, createContext, forwardRef, useCallback, useContext, useEffect, useImperativeHandle, useMemo, useRef, useState } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import Alert from "@mui/material/Alert";
@@ -50,701 +51,11 @@ import { VscClose, VscKebabVertical, VscKey, VscPin, VscPinned } from "react-ico
 import MuiTooltip from "@mui/material/Tooltip";
 import { useCopyToClipboard } from "usehooks-ts";
 import ListSubheader from "@mui/material/ListSubheader";
-import { usePathname, usePathname as usePathname$1, useRouter } from "next/navigation";
+import { useParams, usePathname, usePathname as usePathname$1, useRouter, useSearchParams } from "next/navigation";
 import Link from "@mui/material/Link";
 import MuiPopover from "@mui/material/Popover";
 import ButtonGroup from "@mui/material/ButtonGroup";
 
-//#region recce-source/js/src/components/ui/mui-theme.ts
-/**
-* MUI Theme Configuration for Recce
-*
-* This theme mirrors the existing Chakra UI theme tokens from theme.ts
-* to ensure visual consistency during the migration period.
-*
-* Color palette mappings:
-* - iochmara (custom blue) -> primary
-* - cyan -> secondary
-* - brand (orange) -> custom palette
-* - green -> success
-* - amber -> warning
-* - red -> error
-* - neutral -> grey
-*/
-const white = "#FFFFFF";
-const black = "#000000";
-const colors = {
-	white,
-	black,
-	iochmara: {
-		50: "#EAF3FB",
-		100: "#C4DDF3",
-		200: "#9EC6EB",
-		300: "#79B0E2",
-		400: "#5599D8",
-		500: "#3182CE",
-		600: "#2A6CA7",
-		700: "#225581",
-		800: "#193E5C",
-		900: "#102638",
-		950: "#060E14"
-	},
-	cyan: {
-		50: "#ECFEFF",
-		100: "#CFFAFE",
-		200: "#A5F3FC",
-		300: "#67E8F9",
-		400: "#22D3EE",
-		500: "#06B6D4",
-		600: "#0891B2",
-		700: "#0E7490",
-		800: "#155E75",
-		900: "#164E63",
-		950: "#083344"
-	},
-	neutral: {
-		50: "#FAFAFA",
-		100: "#F5F5F5",
-		200: "#E5E5E5",
-		300: "#D4D4D4",
-		400: "#A3A3A3",
-		500: "#737373",
-		600: "#525252",
-		700: "#404040",
-		800: "#262626",
-		900: "#171717",
-		950: "#0A0A0A"
-	},
-	amber: {
-		50: "#FFFBEB",
-		100: "#FEF3C7",
-		200: "#FDE68A",
-		300: "#FCD34D",
-		400: "#FBBF24",
-		500: "#F59E0B",
-		600: "#D97706",
-		700: "#B45309",
-		800: "#92400E",
-		900: "#78350F",
-		950: "#431407"
-	},
-	yellow: {
-		50: "#FEFCE8",
-		100: "#FEF9C3",
-		200: "#FEF08A",
-		300: "#FDE047",
-		400: "#FACC15",
-		500: "#EAB308",
-		600: "#CA8A04",
-		700: "#A16207",
-		800: "#854D0E",
-		900: "#713F12",
-		950: "#422006"
-	},
-	green: {
-		50: "#F0FDF4",
-		100: "#DCFCE7",
-		200: "#BBF7D0",
-		300: "#86EFAC",
-		400: "#4ADE80",
-		500: "#22C55E",
-		600: "#16A34A",
-		700: "#15803D",
-		800: "#166534",
-		900: "#14532D",
-		950: "#052E16"
-	},
-	red: {
-		50: "#FEF2F2",
-		100: "#FEE2E2",
-		200: "#FECACA",
-		300: "#FCA5A5",
-		400: "#F87171",
-		500: "#EF4444",
-		600: "#DC2626",
-		700: "#B91C1C",
-		800: "#991B1B",
-		900: "#7F1D1D",
-		950: "#450A0A"
-	},
-	rose: {
-		50: "#FFF1F2",
-		100: "#FFE4E6",
-		200: "#FECDD3",
-		300: "#FDA4AF",
-		400: "#FB7185",
-		500: "#F43F5E",
-		600: "#E11D48",
-		700: "#BE123C",
-		800: "#9F1239",
-		900: "#881337",
-		950: "#4C0519"
-	},
-	fuchsia: {
-		50: "#FDF4FF",
-		100: "#FAE8FF",
-		200: "#F5D0FE",
-		300: "#F0ABFC",
-		400: "#E879F9",
-		500: "#D946EF",
-		600: "#C026D3",
-		700: "#A21CAF",
-		800: "#86198F",
-		900: "#701A75",
-		950: "#4A044E"
-	},
-	brand: {
-		50: "#FFDED5",
-		100: "#FFC1B0",
-		200: "#FFA58C",
-		300: "#FF8967",
-		400: "#FF6E42",
-		500: "#FD541E",
-		600: "#F04104",
-		700: "#C93A06",
-		800: "#A23206",
-		900: "#7C2906",
-		950: "#571E05"
-	}
-};
-const semanticColors = {
-	envBase: colors.amber[500],
-	envCurrent: colors.iochmara[500]
-};
-/**
-* Helper to generate button color variants for a given color
-* Creates contained, outlined, and text variant styles
-*/
-function createButtonColorVariants(colorName, colorScale) {
-	return [
-		{
-			props: {
-				color: colorName,
-				variant: "contained"
-			},
-			style: {
-				backgroundColor: colorScale[500],
-				color: white,
-				"&:hover": { backgroundColor: colorScale[600] }
-			}
-		},
-		{
-			props: {
-				color: colorName,
-				variant: "outlined"
-			},
-			style: {
-				borderColor: colorScale[500],
-				color: colorScale[600],
-				"&:hover": {
-					borderColor: colorScale[600],
-					backgroundColor: `${colorScale[50]}80`
-				}
-			}
-		},
-		{
-			props: {
-				color: colorName,
-				variant: "text"
-			},
-			style: {
-				color: colorScale[600],
-				"&:hover": { backgroundColor: `${colorScale[50]}80` }
-			}
-		}
-	];
-}
-/**
-* Helper to generate CircularProgress color variants
-*/
-function createProgressColorVariant(colorName, colorScale) {
-	return {
-		props: { color: colorName },
-		style: { color: colorScale[500] }
-	};
-}
-/**
-* Helper to generate Badge color variants
-*/
-function createBadgeColorVariant(colorName, colorScale) {
-	return {
-		props: { color: colorName },
-		style: { "& .MuiBadge-badge": {
-			backgroundColor: colorScale[500],
-			color: white
-		} }
-	};
-}
-/**
-* Helper to generate Chip color variants
-*/
-function createChipColorVariants(colorName, colorScale) {
-	return [{
-		props: {
-			color: colorName,
-			variant: "filled"
-		},
-		style: {
-			backgroundColor: colorScale[500],
-			color: white,
-			"&:hover": { backgroundColor: colorScale[600] }
-		}
-	}, {
-		props: {
-			color: colorName,
-			variant: "outlined"
-		},
-		style: {
-			borderColor: colorScale[500],
-			color: colorScale[600]
-		}
-	}];
-}
-const buttonColorVariants = [
-	...createButtonColorVariants("iochmara", colors.iochmara),
-	...createButtonColorVariants("cyan", colors.cyan),
-	...createButtonColorVariants("amber", colors.amber),
-	...createButtonColorVariants("green", colors.green),
-	...createButtonColorVariants("red", colors.red),
-	...createButtonColorVariants("rose", colors.rose),
-	...createButtonColorVariants("fuchsia", colors.fuchsia),
-	...createButtonColorVariants("brand", colors.brand)
-];
-const progressColorVariants = [
-	createProgressColorVariant("iochmara", colors.iochmara),
-	createProgressColorVariant("cyan", colors.cyan),
-	createProgressColorVariant("amber", colors.amber),
-	createProgressColorVariant("green", colors.green),
-	createProgressColorVariant("red", colors.red),
-	createProgressColorVariant("rose", colors.rose),
-	createProgressColorVariant("fuchsia", colors.fuchsia),
-	createProgressColorVariant("brand", colors.brand),
-	createProgressColorVariant("neutral", colors.neutral)
-];
-const badgeColorVariants = [
-	createBadgeColorVariant("iochmara", colors.iochmara),
-	createBadgeColorVariant("cyan", colors.cyan),
-	createBadgeColorVariant("amber", colors.amber),
-	createBadgeColorVariant("green", colors.green),
-	createBadgeColorVariant("red", colors.red),
-	createBadgeColorVariant("rose", colors.rose),
-	createBadgeColorVariant("fuchsia", colors.fuchsia),
-	createBadgeColorVariant("brand", colors.brand),
-	createBadgeColorVariant("neutral", colors.neutral)
-];
-const chipColorVariants = [
-	...createChipColorVariants("iochmara", colors.iochmara),
-	...createChipColorVariants("cyan", colors.cyan),
-	...createChipColorVariants("amber", colors.amber),
-	...createChipColorVariants("green", colors.green),
-	...createChipColorVariants("red", colors.red),
-	...createChipColorVariants("rose", colors.rose),
-	...createChipColorVariants("fuchsia", colors.fuchsia),
-	...createChipColorVariants("brand", colors.brand),
-	...createChipColorVariants("neutral", colors.neutral)
-];
-const componentOverrides = {
-	MuiButton: {
-		defaultProps: { disableElevation: true },
-		variants: [{
-			props: { size: "xsmall" },
-			style: {
-				padding: "0 0.5rem",
-				fontSize: "0.75rem",
-				fontWeight: 500,
-				borderRadius: 4,
-				minHeight: "unset",
-				lineHeight: 1.5
-			}
-		}, ...buttonColorVariants],
-		styleOverrides: {
-			root: ({ theme, ownerState }) => ({
-				textTransform: "none",
-				fontWeight: 500,
-				borderRadius: 6,
-				...ownerState.color === "neutral" && ownerState.variant === "contained" && {
-					backgroundColor: colors.neutral[700],
-					color: white,
-					"&:hover": { backgroundColor: colors.neutral[800] }
-				},
-				...ownerState.color === "neutral" && ownerState.variant === "outlined" && {
-					borderColor: theme.palette.mode === "dark" ? colors.neutral[500] : colors.neutral[300],
-					color: theme.palette.mode === "dark" ? colors.neutral[100] : colors.neutral[900],
-					"&:hover": {
-						borderColor: theme.palette.mode === "dark" ? colors.neutral[400] : colors.neutral[400],
-						backgroundColor: theme.palette.mode === "dark" ? colors.neutral[700] : colors.neutral[100]
-					}
-				},
-				...ownerState.color === "neutral" && ownerState.variant === "text" && {
-					color: theme.palette.mode === "dark" ? colors.neutral[200] : colors.neutral[700],
-					"&:hover": { backgroundColor: theme.palette.mode === "dark" ? colors.neutral[700] : colors.neutral[100] }
-				}
-			}),
-			sizeSmall: {
-				padding: "0.25rem 0.75rem",
-				fontSize: "0.875rem"
-			},
-			sizeMedium: {
-				padding: "0.5rem 1rem",
-				fontSize: "1rem"
-			},
-			sizeLarge: {
-				padding: "0.75rem 1.5rem",
-				fontSize: "1.125rem"
-			},
-			contained: { "&:hover": { boxShadow: "none" } },
-			outlined: {
-				borderWidth: "1px",
-				"&:hover": { borderWidth: "1px" }
-			},
-			text: ({ theme }) => ({ "&:hover": { backgroundColor: theme.palette.mode === "dark" ? "rgba(255, 255, 255, 0.08)" : "rgba(0, 0, 0, 0.04)" } })
-		}
-	},
-	MuiIconButton: { styleOverrides: {
-		root: { borderRadius: 6 },
-		sizeSmall: { padding: 4 },
-		sizeMedium: { padding: 8 },
-		sizeLarge: { padding: 12 }
-	} },
-	MuiTextField: {
-		defaultProps: {
-			variant: "outlined",
-			size: "small"
-		},
-		styleOverrides: { root: { "& .MuiOutlinedInput-root": { borderRadius: 6 } } }
-	},
-	MuiOutlinedInput: { styleOverrides: {
-		root: {
-			borderRadius: 6,
-			"&:hover .MuiOutlinedInput-notchedOutline": { borderColor: colors.iochmara[400] },
-			"&.Mui-focused .MuiOutlinedInput-notchedOutline": {
-				borderColor: colors.iochmara[500],
-				borderWidth: 2
-			}
-		},
-		notchedOutline: ({ theme }) => ({ borderColor: theme.palette.mode === "dark" ? colors.neutral[600] : colors.neutral[300] })
-	} },
-	MuiCheckbox: {
-		defaultProps: { color: "primary" },
-		styleOverrides: { root: { borderRadius: 4 } }
-	},
-	MuiSwitch: { defaultProps: { color: "primary" } },
-	MuiDialog: { styleOverrides: { paper: { borderRadius: 8 } } },
-	MuiDialogTitle: { styleOverrides: { root: {
-		fontWeight: 600,
-		fontSize: "1.125rem"
-	} } },
-	MuiMenu: { styleOverrides: { paper: ({ theme }) => ({
-		borderRadius: 8,
-		boxShadow: theme.shadows[3]
-	}) } },
-	MuiMenuItem: { styleOverrides: { root: ({ theme }) => ({
-		fontSize: "0.875rem",
-		padding: "0.5rem 0.75rem",
-		"&:hover": { backgroundColor: theme.palette.mode === "dark" ? colors.neutral[600] : colors.neutral[100] },
-		"&.Mui-selected": {
-			backgroundColor: theme.palette.mode === "dark" ? colors.iochmara[900] : colors.iochmara[50],
-			"&:hover": { backgroundColor: theme.palette.mode === "dark" ? colors.iochmara[800] : colors.iochmara[100] }
-		}
-	}) } },
-	MuiChip: {
-		variants: [{
-			props: { size: "xsmall" },
-			style: {
-				height: 20,
-				fontSize: "0.625rem"
-			}
-		}, ...chipColorVariants],
-		styleOverrides: {
-			root: {
-				borderRadius: 6,
-				fontWeight: 500
-			},
-			sizeSmall: {
-				height: 24,
-				fontSize: "0.75rem"
-			},
-			sizeMedium: {
-				height: 32,
-				fontSize: "0.875rem"
-			}
-		}
-	},
-	MuiTooltip: { styleOverrides: {
-		tooltip: ({ theme }) => ({
-			backgroundColor: theme.palette.mode === "dark" ? colors.neutral[700] : colors.neutral[800],
-			fontSize: "0.75rem",
-			padding: "0.25rem 0.5rem",
-			borderRadius: 4
-		}),
-		arrow: ({ theme }) => ({ color: theme.palette.mode === "dark" ? colors.neutral[700] : colors.neutral[800] })
-	} },
-	MuiAlert: { styleOverrides: {
-		root: { borderRadius: 6 },
-		standardSuccess: ({ theme }) => ({
-			backgroundColor: theme.palette.mode === "dark" ? colors.green[900] : colors.green[50],
-			color: theme.palette.mode === "dark" ? colors.green[200] : colors.green[800]
-		}),
-		standardWarning: ({ theme }) => ({
-			backgroundColor: theme.palette.mode === "dark" ? colors.amber[900] : colors.amber[50],
-			color: theme.palette.mode === "dark" ? colors.amber[200] : colors.amber[800]
-		}),
-		standardError: ({ theme }) => ({
-			backgroundColor: theme.palette.mode === "dark" ? colors.red[900] : colors.red[50],
-			color: theme.palette.mode === "dark" ? colors.red[200] : colors.red[800]
-		}),
-		standardInfo: ({ theme }) => ({
-			backgroundColor: theme.palette.mode === "dark" ? colors.iochmara[900] : colors.iochmara[50],
-			color: theme.palette.mode === "dark" ? colors.iochmara[200] : colors.iochmara[800]
-		})
-	} },
-	MuiTabs: { styleOverrides: { indicator: { height: 2 } } },
-	MuiTab: { styleOverrides: { root: {
-		textTransform: "none",
-		fontWeight: 500,
-		minHeight: 48
-	} } },
-	MuiAvatar: { styleOverrides: { root: { fontWeight: 500 } } },
-	MuiBadge: {
-		variants: badgeColorVariants,
-		styleOverrides: { badge: {
-			fontWeight: 500,
-			fontSize: "0.75rem"
-		} }
-	},
-	MuiCircularProgress: {
-		defaultProps: { color: "primary" },
-		variants: progressColorVariants
-	},
-	MuiLink: {
-		defaultProps: {
-			underline: "hover",
-			fontWeight: 500
-		},
-		styleOverrides: { root: {
-			color: colors.iochmara[600],
-			textDecorationColor: colors.iochmara[300],
-			"&:hover": { color: colors.iochmara[700] }
-		} }
-	},
-	MuiPaper: { styleOverrides: { rounded: { borderRadius: 8 } } },
-	MuiPopover: { styleOverrides: { paper: ({ theme }) => ({
-		borderRadius: 8,
-		boxShadow: theme.shadows[3]
-	}) } },
-	MuiDivider: { styleOverrides: { root: ({ theme }) => ({ borderColor: theme.palette.mode === "dark" ? colors.neutral[700] : colors.neutral[200] }) } },
-	MuiBreadcrumbs: { styleOverrides: { separator: ({ theme }) => ({ color: theme.palette.mode === "dark" ? colors.neutral[500] : colors.neutral[400] }) } }
-};
-const baseThemeOptions = {
-	palette: {
-		primary: {
-			main: colors.iochmara[500],
-			light: colors.iochmara[300],
-			dark: colors.iochmara[600],
-			contrastText: white
-		},
-		secondary: {
-			main: colors.cyan[500],
-			light: colors.cyan[400],
-			dark: colors.cyan[600],
-			contrastText: white
-		},
-		success: {
-			main: colors.green[500],
-			light: colors.green[400],
-			dark: colors.green[600],
-			contrastText: white
-		},
-		warning: {
-			main: colors.amber[500],
-			light: colors.amber[400],
-			dark: colors.amber[600],
-			contrastText: white
-		},
-		error: {
-			main: colors.red[500],
-			light: colors.red[400],
-			dark: colors.red[600],
-			contrastText: white
-		},
-		grey: {
-			50: colors.neutral[50],
-			100: colors.neutral[100],
-			200: colors.neutral[200],
-			300: colors.neutral[300],
-			400: colors.neutral[400],
-			500: colors.neutral[500],
-			600: colors.neutral[600],
-			700: colors.neutral[700],
-			800: colors.neutral[800],
-			900: colors.neutral[900]
-		}
-	},
-	typography: {
-		fontFamily: "ui-sans-serif, system-ui, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\"",
-		fontWeightLight: 300,
-		fontWeightRegular: 400,
-		fontWeightMedium: 500,
-		fontWeightBold: 700,
-		h1: {
-			fontWeight: 700,
-			fontSize: "2.25rem",
-			lineHeight: 1.2
-		},
-		h2: {
-			fontWeight: 700,
-			fontSize: "1.875rem",
-			lineHeight: 1.2
-		},
-		h3: {
-			fontWeight: 600,
-			fontSize: "1.5rem",
-			lineHeight: 1.3
-		},
-		h4: {
-			fontWeight: 600,
-			fontSize: "1.25rem",
-			lineHeight: 1.4
-		},
-		h5: {
-			fontWeight: 600,
-			fontSize: "1.125rem",
-			lineHeight: 1.4
-		},
-		h6: {
-			fontWeight: 600,
-			fontSize: "1rem",
-			lineHeight: 1.5
-		},
-		body1: {
-			fontSize: "0.875rem",
-			lineHeight: 1.5
-		},
-		body2: {
-			fontSize: "0.75rem",
-			lineHeight: 1.5
-		},
-		button: {
-			textTransform: "none",
-			fontWeight: 500
-		}
-	},
-	shape: { borderRadius: 6 },
-	spacing: 4,
-	components: componentOverrides
-};
-const lightThemeOptions = {
-	...baseThemeOptions,
-	palette: {
-		...baseThemeOptions.palette,
-		mode: "light",
-		background: {
-			default: white,
-			paper: white
-		},
-		text: {
-			primary: colors.neutral[900],
-			secondary: colors.neutral[600]
-		}
-	}
-};
-const darkThemeOptions = {
-	...baseThemeOptions,
-	palette: {
-		...baseThemeOptions.palette,
-		mode: "dark",
-		background: {
-			default: colors.neutral[900],
-			paper: colors.neutral[800]
-		},
-		text: {
-			primary: colors.neutral[50],
-			secondary: colors.neutral[400]
-		}
-	}
-};
-const lightTheme = createTheme(lightThemeOptions);
-const darkTheme = createTheme(darkThemeOptions);
-function createPaletteColor(colorScale) {
-	return {
-		main: colorScale[500],
-		light: colorScale[300],
-		dark: colorScale[600],
-		contrastText: white
-	};
-}
-const customPaletteAdditions = {
-	brand: createPaletteColor(colors.brand),
-	iochmara: {
-		main: colors.iochmara[500],
-		light: colors.iochmara[50],
-		dark: colors.iochmara[700],
-		contrastText: white
-	},
-	cyan: createPaletteColor(colors.cyan),
-	amber: createPaletteColor(colors.amber),
-	green: createPaletteColor(colors.green),
-	red: createPaletteColor(colors.red),
-	rose: createPaletteColor(colors.rose),
-	fuchsia: createPaletteColor(colors.fuchsia),
-	neutral: {
-		main: colors.neutral[500],
-		light: colors.neutral[300],
-		dark: colors.neutral[600],
-		contrastText: white
-	},
-	envBase: semanticColors.envBase,
-	envCurrent: semanticColors.envCurrent
-};
-Object.assign(lightTheme.palette, customPaletteAdditions);
-Object.assign(darkTheme.palette, customPaletteAdditions);
-/**
-* Semantic variant mappings from Chakra-style tokens to scale values
-* These map semantic names to numeric scale values in the color palette
-*/
-const semanticVariantMap = {
-	solid: 600,
-	subtle: 50,
-	muted: 200,
-	emphasized: 500,
-	focusRing: 400,
-	light: 300
-};
-/**
-* Color aliases - map Chakra color names to our color palette
-*/
-const colorAliases = {
-	orange: "amber",
-	gray: "neutral"
-};
-/**
-* Token lookup function to mimic Chakra UI's token API
-* Usage: token("colors.green.solid") => "#16A34A"
-*/
-function token(path$1) {
-	const parts = path$1.split(".");
-	if (parts[0] === "colors" && parts.length >= 3) {
-		let colorName = parts[1];
-		const variant = parts[2];
-		if (colorName in colorAliases) colorName = colorAliases[colorName];
-		if (colorName === "white") return white;
-		if (colorName === "black") return black;
-		if (colorName in semanticColors) {
-			const semantic = semanticColors[colorName];
-			if (typeof semantic === "object" && variant in semantic) return semantic[variant];
-		}
-		if (colorName in colors) {
-			const color = colors[colorName];
-			if (typeof color === "object" && variant in color) return color[variant];
-			if (variant in semanticVariantMap) {
-				const scaleValue = semanticVariantMap[variant];
-				if (typeof color === "object" && scaleValue in color) return color[scaleValue];
-			}
-		}
-	}
-}
-
-//#endregion
 //#region recce-source/js/src/components/ui/toaster.tsx
 const ToasterContext = createContext(null);
 let toastIdCounter = 0;
@@ -1844,7 +1155,7 @@ async function getRecceInstanceInfo(client = axiosClient) {
 
 //#endregion
 //#region recce-source/js/src/lib/hooks/ApiConfigContext.tsx
-const defaultConfig = {
+const defaultConfig$1 = {
 	apiPrefix: "",
 	authToken: void 0,
 	baseUrl: void 0
@@ -1877,7 +1188,7 @@ function createApiClient(config) {
 	});
 	return client;
 }
-function ApiConfigProvider({ children, apiPrefix = defaultConfig.apiPrefix, authToken = defaultConfig.authToken, baseUrl = defaultConfig.baseUrl }) {
+function ApiConfigProvider({ children, apiPrefix = defaultConfig$1.apiPrefix, authToken = defaultConfig$1.authToken, baseUrl = defaultConfig$1.baseUrl }) {
 	const config = useMemo(() => ({
 		apiPrefix,
 		authToken,
@@ -5475,21 +4786,76 @@ const RunModal = ({ isOpen, onClose, onExecute, type, title, params: defaultPara
 };
 
 //#endregion
-//#region recce-source/js/src/lib/hooks/useAppRouter.ts
+//#region src/lib/hooks/RouteConfigContext.ts
+const defaultConfig = { basePath: "" };
+const RouteConfigContext = createContext(null);
+/**
+* Provider for route configuration.
+*
+* Wrap your application (or RecceContextProvider) with this provider
+* to configure path prefixes for navigation.
+*
+* @example
+* // In recce-cloud
+* <RouteConfigProvider basePath={`/oss/${sessionId}`}>
+*   <RecceContextProvider>
+*     {children}
+*   </RecceContextProvider>
+* </RouteConfigProvider>
+*/
+function RouteConfigProvider({ children, basePath = defaultConfig.basePath }) {
+	const resolvePath = useCallback((path$1) => {
+		if (!basePath) return path$1;
+		if (path$1.startsWith(basePath)) return path$1;
+		if (path$1.match(/^https?:\/\//)) return path$1;
+		if (path$1.startsWith("#")) return path$1;
+		return `${basePath.endsWith("/") ? basePath.slice(0, -1) : basePath}${path$1.startsWith("/") ? path$1 : `/${path$1}`}`;
+	}, [basePath]);
+	const contextValue = useMemo(() => ({
+		basePath,
+		resolvePath
+	}), [basePath, resolvePath]);
+	return React.createElement(RouteConfigContext.Provider, { value: contextValue }, children);
+}
+const defaultRouteConfigContext = {
+	basePath: "",
+	resolvePath: (path$1) => path$1
+};
+/**
+* Hook to access route configuration.
+*
+* When used outside RouteConfigProvider, returns default config
+* (for OSS backward compatibility).
+*
+* @returns RouteConfigContextType with basePath and resolvePath function
+*/
+function useRouteConfig() {
+	return useContext(RouteConfigContext) ?? defaultRouteConfigContext;
+}
+/**
+* Safe hook that returns null if context not available.
+* Useful for components that need to detect if RouteConfigProvider is present.
+*/
+function useRouteConfigSafe() {
+	return useContext(RouteConfigContext);
+}
+
+//#endregion
+//#region src/lib/hooks/useAppRouter.ts
 /**
-* useAppRouter - Navigation utilities for Next.js App Router
+* useAppRouter - Navigation utilities for Next.js App Router with RouteConfig support
 *
-* Provides a similar API to Wouter's useLocation for easier migration.
-* This hook combines Next.js's useRouter, usePathname, useParams,
-* and useSearchParams into a unified interface.
+* This is a custom version that wraps the OSS useAppRouter to add
+* RouteConfigContext support for path prefixing in recce-cloud.
 *
-* IMPORTANT: useSearchParams() triggers Suspense boundaries in Next.js.
-* To avoid full-page loading states, useAppLocation() only returns the
-* pathname by default. Use useAppLocationWithSearch() if you need
-* search params included in the location string.
+* The key difference from OSS:
+* - setLocation() automatically prefixes paths with the configured basePath
+* - This allows OSS components to use setLocation("/query") while
+*   recce-cloud can configure basePath="/oss/abc123" to get "/oss/abc123/query"
 */
 /**
 * Hook that provides Wouter-compatible location API using Next.js App Router
+* with RouteConfigContext support for path prefixing.
 *
 * NOTE: This returns only the pathname (not search params) to avoid
 * triggering Suspense boundaries on every navigation.
@@ -5498,15 +4864,123 @@ const RunModal = ({ isOpen, onClose, onExecute, type, title, params: defaultPara
 *
 * @example
 * const [location, setLocation] = useAppLocation();
-* setLocation("/checks?id=123"); // Navigate to new path with query
-* setLocation("/checks", { replace: true }); // Replace current history entry
+* setLocation("/checks?id=123"); // In cloud mode with basePath="/oss/abc123"
+*                                 // navigates to "/oss/abc123/checks?id=123"
 */
 function useAppLocation() {
 	const router = useRouter();
-	return [usePathname$1(), useCallback((to, options) => {
-		if (options?.replace) router.replace(to, { scroll: options?.scroll ?? true });
-		else router.push(to, { scroll: options?.scroll ?? true });
-	}, [router])];
+	const pathname = usePathname$1();
+	const { resolvePath } = useRouteConfig();
+	return [pathname, useCallback((to, options) => {
+		const [pathPart, queryPart] = to.split("?");
+		const resolvedPath = resolvePath(pathPart);
+		const fullPath = queryPart ? `${resolvedPath}?${queryPart}` : resolvedPath;
+		if (options?.replace) router.replace(fullPath, { scroll: options?.scroll ?? true });
+		else router.push(fullPath, { scroll: options?.scroll ?? true });
+	}, [router, resolvePath])];
+}
+/**
+* Hook that includes search params in the location string.
+* Also supports RouteConfigContext path prefixing.
+*
+* WARNING: This hook uses useSearchParams() which triggers Suspense.
+* Only use this in components that are wrapped in a <Suspense> boundary,
+* or in leaf components where suspension is acceptable.
+*
+* @returns [fullLocation, setLocation] tuple with search params included
+*/
+function useAppLocationWithSearch() {
+	const router = useRouter();
+	const pathname = usePathname$1();
+	const searchParams = useSearchParams();
+	const { resolvePath } = useRouteConfig();
+	return [useMemo(() => {
+		const search = searchParams?.toString();
+		return search ? `${pathname}?${search}` : pathname;
+	}, [pathname, searchParams]), useCallback((to, options) => {
+		const [pathPart, queryPart] = to.split("?");
+		const resolvedPath = resolvePath(pathPart);
+		const fullPath = queryPart ? `${resolvedPath}?${queryPart}` : resolvedPath;
+		if (options?.replace) router.replace(fullPath, { scroll: options?.scroll ?? true });
+		else router.push(fullPath, { scroll: options?.scroll ?? true });
+	}, [router, resolvePath])];
+}
+/**
+* Hook to check if current path matches a pattern
+* Similar to Wouter's useRoute
+*
+* @param pattern - The route pattern to match (e.g., "/checks/:checkId")
+* @returns [isMatch, params] tuple
+*
+* @example
+* const [isMatch, params] = useAppRoute("/checks/:checkId");
+* if (isMatch) {
+*   console.log(params.checkId); // "abc-123"
+* }
+*/
+function useAppRoute(pattern) {
+	const pathname = usePathname$1();
+	const params = useParams();
+	return [useMemo(() => {
+		const regexPattern = pattern.replace(/:\w+/g, "([^/]+)").replace(/\*/g, ".*");
+		return (/* @__PURE__ */ new RegExp(`^${regexPattern}$`)).test(pathname);
+	}, [pattern, pathname]), useMemo(() => {
+		if (!params) return {};
+		return Object.fromEntries(Object.entries(params).map(([key, value]) => [key, Array.isArray(value) ? value.join("/") : value]));
+	}, [params])];
+}
+/**
+* Imperative navigation function for use outside React components
+* Use sparingly - prefer useAppLocation hook in components
+*
+* NOTE: This function does NOT support RouteConfigContext because
+* it's used outside of React component tree. If you need path prefixing,
+* use useAppLocation hook instead.
+*
+* @example
+* // In an event handler or utility function
+* import { navigateTo } from "@/lib/hooks/useAppRouter";
+* navigateTo("/checks?id=123");
+*/
+function navigateTo(path$1, replace = false) {
+	if (typeof window !== "undefined") {
+		if (replace) window.history.replaceState(null, "", path$1);
+		else window.history.pushState(null, "", path$1);
+		window.dispatchEvent(new PopStateEvent("popstate"));
+	}
+}
+/**
+* Hook for programmatic navigation with more options
+* Provides direct access to Next.js router methods with RouteConfigContext support
+*
+* NOTE: Does not include searchParams to avoid Suspense.
+* Use useSearchParams() directly in components that need it.
+*/
+function useAppNavigation() {
+	const router = useRouter();
+	const pathname = usePathname$1();
+	const params = useParams();
+	const { resolvePath } = useRouteConfig();
+	return {
+		pathname,
+		params,
+		push: useCallback((href, options) => {
+			const [pathPart, queryPart] = href.split("?");
+			const resolvedPath = resolvePath(pathPart);
+			const fullPath = queryPart ? `${resolvedPath}?${queryPart}` : resolvedPath;
+			router.push(fullPath, options);
+		}, [router, resolvePath]),
+		replace: useCallback((href, options) => {
+			const [pathPart, queryPart] = href.split("?");
+			const resolvedPath = resolvePath(pathPart);
+			const fullPath = queryPart ? `${resolvedPath}?${queryPart}` : resolvedPath;
+			router.replace(fullPath, options);
+		}, [router, resolvePath]),
+		back: router.back,
+		forward: router.forward,
+		refresh: router.refresh,
+		prefetch: router.prefetch
+	};
 }
 
 //#endregion
@@ -8222,5 +7696,5 @@ async function shareState(client = axiosClient) {
 }
 
 //#endregion
-export { queryRowCount as $, trackLineageViewRender as $t, ColumnNameCell as A, getModelInfo as An, createLineageDiffCheck as At, IconExport as B, darkTheme as Bn, submitRunFromCheck as Bt, TopKSummaryList as C, selectUpstream as Cn, useApiConfigSafe as Ct, QueryDiffResultView as D, getLineage as Dn, submitValueDiff as Dt, QueryResultView as E, getCll as En, ScreenshotDataGrid as Et, RecceActionContextProvider as F, Toaster as Fn, cancelRun as Ft, deltaPercentageString as G, LINEAGE_SELECTION_ACTION as Gt, IconInfo as H, token as Hn, EXPLORE_ACTION as Ht, useRecceActionContext as I, ToasterProvider as In, getRun as It, mergeKeys as J, trackEnvironmentConfig as Jt, DiffText as K, trackColumnLevelLineage as Kt, useAppLocation as L, toaster as Ln, listRuns as Lt, useLineageViewContext as M, axiosClient as Mn, submitQueryBase as Mt, useLineageViewContextSafe as N, reactQueryClient as Nn, submitQueryDiff as Nt, ProfileDiffResultView as O, getLineageDiff as On, submitValueDiffDetail as Ot, RecceActionContext as P, ScreenshotBox as Pn, aggregateRuns as Pt, queryModelRowCount as Q, trackLineageSelection as Qt, RunModal as R, useToaster as Rn, searchRuns as Rt, TopKDiffResultView as S, selectDownstream as Sn, useApiConfig as St, RowCountDiffResultView as T, union as Tn, EmptyRowsRenderer as Tt, IconSave as U, EXPLORE_FORM_EVENT as Ut, IconImport as V, lightTheme as Vn, waitRun as Vt, IconSync as W, EXPLORE_SOURCE as Wt, submitRowCountDiff as X, trackExploreActionForm as Xt, mergeKeysWithStatus as Y, trackExploreAction as Yt, fetchModelRowCount as Z, trackHistoryAction as Zt, findByRunType as _, isValueDiffRun as _n, RecceInstanceInfoProvider as _t, saveAs as a, trackSingleEnvironment as an, supportsHistogramDiff as at, ValueDiffForm as b, isLineageGraphNode as bn, ApiConfigProvider as bt, createCheckByRun as c, isHistogramDiffRun as cn, useLineageGraphContext as ct, getCheck as d, isQueryDiffRun as dn, IdleTimeoutProvider as dt, trackMultiNodesAction as en, ProfileDiffForm as et, listChecks as f, isQueryRun as fn, useIdleTimeout as ft, useChecks as g, isValueDiffDetailRun as gn, formatDuration as gt, updateCheck as h, isTopKDiffRun as hn, markRelaunchHintCompleted as ht, rename as i, trackShareState as in, HistogramDiffForm as it, LineageViewContext as j, getServerInfo as jn, submitQuery as jt, createDataGridFromData as k, getLineageWithError as kn, submitProfileDiff as kt, createSimpleCheck as l, isProfileDiffRun as ln, useRunsAggregated as lt, reorderChecks as m, isRowCountRun as mn, markOnboardingCompleted as mt, importState as n, trackPreviewChange as nn, HistogramChart as nt, shareState as o, trackStateAction as on, useModelColumns_default as ot, markAsPresetCheck as p, isRowCountDiffRun as pn, getServerFlag as pt, useClipBoardToast as q, trackCopyToClipboard as qt, isStateSyncing as r, trackPreviewChangeFeedback as rn, SquareIcon as rt, syncState as s, RunToolbar as sn, LineageGraphContextProvider as st, exportState as t, trackNavigation as tn, HistogramDiffResultView as tt, deleteCheck as u, isQueryBaseRun as un, useRecceServerFlag as ut, runTypeHasRef as v, COLUMN_HEIGHT as vn, useRecceInstanceContext as vt, TopKDiffForm as w, toReactFlow as wn, cacheKeys as wt, ValueDiffDetailResultView as x, layout as xn, useApiClient as xt, ValueDiffResultView as y, isLineageGraphColumnNode as yn, useRecceInstanceInfo as yt, IconEdit as z, colors as zn, submitRun as zt };
-//# sourceMappingURL=state-DyHCt6IJ.mjs.map
+export { DiffText as $, trackColumnLevelLineage as $t, ColumnNameCell as A, selectUpstream as An, useApiConfigSafe as At, useAppNavigation as B, reactQueryClient as Bn, submitQueryDiff as Bt, TopKSummaryList as C, isValueDiffDetailRun as Cn, formatDuration as Ct, QueryDiffResultView as D, isLineageGraphNode as Dn, ApiConfigProvider as Dt, QueryResultView as E, isLineageGraphColumnNode as En, useRecceInstanceInfo as Et, RecceActionContextProvider as F, getLineageDiff as Fn, submitValueDiffDetail as Ft, RunModal as G, useToaster as Gn, searchRuns as Gt, RouteConfigProvider as H, Toaster as Hn, cancelRun as Ht, useRecceActionContext as I, getLineageWithError as In, submitProfileDiff as It, IconImport as J, waitRun as Jt, IconEdit as K, submitRun as Kt, navigateTo as L, getModelInfo as Ln, createLineageDiffCheck as Lt, useLineageViewContext as M, union as Mn, EmptyRowsRenderer as Mt, useLineageViewContextSafe as N, getCll as Nn, ScreenshotDataGrid as Nt, ProfileDiffResultView as O, layout as On, useApiClient as Ot, RecceActionContext as P, getLineage as Pn, submitValueDiff as Pt, deltaPercentageString as Q, LINEAGE_SELECTION_ACTION as Qt, useAppLocation as R, getServerInfo as Rn, submitQuery as Rt, TopKDiffResultView as S, isTopKDiffRun as Sn, markRelaunchHintCompleted as St, RowCountDiffResultView as T, COLUMN_HEIGHT as Tn, useRecceInstanceContext as Tt, useRouteConfig as U, ToasterProvider as Un, getRun as Ut, useAppRoute as V, ScreenshotBox as Vn, aggregateRuns as Vt, useRouteConfigSafe as W, toaster as Wn, listRuns as Wt, IconSave as X, EXPLORE_FORM_EVENT as Xt, IconInfo as Y, EXPLORE_ACTION as Yt, IconSync as Z, EXPLORE_SOURCE as Zt, findByRunType as _, isQueryBaseRun as _n, useRecceServerFlag as _t, saveAs as a, trackLineageSelection as an, queryModelRowCount as at, ValueDiffForm as b, isRowCountDiffRun as bn, getServerFlag as bt, createCheckByRun as c, trackNavigation as cn, HistogramDiffResultView as ct, getCheck as d, trackShareState as dn, HistogramDiffForm as dt, trackCopyToClipboard as en, useClipBoardToast as et, listChecks as f, trackSingleEnvironment as fn, supportsHistogramDiff as ft, useChecks as g, isProfileDiffRun as gn, useRunsAggregated as gt, updateCheck as h, isHistogramDiffRun as hn, useLineageGraphContext as ht, rename as i, trackHistoryAction as in, fetchModelRowCount as it, LineageViewContext as j, toReactFlow as jn, cacheKeys as jt, createDataGridFromData as k, selectDownstream as kn, useApiConfig as kt, createSimpleCheck as l, trackPreviewChange as ln, HistogramChart as lt, reorderChecks as m, RunToolbar as mn, LineageGraphContextProvider as mt, importState as n, trackExploreAction as nn, mergeKeysWithStatus as nt, shareState as o, trackLineageViewRender as on, queryRowCount as ot, markAsPresetCheck as p, trackStateAction as pn, useModelColumns_default as pt, IconExport as q, submitRunFromCheck as qt, isStateSyncing as r, trackExploreActionForm as rn, submitRowCountDiff as rt, syncState as s, trackMultiNodesAction as sn, ProfileDiffForm as st, exportState as t, trackEnvironmentConfig as tn, mergeKeys as tt, deleteCheck as u, trackPreviewChangeFeedback as un, SquareIcon as ut, runTypeHasRef as v, isQueryDiffRun as vn, IdleTimeoutProvider as vt, TopKDiffForm as w, isValueDiffRun as wn, RecceInstanceInfoProvider as wt, ValueDiffDetailResultView as x, isRowCountRun as xn, markOnboardingCompleted as xt, ValueDiffResultView as y, isQueryRun as yn, useIdleTimeout as yt, useAppLocationWithSearch as z, axiosClient as zn, submitQueryBase as zt };
+//# sourceMappingURL=state-B9yzhuKs.mjs.map