@matteoaliano/forest-ui 0.3.5 → 0.4.0

package/dist/index.d.ts

@@ -1,6 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { Theme } from '@mui/material/styles';
-export { D as DesignTokens, P as PresetVariantConfig, T as ThemePreset, a as alpha, b as avatarColors, c as base, d as bg, e as border, f as breadcrumbColors, g as buildTheme, h as buildThemeOptions, i as buttonColors, j as chartColors, k as container, l as display, m as error, n as fg, o as focusRings, p as fontFamily, q as fontSize, r as fontWeight, s as forestAgencyPreset, t as forestExternalPreset, u as forestInternalPreset, v as forestTheme, w as forestThemeOptions, x as getAvailablePresets, y as getPreset, z as iconColors, A as info, B as lineHeight, C as navColors, E as radius, F as registerPreset, G as sliderColors, H as spacing, I as success, J as text, K as toggleColors, L as tokenShadows, M as warning, N as widths } from './index-BCXD47YU.js';
+export { DesignTokens, PresetVariantConfig, ThemePreset, alpha, avatarColors, base, bg, border, breadcrumbColors, buildTheme, buildThemeOptions, buttonColors, chartColors, container, display, error, fg, focusRings, fontFamily, fontFamilyMono, fontSize, fontWeight, forestAgencyPreset, forestExternalPreset, forestInternalPreset, forestTheme, forestThemeOptions, getAvailablePresets, getPreset, iconColors, info, lineHeight, navColors, radius, registerPreset, sliderColors, spacing, success, text, toggleColors, shadows as tokenShadows, warning, widths } from './theme.js';
 import { AutocompleteProps } from '@mui/material/Autocomplete';
 export { AutocompleteProps } from '@mui/material/Autocomplete';
 import { ButtonProps as ButtonProps$1 } from '@mui/material/Button';
@@ -82,8 +82,7 @@ import { AppBarProps } from '@mui/material/AppBar';
 export { AppBarProps } from '@mui/material/AppBar';
 import { ToolbarProps } from '@mui/material/Toolbar';
 export { ToolbarProps } from '@mui/material/Toolbar';
-import { CardProps } from '@mui/material/Card';
-export { CardProps } from '@mui/material/Card';
+import { CardProps as CardProps$1 } from '@mui/material/Card';
 import { CardContentProps } from '@mui/material/CardContent';
 export { CardContentProps } from '@mui/material/CardContent';
 import { CardHeaderProps } from '@mui/material/CardHeader';
@@ -172,7 +171,7 @@ declare function Fab({ color, ...props }: FabProps): react_jsx_runtime.JSX.Eleme
 declare function RadioGroup(props: RadioGroupProps): react_jsx_runtime.JSX.Element;
 declare function Radio(props: RadioProps): react_jsx_runtime.JSX.Element;
 
