@12-apps/ui 6.33.1 → 6.34.0

package/dist/chunk-TO2NXDZA.js

@@ -1,86 +0,0 @@
-// src/components/data-display/InteractiveTooltip/InteractiveTooltip.styles.ts
-import { alpha, keyframes } from "@mui/material/styles/index.js";
-var pulseAnimation = keyframes`
-  0% {
-    transform: scale(1);
-    opacity: 1;
-  }
-  70% {
-    transform: scale(1.05);
-    opacity: 0.8;
-  }
-  100% {
-    transform: scale(1);
-    opacity: 1;
-  }
-`;
-var SIZE_MAP = {
-  sm: { fontSize: "0.75rem", padding: "4px 8px" },
-  md: { fontSize: "0.875rem", padding: "6px 12px" },
-  lg: { fontSize: "1rem", padding: "8px 16px" }
-};
-var getSizeStyles = (size) => SIZE_MAP[size] || SIZE_MAP.md;
-var variantStyles = (theme, variant) => {
-  switch (variant) {
-    case "default":
-      return {
-        backgroundColor: alpha(theme.palette.grey[900], 0.92),
-        color: theme.palette.common.white,
-        boxShadow: `0 4px 12px ${alpha(theme.palette.common.black, 0.3)}`
-      };
-    case "dark":
-      return {
-        backgroundColor: "#000000",
-        color: theme.palette.common.white,
-        boxShadow: `0 6px 16px ${alpha(theme.palette.common.black, 0.5)}`,
-        border: `1px solid ${alpha(theme.palette.common.white, 0.1)}`
-      };
-    case "light":
-      return {
-        backgroundColor: theme.palette.common.white,
-        color: theme.palette.grey[900],
-        border: `1px solid ${alpha(theme.palette.grey[400], 0.4)}`,
-        boxShadow: `0 4px 16px ${alpha(theme.palette.common.black, 0.15)}`
-      };
-    case "glass":
-      return {
-        backgroundColor: alpha(theme.palette.background.paper, 0.75),
-        backdropFilter: "blur(24px) saturate(180%)",
-        WebkitBackdropFilter: "blur(24px) saturate(180%)",
-        border: `1px solid ${alpha(theme.palette.divider, 0.3)}`,
-        color: theme.palette.text.primary,
-        boxShadow: `0 8px 32px ${alpha(theme.palette.common.black, 0.12)}`
-      };
-    default:
-      return {};
-  }
-};
-var emphasisStyles = (theme, glow, pulse) => ({
-  ...glow && {
-    boxShadow: `0 0 15px 3px ${alpha(theme.palette.primary.main, 0.4)} !important`,
-    filter: "brightness(1.05)"
-  },
-  ...pulse && {
-    animation: `${pulseAnimation} 2s infinite`
-  }
-});
-var arrowColor = (theme, variant) => {
-  switch (variant) {
-    case "light":
-      return theme.palette.common.white;
-    case "glass":
-      return alpha(theme.palette.background.paper, 0.75);
-    case "dark":
-      return "#000000";
-    default:
-      return alpha(theme.palette.grey[900], 0.92);
-  }
-};
-
-export {
-  getSizeStyles,
-  variantStyles,
-  emphasisStyles,
-  arrowColor
-};
-//# sourceMappingURL=chunk-TO2NXDZA.js.map

