@12-apps/ui 6.11.0 → 6.11.1

package/dist/chunk-NFZANKAN.js

@@ -0,0 +1,96 @@
+import {
+  iconSx,
+  sizeConfigs
+} from "./chunk-LRC2ZU2F.js";
+import {
+  withDefaults
+} from "./chunk-HPK33ACY.js";
+
+// src/components/utility/AnimatedIcon/AnimatedIcon.tsx
+import { Box, styled } from "@mui/material";
+import { jsx } from "react/jsx-runtime";
+var AnimationContainer = styled(Box)(({ theme, ...flags }) => ({
+  ...iconSx(theme, flags)
+}));
+var DEFAULTS = {
+  variant: "none",
+  size: "md",
+  duration: 2,
+  delay: 0,
+  loop: true,
+  glow: false,
+  glass: false,
+  metallic: false,
+  gradient: false,
+  shadow: "none",
+  ripple: false,
+  neon: false,
+  holographic: false
+};
+var AnimatedIcon = (props) => {
+  const {
+    children,
+    variant,
+    size,
+    color,
+    duration,
+    delay,
+    loop,
+    glow,
+    glass,
+    glowColor,
+    metallic,
+    gradient,
+    shadow,
+    ripple,
+    neon,
+    holographic,
+    className,
+    style,
+    "aria-label": ariaLabel,
+    onClick,
+    tabIndex,
+    onFocus,
+    onBlur,
+    dataTestId
+  } = withDefaults(props, DEFAULTS);
+  const config = sizeConfigs[size] ?? sizeConfigs.md;
+  return /* @__PURE__ */ jsx(
+    AnimationContainer,
+    {
+      $size: config.size,
+      $fontSize: config.fontSize,
+      $animationVariant: variant,
+      $duration: duration,
+      $delay: delay,
+      $loop: loop,
+      $glow: glow,
+      $glass: glass,
+      $glowColor: glowColor,
+      $customColor: color,
+      $metallic: metallic,
+      $gradient: gradient,
+      $shadow: shadow,
+      $ripple: ripple,
+      $neon: neon,
+      $holographic: holographic,
+      className,
+      style,
+      role: "img",
+      "aria-label": ariaLabel || `Animated ${variant} icon`,
+      onClick,
+      tabIndex,
+      onFocus,
+      onBlur,
+      "data-testid": dataTestId,
+      children
+    }
+  );
+};
+var AnimatedIcon_default = AnimatedIcon;
+
+export {
+  AnimatedIcon,
+  AnimatedIcon_default
+};
+//# sourceMappingURL=chunk-NFZANKAN.js.map

