44 lines
1.1 KiB
TypeScript
44 lines
1.1 KiB
TypeScript
import type { Preview } from "@storybook/react";
|
|
import { CustomizationDecorator } from "../stories/CustomizationDecorator";
|
|
import React from "react";
|
|
|
|
// Load Google Fonts for better rendering in Storybook
|
|
const googleFonts = [
|
|
"Roboto",
|
|
"Open+Sans",
|
|
"Lato",
|
|
"Montserrat",
|
|
"Poppins",
|
|
];
|
|
|
|
if (typeof document !== "undefined") {
|
|
const link = document.createElement("link");
|
|
link.rel = "stylesheet";
|
|
link.href = `https://fonts.googleapis.com/css2?${googleFonts.map(font => `family=${font}:wght@400;600;700`).join("&")}&display=swap`;
|
|
document.head.appendChild(link);
|
|
}
|
|
|
|
const preview: Preview = {
|
|
parameters: {
|
|
actions: { argTypesRegex: "^on[A-Z].*" },
|
|
controls: {
|
|
matchers: {
|
|
color: /(background|color)$/i,
|
|
date: /Date$/i,
|
|
},
|
|
},
|
|
layout: "fullscreen",
|
|
},
|
|
decorators: [
|
|
(Story) => (
|
|
<CustomizationDecorator>
|
|
<div style={{ padding: "20px", backgroundColor: "#f5f5f5", minHeight: "100vh" }}>
|
|
<Story />
|
|
</div>
|
|
</CustomizationDecorator>
|
|
),
|
|
],
|
|
};
|
|
|
|
export default preview;
|