-declare function Select<Value = unknown>(props: SelectProps<Value>): react_jsx_runtime.JSX.Element;
+declare function Select<Value = unknown>({ onClose, ...props }: SelectProps<Value>): react_jsx_runtime.JSX.Element;
 declare function MenuItem(props: MenuItemProps): react_jsx_runtime.JSX.Element;
 
 interface MultiSelectOption {
@@ -231,7 +230,17 @@ declare function DatePicker(props: DatePickerProps): react_jsx_runtime.JSX.Eleme
 
 declare function Badge(props: BadgeProps): react_jsx_runtime.JSX.Element;
 
-declare function Chip({ deleteIcon, ...props }: ChipProps): react_jsx_runtime.JSX.Element;
+declare const customChipColors: Record<string, {
+    bg: string;
+    color: string;
+    deleteIcon: string;
+}>;
+type ForestChipColor = ChipProps["color"] | keyof typeof customChipColors;
+interface ForestChipProps extends Omit<ChipProps, "color"> {
+    color?: ForestChipColor;
+}
+
+declare function Chip({ color, deleteIcon, sx, ...props }: ForestChipProps): react_jsx_runtime.JSX.Element;
 
 declare function Divider(props: DividerProps): react_jsx_runtime.JSX.Element;
 
@@ -263,8 +272,21 @@ declare function AccordionActions(props: AccordionActionsProps): react_jsx_runti
 
 declare function AppBar(props: AppBarProps): react_jsx_runtime.JSX.Element;
 declare function Toolbar(props: ToolbarProps): react_jsx_runtime.JSX.Element;
+interface AppBarNavItemProps extends Omit<ButtonProps$1, "children" | "variant"> {
+    label: string;
+    icon?: React__default.ReactNode;
+    selected?: boolean;
+    href?: string;
+}
+declare function AppBarNavItem({ label, icon, selected, href, sx, ...props }: AppBarNavItemProps): react_jsx_runtime.JSX.Element;
+
+type ForestCardColor = "primary" | "secondary";
+interface ForestCardProps extends Omit<CardProps$1, "color"> {
+    color?: ForestCardColor;
+}
+type CardProps = ForestCardProps;
 
-declare function Card(props: CardProps): react_jsx_runtime.JSX.Element;
+declare function Card({ color, sx, ...props }: ForestCardProps): react_jsx_runtime.JSX.Element;
 declare function CardContent(props: CardContentProps): react_jsx_runtime.JSX.Element;
 declare function CardHeader(props: CardHeaderProps): react_jsx_runtime.JSX.Element;
 declare function CardActions(props: CardActionsProps): react_jsx_runtime.JSX.Element;
@@ -371,4 +393,4 @@ declare function PieChart({ series, colors, ...props }: PieChartProps): react_js
 
 declare function useChartColors(count: number): string[];
 
-export { Accordion, AccordionActions, AccordionDetails, AccordionSummary, Alert, AlertTitle, AppBar, Autocomplete, Backdrop, Badge, BarChart, type BarChartProps, Breadcrumbs, Button, ButtonGroup, type ButtonProps, Card, CardActions, CardContent, CardHeader, CardMedia, Checkbox, Chip, CircularProgress, DataGrid, DatePicker, type DatePickerProps, Dialog, DialogActions, DialogContent, DialogContentText, DialogTitle, Divider, Fab, ForestProvider, type ForestProviderProps, IconButton, type IconButtonProps, Input, type InputProps, LineChart, type LineChartProps, LinearProgress, Link, List, ListItem, ListItemAvatar, ListItemButton, ListItemIcon, ListItemText, ListSubheader, Logo, type LogoProps, Menu, MenuItem, MenuList, Modal, MultiSelect, type MultiSelectOption, type MultiSelectProps, Pagination, Paper, PieChart, type PieChartProps, Popover, Radio, RadioGroup, Search, type SearchProps, Select, SidebarItem, type SidebarItemProps, SidebarNav, type SidebarNavProps, Skeleton, Snackbar, Step, StepLabel, Stepper, Switch, Tab, Table, TableBody, TableCell, TableContainer, TableHead, TableRow, Tabs, TextField, ToggleButton, ToggleButtonGroup, Toolbar, Tooltip, Typography, useChartColors, useSidebar };
+export { Accordion, AccordionActions, AccordionDetails, AccordionSummary, Alert, AlertTitle, AppBar, AppBarNavItem, type AppBarNavItemProps, Autocomplete, Backdrop, Badge, BarChart, type BarChartProps, Breadcrumbs, Button, ButtonGroup, type ButtonProps, Card, CardActions, CardContent, CardHeader, CardMedia, type CardProps, Checkbox, Chip, CircularProgress, DataGrid, DatePicker, type DatePickerProps, Dialog, DialogActions, DialogContent, DialogContentText, DialogTitle, Divider, Fab, type ForestCardColor, type ForestChipColor, type ForestChipProps, ForestProvider, type ForestProviderProps, IconButton, type IconButtonProps, Input, type InputProps, LineChart, type LineChartProps, LinearProgress, Link, List, ListItem, ListItemAvatar, ListItemButton, ListItemIcon, ListItemText, ListSubheader, Logo, type LogoProps, Menu, MenuItem, MenuList, Modal, MultiSelect, type MultiSelectOption, type MultiSelectProps, Pagination, Paper, PieChart, type PieChartProps, Popover, Radio, RadioGroup, Search, type SearchProps, Select, SidebarItem, type SidebarItemProps, SidebarNav, type SidebarNavProps, Skeleton, Snackbar, Step, StepLabel, Stepper, Switch, Tab, Table, TableBody, TableCell, TableContainer, TableHead, TableRow, Tabs, TextField, ToggleButton, ToggleButtonGroup, Toolbar, Tooltip, Typography, useChartColors, useSidebar };

package/dist/index.js

@@ -216,45 +216,67 @@ var misc = {
     600: "#0e9384",
     700: "#107569"},
   orange: {
+    50: "#fef6ee",
     100: "#fdead7",
     200: "#f9dbaf",
     300: "#f7b27a",
-    400: "#f38744"},
+    400: "#f38744",
+    700: "#b93815"},
   purple: {
+    50: "#f4f3ff",
     100: "#ebe9fe",
     200: "#d9d6fe",
+    400: "#9b8afb",
     500: "#7a5af8",
-    600: "#6938ef"},
+    600: "#6938ef",
+    700: "#5925dc"},
   pink: {
+    50: "#fdf2fa",
     100: "#fce7f6",
     200: "#fcceee",
     400: "#f670c7",
-    500: "#ee46bc"},
+    500: "#ee46bc",
+    700: "#c11574"},
   fuchsia: {
+    50: "#fdf4ff",
     100: "#fbe8ff",
     200: "#f6d0fe",
     400: "#e478fa",
-    500: "#d444f1"},
+    500: "#d444f1",
+    700: "#9f1ab1"},
   orangeDark: {
+    50: "#fff4ed",
     100: "#ffe6d5",
     200: "#ffd6ae",
     400: "#ff692e",
-    500: "#ff4405"},
+    500: "#ff4405",
+    700: "#bc1b06"},
   green: {
+    50: "#edfcf2",
     100: "#d3f8df",
     200: "#aaf0c4",
+    400: "#3ccb7f",
     500: "#16b364",
-    600: "#099250"},
+    600: "#099250",
+    700: "#087443"},
+  indigo: {
+    50: "#eef4ff",
+    400: "#8098f9",
+    700: "#3538cd"},
   rose: {
+    50: "#fff1f3",
     100: "#ffe4e8",
     200: "#fecdd6",
     400: "#fd6f8e",
-    500: "#f63d68"},
+    500: "#f63d68",
+    700: "#c01048"},
   blueLight: {
+    50: "#f0f9ff",
     100: "#e0f2fe",
     200: "#b9e6fe",
     400: "#36bffa",
-    500: "#0ba5ec"},
+    500: "#0ba5ec",
+    700: "#026aa2"},
   cyan: {
     100: "#cff9fe",
     200: "#a5f0fc",
@@ -373,7 +395,8 @@ var focusRings = {
   error: "0px 0px 0px 4px #f044383d",
   errorShadowXs: "0px 1px 2px 0px #1018280d, 0px 0px 0px 4px #f044383d"
 };
-var fontFamily = '"Poppins", sans-serif';
+var fontFamily = '"Aeonik", sans-serif';
+var fontFamilyMono = '"Aeonik Mono", monospace';
 var fontSize = {
   xxs: 11,
   xs: 12,
@@ -729,18 +752,6 @@ function buildPalette(tokens) {
     chart: (_a = tokens.chartColors) != null ? _a : chartColors
   };
 }
-buildPalette({
-  base,
-  error,
-  warning,
-  success,
-  info,
-  text,
-  bg,
-  fg,
-  border,
-  chartColors
-});
 
 // src/theme/typography.ts
 function buildTypography(tokens) {
@@ -824,13 +835,6 @@ function buildTypography(tokens) {
     }
   };
 }