package/dist/chunk-NFZANKAN.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/utility/AnimatedIcon/AnimatedIcon.tsx"],"sourcesContent":["import { Box, styled } from '@mui/material';\nimport type { FC } from 'react';\nimport React from 'react';\n\nimport { withDefaults } from '../../../utils/withDefaults';\n\nimport { iconSx, sizeConfigs } from './AnimatedIcon.styles';\nimport type { IconStyleFlags } from './AnimatedIcon.styles';\nimport type { AnimatedIconProps } from './AnimatedIcon.types';\n\nconst AnimationContainer = styled(Box)<IconStyleFlags>(({ theme, ...flags }) => ({\n  ...iconSx(theme, flags),\n}));\n\nconst DEFAULTS = {\n  variant: 'none',\n  size: 'md',\n  duration: 2,\n  delay: 0,\n  loop: true,\n  glow: false,\n  glass: false,\n  metallic: false,\n  gradient: false,\n  shadow: 'none',\n  ripple: false,\n  neon: false,\n  holographic: false,\n} satisfies Partial<AnimatedIconProps>;\n\ntype ResolvedProps = AnimatedIconProps & Required<Pick<AnimatedIconProps, keyof typeof DEFAULTS>>;\n\nexport const AnimatedIcon: FC<AnimatedIconProps> = (props) => {\n  const {\n    children, variant, size, color, duration, delay, loop, glow, glass, glowColor,\n    metallic, gradient, shadow, ripple, neon, holographic, className, style,\n    'aria-label': ariaLabel, onClick, tabIndex, onFocus, onBlur, dataTestId,\n  } = withDefaults(props, DEFAULTS) as ResolvedProps;\n\n  const config = sizeConfigs[size] ?? sizeConfigs.md;\n\n  return (\n    <AnimationContainer\n      $size={config.size}\n      $fontSize={config.fontSize}\n      $animationVariant={variant}\n      $duration={duration}\n      $delay={delay}\n      $loop={loop}\n      $glow={glow}\n      $glass={glass}\n      $glowColor={glowColor}\n      $customColor={color}\n      $metallic={metallic}\n      $gradient={gradient}\n      $shadow={shadow}\n      $ripple={ripple}\n      $neon={neon}\n      $holographic={holographic}\n      className={className}\n      style={style}\n      role=\"img\"\n      aria-label={ariaLabel || `Animated ${variant} icon`}\n      onClick={onClick}\n      tabIndex={tabIndex}\n      onFocus={onFocus}\n      onBlur={onBlur}\n      data-testid={dataTestId}\n    >\n      {children}\n    </AnimationContainer>\n  );\n};\n\nexport default AnimatedIcon;\n"],"mappings":";;;;;;;;;AAAA,SAAS,KAAK,cAAc;AA0CxB;AAhCJ,IAAM,qBAAqB,OAAO,GAAG,EAAkB,CAAC,EAAE,OAAO,GAAG,MAAM,OAAO;AAAA,EAC/E,GAAG,OAAO,OAAO,KAAK;AACxB,EAAE;AAEF,IAAM,WAAW;AAAA,EACf,SAAS;AAAA,EACT,MAAM;AAAA,EACN,UAAU;AAAA,EACV,OAAO;AAAA,EACP,MAAM;AAAA,EACN,MAAM;AAAA,EACN,OAAO;AAAA,EACP,UAAU;AAAA,EACV,UAAU;AAAA,EACV,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,MAAM;AAAA,EACN,aAAa;AACf;AAIO,IAAM,eAAsC,CAAC,UAAU;AAC5D,QAAM;AAAA,IACJ;AAAA,IAAU;AAAA,IAAS;AAAA,IAAM;AAAA,IAAO;AAAA,IAAU;AAAA,IAAO;AAAA,IAAM;AAAA,IAAM;AAAA,IAAO;AAAA,IACpE;AAAA,IAAU;AAAA,IAAU;AAAA,IAAQ;AAAA,IAAQ;AAAA,IAAM;AAAA,IAAa;AAAA,IAAW;AAAA,IAClE,cAAc;AAAA,IAAW;AAAA,IAAS;AAAA,IAAU;AAAA,IAAS;AAAA,IAAQ;AAAA,EAC/D,IAAI,aAAa,OAAO,QAAQ;AAEhC,QAAM,SAAS,YAAY,IAAI,KAAK,YAAY;AAEhD,SACE;AAAA,IAAC;AAAA;AAAA,MACC,OAAO,OAAO;AAAA,MACd,WAAW,OAAO;AAAA,MAClB,mBAAmB;AAAA,MACnB,WAAW;AAAA,MACX,QAAQ;AAAA,MACR,OAAO;AAAA,MACP,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,YAAY;AAAA,MACZ,cAAc;AAAA,MACd,WAAW;AAAA,MACX,WAAW;AAAA,MACX,SAAS;AAAA,MACT,SAAS;AAAA,MACT,OAAO;AAAA,MACP,cAAc;AAAA,MACd;AAAA,MACA;AAAA,MACA,MAAK;AAAA,MACL,cAAY,aAAa,YAAY,OAAO;AAAA,MAC5C;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,eAAa;AAAA,MAEZ;AAAA;AAAA,EACH;AAEJ;AAEA,IAAO,uBAAQ;","names":[]}

package/dist/chunk-NHL5ERBM.js

@@ -0,0 +1,10 @@
+// src/utils/cn.ts
+import { clsx } from "clsx";
+function cn(...inputs) {
+  return clsx(inputs);
+}
+
+export {
+  cn
+};
+//# sourceMappingURL=chunk-NHL5ERBM.js.map

package/dist/chunk-NPK5TRIC.js