package/dist/chunk-TO2NXDZA.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/data-display/InteractiveTooltip/InteractiveTooltip.styles.ts"],"sourcesContent":["import { alpha, keyframes } from '@mui/material/styles/index.js';\nimport type { CSSObject, Theme } from '@mui/material/styles/index.js';\n\nconst pulseAnimation = keyframes`\n  0% {\n    transform: scale(1);\n    opacity: 1;\n  }\n  70% {\n    transform: scale(1.05);\n    opacity: 0.8;\n  }\n  100% {\n    transform: scale(1);\n    opacity: 1;\n  }\n`;\n\nconst SIZE_MAP = {\n  sm: { fontSize: '0.75rem', padding: '4px 8px' },\n  md: { fontSize: '0.875rem', padding: '6px 12px' },\n  lg: { fontSize: '1rem', padding: '8px 16px' },\n} as const;\n\nexport const getSizeStyles = (size?: string): { fontSize: string; padding: string } =>\n  SIZE_MAP[size as keyof typeof SIZE_MAP] || SIZE_MAP.md;\n\nexport const variantStyles = (theme: Theme, variant?: string): CSSObject => {\n  switch (variant) {\n    case 'default':\n      return {\n        backgroundColor: alpha(theme.palette.grey[900], 0.92),\n        color: theme.palette.common.white,\n        boxShadow: `0 4px 12px ${alpha(theme.palette.common.black, 0.3)}`,\n      };\n    case 'dark':\n      return {\n        backgroundColor: '#000000',\n        color: theme.palette.common.white,\n        boxShadow: `0 6px 16px ${alpha(theme.palette.common.black, 0.5)}`,\n        border: `1px solid ${alpha(theme.palette.common.white, 0.1)}`,\n      };\n    case 'light':\n      return {\n        backgroundColor: theme.palette.common.white,\n        color: theme.palette.grey[900],\n        border: `1px solid ${alpha(theme.palette.grey[400], 0.4)}`,\n        boxShadow: `0 4px 16px ${alpha(theme.palette.common.black, 0.15)}`,\n      };\n    case 'glass':\n      return {\n        backgroundColor: alpha(theme.palette.background.paper, 0.75),\n        backdropFilter: 'blur(24px) saturate(180%)',\n        WebkitBackdropFilter: 'blur(24px) saturate(180%)',\n        border: `1px solid ${alpha(theme.palette.divider, 0.3)}`,\n        color: theme.palette.text.primary,\n        boxShadow: `0 8px 32px ${alpha(theme.palette.common.black, 0.12)}`,\n      };\n    default:\n      return {};\n  }\n};\n\n// glow and pulse are independent flags. The three combinations used to be spelled\n// out one by one, but each is just the union of whichever flags are set.\nexport const emphasisStyles = (theme: Theme, glow?: boolean, pulse?: boolean): CSSObject => ({\n  ...(glow && {\n    boxShadow: `0 0 15px 3px ${alpha(theme.palette.primary.main, 0.4)} !important`,\n    filter: 'brightness(1.05)',\n  }),\n  ...(pulse && {\n    animation: `${pulseAnimation} 2s infinite`,\n  }),\n});\n\nexport const arrowColor = (theme: Theme, variant?: string): string => {\n  switch (variant) {\n    case 'light':\n      return theme.palette.common.white;\n    case 'glass':\n      return alpha(theme.palette.background.paper, 0.75);\n    case 'dark':\n      return '#000000';\n    default:\n      return alpha(theme.palette.grey[900], 0.92);\n  }\n};\n"],"mappings":";AAAA,SAAS,OAAO,iBAAiB;AAGjC,IAAM,iBAAiB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAevB,IAAM,WAAW;AAAA,EACf,IAAI,EAAE,UAAU,WAAW,SAAS,UAAU;AAAA,EAC9C,IAAI,EAAE,UAAU,YAAY,SAAS,WAAW;AAAA,EAChD,IAAI,EAAE,UAAU,QAAQ,SAAS,WAAW;AAC9C;AAEO,IAAM,gBAAgB,CAAC,SAC5B,SAAS,IAA6B,KAAK,SAAS;AAE/C,IAAM,gBAAgB,CAAC,OAAc,YAAgC;AAC1E,UAAQ,SAAS;AAAA,IACf,KAAK;AACH,aAAO;AAAA,QACL,iBAAiB,MAAM,MAAM,QAAQ,KAAK,GAAG,GAAG,IAAI;AAAA,QACpD,OAAO,MAAM,QAAQ,OAAO;AAAA,QAC5B,WAAW,cAAc,MAAM,MAAM,QAAQ,OAAO,OAAO,GAAG,CAAC;AAAA,MACjE;AAAA,IACF,KAAK;AACH,aAAO;AAAA,QACL,iBAAiB;AAAA,QACjB,OAAO,MAAM,QAAQ,OAAO;AAAA,QAC5B,WAAW,cAAc,MAAM,MAAM,QAAQ,OAAO,OAAO,GAAG,CAAC;AAAA,QAC/D,QAAQ,aAAa,MAAM,MAAM,QAAQ,OAAO,OAAO,GAAG,CAAC;AAAA,MAC7D;AAAA,IACF,KAAK;AACH,aAAO;AAAA,QACL,iBAAiB,MAAM,QAAQ,OAAO;AAAA,QACtC,OAAO,MAAM,QAAQ,KAAK,GAAG;AAAA,QAC7B,QAAQ,aAAa,MAAM,MAAM,QAAQ,KAAK,GAAG,GAAG,GAAG,CAAC;AAAA,QACxD,WAAW,cAAc,MAAM,MAAM,QAAQ,OAAO,OAAO,IAAI,CAAC;AAAA,MAClE;AAAA,IACF,KAAK;AACH,aAAO;AAAA,QACL,iBAAiB,MAAM,MAAM,QAAQ,WAAW,OAAO,IAAI;AAAA,QAC3D,gBAAgB;AAAA,QAChB,sBAAsB;AAAA,QACtB,QAAQ,aAAa,MAAM,MAAM,QAAQ,SAAS,GAAG,CAAC;AAAA,QACtD,OAAO,MAAM,QAAQ,KAAK;AAAA,QAC1B,WAAW,cAAc,MAAM,MAAM,QAAQ,OAAO,OAAO,IAAI,CAAC;AAAA,MAClE;AAAA,IACF;AACE,aAAO,CAAC;AAAA,EACZ;AACF;AAIO,IAAM,iBAAiB,CAAC,OAAc,MAAgB,WAAgC;AAAA,EAC3F,GAAI,QAAQ;AAAA,IACV,WAAW,gBAAgB,MAAM,MAAM,QAAQ,QAAQ,MAAM,GAAG,CAAC;AAAA,IACjE,QAAQ;AAAA,EACV;AAAA,EACA,GAAI,SAAS;AAAA,IACX,WAAW,GAAG,cAAc;AAAA,EAC9B;AACF;AAEO,IAAM,aAAa,CAAC,OAAc,YAA6B;AACpE,UAAQ,SAAS;AAAA,IACf,KAAK;AACH,aAAO,MAAM,QAAQ,OAAO;AAAA,IAC9B,KAAK;AACH,aAAO,MAAM,MAAM,QAAQ,WAAW,OAAO,IAAI;AAAA,IACnD,KAAK;AACH,aAAO;AAAA,IACT;AACE,aAAO,MAAM,MAAM,QAAQ,KAAK,GAAG,GAAG,IAAI;AAAA,EAC9C;AACF;","names":[]}

