import type { SampleMeta } from '../../../../widgets/core';
import { MultiProgressUI } from '../MultiProgressUI';

export const sampleMeta: SampleMeta = {
  id: 'dashboard-multi-progress-base',
  componentId: 'dashboard-multi-progress',
  title: 'Dashboard Multi Progress',
  description: '여러 단계 진행률을 하나의 막대와 범례로 함께 보여주는 컴포넌트입니다.',
  category: 'Components',
  kind: 'base',
  variantLabel: 'Base',
  order: 11,
  features: ['docs'],
};

export function Sample() {
  return (
    <MultiProgressUI
      label="오늘 처리 현황"
      meta="입고 / 피킹 / 출고"
      data={[
        { label: '입고', percent: 28, color: '#165dff' },
        { label: '피킹', percent: 34, color: '#52c41a' },
        { label: '출고', percent: 38, color: '#fa8c16' },
      ]}
    />
  );
}
