import { useMemo } from 'react';

import { type SxProps, type Theme, useTheme } from '@mui/material';

import { getAIVariantSx } from './styles';
import { type AIButtonVariant } from './types';

/**
 * Merges the AI variant styles for `variant` with the caller-provided `sx`.
 * Inline `sx` objects recreate each render and bypass memoization; that cost is
 * negligible here (style merge only). Stabilize `sx` with `useMemo` if needed.
 */
export const useAIVariantSx = (
  variant: AIButtonVariant,
  sx?: SxProps<Theme>,
): SxProps<Theme> => {
  const theme = useTheme();

  return useMemo(
    () => [getAIVariantSx(theme, variant), ...(Array.isArray(sx) ? sx : [sx])],
    [theme, variant, sx],
  );
};