@@ -0,0 +1,288 @@
+// src/components/navigation/DropdownMenu/DropdownMenu.tsx
+import ChevronRight from "@mui/icons-material/ChevronRight";
+import MoreVert from "@mui/icons-material/MoreVert";
+import {
+  alpha,
+  Box,
+  Divider,
+  ListItemIcon,
+  ListItemText,
+  Menu,
+  MenuItem,
+  Typography
+} from "@mui/material";
+import { styled } from "@mui/material";
+import React, { cloneElement, isValidElement, useRef, useState } from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+var glassTokens = (theme) => {
+  const isDark = theme.palette.mode === "dark";
+  return {
+    edge: isDark ? theme.palette.common.white : theme.palette.common.black,
+    dropShadowAlpha: isDark ? 0.4 : 0.12,
+    insetHighlightAlpha: isDark ? 0.2 : 0.8,
+    sheenAlpha: isDark ? 0.1 : 0.8
+  };
+};
+var glassMenuStyles = (theme) => {
+  const { edge, dropShadowAlpha, insetHighlightAlpha, sheenAlpha } = glassTokens(theme);
+  return {
+    backgroundColor: alpha(theme.palette.background.paper, 0.75),
+    backdropFilter: "blur(24px) saturate(1.8)",
+    WebkitBackdropFilter: "blur(24px) saturate(1.8)",
+    // Safari support
+    border: `1px solid ${alpha(edge, 0.12)}`,
+    boxShadow: [
+      `0 8px 32px ${alpha(theme.palette.common.black, dropShadowAlpha)}`,
+      `0 0 0 1px ${alpha(edge, 0.05)}`,
+      `inset 0 1px 0 ${alpha(theme.palette.common.white, insetHighlightAlpha)}`
+    ].join(", "),
+    // Enhanced glass morphism with subtle gradient overlay
+    "&::before": {
+      content: '""',
+      position: "absolute",
+      top: 0,
+      left: 0,
+      right: 0,
+      bottom: 0,
+      background: `linear-gradient(135deg, ${alpha(theme.palette.common.white, sheenAlpha)} 0%, transparent 50%)`,
+      borderRadius: "inherit",
+      pointerEvents: "none",
+      zIndex: 1
+    },
+    // Ensure content appears above the overlay
+    "& .MuiList-root": {
+      position: "relative",
+      zIndex: 2
+    }
+  };
+};
+var StyledMenu = styled(Menu, {
+  shouldForwardProp: (prop) => prop !== "customVariant" && prop !== "size"
+})(({ theme, customVariant, size }) => ({
+  "& .MuiPaper-root": {
+    minWidth: 180,
+    borderRadius: theme.spacing(1),
+    ...customVariant === "glass" && glassMenuStyles(theme),
+    ...customVariant === "minimal" && {
+      boxShadow: `0 2px 8px ${alpha(theme.palette.common.black, 0.08)}`,
+      border: `1px solid ${theme.palette.divider}`
+    },
+    ...size === "sm" && {
+      "& .MuiMenuItem-root": {
+        fontSize: "0.875rem",
+        minHeight: 32,
+        padding: theme.spacing(0.75, 2)
+      }
+    },
+    ...size === "lg" && {
+      "& .MuiMenuItem-root": {
+        fontSize: "1.125rem",
+        minHeight: 48,
+        padding: theme.spacing(1.5, 3)
+      }
+    }
+  }
+}));
+var StyledMenuItem = styled(MenuItem, {
+  shouldForwardProp: (prop) => !["color", "showIconSpace"].includes(prop)
+})(({ theme, color, showIconSpace }) => ({
+  borderRadius: theme.spacing(0.5),
+  margin: theme.spacing(0.5, 1),
+  transition: "all 0.2s ease",
+  ...showIconSpace && {
+    paddingLeft: theme.spacing(5)
+  },
+  "&:hover": {
+    backgroundColor: alpha(theme.palette.primary.main, 0.08)
+  },
+  ...color && color !== "default" && {
+    color: theme.palette[color]?.main || theme.palette.text.primary,
+    "& .MuiListItemIcon-root": {
+      color: theme.palette[color]?.main || theme.palette.text.primary
+    },
+    "&:hover": {
+      backgroundColor: alpha(
+        theme.palette[color]?.main || theme.palette.primary.main,
+        0.08
+      )
+    }
+  }
+}));
+var MenuHeader = styled(Typography)(({ theme }) => ({
+  padding: theme.spacing(1, 2),
+  fontSize: "0.75rem",
+  fontWeight: 600,
+  textTransform: "uppercase",
+  color: theme.palette.text.secondary,
+  letterSpacing: 0.5
+}));
+var ShortcutText = styled(Typography)(({ theme }) => ({
+  fontSize: "0.75rem",
+  color: theme.palette.text.secondary,
+  marginLeft: "auto",
+  paddingLeft: theme.spacing(2)
+}));
+var renderMenuItem = (item, handleItemClick, showIconSpace, size) => {
+  if (item.type === "divider") {
+    return /* @__PURE__ */ jsx(Divider, { sx: { my: 0.5 } }, item.id);
+  }
+  if (item.type === "header") {
+    return /* @__PURE__ */ jsx(MenuHeader, { children: item.label }, item.id);
+  }
+  if (item.component) {
+    return /* @__PURE__ */ jsx(Box, { sx: { px: 2, py: 1 }, children: item.component }, item.id);
+  }
+  return renderLeafMenuItem(item, handleItemClick, showIconSpace, size);
+};
+var renderLeafMenuItem = (item, handleItemClick, showIconSpace, size) => {
+  const hasIcon = !!item.icon;
+  const hasChildren = item.children && item.children.length > 0;
+  return /* @__PURE__ */ jsxs(
+    StyledMenuItem,
+    {
+      disabled: item.disabled,
+      onClick: !item.disabled ? () => handleItemClick(item) : void 0,
+      color: item.color,
+      showIconSpace: showIconSpace && !hasIcon,
+      "data-testid": item.dataTestId,
+      children: [
+        hasIcon && /* @__PURE__ */ jsx(ListItemIcon, { sx: { minWidth: size === "sm" ? 32 : 40 }, children: item.icon }),
+        /* @__PURE__ */ jsx(ListItemText, { primary: item.label }),
+        item.shortcut && /* @__PURE__ */ jsx(ShortcutText, { variant: "caption", children: item.shortcut }),
+        hasChildren && item.showChevron !== false && /* @__PURE__ */ jsx(ChevronRight, { fontSize: "small", sx: { ml: 1, opacity: 0.5 } })
+      ]
+    },
+    item.id
+  );
+};
+var resolveMenuState = (controlledOpen, internalOpen, providedAnchorEl, anchorRef) => {
+  const isControlled = controlledOpen !== void 0;
+  const open = isControlled ? controlledOpen : internalOpen;
+  const anchorEl = providedAnchorEl || anchorRef.current;
+  return { isControlled, open, anchorEl, isOpen: Boolean(anchorEl) && open };
+};
+var useDropdownHandlers = ({
+  isControlled,
+  open,
+  setInternalOpen,
+  onOpen,
+  onClose,
+  closeOnItemClick,
+  anchorRef
+}) => {
+  const handleOpen = () => {
+    if (!isControlled) {
+      setInternalOpen(true);
+    }
+    onOpen?.();
+  };
+  const handleClose = () => {
+    if (!isControlled) {
+      setInternalOpen(false);
+    }
+    onClose?.();
+  };
+  const handleItemClick = (item) => {
+    item.onClick?.();
+    if (closeOnItemClick && !item.children?.length) {
+      handleClose();
+    }
+  };
+  const handleTriggerClick = (event) => {
+    if (isControlled) return;
+    if (open) {
+      handleClose();
+      return;
+    }
+    anchorRef.current = event.currentTarget;
+    handleOpen();
+  };
+  return { handleClose, handleItemClick, handleTriggerClick };
+};
+var DropdownTrigger = ({ trigger, anchorRef, onTriggerClick }) => {
+  if (isValidElement(trigger)) {
+    return cloneElement(
+      trigger,
+      { onClick: onTriggerClick, ref: anchorRef }
+    );
+  }
+  if (trigger) {
+    return /* @__PURE__ */ jsx(Box, { ref: anchorRef, onClick: onTriggerClick, children: trigger });
+  }
+  return /* @__PURE__ */ jsx(
+    Box,
+    {
+      ref: anchorRef,
+      onClick: onTriggerClick,
+      sx: { cursor: "pointer", display: "inline-flex" },
+      children: /* @__PURE__ */ jsx(MoreVert, {})
+    }
+  );
+};
+var DropdownMenu = React.forwardRef(
+  ({
+    variant = "default",
+    items,
+    trigger,
+    open: controlledOpen,
+    onOpen,
+    onClose,
+    size = "md",
+    maxHeight = 400,
+    minWidth = 180,
+    closeOnItemClick = true,
+    showIconSpace = false,
+    anchorEl: providedAnchorEl,
+    ...menuProps
+  }, ref) => {
+    const [internalOpen, setInternalOpen] = useState(false);
+    const anchorRef = useRef(null);
+    const { isControlled, open, anchorEl, isOpen } = resolveMenuState(
+      controlledOpen,
+      internalOpen,
+      providedAnchorEl,
+      anchorRef
+    );
+    const { handleClose, handleItemClick, handleTriggerClick } = useDropdownHandlers({
+      isControlled,
+      open,
+      setInternalOpen,
+      onOpen,
+      onClose,
+      closeOnItemClick,
+      anchorRef
+    });
+    const triggerElement = /* @__PURE__ */ jsx(DropdownTrigger, { trigger, anchorRef, onTriggerClick: handleTriggerClick });
+    return /* @__PURE__ */ jsxs(Fragment, { children: [
+      trigger !== void 0 && triggerElement,
+      /* @__PURE__ */ jsx(
+        StyledMenu,
+        {
+          ref,
+          anchorEl,
+          open: isOpen,
+          onClose: handleClose,
+          customVariant: variant,
+          size,
+          PaperProps: {
+            sx: {
+              maxHeight,
+              minWidth,
+              overflow: "auto"
+            }
+          },
+          transformOrigin: { horizontal: "left", vertical: "top" },
+          anchorOrigin: { horizontal: "left", vertical: "bottom" },
+          ...menuProps,
+          children: items.map((item) => renderMenuItem(item, handleItemClick, showIconSpace, size))
+        }
+      )
+    ] });
+  }
+);
+DropdownMenu.displayName = "DropdownMenu";
+
+export {
+  DropdownMenu
+};
+//# sourceMappingURL=chunk-NPK5TRIC.js.map

