import { Meta, StoryObj } from '@storybook/react-webpack5';
import {
  createSandboxStory,
  globalScope,
} from '../../../.storybook/components/sandbox/SandboxEditor';

import { lorem10 } from '../../test-utils';
import Title from '../../title';
import { Typography } from '../propsValues/typography';

import BaseCard from '.';

const meta: Meta<typeof BaseCard> = {
  component: BaseCard,
  title: 'Internal/BaseCard',
};

export default meta;
type Story = StoryObj<typeof BaseCard>;

export const Sandbox = createSandboxStory({
  code: `<BaseCard onDismiss={() => console.log('dismissed')}>
  <Title type="title-section">Money without borders</Title>
  <Body>Send money abroad with low fees and the real exchange rate.</Body>
</BaseCard>`,
  scope: globalScope,
});

export const Default: Story = {
  args: {
    children: (
      <>
        <Title type={Typography.TITLE_SECTION}>Money without borders</Title>
        {lorem10}
      </>
    ),
    onDismiss: () => {},
  },
};
