@12-apps/ui 5.0.0 → 5.0.1

package/dist/chunk-2XFGVZTZ.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/data-display/Avatar/Avatar.tsx","../src/components/data-display/Avatar/Avatar.view.tsx"],"sourcesContent":["import BrokenImage from '@mui/icons-material/BrokenImage';\nimport Person from '@mui/icons-material/Person';\nimport { styled } from '@mui/material';\nimport React, { useCallback, useEffect, useState } from 'react';\n\nimport type { AvatarProps } from './Avatar.types';\nimport { AvatarView, type AvatarViewProps, type ContentType } from './Avatar.view';\n\n/** Applied via a single spread so no per-field default inflates cyclomatic complexity. */\nconst AVATAR_DEFAULTS = {\n  variant: 'circle',\n  size: 'md',\n  glow: false,\n  pulse: false,\n  bordered: false,\n  color: 'primary',\n  loading: false,\n  interactive: false,\n  showFallbackOnError: true,\n  animationDelay: 0,\n} satisfies Partial<AvatarProps>;\n\n/**\n * Pick what renders inside the avatar. On an image error (with fallback enabled)\n * the fallback/icon/broken-image wins; otherwise children → fallback → icon → the\n * default person glyph.\n */\nfunction resolveContent(args: {\n  children?: React.ReactNode;\n  fallback?: React.ReactNode;\n  icon?: React.ReactNode;\n  imageError: boolean;\n  showFallbackOnError: boolean;\n}): { content: React.ReactNode; contentType: ContentType } {\n  const { children, fallback, icon, imageError, showFallbackOnError } = args;\n  if (imageError && showFallbackOnError) {\n    if (fallback) return { content: fallback, contentType: 'fallback' };\n    if (icon) return { content: icon, contentType: 'icon' };\n    return { content: <BrokenImage />, contentType: 'icon' };\n  }\n  if (children) return { content: children, contentType: 'children' };\n  if (fallback) return { content: fallback, contentType: 'fallback' };\n  if (icon) return { content: icon, contentType: 'icon' };\n  return { content: <Person />, contentType: 'default' };\n}\n\n/** Fades the avatar in after `animationDelay`ms. */\nfunction useMountedFade(animationDelay: number): boolean {\n  const [mounted, setMounted] = useState(false);\n  useEffect(() => {\n    const timer = window.setTimeout(() => setMounted(true), animationDelay);\n    return () => window.clearTimeout(timer);\n  }, [animationDelay]);\n  return mounted;\n}\n\ninterface ImageState {\n  imageError: boolean;\n  imageLoading: boolean;\n  handleImageError: React.ReactEventHandler;\n  handleImageLoad: () => void;\n}\n\n/**\n * Tracks the `<img>` load lifecycle. `imageLoading` starts true whenever there is\n * a `src` and clears on load/error — the handlers must be wired to the actual img\n * (via `slotProps.img` in the view), since load/error don't bubble to the root.\n */\nfunction useImageState(src: string | undefined, onError?: React.ReactEventHandler): ImageState {\n  const [imageError, setImageError] = useState(false);\n  const [imageLoading, setImageLoading] = useState(!!src);\n\n  useEffect(() => {\n    setImageError(false);\n    setImageLoading(!!src);\n  }, [src]);\n\n  const handleImageError = useCallback<React.ReactEventHandler>(\n    (event) => {\n      setImageError(true);\n      setImageLoading(false);\n      onError?.(event);\n    },\n    [onError],\n  );\n\n  const handleImageLoad = useCallback(() => setImageLoading(false), []);\n\n  return { imageError, imageLoading, handleImageError, handleImageLoad };\n}\n\n/** Normalizes props (defaults + rest passthrough) and derives everything the view needs. */\nfunction useAvatarModel(raw: AvatarProps, ref: React.Ref<HTMLDivElement>): AvatarViewProps {\n  const {\n    variant,\n    size,\n    glow,\n    pulse,\n    status,\n    fallback,\n    icon,\n    bordered,\n    color,\n    src,\n    alt,\n    children,\n    loading,\n    onError,\n    onClick,\n    interactive,\n    showFallbackOnError,\n    animationDelay,\n    className,\n    dataTestId,\n    ...rest\n  } = { ...AVATAR_DEFAULTS, ...raw };\n\n  const mounted = useMountedFade(animationDelay);\n  const { imageError, imageLoading, handleImageError, handleImageLoad } = useImageState(src, onError);\n  const handleClick = useCallback(\n    (event: React.MouseEvent<HTMLDivElement>) => onClick?.(event),\n    [onClick],\n  );\n  const { content, contentType } = resolveContent({\n    children,\n    fallback,\n    icon,\n    imageError,\n    showFallbackOnError,\n  });\n\n  return {\n    mounted,\n    variant,\n    size,\n    color,\n    glow,\n    pulse,\n    bordered,\n    showSpinner: loading || imageLoading,\n    imageError,\n    clickable: interactive || !!onClick,\n    imgSrc: imageError ? undefined : src,\n    alt,\n    ariaLabel: (rest['aria-label'] as string) || alt || 'Avatar',\n    content,\n    contentType,\n    className,\n    dataTestId,\n    status,\n    forwardedRef: ref,\n    onClick: handleClick,\n    handleImageError,\n    handleImageLoad,\n    rest,\n  };\n}\n\nexport const Avatar = React.forwardRef<HTMLDivElement, AvatarProps>((props, ref) => (\n  <AvatarView {...useAvatarModel(props, ref)} />\n));\n\nAvatar.displayName = 'Avatar';\n\nconst AvatarGroupContainer = styled('div')<{ overlap?: number }>(({ theme, overlap = 8 }) => ({\n  display: 'flex',\n  alignItems: 'center',\n  '& > *': {\n    marginLeft: -overlap,\n    transition: 'all 0.3s ease',\n    position: 'relative',\n    border: `2px solid ${theme.palette.background.paper}`,\n    '&:hover': {\n      zIndex: 100,\n      transform: 'scale(1.1) translateY(-4px)',\n    },\n    '&:first-of-type': {\n      marginLeft: 0,\n    },\n  },\n}));\n\n// Export AvatarGroup for grouped avatars\nexport const AvatarGroup: React.FC<{\n  children: React.ReactNode;\n  max?: number;\n  overlap?: number;\n  className?: string;\n  dataTestId?: string;\n}> = ({ children, max = 4, overlap = 8, className, dataTestId }) => {\n  const childrenArray = React.Children.toArray(children);\n  const visibleChildren = max ? childrenArray.slice(0, max) : childrenArray;\n  const remainingCount = childrenArray.length - visibleChildren.length;\n\n  return (\n    <AvatarGroupContainer overlap={overlap} className={className} data-testid={dataTestId}>\n      {visibleChildren}\n      {remainingCount > 0 && (\n        <Avatar\n          size={(visibleChildren[0] as React.ReactElement<AvatarProps>)?.props?.size || 'md'}\n          color=\"neutral\"\n          fallback={`+${remainingCount}`}\n          bordered\n          dataTestId={dataTestId ? `${dataTestId}-overflow` : undefined}\n        />\n      )}\n    </AvatarGroupContainer>\n  );\n};\n\nAvatarGroup.displayName = 'AvatarGroup';\n","import { alpha, Avatar as MuiAvatar, Badge, Fade, keyframes, useTheme } from '@mui/material';\nimport type { CSSObject, Theme } from '@mui/material';\nimport { styled } from '@mui/material';\nimport React from 'react';\n\nimport type { AvatarSize, AvatarStatus } from './Avatar.types';\n\nexport type ContentType = 'children' | 'fallback' | 'icon' | 'default';\n\nconst pulseAnimation = keyframes`\n  0% {\n    box-shadow: 0 0 0 0 currentColor;\n    opacity: 1;\n  }\n  70% {\n    box-shadow: 0 0 0 10px currentColor;\n    opacity: 0;\n  }\n  100% {\n    box-shadow: 0 0 0 0 currentColor;\n    opacity: 0;\n  }\n`;\n\nconst shimmerAnimation = keyframes`\n  0% {\n    background-position: -200% 0;\n  }\n  100% {\n    background-position: 200% 0;\n  }\n`;\n\nconst scaleInAnimation = keyframes`\n  0% {\n    transform: scale(0);\n    opacity: 0;\n  }\n  100% {\n    transform: scale(1);\n    opacity: 1;\n  }\n`;\n\nconst rotateAnimation = keyframes`\n  from {\n    transform: rotate(0deg);\n  }\n  to {\n    transform: rotate(360deg);\n  }\n`;\n\ninterface PaletteLike {\n  main: string;\n  contrastText?: string;\n  light?: string;\n  dark?: string;\n}\n\nconst getColorFromTheme = (theme: Theme, color: string): PaletteLike => {\n  const colorMap: Record<string, PaletteLike> = {\n    primary: theme.palette.primary,\n    secondary: theme.palette.secondary,\n    success: theme.palette.success,\n    warning: theme.palette.warning,\n    info: theme.palette.info,\n    // `danger`, not `error`. This map was keyed on MUI's word while the prop\n    // took the house one, so `danger` matched nothing and fell through to\n    // primary — a red avatar rendering blue, silently.\n    danger: theme.palette.error,\n    neutral: { main: theme.palette.grey[700], contrastText: '#fff' },\n  };\n\n  return colorMap[color] || theme.palette.primary;\n};\n\ninterface SizeStyle {\n  width: number;\n  height: number;\n  fontSize: string;\n}\n\nconst getSizeStyles = (size: AvatarSize): SizeStyle => {\n  const sizeMap: Record<AvatarSize, SizeStyle> = {\n    xs: { width: 24, height: 24, fontSize: '0.75rem' },\n    sm: { width: 32, height: 32, fontSize: '0.875rem' },\n    md: { width: 40, height: 40, fontSize: '1rem' },\n    lg: { width: 48, height: 48, fontSize: '1.125rem' },\n    xl: { width: 64, height: 64, fontSize: '1.5rem' },\n    xxl: { width: 80, height: 80, fontSize: '2rem' },\n  };\n\n  return sizeMap[size] || sizeMap.md;\n};\n\nconst getStatusColor = (status: AvatarStatus, theme: Theme): string => {\n  const statusColorMap: Record<AvatarStatus, string> = {\n    online: theme.palette.success.main,\n    offline: theme.palette.grey[500],\n    away: theme.palette.warning.main,\n    busy: theme.palette.error.main,\n  };\n\n  return statusColorMap[status] || statusColorMap.offline;\n};\n\n/** Hover/active lift, only when the avatar is interactive. */\nconst interactiveStyles = (interactive: boolean | undefined, main: string): CSSObject =>\n  interactive\n    ? {\n        '&:hover': {\n          transform: 'scale(1.1) translateY(-2px)',\n          boxShadow: `0 8px 20px ${alpha(main, 0.3)}`,\n          filter: 'brightness(1.1)',\n          zIndex: 10,\n        },\n        '&:active': { transform: 'scale(1.05)' },\n      }\n    : {};\n\n/** Shimmer gradient while the image loads. */\nconst loadingStyles = (isLoading: boolean | undefined, main: string): CSSObject =>\n  isLoading\n    ? {\n        background: `linear-gradient(\n        90deg,\n        ${alpha(main, 0.6)},\n        ${alpha(main, 0.8)},\n        ${alpha(main, 0.6)}\n      )`,\n        backgroundSize: '200% 100%',\n        animation: `${shimmerAnimation} 1.5s ease-in-out infinite`,\n      }\n    : {};\n\n/** Corner radius per shape variant (circle/status are round). */\nconst variantRadius = (variant: string | undefined, theme: Theme): CSSObject => {\n  if (variant === 'square') return { borderRadius: 0 };\n  if (variant === 'rounded') return { borderRadius: theme.spacing(1) };\n  return { borderRadius: '50%' };\n};\n\n/** Paper ring when bordered (e.g. inside an AvatarGroup). */\nconst borderedStyles = (bordered: boolean | undefined, theme: Theme): CSSObject =>\n  bordered\n    ? {\n        border: `2px solid ${theme.palette.background.paper}`,\n        boxShadow: `0 0 0 1px ${alpha(theme.palette.divider, 0.2)}`,\n      }\n    : {};\n\n/** Glow adds the halo; pulse adds the expanding ring — either or both. */\nconst glowPulseStyles = (\n  glow: boolean | undefined,\n  pulse: boolean | undefined,\n  main: string,\n): CSSObject => {\n  const styles: CSSObject = {};\n  if (glow) {\n    styles.boxShadow = `0 0 20px 5px ${alpha(main, 0.4)} !important`;\n    styles.filter = 'brightness(1.05)';\n  }\n  if (pulse) {\n    styles.position = 'relative';\n    styles['&::after'] = {\n      content: '\"\"',\n      position: 'absolute',\n      top: '50%',\n      left: '50%',\n      width: '100%',\n      height: '100%',\n      borderRadius: 'inherit',\n      transform: 'translate(-50%, -50%)',\n      backgroundColor: main,\n      opacity: 0.3,\n      animation: `${pulseAnimation} 2s infinite`,\n      pointerEvents: 'none',\n      zIndex: -1,\n    };\n  }\n  return styles;\n};\n\ninterface StyledAvatarProps {\n  customVariant?: string;\n  customSize?: AvatarSize;\n  customColor?: string;\n  glow?: boolean;\n  pulse?: boolean;\n  bordered?: boolean;\n  isLoading?: boolean;\n  hasError?: boolean;\n  interactive?: boolean;\n}\n\nconst STYLED_AVATAR_PROPS = [\n  'customVariant',\n  'customSize',\n  'customColor',\n  'glow',\n  'pulse',\n  'bordered',\n  'isLoading',\n  'hasError',\n  'interactive',\n];\n\nconst StyledAvatar = styled(MuiAvatar, {\n  shouldForwardProp: (prop) => !STYLED_AVATAR_PROPS.includes(prop as string),\n})<StyledAvatarProps>(\n  ({\n    theme,\n    customVariant,\n    customSize = 'md',\n    customColor = 'primary',\n    glow,\n    pulse,\n    bordered,\n    isLoading,\n    hasError,\n    interactive,\n  }) => {\n    const palette = getColorFromTheme(theme, customColor);\n    return {\n      ...getSizeStyles(customSize),\n      transition: 'all 0.3s cubic-bezier(0.4, 0, 0.2, 1)',\n      position: 'relative',\n      overflow: 'visible',\n      animation: `${scaleInAnimation} 0.3s ease-out`,\n      cursor: interactive ? 'pointer' : 'default',\n      backgroundColor: hasError ? theme.palette.error.main : palette.main,\n      color: hasError ? theme.palette.error.contrastText : (palette.contrastText ?? '#fff'),\n      ...interactiveStyles(interactive, palette.main),\n      ...loadingStyles(isLoading, palette.main),\n      ...variantRadius(customVariant, theme),\n      ...borderedStyles(bordered, theme),\n      ...glowPulseStyles(glow, pulse, palette.main),\n      '&:focus-visible': {\n        outline: `3px solid ${alpha(palette.main, 0.5)}`,\n        outlineOffset: 2,\n      },\n    };\n  },\n);\n\nconst LoadingOverlay = styled('div')<{ size: AvatarSize }>(({ theme, size }) => {\n  const sizeStyles = getSizeStyles(size);\n  return {\n    position: 'absolute',\n    top: 0,\n    left: 0,\n    width: sizeStyles.width,\n    height: sizeStyles.height,\n    borderRadius: 'inherit',\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    backgroundColor: alpha(theme.palette.background.paper, 0.7),\n    backdropFilter: 'blur(2px)',\n    '& .loading-spinner': {\n      width: sizeStyles.width * 0.4,\n      height: sizeStyles.height * 0.4,\n      border: `2px solid ${alpha(theme.palette.primary.main, 0.3)}`,\n      borderTopColor: theme.palette.primary.main,\n      borderRadius: '50%',\n      animation: `${rotateAnimation} 0.8s linear infinite`,\n    },\n  };\n});\n\nconst StatusBadge = styled(Badge, {\n  shouldForwardProp: (prop) => !['statusColor', 'avatarSize'].includes(prop as string),\n})<{\n  statusColor?: string;\n  avatarSize?: AvatarSize;\n}>(({ theme, statusColor, avatarSize = 'md' }) => {\n  const sizeStyles = getSizeStyles(avatarSize);\n  const badgeSize = Math.max(8, sizeStyles.width * 0.2);\n\n  return {\n    '& .MuiBadge-badge': {\n      backgroundColor: statusColor || theme.palette.success.main,\n      color: statusColor || theme.palette.success.main,\n      width: badgeSize,\n      height: badgeSize,\n      borderRadius: '50%',\n      border: `2px solid ${theme.palette.background.paper}`,\n      '&::after': {\n        position: 'absolute',\n        top: 0,\n        left: 0,\n        width: '100%',\n        height: '100%',\n        borderRadius: '50%',\n        backgroundColor: 'currentColor',\n        content: '\"\"',\n      },\n    },\n  };\n});\n\nexport interface AvatarViewProps {\n  mounted: boolean;\n  variant: string;\n  size: AvatarSize;\n  color: string;\n  glow: boolean;\n  pulse: boolean;\n  bordered: boolean;\n  showSpinner: boolean;\n  imageError: boolean;\n  clickable: boolean;\n  imgSrc?: string;\n  alt?: string;\n  ariaLabel: string;\n  content: React.ReactNode;\n  contentType: ContentType;\n  className?: string;\n  dataTestId?: string;\n  status?: AvatarStatus;\n  forwardedRef: React.Ref<HTMLDivElement>;\n  onClick: (event: React.MouseEvent<HTMLDivElement>) => void;\n  handleImageError: React.ReactEventHandler;\n  handleImageLoad: () => void;\n  rest: Record<string, unknown>;\n}\n\n/** The avatar box itself: the styled MUI avatar plus the loading overlay. */\nfunction AvatarSurface(props: AvatarViewProps): React.JSX.Element {\n  const { showSpinner, dataTestId, clickable } = props;\n  const testId = (suffix: string): string | undefined =>\n    dataTestId ? `${dataTestId}-${suffix}` : undefined;\n\n  return (\n    <Fade in={props.mounted} timeout={300}>\n      <div style={{ position: 'relative', display: 'inline-block' }}>\n        <StyledAvatar\n          ref={props.forwardedRef}\n          className={props.className}\n          customVariant={props.variant}\n          customSize={props.size}\n          customColor={props.color}\n          glow={props.glow}\n          pulse={props.pulse}\n          bordered={props.bordered}\n          isLoading={showSpinner}\n          hasError={props.imageError}\n          interactive={clickable}\n          src={props.imgSrc}\n          alt={props.alt}\n          onClick={props.onClick}\n          tabIndex={clickable ? 0 : undefined}\n          role={clickable ? 'button' : undefined}\n          aria-label={props.ariaLabel}\n          data-testid={dataTestId}\n          {...props.rest}\n          // Load/error fire on the inner <img>, not the root — and don't bubble.\n          // Wiring them via the img slot lets `imageLoading` actually clear (else\n          // the spinner overlays the avatar forever whenever `src` is set). Keep\n          // after {...props.rest} so a consumer-supplied slotProps can't override\n          // and detach these handlers.\n          slotProps={{ img: { onError: props.handleImageError, onLoad: props.handleImageLoad } }}\n        >\n          {showSpinner ? null : (\n            <span data-testid={testId(props.contentType)}>{props.content}</span>\n          )}\n        </StyledAvatar>\n        {showSpinner && (\n          <LoadingOverlay size={props.size} data-testid={testId('loading')}>\n            <div className=\"loading-spinner\" data-testid={testId('loading-spinner')} />\n          </LoadingOverlay>\n        )}\n      </div>\n    </Fade>\n  );\n}\n\n/** Presentational avatar: the surface, wrapped in a status dot badge when requested. */\nexport function AvatarView(props: AvatarViewProps): React.JSX.Element {\n  const theme = useTheme();\n  const surface = <AvatarSurface {...props} />;\n\n  if (props.variant === 'status' && props.status) {\n    return (\n      <StatusBadge\n        overlap=\"circular\"\n        anchorOrigin={{ vertical: 'bottom', horizontal: 'right' }}\n        variant=\"dot\"\n        statusColor={getStatusColor(props.status, theme)}\n        avatarSize={props.size}\n        data-testid={props.dataTestId ? `${props.dataTestId}-badge` : undefined}\n      >\n        {surface}\n      </StatusBadge>\n    );\n  }\n\n  return surface;\n}\n"],"mappings":"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","names":["styled","jsx","jsxs","styled"]}