-buildTypography({
-  fontFamily,
-  display,
-  fontSize,
-  lineHeight,
-  fontWeight
-});
 
 // src/theme/shadows.ts
 function buildShadows(tokens) {
@@ -888,9 +892,6 @@ function buildShadows(tokens) {
     // 24
   ];
 }
-buildShadows({
-  shadows
-});
 
 // src/theme/components.ts
 function buildComponents(tokens) {
@@ -983,7 +984,11 @@ function buildComponents(tokens) {
     MuiIconButton: {
       styleOverrides: {
         root: {
-          borderRadius: radius5.md
+          borderRadius: radius5.md,
+          padding: 6,
+          "& .MuiSvgIcon-root": {
+            fontSize: 20
+          }
         }
       }
     },
@@ -1013,6 +1018,15 @@ function buildComponents(tokens) {
         variant: "outlined"
       }
     },
+    MuiFormControl: {
+      styleOverrides: {
+        root: {
+          "&:has(.Mui-disabled)": {
+            opacity: 0.5
+          }
+        }
+      }
+    },
     MuiInputBase: {
       styleOverrides: {
         input: {
@@ -1030,20 +1044,27 @@ function buildComponents(tokens) {
         root: {
           borderRadius: radius5.md,
           boxShadow: tokenShadows.xs,
-          "&:hover .MuiOutlinedInput-notchedOutline": {
+          "&&:hover:not(.Mui-focused):not(.Mui-disabled) .MuiOutlinedInput-notchedOutline": {
             borderColor: border5.brand
           },
-          "&.Mui-focused .MuiOutlinedInput-notchedOutline": {
+          "&&.Mui-focused .MuiOutlinedInput-notchedOutline": {
             borderColor: border5.brandSolid,
             borderWidth: 1,
             boxShadow: "none"
           },
-          "&.Mui-error .MuiOutlinedInput-notchedOutline": {
+          "&&.Mui-error:not(.Mui-focused) .MuiOutlinedInput-notchedOutline": {
             borderColor: border5.error
           },
-          "&.Mui-error.Mui-focused .MuiOutlinedInput-notchedOutline": {
+          "&&.Mui-error.Mui-focused .MuiOutlinedInput-notchedOutline": {
             borderColor: border5.errorSolid,
             boxShadow: "none"
+          },
+          "& .MuiInputAdornment-root .MuiIconButton-root": {
+            color: fg5.quaternary,
+            "&:hover": {
+              backgroundColor: bg5.primaryHover,
+              color: fg5.brandPrimary
+            }
           }
         },
         notchedOutline: {
@@ -1515,6 +1536,40 @@ function buildComponents(tokens) {
         }
       }
     },
+    // ─── Tabs ──────────────────────────────────────────────────────────
+    MuiTabs: {
+      styleOverrides: {
+        root: {
+          minHeight: 48
+        },
+        indicator: {
+          backgroundColor: fg5.brandPrimary,
+          height: 2
+        }
+      }
+    },
+    MuiTab: {
+      styleOverrides: {
+        root: {
+          minHeight: 48,
+          height: 48,
+          padding: "12px 16px",
+          fontSize: 14,
+          fontWeight: 600,
+          lineHeight: "20px",
+          textTransform: "none",
+          color: text5.tertiary,
+          borderRadius: `${radius5.md}px ${radius5.md}px 0 0`,
+          "&:hover": {
+            backgroundColor: bg5.primaryHover
+          },
+          "&.Mui-selected": {
+            color: fg5.brandPrimary,
+            backgroundColor: bg5.brandPrimary
+          }
+        }
+      }
+    },
     // ─── Chip ───────────────────────────────────────────────────────
     MuiChip: {
       styleOverrides: {
@@ -1535,15 +1590,15 @@ function buildComponents(tokens) {
         },
         colorDefault: {
           "&.MuiChip-filled": {
-            backgroundColor: gray[50],
-            color: gray[700],
-            "& .MuiChip-deleteIcon": { color: gray[400] }
+            backgroundColor: tokens.bg.secondaryHover,
+            color: tokens.fg.secondary,
+            "& .MuiChip-deleteIcon": { color: tokens.fg.quinary }
           }
         },
         colorPrimary: {
           "&.MuiChip-filled": {
             backgroundColor: tokens.bg.brandPrimary,
-            color: tokens.text.brandPrimary,
+            color: tokens.fg.brandPrimary,
             "& .MuiChip-deleteIcon": { color: tokens.fg.brandPrimary }
           }
         },
@@ -1633,13 +1688,16 @@ function buildComponents(tokens) {
       styleOverrides: {
         root: {
           backgroundColor: bg5.secondary,
-          borderBottom: `1px solid ${border5.secondary}`
+          "& .MuiTableRow-root:last-child .MuiTableCell-root": {
+            borderBottom: `1px solid ${border5.secondary}`
+          }
         }
       }
     },
     MuiTableRow: {
       styleOverrides: {
         root: {
+          backgroundColor: bg5.secondary,
           "&:last-child td, &:last-child th": {
             border: 0
           },
@@ -1995,6 +2053,7 @@ function buildComponents(tokens) {
             }
           },
           row: {
+            backgroundColor: bg5.secondary,
             "&:hover": {
               backgroundColor: bg5.primaryHover
             },
@@ -2037,7 +2096,7 @@ function buildComponents(tokens) {
             "& .MuiOutlinedInput-notchedOutline": {
               borderColor: border5.primary
             },
-            "&:hover .MuiOutlinedInput-notchedOutline": {
+            "&:hover:not(:has(.Mui-disabled)) .MuiOutlinedInput-notchedOutline": {
               borderColor: border5.brand
             },
             "& .Mui-focused .MuiOutlinedInput-notchedOutline": {
@@ -2047,7 +2106,6 @@ function buildComponents(tokens) {
             },
             "& .MuiInputAdornment-root .MuiIconButton-root": {
               color: fg5.quaternary,
-              padding: 4,
               "&:hover": {
                 backgroundColor: bg5.primaryHover,
                 color: fg5.brandPrimary
@@ -2199,21 +2257,6 @@ function buildComponents(tokens) {
     }
   };
 }
-buildComponents({
-  base,
-  error,
-  warning,
-  success,
-  info,
-  radius,
-  focusRings,
-  shadows,
-  text,
-  bg,
-  fg,
-  border,
-  buttonColors,
-  sliderColors});
 
 // src/theme/buildTheme.ts
 function buildThemeOptions(tokens) {
@@ -2490,6 +2533,7 @@ var forestExternalPreset = {
         shadows,
         focusRings: focusRings2,
         fontFamily: '"Aeonik", sans-serif',
+        fontFamilyMono: '"Aeonik Mono", monospace',
         fontSize,
         lineHeight,
         fontWeight,
@@ -2626,7 +2670,7 @@ var border3 = {
   tertiary: gray[100],
   disabled: gray[300],
   disabledSubtle: gray[200],
-  brand: colors.brand[300],
+  brand: gray[400],
   brandSolid: colors.brand[600],
   brandSolidAlt: colors.brand[600],
   error: error[300],
@@ -2786,6 +2830,7 @@ var forestAgencyPreset = {
         shadows,
         focusRings: focusRings3,
         fontFamily: '"Aeonik", sans-serif',
+        fontFamilyMono: '"Aeonik Mono", monospace',
         fontSize,
         lineHeight,
         fontWeight,
@@ -3069,6 +3114,7 @@ var forestInternalPreset = {
         shadows,
         focusRings: focusRings4,
         fontFamily: '"Aeonik", sans-serif',
+        fontFamilyMono: '"Aeonik Mono", monospace',
         fontSize,
         lineHeight,
         fontWeight,
@@ -3163,8 +3209,16 @@ function RadioGroup(props) {
 function Radio(props) {
   return /* @__PURE__ */ jsxRuntime.jsx(MuiRadio__default.default, { ...props });
 }
-function Select(props) {
-  return /* @__PURE__ */ jsxRuntime.jsx(MuiSelect__default.default, { ...props });
+function Select({ onClose, ...props }) {
+  const handleClose = (e) => {
+    onClose == null ? void 0 : onClose(e);
+    setTimeout(() => {
+      if (document.activeElement instanceof HTMLElement) {
+        document.activeElement.blur();
+      }
+    });
+  };
+  return /* @__PURE__ */ jsxRuntime.jsx(MuiSelect__default.default, { onClose: handleClose, ...props });
 }
 function MenuItem(props) {
   return /* @__PURE__ */ jsxRuntime.jsx(MuiMenuItem__default.default, { ...props });
@@ -3391,11 +3445,47 @@ function Badge(props) {
 var CloseOutlined_default = utils.createSvgIcon(/* @__PURE__ */ jsxRuntime.jsx("path", {
   d: "M19 6.41 17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"
 }), "CloseOutlined");
-function Chip({ deleteIcon = /* @__PURE__ */ jsxRuntime.jsx(CloseOutlined_default, {}), ...props }) {
+var customChipColors = {
+  teal: { bg: misc.teal[50], color: misc.teal[700], deleteIcon: misc.teal[400] },
+  orange: { bg: misc.orange[50], color: misc.orange[700], deleteIcon: misc.orange[400] },
+  purple: { bg: misc.purple[50], color: misc.purple[700], deleteIcon: misc.purple[400] },
+  pink: { bg: misc.pink[50], color: misc.pink[700], deleteIcon: misc.pink[400] },
+  fuchsia: { bg: misc.fuchsia[50], color: misc.fuchsia[700], deleteIcon: misc.fuchsia[400] },
+  orangeDark: { bg: misc.orangeDark[50], color: misc.orangeDark[700], deleteIcon: misc.orangeDark[400] },
+  green: { bg: misc.green[50], color: misc.green[700], deleteIcon: misc.green[400] },
+  indigo: { bg: misc.indigo[50], color: misc.indigo[700], deleteIcon: misc.indigo[400] },
+  rose: { bg: misc.rose[50], color: misc.rose[700], deleteIcon: misc.rose[400] },
+  blueLight: { bg: misc.blueLight[50], color: misc.blueLight[700], deleteIcon: misc.blueLight[400] }
+};
+function Chip({ color, deleteIcon = /* @__PURE__ */ jsxRuntime.jsx(CloseOutlined_default, {}), sx, ...props }) {
+  const custom = color && typeof color === "string" ? customChipColors[color] : void 0;
+  if (custom) {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      MuiChip__default.default,
+      {
+        deleteIcon,
+        ...props,
+        sx: [
+          {
+            "&.MuiChip-root": {
+              backgroundColor: custom.bg,
+              color: custom.color,
+              "& .MuiChip-deleteIcon": {
+                color: custom.deleteIcon
+              }
+            }
+          },
+          ...Array.isArray(sx) ? sx : [sx]
+        ]
+      }
+    );
+  }
   return /* @__PURE__ */ jsxRuntime.jsx(
     MuiChip__default.default,
     {
+      color,
       deleteIcon,
+      sx,
       ...props
     }
   );
@@ -3469,8 +3559,69 @@ function AppBar(props) {
 function Toolbar(props) {
   return /* @__PURE__ */ jsxRuntime.jsx(MuiToolbar__default.default, { ...props });
 }
-function Card(props) {
-  return /* @__PURE__ */ jsxRuntime.jsx(MuiCard__default.default, { ...props });
+function AppBarNavItem({
+  label,
+  icon,
+  selected = false,
+  href,
+  sx,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    MuiButton__default.default,
+    {
+      variant: "text",
+      href,
+      startIcon: icon,
+      disableElevation: true,
+      ...props,
+      sx: [
+        {
+          height: 32,
+          padding: "6px 12px",
+          fontSize: 14,
+          fontWeight: 500,
+          color: "action.active",
+          textTransform: "none",
+          boxShadow: "none",
+          "&:hover": {
+            backgroundColor: "action.hover",
+            color: "text.primary",
+            boxShadow: "none"
+          },
+          "&:focus-visible": {
+            boxShadow: "none"
+          },
+          "& .MuiButton-startIcon": {
+            marginRight: 0.5
+          }
+        },
+        selected && {
+          color: "primary.light",
+          fontWeight: 600,
+          "&:hover": {
+            backgroundColor: "action.selected",
+            color: "primary.light",
+            boxShadow: "none"
+          }
+        },
+        ...Array.isArray(sx) ? sx : [sx]
+      ],
+      children: label
+    }
+  );
+}
+function Card({ color = "primary", sx, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    MuiCard__default.default,
+    {
+      ...props,
+      sx: [
+        color === "secondary" && { backgroundColor: "background.paper" },
+        ...Array.isArray(sx) ? sx : [sx]
+      ]
+    }
+  );
 }
 function CardContent(props) {
   return /* @__PURE__ */ jsxRuntime.jsx(MuiCardContent__default.default, { ...props });
@@ -3761,10 +3912,7 @@ function CustomTooltip(props) {
         display: "flex",
         flexDirection: "column",
         gap: "12px",
-        borderTop: `1px solid ${theme.palette.divider}`,
-        borderRight: `1px solid ${theme.palette.divider}`,
-        borderBottom: `1px solid ${theme.palette.divider}`,
-        borderLeft: `4px solid ${theme.palette.chart.series[0].fg}`
+        border: `1px solid ${theme.palette.divider}`
       },
       children: [
         /* @__PURE__ */ jsxRuntime.jsx(
@@ -3774,7 +3922,8 @@ function CustomTooltip(props) {
             sx: {
               fontWeight: 600,
               color: theme.palette.text.primary,
-              marginBottom: "4px"
+              paddingBottom: "12px",
+              borderBottom: `1px solid ${theme.palette.divider}`
             },
             children: formatDate(axisValue)
           }
@@ -4074,6 +4223,7 @@ exports.AccordionSummary = AccordionSummary;
 exports.Alert = Alert;
 exports.AlertTitle = AlertTitle;
 exports.AppBar = AppBar;
+exports.AppBarNavItem = AppBarNavItem;
 exports.Autocomplete = Autocomplete;
 exports.Backdrop = Backdrop;
 exports.Badge = Badge;
@@ -4163,6 +4313,7 @@ exports.error = error;
 exports.fg = fg;
 exports.focusRings = focusRings;
 exports.fontFamily = fontFamily;
+exports.fontFamilyMono = fontFamilyMono;
 exports.fontSize = fontSize;
 exports.fontWeight = fontWeight;
 exports.forestAgencyPreset = forestAgencyPreset;