UNPKG

@spaced-out/ui-design-system

Version:
446 lines 12.9 kB
import * as React from 'react'; import type { ColumnChartProps } from './'; declare const _default: { tags: string[]; title: string; component: ({ isLoading, classNames, cardTitle, customExportOptions, series, drilldown, headerActions, hasEmptyData, emptyText, ...userOptions }: ColumnChartProps) => React.JSX.Element; argTypes: { isLoading: { description: string; control: { type: string; }; table: { type: { summary: string; }; defaultValue: { summary: string; }; }; }; classNames: { description: string; control: { type: string; }; table: { type: { summary: string; }; }; }; cardTitle: { description: string; control: { type: string; }; type: { summary: string; }; }; customExportOptions: { description: string; control: { type: string; }; table: { type: { summary: string; }; }; }; series: { description: string; table: { type: { summary: string; }; }; }; legend: { description: string; control: { type: string; }; }; plotOptions: { description: string; }; xAxis: { description: string; }; yAxis: { description: string; }; headerActions: { description: string; table: { type: { summary: string; }; }; }; hasEmptyData: { description: string; control: { type: string; }; }; emptyText: { description: string; table: { type: { summary: string; }; }; }; }; parameters: { docs: { subtitle: string; description: { component: string; }; }; storySource: { componentPath: string; }; }; }; export default _default; export declare const EmptyData: () => React.JSX.Element; export declare const _ColumnChart: { (args: ColumnChartProps): React.JSX.Element; args: { classNames: { wrapper: string; }; cardTitle: string; customExportOptions: { key: string; label: string; format: string; }[]; series: { name: string; data: { name: string; y: number; }[]; }[]; xAxis: { readonly title: { readonly text: "Sourcing"; }; }; yAxis: { readonly title: { readonly text: "Amount Sourced"; }; }; legend: { readonly enabled: true; readonly shadow: false; }; }; }; export declare const _ColumnChartWithEmptyData: { (args: ColumnChartProps): React.JSX.Element; args: { classNames: { wrapper: string; }; cardTitle: string; customExportOptions: { key: string; label: string; format: string; }[]; series: { name: string; data: { name: string; y: number; }[]; }[]; xAxis: { readonly title: { readonly text: "Sourcing"; }; }; yAxis: { readonly title: { readonly text: "Amount Sourced"; }; }; legend: { readonly enabled: true; readonly shadow: false; }; hasEmptyData: boolean; emptyText: React.ReactElement<React.ComponentProps<typeof EmptyData>>; }; }; export declare const _ColumnChartWithDrilldown: { (args: ColumnChartProps): React.JSX.Element; args: { classNames: { wrapper: string; }; cardTitle: string; customExportOptions: { key: string; label: string; format: string; }[]; series: ({ name: string; data: { name: string; y: number; drilldown: string; }[]; } | { name: string; data: { name: string; y: number; }[]; })[]; drilldown: { readonly series: readonly [{ readonly id: "q1_23"; readonly name: "Inbound Sourced Drilldown"; readonly data: readonly [{ readonly name: "Chatbot"; readonly y: 4200; }, { readonly name: "Discover"; readonly y: 3400; }, { readonly name: "Other"; readonly y: 3600; }]; }, { readonly id: "q2_23"; readonly name: "Inbound Sourced Drilldown"; readonly data: readonly [{ readonly name: "Chatbot"; readonly y: 4200; }, { readonly name: "Discover"; readonly y: 3400; }, { readonly name: "Other"; readonly y: 3600; }]; }, { readonly id: "q3_23"; readonly name: "Outbound Sourced"; readonly data: readonly [{ readonly name: "Chatbot"; readonly y: 2200; }, { readonly name: "Discover"; readonly y: 1400; }, { readonly name: "Other"; readonly y: 3600; }]; }, { readonly id: "q4_23"; readonly name: "Outbound Sourced"; readonly data: readonly [{ readonly name: "Chatbot"; readonly y: 2200; }, { readonly name: "Discover"; readonly y: 1400; }, { readonly name: "Other"; readonly y: 3600; }]; }]; }; yAxis: { readonly title: { readonly text: "Amount Sourced"; }; }; legend: { readonly enabled: true; readonly shadow: false; }; }; }; export declare const _ColumnChartWithMultiLevelDrilldown: { (args: ColumnChartProps): React.JSX.Element; args: { classNames: { wrapper: string; }; cardTitle: string; customExportOptions: { key: string; label: string; format: string; }[]; series: ({ name: string; data: { name: string; y: number; drilldown: string; }[]; } | { name: string; data: number[]; })[]; drilldown: { readonly series: readonly [{ readonly name: "Jan Weekly Sales Data"; readonly id: "jan"; readonly data: readonly [{ readonly name: "Week 1"; readonly y: 50; }, { readonly name: "Week 2"; readonly y: 70; }, { readonly name: "Week 3"; readonly y: 60; }, { readonly name: "Week 4"; readonly y: 100; readonly drilldown: "daily"; }]; }, { readonly name: "Feb Weekly Sales Data"; readonly id: "feb"; readonly data: readonly [{ readonly name: "Week 5"; readonly y: 60; }, { readonly name: "Week 6"; readonly y: 80; }, { readonly name: "Week 7"; readonly y: 70; }, { readonly name: "Week 8"; readonly y: 100; readonly drilldown: "daily"; }]; }, { readonly name: "March Weekly Sales Data"; readonly id: "mar"; readonly data: readonly [{ readonly name: "Week 9"; readonly y: 70; }, { readonly name: "Week 10"; readonly y: 90; }, { readonly name: "Week 11"; readonly y: 80; }, { readonly name: "Week 12"; readonly y: 100; readonly drilldown: "daily"; }]; }, { readonly name: "April Weekly Sales Data"; readonly id: "apr"; readonly data: readonly [{ readonly name: "Week 13"; readonly y: 80; }, { readonly name: "Week 14"; readonly y: 100; readonly drilldown: "daily"; }, { readonly name: "Week 15"; readonly y: 90; }, { readonly name: "Week 16"; readonly y: 110; }]; }, { readonly name: "May Weekly Sales Data"; readonly id: "may"; readonly data: readonly [{ readonly name: "Week 1"; readonly y: 90; }, { readonly name: "Week 2"; readonly y: 110; }, { readonly name: "Week 3"; readonly y: 100; readonly drilldown: "daily"; }, { readonly name: "Week 4"; readonly y: 120; }]; }, { readonly name: "June Weekly Sales Data"; readonly id: "jun"; readonly data: readonly [{ readonly name: "Week 1"; readonly y: 100; readonly drilldown: "daily"; }, { readonly name: "Week 2"; readonly y: 120; }, { readonly name: "Week 3"; readonly y: 110; }, { readonly name: "Week 4"; readonly y: 130; }]; }, { readonly name: "Daily Sales Data"; readonly id: "daily"; readonly data: readonly [{ readonly name: "Day 1"; readonly y: 10; }, { readonly name: "Day 2"; readonly y: 15; }, { readonly name: "Day 3"; readonly y: 12; }, { readonly name: "Day 4"; readonly y: 18; }, { readonly name: "Day 5"; readonly y: 15; }, { readonly name: "Day 6"; readonly y: 11; }, { readonly name: "Day 7"; readonly y: 19; }]; }]; }; yAxis: { readonly title: { readonly text: "Sales"; }; }; legend: { readonly enabled: true; readonly shadow: false; }; plotOptions: { readonly series: { readonly cursor: "pointer"; }; }; }; }; //# sourceMappingURL=ColumnChart.stories.d.ts.map