@drivy/cobalt/components/Steps/index.js

Opinionated design system for Drivy's projects.

import { jsx, jsxs } from 'react/jsx-runtime';
import { Steps as Steps$1 } from '@ark-ui/react/steps';
import cx from 'classnames';

const Steps = ({ items }) => {
    return (jsx(Steps$1.Root, { className: "cobalt-steps", count: items.length, orientation: "vertical", children: items.map((item, index) => {
            const itemKey = index;
            return (jsxs(Steps$1.Item, { index: index, className: cx("cobalt-steps__item", {
                    "cobalt-steps__item--important": item.important,
                }), children: [jsxs("div", { className: "cobalt-steps__item__wrapper", children: [jsx(Steps$1.Indicator, { className: "cobalt-steps__item__indicator" }), jsxs("div", { className: "cobalt-steps__item__content", children: [jsx("div", { className: "cobalt-steps__item__label", children: item.label }), jsx("div", { className: "cobalt-steps__item__description", children: item.description })] })] }), jsx(Steps$1.Separator, { className: "cobalt-steps__item__separator" })] }, itemKey));
        }) }));
};

export { Steps };
//# sourceMappingURL=index.js.map