@simplybusiness/mobius 3.2.1 → 3.2.3

package/CHANGELOG.md

@@ -5,6 +5,22 @@ All notable changes to this project will be documented in this file, or link in
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## [3.2.3] - 2023-01-11
+
+## Changed
+
+- Change `<Chopin.Actions />` to render as buttons by default. Previously, in order to render actions as buttons we would have to provide `elementType` prop, but that still required for `href` to be present. Now, with `href` provided, a `<LinkButton>` will show, otherwise `<Button>` will show
+
+### Fixed
+
+- Fixed `<Button />` default transition during page load by specifying only the properties that we want transitioning. This fixes an issue where conditionally added padding scales button in size in an inelegant way.
+
+## [3.2.2] - 2023-01-06
+
+### Fixed
+
+- Fixed `onClick` type for `<LinkButton>`, so that it always expects default event
+
 ## [3.2.0] - 2023-01-04
 
 ### Changed
@@ -132,6 +148,8 @@ Additionally, mobius and themes are available on the public NPM registry and can
 
 ## Github Links
 
+[3.2.3]: https://github.com/simplybusiness/mobius/releases/tag/v3.2.3
+[3.2.2]: https://github.com/simplybusiness/mobius/releases/tag/v3.2.2
 [3.2.1]: https://github.com/simplybusiness/mobius/releases/tag/v3.2.1
 [3.2.0]: https://github.com/simplybusiness/mobius/releases/tag/v3.2.0
 [3.1.3]: https://github.com/simplybusiness/mobius/releases/tag/v3.1.3

package/dist/cjs/components/Chopin/Actions/Actions.d.ts

@@ -1,13 +1,14 @@
 import { Ref } from "react";
 import { DOMProps } from "@react-types/shared";
+import { ButtonProps } from "../../Button";
 import { ForwardedRefComponent } from "../../../types/components";
 import { type LinkButtonProps } from "../../LinkButton";
 export type ActionsElementType = HTMLDivElement;
 export interface ActionsProps extends DOMProps {
     /** Custom class name for setting specific CSS */
     className?: string;
-    backButton?: LinkButtonProps;
-    nextButton?: LinkButtonProps;
+    backButton?: LinkButtonProps | ButtonProps;
+    nextButton?: LinkButtonProps | ButtonProps;
     backLabel?: string;
     nextLabel?: string;
 }

package/dist/cjs/components/Chopin/Actions/Actions.js

@@ -19,16 +19,16 @@ const jsx_runtime_1 = require("@emotion/react/jsx-runtime");
 const react_1 = require("react");
 const clsx_1 = __importDefault(require("clsx"));
 const Flex_1 = require("../../Flex");
-const LinkButton_1 = require("../../LinkButton");
+const LinkOrButton_1 = require("./LinkOrButton");
 const Actions = (0, react_1.forwardRef)((props, ref) => {
     const { className, backButton, nextButton, backLabel, nextLabel } = props, rest = __rest(props, ["className", "backButton", "nextButton", "backLabel", "nextLabel"]);
     const classes = (0, clsx_1.default)("chopin", "chopin/Actions", className);
     const nextButtonClasses = (0, clsx_1.default)("chopin/ActionsNext", {
-        "--single-action": !backButton,
+        "--single-action": !backLabel,
     });
     const backButtonProps = Object.assign(Object.assign({}, backButton), { className: "chopin/ActionsBack", variant: "ghost", icon: "leftArrow", size: "large" });
     const nextButtonProps = Object.assign(Object.assign({}, nextButton), { className: nextButtonClasses, size: "large" });
-    return ((0, jsx_runtime_1.jsx)(Flex_1.Flex, Object.assign({ ref: ref, className: classes, justifyContent: "center" }, rest, { children: (0, jsx_runtime_1.jsxs)(Flex_1.Flex, Object.assign({ className: "chopin/ActionsContainer", justifyContent: "space-between", alignItems: "center" }, { children: [(backButton === null || backButton === void 0 ? void 0 : backButton.href) && ((0, jsx_runtime_1.jsx)(LinkButton_1.LinkButton, Object.assign({}, backButtonProps, { href: backButtonProps.href }, { children: backLabel }))), (nextButton === null || nextButton === void 0 ? void 0 : nextButton.href) && ((0, jsx_runtime_1.jsx)(LinkButton_1.LinkButton, Object.assign({}, nextButtonProps, { href: nextButtonProps.href }, { children: nextLabel })))] })) })));
+    return ((0, jsx_runtime_1.jsx)(Flex_1.Flex, Object.assign({ ref: ref, className: classes, justifyContent: "center" }, rest, { children: (0, jsx_runtime_1.jsxs)(Flex_1.Flex, Object.assign({ className: "chopin/ActionsContainer", justifyContent: "space-between", alignItems: "center" }, { children: [(0, jsx_runtime_1.jsx)(LinkOrButton_1.LinkOrButton, Object.assign({ href: backButton === null || backButton === void 0 ? void 0 : backButton.href }, backButtonProps, { children: backLabel })), (0, jsx_runtime_1.jsx)(LinkOrButton_1.LinkOrButton, Object.assign({ href: nextButton === null || nextButton === void 0 ? void 0 : nextButton.href }, nextButtonProps, { children: nextLabel }))] })) })));
 });
 exports.Actions = Actions;
 Actions.displayName = "Actions";

package/dist/cjs/components/Chopin/Actions/Actions.js.map

