import React from "react";
import type { Decorator, Meta, StoryFn } from "@storybook/react";

import { Spinner, ThemeProviderWithStyledEngine } from "../index";

const decorator: Decorator<unknown> = (Story) => (
  <ThemeProviderWithStyledEngine>{Story()}</ThemeProviderWithStyledEngine>
);

const meta = {
  title: "Components/Feedback/Spinner",
  component: Spinner,
  argTypes: {},
  decorators: [decorator],
} satisfies Meta<typeof Spinner>;

export default meta;

const Template: StoryFn<typeof Spinner> = () => {
  return (
    <span style={{ color: "blue" }}>
      <Spinner />
    </span>
  );
};

export const Default: StoryFn<typeof Spinner> = Template.bind({});