package/dist/chunk-TTVKL3RD.js

@@ -1,220 +0,0 @@
-import {
-  onTrackInk,
-  switchSx
-} from "./chunk-4PIKOJZ4.js";
-import {
-  LABEL_GAP_UNITS,
-  SWITCH_ICON_SIZES,
-  TAP_TARGET_MIN
-} from "./chunk-3W2IS5RH.js";
-
-// src/components/form/Switch/Switch.parts.tsx
-import Box from "@mui/material/Box/index.js";
-import FormHelperText from "@mui/material/FormHelperText/index.js";
-import MuiSwitch from "@mui/material/Switch/index.js";
-import Typography from "@mui/material/Typography/index.js";
-import { styled, useTheme } from "@mui/material/styles/index.js";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-var StyledSwitch = styled(MuiSwitch, {
-  shouldForwardProp: (prop) => ![
-    "customVariant",
-    "customColor",
-    "customSize",
-    "glow",
-    "glass",
-    "gradient",
-    "trackWidth",
-    "trackHeight",
-    "onText",
-    "offText",
-    "loading",
-    "ripple",
-    "pulse"
-  ].includes(prop)
-})(({ theme, ...flags }) => ({ ...switchSx(theme, flags) }));
-var StyledLabelContainer = styled(Box, {
-  shouldForwardProp: (prop) => !["labelPosition", "error"].includes(prop)
-})(({ theme, labelPosition, error }) => {
-  const stacked = labelPosition === "top" || labelPosition === "bottom";
-  return {
-    display: "flex",
-    alignItems: stacked ? "flex-start" : "center",
-    flexDirection: labelPosition === "top" ? "column" : labelPosition === "bottom" ? "column-reverse" : "row",
-    gap: theme.spacing(stacked ? LABEL_GAP_UNITS.stacked : LABEL_GAP_UNITS.beside),
-    width: "100%",
-    ...error && { "& .MuiTypography-root": { color: theme.palette.error.main } }
-  };
-});
-var LabelContainer = ({ labelPosition, error, children }) => /* @__PURE__ */ jsx(StyledLabelContainer, { labelPosition, error, children });
-var SwitchIcon = ({
-  icon,
-  shown,
-  animated,
-  size,
-  side,
-  onInk
-}) => {
-  const isOn = side === "on";
-  const translate = isOn ? "translate(-50%, -50%)" : "translate(50%, -50%)";
-  return /* @__PURE__ */ jsx(
-    Box,
-    {
-      sx: {
-        position: "absolute",
-        top: "50%",
-        ...isOn ? { left: shown ? 4 : "50%" } : { right: shown ? 4 : "50%" },
-        transition: "all 0.3s cubic-bezier(0.4, 0, 0.2, 1)",
-        opacity: shown ? 1 : 0,
-        transform: `${translate} scale(${shown && animated ? 1 : 0.8})`,
-        pointerEvents: "none",
-        zIndex: 2,
-        color: isOn ? onInk : "text.secondary",
-        fontSize: SWITCH_ICON_SIZES[size] ?? SWITCH_ICON_SIZES.md
-      },
-      children: icon
-    }
-  );
-};
-var SwitchControl = ({
-  checked,
-  onChange,
-  onIcon,
-  offIcon,
-  animated,
-  size,
-  dataTestId,
-  switchRef,
-  inputId,
-  inputProps,
-  describedBy,
-  rest,
-  ...flags
-}) => {
-  const props = rest;
-  const theme = useTheme();
-  const onInk = onTrackInk(theme, flags);
-  return /* @__PURE__ */ jsxs(Box, { sx: { position: "relative", display: "inline-flex" }, children: [
-    /* @__PURE__ */ jsx(
-      StyledSwitch,
-      {
-        ref: switchRef,
-        ...flags,
-        checked,
-        onChange,
-        disabled: Boolean(flags.loading) || props.disabled,
-        ...props,
-        inputProps: {
-          "aria-label": props["aria-label"],
-          "data-testid": dataTestId || "switch",
-          ...inputProps,
-          id: inputId,
-          "aria-describedby": describedBy
-        }
-      }
-    ),
-    onIcon && /* @__PURE__ */ jsx(
-      SwitchIcon,
-      {
-        icon: onIcon,
-        shown: Boolean(checked),
-        animated,
-        size,
-        side: "on",
-        onInk
-      }
-    ),
-    offIcon && /* @__PURE__ */ jsx(
-      SwitchIcon,
-      {
-        icon: offIcon,
-        shown: !checked,
-        animated,
-        size,
-        side: "off",
-        onInk
-      }
-    )
-  ] });
-};
-var SwitchHelper = ({ helperText, error, dataTestId, id }) => helperText ? /* @__PURE__ */ jsx(
-  FormHelperText,
-  {
-    id,
-    error,
-    sx: { mt: 1 },
-    "data-testid": dataTestId ? `${dataTestId}-helper` : "switch-helper",
-    children: helperText
-  }
-) : null;
-var SwitchLabel = ({ label, description, error, dataTestId, htmlFor, descriptionId, disabled }) => /* @__PURE__ */ jsxs(Box, { sx: { flex: 1, minWidth: 0 }, children: [
-  /* @__PURE__ */ jsx(
-    Typography,
-    {
-      component: "label",
-      htmlFor,
-      variant: "body2",
-      fontWeight: 500,
-      color: error ? "error.main" : "text.primary",
-      sx: {
-        display: "flex",
-        alignItems: "center",
-        // The floor applies to the row the label shares with the control. A
-        // description already makes the row taller than 40px, so forcing it
-        // there would only add blank space.
-        ...description ? {} : { minHeight: TAP_TARGET_MIN },
-        // A disabled control's label toggles nothing, so it must not wear the
-        // cursor that says it does.
-        ...htmlFor && !disabled ? { cursor: "pointer" } : {}
-      },
-      "data-testid": dataTestId ? `${dataTestId}-label` : "switch-label",
-      children: label
-    }
-  ),
-  description && /* @__PURE__ */ jsx(
-    Typography,
-    {
-      id: descriptionId,
-      variant: "caption",
-      color: error ? "error.main" : "text.secondary",
-      sx: { display: "block", mt: 0.5 },
-      children: description
-    }
-  )
-] });
-var SwitchRow = ({
-  label,
-  description,
-  labelPosition,
-  error,
-  dataTestId,
-  htmlFor,
-  descriptionId,
-  disabled,
-  control
-}) => {
-  if (!label) return /* @__PURE__ */ jsx(Fragment, { children: control });
-  return /* @__PURE__ */ jsxs(LabelContainer, { labelPosition, error, children: [
-    labelPosition === "start" && control,
-    /* @__PURE__ */ jsx(
-      SwitchLabel,
-      {
-        label,
-        description,
-        error,
-        dataTestId,
-        htmlFor,
-        descriptionId,
-        disabled
-      }
-    ),
-    labelPosition !== "start" && control
-  ] });
-};
-
-export {
-  SwitchIcon,
-  SwitchControl,
-  SwitchHelper,
-  SwitchRow
-};
-//# sourceMappingURL=chunk-TTVKL3RD.js.map

