import { Meta, StoryObj } from '@storybook/react-webpack5';

import Emphasis from './Emphasis';
import { createSandboxStory, globalScope } from '../../.storybook/components/sandbox/SandboxEditor';

export default {
  component: Emphasis,
  title: 'Typography/Emphasis',
} satisfies Meta<typeof Emphasis>;

type Story = StoryObj<typeof Emphasis>;

export const Sandbox = createSandboxStory({
  code: `<Emphasis text="This is <important>important</important> and this is <positive>positive</positive>." />`,
  scope: globalScope,
});

export const Basic: Story = {
  args: {
    text:
      'This is <important>important</important>.\\n' +
      'This is <positive>positive</positive>.\\n' +
      'This is <negative>negative</negative>.\\n' +
      'This is a <warning>warning</warning>.\\n' +
      '<script>alert("nice try!")</script>',
  },
};