@@ -1 +1 @@
-{"version":3,"file":"Actions.js","sourceRoot":"","sources":["../../../../../src/components/Chopin/Actions/Actions.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAAA,iCAAwC;AAExC,gDAAwB;AAGxB,qCAAkC;AAElC,iDAAoE;AAepE,MAAM,OAAO,GACX,IAAA,kBAAU,EAAC,CAAC,KAAmB,EAAE,GAAe,EAAE,EAAE;IAClD,MAAM,EAAE,SAAS,EAAE,UAAU,EAAE,UAAU,EAAE,SAAS,EAAE,SAAS,KAC7D,KAAK,EAD6D,IAAI,UACtE,KAAK,EADD,mEAAoE,CACnE,CAAC;IAER,MAAM,OAAO,GAAG,IAAA,cAAI,EAAC,QAAQ,EAAE,gBAAgB,EAAE,SAAS,CAAC,CAAC;IAC5D,MAAM,iBAAiB,GAAG,IAAA,cAAI,EAAC,oBAAoB,EAAE;QACnD,iBAAiB,EAAE,CAAC,UAAU;KAC/B,CAAC,CAAC;IAEH,MAAM,eAAe,mCAChB,UAAU,KACb,SAAS,EAAE,oBAAoB,EAC/B,OAAO,EAAE,OAAkB,EAC3B,IAAI,EAAE,WAAuB,EAC7B,IAAI,EAAE,OAAe,GACtB,CAAC;IAEF,MAAM,eAAe,mCAChB,UAAU,KACb,SAAS,EAAE,iBAAiB,EAC5B,IAAI,EAAE,OAAe,GACtB,CAAC;IAEF,OAAO,CACL,uBAAC,WAAI,kBAAC,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,OAAO,EAAE,cAAc,EAAC,QAAQ,IAAK,IAAI,cAClE,wBAAC,WAAI,kBACH,SAAS,EAAC,yBAAyB,EACnC,cAAc,EAAC,eAAe,EAC9B,UAAU,EAAC,QAAQ,iBAElB,CAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,IAAI,KAAI,CACnB,uBAAC,uBAAU,oBAAK,eAAe,IAAE,IAAI,EAAE,eAAe,CAAC,IAAK,gBACzD,SAAS,IACC,CACd,EACA,CAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,IAAI,KAAI,CACnB,uBAAC,uBAAU,oBAAK,eAAe,IAAE,IAAI,EAAE,eAAe,CAAC,IAAK,gBACzD,SAAS,IACC,CACd,KACI,IACF,CACR,CAAC;AACJ,CAAC,CAAC,CAAC;AAGI,0BAAO;AADhB,OAAO,CAAC,WAAW,GAAG,SAAS,CAAC"}
+{"version":3,"file":"Actions.js","sourceRoot":"","sources":["../../../../../src/components/Chopin/Actions/Actions.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAAA,iCAAwC;AAExC,gDAAwB;AAGxB,qCAAkC;AAGlC,iDAA8C;AAe9C,MAAM,OAAO,GACX,IAAA,kBAAU,EAAC,CAAC,KAAmB,EAAE,GAAe,EAAE,EAAE;IAClD,MAAM,EAAE,SAAS,EAAE,UAAU,EAAE,UAAU,EAAE,SAAS,EAAE,SAAS,KAC7D,KAAK,EAD6D,IAAI,UACtE,KAAK,EADD,mEAAoE,CACnE,CAAC;IAER,MAAM,OAAO,GAAG,IAAA,cAAI,EAAC,QAAQ,EAAE,gBAAgB,EAAE,SAAS,CAAC,CAAC;IAC5D,MAAM,iBAAiB,GAAG,IAAA,cAAI,EAAC,oBAAoB,EAAE;QACnD,iBAAiB,EAAE,CAAC,SAAS;KAC9B,CAAC,CAAC;IAEH,MAAM,eAAe,mCAChB,UAAU,KACb,SAAS,EAAE,oBAAoB,EAC/B,OAAO,EAAE,OAAkB,EAC3B,IAAI,EAAE,WAAuB,EAC7B,IAAI,EAAE,OAAe,GACtB,CAAC;IAEF,MAAM,eAAe,mCAChB,UAAU,KACb,SAAS,EAAE,iBAAiB,EAC5B,IAAI,EAAE,OAAe,GACtB,CAAC;IAEF,OAAO,CACL,uBAAC,WAAI,kBAAC,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,OAAO,EAAE,cAAc,EAAC,QAAQ,IAAK,IAAI,cAClE,wBAAC,WAAI,kBACH,SAAS,EAAC,yBAAyB,EACnC,cAAc,EAAC,eAAe,EAC9B,UAAU,EAAC,QAAQ,iBAEnB,uBAAC,2BAAY,kBAAC,IAAI,EAAE,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,IAAI,IAAM,eAAe,cACtD,SAAS,IACG,EACf,uBAAC,2BAAY,kBAAC,IAAI,EAAE,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,IAAI,IAAM,eAAe,cACtD,SAAS,IACG,KACV,IACF,CACR,CAAC;AACJ,CAAC,CAAC,CAAC;AAGI,0BAAO;AADhB,OAAO,CAAC,WAAW,GAAG,SAAS,CAAC"}

package/dist/cjs/components/Chopin/Actions/Actions.test.js

@@ -9,31 +9,31 @@ const NEXT_ACTION_CLASS_NAME = "chopin/ActionsNext";
 const NEXT_SINGLE_ACTION_CLASS_NAME = "--single-action";
 const backLabel = "Back";
 const mockOnBackClick = jest.fn();
-const BackButton = {
+const BackLink = {
     href: "https://test.com",
 };
 const mockOnNextClick = jest.fn();
 const nextLabel = "Next step";
-const NextButton = {
+const NextLink = {
     href: "https://test.com",
 };
 describe("Actions", () => {
     describe("uses correct class names", () => {
         it("includes custom class name", () => {
-            (0, react_1.render)((0, jsx_runtime_1.jsx)(_1.Actions, { "data-testid": "test-id", className: "my-class", nextButton: Object.assign({}, NextButton), nextLabel: nextLabel, backButton: Object.assign({}, BackButton), backLabel: backLabel }));
+            (0, react_1.render)((0, jsx_runtime_1.jsx)(_1.Actions, { "data-testid": "test-id", className: "my-class", nextButton: Object.assign({}, NextLink), nextLabel: nextLabel, backButton: Object.assign({}, BackLink), backLabel: backLabel }));
             expect(react_1.screen.getByTestId("test-id")).toHaveClass("chopin");
             expect(react_1.screen.getByTestId("test-id")).toHaveClass("my-class");
             expect(react_1.screen.getByTestId("test-id")).toHaveClass(ACTION_CLASS_NAME);
         });
         it("uses links class names", () => {
-            (0, react_1.render)((0, jsx_runtime_1.jsx)(_1.Actions, { backButton: Object.assign({}, BackButton), backLabel: backLabel, nextButton: Object.assign({}, NextButton), nextLabel: nextLabel }));
+            (0, react_1.render)((0, jsx_runtime_1.jsx)(_1.Actions, { backButton: Object.assign({}, BackLink), backLabel: backLabel, nextButton: Object.assign({}, NextLink), nextLabel: nextLabel }));
             const nextLinkEl = react_1.screen.getByRole("link", { name: /next step/i });
             expect(react_1.screen.getByRole("link", { name: /back/i })).toHaveClass(BACK_ACTION_CLASS_NAME);
             expect(nextLinkEl).toHaveClass(NEXT_ACTION_CLASS_NAME);
             expect(nextLinkEl).not.toHaveClass(NEXT_SINGLE_ACTION_CLASS_NAME);
         });
         it("uses --single-action class name with one action btn", () => {
-            (0, react_1.render)((0, jsx_runtime_1.jsx)(_1.Actions, { nextButton: Object.assign({}, NextButton), nextLabel: nextLabel }));
+            (0, react_1.render)((0, jsx_runtime_1.jsx)(_1.Actions, { nextButton: Object.assign({}, NextLink), nextLabel: nextLabel }));
             expect(react_1.screen.getByRole("link", { name: /next step/i })).toHaveClass(NEXT_SINGLE_ACTION_CLASS_NAME);
         });
     });
@@ -51,22 +51,22 @@ describe("Actions", () => {
             })).not.toBeInTheDocument();
         });
         it("renders button elements if elementType is button", () => {
-            (0, react_1.render)((0, jsx_runtime_1.jsx)(_1.Actions, { backButton: Object.assign(Object.assign({}, BackButton), { elementType: "button" }), backLabel: backLabel, nextButton: Object.assign(Object.assign({}, NextButton), { elementType: "button" }), nextLabel: nextLabel }));
-            expect(react_1.screen.queryByRole("link", {
-                name: /back/i,
-            })).not.toBeInTheDocument();
-            expect(react_1.screen.queryByRole("link", {
-                name: /next step/i,
-            })).not.toBeInTheDocument();
-            expect(react_1.screen.getByRole("button", {
+            (0, react_1.render)((0, jsx_runtime_1.jsx)(_1.Actions, { backLabel: backLabel, nextLabel: nextLabel }));
+            const backComponent = react_1.screen.queryByRole("button", {
                 name: /back/i,
-            })).toBeInTheDocument();
-            expect(react_1.screen.getByRole("button", {
+            });
+            const nextComponent = react_1.screen.getByRole("button", {
                 name: /next step/i,
-            })).toBeInTheDocument();
+            });
+            const links = react_1.screen.queryByRole("link");
+            expect(links).toBeNull();
+            expect(backComponent).toBeInTheDocument();
+            expect(nextComponent).toBeInTheDocument();
         });
         it("fires onNextClick handler on click event", () => {
-            (0, react_1.render)((0, jsx_runtime_1.jsx)(_1.Actions, { backButton: Object.assign({}, BackButton), backLabel: backLabel, nextButton: Object.assign(Object.assign({}, NextButton), { elementType: "button", onClick: mockOnNextClick }), nextLabel: nextLabel }));
+            (0, react_1.render)((0, jsx_runtime_1.jsx)(_1.Actions, { backLabel: backLabel, nextButton: {
+                    onClick: mockOnNextClick,
+                }, nextLabel: nextLabel }));
             const nextActionBtn = react_1.screen.getByRole("button", {
                 name: /Next step/i,
             });
@@ -74,7 +74,9 @@ describe("Actions", () => {
             expect(mockOnNextClick).toHaveBeenCalledTimes(1);
         });
         it("fires onBackClick handler on click event", () => {
-            (0, react_1.render)((0, jsx_runtime_1.jsx)(_1.Actions, { backButton: Object.assign(Object.assign({}, BackButton), { elementType: "button", onClick: mockOnBackClick }), backLabel: backLabel, nextButton: Object.assign({}, NextButton), nextLabel: nextLabel }));
+            (0, react_1.render)((0, jsx_runtime_1.jsx)(_1.Actions, { backButton: {
+                    onClick: mockOnBackClick,
+                }, backLabel: backLabel, nextLabel: nextLabel }));
             const backActionBtn = react_1.screen.getByRole("button", {
                 name: /Back/i,
             });
@@ -82,7 +84,9 @@ describe("Actions", () => {
             expect(mockOnBackClick).toHaveBeenCalledTimes(1);
         });
         it("allows buttons to be disabled", () => {
-            (0, react_1.render)((0, jsx_runtime_1.jsx)(_1.Actions, { nextButton: Object.assign(Object.assign({}, NextButton), { elementType: "button", isDisabled: true }), nextLabel: nextLabel }));
+            (0, react_1.render)((0, jsx_runtime_1.jsx)(_1.Actions, { nextButton: {
+                    isDisabled: true,
+                }, nextLabel: nextLabel }));
             const nextActionBtn = react_1.screen.getByRole("button", {
                 name: /Next step/i,
             });

package/dist/cjs/components/Chopin/Actions/Actions.test.js.map

@@ -1 +1 @@
-{"version":3,"file":"Actions.test.js","sourceRoot":"","sources":["../../../../../src/components/Chopin/Actions/Actions.test.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Actions.test.js","sourceRoot":"","sources":["../../../../../src/components/Chopin/Actions/Actions.test.tsx"],"names":[],"mappings":"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"}

package/dist/cjs/components/Chopin/Actions/LinkOrButton.d.ts

@@ -0,0 +1,3 @@
+import { ButtonProps } from "../../Button";
+import { LinkButtonProps } from "../../LinkButton";
+export declare const LinkOrButton: ({ href, children, ...rest }: LinkButtonProps | ButtonProps) => import("@emotion/react/jsx-runtime").JSX.Element | null;

package/dist/cjs/components/Chopin/Actions/LinkOrButton.js

@@ -0,0 +1,28 @@
+"use strict";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.LinkOrButton = void 0;
+const jsx_runtime_1 = require("@emotion/react/jsx-runtime");
+const Button_1 = require("../../Button");
+const LinkButton_1 = require("../../LinkButton");
+const LinkOrButton = (_a) => {
+    var { href, children } = _a, rest = __rest(_a, ["href", "children"]);
+    if (!children)
+        return null;
+    if (href) {
+        return ((0, jsx_runtime_1.jsx)(LinkButton_1.LinkButton, Object.assign({}, rest, { href: href }, { children: children })));
+    }
+    return (0, jsx_runtime_1.jsx)(Button_1.Button, Object.assign({}, rest, { children: children }));
+};
+exports.LinkOrButton = LinkOrButton;
+//# sourceMappingURL=LinkOrButton.js.map

package/dist/cjs/components/Chopin/Actions/LinkOrButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LinkOrButton.js","sourceRoot":"","sources":["../../../../../src/components/Chopin/Actions/LinkOrButton.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;AAAA,yCAAmD;AACnD,iDAA+D;AAExD,MAAM,YAAY,GAAG,CAAC,EAIG,EAAE,EAAE;QAJP,EAC3B,IAAI,EACJ,QAAQ,OAEsB,EAD3B,IAAI,cAHoB,oBAI5B,CADQ;IAEP,IAAI,CAAC,QAAQ;QAAE,OAAO,IAAI,CAAC;IAE3B,IAAI,IAAI,EAAE;QACR,OAAO,CACL,uBAAC,uBAAU,oBAAM,IAAwB,IAAE,IAAI,EAAE,IAAK,gBACnD,QAAQ,IACE,CACd,CAAC;KACH;IAED,OAAO,uBAAC,eAAM,oBAAM,IAAoB,cAAG,QAAQ,IAAU,CAAC;AAChE,CAAC,CAAC;AAhBW,QAAA,YAAY,gBAgBvB"}

package/dist/cjs/components/Chopin/Actions/LinkOrButton.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/cjs/components/Chopin/Actions/LinkOrButton.test.js

@@ -0,0 +1,35 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("@emotion/react/jsx-runtime");
+const react_1 = require("@testing-library/react");
+const LinkOrButton_1 = require("./LinkOrButton");
+describe("LinkOrButton", () => {
+    describe("given no children are provided", () => {
+        it("renders nothing", () => {
+            const { container } = (0, react_1.render)((0, jsx_runtime_1.jsx)(LinkOrButton_1.LinkOrButton, {}));
+            expect(container).toBeEmptyDOMElement();
+        });
+    });
+    describe("given href is provided", () => {
+        it("renders anchor tag", () => {
+            const url = "http://www.example.com";
+            (0, react_1.render)((0, jsx_runtime_1.jsx)(LinkOrButton_1.LinkOrButton, Object.assign({ className: "green", href: url }, { children: "I am a link" })));
+            const link = react_1.screen.getByRole("link");
+            expect(link).toBeInTheDocument();
+            expect(link).toHaveClass("green");
+            expect(link).toHaveAttribute("href", url);
+        });
+    });
+    describe("given href is not provided", () => {
+        it("renders button", () => {
+            const clickHandler = jest.fn();
+            (0, react_1.render)((0, jsx_runtime_1.jsx)(LinkOrButton_1.LinkOrButton, Object.assign({ "data-id": "test", onClick: clickHandler }, { children: "I am a button" })));
+            const button = react_1.screen.getByRole("button");
+            expect(button).toBeInTheDocument();
+            expect(button).toHaveAttribute("data-id", "test");
+            react_1.fireEvent.click(button);
+            expect(clickHandler).toHaveBeenCalled();
+        });
+    });
+});
+//# sourceMappingURL=LinkOrButton.test.js.map

package/dist/cjs/components/Chopin/Actions/LinkOrButton.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LinkOrButton.test.js","sourceRoot":"","sources":["../../../../../src/components/Chopin/Actions/LinkOrButton.test.tsx"],"names":[],"mappings":";;;AAAA,kDAAmE;AACnE,iDAA8C;AAE9C,QAAQ,CAAC,cAAc,EAAE,GAAG,EAAE;IAC5B,QAAQ,CAAC,gCAAgC,EAAE,GAAG,EAAE;QAC9C,EAAE,CAAC,iBAAiB,EAAE,GAAG,EAAE;YACzB,MAAM,EAAE,SAAS,EAAE,GAAG,IAAA,cAAM,EAAC,uBAAC,2BAAY,KAAG,CAAC,CAAC;YAE/C,MAAM,CAAC,SAAS,CAAC,CAAC,mBAAmB,EAAE,CAAC;QAC1C,CAAC,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,QAAQ,CAAC,wBAAwB,EAAE,GAAG,EAAE;QACtC,EAAE,CAAC,oBAAoB,EAAE,GAAG,EAAE;YAC5B,MAAM,GAAG,GAAG,wBAAwB,CAAC;YAErC,IAAA,cAAM,EACJ,uBAAC,2BAAY,kBAAC,SAAS,EAAC,OAAO,EAAC,IAAI,EAAE,GAAG,iCAE1B,CAChB,CAAC;YAEF,MAAM,IAAI,GAAG,cAAM,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC;YAEtC,MAAM,CAAC,IAAI,CAAC,CAAC,iBAAiB,EAAE,CAAC;YACjC,MAAM,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC,OAAO,CAAC,CAAC;YAClC,MAAM,CAAC,IAAI,CAAC,CAAC,eAAe,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;QAC5C,CAAC,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,QAAQ,CAAC,4BAA4B,EAAE,GAAG,EAAE;QAC1C,EAAE,CAAC,gBAAgB,EAAE,GAAG,EAAE;YACxB,MAAM,YAAY,GAAG,IAAI,CAAC,EAAE,EAAE,CAAC;YAE/B,IAAA,cAAM,EACJ,uBAAC,2BAAY,6BAAS,MAAM,EAAC,OAAO,EAAE,YAAY,mCAEnC,CAChB,CAAC;YAEF,MAAM,MAAM,GAAG,cAAM,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC;YAE1C,MAAM,CAAC,MAAM,CAAC,CAAC,iBAAiB,EAAE,CAAC;YACnC,MAAM,CAAC,MAAM,CAAC,CAAC,eAAe,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC;YAElD,iBAAS,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;YAExB,MAAM,CAAC,YAAY,CAAC,CAAC,gBAAgB,EAAE,CAAC;QAC1C,CAAC,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC"}

package/dist/cjs/components/LinkButton/LinkButton.d.ts

@@ -1,4 +1,4 @@
-import { HTMLAttributeAnchorTarget } from "react";
+import { HTMLAttributeAnchorTarget, SyntheticEvent } from "react";
 import type { Link } from "react-router-dom";
 import { ButtonProps } from "../Button";
 export interface LinkButtonProps extends Omit<ButtonProps, "elementType"> {
@@ -9,7 +9,7 @@ export interface LinkButtonProps extends Omit<ButtonProps, "elementType"> {
     download?: boolean | string;
     rel?: string;
     target?: HTMLAttributeAnchorTarget;
-    onClick?: () => void;
+    onClick?: (event: SyntheticEvent) => void;
     to?: React.ComponentProps<typeof Link>["to"];
     elementType?: React.ElementType;
 }

package/dist/esm/components/Chopin/Actions/Actions.js

@@ -13,16 +13,16 @@ import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
 import { forwardRef } from "react";
 import clsx from "clsx";
 import { Flex } from "../../Flex";
-import { LinkButton } from "../../LinkButton";
+import { LinkOrButton } from "./LinkOrButton";
 const Actions = forwardRef((props, ref) => {
     const { className, backButton, nextButton, backLabel, nextLabel } = props, rest = __rest(props, ["className", "backButton", "nextButton", "backLabel", "nextLabel"]);
     const classes = clsx("chopin", "chopin/Actions", className);
     const nextButtonClasses = clsx("chopin/ActionsNext", {
-        "--single-action": !backButton,
+        "--single-action": !backLabel,
     });
     const backButtonProps = Object.assign(Object.assign({}, backButton), { className: "chopin/ActionsBack", variant: "ghost", icon: "leftArrow", size: "large" });
     const nextButtonProps = Object.assign(Object.assign({}, nextButton), { className: nextButtonClasses, size: "large" });
-    return (_jsx(Flex, Object.assign({ ref: ref, className: classes, justifyContent: "center" }, rest, { children: _jsxs(Flex, Object.assign({ className: "chopin/ActionsContainer", justifyContent: "space-between", alignItems: "center" }, { children: [(backButton === null || backButton === void 0 ? void 0 : backButton.href) && (_jsx(LinkButton, Object.assign({}, backButtonProps, { href: backButtonProps.href }, { children: backLabel }))), (nextButton === null || nextButton === void 0 ? void 0 : nextButton.href) && (_jsx(LinkButton, Object.assign({}, nextButtonProps, { href: nextButtonProps.href }, { children: nextLabel })))] })) })));
+    return (_jsx(Flex, Object.assign({ ref: ref, className: classes, justifyContent: "center" }, rest, { children: _jsxs(Flex, Object.assign({ className: "chopin/ActionsContainer", justifyContent: "space-between", alignItems: "center" }, { children: [_jsx(LinkOrButton, Object.assign({ href: backButton === null || backButton === void 0 ? void 0 : backButton.href }, backButtonProps, { children: backLabel })), _jsx(LinkOrButton, Object.assign({ href: nextButton === null || nextButton === void 0 ? void 0 : nextButton.href }, nextButtonProps, { children: nextLabel }))] })) })));
 });
 Actions.displayName = "Actions";
 export { Actions };

package/dist/esm/components/Chopin/Actions/Actions.js.map

@@ -1 +1 @@
-{"version":3,"file":"Actions.js","sourceRoot":"","sources":["../../../../../src/components/Chopin/Actions/Actions.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA,OAAO,EAAE,UAAU,EAAO,MAAM,OAAO,CAAC;AAExC,OAAO,IAAI,MAAM,MAAM,CAAC;AAGxB,OAAO,EAAE,IAAI,EAAE,MAAM,YAAY,CAAC;AAElC,OAAO,EAAE,UAAU,EAAwB,MAAM,kBAAkB,CAAC;AAepE,MAAM,OAAO,GACX,UAAU,CAAC,CAAC,KAAmB,EAAE,GAAe,EAAE,EAAE;IAClD,MAAM,EAAE,SAAS,EAAE,UAAU,EAAE,UAAU,EAAE,SAAS,EAAE,SAAS,KAC7D,KAAK,EAD6D,IAAI,UACtE,KAAK,EADD,mEAAoE,CACnE,CAAC;IAER,MAAM,OAAO,GAAG,IAAI,CAAC,QAAQ,EAAE,gBAAgB,EAAE,SAAS,CAAC,CAAC;IAC5D,MAAM,iBAAiB,GAAG,IAAI,CAAC,oBAAoB,EAAE;QACnD,iBAAiB,EAAE,CAAC,UAAU;KAC/B,CAAC,CAAC;IAEH,MAAM,eAAe,mCAChB,UAAU,KACb,SAAS,EAAE,oBAAoB,EAC/B,OAAO,EAAE,OAAkB,EAC3B,IAAI,EAAE,WAAuB,EAC7B,IAAI,EAAE,OAAe,GACtB,CAAC;IAEF,MAAM,eAAe,mCAChB,UAAU,KACb,SAAS,EAAE,iBAAiB,EAC5B,IAAI,EAAE,OAAe,GACtB,CAAC;IAEF,OAAO,CACL,KAAC,IAAI,kBAAC,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,OAAO,EAAE,cAAc,EAAC,QAAQ,IAAK,IAAI,cAClE,MAAC,IAAI,kBACH,SAAS,EAAC,yBAAyB,EACnC,cAAc,EAAC,eAAe,EAC9B,UAAU,EAAC,QAAQ,iBAElB,CAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,IAAI,KAAI,CACnB,KAAC,UAAU,oBAAK,eAAe,IAAE,IAAI,EAAE,eAAe,CAAC,IAAK,gBACzD,SAAS,IACC,CACd,EACA,CAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,IAAI,KAAI,CACnB,KAAC,UAAU,oBAAK,eAAe,IAAE,IAAI,EAAE,eAAe,CAAC,IAAK,gBACzD,SAAS,IACC,CACd,KACI,IACF,CACR,CAAC;AACJ,CAAC,CAAC,CAAC;AAEL,OAAO,CAAC,WAAW,GAAG,SAAS,CAAC;AAChC,OAAO,EAAE,OAAO,EAAE,CAAC"}
+{"version":3,"file":"Actions.js","sourceRoot":"","sources":["../../../../../src/components/Chopin/Actions/Actions.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA,OAAO,EAAE,UAAU,EAAO,MAAM,OAAO,CAAC;AAExC,OAAO,IAAI,MAAM,MAAM,CAAC;AAGxB,OAAO,EAAE,IAAI,EAAE,MAAM,YAAY,CAAC;AAGlC,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAe9C,MAAM,OAAO,GACX,UAAU,CAAC,CAAC,KAAmB,EAAE,GAAe,EAAE,EAAE;IAClD,MAAM,EAAE,SAAS,EAAE,UAAU,EAAE,UAAU,EAAE,SAAS,EAAE,SAAS,KAC7D,KAAK,EAD6D,IAAI,UACtE,KAAK,EADD,mEAAoE,CACnE,CAAC;IAER,MAAM,OAAO,GAAG,IAAI,CAAC,QAAQ,EAAE,gBAAgB,EAAE,SAAS,CAAC,CAAC;IAC5D,MAAM,iBAAiB,GAAG,IAAI,CAAC,oBAAoB,EAAE;QACnD,iBAAiB,EAAE,CAAC,SAAS;KAC9B,CAAC,CAAC;IAEH,MAAM,eAAe,mCAChB,UAAU,KACb,SAAS,EAAE,oBAAoB,EAC/B,OAAO,EAAE,OAAkB,EAC3B,IAAI,EAAE,WAAuB,EAC7B,IAAI,EAAE,OAAe,GACtB,CAAC;IAEF,MAAM,eAAe,mCAChB,UAAU,KACb,SAAS,EAAE,iBAAiB,EAC5B,IAAI,EAAE,OAAe,GACtB,CAAC;IAEF,OAAO,CACL,KAAC,IAAI,kBAAC,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,OAAO,EAAE,cAAc,EAAC,QAAQ,IAAK,IAAI,cAClE,MAAC,IAAI,kBACH,SAAS,EAAC,yBAAyB,EACnC,cAAc,EAAC,eAAe,EAC9B,UAAU,EAAC,QAAQ,iBAEnB,KAAC,YAAY,kBAAC,IAAI,EAAE,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,IAAI,IAAM,eAAe,cACtD,SAAS,IACG,EACf,KAAC,YAAY,kBAAC,IAAI,EAAE,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,IAAI,IAAM,eAAe,cACtD,SAAS,IACG,KACV,IACF,CACR,CAAC;AACJ,CAAC,CAAC,CAAC;AAEL,OAAO,CAAC,WAAW,GAAG,SAAS,CAAC;AAChC,OAAO,EAAE,OAAO,EAAE,CAAC"}

package/dist/esm/components/Chopin/Actions/Actions.test.js

@@ -7,31 +7,31 @@ const NEXT_ACTION_CLASS_NAME = "chopin/ActionsNext";
 const NEXT_SINGLE_ACTION_CLASS_NAME = "--single-action";
 const backLabel = "Back";
 const mockOnBackClick = jest.fn();
-const BackButton = {
+const BackLink = {
     href: "https://test.com",
 };
 const mockOnNextClick = jest.fn();
 const nextLabel = "Next step";
-const NextButton = {
+const NextLink = {
     href: "https://test.com",
 };
 describe("Actions", () => {
     describe("uses correct class names", () => {
         it("includes custom class name", () => {
-            render(_jsx(Actions, { "data-testid": "test-id", className: "my-class", nextButton: Object.assign({}, NextButton), nextLabel: nextLabel, backButton: Object.assign({}, BackButton), backLabel: backLabel }));
+            render(_jsx(Actions, { "data-testid": "test-id", className: "my-class", nextButton: Object.assign({}, NextLink), nextLabel: nextLabel, backButton: Object.assign({}, BackLink), backLabel: backLabel }));
             expect(screen.getByTestId("test-id")).toHaveClass("chopin");
             expect(screen.getByTestId("test-id")).toHaveClass("my-class");
             expect(screen.getByTestId("test-id")).toHaveClass(ACTION_CLASS_NAME);
         });
         it("uses links class names", () => {
-            render(_jsx(Actions, { backButton: Object.assign({}, BackButton), backLabel: backLabel, nextButton: Object.assign({}, NextButton), nextLabel: nextLabel }));
+            render(_jsx(Actions, { backButton: Object.assign({}, BackLink), backLabel: backLabel, nextButton: Object.assign({}, NextLink), nextLabel: nextLabel }));
             const nextLinkEl = screen.getByRole("link", { name: /next step/i });
             expect(screen.getByRole("link", { name: /back/i })).toHaveClass(BACK_ACTION_CLASS_NAME);
             expect(nextLinkEl).toHaveClass(NEXT_ACTION_CLASS_NAME);
             expect(nextLinkEl).not.toHaveClass(NEXT_SINGLE_ACTION_CLASS_NAME);
         });
         it("uses --single-action class name with one action btn", () => {
-            render(_jsx(Actions, { nextButton: Object.assign({}, NextButton), nextLabel: nextLabel }));
+            render(_jsx(Actions, { nextButton: Object.assign({}, NextLink), nextLabel: nextLabel }));
             expect(screen.getByRole("link", { name: /next step/i })).toHaveClass(NEXT_SINGLE_ACTION_CLASS_NAME);
         });
     });
@@ -49,22 +49,22 @@ describe("Actions", () => {
             })).not.toBeInTheDocument();
         });
         it("renders button elements if elementType is button", () => {
-            render(_jsx(Actions, { backButton: Object.assign(Object.assign({}, BackButton), { elementType: "button" }), backLabel: backLabel, nextButton: Object.assign(Object.assign({}, NextButton), { elementType: "button" }), nextLabel: nextLabel }));
-            expect(screen.queryByRole("link", {
-                name: /back/i,
-            })).not.toBeInTheDocument();
-            expect(screen.queryByRole("link", {
-                name: /next step/i,
-            })).not.toBeInTheDocument();
-            expect(screen.getByRole("button", {
+            render(_jsx(Actions, { backLabel: backLabel, nextLabel: nextLabel }));
+            const backComponent = screen.queryByRole("button", {
                 name: /back/i,
-            })).toBeInTheDocument();
-            expect(screen.getByRole("button", {
+            });
+            const nextComponent = screen.getByRole("button", {
                 name: /next step/i,
-            })).toBeInTheDocument();
+            });
+            const links = screen.queryByRole("link");
+            expect(links).toBeNull();
+            expect(backComponent).toBeInTheDocument();
+            expect(nextComponent).toBeInTheDocument();
         });
         it("fires onNextClick handler on click event", () => {
-            render(_jsx(Actions, { backButton: Object.assign({}, BackButton), backLabel: backLabel, nextButton: Object.assign(Object.assign({}, NextButton), { elementType: "button", onClick: mockOnNextClick }), nextLabel: nextLabel }));
+            render(_jsx(Actions, { backLabel: backLabel, nextButton: {
+                    onClick: mockOnNextClick,
+                }, nextLabel: nextLabel }));
             const nextActionBtn = screen.getByRole("button", {
                 name: /Next step/i,
             });
@@ -72,7 +72,9 @@ describe("Actions", () => {
             expect(mockOnNextClick).toHaveBeenCalledTimes(1);
         });
         it("fires onBackClick handler on click event", () => {
-            render(_jsx(Actions, { backButton: Object.assign(Object.assign({}, BackButton), { elementType: "button", onClick: mockOnBackClick }), backLabel: backLabel, nextButton: Object.assign({}, NextButton), nextLabel: nextLabel }));
+            render(_jsx(Actions, { backButton: {
+                    onClick: mockOnBackClick,
+                }, backLabel: backLabel, nextLabel: nextLabel }));
             const backActionBtn = screen.getByRole("button", {
                 name: /Back/i,
             });
@@ -80,7 +82,9 @@ describe("Actions", () => {
             expect(mockOnBackClick).toHaveBeenCalledTimes(1);
         });
         it("allows buttons to be disabled", () => {
-            render(_jsx(Actions, { nextButton: Object.assign(Object.assign({}, NextButton), { elementType: "button", isDisabled: true }), nextLabel: nextLabel }));
+            render(_jsx(Actions, { nextButton: {
+                    isDisabled: true,
+                }, nextLabel: nextLabel }));
             const nextActionBtn = screen.getByRole("button", {
                 name: /Next step/i,
             });

package/dist/esm/components/Chopin/Actions/Actions.test.js.map

@@ -1 +1 @@
-{"version":3,"file":"Actions.test.js","sourceRoot":"","sources":["../../../../../src/components/Chopin/Actions/Actions.test.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Actions.test.js","sourceRoot":"","sources":["../../../../../src/components/Chopin/Actions/Actions.test.tsx"],"names":[],"mappings":"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"}

package/dist/esm/components/Chopin/Actions/LinkOrButton.js

@@ -0,0 +1,24 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx } from "@emotion/react/jsx-runtime";
+import { Button } from "../../Button";
+import { LinkButton } from "../../LinkButton";
+export const LinkOrButton = (_a) => {
+    var { href, children } = _a, rest = __rest(_a, ["href", "children"]);
+    if (!children)
+        return null;
+    if (href) {
+        return (_jsx(LinkButton, Object.assign({}, rest, { href: href }, { children: children })));
+    }
+    return _jsx(Button, Object.assign({}, rest, { children: children }));
+};
+//# sourceMappingURL=LinkOrButton.js.map

package/dist/esm/components/Chopin/Actions/LinkOrButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LinkOrButton.js","sourceRoot":"","sources":["../../../../../src/components/Chopin/Actions/LinkOrButton.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA,OAAO,EAAE,MAAM,EAAe,MAAM,cAAc,CAAC;AACnD,OAAO,EAAE,UAAU,EAAmB,MAAM,kBAAkB,CAAC;AAE/D,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,EAIG,EAAE,EAAE;QAJP,EAC3B,IAAI,EACJ,QAAQ,OAEsB,EAD3B,IAAI,cAHoB,oBAI5B,CADQ;IAEP,IAAI,CAAC,QAAQ;QAAE,OAAO,IAAI,CAAC;IAE3B,IAAI,IAAI,EAAE;QACR,OAAO,CACL,KAAC,UAAU,oBAAM,IAAwB,IAAE,IAAI,EAAE,IAAK,gBACnD,QAAQ,IACE,CACd,CAAC;KACH;IAED,OAAO,KAAC,MAAM,oBAAM,IAAoB,cAAG,QAAQ,IAAU,CAAC;AAChE,CAAC,CAAC"}

package/dist/esm/components/Chopin/Actions/LinkOrButton.test.js

@@ -0,0 +1,33 @@
+import { jsx as _jsx } from "@emotion/react/jsx-runtime";
+import { fireEvent, render, screen } from "@testing-library/react";
+import { LinkOrButton } from "./LinkOrButton";
+describe("LinkOrButton", () => {
+    describe("given no children are provided", () => {
+        it("renders nothing", () => {
+            const { container } = render(_jsx(LinkOrButton, {}));
+            expect(container).toBeEmptyDOMElement();
+        });
+    });
+    describe("given href is provided", () => {
+        it("renders anchor tag", () => {
+            const url = "http://www.example.com";
+            render(_jsx(LinkOrButton, Object.assign({ className: "green", href: url }, { children: "I am a link" })));
+            const link = screen.getByRole("link");
+            expect(link).toBeInTheDocument();
+            expect(link).toHaveClass("green");
+            expect(link).toHaveAttribute("href", url);
+        });
+    });
+    describe("given href is not provided", () => {
+        it("renders button", () => {
+            const clickHandler = jest.fn();
+            render(_jsx(LinkOrButton, Object.assign({ "data-id": "test", onClick: clickHandler }, { children: "I am a button" })));
+            const button = screen.getByRole("button");
+            expect(button).toBeInTheDocument();
+            expect(button).toHaveAttribute("data-id", "test");
+            fireEvent.click(button);
+            expect(clickHandler).toHaveBeenCalled();
+        });
+    });
+});
+//# sourceMappingURL=LinkOrButton.test.js.map

package/dist/esm/components/Chopin/Actions/LinkOrButton.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LinkOrButton.test.js","sourceRoot":"","sources":["../../../../../src/components/Chopin/Actions/LinkOrButton.test.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAC;AACnE,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAE9C,QAAQ,CAAC,cAAc,EAAE,GAAG,EAAE;IAC5B,QAAQ,CAAC,gCAAgC,EAAE,GAAG,EAAE;QAC9C,EAAE,CAAC,iBAAiB,EAAE,GAAG,EAAE;YACzB,MAAM,EAAE,SAAS,EAAE,GAAG,MAAM,CAAC,KAAC,YAAY,KAAG,CAAC,CAAC;YAE/C,MAAM,CAAC,SAAS,CAAC,CAAC,mBAAmB,EAAE,CAAC;QAC1C,CAAC,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,QAAQ,CAAC,wBAAwB,EAAE,GAAG,EAAE;QACtC,EAAE,CAAC,oBAAoB,EAAE,GAAG,EAAE;YAC5B,MAAM,GAAG,GAAG,wBAAwB,CAAC;YAErC,MAAM,CACJ,KAAC,YAAY,kBAAC,SAAS,EAAC,OAAO,EAAC,IAAI,EAAE,GAAG,iCAE1B,CAChB,CAAC;YAEF,MAAM,IAAI,GAAG,MAAM,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC;YAEtC,MAAM,CAAC,IAAI,CAAC,CAAC,iBAAiB,EAAE,CAAC;YACjC,MAAM,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC,OAAO,CAAC,CAAC;YAClC,MAAM,CAAC,IAAI,CAAC,CAAC,eAAe,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;QAC5C,CAAC,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,QAAQ,CAAC,4BAA4B,EAAE,GAAG,EAAE;QAC1C,EAAE,CAAC,gBAAgB,EAAE,GAAG,EAAE;YACxB,MAAM,YAAY,GAAG,IAAI,CAAC,EAAE,EAAE,CAAC;YAE/B,MAAM,CACJ,KAAC,YAAY,6BAAS,MAAM,EAAC,OAAO,EAAE,YAAY,mCAEnC,CAChB,CAAC;YAEF,MAAM,MAAM,GAAG,MAAM,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC;YAE1C,MAAM,CAAC,MAAM,CAAC,CAAC,iBAAiB,EAAE,CAAC;YACnC,MAAM,CAAC,MAAM,CAAC,CAAC,eAAe,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC;YAElD,SAAS,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;YAExB,MAAM,CAAC,YAAY,CAAC,CAAC,gBAAgB,EAAE,CAAC;QAC1C,CAAC,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC"}

package/dist/mobius.d.ts

@@ -43,6 +43,7 @@ import { RefAttributes } from 'react';
 import { SeparatorProps } from '@react-aria/separator';
 import { SliderProps as SliderProps_2 } from '@react-types/slider';
 import { SSRProvider } from '@react-aria/ssr';
+import { SyntheticEvent } from 'react';
 import { useVisuallyHidden } from '@react-aria/visually-hidden';
 import { Validation } from '@react-types/shared';
 import { VisuallyHidden } from '@react-aria/visually-hidden';
@@ -84,8 +85,8 @@ declare type ActionsElementType = HTMLDivElement;
 declare interface ActionsProps extends DOMProps {
     /** Custom class name for setting specific CSS */
     className?: string;
-    backButton?: LinkButtonProps;
-    nextButton?: LinkButtonProps;
+    backButton?: LinkButtonProps | ButtonProps;
+    nextButton?: LinkButtonProps | ButtonProps;
     backLabel?: string;
     nextLabel?: string;
 }
@@ -604,7 +605,7 @@ export declare interface LinkButtonProps extends Omit<ButtonProps, "elementType"
     download?: boolean | string;
     rel?: string;
     target?: HTMLAttributeAnchorTarget;
-    onClick?: () => void;
+    onClick?: (event: SyntheticEvent) => void;
     to?: React.ComponentProps<typeof Link_2>["to"];
     elementType?: React.ElementType;
 }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@simplybusiness/mobius",
   "license": "UNLICENSED",
-  "version": "3.2.1",
+  "version": "3.2.3",
   "description": "Core library of Mobius react components",
   "repository": {
     "type": "git",

package/src/components/Chopin/Actions/Actions.story.mdx

@@ -6,13 +6,7 @@ import { excludeControls } from "../../../utils/excludeControls";
 <Meta
   title="Chopin/Actions"
   component={Actions}
-  argTypes={excludeControls(
-    "className",
-    "backElementType",
-    "nextElementType",
-    "onNextClick",
-    "onBackClick",
-  )}
+  argTypes={excludeControls("className", "backElementType", "nextElementType")}
 />
 
 # Actions
@@ -37,7 +31,33 @@ import { Chopin } from "@simplybusiness/mobius";
   name="Normal"
   args={{
     backLabel: "Back",
-    backButton: { href: "https://www.google.com" },
+    nextLabel: "Next Step",
+  }}
+>
+  {args => (
+    <div>
+      <Actions {...args} />
+    </div>
+  )}
+</Story>
+
+<!-- prettier-ignore -->
+```jsx
+import { Chopin } from "@simplybusiness/mobius";
+
+<Chopin.Actions
+  backLabel="Back"
+  nextLabel="Next Step"
+/>
+```
+
+## With Links
+
+<Story
+  name="With Links"
+  args={{
+    backLabel: "Back",
+    backButton: { href: "https://www.example.com" },
     nextLabel: "Next Step",
     nextButton: { href: "https://www.google.com" },
   }}
@@ -55,9 +75,7 @@ import { Chopin } from "@simplybusiness/mobius";
 
 <Chopin.Actions
   backLabel="Back"
-  backButton={{ href: "https://www.google.com" }}
   nextLabel="Next Step"
-  nextButton={{ href: "https://www.google.com" }}
 />
 ```
 
@@ -67,7 +85,6 @@ import { Chopin } from "@simplybusiness/mobius";
   name="One Action"
   args={{
     nextLabel: "Next Step",
-    nextButton: { href: "https://www.google.com" },
   }}
   argTypes={excludeControls("backLabel", "backLink")}
 >
@@ -84,7 +101,6 @@ import { Chopin } from "@simplybusiness/mobius";
 
 <Chopin.Actions
   nextLabel="Next Step"
-  nextButton={{ href: "https://www.google.com" }}
 />
 ```
 
@@ -94,7 +110,6 @@ import { Chopin } from "@simplybusiness/mobius";
   name="One Back Action"
   args={{
     backLabel: "Back",
-    backButton: { href: "https://www.google.com" },
   }}
   argTypes={excludeControls("nextLabel", "nextLink")}
 >
@@ -112,28 +127,23 @@ import { Chopin } from "@simplybusiness/mobius";
 <Chopin.Actions
   backLabel="Back"
   backButton={{
-    href: "https://www.google.com",
     isDisabled: false,
   }}
 />
 ```
 
-## Disable Actions
+## Disabled Actions
 
 <Canvas>
   <Story
-    name="Disable Actions"
+    name="Disabled Actions"
     args={{
       backLabel: "Back",
       backButton: {
-        href: "https://www.google.com",
-        elementType: "button",
         isDisabled: true,
       },
       nextLabel: "Next Step",
       nextButton: {
-        href: "https://www.google.com",
-        elementType: "button",
         isDisabled: true,
       },
     }}
@@ -153,12 +163,10 @@ import { Chopin } from "@simplybusiness/mobius";
 <Chopin.Actions
   backLabel="Back"
   backButton={{
-    href: "https://www.google.com",
     isDisabled: false,
   }}
   nextLabel="Next Step"
   nextButton={{
-    href: "https://www.google.com",
     isDisabled: true,
   }}
 />
@@ -175,44 +183,43 @@ The following HTML is rendered for a `Actions`:
 ```html
 <div class="mobius mobius/Flex chopin chopin/Actions">
   <div class="mobius mobius/Flex chopin/ActionsContainer">
-    <a
+    <button
       type="button"
-      href="https://www.google.com"
-      class="mobius mobius/Button --has-icon mobius mobius/LinkButton chopin/ActionsBack"
+      class="mobius mobius/Button --variant-ghost --size-large --has-icon chopin/ActionsBack"
     >
       <svg class="mobius mobius/Icon">...</svg>
       <span class="">Back</span>
-    </a>
-    <a
+    </button>
+    <button
       type="button"
-      href="https://www.google.com"
-      class="mobius mobius/Button mobius mobius/LinkButton chopin/ActionsNext"
+      class="mobius mobius/Button --variant-primary --size-large chopin/ActionsNext"
     >
       <span class="">Next Step</span>
-    </a>
+    </button>
   </div>
 </div>
 ```
 
-With Button Action:
+With href provided:
 
 ```html
 <div class="mobius mobius/Flex chopin chopin/Actions">
   <div class="mobius mobius/Flex chopin/ActionsContainer">
     <a
       type="button"
-      href="https://www.google.com"
-      class="mobius mobius/Button --has-icon mobius mobius/LinkButton chopin/ActionsBack"
+      href="https://www.example.com"
+      class="mobius mobius/Button --variant-ghost --size-large --has-icon mobius mobius/LinkButton chopin/ActionsBack"
     >
-      <svg class="mobius mobius/Icon"></svg>
+      <svg class="mobius mobius/Icon">...</svg>
       <span class="">Back</span>
     </a>
-    <button
+    <a
       type="button"
-      class="mobius mobius/Button mobius mobius/LinkButton chopin/ActionsNext"
+      href="https://www.google.com"
+      class="mobius mobius/Button --variant-primary --size-large mobius mobius/LinkButton chopin/ActionsNext"
     >
       <span class="">Next Step</span>
-    </button>
+    </a>
   </div>
 </div>
 ```

package/src/components/Chopin/Actions/Actions.test.tsx

@@ -8,12 +8,12 @@ const NEXT_SINGLE_ACTION_CLASS_NAME = "--single-action";
 
 const backLabel = "Back";
 const mockOnBackClick = jest.fn();
-const BackButton = {
+const BackLink = {
   href: "https://test.com",
 };
 const mockOnNextClick = jest.fn();
 const nextLabel = "Next step";
-const NextButton = {
+const NextLink = {
   href: "https://test.com",
 };
 
@@ -24,9 +24,9 @@ describe("Actions", () => {
         <Actions
           data-testid="test-id"
           className="my-class"
-          nextButton={{ ...NextButton }}
+          nextButton={{ ...NextLink }}
           nextLabel={nextLabel}
-          backButton={{ ...BackButton }}
+          backButton={{ ...BackLink }}
           backLabel={backLabel}
         />,
       );
@@ -38,9 +38,9 @@ describe("Actions", () => {
     it("uses links class names", () => {
       render(
         <Actions
-          backButton={{ ...BackButton }}
+          backButton={{ ...BackLink }}
           backLabel={backLabel}
-          nextButton={{ ...NextButton }}
+          nextButton={{ ...NextLink }}
           nextLabel={nextLabel}
         />,
       );
@@ -53,7 +53,7 @@ describe("Actions", () => {
     });
 
     it("uses --single-action class name with one action btn", () => {
-      render(<Actions nextButton={{ ...NextButton }} nextLabel={nextLabel} />);
+      render(<Actions nextButton={{ ...NextLink }} nextLabel={nextLabel} />);
       expect(screen.getByRole("link", { name: /next step/i })).toHaveClass(
         NEXT_SINGLE_ACTION_CLASS_NAME,
       );
@@ -80,44 +80,25 @@ describe("Actions", () => {
     });
 
     it("renders button elements if elementType is button", () => {
-      render(
-        <Actions
-          backButton={{ ...BackButton, elementType: "button" }}
-          backLabel={backLabel}
-          nextButton={{ ...NextButton, elementType: "button" }}
-          nextLabel={nextLabel}
-        />,
-      );
-      expect(
-        screen.queryByRole("link", {
-          name: /back/i,
-        }),
-      ).not.toBeInTheDocument();
-      expect(
-        screen.queryByRole("link", {
-          name: /next step/i,
-        }),
-      ).not.toBeInTheDocument();
-      expect(
-        screen.getByRole("button", {
-          name: /back/i,
-        }),
-      ).toBeInTheDocument();
-      expect(
-        screen.getByRole("button", {
-          name: /next step/i,
-        }),
-      ).toBeInTheDocument();
+      render(<Actions backLabel={backLabel} nextLabel={nextLabel} />);
+      const backComponent = screen.queryByRole("button", {
+        name: /back/i,
+      });
+      const nextComponent = screen.getByRole("button", {
+        name: /next step/i,
+      });
+      const links = screen.queryByRole("link");
+
+      expect(links).toBeNull();
+      expect(backComponent).toBeInTheDocument();
+      expect(nextComponent).toBeInTheDocument();
     });
 
     it("fires onNextClick handler on click event", () => {
       render(
         <Actions
-          backButton={{ ...BackButton }}
           backLabel={backLabel}
           nextButton={{
-            ...NextButton,
-            elementType: "button",
             onClick: mockOnNextClick,
           }}
           nextLabel={nextLabel}
@@ -134,12 +115,9 @@ describe("Actions", () => {
       render(
         <Actions
           backButton={{
-            ...BackButton,
-            elementType: "button",
             onClick: mockOnBackClick,
           }}
           backLabel={backLabel}
-          nextButton={{ ...NextButton }}
           nextLabel={nextLabel}
         />,
       );
@@ -154,8 +132,6 @@ describe("Actions", () => {
       render(
         <Actions
           nextButton={{
-            ...NextButton,
-            elementType: "button",
             isDisabled: true,
           }}
           nextLabel={nextLabel}

package/src/components/Chopin/Actions/Actions.tsx

@@ -2,18 +2,19 @@ import { forwardRef, Ref } from "react";
 import { DOMProps } from "@react-types/shared";
 import clsx from "clsx";
 import type { IconName } from "@simplybusiness/icons";
-import { Size, Variant } from "../../Button";
+import { ButtonProps, Size, Variant } from "../../Button";
 import { Flex } from "../../Flex";
 import { ForwardedRefComponent } from "../../../types/components";
-import { LinkButton, type LinkButtonProps } from "../../LinkButton";
+import { type LinkButtonProps } from "../../LinkButton";
+import { LinkOrButton } from "./LinkOrButton";
 
 export type ActionsElementType = HTMLDivElement;
 
 export interface ActionsProps extends DOMProps {
   /** Custom class name for setting specific CSS */
   className?: string;
-  backButton?: LinkButtonProps;
-  nextButton?: LinkButtonProps;
+  backButton?: LinkButtonProps | ButtonProps;
+  nextButton?: LinkButtonProps | ButtonProps;
   backLabel?: string;
   nextLabel?: string;
 }
@@ -27,7 +28,7 @@ const Actions: ForwardedRefComponent<ActionsProps, ActionsElementType> =
 
     const classes = clsx("chopin", "chopin/Actions", className);
     const nextButtonClasses = clsx("chopin/ActionsNext", {
-      "--single-action": !backButton,
+      "--single-action": !backLabel,
     });
 
     const backButtonProps = {
@@ -51,16 +52,12 @@ const Actions: ForwardedRefComponent<ActionsProps, ActionsElementType> =
           justifyContent="space-between"
           alignItems="center"
         >
-          {backButton?.href && (
-            <LinkButton {...backButtonProps} href={backButtonProps.href!}>
-              {backLabel}
-            </LinkButton>
-          )}
-          {nextButton?.href && (
-            <LinkButton {...nextButtonProps} href={nextButtonProps.href!}>
-              {nextLabel}
-            </LinkButton>
-          )}
+          <LinkOrButton href={backButton?.href} {...backButtonProps}>
+            {backLabel}
+          </LinkOrButton>
+          <LinkOrButton href={nextButton?.href} {...nextButtonProps}>
+            {nextLabel}
+          </LinkOrButton>
         </Flex>
       </Flex>
     );

package/src/components/Chopin/Actions/LinkOrButton.test.tsx

@@ -0,0 +1,51 @@
+import { fireEvent, render, screen } from "@testing-library/react";
+import { LinkOrButton } from "./LinkOrButton";
+
+describe("LinkOrButton", () => {
+  describe("given no children are provided", () => {
+    it("renders nothing", () => {
+      const { container } = render(<LinkOrButton />);
+
+      expect(container).toBeEmptyDOMElement();
+    });
+  });
+
+  describe("given href is provided", () => {
+    it("renders anchor tag", () => {
+      const url = "http://www.example.com";
+
+      render(
+        <LinkOrButton className="green" href={url}>
+          I am a link
+        </LinkOrButton>,
+      );
+
+      const link = screen.getByRole("link");
+
+      expect(link).toBeInTheDocument();
+      expect(link).toHaveClass("green");
+      expect(link).toHaveAttribute("href", url);
+    });
+  });
+
+  describe("given href is not provided", () => {
+    it("renders button", () => {
+      const clickHandler = jest.fn();
+
+      render(
+        <LinkOrButton data-id="test" onClick={clickHandler}>
+          I am a button
+        </LinkOrButton>,
+      );
+
+      const button = screen.getByRole("button");
+
+      expect(button).toBeInTheDocument();
+      expect(button).toHaveAttribute("data-id", "test");
+
+      fireEvent.click(button);
+
+      expect(clickHandler).toHaveBeenCalled();
+    });
+  });
+});

package/src/components/Chopin/Actions/LinkOrButton.tsx

@@ -0,0 +1,20 @@
+import { Button, ButtonProps } from "../../Button";
+import { LinkButton, LinkButtonProps } from "../../LinkButton";
+
+export const LinkOrButton = ({
+  href,
+  children,
+  ...rest
+}: LinkButtonProps | ButtonProps) => {
+  if (!children) return null;
+
+  if (href) {
+    return (
+      <LinkButton {...(rest as LinkButtonProps)} href={href!}>
+        {children}
+      </LinkButton>
+    );
+  }
+
+  return <Button {...(rest as ButtonProps)}>{children}</Button>;
+};

package/src/components/LinkButton/LinkButton.tsx

@@ -1,4 +1,4 @@
-import { HTMLAttributeAnchorTarget } from "react";
+import { HTMLAttributeAnchorTarget, SyntheticEvent } from "react";
 import clsx from "clsx";
 import type { Link } from "react-router-dom";
 import { Button, ButtonProps } from "../Button";
@@ -11,7 +11,7 @@ export interface LinkButtonProps extends Omit<ButtonProps, "elementType"> {
   download?: boolean | string;
   rel?: string;
   target?: HTMLAttributeAnchorTarget;
-  onClick?: () => void;
+  onClick?: (event: SyntheticEvent) => void;
   to?: React.ComponentProps<typeof Link>["to"];
   elementType?: React.ElementType;
 }