package/dist/chunk-TUYN6XZI.js

@@ -1,33 +0,0 @@
-import {
-  CepField
-} from "./chunk-2SKNSQCP.js";
-import {
-  CategoryField
-} from "./chunk-LE7IHEU4.js";
-import {
-  ToggleField
-} from "./chunk-KAPKMVKR.js";
-import {
-  TextField
-} from "./chunk-TJT4NSFN.js";
-import {
-  SelectField
-} from "./chunk-65JHGT5F.js";
-import {
-  __export
-} from "./chunk-PZ5AY32C.js";
-
-// src/components/form/total-form/Fields/index.ts
-var Fields_exports = {};
-__export(Fields_exports, {
-  CategoryField: () => CategoryField,
-  CepField: () => CepField,
-  SelectField: () => SelectField,
-  TextField: () => TextField,
-  ToggleField: () => ToggleField
-});
-
-export {
-  Fields_exports
-};
-//# sourceMappingURL=chunk-TUYN6XZI.js.map

package/dist/chunk-TXHJX2NG.js

@@ -1,108 +0,0 @@
-import {
-  countries
-} from "./chunk-3JDP5OUR.js";
-import {
-  detectCountryFromNumber,
-  formatPhoneNumber,
-  validatePhoneNumber
-} from "./chunk-5P6OV64V.js";
-
-// src/components/form/PhoneInput/PhoneInput.hooks.ts
-import { useEffect, useRef, useState } from "react";
-var usePhoneInput = ({
-  defaultValue,
-  initialCountryCode,
-  onChange
-}) => {
-  const [value, setValue] = useState(defaultValue);
-  const [selectedCountry, setSelectedCountry] = useState(
-    countries.find((c) => c.code === initialCountryCode) || countries[0]
-  );
-  const [anchorEl, setAnchorEl] = useState(null);
-  const [isValid, setIsValid] = useState(false);
-  const [isFocused, setIsFocused] = useState(false);
-  const onChangeRef = useRef(onChange);
-  const isInitialMountRef = useRef(true);
-  useEffect(() => {
-    onChangeRef.current = onChange;
-  }, [onChange]);
-  useEffect(() => {
-    if (!selectedCountry) return;
-    const valid = validatePhoneNumber(value, selectedCountry.code);
-    setIsValid(valid);
-    if (isInitialMountRef.current) {
-      isInitialMountRef.current = false;
-      return;
-    }
-    if (onChangeRef.current) {
-      onChangeRef.current(value, valid, selectedCountry.code);
-    }
-  }, [value, selectedCountry]);
-  const handlers = usePhoneHandlers({
-    value,
-    setValue,
-    selectedCountry,
-    setSelectedCountry,
-    setAnchorEl,
-    setIsFocused
-  });
-  return {
-    value,
-    selectedCountry,
-    anchorEl,
-    isValid,
-    isFocused,
-    setIsFocused,
-    setAnchorEl,
-    ...handlers
-  };
-};
-var usePhoneHandlers = ({
-  value,
-  setValue,
-  selectedCountry,
-  setSelectedCountry,
-  setAnchorEl,
-  setIsFocused
-}) => {
-  const handleCountryClick = (event) => {
-    setAnchorEl(event.currentTarget);
-  };
-  const handleCountryClose = () => {
-    setAnchorEl(null);
-  };
-  const handleCountrySelect = (country) => {
-    setSelectedCountry(country);
-    handleCountryClose();
-    if (value) {
-      const formatted = formatPhoneNumber(value, country.code);
-      setValue(formatted);
-    }
-  };
-  const handleChange = (event) => {
-    const newValue = event.target.value;
-    setValue(newValue);
-    if (newValue.startsWith("+")) {
-      const detectedCountry = detectCountryFromNumber(newValue);
-      if (detectedCountry) {
-        const detectedCountryData = countries.find((c) => c.code === detectedCountry);
-        if (detectedCountryData && detectedCountryData.code !== selectedCountry?.code) {
-          setSelectedCountry(detectedCountryData);
-        }
-      }
-    }
-  };
-  const handleBlur = () => {
-    setIsFocused(false);
-    if (value && selectedCountry) {
-      const formatted = formatPhoneNumber(value, selectedCountry.code);
-      setValue(formatted);
-    }
-  };
-  return { handleCountryClick, handleCountryClose, handleCountrySelect, handleChange, handleBlur };
-};
-
-export {
-  usePhoneInput
-};
-//# sourceMappingURL=chunk-TXHJX2NG.js.map

