import { SeriesList } from './series-list';
import type { ControlsMap } from '../../sub-packages/styleguide/src/data/control-types';
const mockSeriesList = [
{
slug: 'power',
name: 'モジュラーシンセ電源入門',
description: 'モジュラーシンセの電源について、基礎から実践までを解説するシリーズです。',
thumbSlug: 'col-power-denkyu',
articleSlugs: ['col005-power', 'col006-power-vol2', 'col007-power-vol3', 'col008-power-vol4'],
createdDate: '2024-06-01',
updatedDate: '2025-01-15',
},
{
slug: 'diy',
name: 'DIYキット入門',
description: 'シンセDIYとDIYキットについて、必要な道具や基礎知識を解説するシリーズです。',
thumbSlug: 'column-001-cover',
articleSlugs: ['col001-diy-kits', 'col002-diy-tools'],
createdDate: '2024-03-10',
updatedDate: null,
},
{
slug: 'how-to-build',
name: '組み立てガイド',
description: 'Takazudo Modular製品の組み立て方法を詳しく解説するシリーズです。',
thumbSlug: 'zudo-block-build',
articleSlugs: ['how-to-build-zudo-block'],
createdDate: '2025-02-01',
updatedDate: '2025-12-20',
},
{
slug: 'oxi-one-guide',
name: 'OXI ONEガイド',
description: 'OXI ONEシーケンサーの使い方を日本語で解説するシリーズです。',
thumbSlug: 'oxi-front',
articleSlugs: ['oxi-one-guide1', 'oxi-one-guide2'],
createdDate: '2023-10-24',
updatedDate: '2024-03-15',
},
];
export const meta = {
title: 'List/SeriesList',
};
export const controls: ControlsMap = {
count: { type: 'number', default: 4, min: 0, max: 4 },
};
export const Default = {
args: { count: 4 },
render: ({ count }: { count: number }) => (
<SeriesList seriesList={mockSeriesList.slice(0, count)} />
),
};
export const SingleItem = () => <SeriesList seriesList={[mockSeriesList[0]]} />;
export const Empty = () => <SeriesList seriesList={[]} />;