package/dist/chunk-NTCVB7HO.js

@@ -0,0 +1 @@
+//# sourceMappingURL=chunk-NTCVB7HO.js.map

package/dist/chunk-NTCVB7HO.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/chunk-NUGT7LMR.js

@@ -0,0 +1 @@
+//# sourceMappingURL=chunk-NUGT7LMR.js.map

package/dist/chunk-NUGT7LMR.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/chunk-NY3E3NRZ.js

@@ -0,0 +1,85 @@
+import {
+  useResize
+} from "./chunk-42Z34CKA.js";
+import {
+  defaultHandles,
+  handleStyle,
+  resolveResizableProps
+} from "./chunk-T7R5DWJX.js";
+
+// src/components/layout/Resizable/Resizable.tsx
+import { Box, useTheme } from "@mui/material";
+import { useMemo } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+var Resizable = (rawProps) => {
+  const {
+    children,
+    variant,
+    width: initialWidth,
+    height: initialHeight,
+    minWidth,
+    maxWidth,
+    minHeight,
+    maxHeight,
+    onResize,
+    disabled,
+    handles,
+    className,
+    "data-testid": dataTestId,
+    ...rest
+  } = resolveResizableProps(rawProps);
+  const theme = useTheme();
+  const bounds = useMemo(
+    () => ({
+      width: { min: minWidth, max: maxWidth },
+      height: { min: minHeight, max: maxHeight }
+    }),
+    [minWidth, maxWidth, minHeight, maxHeight]
+  );
+  const { size, isResizing, activeHandle, handleMouseDown } = useResize({
+    width: initialWidth,
+    height: initialHeight,
+    bounds,
+    disabled,
+    onResize
+  });
+  const activeHandles = handles || defaultHandles(variant);
+  return /* @__PURE__ */ jsxs(
+    Box,
+    {
+      ...rest,
+      className,
+      "data-testid": dataTestId,
+      sx: {
+        position: "relative",
+        width: size.width,
+        height: size.height,
+        border: `1px solid ${theme.palette.divider}`,
+        borderRadius: theme.spacing(0.5),
+        overflow: "hidden",
+        userSelect: isResizing ? "none" : "auto",
+        "&:hover .resize-handle": {
+          opacity: 0.3
+        }
+      },
+      children: [
+        children,
+        !disabled && activeHandles.map((handle) => /* @__PURE__ */ jsx(
+          Box,
+          {
+            className: "resize-handle",
+            "data-testid": dataTestId ? `${dataTestId}-handle-${handle}` : void 0,
+            sx: handleStyle(theme, handle, isResizing && activeHandle.current === handle),
+            onMouseDown: (e) => handleMouseDown(e, handle)
+          },
+          handle
+        ))
+      ]
+    }
+  );
+};
+
+export {
+  Resizable
+};
+//# sourceMappingURL=chunk-NY3E3NRZ.js.map