package/dist/chunk-34DQAXL2.js

@@ -0,0 +1,8 @@
+// src/mui/Box.ts
+import { Box, Box as Box2 } from "@mui/material";
+
+export {
+  Box,
+  Box2
+};
+//# sourceMappingURL=chunk-34DQAXL2.js.map

package/dist/chunk-34DQAXL2.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/mui/Box.ts"],"sourcesContent":["export type { BoxProps } from '@mui/material';\nexport { Box, Box as default } from '@mui/material';\n"],"mappings":";AACA,SAAS,KAAY,OAAPA,YAAsB;","names":["Box"]}

package/dist/chunk-35VGGLOC.js

@@ -0,0 +1,327 @@
+// src/components/layout/TableFilter/TableFilter.tsx
+import CloseIcon from "@mui/icons-material/Close";
+import SearchIcon from "@mui/icons-material/Search";
+import {
+  Box,
+  Checkbox,
+  Divider,
+  FormControlLabel,
+  IconButton,
+  InputAdornment,
+  Link,
+  TextField,
+  Typography
+} from "@mui/material";
+import { useRef, useState } from "react";
+
+// src/components/layout/TableFilter/TableFilterContext.tsx
+import { createContext, useContext } from "react";
+var TableFilterContext = createContext(null);
+function useTableFilterContext() {
+  const context = useContext(TableFilterContext);
+  if (!context) {
+    throw new Error("TableFilter compound components must be rendered inside <TableFilter>");
+  }
+  return context;
+}
+
+// src/components/layout/TableFilter/TableFilter.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+var PANEL_WIDTH = 280;
+function TableFilter({
+  children,
+  open,
+  onOpenChange,
+  hasActiveFilters = false
+}) {
+  return /* @__PURE__ */ jsx(TableFilterContext.Provider, { value: { open, onOpenChange, hasActiveFilters }, children });
+}
+TableFilter.displayName = "TableFilter";
+var TableFilterLayout = ({ children, className }) => {
+  const { open } = useTableFilterContext();
+  return /* @__PURE__ */ jsx(
+    Box,
+    {
+      className,
+      sx: {
+        display: "flex",
+        minHeight: 0,
+        minWidth: 0,
+        flex: 1,
+        alignItems: "stretch",
+        overflow: "hidden",
+        gap: open ? 2 : 0
+      },
+      children
+    }
+  );
+};
+TableFilterLayout.displayName = "TableFilter.Layout";
+var TableFilterMain = ({ children, className }) => /* @__PURE__ */ jsx(Box, { className, sx: { minWidth: 0, flex: 1, overflowY: "auto", overflowX: "hidden" }, children });
+TableFilterMain.displayName = "TableFilter.Main";
+var TableFilterPanel = ({
+  children,
+  onClearAll,
+  ariaLabel = "Filters",
+  clearTestId
+}) => {
+  const { open } = useTableFilterContext();
+  return /* @__PURE__ */ jsx(
+    Box,
+    {
+      component: "aside",
+      "aria-label": ariaLabel,
+      "aria-hidden": !open,
+      sx: {
+        display: "flex",
+        minHeight: 0,
+        flexShrink: 0,
+        flexDirection: "column",
+        alignSelf: "stretch",
+        overflow: "hidden",
+        bgcolor: "background.paper",
+        width: open ? PANEL_WIDTH : 0,
+        borderLeft: open ? 1 : 0,
+        borderColor: "divider",
+        transition: "width 300ms ease-in-out",
+        "@media (prefers-reduced-motion: reduce)": { transition: "none" }
+      },
+      children: /* @__PURE__ */ jsx(
+        Box,
+        {
+          sx: {
+            display: "flex",
+            minHeight: 0,
+            flex: 1,
+            flexDirection: "column",
+            overflowY: "auto",
+            overflowX: "hidden",
+            visibility: open ? "visible" : "hidden",
+            opacity: open ? 1 : 0,
+            pointerEvents: open ? "auto" : "none",
+            transition: "opacity 200ms ease-out"
+          },
+          children: /* @__PURE__ */ jsxs(Box, { sx: { boxSizing: "border-box", display: "flex", width: "100%", minWidth: 0, flexDirection: "column", gap: 2.5, p: 2 }, children: [
+            /* @__PURE__ */ jsx(Box, { sx: { display: "flex", justifyContent: "flex-end" }, children: /* @__PURE__ */ jsx(
+              Link,
+              {
+                component: "button",
+                type: "button",
+                underline: "hover",
+                "data-testid": clearTestId,
+                onClick: onClearAll,
+                sx: { fontSize: "0.75rem", color: "text.secondary" },
+                children: "Clear All Filters"
+              }
+            ) }),
+            children
+          ] })
+        }
+      )
+    }
+  );
+};
+TableFilterPanel.displayName = "TableFilter.Panel";
+var TableFilterKeyword = ({
+  value,
+  onChange,
+  placeholder = "Press Enter to filter",
+  label = "Filter by keyword",
+  testId
+}) => {
+  const [draft, setDraft] = useState(value);
+  const prevValue = useRef(value);
+  if (prevValue.current !== value) {
+    prevValue.current = value;
+    if (draft !== value) setDraft(value);
+  }
+  const commit = () => {
+    if (draft !== value) onChange(draft);
+  };
+  const clearKeyword = () => {
+    setDraft("");
+    if (value !== "") onChange("");
+  };
+  return /* @__PURE__ */ jsxs(Box, { sx: { display: "flex", flexDirection: "column", gap: 1 }, children: [
+    /* @__PURE__ */ jsx(Typography, { component: "label", sx: { fontSize: "0.75rem", fontWeight: 500, color: "text.secondary" }, children: label }),
+    /* @__PURE__ */ jsx(
+      TextField,
+      {
+        size: "small",
+        name: "keyword",
+        placeholder,
+        value: draft,
+        onChange: (event) => setDraft(event.target.value),
+        onBlur: commit,
+        onKeyDown: (event) => {
+          if (event.key !== "Enter") return;
+          event.preventDefault();
+          commit();
+        },
+        inputProps: { "aria-label": label, "data-testid": testId },
+        InputProps: {
+          startAdornment: /* @__PURE__ */ jsx(InputAdornment, { position: "start", children: /* @__PURE__ */ jsx(SearchIcon, { sx: { fontSize: 16, color: "text.secondary" } }) }),
+          endAdornment: draft !== "" ? /* @__PURE__ */ jsx(InputAdornment, { position: "end", children: /* @__PURE__ */ jsx(
+            IconButton,
+            {
+              size: "small",
+              "aria-label": "Clear keyword filter",
+              "data-testid": testId ? `${testId}-clear` : void 0,
+              onMouseDown: (event) => event.preventDefault(),
+              onClick: clearKeyword,
+              children: /* @__PURE__ */ jsx(CloseIcon, { sx: { fontSize: 16 } })
+            }
+          ) }) : null
+        }
+      }
+    )
+  ] });
+};
+TableFilterKeyword.displayName = "TableFilter.Keyword";
+var TableFilterSection = ({ title, children }) => /* @__PURE__ */ jsxs(Box, { children: [
+  /* @__PURE__ */ jsx(Divider, { sx: { mb: 2.5 } }),
+  /* @__PURE__ */ jsxs(Box, { sx: { display: "flex", flexDirection: "column", gap: 1.5 }, children: [
+    /* @__PURE__ */ jsx(Typography, { component: "h2", sx: { fontSize: "0.875rem", fontWeight: 600, color: "text.primary" }, children: title }),
+    /* @__PURE__ */ jsx(Box, { sx: { display: "flex", flexDirection: "column", gap: 2 }, children })
+  ] })
+] });
+TableFilterSection.displayName = "TableFilter.Section";
+function TableFilterCheckboxField({
+  label,
+  options,
+  selected,
+  onToggle,
+  testId
+}) {
+  return /* @__PURE__ */ jsxs(Box, { sx: { display: "flex", flexDirection: "column", gap: 1 }, "data-testid": testId, children: [
+    /* @__PURE__ */ jsx(Typography, { sx: { fontSize: "0.75rem", fontWeight: 500, color: "text.secondary" }, children: label }),
+    /* @__PURE__ */ jsx(Box, { sx: { display: "flex", flexDirection: "column" }, children: options.map((option) => {
+      const checked = selected.has(option.value);
+      return /* @__PURE__ */ jsx(
+        FormControlLabel,
+        {
+          control: /* @__PURE__ */ jsx(
+            Checkbox,
+            {
+              size: "small",
+              checked,
+              onChange: (event) => onToggle(option.value, event.target.checked),
+              "data-testid": testId ? `${testId}-${option.value}` : void 0,
+              sx: { py: 0.25 }
+            }
+          ),
+          label: /* @__PURE__ */ jsxs(Box, { component: "span", sx: { fontSize: "0.875rem" }, children: [
+            option.label,
+            option.count != null && /* @__PURE__ */ jsxs(Box, { component: "span", sx: { color: "text.secondary" }, children: [
+              " ",
+              "(",
+              option.count,
+              ")"
+            ] })
+          ] }),
+          sx: { ml: -0.5, mr: 0 }
+        },
+        option.value
+      );
+    }) })
+  ] });
+}
+TableFilterCheckboxField.displayName = "TableFilter.CheckboxField";
+function parseBound(text) {
+  if (text.trim() === "") return void 0;
+  const parsed = Number(text);
+  return Number.isNaN(parsed) ? void 0 : parsed;
+}
+function RangeBound({
+  bound,
+  error,
+  placeholder,
+  step,
+  ariaLabel,
+  testId,
+  onChange
+}) {
+  return /* @__PURE__ */ jsx(
+    TextField,
+    {
+      size: "small",
+      type: "number",
+      error,
+      placeholder,
+      value: bound != null ? String(bound) : "",
+      onChange: (event) => onChange(parseBound(event.target.value)),
+      inputProps: { step, "aria-label": ariaLabel, "data-testid": testId }
+    }
+  );
+}
+var isRangeInverted = (value) => value.min != null && value.max != null && value.max < value.min;
+var TableFilterRangeField = ({
+  label,
+  value,
+  onChange,
+  unit,
+  step,
+  minPlaceholder = "min",
+  maxPlaceholder = "max",
+  invalidLabel = "O m\xE1ximo deve ser maior ou igual ao m\xEDnimo.",
+  testId
+}) => {
+  const invalid = isRangeInverted(value);
+  return /* @__PURE__ */ jsxs(Box, { sx: { display: "flex", flexDirection: "column", gap: 1 }, "data-testid": testId, children: [
+    /* @__PURE__ */ jsxs(Typography, { sx: { fontSize: "0.75rem", fontWeight: 500, color: "text.secondary" }, children: [
+      label,
+      unit ? ` (${unit})` : ""
+    ] }),
+    /* @__PURE__ */ jsxs(Box, { sx: { display: "flex", alignItems: "center", gap: 1 }, children: [
+      /* @__PURE__ */ jsx(
+        RangeBound,
+        {
+          bound: value.min,
+          error: invalid,
+          placeholder: minPlaceholder,
+          step,
+          ariaLabel: `${label} ${minPlaceholder}`,
+          testId: testId ? `${testId}-min` : void 0,
+          onChange: (min) => onChange({ ...value, min })
+        }
+      ),
+      /* @__PURE__ */ jsx(Typography, { component: "span", sx: { color: "text.secondary" }, children: "\u2013" }),
+      /* @__PURE__ */ jsx(
+        RangeBound,
+        {
+          bound: value.max,
+          error: invalid,
+          placeholder: maxPlaceholder,
+          step,
+          ariaLabel: `${label} ${maxPlaceholder}`,
+          testId: testId ? `${testId}-max` : void 0,
+          onChange: (max) => onChange({ ...value, max })
+        }
+      )
+    ] }),
+    invalid && /* @__PURE__ */ jsx(
+      Typography,
+      {
+        role: "alert",
+        "data-testid": testId ? `${testId}-error` : void 0,
+        sx: { fontSize: "0.7rem", color: "error.main" },
+        children: invalidLabel
+      }
+    )
+  ] });
+};
+TableFilterRangeField.displayName = "TableFilter.RangeField";
+TableFilter.Layout = TableFilterLayout;
+TableFilter.Main = TableFilterMain;
+TableFilter.Panel = TableFilterPanel;
+TableFilter.Keyword = TableFilterKeyword;
+TableFilter.Section = TableFilterSection;
+TableFilter.CheckboxField = TableFilterCheckboxField;
+TableFilter.RangeField = TableFilterRangeField;
+
+export {
+  TableFilterContext,
+  useTableFilterContext,
+  TableFilter
+};
+//# sourceMappingURL=chunk-35VGGLOC.js.map

