import type { Meta, StoryObj } from "@storybook/react";
import { PieChartProps } from "../PieChart";
declare const monthlySalesData: {
    month: string;
    value: number;
}[];
/**
 * # PieChart Component Documentation
 *
 * The PieChart component is a versatile and intuitive tool for visualizing
 * part-to-whole relationships in a dataset. It's highly effective for:
 *
 * - **Proportional Analysis**: Showing how individual segments contribute to a total
 * - **Category Comparison**: Comparing the relative size of different categories
 * - **Dashboard KPIs**: Displaying key metrics like market share or budget allocation
 *
 * ## Key Features
 *
 * ### Chart Types
 * - **Pie**: Classic circular chart for proportional representation
 * - **Donut**: Pie chart with a center cutout, useful for displaying a central metric or for a modern look
 *
 * ### Layout Variants
 * - **Circular**: Full 360-degree display for a complete data overview
 * - **Semicircle**: Half-circle (180-degree) layout, ideal for compact dashboard widgets
 *
 * ### Data Formatting
 * - **Percentage Mode**: Automatically calculates and displays segment values as percentages
 * - **Number Mode**: Shows raw data values with appropriate formatting
 *
 * ### Interactive & Responsive
 * - **Interactive Legend**: Adapts to container size with carousel navigation for large datasets
 * - **Hover Tooltips**: Provides detailed information on hover for better user engagement
 * - **Responsive Design**: Fluidly adjusts to the size of its container
 *
 * ### Customization
 * - **Theming**: Six pre-built color palettes to match your application's design
 * - **Styling Options**: Control corner radius, padding between slices, and more

 */
declare const meta: Meta<PieChartProps<typeof monthlySalesData>>;
export default meta;
type Story = StoryObj<typeof meta>;
/**
 * ## Interactive Playground
 *
 * This is a minimal story that renders just the PieChart component without any wrapper.
 * Use the Controls panel to interactively test all available props and see how they
 * affect the chart's appearance and behavior.
 *
 * **Perfect for:**
 * - Testing different prop combinations
 * - Exploring chart customization options
 * - Understanding prop behaviors
 */
export declare const InteractivePlayground: Story;
/**
 * ## Default Configuration
 *
 * This example showcases the PieChart with its standard settings, making it an
 * ideal starting point for most data visualization needs.
 *
 * **Key Features Shown:**
 * - Standard circular pie layout
 * - Professional 'ocean' color theme
 * - Responsive stacked legend for clarity
 * - Smooth animations on load
 */
export declare const DefaultConfiguration: Story;
/**
 * ## Layout and Variant Options
 *
 * This story demonstrates the different layout (`appearance`) and style (`variant`)
 * options available in the PieChart component.
 *
 * **Options Shown:**
 * - **Pie vs. Donut**: See the difference between a full pie and one with a center cutout.
 * - **Circular vs. Semicircle**: Compare the full 360° layout with the space-saving 180° version.
 */
export declare const LayoutAndVariantOptions: Story;
/**
 * ## Custom Palette
 *
 * This example demonstrates how to use a custom color palette.
 *
 * **Feature Highlight:**
 * - The `customPalette` prop allows you to define your own array of colors.
 */
export declare const CustomPalette: Story;
/**
 * ## Large Dataset with Carousel
 *
 * The PieChart's legend intelligently handles a large number of items by
 * enabling a scrollable carousel with up/down navigation.
 *
 * **Feature Highlight:**
 * - The legend's carousel appears automatically when items overflow the available space, ensuring all data points remain accessible without cluttering the UI.
 */
export declare const LargeDatasetWithCarousel: Story;
export declare const ResponsiveDemo: Story;
//# sourceMappingURL=PieChart.stories.d.ts.map