package/dist/chunk-NY3E3NRZ.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/layout/Resizable/Resizable.tsx"],"sourcesContent":["import { Box, useTheme } from '@mui/material';\nimport React, { useMemo } from 'react';\n\nimport { defaultHandles, handleStyle, resolveResizableProps } from './Resizable.helpers';\nimport { useResize } from './Resizable.hooks';\nimport type { ResizableProps } from './Resizable.types';\n\nexport const Resizable: React.FC<ResizableProps> = (rawProps) => {\n  const {\n    children,\n    variant,\n    width: initialWidth,\n    height: initialHeight,\n    minWidth,\n    maxWidth,\n    minHeight,\n    maxHeight,\n    onResize,\n    disabled,\n    handles,\n    className,\n    'data-testid': dataTestId,\n    ...rest\n  } = resolveResizableProps(rawProps);\n  const theme = useTheme();\n  const bounds = useMemo(\n    () => ({\n      width: { min: minWidth, max: maxWidth },\n      height: { min: minHeight, max: maxHeight },\n    }),\n    [minWidth, maxWidth, minHeight, maxHeight],\n  );\n\n  const { size, isResizing, activeHandle, handleMouseDown } = useResize({\n    width: initialWidth,\n    height: initialHeight,\n    bounds,\n    disabled,\n    onResize,\n  });\n\n  const activeHandles = handles || defaultHandles(variant);\n\n  return (\n    <Box\n      {...rest}\n      className={className}\n      data-testid={dataTestId}\n      sx={{\n        position: 'relative',\n        width: size.width,\n        height: size.height,\n        border: `1px solid ${theme.palette.divider}`,\n        borderRadius: theme.spacing(0.5),\n        overflow: 'hidden',\n        userSelect: isResizing ? 'none' : 'auto',\n        '&:hover .resize-handle': {\n          opacity: 0.3,\n        },\n      }}\n    >\n      {children}\n      {!disabled &&\n        activeHandles.map((handle) => (\n          <Box\n            key={handle}\n            className=\"resize-handle\"\n            data-testid={dataTestId ? `${dataTestId}-handle-${handle}` : undefined}\n            sx={handleStyle(theme, handle, isResizing && activeHandle.current === handle)}\n            onMouseDown={(e) => handleMouseDown(e, handle)}\n          />\n        ))}\n    </Box>\n  );\n};\n"],"mappings":";;;;;;;;;;AAAA,SAAS,KAAK,gBAAgB;AAC9B,SAAgB,eAAe;AA2C3B,SAoBM,KApBN;AArCG,IAAM,YAAsC,CAAC,aAAa;AAC/D,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA,OAAO;AAAA,IACP,QAAQ;AAAA,IACR;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,eAAe;AAAA,IACf,GAAG;AAAA,EACL,IAAI,sBAAsB,QAAQ;AAClC,QAAM,QAAQ,SAAS;AACvB,QAAM,SAAS;AAAA,IACb,OAAO;AAAA,MACL,OAAO,EAAE,KAAK,UAAU,KAAK,SAAS;AAAA,MACtC,QAAQ,EAAE,KAAK,WAAW,KAAK,UAAU;AAAA,IAC3C;AAAA,IACA,CAAC,UAAU,UAAU,WAAW,SAAS;AAAA,EAC3C;AAEA,QAAM,EAAE,MAAM,YAAY,cAAc,gBAAgB,IAAI,UAAU;AAAA,IACpE,OAAO;AAAA,IACP,QAAQ;AAAA,IACR;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,QAAM,gBAAgB,WAAW,eAAe,OAAO;AAEvD,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ;AAAA,MACA,eAAa;AAAA,MACb,IAAI;AAAA,QACF,UAAU;AAAA,QACV,OAAO,KAAK;AAAA,QACZ,QAAQ,KAAK;AAAA,QACb,QAAQ,aAAa,MAAM,QAAQ,OAAO;AAAA,QAC1C,cAAc,MAAM,QAAQ,GAAG;AAAA,QAC/B,UAAU;AAAA,QACV,YAAY,aAAa,SAAS;AAAA,QAClC,0BAA0B;AAAA,UACxB,SAAS;AAAA,QACX;AAAA,MACF;AAAA,MAEC;AAAA;AAAA,QACA,CAAC,YACA,cAAc,IAAI,CAAC,WACjB;AAAA,UAAC;AAAA;AAAA,YAEC,WAAU;AAAA,YACV,eAAa,aAAa,GAAG,UAAU,WAAW,MAAM,KAAK;AAAA,YAC7D,IAAI,YAAY,OAAO,QAAQ,cAAc,aAAa,YAAY,MAAM;AAAA,YAC5E,aAAa,CAAC,MAAM,gBAAgB,GAAG,MAAM;AAAA;AAAA,UAJxC;AAAA,QAKP,CACD;AAAA;AAAA;AAAA,EACL;AAEJ;","names":[]}

package/dist/chunk-NY4QY5U3.js

@@ -0,0 +1,168 @@
+import {
+  glowAnimation,
+  pulseAnimation,
+  shimmerAnimation
+} from "./chunk-GVBSCGFZ.js";
+import {
+  accentFor
+} from "./chunk-OZCEKQIX.js";
+
+// src/components/data-display/Sheet/Sheet.styles.ts
+import { alpha } from "@mui/material";
+var isHorizontalPosition = (position) => position === "left" || position === "right";
+var HORIZONTAL_SIZES = {
+  xs: "min(92vw, 240px)",
+  sm: "min(92vw, 320px)",
+  md: "min(92vw, 400px)",
+  lg: "min(92vw, max(560px, 32vw))",
+  xl: "min(92vw, max(720px, 40vw))",
+  full: "100%"
+};
+var VERTICAL_SIZES = {
+  xs: 200,
+  sm: 300,
+  md: 400,
+  lg: 500,
+  xl: 600,
+  full: "100%"
+};
+var sizeStyles = ({
+  position,
+  size,
+  isDraggableVariant,
+  isVerticalSheet,
+  currentHeight
+}) => {
+  if (isDraggableVariant && isVerticalSheet && currentHeight !== null) {
+    return { height: currentHeight };
+  }
+  return isHorizontalPosition(position) ? { width: HORIZONTAL_SIZES[size] ?? HORIZONTAL_SIZES.md } : { height: VERTICAL_SIZES[size] ?? VERTICAL_SIZES.md };
+};
+var toRgbTriplet = (hexColor) => {
+  const hex = hexColor.replace("#", "");
+  const r = parseInt(hex.substring(0, 2), 16);
+  const g = parseInt(hex.substring(2, 4), 16);
+  const b = parseInt(hex.substring(4, 6), 16);
+  return `${r}, ${g}, ${b}`;
+};
+var roundedStyles = (theme, position) => {
+  const radius = theme.spacing(2);
+  const byPosition = {
+    top: `0 0 ${radius} ${radius}`,
+    bottom: `${radius} ${radius} 0 0`,
+    left: `0 ${radius} ${radius} 0`,
+    right: `${radius} 0 0 ${radius}`
+  };
+  return { borderRadius: byPosition[position] };
+};
+var SURFACES = {
+  draggable: ({ theme, elevation, accent }) => ({
+    boxShadow: `
+            ${theme.shadows[Math.min(elevation + 4, 24)]},
+            0 -2px 10px 0 ${alpha(theme.palette.common.black, 0.1)}
+          `,
+    border: `1px solid ${alpha(theme.palette.divider, 0.12)}`,
+    borderTop: `2px solid ${alpha(accent, 0.3)}`,
+    transition: theme.transitions.create(["transform", "box-shadow", "border-color"], {
+      duration: theme.transitions.duration.shorter,
+      easing: theme.transitions.easing.easeInOut
+    }),
+    "&:hover": { borderTopColor: alpha(accent, 0.5) }
+  }),
+  glass: ({ theme, glass }) => ({
+    backgroundColor: alpha(theme.palette.background.paper, glass ? 0.75 : 0.95),
+    backdropFilter: "blur(24px) saturate(180%)",
+    WebkitBackdropFilter: "blur(24px) saturate(180%)",
+    border: `1px solid ${alpha(theme.palette.divider, 0.15)}`,
+    boxShadow: `
+            0 8px 32px 0 ${alpha(theme.palette.common.black, 0.15)},
+            inset 0 0 0 1px ${alpha(theme.palette.common.white, 0.1)}
+          `
+  }),
+  gradient: ({ theme, color, gradient, accent }) => ({
+    background: gradient ? `linear-gradient(
+                135deg,
+                ${theme.palette.background.paper} 0%,
+                ${alpha(accent, 0.08)} 50%,
+                ${alpha(accentFor(theme, color)?.dark || accent, 0.12)} 100%
+              )` : theme.palette.background.paper,
+    position: "relative",
+    overflow: "hidden",
+    "&::before": gradient ? shimmerOverlay(theme) : {}
+  }),
+  elevated: ({ theme, elevation }) => ({
+    boxShadow: `
+            ${theme.shadows[elevation]},
+            0 20px 40px -15px ${alpha(theme.palette.common.black, 0.15)}
+          `,
+    transform: "translateZ(0)",
+    willChange: "transform"
+  }),
+  minimal: () => ({ boxShadow: "none", border: "none" }),
+  default: () => ({})
+};
+var shimmerOverlay = (theme) => ({
+  content: '""',
+  position: "absolute",
+  top: 0,
+  left: "-100%",
+  width: "100%",
+  height: "100%",
+  background: `linear-gradient(
+              90deg,
+              transparent,
+              ${alpha(theme.palette.common.white, 0.2)},
+              transparent
+            )`,
+  animation: `${shimmerAnimation} 3s infinite`
+});
+var baseSurface = (input, accent) => {
+  const { theme, disabled, isDragging, isAnimating, isDraggableVariant, isVerticalSheet } = input;
+  const colorRgb = toRgbTriplet(accent);
+  return {
+    backgroundColor: theme.palette.background.paper,
+    // A transition would fight the per-frame height writes while a drag or a
+    // snap animation is driving the panel.
+    transition: !isDragging && !isAnimating ? theme.transitions.create(["all"], {
+      duration: theme.transitions.duration.standard,
+      easing: theme.transitions.easing.easeInOut
+    }) : "none",
+    opacity: disabled ? 0.5 : 1,
+    pointerEvents: disabled ? "none" : "auto",
+    cursor: isDraggableVariant && isVerticalSheet ? "grab" : "auto",
+    "--pulse-color": colorRgb,
+    "--glow-color": colorRgb,
+    ...isDragging && { cursor: "grabbing" }
+  };
+};
+var variantStyles = (input) => {
+  const { theme, variant, color, position, glow, pulse, rounded } = input;
+  const accent = accentFor(theme, color)?.main || theme.palette.primary.main;
+  return {
+    ...baseSurface(input, accent),
+    // glow first, then pulse: with both set the pulse keyframes win the shared
+    // `animation` slot, which is the order the original spread produced.
+    ...glow && { animation: `${glowAnimation} 2s ease-in-out infinite`, filter: "brightness(1.05)" },
+    ...pulse && { animation: `${pulseAnimation} 2s infinite`, position: "relative" },
+    ...rounded && roundedStyles(theme, position),
+    ...(SURFACES[variant] ?? SURFACES.default)({ ...input, accent })
+  };
+};
+var panelSx = (input) => {
+  const { position, size, isDraggableVariant, isVerticalSheet, currentHeight, fullHeight, style } = input;
+  return {
+    ...sizeStyles({ position, size, isDraggableVariant, isVerticalSheet, currentHeight }),
+    ...variantStyles(input),
+    ...style,
+    overflow: "visible",
+    // Expand only the cross axis so the chosen `size` still governs the main
+    // axis: side sheets keep their (responsive) width and go full-height;
+    // top/bottom sheets keep their height and go full-width.
+    ...fullHeight && !isDraggableVariant && (isHorizontalPosition(position) ? { height: "100%" } : { width: "100%" })
+  };
+};
+
+export {
+  panelSx
+};
+//# sourceMappingURL=chunk-NY4QY5U3.js.map