mirror of
https://github.com/prometheus/prometheus.git
synced 2025-12-09 11:31:43 +01:00
Migrate Mantine v7 -> v8 (#17402)
I followed the migration guide at https://mantine.dev/guides/7x-to-8x/ to add back both manual timezone handling in the time input, as well as syntax highlighting in the config code box. Signed-off-by: Julius Volz <julius.volz@gmail.com>
This commit is contained in:
Julius Volz
GitHub
parent
204249fcb5
commit
1b7fa3e76d
@ -1 +1 @@
|
||||
v20.5.1
|
||||
v22.21.1
|
||||
|
||||
@ -20,11 +20,11 @@
|
||||
"@floating-ui/dom": "^1.7.4",
|
||||
"@lezer/common": "^1.2.3",
|
||||
"@lezer/highlight": "^1.2.1",
|
||||
"@mantine/code-highlight": "^7.17.8",
|
||||
"@mantine/core": "^7.17.8",
|
||||
"@mantine/dates": "^7.17.8",
|
||||
"@mantine/hooks": "^7.17.8",
|
||||
"@mantine/notifications": "^7.17.8",
|
||||
"@mantine/code-highlight": "^8.3.5",
|
||||
"@mantine/core": "^8.3.5",
|
||||
"@mantine/dates": "^8.3.5",
|
||||
"@mantine/hooks": "^8.3.5",
|
||||
"@mantine/notifications": "^8.3.5",
|
||||
"@microsoft/fetch-event-source": "^2.0.1",
|
||||
"@nexucis/fuzzy": "^0.5.1",
|
||||
"@nexucis/kvsearch": "^0.9.1",
|
||||
@ -39,6 +39,7 @@
|
||||
"@uiw/react-codemirror": "^4.25.2",
|
||||
"clsx": "^2.1.1",
|
||||
"dayjs": "^1.11.18",
|
||||
"highlight.js": "^11.11.1",
|
||||
"lodash": "^4.17.21",
|
||||
"react": "^19.1.1",
|
||||
"react-dom": "^19.1.1",
|
||||
|
||||
@ -71,6 +71,18 @@ import ServiceDiscoveryPage from "./pages/service-discovery/ServiceDiscoveryPage
|
||||
import AlertmanagerDiscoveryPage from "./pages/AlertmanagerDiscoveryPage";
|
||||
import { actionIconStyle, navIconStyle } from "./styles";
|
||||
|
||||
import {
|
||||
CodeHighlightAdapterProvider,
|
||||
createHighlightJsAdapter,
|
||||
} from "@mantine/code-highlight";
|
||||
import hljs from "highlight.js/lib/core";
|
||||
import "./highlightjs.css";
|
||||
import yamlLang from "highlight.js/lib/languages/yaml";
|
||||
|
||||
hljs.registerLanguage("yaml", yamlLang);
|
||||
|
||||
const highlightJsAdapter = createHighlightJsAdapter(hljs);
|
||||
|
||||
const queryClient = new QueryClient();
|
||||
|
||||
const mainNavPages = [
|
||||
@ -306,142 +318,144 @@ function App() {
|
||||
<BrowserRouter basename={pathPrefix}>
|
||||
<QueryParamProvider adapter={ReactRouter6Adapter}>
|
||||
<MantineProvider defaultColorScheme="auto" theme={theme}>
|
||||
<Notifications position="top-right" />
|
||||
<CodeHighlightAdapterProvider adapter={highlightJsAdapter}>
|
||||
<Notifications position="top-right" />
|
||||
|
||||
<QueryClientProvider client={queryClient}>
|
||||
<AppShell
|
||||
header={{ height: 56 }}
|
||||
navbar={{
|
||||
width: 300,
|
||||
// TODO: On pages with a long title like "/status", the navbar
|
||||
// breaks in an ugly way for narrow windows. Fix this.
|
||||
breakpoint: "sm",
|
||||
collapsed: { desktop: true, mobile: !opened },
|
||||
}}
|
||||
padding="md"
|
||||
>
|
||||
<NotificationsProvider>
|
||||
<AppShell.Header bg="rgb(65, 73, 81)" c="#fff">
|
||||
<Group h="100%" px="md" wrap="nowrap">
|
||||
<Group
|
||||
style={{ flex: 1 }}
|
||||
justify="space-between"
|
||||
wrap="nowrap"
|
||||
>
|
||||
<Group gap={40} wrap="nowrap">
|
||||
<Link
|
||||
to="/"
|
||||
style={{ textDecoration: "none", color: "white" }}
|
||||
>
|
||||
<Group gap={10} wrap="nowrap">
|
||||
<img src={PrometheusLogo} height={30} />
|
||||
<Text hiddenFrom="sm" fz={20}>
|
||||
Prometheus
|
||||
</Text>
|
||||
<Text visibleFrom="md" fz={20}>
|
||||
Prometheus
|
||||
</Text>
|
||||
<Text fz={20}>{agentMode && "Agent"}</Text>
|
||||
<QueryClientProvider client={queryClient}>
|
||||
<AppShell
|
||||
header={{ height: 56 }}
|
||||
navbar={{
|
||||
width: 300,
|
||||
// TODO: On pages with a long title like "/status", the navbar
|
||||
// breaks in an ugly way for narrow windows. Fix this.
|
||||
breakpoint: "sm",
|
||||
collapsed: { desktop: true, mobile: !opened },
|
||||
}}
|
||||
padding="md"
|
||||
>
|
||||
<NotificationsProvider>
|
||||
<AppShell.Header bg="rgb(65, 73, 81)" c="#fff">
|
||||
<Group h="100%" px="md" wrap="nowrap">
|
||||
<Group
|
||||
style={{ flex: 1 }}
|
||||
justify="space-between"
|
||||
wrap="nowrap"
|
||||
>
|
||||
<Group gap={40} wrap="nowrap">
|
||||
<Link
|
||||
to="/"
|
||||
style={{ textDecoration: "none", color: "white" }}
|
||||
>
|
||||
<Group gap={10} wrap="nowrap">
|
||||
<img src={PrometheusLogo} height={30} />
|
||||
<Text hiddenFrom="sm" fz={20}>
|
||||
Prometheus
|
||||
</Text>
|
||||
<Text visibleFrom="md" fz={20}>
|
||||
Prometheus
|
||||
</Text>
|
||||
<Text fz={20}>{agentMode && "Agent"}</Text>
|
||||
</Group>
|
||||
</Link>
|
||||
<Group gap={12} visibleFrom="sm" wrap="nowrap">
|
||||
{navLinks}
|
||||
</Group>
|
||||
</Link>
|
||||
<Group gap={12} visibleFrom="sm" wrap="nowrap">
|
||||
{navLinks}
|
||||
</Group>
|
||||
<Group visibleFrom="xs" wrap="nowrap" gap="xs">
|
||||
{navActionIcons}
|
||||
</Group>
|
||||
</Group>
|
||||
<Group visibleFrom="xs" wrap="nowrap" gap="xs">
|
||||
{navActionIcons}
|
||||
</Group>
|
||||
<Burger
|
||||
opened={opened}
|
||||
onClick={toggle}
|
||||
hiddenFrom="sm"
|
||||
size="sm"
|
||||
color="gray.2"
|
||||
/>
|
||||
</Group>
|
||||
<Burger
|
||||
opened={opened}
|
||||
onClick={toggle}
|
||||
hiddenFrom="sm"
|
||||
size="sm"
|
||||
color="gray.2"
|
||||
/>
|
||||
</Group>
|
||||
</AppShell.Header>
|
||||
</AppShell.Header>
|
||||
|
||||
<AppShell.Navbar py="md" px={4} bg="rgb(65, 73, 81)" c="#fff">
|
||||
{navLinks}
|
||||
<Group mt="md" hiddenFrom="xs" justify="center">
|
||||
{navActionIcons}
|
||||
</Group>
|
||||
</AppShell.Navbar>
|
||||
</NotificationsProvider>
|
||||
<AppShell.Navbar py="md" px={4} bg="rgb(65, 73, 81)" c="#fff">
|
||||
{navLinks}
|
||||
<Group mt="md" hiddenFrom="xs" justify="center">
|
||||
{navActionIcons}
|
||||
</Group>
|
||||
</AppShell.Navbar>
|
||||
</NotificationsProvider>
|
||||
|
||||
<AppShell.Main>
|
||||
<ErrorBoundary key={location.pathname}>
|
||||
<Suspense
|
||||
fallback={
|
||||
<Box mt="lg">
|
||||
{Array.from(Array(10), (_, i) => (
|
||||
<Skeleton
|
||||
key={i}
|
||||
height={40}
|
||||
mb={15}
|
||||
width={1000}
|
||||
mx="auto"
|
||||
<AppShell.Main>
|
||||
<ErrorBoundary key={location.pathname}>
|
||||
<Suspense
|
||||
fallback={
|
||||
<Box mt="lg">
|
||||
{Array.from(Array(10), (_, i) => (
|
||||
<Skeleton
|
||||
key={i}
|
||||
height={40}
|
||||
mb={15}
|
||||
width={1000}
|
||||
mx="auto"
|
||||
/>
|
||||
))}
|
||||
</Box>
|
||||
}
|
||||
>
|
||||
<Routes>
|
||||
<Route
|
||||
path="/"
|
||||
element={
|
||||
<Navigate
|
||||
to={agentMode ? "/agent" : "/query"}
|
||||
replace
|
||||
/>
|
||||
}
|
||||
/>
|
||||
{agentMode ? (
|
||||
<Route
|
||||
path="/agent"
|
||||
element={
|
||||
<ReadinessWrapper>
|
||||
<AgentPage />
|
||||
</ReadinessWrapper>
|
||||
}
|
||||
/>
|
||||
) : (
|
||||
<>
|
||||
<Route
|
||||
path="/query"
|
||||
element={
|
||||
<ReadinessWrapper>
|
||||
<QueryPage />
|
||||
</ReadinessWrapper>
|
||||
}
|
||||
/>
|
||||
<Route
|
||||
path="/alerts"
|
||||
element={
|
||||
<ReadinessWrapper>
|
||||
<AlertsPage />
|
||||
</ReadinessWrapper>
|
||||
}
|
||||
/>
|
||||
</>
|
||||
)}
|
||||
{allStatusPages.map((p) => (
|
||||
<Route
|
||||
key={p.path}
|
||||
path={p.path}
|
||||
element={
|
||||
<ReadinessWrapper>{p.element}</ReadinessWrapper>
|
||||
}
|
||||
/>
|
||||
))}
|
||||
</Box>
|
||||
}
|
||||
>
|
||||
<Routes>
|
||||
<Route
|
||||
path="/"
|
||||
element={
|
||||
<Navigate
|
||||
to={agentMode ? "/agent" : "/query"}
|
||||
replace
|
||||
/>
|
||||
}
|
||||
/>
|
||||
{agentMode ? (
|
||||
<Route
|
||||
path="/agent"
|
||||
element={
|
||||
<ReadinessWrapper>
|
||||
<AgentPage />
|
||||
</ReadinessWrapper>
|
||||
}
|
||||
/>
|
||||
) : (
|
||||
<>
|
||||
<Route
|
||||
path="/query"
|
||||
element={
|
||||
<ReadinessWrapper>
|
||||
<QueryPage />
|
||||
</ReadinessWrapper>
|
||||
}
|
||||
/>
|
||||
<Route
|
||||
path="/alerts"
|
||||
element={
|
||||
<ReadinessWrapper>
|
||||
<AlertsPage />
|
||||
</ReadinessWrapper>
|
||||
}
|
||||
/>
|
||||
</>
|
||||
)}
|
||||
{allStatusPages.map((p) => (
|
||||
<Route
|
||||
key={p.path}
|
||||
path={p.path}
|
||||
element={
|
||||
<ReadinessWrapper>{p.element}</ReadinessWrapper>
|
||||
}
|
||||
/>
|
||||
))}
|
||||
</Routes>
|
||||
</Suspense>
|
||||
</ErrorBoundary>
|
||||
</AppShell.Main>
|
||||
</AppShell>
|
||||
{/* <ReactQueryDevtools initialIsOpen={false} /> */}
|
||||
</QueryClientProvider>
|
||||
</Routes>
|
||||
</Suspense>
|
||||
</ErrorBoundary>
|
||||
</AppShell.Main>
|
||||
</AppShell>
|
||||
{/* <ReactQueryDevtools initialIsOpen={false} /> */}
|
||||
</QueryClientProvider>
|
||||
</CodeHighlightAdapterProvider>
|
||||
</MantineProvider>
|
||||
</QueryParamProvider>
|
||||
</BrowserRouter>
|
||||
|
||||
97
web/ui/mantine-ui/src/highlightjs.css
Normal file
97
web/ui/mantine-ui/src/highlightjs.css
Normal file
@ -0,0 +1,97 @@
|
||||
/* Adapted from Mantine 7, where highlighting was still included automatically as part of <CodeHighlight>,
|
||||
see https://github.com/mantinedev/mantine/blob/v7/packages/%40mantine/code-highlight/src/CodeHighlight.theme.module.css */
|
||||
.hljs {
|
||||
color: var(--code-text-color);
|
||||
background: var(--code-background);
|
||||
|
||||
@mixin where-light {
|
||||
--code-text-color: var(--mantine-color-gray-7);
|
||||
--code-background: var(--mantine-color-gray-0);
|
||||
--code-comment-color: var(--mantine-color-gray-6);
|
||||
--code-keyword-color: var(--mantine-color-violet-8);
|
||||
--code-tag-color: var(--mantine-color-red-9);
|
||||
--code-literal-color: var(--mantine-color-blue-6);
|
||||
--code-string-color: var(--mantine-color-blue-9);
|
||||
--code-variable-color: var(--mantine-color-lime-9);
|
||||
--code-class-color: var(--mantine-color-orange-9);
|
||||
}
|
||||
|
||||
@mixin where-dark {
|
||||
--code-text-color: var(--mantine-color-dark-1);
|
||||
--code-background: var(--mantine-color-dark-8);
|
||||
--code-comment-color: var(--mantine-color-dark-3);
|
||||
--code-keyword-color: var(--mantine-color-violet-3);
|
||||
--code-tag-color: var(--mantine-color-yellow-4);
|
||||
--code-literal-color: var(--mantine-color-blue-4);
|
||||
--code-string-color: var(--mantine-color-green-6);
|
||||
--code-variable-color: var(--mantine-color-blue-2);
|
||||
--code-class-color: var(--mantine-color-orange-5);
|
||||
}
|
||||
|
||||
.hljs-comment,
|
||||
.hljs-quote {
|
||||
font-style: italic;
|
||||
color: var(--code-comment-color);
|
||||
}
|
||||
|
||||
.hljs-doctag,
|
||||
.hljs-formula,
|
||||
.hljs-keyword {
|
||||
color: var(--code-keyword-color);
|
||||
}
|
||||
|
||||
.hljs-deletion,
|
||||
.hljs-name,
|
||||
.hljs-section,
|
||||
.hljs-selector-tag,
|
||||
.hljs-subst {
|
||||
color: var(--code-tag-color);
|
||||
}
|
||||
|
||||
.hljs-literal {
|
||||
color: var(--code-literal-color);
|
||||
}
|
||||
|
||||
.hljs-addition,
|
||||
.hljs-attribute,
|
||||
.hljs-meta .hljs-string,
|
||||
.hljs-regexp,
|
||||
.hljs-string {
|
||||
color: var(--code-string-color);
|
||||
}
|
||||
|
||||
.hljs-attr,
|
||||
.hljs-number,
|
||||
.hljs-selector-attr,
|
||||
.hljs-selector-class,
|
||||
.hljs-selector-pseudo,
|
||||
.hljs-template-variable,
|
||||
.hljs-type,
|
||||
.hljs-variable {
|
||||
color: var(--code-variable-color);
|
||||
}
|
||||
|
||||
.hljs-bullet,
|
||||
.hljs-link,
|
||||
.hljs-meta,
|
||||
.hljs-selector-id,
|
||||
.hljs-symbol,
|
||||
.hljs-title,
|
||||
.hljs-built_in,
|
||||
.hljs-class .hljs-title,
|
||||
.hljs-title.class_ {
|
||||
color: var(--code-class-color);
|
||||
}
|
||||
|
||||
.hljs-emphasis {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.hljs-strong {
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.hljs-link {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
@ -1,8 +1,9 @@
|
||||
import { Group, ActionIcon, CloseButton } from "@mantine/core";
|
||||
import { DatesProvider, DateTimePicker } from "@mantine/dates";
|
||||
import { DateTimePicker } from "@mantine/dates";
|
||||
import { IconChevronLeft, IconChevronRight } from "@tabler/icons-react";
|
||||
import { FC } from "react";
|
||||
import { useSettings } from "../../state/settingsSlice";
|
||||
import dayjs from "dayjs";
|
||||
|
||||
interface TimeInputProps {
|
||||
time: number | null; // Timestamp in milliseconds.
|
||||
@ -22,65 +23,74 @@ const TimeInput: FC<TimeInputProps> = ({
|
||||
const baseTime = () => (time !== null ? time : Date.now().valueOf());
|
||||
const { useLocalTime } = useSettings();
|
||||
|
||||
const dateString = useLocalTime
|
||||
? dayjs(time).format()
|
||||
: dayjs(time).subtract(dayjs().utcOffset(), "minutes").format();
|
||||
|
||||
return (
|
||||
<Group gap={5}>
|
||||
<DatesProvider settings={{ timezone: useLocalTime ? undefined : "UTC" }}>
|
||||
<DateTimePicker
|
||||
title="End time"
|
||||
w={230}
|
||||
valueFormat="YYYY-MM-DD HH:mm:ss"
|
||||
withSeconds
|
||||
// clearable
|
||||
value={time !== null ? new Date(time) : undefined}
|
||||
onChange={(value) => onChangeTime(value ? value.getTime() : null)}
|
||||
aria-label={description}
|
||||
placeholder={description}
|
||||
onClick={() => {
|
||||
if (time === null) {
|
||||
onChangeTime(baseTime());
|
||||
}
|
||||
}}
|
||||
leftSection={
|
||||
<DateTimePicker
|
||||
title="End time"
|
||||
w={230}
|
||||
valueFormat="YYYY-MM-DD HH:mm:ss"
|
||||
withSeconds
|
||||
value={time !== null ? dateString : undefined}
|
||||
onChange={(value) =>
|
||||
onChangeTime(
|
||||
value
|
||||
? useLocalTime
|
||||
? new Date(value).getTime()
|
||||
: dayjs.utc(value).valueOf()
|
||||
: null
|
||||
)
|
||||
}
|
||||
aria-label={description}
|
||||
placeholder={description}
|
||||
onClick={() => {
|
||||
if (time === null) {
|
||||
onChangeTime(baseTime());
|
||||
}
|
||||
}}
|
||||
leftSection={
|
||||
<ActionIcon
|
||||
size="lg"
|
||||
color="gray"
|
||||
variant="transparent"
|
||||
title="Decrease time"
|
||||
aria-label="Decrease time"
|
||||
onClick={() => onChangeTime(baseTime() - range / 2)}
|
||||
>
|
||||
<IconChevronLeft style={iconStyle} />
|
||||
</ActionIcon>
|
||||
}
|
||||
styles={{ section: { width: "unset" } }}
|
||||
rightSection={
|
||||
<>
|
||||
{time && (
|
||||
<CloseButton
|
||||
variant="transparent"
|
||||
color="gray"
|
||||
onMouseDown={(event) => event.preventDefault()}
|
||||
tabIndex={-1}
|
||||
onClick={() => {
|
||||
onChangeTime(null);
|
||||
}}
|
||||
size="xs"
|
||||
/>
|
||||
)}
|
||||
<ActionIcon
|
||||
size="lg"
|
||||
color="gray"
|
||||
variant="transparent"
|
||||
title="Decrease time"
|
||||
aria-label="Decrease time"
|
||||
onClick={() => onChangeTime(baseTime() - range / 2)}
|
||||
title="Increase time"
|
||||
aria-label="Increase time"
|
||||
onClick={() => onChangeTime(baseTime() + range / 2)}
|
||||
>
|
||||
<IconChevronLeft style={iconStyle} />
|
||||
<IconChevronRight style={iconStyle} />
|
||||
</ActionIcon>
|
||||
}
|
||||
styles={{ section: { width: "unset" } }}
|
||||
rightSection={
|
||||
<>
|
||||
{time && (
|
||||
<CloseButton
|
||||
variant="transparent"
|
||||
color="gray"
|
||||
onMouseDown={(event) => event.preventDefault()}
|
||||
tabIndex={-1}
|
||||
onClick={() => {
|
||||
onChangeTime(null);
|
||||
}}
|
||||
size="xs"
|
||||
/>
|
||||
)}
|
||||
<ActionIcon
|
||||
size="lg"
|
||||
color="gray"
|
||||
variant="transparent"
|
||||
title="Increase time"
|
||||
aria-label="Increase time"
|
||||
onClick={() => onChangeTime(baseTime() + range / 2)}
|
||||
>
|
||||
<IconChevronRight style={iconStyle} />
|
||||
</ActionIcon>
|
||||
</>
|
||||
}
|
||||
/>
|
||||
</DatesProvider>
|
||||
</>
|
||||
}
|
||||
/>
|
||||
</Group>
|
||||
);
|
||||
};
|
||||
|
||||
242
web/ui/package-lock.json
generated
242
web/ui/package-lock.json
generated
@ -34,11 +34,11 @@
|
||||
"@floating-ui/dom": "^1.7.4",
|
||||
"@lezer/common": "^1.2.3",
|
||||
"@lezer/highlight": "^1.2.1",
|
||||
"@mantine/code-highlight": "^7.17.8",
|
||||
"@mantine/core": "^7.17.8",
|
||||
"@mantine/dates": "^7.17.8",
|
||||
"@mantine/hooks": "^7.17.8",
|
||||
"@mantine/notifications": "^7.17.8",
|
||||
"@mantine/code-highlight": "^8.3.5",
|
||||
"@mantine/core": "^8.3.5",
|
||||
"@mantine/dates": "^8.3.5",
|
||||
"@mantine/hooks": "^8.3.5",
|
||||
"@mantine/notifications": "^8.3.5",
|
||||
"@microsoft/fetch-event-source": "^2.0.1",
|
||||
"@nexucis/fuzzy": "^0.5.1",
|
||||
"@nexucis/kvsearch": "^0.9.1",
|
||||
@ -53,6 +53,7 @@
|
||||
"@uiw/react-codemirror": "^4.25.2",
|
||||
"clsx": "^2.1.1",
|
||||
"dayjs": "^1.11.18",
|
||||
"highlight.js": "^11.11.1",
|
||||
"lodash": "^4.17.21",
|
||||
"react": "^19.1.1",
|
||||
"react-dom": "^19.1.1",
|
||||
@ -85,6 +86,105 @@
|
||||
"vitest": "^3.2.4"
|
||||
}
|
||||
},
|
||||
"mantine-ui/node_modules/@floating-ui/react": {
|
||||
"version": "0.27.16",
|
||||
"resolved": "https://registry.npmjs.org/@floating-ui/react/-/react-0.27.16.tgz",
|
||||
"integrity": "sha512-9O8N4SeG2z++TSM8QA/KTeKFBVCNEz/AGS7gWPJf6KFRzmRWixFRnCnkPHRDwSVZW6QPDO6uT0P2SpWNKCc9/g==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@floating-ui/react-dom": "^2.1.6",
|
||||
"@floating-ui/utils": "^0.2.10",
|
||||
"tabbable": "^6.0.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": ">=17.0.0",
|
||||
"react-dom": ">=17.0.0"
|
||||
}
|
||||
},
|
||||
"mantine-ui/node_modules/@mantine/code-highlight": {
|
||||
"version": "8.3.5",
|
||||
"resolved": "https://registry.npmjs.org/@mantine/code-highlight/-/code-highlight-8.3.5.tgz",
|
||||
"integrity": "sha512-KZhYPilo6hUbJf/ls0e/lCjXKWI6/cnzkMkSRLAEVLD9HrhJKIBonwQtLRFgJbLmxKu9IE9KuJjq9lA5kUJCFQ==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"clsx": "^2.1.1"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"@mantine/core": "8.3.5",
|
||||
"@mantine/hooks": "8.3.5",
|
||||
"react": "^18.x || ^19.x",
|
||||
"react-dom": "^18.x || ^19.x"
|
||||
}
|
||||
},
|
||||
"mantine-ui/node_modules/@mantine/core": {
|
||||
"version": "8.3.5",
|
||||
"resolved": "https://registry.npmjs.org/@mantine/core/-/core-8.3.5.tgz",
|
||||
"integrity": "sha512-PdVNLMgOS2vFhOujRi6/VC9ic8w3UDyKX7ftwDeJ7yQT8CiepUxfbWWYpVpnq23bdWh/7fIT2Pn1EY8r8GOk7g==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@floating-ui/react": "^0.27.16",
|
||||
"clsx": "^2.1.1",
|
||||
"react-number-format": "^5.4.4",
|
||||
"react-remove-scroll": "^2.7.1",
|
||||
"react-textarea-autosize": "8.5.9",
|
||||
"type-fest": "^4.41.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"@mantine/hooks": "8.3.5",
|
||||
"react": "^18.x || ^19.x",
|
||||
"react-dom": "^18.x || ^19.x"
|
||||
}
|
||||
},
|
||||
"mantine-ui/node_modules/@mantine/dates": {
|
||||
"version": "8.3.5",
|
||||
"resolved": "https://registry.npmjs.org/@mantine/dates/-/dates-8.3.5.tgz",
|
||||
"integrity": "sha512-LkIdC4eWPNQFv1BU1c52U3Z3RuA3yU1asvTgMEIQ/MdJsGK8GePwpgMH/jKQ8ba/AW9NfksdvtOJ6uIqPwjCkg==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"clsx": "^2.1.1"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"@mantine/core": "8.3.5",
|
||||
"@mantine/hooks": "8.3.5",
|
||||
"dayjs": ">=1.0.0",
|
||||
"react": "^18.x || ^19.x",
|
||||
"react-dom": "^18.x || ^19.x"
|
||||
}
|
||||
},
|
||||
"mantine-ui/node_modules/@mantine/hooks": {
|
||||
"version": "8.3.5",
|
||||
"resolved": "https://registry.npmjs.org/@mantine/hooks/-/hooks-8.3.5.tgz",
|
||||
"integrity": "sha512-0Wf08eWLKi3WkKlxnV1W5vfuN6wcvAV2VbhQlOy0R9nrWorGTtonQF6qqBE3PnJFYF1/ZE+HkYZQ/Dr7DmYSMQ==",
|
||||
"license": "MIT",
|
||||
"peerDependencies": {
|
||||
"react": "^18.x || ^19.x"
|
||||
}
|
||||
},
|
||||
"mantine-ui/node_modules/@mantine/notifications": {
|
||||
"version": "8.3.5",
|
||||
"resolved": "https://registry.npmjs.org/@mantine/notifications/-/notifications-8.3.5.tgz",
|
||||
"integrity": "sha512-8TvzrPxfdtOLGTalv7Ei1hy2F6KbR3P7/V73yw3AOKhrf1ydS89sqV2ShbsucHGJk9Pto0wjdTPd8Q7pm5MAYw==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@mantine/store": "8.3.5",
|
||||
"react-transition-group": "4.4.5"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"@mantine/core": "8.3.5",
|
||||
"@mantine/hooks": "8.3.5",
|
||||
"react": "^18.x || ^19.x",
|
||||
"react-dom": "^18.x || ^19.x"
|
||||
}
|
||||
},
|
||||
"mantine-ui/node_modules/@mantine/store": {
|
||||
"version": "8.3.5",
|
||||
"resolved": "https://registry.npmjs.org/@mantine/store/-/store-8.3.5.tgz",
|
||||
"integrity": "sha512-qN4fFsDMy86IV9oh1gZlDTv41RAsO0grjx90FGyT5QCv7NTgcavwxB74GBkhp45W8xn+Ms/awKy+6NxnmLmW1w==",
|
||||
"license": "MIT",
|
||||
"peerDependencies": {
|
||||
"react": "^18.x || ^19.x"
|
||||
}
|
||||
},
|
||||
"module/codemirror-promql": {
|
||||
"name": "@prometheus-io/codemirror-promql",
|
||||
"version": "0.307.3",
|
||||
@ -1449,26 +1549,13 @@
|
||||
"@floating-ui/utils": "^0.2.10"
|
||||
}
|
||||
},
|
||||
"node_modules/@floating-ui/react": {
|
||||
"version": "0.26.28",
|
||||
"resolved": "https://registry.npmjs.org/@floating-ui/react/-/react-0.26.28.tgz",
|
||||
"integrity": "sha512-yORQuuAtVpiRjpMhdc0wJj06b9JFjrYF4qp96j++v2NBpbi6SEGF7donUJ3TMieerQ6qVkAv1tgr7L4r5roTqw==",
|
||||
"dependencies": {
|
||||
"@floating-ui/react-dom": "^2.1.2",
|
||||
"@floating-ui/utils": "^0.2.8",
|
||||
"tabbable": "^6.0.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": ">=16.8.0",
|
||||
"react-dom": ">=16.8.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@floating-ui/react-dom": {
|
||||
"version": "2.1.2",
|
||||
"resolved": "https://registry.npmjs.org/@floating-ui/react-dom/-/react-dom-2.1.2.tgz",
|
||||
"integrity": "sha512-06okr5cgPzMNBy+Ycse2A6udMi4bqwW/zgBF/rwjcNqWkyr82Mcg8b0vjX8OJpZFy/FKjJmw6wV7t44kK6kW7A==",
|
||||
"version": "2.1.6",
|
||||
"resolved": "https://registry.npmjs.org/@floating-ui/react-dom/-/react-dom-2.1.6.tgz",
|
||||
"integrity": "sha512-4JX6rEatQEvlmgU80wZyq9RT96HZJa88q8hp0pBd+LrczeDI4o6uA2M+uvxngVHo4Ihr8uibXxH6+70zhAFrVw==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@floating-ui/dom": "^1.0.0"
|
||||
"@floating-ui/dom": "^1.7.4"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": ">=16.8.0",
|
||||
@ -2098,91 +2185,6 @@
|
||||
"@lezer/common": "^1.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@mantine/code-highlight": {
|
||||
"version": "7.17.8",
|
||||
"resolved": "https://registry.npmjs.org/@mantine/code-highlight/-/code-highlight-7.17.8.tgz",
|
||||
"integrity": "sha512-KfdLi8MhpoeHiXkLMfuPQz1IDTUjvP2w3hbdx8Oz/hL0o+mbPYfgrU/w/D3ONjVQMoEbPpEL5vSA2eTYCmwVKg==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"clsx": "^2.1.1",
|
||||
"highlight.js": "^11.10.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"@mantine/core": "7.17.8",
|
||||
"@mantine/hooks": "7.17.8",
|
||||
"react": "^18.x || ^19.x",
|
||||
"react-dom": "^18.x || ^19.x"
|
||||
}
|
||||
},
|
||||
"node_modules/@mantine/core": {
|
||||
"version": "7.17.8",
|
||||
"resolved": "https://registry.npmjs.org/@mantine/core/-/core-7.17.8.tgz",
|
||||
"integrity": "sha512-42sfdLZSCpsCYmLCjSuntuPcDg3PLbakSmmYfz5Auea8gZYLr+8SS5k647doVu0BRAecqYOytkX2QC5/u/8VHw==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@floating-ui/react": "^0.26.28",
|
||||
"clsx": "^2.1.1",
|
||||
"react-number-format": "^5.4.3",
|
||||
"react-remove-scroll": "^2.6.2",
|
||||
"react-textarea-autosize": "8.5.9",
|
||||
"type-fest": "^4.27.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"@mantine/hooks": "7.17.8",
|
||||
"react": "^18.x || ^19.x",
|
||||
"react-dom": "^18.x || ^19.x"
|
||||
}
|
||||
},
|
||||
"node_modules/@mantine/dates": {
|
||||
"version": "7.17.8",
|
||||
"resolved": "https://registry.npmjs.org/@mantine/dates/-/dates-7.17.8.tgz",
|
||||
"integrity": "sha512-KYog/YL83PnsMef7EZagpOFq9I2gfnK0eYSzC8YvV9Mb6t/x9InqRssGWVb0GIr+TNILpEkhKoGaSKZNy10Q1g==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"clsx": "^2.1.1"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"@mantine/core": "7.17.8",
|
||||
"@mantine/hooks": "7.17.8",
|
||||
"dayjs": ">=1.0.0",
|
||||
"react": "^18.x || ^19.x",
|
||||
"react-dom": "^18.x || ^19.x"
|
||||
}
|
||||
},
|
||||
"node_modules/@mantine/hooks": {
|
||||
"version": "7.17.8",
|
||||
"resolved": "https://registry.npmjs.org/@mantine/hooks/-/hooks-7.17.8.tgz",
|
||||
"integrity": "sha512-96qygbkTjRhdkzd5HDU8fMziemN/h758/EwrFu7TlWrEP10Vw076u+Ap/sG6OT4RGPZYYoHrTlT+mkCZblWHuw==",
|
||||
"license": "MIT",
|
||||
"peerDependencies": {
|
||||
"react": "^18.x || ^19.x"
|
||||
}
|
||||
},
|
||||
"node_modules/@mantine/notifications": {
|
||||
"version": "7.17.8",
|
||||
"resolved": "https://registry.npmjs.org/@mantine/notifications/-/notifications-7.17.8.tgz",
|
||||
"integrity": "sha512-/YK16IZ198W6ru/IVecCtHcVveL08u2c8TbQTu/2p26LSIM9AbJhUkrU6H+AO0dgVVvmdmNdvPxcJnfq3S9TMg==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@mantine/store": "7.17.8",
|
||||
"react-transition-group": "4.4.5"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"@mantine/core": "7.17.8",
|
||||
"@mantine/hooks": "7.17.8",
|
||||
"react": "^18.x || ^19.x",
|
||||
"react-dom": "^18.x || ^19.x"
|
||||
}
|
||||
},
|
||||
"node_modules/@mantine/store": {
|
||||
"version": "7.17.8",
|
||||
"resolved": "https://registry.npmjs.org/@mantine/store/-/store-7.17.8.tgz",
|
||||
"integrity": "sha512-/FrB6PAVH4NEjQ1dsc9qOB+VvVlSuyjf4oOOlM9gscPuapDP/79Ryq7JkhHYfS55VWQ/YUlY24hDI2VV+VptXg==",
|
||||
"license": "MIT",
|
||||
"peerDependencies": {
|
||||
"react": "^18.x || ^19.x"
|
||||
}
|
||||
},
|
||||
"node_modules/@marijn/find-cluster-break": {
|
||||
"version": "1.0.2",
|
||||
"resolved": "https://registry.npmjs.org/@marijn/find-cluster-break/-/find-cluster-break-1.0.2.tgz",
|
||||
@ -5259,9 +5261,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/highlight.js": {
|
||||
"version": "11.10.0",
|
||||
"resolved": "https://registry.npmjs.org/highlight.js/-/highlight.js-11.10.0.tgz",
|
||||
"integrity": "sha512-SYVnVFswQER+zu1laSya563s+F8VDGt7o35d4utbamowvUNLLMovFqwCLSocpZTz3MgaSRA1IbqRWZv97dtErQ==",
|
||||
"version": "11.11.1",
|
||||
"resolved": "https://registry.npmjs.org/highlight.js/-/highlight.js-11.11.1.tgz",
|
||||
"integrity": "sha512-Xwwo44whKBVCYoliBQwaPvtd/2tYFkRQtXDWj1nackaV2JPXx3L0+Jvd8/qCJ2p+ML0/XVkJ2q+Mr+UVdpJK5w==",
|
||||
"license": "BSD-3-Clause",
|
||||
"engines": {
|
||||
"node": ">=12.0.0"
|
||||
@ -7814,9 +7816,10 @@
|
||||
"peer": true
|
||||
},
|
||||
"node_modules/react-number-format": {
|
||||
"version": "5.4.3",
|
||||
"resolved": "https://registry.npmjs.org/react-number-format/-/react-number-format-5.4.3.tgz",
|
||||
"integrity": "sha512-VCY5hFg/soBighAoGcdE+GagkJq0230qN6jcS5sp8wQX1qy1fYN/RX7/BXkrs0oyzzwqR8/+eSUrqXbGeywdUQ==",
|
||||
"version": "5.4.4",
|
||||
"resolved": "https://registry.npmjs.org/react-number-format/-/react-number-format-5.4.4.tgz",
|
||||
"integrity": "sha512-wOmoNZoOpvMminhifQYiYSTCLUDOiUbBunrMrMjA+dV52sY+vck1S4UhR6PkgnoCquvvMSeJjErXZ4qSaWCliA==",
|
||||
"license": "MIT",
|
||||
"peerDependencies": {
|
||||
"react": "^0.14 || ^15.0.0 || ^16.0.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
|
||||
"react-dom": "^0.14 || ^15.0.0 || ^16.0.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
|
||||
@ -7856,15 +7859,16 @@
|
||||
}
|
||||
},
|
||||
"node_modules/react-remove-scroll": {
|
||||
"version": "2.6.2",
|
||||
"resolved": "https://registry.npmjs.org/react-remove-scroll/-/react-remove-scroll-2.6.2.tgz",
|
||||
"integrity": "sha512-KmONPx5fnlXYJQqC62Q+lwIeAk64ws/cUw6omIumRzMRPqgnYqhSSti99nbj0Ry13bv7dF+BKn7NB+OqkdZGTw==",
|
||||
"version": "2.7.1",
|
||||
"resolved": "https://registry.npmjs.org/react-remove-scroll/-/react-remove-scroll-2.7.1.tgz",
|
||||
"integrity": "sha512-HpMh8+oahmIdOuS5aFKKY6Pyog+FNaZV/XyJOq7b4YFwsFHe5yYfdbIalI4k3vU2nSDql7YskmUseHsRrJqIPA==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"react-remove-scroll-bar": "^2.3.7",
|
||||
"react-style-singleton": "^2.2.1",
|
||||
"react-style-singleton": "^2.2.3",
|
||||
"tslib": "^2.1.0",
|
||||
"use-callback-ref": "^1.3.3",
|
||||
"use-sidecar": "^1.1.2"
|
||||
"use-sidecar": "^1.1.3"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=10"
|
||||
|
||||
315
web/ui/react-app/package-lock.json
generated
315
web/ui/react-app/package-lock.json
generated
File diff suppressed because it is too large
Load Diff
Loading…
x
Reference in New Issue
Block a user