import type { Decorator } from '@storybook/react';
import type { CSSVariables } from '../../utils/types.js';

const defaultLinkStyles: CSSVariables = {
  '--hscl-link-color-primary': '#0066cc',
  '--hscl-link-color-secondary': '#516f90',
  '--hscl-link-color-tertiary': '#7c98b6',
  '--hscl-link-color-hover-primary': '#0052a3',
  '--hscl-link-color-hover-secondary': '#33475b',
  '--hscl-link-color-hover-tertiary': '#516f90',
};

export const withLinkStyles: Decorator = Story => (
  <div style={defaultLinkStyles}>
    <Story />
  </div>
);
