@12-apps/ui 6.33.1 → 6.34.0

package/dist/chunk-FTCCYWF4.js

@@ -1,242 +0,0 @@
-import {
-  AppHeaderBrand
-} from "./chunk-H37GIAAM.js";
-import {
-  accentFor
-} from "./chunk-XCP5L665.js";
-
-// src/components/navigation/AppHeader/AppHeader.identity.tsx
-import KeyboardArrowDown from "@mui/icons-material/KeyboardArrowDown";
-import Box from "@mui/material/Box/index.js";
-import Skeleton from "@mui/material/Skeleton/index.js";
-import Typography from "@mui/material/Typography/index.js";
-import { useTheme } from "@mui/material/styles/index.js";
-import React from "react";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-var TITLE_PX = { xs: 14, sm: 15, md: 17, lg: 20, xl: 24 };
-var ONE_LINE = {
-  minWidth: 0,
-  overflow: "hidden",
-  textOverflow: "ellipsis",
-  whiteSpace: "nowrap"
-};
-var AppHeaderStatus = ({
-  tone,
-  items,
-  separator = "\xB7",
-  className,
-  dataTestId = "app-header-status"
-}) => {
-  const theme = useTheme();
-  const visible = items.filter((item) => item !== null && item !== void 0 && item !== "");
-  if (visible.length === 0) return null;
-  return /* @__PURE__ */ jsxs(
-    Box,
-    {
-      className,
-      "data-testid": dataTestId,
-      sx: { display: "flex", alignItems: "center", gap: 0.75, ...ONE_LINE },
-      children: [
-        tone && /* @__PURE__ */ jsx(
-          Box,
-          {
-            "aria-hidden": true,
-            "data-testid": `${dataTestId}-dot`,
-            sx: {
-              width: 8,
-              height: 8,
-              flex: "0 0 auto",
-              borderRadius: "50%",
-              backgroundColor: accentFor(theme, tone).main
-            }
-          }
-        ),
-        /* @__PURE__ */ jsx(Typography, { variant: "body2", color: "text.secondary", component: "span", sx: ONE_LINE, children: visible.map((item, index) => (
-          // Index keys: the segments are positional presentation, and nothing
-          // here reorders or is keyed on identity elsewhere.
-          /* @__PURE__ */ jsxs(React.Fragment, { children: [
-            index > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
-              " ",
-              /* @__PURE__ */ jsx(Box, { component: "span", "aria-hidden": true, children: separator }),
-              " "
-            ] }),
-            item
-          ] }, index)
-        )) })
-      ]
-    }
-  );
-};
-AppHeaderStatus.displayName = "AppHeaderStatus";
-var IdentityTitle = ({ title, size = "md", interactive, disclosed, dataTestId }) => /* @__PURE__ */ jsxs(Box, { sx: { display: "flex", alignItems: "center", gap: 0.25, minWidth: 0, width: "100%" }, children: [
-  /* @__PURE__ */ jsx(
-    Typography,
-    {
-      component: "span",
-      "data-testid": `${dataTestId}-title`,
-      sx: { fontSize: TITLE_PX[size], fontWeight: 700, lineHeight: 1.2, ...ONE_LINE },
-      children: title
-    }
-  ),
-  interactive && /* @__PURE__ */ jsx(
-    KeyboardArrowDown,
-    {
-      "aria-hidden": true,
-      "data-testid": `${dataTestId}-chevron`,
-      sx: {
-        flex: "0 0 auto",
-        fontSize: 20,
-        opacity: 0.7,
-        transition: "transform 150ms ease",
-        transform: disclosed ? "rotate(180deg)" : "none"
-      }
-    }
-  )
-] });
-var discloseSx = {
-  display: "flex",
-  alignItems: "center",
-  gap: 0.25,
-  width: "100%",
-  minWidth: 0,
-  appearance: "none",
-  px: 0.5,
-  mx: -0.5,
-  py: 0.25,
-  my: -0.25,
-  border: "none",
-  borderRadius: 1.5,
-  background: "none",
-  color: "inherit",
-  font: "inherit",
-  textAlign: "left",
-  cursor: "pointer",
-  // Guarded: on a touch screen an unguarded `:hover` sticks after the tap that
-  // opened the panel, so the row stays highlighted behind it.
-  "@media (hover: hover)": { "&:hover": { backgroundColor: "action.hover" } },
-  "&:focus-visible": { outline: "2px solid", outlineColor: "primary.main", outlineOffset: 2 }
-};
-var IdentityText = ({
-  title,
-  subtitle,
-  status,
-  size = "md",
-  onDisclose,
-  disclosed,
-  discloseLabel,
-  className,
-  dataTestId
-}) => {
-  const name = /* @__PURE__ */ jsx(
-    IdentityTitle,
-    {
-      title,
-      size,
-      interactive: Boolean(onDisclose),
-      disclosed,
-      dataTestId
-    }
-  );
-  return /* @__PURE__ */ jsxs(Box, { sx: { minWidth: 0, flex: 1, display: "flex", flexDirection: "column", gap: 0.25 }, children: [
-    onDisclose ? /* @__PURE__ */ jsx(
-      Box,
-      {
-        component: "button",
-        type: "button",
-        className,
-        "data-testid": dataTestId,
-        onClick: onDisclose,
-        "aria-haspopup": "dialog",
-        "aria-expanded": disclosed,
-        "aria-label": discloseLabel ?? `Detalhes de ${title}`,
-        sx: discloseSx,
-        children: name
-      }
-    ) : name,
-    subtitle && /* @__PURE__ */ jsx(Typography, { variant: "body2", color: "text.secondary", component: "span", sx: ONE_LINE, children: subtitle }),
-    status
-  ] });
-};
-var IdentitySkeleton = ({
-  size,
-  dataTestId
-}) => /* @__PURE__ */ jsxs(
-  Box,
-  {
-    "data-testid": `${dataTestId}-loading`,
-    sx: { display: "flex", alignItems: "center", gap: 1.25, minWidth: 0 },
-    children: [
-      /* @__PURE__ */ jsx(Skeleton, { variant: "rounded", width: 40, height: 40, sx: { flex: "0 0 auto" } }),
-      /* @__PURE__ */ jsxs(Box, { sx: { minWidth: 0, flex: 1 }, children: [
-        /* @__PURE__ */ jsx(Skeleton, { variant: "text", width: 140, height: TITLE_PX[size] * 1.4 }),
-        /* @__PURE__ */ jsx(Skeleton, { variant: "text", width: 180, height: 16 })
-      ] })
-    ]
-  }
-);
-var rowSx = {
-  display: "flex",
-  alignItems: "center",
-  gap: 1.25,
-  width: "100%",
-  minWidth: 0,
-  textAlign: "left"
-};
-var AppHeaderIdentity = ({
-  title,
-  subtitle,
-  status,
-  mark,
-  logoUrl,
-  seedColor,
-  onDisclose,
-  disclosed = false,
-  discloseLabel,
-  loading = false,
-  size = "md",
-  className,
-  dataTestId = "app-header-identity"
-}) => {
-  if (loading) return /* @__PURE__ */ jsx(IdentitySkeleton, { size, dataTestId });
-  return /* @__PURE__ */ jsxs(
-    Box,
-    {
-      className: onDisclose ? void 0 : className,
-      "data-testid": onDisclose ? void 0 : dataTestId,
-      sx: rowSx,
-      children: [
-        mark ?? /* @__PURE__ */ jsx(
-          AppHeaderBrand,
-          {
-            name: title,
-            logoUrl,
-            seedColor,
-            size,
-            dataTestId: `${dataTestId}-brand`
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          IdentityText,
-          {
-            title,
-            subtitle,
-            status,
-            size,
-            onDisclose,
-            disclosed,
-            discloseLabel,
-            className,
-            dataTestId
-          }
-        )
-      ]
-    }
-  );
-};
-AppHeaderIdentity.displayName = "AppHeaderIdentity";
-
-export {
-  AppHeaderStatus,
-  AppHeaderIdentity
-};
-//# sourceMappingURL=chunk-FTCCYWF4.js.map

package/dist/chunk-FYFIND6O.js

@@ -1,227 +0,0 @@
-import {
-  getColorFromTheme,
-  textareaEmphasisStyles
-} from "./chunk-NARIG5FL.js";
-import {
-  fieldBorder
-} from "./chunk-CGO452DC.js";
-import {
-  fieldRadius
-} from "./chunk-GDN2LUTZ.js";
-import {
-  fieldEdge
-} from "./chunk-7FDU3FIN.js";
-import {
-  FIELD_BORDER_WIDTH
-} from "./chunk-PZBK3F52.js";
-
-// src/components/form/Textarea/Textarea.tsx
-import Box from "@mui/material/Box/index.js";
-import FormHelperText from "@mui/material/FormHelperText/index.js";
-import InputLabel from "@mui/material/InputLabel/index.js";
-import TextareaAutosize from "@mui/material/TextareaAutosize/index.js";
-import { alpha, styled } from "@mui/material/styles/index.js";
-import { lazy, Suspense, useState } from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
-var TextareaRichEditor = lazy(async () => ({
-  default: (await import("./_internal/components/form/Textarea/TextareaRichEditor.js")).TextareaRichEditor
-}));
-var StyledTextarea = styled(TextareaAutosize, {
-  shouldForwardProp: (prop) => !["customVariant", "customColor", "customSize", "glow", "glass", "gradient", "error"].includes(
-    prop
-  )
-})(({
-  theme,
-  customVariant,
-  customColor = "primary",
-  customSize = "md",
-  glow,
-  glass,
-  gradient,
-  error
-}) => {
-  if (!theme) return {};
-  const colorPalette = getColorFromTheme(theme, customColor);
-  const errorColor = theme.palette.error;
-  const sizeMap = {
-    xs: { padding: "6px 8px", fontSize: "0.75rem", minHeight: "60px" },
-    sm: { padding: "8px 10px", fontSize: "0.875rem", minHeight: "80px" },
-    md: { padding: "10px 12px", fontSize: "1rem", minHeight: "100px" },
-    lg: { padding: "12px 14px", fontSize: "1.125rem", minHeight: "120px" },
-    xl: { padding: "14px 16px", fontSize: "1.25rem", minHeight: "140px" }
-  };
-  const baseStyles = {
-    width: "100%",
-    fontFamily: theme.typography.fontFamily,
-    borderRadius: fieldRadius(theme),
-    border: error ? `${FIELD_BORDER_WIDTH}px solid ${errorColor.main}` : fieldBorder(theme),
-    backgroundColor: theme.palette.background.paper,
-    color: theme.palette.text.primary,
-    transition: "all 0.3s ease",
-    resize: customVariant === "resizable" ? "vertical" : "none",
-    outline: "none",
-    ...sizeMap[customSize],
-    "&::placeholder": {
-      color: theme.palette.text.secondary,
-      opacity: 0.7
-    },
-    "&:hover": {
-      borderColor: error ? errorColor.dark : colorPalette.main,
-      backgroundColor: alpha(theme.palette.background.paper, 0.8)
-    },
-    // Focus is two pixels, like every other field's: the second is an inset
-    // shadow, so the 1px resting border can thicken without the box moving.
-    "&:focus": {
-      borderColor: error ? errorColor.main : colorPalette.main,
-      backgroundColor: theme.palette.background.paper,
-      boxShadow: `inset 0 0 0 1px ${error ? errorColor.main : colorPalette.main}, 0 0 0 3px ${alpha(error ? errorColor.main : colorPalette.main, 0.1)}`
-    }
-  };
-  return {
-    ...baseStyles,
-    ...textareaEmphasisStyles({ theme, colorPalette, glass, gradient, glow })
-  };
-});
-var StyledLabel = styled(InputLabel, {
-  shouldForwardProp: (prop) => !["glass", "error"].includes(prop)
-})(({ theme, glass, error }) => ({
-  marginBottom: theme.spacing(1),
-  fontWeight: 500,
-  color: error ? theme.palette.error.main : theme.palette.text.primary,
-  ...glass && {
-    backgroundColor: alpha(theme.palette.background.paper, 0.1),
-    backdropFilter: "blur(10px)",
-    padding: "4px 8px",
-    borderRadius: "4px",
-    border: `1px solid ${fieldEdge(theme)}`,
-    display: "inline-block"
-  }
-}));
-var ICON_GUTTER = "40px";
-var TEXTAREA_DEFAULTS = {
-  variant: "default",
-  color: "primary",
-  size: "md",
-  error: false,
-  glassLabel: false,
-  glow: false,
-  glass: false,
-  gradient: false,
-  iconPosition: "start",
-  minRows: 3
-};
-var definedProps = (props) => Object.fromEntries(
-  Object.entries(props).filter(([, value]) => value !== void 0)
-);
-var TextareaShell = ({ testId, label, glassLabel, error, helperText, children }) => /* @__PURE__ */ jsxs(
-  Box,
-  {
-    sx: { position: "relative", width: "100%" },
-    "data-testid": testId ? `${testId}-wrapper` : void 0,
-    children: [
-      label && /* @__PURE__ */ jsx(StyledLabel, { glass: glassLabel, error, children: label }),
-      children,
-      helperText && /* @__PURE__ */ jsx(FormHelperText, { error, sx: { mt: 1 }, children: helperText })
-    ]
-  }
-);
-var TextareaIcon = ({ icon, iconPosition }) => /* @__PURE__ */ jsx(
-  Box,
-  {
-    sx: {
-      position: "absolute",
-      top: "12px",
-      ...iconPosition === "start" ? { left: "12px" } : { right: "12px" },
-      color: "text.secondary",
-      pointerEvents: "none",
-      zIndex: 1
-    },
-    children: icon
-  }
-);
-function RichVariant({
-  shell,
-  editor
-}) {
-  return /* @__PURE__ */ jsx(TextareaShell, { ...shell, children: /* @__PURE__ */ jsx(Suspense, { fallback: null, children: /* @__PURE__ */ jsx(TextareaRichEditor, { ...editor }) }) });
-}
-var Textarea = (textareaProps) => {
-  const {
-    variant,
-    color,
-    size,
-    error,
-    helperText,
-    label,
-    glassLabel,
-    glow,
-    glass,
-    gradient,
-    icon,
-    iconPosition,
-    minRows,
-    maxRows,
-    style,
-    "data-testid": dataTestId,
-    dataTestId: dataTestIdCamelCase,
-    ...props
-  } = { ...TEXTAREA_DEFAULTS, ...definedProps(textareaProps) };
-  const { richEditorCopy } = textareaProps;
-  const [richTextValue, setRichTextValue] = useState("");
-  const hasIcon = Boolean(icon);
-  const testId = dataTestId || dataTestIdCamelCase;
-  const textareaStyle = {
-    ...style,
-    // Same gap either side; only which side it applies to changes. The previous
-    // version had `iconPosition === 'start' ? '40px' : '40px'`, a ternary whose
-    // two branches were identical.
-    ...hasIcon && {
-      [iconPosition === "start" ? "paddingLeft" : "paddingRight"]: ICON_GUTTER
-    }
-  };
-  if (variant === "rich" && richEditorCopy) {
-    return /* @__PURE__ */ jsx(
-      RichVariant,
-      {
-        shell: { testId, label, glassLabel, error, helperText },
-        editor: {
-          copy: richEditorCopy,
-          value: richTextValue,
-          onChange: setRichTextValue,
-          placeholder: props.placeholder,
-          error,
-          glass,
-          color,
-          characterLimit: props.maxLength
-        }
-      }
-    );
-  }
-  return /* @__PURE__ */ jsx(TextareaShell, { testId, label, glassLabel, error, helperText, children: /* @__PURE__ */ jsxs(Box, { sx: { position: "relative" }, children: [
-    hasIcon && /* @__PURE__ */ jsx(TextareaIcon, { icon, iconPosition }),
-    /* @__PURE__ */ jsx(
-      StyledTextarea,
-      {
-        customVariant: variant,
-        customColor: color,
-        customSize: size,
-        glow,
-        glass,
-        gradient,
-        error,
-        minRows: variant === "autosize" ? minRows : void 0,
-        maxRows: variant === "autosize" ? maxRows : void 0,
-        style: textareaStyle,
-        "aria-label": label || props["aria-label"],
-        "data-testid": testId,
-        ...props
-      }
-    )
-  ] }) });
-};
-Textarea.displayName = "Textarea";
-
-export {
-  Textarea
-};
-//# sourceMappingURL=chunk-FYFIND6O.js.map

package/dist/chunk-FYLCSCMR.js

@@ -1,166 +0,0 @@
-// src/components/navigation/NavigationMenu/NavigationMenu.styles.ts
-import { alpha, keyframes } from "@mui/material/styles/index.js";
-var slideIn = keyframes`
-  from {
-    opacity: 0;
-    transform: translateX(-20px);
-  }
-  to {
-    opacity: 1;
-    transform: translateX(0);
-  }
-`;
-var pulseGlow = keyframes`
-  0% {
-    box-shadow: 0 0 0 0 rgba(25, 118, 210, 0.4);
-  }
-  70% {
-    box-shadow: 0 0 0 10px rgba(25, 118, 210, 0);
-  }
-  100% {
-    box-shadow: 0 0 0 0 rgba(25, 118, 210, 0);
-  }
-`;
-var SIZE_STYLES = {
-  sm: (theme) => ({
-    padding: theme.spacing(1, 1.5),
-    fontSize: "0.875rem",
-    "& .MuiListItemIcon-root": { transform: "scale(0.85)" }
-  }),
-  lg: (theme) => ({
-    padding: theme.spacing(2, 2.5),
-    fontSize: "1.125rem",
-    "& .MuiListItemIcon-root": { transform: "scale(1.15)" }
-  })
-};
-var horizontalStyles = (theme) => ({
-  borderRadius: theme.spacing(1.5),
-  margin: theme.spacing(0, 0.5),
-  background: alpha(theme.palette.background.paper, 0.6),
-  backdropFilter: "blur(8px)",
-  border: `none`
-  // border: `1px solid ${alpha(theme.palette.divider, 0.1)}`,
-});
-var collapsedStyles = () => ({
-  justifyContent: "center",
-  minHeight: 56,
-  "& .MuiListItemIcon-root": {
-    margin: 0
-  }
-});
-var activeStyles = (theme, _variant) => ({
-  color: theme.palette.primary.main,
-  cursor: "default",
-  "& .MuiListItemIcon-root": {
-    color: theme.palette.primary.main
-  },
-  "&::before": {
-    opacity: 1,
-    background: `linear-gradient(135deg, ${alpha(theme.palette.primary.main, 0.2)} 0%, ${alpha(theme.palette.primary.main, 0.05)} 100%)`
-  },
-  "&:hover": {
-    background: "none",
-    transform: "none",
-    boxShadow: "none",
-    "&::before": {
-      opacity: 1
-    },
-    "& .MuiListItemIcon-root": {
-      transform: "none"
-    },
-    "& .MuiListItemText-primary": {
-      transform: "none"
-    }
-  }
-});
-var navDecorationStyles = (theme) => ({
-  "&::before": {
-    content: '""',
-    position: "absolute",
-    top: 0,
-    left: 0,
-    right: 0,
-    bottom: 0,
-    background: `linear-gradient(135deg, ${alpha(theme.palette.primary.main, 0)} 0%, ${alpha(theme.palette.primary.main, 0.08)} 100%)`,
-    opacity: 0,
-    transition: "opacity 0.3s ease"
-  },
-  "&::after": {
-    content: '""',
-    position: "absolute",
-    top: "50%",
-    left: "50%",
-    width: "100%",
-    height: "100%",
-    background: `radial-gradient(circle, ${alpha(theme.palette.primary.main, 0.3)} 0%, transparent 70%)`,
-    transform: "translate(-50%, -50%) scale(0)",
-    transition: "transform 0.6s ease",
-    borderRadius: "50%"
-  }
-});
-var navInteractionStyles = (theme, minimal, collapsed, size) => ({
-  "&:hover": minimal ? {
-    // Simple hover for minimal variant
-    backgroundColor: alpha(theme.palette.action.hover, 0.08),
-    color: theme.palette.primary.main,
-    "& .MuiListItemIcon-root": {
-      color: theme.palette.primary.main
-    }
-  } : {
-    // Fancy hover for non-minimal variant
-    background: `linear-gradient(135deg, ${alpha(theme.palette.primary.main, 0.15)} 0%, ${alpha(theme.palette.primary.main, 0.08)} 100%)`,
-    color: theme.palette.primary.main,
-    boxShadow: `0 8px 24px ${alpha(theme.palette.primary.main, 0.15)}`,
-    backgroundColor: alpha(theme.palette.primary.main, 0.04),
-    "&::before": {
-      opacity: 1
-    },
-    "& .MuiListItemIcon-root": {
-      color: theme.palette.primary.main,
-      transform: collapsed ? "scale(1.1)" : size === "sm" ? "scale(0.95) rotate(-5deg)" : size === "lg" ? "scale(1.25) rotate(-5deg)" : "scale(1.1) rotate(-5deg)",
-      transition: "all 0.3s ease"
-    },
-    "& .MuiListItemText-primary": {
-      transform: "translateX(4px)",
-      transition: "transform 0.3s ease"
-    }
-  },
-  "&:active": minimal ? {
-    // Simple active state for minimal variant
-    opacity: 0.7
-  } : {
-    // Fancy active state for non-minimal variant
-    transform: "scale(0.98)",
-    "&::after": {
-      transform: "translate(-50%, -50%) scale(2)"
-    }
-  }
-});
-var navItemButtonStyles = ({
-  theme,
-  variant,
-  active,
-  size,
-  collapsed,
-  minimal
-}) => ({
-  ...size ? SIZE_STYLES[size]?.(theme) ?? {} : {},
-  ...variant === "horizontal" ? horizontalStyles(theme) : {},
-  ...collapsed ? collapsedStyles() : {},
-  ...active ? activeStyles(theme, variant) : {},
-  ...navDecorationStyles(theme),
-  ...navInteractionStyles(theme, minimal, collapsed, size),
-  borderRadius: theme.spacing(1.5),
-  margin: theme.spacing(0.5),
-  position: "relative",
-  overflow: "hidden",
-  transition: "all 0.3s cubic-bezier(0.4, 0, 0.2, 1)",
-  transformStyle: "preserve-3d"
-});
-
-export {
-  slideIn,
-  pulseGlow,
-  navItemButtonStyles
-};
-//# sourceMappingURL=chunk-FYLCSCMR.js.map

package/dist/chunk-FYLCSCMR.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/navigation/NavigationMenu/NavigationMenu.styles.ts"],"sourcesContent":["import { alpha, keyframes } from '@mui/material/styles/index.js';\nimport type { CSSObject, Theme } from '@mui/material/styles/index.js';\n\nexport const slideIn = keyframes`\n  from {\n    opacity: 0;\n    transform: translateX(-20px);\n  }\n  to {\n    opacity: 1;\n    transform: translateX(0);\n  }\n`;\n\nexport const pulseGlow = keyframes`\n  0% {\n    box-shadow: 0 0 0 0 rgba(25, 118, 210, 0.4);\n  }\n  70% {\n    box-shadow: 0 0 0 10px rgba(25, 118, 210, 0);\n  }\n  100% {\n    box-shadow: 0 0 0 0 rgba(25, 118, 210, 0);\n  }\n`;\n\nconst SIZE_STYLES: Record<string, (theme: Theme) => CSSObject> = {\n  sm: (theme) => ({\n    padding: theme.spacing(1, 1.5),\n    fontSize: '0.875rem',\n    '& .MuiListItemIcon-root': { transform: 'scale(0.85)' },\n  }),\n  lg: (theme) => ({\n    padding: theme.spacing(2, 2.5),\n    fontSize: '1.125rem',\n    '& .MuiListItemIcon-root': { transform: 'scale(1.15)' },\n  }),\n};\n\n// Each of these applies independently of the others, so they layer rather than\n// forming a lookup.\nconst horizontalStyles = (theme: Theme): CSSObject => ({\n      borderRadius: theme.spacing(1.5),\n      margin: theme.spacing(0, 0.5),\n      background: alpha(theme.palette.background.paper, 0.6),\n      backdropFilter: 'blur(8px)',\n      border: `none`,\n      // border: `1px solid ${alpha(theme.palette.divider, 0.1)}`,\n    });\n\nconst collapsedStyles = (): CSSObject => ({\n      justifyContent: 'center',\n      minHeight: 56,\n      '& .MuiListItemIcon-root': {\n        margin: 0,\n      },\n    });\n\nconst activeStyles = (theme: Theme, _variant?: string): CSSObject => ({\n      color: theme.palette.primary.main,\n      cursor: 'default',\n\n      '& .MuiListItemIcon-root': {\n        color: theme.palette.primary.main,\n      },\n\n      '&::before': {\n        opacity: 1,\n        background: `linear-gradient(135deg, ${alpha(theme.palette.primary.main, 0.2)} 0%, ${alpha(theme.palette.primary.main, 0.05)} 100%)`,\n      },\n\n      '&:hover': {\n        background: 'none',\n        transform: 'none',\n        boxShadow: 'none',\n\n        '&::before': {\n          opacity: 1,\n        },\n\n        '& .MuiListItemIcon-root': {\n          transform: 'none',\n        },\n\n        '& .MuiListItemText-primary': {\n          transform: 'none',\n        },\n      },\n    });\n\n// Decorative sweep and glow layers behind the row.\nconst navDecorationStyles = (theme: Theme): CSSObject => ({\n  '&::before': {\n      content: '\"\"',\n      position: 'absolute',\n      top: 0,\n      left: 0,\n      right: 0,\n      bottom: 0,\n      background: `linear-gradient(135deg, ${alpha(theme.palette.primary.main, 0)} 0%, ${alpha(theme.palette.primary.main, 0.08)} 100%)`,\n      opacity: 0,\n      transition: 'opacity 0.3s ease',\n    },\n  '&::after': {\n      content: '\"\"',\n      position: 'absolute',\n      top: '50%',\n      left: '50%',\n      width: '100%',\n      height: '100%',\n      background: `radial-gradient(circle, ${alpha(theme.palette.primary.main, 0.3)} 0%, transparent 70%)`,\n      transform: 'translate(-50%, -50%) scale(0)',\n      transition: 'transform 0.6s ease',\n      borderRadius: '50%',\n    },\n});\n\n// The minimal variant deliberately skips the lift-and-glow treatment.\nconst navInteractionStyles = (\n  theme: Theme,\n  minimal?: boolean,\n  collapsed?: boolean,\n  size?: string,\n): CSSObject => ({\n  '&:hover': minimal\n      ? {\n          // Simple hover for minimal variant\n          backgroundColor: alpha(theme.palette.action.hover, 0.08),\n          color: theme.palette.primary.main,\n\n          '& .MuiListItemIcon-root': {\n            color: theme.palette.primary.main,\n          },\n        }\n      : {\n          // Fancy hover for non-minimal variant\n          background: `linear-gradient(135deg, ${alpha(theme.palette.primary.main, 0.15)} 0%, ${alpha(theme.palette.primary.main, 0.08)} 100%)`,\n          color: theme.palette.primary.main,\n          boxShadow: `0 8px 24px ${alpha(theme.palette.primary.main, 0.15)}`,\n          backgroundColor: alpha(theme.palette.primary.main, 0.04),\n\n          '&::before': {\n            opacity: 1,\n          },\n\n          '& .MuiListItemIcon-root': {\n            color: theme.palette.primary.main,\n            transform: collapsed\n              ? 'scale(1.1)'\n              : size === 'sm'\n                ? 'scale(0.95) rotate(-5deg)'\n                : size === 'lg'\n                  ? 'scale(1.25) rotate(-5deg)'\n                  : 'scale(1.1) rotate(-5deg)',\n            transition: 'all 0.3s ease',\n          },\n\n          '& .MuiListItemText-primary': {\n            transform: 'translateX(4px)',\n            transition: 'transform 0.3s ease',\n          },\n        },\n  '&:active': minimal\n      ? {\n          // Simple active state for minimal variant\n          opacity: 0.7,\n        }\n      : {\n          // Fancy active state for non-minimal variant\n          transform: 'scale(0.98)',\n          '&::after': {\n            transform: 'translate(-50%, -50%) scale(2)',\n          },\n        },\n});\n\n// The nav row's own styling: base layout plus the variant, size, collapsed and\n// minimal treatments. Lifted out so the styled() callback is a single spread.\nexport const navItemButtonStyles = ({\n  theme,\n  variant,\n  active,\n  size,\n  collapsed,\n  minimal,\n}: {\n  theme: Theme;\n  variant?: string;\n  active?: boolean;\n  size?: string;\n  collapsed?: boolean;\n  minimal?: boolean;\n}): CSSObject => ({\n  ...(size ? (SIZE_STYLES[size]?.(theme) ?? {}) : {}),\n  ...(variant === 'horizontal' ? horizontalStyles(theme) : {}),\n  ...(collapsed ? collapsedStyles() : {}),\n  ...(active ? activeStyles(theme, variant) : {}),\n  ...navDecorationStyles(theme),\n  ...navInteractionStyles(theme, minimal, collapsed, size),\n    borderRadius: theme.spacing(1.5),\n    margin: theme.spacing(0.5),\n    position: 'relative',\n    overflow: 'hidden',\n    transition: 'all 0.3s cubic-bezier(0.4, 0, 0.2, 1)',\n    transformStyle: 'preserve-3d',\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n  });\n"],"mappings":"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","names":[]}