import type { Preview } from "@storybook/react-vite";
import "../src/styles.css";

const preview: Preview = {
  parameters: {
    controls: { matchers: { color: /(background|color)$/i, date: /Date$/i } },
    backgrounds: { disable: true },
  },
  globalTypes: {
    theme: {
      description: "DaisyUI theme",
      defaultValue: "carpa",
      toolbar: {
        title: "Theme",
        icon: "paintbrush",
        items: [
          { value: "carpa", title: "Carpa (light)" },
          { value: "carpa-dark", title: "Carpa (dark)" },
        ],
        dynamicTitle: true,
      },
    },
  },
  decorators: [
    (Story, context) => {
      const theme = context.globals.theme ?? "carpa";
      if (typeof document !== "undefined") {
        document.documentElement.setAttribute("data-theme", theme);
      }
      return (
        <div className="bg-base-100 p-8 text-base-content">
          <Story />
        </div>
      );
    },
  ],
};

export default preview;