package/dist/chunk-U437KFDI.js

@@ -1,206 +0,0 @@
-import {
-  shimmerAnimation
-} from "./chunk-F52N6ACD.js";
-import {
-  withDefaults
-} from "./chunk-HPK33ACY.js";
-
-// src/components/data-display/Sheet/Sheet.parts.tsx
-import CloseIcon from "@mui/icons-material/Close";
-import Backdrop from "@mui/material/Backdrop/index.js";
-import Box from "@mui/material/Box/index.js";
-import Divider from "@mui/material/Divider/index.js";
-import Fade from "@mui/material/Fade/index.js";
-import IconButton from "@mui/material/IconButton/index.js";
-import Typography from "@mui/material/Typography/index.js";
-import { alpha, useTheme } from "@mui/material/styles/index.js";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-var handleSx = (theme, isDraggable) => ({
-  width: isDraggable ? 48 : 32,
-  height: isDraggable ? 6 : 4,
-  backgroundColor: alpha(theme.palette.text.primary, 0.3),
-  borderRadius: 3,
-  transition: theme.transitions.create(["all"], {
-    duration: theme.transitions.duration.short,
-    easing: theme.transitions.easing.easeInOut
-  }),
-  position: "relative",
-  overflow: "hidden",
-  "&::after": {
-    content: '""',
-    position: "absolute",
-    top: 0,
-    left: "-100%",
-    width: "100%",
-    height: "100%",
-    background: `linear-gradient(
-      90deg,
-      transparent,
-      ${alpha(theme.palette.common.white, 0.3)},
-      transparent
-    )`,
-    animation: isDraggable ? `${shimmerAnimation} 2s infinite` : "none"
-  },
-  ...isDraggable && {
-    backgroundColor: alpha(theme.palette.primary.main, 0.4),
-    boxShadow: `0 2px 4px ${alpha(theme.palette.primary.main, 0.2)}`,
-    "&:hover": {
-      backgroundColor: theme.palette.primary.main,
-      transform: "scaleX(1.15) scaleY(1.2)",
-      boxShadow: `0 3px 6px ${alpha(theme.palette.primary.main, 0.3)}`
-    }
-  }
-});
-var SheetHandle = ({ isDraggable }) => {
-  const theme = useTheme();
-  return /* @__PURE__ */ jsx(
-    Box,
-    {
-      sx: {
-        display: "flex",
-        justifyContent: "center",
-        mb: 1,
-        // The handle is decoration on a draggable header: the drag listeners sit
-        // on the header itself, so letting the bar swallow the press would open
-        // a dead zone in the middle of the grab target.
-        pointerEvents: isDraggable ? "none" : "auto"
-      },
-      children: /* @__PURE__ */ jsx(Box, { sx: handleSx(theme, isDraggable) })
-    }
-  );
-};
-var HEADER_DEFAULTS = {
-  isDraggable: false,
-  dataTestId: "sheet-header"
-};
-var SheetHeader = (props) => {
-  const {
-    title,
-    description,
-    showCloseButton,
-    onClose,
-    showHandle,
-    isDraggable,
-    onDragStart,
-    className,
-    style,
-    children,
-    dataTestId
-  } = withDefaults(props, HEADER_DEFAULTS);
-  return /* @__PURE__ */ jsxs(
-    Box,
-    {
-      className,
-      "data-testid": dataTestId,
-      sx: {
-        p: 2,
-        pb: showHandle ? 1 : 2,
-        cursor: isDraggable ? "grab" : "auto",
-        "&:active": isDraggable ? { cursor: "grabbing" } : {},
-        ...style
-      },
-      onMouseDown: isDraggable ? onDragStart : void 0,
-      onTouchStart: isDraggable ? onDragStart : void 0,
-      children: [
-        showHandle && /* @__PURE__ */ jsx(SheetHandle, { isDraggable: Boolean(isDraggable) }),
-        /* @__PURE__ */ jsxs(Box, { sx: { display: "flex", alignItems: "flex-start", justifyContent: "space-between" }, children: [
-          /* @__PURE__ */ jsxs(Box, { sx: { flex: 1 }, children: [
-            title && /* @__PURE__ */ jsx(Typography, { variant: "h6", sx: { fontWeight: 600 }, "data-testid": `${dataTestId}-title`, children: title }),
-            description && /* @__PURE__ */ jsx(Typography, { variant: "body2", color: "text.secondary", sx: { mt: 0.5 }, children: description }),
-            children
-          ] }),
-          showCloseButton && /* @__PURE__ */ jsx(
-            IconButton,
-            {
-              onClick: onClose,
-              size: "small",
-              sx: { ml: 1, mt: -0.5 },
-              "data-testid": `${dataTestId}-close-button`,
-              children: /* @__PURE__ */ jsx(CloseIcon, { "data-testid": `${dataTestId}-close-icon` })
-            }
-          )
-        ] })
-      ]
-    }
-  );
-};
-var CONTENT_DEFAULTS = {
-  padded: true,
-  dataTestId: "sheet-content"
-};
-var SheetContent = (props) => {
-  const { children, className, style, padded, dataTestId } = withDefaults(props, CONTENT_DEFAULTS);
-  return /* @__PURE__ */ jsx(
-    Box,
-    {
-      className,
-      "data-testid": dataTestId,
-      sx: { flex: 1, overflow: "auto", p: padded ? 2 : 0, ...style },
-      children
-    }
-  );
-};
-var FOOTER_DEFAULTS = {
-  sticky: false,
-  divider: false,
-  dataTestId: "sheet-footer"
-};
-var SheetFooter = (props) => {
-  const { children, className, style, sticky, divider, dataTestId } = withDefaults(
-    props,
-    FOOTER_DEFAULTS
-  );
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    divider && /* @__PURE__ */ jsx(Divider, {}),
-    /* @__PURE__ */ jsx(
-      Box,
-      {
-        className,
-        "data-testid": dataTestId,
-        sx: {
-          p: 2,
-          position: sticky ? "sticky" : "relative",
-          bottom: sticky ? 0 : "auto",
-          backgroundColor: "background.paper",
-          borderTop: sticky ? "1px solid" : "none",
-          borderColor: "divider",
-          ...style
-        },
-        children
-      }
-    )
-  ] });
-};
-var OVERLAY_DEFAULTS = {
-  open: false,
-  blur: false
-};
-var SheetOverlay = (props) => {
-  const { open, onClick, className, style, blur } = withDefaults(props, OVERLAY_DEFAULTS);
-  const theme = useTheme();
-  return /* @__PURE__ */ jsx(Fade, { in: open, timeout: 300, children: /* @__PURE__ */ jsx(
-    Backdrop,
-    {
-      open: Boolean(open),
-      onClick,
-      className,
-      sx: {
-        // One below the drawer: this backdrop replaces MUI's own (the drawer
-        // is given a no-op BackdropComponent) and must sit under the panel.
-        zIndex: theme.zIndex.drawer - 1,
-        backgroundColor: alpha(theme.palette.common.black, blur ? 0.6 : 0.5),
-        backdropFilter: blur ? "blur(8px) saturate(180%)" : "none",
-        WebkitBackdropFilter: blur ? "blur(8px) saturate(180%)" : "none",
-        ...style
-      }
-    }
-  ) });
-};
-
-export {
-  SheetHeader,
-  SheetContent,
-  SheetFooter,
-  SheetOverlay
-};
-//# sourceMappingURL=chunk-U437KFDI.js.map

