@kaio-xyz/design-system 1.1.21 → 1.1.23

package/dist/index.d.ts

@@ -167,17 +167,20 @@ declare const Clipboard: ({ value, trim, trimLength }: ClipboardProps) => react_
 
 type StepperProps = {
     children: ReactNode;
+    className?: string;
+    dataTest?: string;
 };
-declare const Stepper: ({ children }: StepperProps) => react_jsx_runtime.JSX.Element;
+declare const Stepper: ({ children, dataTest, className }: StepperProps) => react_jsx_runtime.JSX.Element;
 
 type StepProps = {
     label: string;
+    dataTest: string;
     isCompleted?: boolean;
     isCurrent?: boolean;
     iconSize?: number;
     key?: string;
 };
-declare const Step: ({ key, label, iconSize, isCompleted, isCurrent }: StepProps) => react_jsx_runtime.JSX.Element;
+declare const Step: ({ key, label, dataTest, iconSize, isCompleted, isCurrent, }: StepProps) => react_jsx_runtime.JSX.Element;
 
 type ListProps = {
     label?: string;
@@ -186,7 +189,7 @@ type ListProps = {
 declare const List: ({ label, children }: ListProps) => react_jsx_runtime.JSX.Element;
 
 type ListItem = {
-    value?: string;
+    value?: ReactNode;
     label: string;
     key?: string;
 };

package/dist/index.esm.js

@@ -546,14 +546,14 @@ var Clipboard = function (_a) {
 var style$e = {"root":"stepper-module__root__hgDss"};
 
 var Stepper = function (_a) {
-    var children = _a.children;
-    return (jsx("ul", { className: style$e.root, children: children }));
+    var children = _a.children, dataTest = _a.dataTest, className = _a.className;
+    return (jsx("ul", { className: clsx(style$e.root, className), "data-test": dataTest, children: children }));
 };
 
 var style$d = {"root":"step-module__root__Tk1Yq","container":"step-module__container__XbQSB","label":"step-module__label__UNF3I","emptyIcon":"step-module__emptyIcon__-xNcB","checkIcon":"step-module__checkIcon__MWBUM","loadingIcon":"step-module__loadingIcon__-VoCZ"};
 
 var Step = function (_a) {
-    var key = _a.key, label = _a.label, _b = _a.iconSize, iconSize = _b === void 0 ? 16 : _b, _c = _a.isCompleted, isCompleted = _c === void 0 ? false : _c, _d = _a.isCurrent, isCurrent = _d === void 0 ? false : _d;
+    var key = _a.key, label = _a.label, dataTest = _a.dataTest, _b = _a.iconSize, iconSize = _b === void 0 ? 16 : _b, _c = _a.isCompleted, isCompleted = _c === void 0 ? false : _c, _d = _a.isCurrent, isCurrent = _d === void 0 ? false : _d;
     var icon = useMemo(function () {
         switch (true) {
             case isCompleted: return jsx(SvgCheck, { className: style$d.checkIcon });
@@ -561,7 +561,7 @@ var Step = function (_a) {
             default: return jsx("span", { className: style$d.emptyIcon });
         }
     }, [isCompleted, isCurrent]);
-    return (jsx("li", { className: style$d.root, "data-is-current": isCurrent, style: { '--icon-size': "".concat(iconSize, "px") }, children: jsxs(Stack, { className: style$d.container, position: "horizontal", children: [icon, jsx("span", { className: style$d.label, children: label })] }) }, key));
+    return (jsx("li", { className: style$d.root, "data-is-current": isCurrent, "data-test": dataTest, style: { '--icon-size': "".concat(iconSize, "px") }, children: jsxs(Stack, { className: style$d.container, position: "horizontal", children: [icon, jsx("span", { className: style$d.label, children: label })] }) }, key));
 };
 
 var style$c = {"root":"list-module__root__OXx93"};