/**
 * title: "带描述"
 * description: "设置item数据的desc字段，显示描述文案。"
 */
import React, { useState, useCallback } from 'react';
import { Step } from '@alicloud/console-components';
var list = [
    { title: '已完成步骤', key: 1, desc: '一句话描述文案' },
    { title: '当前步骤', key: 2, desc: '一句话描述文案' },
    { title: '未完成最后步骤', key: 3, desc: '一句话描述文案' },
];
export default function App() {
    var _a = useState(1), currentStep = _a[0], setCurrentStep = _a[1];
    var stepClick = useCallback(function (index) {
        setCurrentStep(index);
    }, []);
    var steps1 = list.map(function (item) { return (React.createElement(Step.Item, { key: item.key, title: item.title, content: item.desc, onClick: function (index) { return stepClick(index); } })); });
    return (React.createElement("div", null,
        React.createElement(Step, { current: currentStep, shape: "circle", labelPlacement: "hoz" }, steps1)));
}