package/dist/chunk-U437KFDI.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/data-display/Sheet/Sheet.parts.tsx"],"sourcesContent":["import CloseIcon from '@mui/icons-material/Close';\nimport Backdrop from '@mui/material/Backdrop/index.js';\nimport Box from '@mui/material/Box/index.js';\nimport Divider from '@mui/material/Divider/index.js';\nimport Fade from '@mui/material/Fade/index.js';\nimport IconButton from '@mui/material/IconButton/index.js';\nimport Typography from '@mui/material/Typography/index.js';\nimport { alpha, useTheme } from '@mui/material/styles/index.js';\nimport type { Theme } from '@mui/material/styles/index.js';\nimport React from 'react';\n\nimport { withDefaults } from '../../../utils/withDefaults';\n\nimport { shimmerAnimation } from './Sheet.animations';\nimport type {\n  SheetContentProps,\n  SheetFooterProps,\n  SheetHeaderProps,\n  SheetOverlayProps,\n} from './Sheet.types';\n\n/**\n * The grab handle's own styling. A draggable handle is deliberately larger and\n * tinted, so the affordance reads as draggable before the user tries it; a\n * decorative one stays a neutral bar.\n */\nconst handleSx = (theme: Theme, isDraggable: boolean) => ({\n  width: isDraggable ? 48 : 32,\n  height: isDraggable ? 6 : 4,\n  backgroundColor: alpha(theme.palette.text.primary, 0.3),\n  borderRadius: 3,\n  transition: theme.transitions.create(['all'], {\n    duration: theme.transitions.duration.short,\n    easing: theme.transitions.easing.easeInOut,\n  }),\n  position: 'relative',\n  overflow: 'hidden',\n  '&::after': {\n    content: '\"\"',\n    position: 'absolute',\n    top: 0,\n    left: '-100%',\n    width: '100%',\n    height: '100%',\n    background: `linear-gradient(\n      90deg,\n      transparent,\n      ${alpha(theme.palette.common.white, 0.3)},\n      transparent\n    )`,\n    animation: isDraggable ? `${shimmerAnimation} 2s infinite` : 'none',\n  },\n  ...(isDraggable && {\n    backgroundColor: alpha(theme.palette.primary.main, 0.4),\n    boxShadow: `0 2px 4px ${alpha(theme.palette.primary.main, 0.2)}`,\n    '&:hover': {\n      backgroundColor: theme.palette.primary.main,\n      transform: 'scaleX(1.15) scaleY(1.2)',\n      boxShadow: `0 3px 6px ${alpha(theme.palette.primary.main, 0.3)}`,\n    },\n  }),\n});\n\nconst SheetHandle: React.FC<{ isDraggable: boolean }> = ({ isDraggable }) => {\n  const theme = useTheme();\n\n  return (\n    <Box\n      sx={{\n        display: 'flex',\n        justifyContent: 'center',\n        mb: 1,\n        // The handle is decoration on a draggable header: the drag listeners sit\n        // on the header itself, so letting the bar swallow the press would open\n        // a dead zone in the middle of the grab target.\n        pointerEvents: isDraggable ? 'none' : 'auto',\n      }}\n    >\n      <Box sx={handleSx(theme, isDraggable)} />\n    </Box>\n  );\n};\n\nconst HEADER_DEFAULTS: Partial<SheetHeaderProps> = {\n  isDraggable: false,\n  dataTestId: 'sheet-header',\n};\n\nexport const SheetHeader: React.FC<SheetHeaderProps> = (props) => {\n  const {\n    title,\n    description,\n    showCloseButton,\n    onClose,\n    showHandle,\n    isDraggable,\n    onDragStart,\n    className,\n    style,\n    children,\n    dataTestId,\n  } = withDefaults(props, HEADER_DEFAULTS);\n\n  return (\n    <Box\n      className={className}\n      data-testid={dataTestId}\n      sx={{\n        p: 2,\n        pb: showHandle ? 1 : 2,\n        cursor: isDraggable ? 'grab' : 'auto',\n        '&:active': isDraggable ? { cursor: 'grabbing' } : {},\n        ...style,\n      }}\n      onMouseDown={isDraggable ? onDragStart : undefined}\n      onTouchStart={isDraggable ? onDragStart : undefined}\n    >\n      {showHandle && <SheetHandle isDraggable={Boolean(isDraggable)} />}\n\n      <Box sx={{ display: 'flex', alignItems: 'flex-start', justifyContent: 'space-between' }}>\n        <Box sx={{ flex: 1 }}>\n          {title && (\n            <Typography variant=\"h6\" sx={{ fontWeight: 600 }} data-testid={`${dataTestId}-title`}>\n              {title}\n            </Typography>\n          )}\n          {description && (\n            <Typography variant=\"body2\" color=\"text.secondary\" sx={{ mt: 0.5 }}>\n              {description}\n            </Typography>\n          )}\n          {children}\n        </Box>\n\n        {showCloseButton && (\n          <IconButton\n            onClick={onClose}\n            size=\"small\"\n            sx={{ ml: 1, mt: -0.5 }}\n            data-testid={`${dataTestId}-close-button`}\n          >\n            <CloseIcon data-testid={`${dataTestId}-close-icon`} />\n          </IconButton>\n        )}\n      </Box>\n    </Box>\n  );\n};\n\nconst CONTENT_DEFAULTS: Partial<SheetContentProps> = {\n  padded: true,\n  dataTestId: 'sheet-content',\n};\n\nexport const SheetContent: React.FC<SheetContentProps> = (props) => {\n  const { children, className, style, padded, dataTestId } = withDefaults(props, CONTENT_DEFAULTS);\n\n  return (\n    <Box\n      className={className}\n      data-testid={dataTestId}\n      // No `minHeight: 0` here, deliberately: a flex item's automatic minimum\n      // size only applies while its main-axis `overflow` is `visible`, and this\n      // one is `auto`, so it already shrinks. `SheetBody` above is the item that\n      // needs it stated.\n      sx={{ flex: 1, overflow: 'auto', p: padded ? 2 : 0, ...style }}\n    >\n      {children}\n    </Box>\n  );\n};\n\nconst FOOTER_DEFAULTS: Partial<SheetFooterProps> = {\n  sticky: false,\n  divider: false,\n  dataTestId: 'sheet-footer',\n};\n\nexport const SheetFooter: React.FC<SheetFooterProps> = (props) => {\n  const { children, className, style, sticky, divider, dataTestId } = withDefaults(\n    props,\n    FOOTER_DEFAULTS,\n  );\n\n  return (\n    <>\n      {divider && <Divider />}\n      <Box\n        className={className}\n        data-testid={dataTestId}\n        sx={{\n          p: 2,\n          position: sticky ? 'sticky' : 'relative',\n          bottom: sticky ? 0 : 'auto',\n          backgroundColor: 'background.paper',\n          borderTop: sticky ? '1px solid' : 'none',\n          borderColor: 'divider',\n          ...style,\n        }}\n      >\n        {children}\n      </Box>\n    </>\n  );\n};\n\nconst OVERLAY_DEFAULTS: Partial<SheetOverlayProps> = {\n  open: false,\n  blur: false,\n};\n\nexport const SheetOverlay: React.FC<SheetOverlayProps> = (props) => {\n  const { open, onClick, className, style, blur } = withDefaults(props, OVERLAY_DEFAULTS);\n  const theme = useTheme();\n\n  return (\n    <Fade in={open} timeout={300}>\n      <Backdrop\n        open={Boolean(open)}\n        onClick={onClick}\n        className={className}\n        sx={{\n          // One below the drawer: this backdrop replaces MUI's own (the drawer\n          // is given a no-op BackdropComponent) and must sit under the panel.\n          zIndex: theme.zIndex.drawer - 1,\n          backgroundColor: alpha(theme.palette.common.black, blur ? 0.6 : 0.5),\n          backdropFilter: blur ? 'blur(8px) saturate(180%)' : 'none',\n          WebkitBackdropFilter: blur ? 'blur(8px) saturate(180%)' : 'none',\n          ...style,\n        }}\n      />\n    </Fade>\n  );\n};\n"],"mappings":"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","names":[]}