import { jsx as _jsx } from "react/jsx-runtime";
import { useState } from 'react';
import { CategoryFilter } from './category-filter.js';
const meta = {
    title: 'Features/CategoryFilter',
    component: CategoryFilter,
    tags: ['autodocs'],
    parameters: {
        layout: 'padded',
    },
};
export default meta;
/* ---------------------------------------------------------------------------
 * Interactive wrapper — manages activeCategory state
 * ------------------------------------------------------------------------- */
function InteractiveCategoryFilter({ initial, counts, }) {
    const [active, setActive] = useState(initial);
    return _jsx(CategoryFilter, { activeCategory: active, onCategoryChange: setActive, counts: counts });
}
/* ---------------------------------------------------------------------------
 * Stories
 * ------------------------------------------------------------------------- */
export const AllSelected = {
    render: () => _jsx(InteractiveCategoryFilter, { initial: null }),
};
export const WorkflowSelected = {
    render: () => _jsx(InteractiveCategoryFilter, { initial: "Workflow" }),
};
export const WithCounts = {
    render: () => (_jsx(InteractiveCategoryFilter, { initial: null, counts: {
            Workflow: 8,
            'Code Generation': 1,
            Analysis: 2,
            Reference: 7,
        } })),
};
