struct_components/.storybook/preview.ts

React component library for dashboards

import type { Preview } from "@storybook/react";
import {
	BADGE,
	// type BadgesConfig,
} from "@geometricpanda/storybook-addon-badges";
import "../src/output.css";

const preview: Preview = {
	parameters: {
		badgesConfig: {
			// badgesConfig: <BadgesConfig>{
			[BADGE.STABLE]: {
				desc: "Thgese components are lagacy",
				tooltip: "Thgese components are lagacy",
				styles: {
					backgroundColor: "#FFF",
					borderColor: "#018786",
					color: "#018786",
				},
				title: "Legecy",
			},
			[BADGE.BETA]: {
				desc: "Thgese components are beta",
				tooltip: "Thgese components are beta",
				styles: {
					backgroundColor: "#FFF",
					borderColor: "#018786",
					color: "#018786",
				},
				title: "Beta",
			},
			[BADGE.EXPERIMENTAL]: {
				desc: "Thgese components are in dev looking for funding",
				tooltip: "Thgese components are in dev looking for funding",
				styles: {
					backgroundColor: "#FFF",
					borderColor: "#018786",
					color: "#018786",
				},
				title: "In Dev",
			},
			[BADGE.OBSOLETE]: {
				desc: "Thgese components are deprecated nor more updated to these compoents",
				tooltip: "This component is deprecated, please avoid using it.",
				styles: {
					backgroundColor: "#FFF",
					borderColor: "#6200EE",
					color: "#6200EE",
				},
				title: "Deprecated",
			},
		},

		controls: {
			matchers: {
				color: /(background|color)$/i,
				date: /Date$/i,
			},
		},
	},
};

export default preview;