package/dist/chunk-35VGGLOC.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/layout/TableFilter/TableFilter.tsx","../src/components/layout/TableFilter/TableFilterContext.tsx"],"sourcesContent":["'use client';\n\nimport CloseIcon from '@mui/icons-material/Close';\nimport SearchIcon from '@mui/icons-material/Search';\nimport {\n  Box,\n  Checkbox,\n  Divider,\n  FormControlLabel,\n  IconButton,\n  InputAdornment,\n  Link,\n  TextField,\n  Typography,\n} from '@mui/material';\nimport React, { useRef, useState } from 'react';\n\nimport { TableFilterContext, useTableFilterContext } from './TableFilterContext';\nimport type {\n  TableFilterCheckboxFieldProps,\n  TableFilterKeywordProps,\n  TableFilterLayoutProps,\n  TableFilterMainProps,\n  TableFilterPanelProps,\n  TableFilterProps,\n  TableFilterRangeFieldProps,\n  TableFilterSectionProps,\n} from './TableFilter.types';\n\nconst PANEL_WIDTH = 280;\n\n/**\n * Compound filter-panel system, MUI port of the reference `TableFilter`. Provides\n * open/close state; `Panel` slides in from the right beside `Main` (no overlap).\n *\n * @example\n * ```tsx\n * <TableFilter open={open} onOpenChange={setOpen} hasActiveFilters={n > 0}>\n *   <TableFilter.Layout>\n *     <TableFilter.Main>{table}</TableFilter.Main>\n *     <TableFilter.Panel onClearAll={clearAll}>\n *       <TableFilter.Keyword value={q} onChange={setQ} />\n *       <TableFilter.Section title=\"Attributes\">\n *         <TableFilter.CheckboxField label=\"Category\" options={cats} selected={sel} onToggle={toggle} />\n *         <TableFilter.RangeField label=\"Price\" unit=\"R$\" value={price} onChange={setPrice} />\n *       </TableFilter.Section>\n *     </TableFilter.Panel>\n *   </TableFilter.Layout>\n * </TableFilter>\n * ```\n */\nexport function TableFilter({\n  children,\n  open,\n  onOpenChange,\n  hasActiveFilters = false,\n}: TableFilterProps): React.JSX.Element {\n  return (\n    <TableFilterContext.Provider value={{ open, onOpenChange, hasActiveFilters }}>\n      {children}\n    </TableFilterContext.Provider>\n  );\n}\nTableFilter.displayName = 'TableFilter';\n\nconst TableFilterLayout = ({ children, className }: TableFilterLayoutProps): React.JSX.Element => {\n  const { open } = useTableFilterContext();\n  return (\n    <Box\n      className={className}\n      sx={{\n        display: 'flex',\n        minHeight: 0,\n        minWidth: 0,\n        flex: 1,\n        alignItems: 'stretch',\n        overflow: 'hidden',\n        gap: open ? 2 : 0,\n      }}\n    >\n      {children}\n    </Box>\n  );\n};\nTableFilterLayout.displayName = 'TableFilter.Layout';\n\nconst TableFilterMain = ({ children, className }: TableFilterMainProps): React.JSX.Element => (\n  <Box className={className} sx={{ minWidth: 0, flex: 1, overflowY: 'auto', overflowX: 'hidden' }}>\n    {children}\n  </Box>\n);\nTableFilterMain.displayName = 'TableFilter.Main';\n\nconst TableFilterPanel = ({\n  children,\n  onClearAll,\n  ariaLabel = 'Filters',\n  clearTestId,\n}: TableFilterPanelProps): React.JSX.Element => {\n  const { open } = useTableFilterContext();\n  return (\n    <Box\n      component=\"aside\"\n      aria-label={ariaLabel}\n      aria-hidden={!open}\n      sx={{\n        display: 'flex',\n        minHeight: 0,\n        flexShrink: 0,\n        flexDirection: 'column',\n        alignSelf: 'stretch',\n        overflow: 'hidden',\n        bgcolor: 'background.paper',\n        width: open ? PANEL_WIDTH : 0,\n        borderLeft: open ? 1 : 0,\n        borderColor: 'divider',\n        transition: 'width 300ms ease-in-out',\n        '@media (prefers-reduced-motion: reduce)': { transition: 'none' },\n      }}\n    >\n      <Box\n        sx={{\n          display: 'flex',\n          minHeight: 0,\n          flex: 1,\n          flexDirection: 'column',\n          overflowY: 'auto',\n          overflowX: 'hidden',\n          visibility: open ? 'visible' : 'hidden',\n          opacity: open ? 1 : 0,\n          pointerEvents: open ? 'auto' : 'none',\n          transition: 'opacity 200ms ease-out',\n        }}\n      >\n        <Box sx={{ boxSizing: 'border-box', display: 'flex', width: '100%', minWidth: 0, flexDirection: 'column', gap: 2.5, p: 2 }}>\n          <Box sx={{ display: 'flex', justifyContent: 'flex-end' }}>\n            <Link\n              component=\"button\"\n              type=\"button\"\n              underline=\"hover\"\n              data-testid={clearTestId}\n              onClick={onClearAll}\n              sx={{ fontSize: '0.75rem', color: 'text.secondary' }}\n            >\n              Clear All Filters\n            </Link>\n          </Box>\n          {children}\n        </Box>\n      </Box>\n    </Box>\n  );\n};\nTableFilterPanel.displayName = 'TableFilter.Panel';\n\nconst TableFilterKeyword = ({\n  value,\n  onChange,\n  placeholder = 'Press Enter to filter',\n  label = 'Filter by keyword',\n  testId,\n}: TableFilterKeywordProps): React.JSX.Element => {\n  const [draft, setDraft] = useState(value);\n  const prevValue = useRef(value);\n  if (prevValue.current !== value) {\n    prevValue.current = value;\n    if (draft !== value) setDraft(value);\n  }\n\n  const commit = (): void => {\n    if (draft !== value) onChange(draft);\n  };\n  const clearKeyword = (): void => {\n    setDraft('');\n    if (value !== '') onChange('');\n  };\n\n  return (\n    <Box sx={{ display: 'flex', flexDirection: 'column', gap: 1 }}>\n      <Typography component=\"label\" sx={{ fontSize: '0.75rem', fontWeight: 500, color: 'text.secondary' }}>\n        {label}\n      </Typography>\n      <TextField\n        size=\"small\"\n        name=\"keyword\"\n        placeholder={placeholder}\n        value={draft}\n        onChange={(event) => setDraft(event.target.value)}\n        onBlur={commit}\n        onKeyDown={(event) => {\n          if (event.key !== 'Enter') return;\n          event.preventDefault();\n          commit();\n        }}\n        inputProps={{ 'aria-label': label, 'data-testid': testId }}\n        InputProps={{\n          startAdornment: (\n            <InputAdornment position=\"start\">\n              <SearchIcon sx={{ fontSize: 16, color: 'text.secondary' }} />\n            </InputAdornment>\n          ),\n          endAdornment:\n            draft !== '' ? (\n              <InputAdornment position=\"end\">\n                <IconButton\n                  size=\"small\"\n                  aria-label=\"Clear keyword filter\"\n                  data-testid={testId ? `${testId}-clear` : undefined}\n                  onMouseDown={(event) => event.preventDefault()}\n                  onClick={clearKeyword}\n                >\n                  <CloseIcon sx={{ fontSize: 16 }} />\n                </IconButton>\n              </InputAdornment>\n            ) : null,\n        }}\n      />\n    </Box>\n  );\n};\nTableFilterKeyword.displayName = 'TableFilter.Keyword';\n\nconst TableFilterSection = ({ title, children }: TableFilterSectionProps): React.JSX.Element => (\n  <Box>\n    <Divider sx={{ mb: 2.5 }} />\n    <Box sx={{ display: 'flex', flexDirection: 'column', gap: 1.5 }}>\n      <Typography component=\"h2\" sx={{ fontSize: '0.875rem', fontWeight: 600, color: 'text.primary' }}>\n        {title}\n      </Typography>\n      <Box sx={{ display: 'flex', flexDirection: 'column', gap: 2 }}>{children}</Box>\n    </Box>\n  </Box>\n);\nTableFilterSection.displayName = 'TableFilter.Section';\n\nfunction TableFilterCheckboxField<TValue extends string = string>({\n  label,\n  options,\n  selected,\n  onToggle,\n  testId,\n}: TableFilterCheckboxFieldProps<TValue>): React.JSX.Element {\n  return (\n    <Box sx={{ display: 'flex', flexDirection: 'column', gap: 1 }} data-testid={testId}>\n      <Typography sx={{ fontSize: '0.75rem', fontWeight: 500, color: 'text.secondary' }}>{label}</Typography>\n      <Box sx={{ display: 'flex', flexDirection: 'column' }}>\n        {options.map((option) => {\n          const checked = selected.has(option.value);\n          return (\n            <FormControlLabel\n              key={option.value}\n              control={\n                <Checkbox\n                  size=\"small\"\n                  checked={checked}\n                  onChange={(event) => onToggle(option.value, event.target.checked)}\n                  data-testid={testId ? `${testId}-${option.value}` : undefined}\n                  sx={{ py: 0.25 }}\n                />\n              }\n              label={\n                <Box component=\"span\" sx={{ fontSize: '0.875rem' }}>\n                  {option.label}\n                  {option.count != null && (\n                    <Box component=\"span\" sx={{ color: 'text.secondary' }}>\n                      {' '}\n                      ({option.count})\n                    </Box>\n                  )}\n                </Box>\n              }\n              sx={{ ml: -0.5, mr: 0 }}\n            />\n          );\n        })}\n      </Box>\n    </Box>\n  );\n}\nTableFilterCheckboxField.displayName = 'TableFilter.CheckboxField';\n\nfunction parseBound(text: string): number | undefined {\n  if (text.trim() === '') return undefined;\n  const parsed = Number(text);\n  return Number.isNaN(parsed) ? undefined : parsed;\n}\n\n/** One numeric bound input (min or max) for {@link TableFilterRangeField}. */\nfunction RangeBound({\n  bound,\n  error,\n  placeholder,\n  step,\n  ariaLabel,\n  testId,\n  onChange,\n}: {\n  bound: number | undefined;\n  error: boolean;\n  placeholder: string;\n  step?: number;\n  ariaLabel: string;\n  testId?: string;\n  onChange: (next: number | undefined) => void;\n}): React.JSX.Element {\n  return (\n    <TextField\n      size=\"small\"\n      type=\"number\"\n      error={error}\n      placeholder={placeholder}\n      value={bound != null ? String(bound) : ''}\n      onChange={(event) => onChange(parseBound(event.target.value))}\n      inputProps={{ step, 'aria-label': ariaLabel, 'data-testid': testId }}\n    />\n  );\n}\n\n/** Inverted range: both ends set and max < min (surfaced to the user as an error). */\nconst isRangeInverted = (value: { min?: number; max?: number }): boolean =>\n  value.min != null && value.max != null && value.max < value.min;\n\nconst TableFilterRangeField = ({\n  label,\n  value,\n  onChange,\n  unit,\n  step,\n  minPlaceholder = 'min',\n  maxPlaceholder = 'max',\n  invalidLabel = 'O máximo deve ser maior ou igual ao mínimo.',\n  testId,\n}: TableFilterRangeFieldProps): React.JSX.Element => {\n  const invalid = isRangeInverted(value);\n  return (\n    <Box sx={{ display: 'flex', flexDirection: 'column', gap: 1 }} data-testid={testId}>\n      <Typography sx={{ fontSize: '0.75rem', fontWeight: 500, color: 'text.secondary' }}>\n        {label}\n        {unit ? ` (${unit})` : ''}\n      </Typography>\n      <Box sx={{ display: 'flex', alignItems: 'center', gap: 1 }}>\n        <RangeBound\n          bound={value.min}\n          error={invalid}\n          placeholder={minPlaceholder}\n          step={step}\n          ariaLabel={`${label} ${minPlaceholder}`}\n          testId={testId ? `${testId}-min` : undefined}\n          onChange={(min) => onChange({ ...value, min })}\n        />\n        <Typography component=\"span\" sx={{ color: 'text.secondary' }}>\n          –\n        </Typography>\n        <RangeBound\n          bound={value.max}\n          error={invalid}\n          placeholder={maxPlaceholder}\n          step={step}\n          ariaLabel={`${label} ${maxPlaceholder}`}\n          testId={testId ? `${testId}-max` : undefined}\n          onChange={(max) => onChange({ ...value, max })}\n        />\n      </Box>\n      {invalid && (\n        <Typography\n          role=\"alert\"\n          data-testid={testId ? `${testId}-error` : undefined}\n          sx={{ fontSize: '0.7rem', color: 'error.main' }}\n        >\n          {invalidLabel}\n        </Typography>\n      )}\n    </Box>\n  );\n};\nTableFilterRangeField.displayName = 'TableFilter.RangeField';\n\nTableFilter.Layout = TableFilterLayout;\nTableFilter.Main = TableFilterMain;\nTableFilter.Panel = TableFilterPanel;\nTableFilter.Keyword = TableFilterKeyword;\nTableFilter.Section = TableFilterSection;\nTableFilter.CheckboxField = TableFilterCheckboxField;\nTableFilter.RangeField = TableFilterRangeField;\n","'use client';\n\nimport { createContext, useContext } from 'react';\n\n/** Open/close + active state shared by every `TableFilter` compound part. */\nexport interface TableFilterContextValue {\n  /** Whether the filter panel is expanded. */\n  open: boolean;\n  /** Toggle the panel open/closed. */\n  onOpenChange: (open: boolean) => void;\n  /** When true, the trigger shows a filled indicator dot. */\n  hasActiveFilters: boolean;\n}\n\n/** Backing context. `null` outside a `<TableFilter>` root. */\nexport const TableFilterContext = createContext<TableFilterContextValue | null>(null);\n\n/**\n * Reads the nearest {@link TableFilterContext}.\n *\n * @throws If used outside `<TableFilter>`.\n */\nexport function useTableFilterContext(): TableFilterContextValue {\n  const context = useContext(TableFilterContext);\n  if (!context) {\n    throw new Error('TableFilter compound components must be rendered inside <TableFilter>');\n  }\n  return context;\n}\n"],"mappings":"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","names":[]}