akeneo-design-system 0.1.237 → 0.1.239

package/lib/components/Card/Card.d.ts

@@ -3,7 +3,7 @@ declare type CardGridProps = {
     size?: 'normal' | 'big';
 };
 declare const CardGrid: import("styled-components").StyledComponent<"div", any, CardGridProps & Record<string, unknown> & import("styled-components").ThemeProps<import("../../theme/theme").Theme>, never>;
-declare const Card: React.ForwardRefExoticComponent<Omit<React.HTMLAttributes<HTMLDivElement>, "disabled" | "children" | "onSelect" | "src" | "loading" | "isSelected" | "stacked" | "fit"> & {
+declare const Card: React.ForwardRefExoticComponent<Omit<React.HTMLAttributes<HTMLDivElement>, "disabled" | "children" | "onSelect" | "src" | "loading" | "fit" | "isSelected" | "stacked"> & {
     src: string | null;
     fit?: "contain" | "cover" | undefined;
     loading?: "eager" | "lazy" | undefined;

package/lib/components/Input/MediaFileInput/MediaFileInput.js

@@ -174,7 +174,7 @@ var MediaFileInput = react_1.default.forwardRef(function (_a, forwardedRef) {
                     setProgress(0);
                     stopUploading();
                     uploadFailed();
-                    console.error(error_1);
+                    console.log(error_1);
                     return [3, 4];
                 case 4: return [2];
             }

package/lib/components/Input/MediaFileInput/MediaFileInput.js.map

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

package/lib/components/SplitButton/SplitButton.d.ts

@@ -0,0 +1,14 @@
+import React, { ReactNode } from 'react';
+import { Override } from '../../shared';
+import { ButtonProps } from '../Button/Button';
+declare type SplitButtonProps = Omit<Override<ButtonProps, {
+    label: string;
+}>, 'href'>;
+declare const SplitButton: {
+    ({ label, children, ...rest }: SplitButtonProps): React.JSX.Element;
+    Item: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & {
+        children: ReactNode;
+    } & React.RefAttributes<HTMLDivElement>>;
+};
+export { SplitButton };
+export type { SplitButtonProps };

package/lib/components/SplitButton/SplitButton.js

@@ -0,0 +1,97 @@
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+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;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SplitButton = void 0;
+var react_1 = __importStar(require("react"));
+var icons_1 = require("../../icons");
+var Button_1 = require("../Button/Button");
+var Dropdown_1 = require("../Dropdown/Dropdown");
+var hooks_1 = require("../../hooks");
+var styled_components_1 = __importDefault(require("styled-components"));
+var SplitButton = function (_a) {
+    var label = _a.label, children = _a.children, rest = __rest(_a, ["label", "children"]);
+    var _b = (0, hooks_1.useBooleanState)(), isOpen = _b[0], open = _b[1], close = _b[2];
+    var decoratedChildren = react_1.Children.map(children, function (child) {
+        if (!(0, react_1.isValidElement)(child))
+            return child;
+        return (0, react_1.cloneElement)(child, {
+            onClick: function () {
+                var _a;
+                var args = [];
+                for (var _i = 0; _i < arguments.length; _i++) {
+                    args[_i] = arguments[_i];
+                }
+                if (child.props.onClick) {
+                    (_a = child.props).onClick.apply(_a, args);
+                }
+                close();
+            },
+        });
+    });
+    return (react_1.default.createElement(Container, null,
+        react_1.default.createElement(CollapsedButton, __assign({}, rest), label),
+        react_1.default.createElement(Dropdown_1.Dropdown, null,
+            react_1.default.createElement(CollapsedDropdownButton, __assign({}, rest, { type: "button", onClick: open }),
+                react_1.default.createElement(icons_1.ArrowDownIcon, null)),
+            isOpen && (react_1.default.createElement(Dropdown_1.Dropdown.Overlay, { verticalPosition: "down", onClose: close },
+                react_1.default.createElement(Dropdown_1.Dropdown.ItemCollection, null, decoratedChildren))))));
+};
+exports.SplitButton = SplitButton;
+var Container = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: inline-flex;\n"], ["\n  display: inline-flex;\n"])));
+var CollapsedButton = (0, styled_components_1.default)(Button_1.Button)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  border-top-right-radius: 0;\n  border-bottom-right-radius: 0;\n  border-right: 1px white solid;\n"], ["\n  border-top-right-radius: 0;\n  border-bottom-right-radius: 0;\n  border-right: 1px white solid;\n"])));
+var CollapsedDropdownButton = (0, styled_components_1.default)(Button_1.Button)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  border-top-left-radius: 0;\n  border-bottom-left-radius: 0;\n  padding-left: 10px;\n"], ["\n  border-top-left-radius: 0;\n  border-bottom-left-radius: 0;\n  padding-left: 10px;\n"])));
+var Item = (0, react_1.forwardRef)(function (_a, ref) {
+    var children = _a.children, onClick = _a.onClick;
+    return (react_1.default.createElement(Dropdown_1.Dropdown.Item, { onClick: onClick, ref: ref }, children));
+});
+Item.displayName = 'SplitButton.Item';
+SplitButton.Item = Item;
+var templateObject_1, templateObject_2, templateObject_3;
+//# sourceMappingURL=SplitButton.js.map

package/lib/components/SplitButton/SplitButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SplitButton.js","sourceRoot":"","sources":["../../../src/components/SplitButton/SplitButton.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAAgH;AAEhH,qCAA0C;AAC1C,2CAAqD;AACrD,iDAA8C;AAC9C,qCAA4C;AAC5C,wEAAuC;AAoBvC,IAAM,WAAW,GAAG,UAAC,EAA4C;IAA3C,IAAA,KAAK,WAAA,EAAE,QAAQ,cAAA,EAAK,IAAI,cAAzB,qBAA0B,CAAD;IACtC,IAAA,KAAwB,IAAA,uBAAe,GAAE,EAAxC,MAAM,QAAA,EAAE,IAAI,QAAA,EAAE,KAAK,QAAqB,CAAC;IAChD,IAAM,iBAAiB,GAAG,gBAAQ,CAAC,GAAG,CAAC,QAAQ,EAAE,UAAA,KAAK;QACpD,IAAI,CAAC,IAAA,sBAAc,EAAY,KAAK,CAAC;YAAE,OAAO,KAAK,CAAC;QAEpD,OAAO,IAAA,oBAAY,EAAY,KAAK,EAAE;YACpC,OAAO,EAAE;;gBAAC,cAAO;qBAAP,UAAO,EAAP,qBAAO,EAAP,IAAO;oBAAP,yBAAO;;gBACf,IAAI,KAAK,CAAC,KAAK,CAAC,OAAO,EAAE;oBACvB,CAAA,KAAA,KAAK,CAAC,KAAK,CAAA,CAAC,OAAO,WAAI,IAAI,EAAE;iBAC9B;gBACD,KAAK,EAAE,CAAC;YACV,CAAC;SACF,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IACH,OAAO,CACL,8BAAC,SAAS;QACR,8BAAC,eAAe,eAAK,IAAI,GAAG,KAAK,CAAmB;QAEpD,8BAAC,mBAAQ;YACP,8BAAC,uBAAuB,eAAK,IAAI,IAAE,IAAI,EAAC,QAAQ,EAAC,OAAO,EAAE,IAAI;gBAC5D,8BAAC,qBAAa,OAAG,CACO;YACzB,MAAM,IAAI,CACT,8BAAC,mBAAQ,CAAC,OAAO,IAAC,gBAAgB,EAAC,MAAM,EAAC,OAAO,EAAE,KAAK;gBACtD,8BAAC,mBAAQ,CAAC,cAAc,QAAE,iBAAiB,CAA2B,CACrD,CACpB,CACQ,CACD,CACb,CAAC;AACJ,CAAC,CAAC;AAgCM,kCAAW;AA9BnB,IAAM,SAAS,GAAG,2BAAM,CAAC,GAAG,gGAAA,6BAE3B,IAAA,CAAC;AAEF,IAAM,eAAe,GAAG,IAAA,2BAAM,EAAC,eAAM,CAAC,0KAAA,uGAIrC,IAAA,CAAC;AAEF,IAAM,uBAAuB,GAAG,IAAA,2BAAM,EAAC,eAAM,CAAC,6JAAA,0FAI7C,IAAA,CAAC;AAMF,IAAM,IAAI,GAAG,IAAA,kBAAU,EAAC,UAAC,EAA8B,EAAE,GAAwB;QAAvD,QAAQ,cAAA,EAAE,OAAO,aAAA;IAA2C,OAAA,CACpF,8BAAC,mBAAQ,CAAC,IAAI,IAAC,OAAO,EAAE,OAAO,EAAE,GAAG,EAAE,GAAG,IACtC,QAAQ,CACK,CACjB;AAJqF,CAIrF,CAAC,CAAC;AAEH,IAAI,CAAC,WAAW,GAAG,kBAAkB,CAAC;AAEtC,WAAW,CAAC,IAAI,GAAG,IAAI,CAAC"}

package/lib/components/index.d.ts

@@ -5,6 +5,7 @@ export * from './Block/Block';
 export * from './BlockButton/BlockButton';
 export * from './Breadcrumb/Breadcrumb';
 export * from './Button/Button';
+export * from './SplitButton/SplitButton';
 export * from './Card/Card';
 export * from './Checkbox/Checkbox';
 export * from './Collapse/Collapse';

package/lib/components/index.js

@@ -17,6 +17,7 @@ __exportStar(require("./Block/Block"), exports);
 __exportStar(require("./BlockButton/BlockButton"), exports);
 __exportStar(require("./Breadcrumb/Breadcrumb"), exports);
 __exportStar(require("./Button/Button"), exports);
+__exportStar(require("./SplitButton/SplitButton"), exports);
 __exportStar(require("./Card/Card"), exports);
 __exportStar(require("./Checkbox/Checkbox"), exports);
 __exportStar(require("./Collapse/Collapse"), exports);

package/lib/components/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":";;;;;;;;;;;;AAAA,kDAAgC;AAChC,mDAAiC;AACjC,gDAA8B;AAC9B,gDAA8B;AAC9B,4DAA0C;AAC1C,0DAAwC;AACxC,kDAAgC;AAChC,8CAA4B;AAC5B,sDAAoC;AACpC,sDAAoC;AACpC,sDAAoC;AACpC,gDAA8B;AAC9B,kDAAgC;AAChC,0DAAwC;AACxC,sDAAoC;AACpC,gDAA8B;AAC9B,4DAA0C;AAC1C,0CAAwB;AACxB,wDAAsC;AACtC,8CAA4B;AAC5B,8CAA4B;AAC5B,kDAAgC;AAChC,0DAAwC;AACxC,gDAA8B;AAC9B,+CAA6B;AAC7B,0DAAwC;AACxC,8CAA4B;AAC5B,4DAA0C;AAC1C,oDAAkC;AAClC,4DAA0C;AAC1C,wEAAsD;AACtD,kDAAgC;AAChC,8DAA4C;AAC5C,kEAAgD;AAChD,kDAAgC;AAChC,gDAA8B;AAC9B,8CAA4B;AAC5B,gDAA8B;AAC9B,oDAAkC;AAClC,8CAA4B;AAC5B,oDAAkC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":";;;;;;;;;;;;AAAA,kDAAgC;AAChC,mDAAiC;AACjC,gDAA8B;AAC9B,gDAA8B;AAC9B,4DAA0C;AAC1C,0DAAwC;AACxC,kDAAgC;AAChC,4DAA0C;AAC1C,8CAA4B;AAC5B,sDAAoC;AACpC,sDAAoC;AACpC,sDAAoC;AACpC,gDAA8B;AAC9B,kDAAgC;AAChC,0DAAwC;AACxC,sDAAoC;AACpC,gDAA8B;AAC9B,4DAA0C;AAC1C,0CAAwB;AACxB,wDAAsC;AACtC,8CAA4B;AAC5B,8CAA4B;AAC5B,kDAAgC;AAChC,0DAAwC;AACxC,gDAA8B;AAC9B,+CAA6B;AAC7B,0DAAwC;AACxC,8CAA4B;AAC5B,4DAA0C;AAC1C,oDAAkC;AAClC,4DAA0C;AAC1C,wEAAsD;AACtD,kDAAgC;AAChC,8DAA4C;AAC5C,kEAAgD;AAChD,kDAAgC;AAChC,gDAA8B;AAC9B,8CAA4B;AAC5B,gDAA8B;AAC9B,oDAAkC;AAClC,8CAA4B;AAC5B,oDAAkC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "akeneo-design-system",
-  "version": "0.1.237",
+  "version": "0.1.239",
   "description": "Akeneo design system",
   "main": "lib/index.js",
   "scripts": {

package/src/components/Input/MediaFileInput/MediaFileInput.tsx

@@ -212,7 +212,7 @@ const MediaFileInput = React.forwardRef<HTMLInputElement, MediaFileInputProps>(
         setProgress(0);
         stopUploading();
         uploadFailed();
-        console.error(error);
+        console.log(error);
       }
     };
 

package/src/components/Input/MediaFileInput/MediaFileInput.unit.tsx

@@ -116,7 +116,7 @@ test('it display the upload error label when the upload failed', async () => {
   const handleChange = jest.fn();
   const uploader = jest.fn().mockRejectedValue(undefined);
 
-  jest.spyOn(console, 'error').mockImplementationOnce(jest.fn());
+  jest.spyOn(console, 'log').mockImplementationOnce(jest.fn());
 
   render(
     <MediaFileInput
@@ -214,7 +214,7 @@ test('it displays the default picture when the image previewer fails', () => {
 
 test('it does not throw an error when component is hidden after upload', async () => {
   const uploader = jest.fn().mockResolvedValue(fileInfo);
-  const mockedConsole = jest.spyOn(console, 'error');
+  const mockedConsole = jest.spyOn(console, 'log');
 
   render(<MediaFileInput {...defaultProps} value={null} onChange={cleanup} uploader={uploader} thumbnailUrl={null} />);
 

package/src/components/SplitButton/SplitButton.stories.mdx

@@ -0,0 +1,216 @@
+import {Meta, Story, ArgsTable, Canvas} from '@storybook/addon-docs';
+import {SplitButton} from './SplitButton';
+
+<Meta
+  title="Components/Buttons/SplitButton"
+  component={SplitButton}
+  argTypes={{
+    level: {control: {type: 'select'}, options: ['primary', 'secondary', 'tertiary', 'warning', 'danger']},
+    ghost: {control: {type: 'boolean'}},
+    disabled: {control: {type: 'boolean'}},
+    active: {control: {type: 'boolean'}},
+    size: {control: {type: 'select'}, options: ['default', 'small']},
+    onClick: {action: 'Click on the button'},
+  }}
+  args={{
+    level: 'primary',
+    label: 'Primary',
+  }}
+/>
+
+# Split Button
+
+## Usage
+
+Split Buttons express what action will occur when the users clicks, it is combined with a dropdown that adds a list of options that can be used. Buttons are used to initialize an action, either in the background or foreground of an experience.
+
+### General guidance
+
+Split Buttons are used primarily on action items. Some examples include Add, Save, Delete, and Sign up. Each page can have one or two primary buttons. Any remaining calls-to-action should be represented as secondary buttons.
+
+Do not use buttons as navigational elements. Instead, use links to take the users to a new page.
+
+### Labels
+
+Button labels should clearly indicate the action of the button. Use active verbs, such as Add or Delete. Use no more than three words for button labels.
+
+For sets of buttons, use specific labels, such as Save or Discard, instead of using OK and Cancel. This is particularly helpful when the user is confirming an action.
+
+## Playground
+
+Use this playground to test the button component
+
+<Canvas>
+  <Story name="Standard">
+    {args => {
+      return <SplitButton {...args}>
+          <SplitButton.Item onClick={() => {}}>Item 1</SplitButton.Item>
+          <SplitButton.Item onClick={() => {}}>Item 2</SplitButton.Item>
+      </SplitButton>;
+    }}
+  </Story>
+</Canvas>
+
+<ArgsTable story="Standard" />
+
+## Variation on level
+
+<Canvas>
+  <Story name="Level">
+    {args => {
+      return (
+        <>
+          <SplitButton {...args} level="primary" label="Primary">
+            <SplitButton.Item onClick={() => {}}>Item 1</SplitButton.Item>
+            <SplitButton.Item onClick={() => {}}>Item 2</SplitButton.Item>
+          </SplitButton>
+          <SplitButton {...args} level="secondary" label="Secondary">
+            <SplitButton.Item onClick={() => {}}>Item 1</SplitButton.Item>
+            <SplitButton.Item onClick={() => {}}>Item 2</SplitButton.Item>
+          </SplitButton>
+          <SplitButton {...args} level="tertiary" label="Tertiary">
+            <SplitButton.Item onClick={() => {}}>Item 1</SplitButton.Item>
+            <SplitButton.Item onClick={() => {}}>Item 2</SplitButton.Item>
+          </SplitButton>
+          <SplitButton {...args} level="warning" label="Warning">
+            <SplitButton.Item onClick={() => {}}>Item 1</SplitButton.Item>
+            <SplitButton.Item onClick={() => {}}>Item 2</SplitButton.Item>
+          </SplitButton>
+          <SplitButton {...args} level="danger" label="Danger">
+            <SplitButton.Item onClick={() => {}}>Item 1</SplitButton.Item>
+            <SplitButton.Item onClick={() => {}}>Item 2</SplitButton.Item>
+          </SplitButton>
+        </>
+      );
+    }}
+  </Story>
+</Canvas>
+
+## Variation on ghost
+
+<Canvas>
+  <Story name="Ghost">
+    {args => {
+      return (
+        <>
+            <SplitButton {...args} ghost={true} level="primary" label="Primary">
+              <SplitButton.Item onClick={() => {}}>Item 1</SplitButton.Item>
+              <SplitButton.Item onClick={() => {}}>Item 2</SplitButton.Item>
+            </SplitButton>
+            <SplitButton {...args} ghost={true} level="secondary" label="Secondary">
+              <SplitButton.Item onClick={() => {}}>Item 1</SplitButton.Item>
+              <SplitButton.Item onClick={() => {}}>Item 2</SplitButton.Item>
+            </SplitButton>
+            <SplitButton {...args} ghost={true} level="tertiary" label="Tertiary">
+              <SplitButton.Item onClick={() => {}}>Item 1</SplitButton.Item>
+              <SplitButton.Item onClick={() => {}}>Item 2</SplitButton.Item>
+            </SplitButton>
+            <SplitButton {...args} ghost={true} level="warning" label="Warning">
+              <SplitButton.Item onClick={() => {}}>Item 1</SplitButton.Item>
+              <SplitButton.Item onClick={() => {}}>Item 2</SplitButton.Item>
+            </SplitButton>
+            <SplitButton {...args} ghost={true} level="danger" label="Danger">
+              <SplitButton.Item onClick={() => {}}>Item 1</SplitButton.Item>
+              <SplitButton.Item onClick={() => {}}>Item 2</SplitButton.Item>
+            </SplitButton>
+        </>
+      );
+    }}
+  </Story>
+</Canvas>
+
+## Variation on active
+
+<Canvas>
+  <Story name="Active">
+    {args => {
+      return (
+        <>
+            <SplitButton {...args} active={true} level="primary" label="primary">
+                <SplitButton.Item onClick={() => {}}>Item 1</SplitButton.Item>
+                <SplitButton.Item onClick={() => {}}>Item 2</SplitButton.Item>
+            </SplitButton>
+            <SplitButton {...args} active={true} level="secondary" label="secondary">
+                <SplitButton.Item onClick={() => {}}>Item 1</SplitButton.Item>
+                <SplitButton.Item onClick={() => {}}>Item 2</SplitButton.Item>
+            </SplitButton>
+            <SplitButton {...args} active={true} level="tertiary" label="tertiary">
+                <SplitButton.Item onClick={() => {}}>Item 1</SplitButton.Item>
+                <SplitButton.Item onClick={() => {}}>Item 2</SplitButton.Item>
+            </SplitButton>
+            <SplitButton {...args} active={true} level="warning" label="warning">
+                <SplitButton.Item onClick={() => {}}>Item 1</SplitButton.Item>
+                <SplitButton.Item onClick={() => {}}>Item 2</SplitButton.Item>
+            </SplitButton>
+            <SplitButton {...args} active={true} level="danger" label="danger">
+                <SplitButton.Item onClick={() => {}}>Item 1</SplitButton.Item>
+                <SplitButton.Item onClick={() => {}}>Item 2</SplitButton.Item>
+            </SplitButton>
+            <br />
+            <SplitButton {...args} active={true} ghost={true} level="primary" label="primary">
+                <SplitButton.Item onClick={() => {}}>Item 1</SplitButton.Item>
+                <SplitButton.Item onClick={() => {}}>Item 2</SplitButton.Item>
+            </SplitButton>
+            <SplitButton {...args} active={true} ghost={true} level="secondary" label="secondary">
+                <SplitButton.Item onClick={() => {}}>Item 1</SplitButton.Item>
+                <SplitButton.Item onClick={() => {}}>Item 2</SplitButton.Item>
+            </SplitButton>
+            <SplitButton {...args} active={true} ghost={true} level="tertiary" label="tertiary">
+                <SplitButton.Item onClick={() => {}}>Item 1</SplitButton.Item>
+                <SplitButton.Item onClick={() => {}}>Item 2</SplitButton.Item>
+            </SplitButton>
+            <SplitButton {...args} active={true} ghost={true} level="warning" label="warning">
+                <SplitButton.Item onClick={() => {}}>Item 1</SplitButton.Item>
+                <SplitButton.Item onClick={() => {}}>Item 2</SplitButton.Item>
+            </SplitButton>
+            <SplitButton {...args} active={true} ghost={true} level="danger" label="danger">
+                <SplitButton.Item onClick={() => {}}>Item 1</SplitButton.Item>
+                <SplitButton.Item onClick={() => {}}>Item 2</SplitButton.Item>
+            </SplitButton>
+        </>
+      );
+    }}
+  </Story>
+</Canvas>
+
+## Variation on disabled
+
+<Canvas>
+  <Story name="Disabled">
+    {args => {
+      return (
+        <>
+          <SplitButton {...args} disabled={false} label={'Default'}>
+            <SplitButton.Item onClick={() => {}}>Item 1</SplitButton.Item>
+            <SplitButton.Item onClick={() => {}}>Item 2</SplitButton.Item>
+          </SplitButton>
+          <SplitButton {...args} disabled={true} label={'Disabled'}>
+            <SplitButton.Item onClick={() => {}}>Item 1</SplitButton.Item>
+            <SplitButton.Item onClick={() => {}}>Item 2</SplitButton.Item>
+          </SplitButton>
+        </>
+      );
+    }}
+  </Story>
+</Canvas>
+
+## Variation on size
+
+<Canvas>
+  <Story name="Size">
+    {args => {
+      return (
+        <>
+            <SplitButton {...args} size="default" label={'Default'}>
+               <SplitButton.Item onClick={() => {}}>Item 1</SplitButton.Item>
+               <SplitButton.Item onClick={() => {}}>Item 2</SplitButton.Item>
+            </SplitButton>
+            <SplitButton {...args} size="small" label={'Small'}>
+                <SplitButton.Item onClick={() => {}}>Item 1</SplitButton.Item>
+                <SplitButton.Item onClick={() => {}}>Item 2</SplitButton.Item>
+            </SplitButton>
+        </>
+      );
+    }}
+  </Story>
+</Canvas>

package/src/components/SplitButton/SplitButton.tsx

@@ -0,0 +1,90 @@
+import React, {Children, cloneElement, forwardRef, HTMLAttributes, isValidElement, ReactNode, Ref} from 'react';
+import {Override} from '../../shared';
+import {ArrowDownIcon} from '../../icons';
+import {Button, ButtonProps} from '../Button/Button';
+import {Dropdown} from '../Dropdown/Dropdown';
+import {useBooleanState} from '../../hooks';
+import styled from 'styled-components';
+
+type SplitButtonProps = Omit<
+  Override<
+    ButtonProps,
+    {
+      /**
+       * Label of the button.
+       */
+      label: string;
+    }
+  >,
+  'href'
+>;
+
+/**
+ * Buttons express what action will occur when the users clicks.
+ * Buttons are used to initialize an action, either in the background or foreground of an experience.
+ */
+
+const SplitButton = ({label, children, ...rest}: SplitButtonProps) => {
+  const [isOpen, open, close] = useBooleanState();
+  const decoratedChildren = Children.map(children, child => {
+    if (!isValidElement<ItemProps>(child)) return child;
+
+    return cloneElement<ItemProps>(child, {
+      onClick: (...args) => {
+        if (child.props.onClick) {
+          child.props.onClick(...args);
+        }
+        close();
+      },
+    });
+  });
+  return (
+    <Container>
+      <CollapsedButton {...rest}>{label}</CollapsedButton>
+
+      <Dropdown>
+        <CollapsedDropdownButton {...rest} type="button" onClick={open}>
+          <ArrowDownIcon />
+        </CollapsedDropdownButton>
+        {isOpen && (
+          <Dropdown.Overlay verticalPosition="down" onClose={close}>
+            <Dropdown.ItemCollection>{decoratedChildren}</Dropdown.ItemCollection>
+          </Dropdown.Overlay>
+        )}
+      </Dropdown>
+    </Container>
+  );
+};
+
+const Container = styled.div`
+  display: inline-flex;
+`;
+
+const CollapsedButton = styled(Button)`
+  border-top-right-radius: 0;
+  border-bottom-right-radius: 0;
+  border-right: 1px white solid;
+`;
+
+const CollapsedDropdownButton = styled(Button)`
+  border-top-left-radius: 0;
+  border-bottom-left-radius: 0;
+  padding-left: 10px;
+`;
+
+type ItemProps = HTMLAttributes<HTMLDivElement> & {
+  children: ReactNode;
+};
+
+const Item = forwardRef(({children, onClick}: ItemProps, ref: Ref<HTMLDivElement>) => (
+  <Dropdown.Item onClick={onClick} ref={ref}>
+    {children}
+  </Dropdown.Item>
+));
+
+Item.displayName = 'SplitButton.Item';
+
+SplitButton.Item = Item;
+
+export {SplitButton};
+export type {SplitButtonProps};

package/src/components/SplitButton/SplitButton.unit.tsx

@@ -0,0 +1,143 @@
+import React from 'react';
+import {fireEvent, render, screen} from '../../storybook/test-util';
+import {SplitButton} from './SplitButton';
+import userEvent from '@testing-library/user-event';
+
+test('it calls onClick handler when user clicks on button', () => {
+  const onClick = jest.fn();
+  render(
+    <SplitButton size="small" onClick={onClick} label={'My button'}>
+      <SplitButton.Item onClick={onClick}>Item 1</SplitButton.Item>
+    </SplitButton>
+  );
+
+  const button = screen.getAllByRole('button')[0];
+  fireEvent.click(button);
+
+  expect(onClick).toBeCalled();
+});
+
+test('it opens dropdown on arrow icon', () => {
+  const onClick = jest.fn();
+  render(
+    <SplitButton size="small" onClick={onClick} label={'My button'}>
+      <SplitButton.Item onClick={onClick}>Item 1</SplitButton.Item>
+    </SplitButton>
+  );
+
+  const button = screen.getAllByRole('button')[1];
+  fireEvent.click(button);
+
+  expect(screen.getByText('Item 1')).toBeInTheDocument();
+});
+
+test('it closes dropdown on item click', () => {
+  const onClick = jest.fn();
+  const onClickChild = jest.fn();
+  render(
+    <SplitButton size="small" onClick={onClick} label={'My button'}>
+      <SplitButton.Item onClick={onClickChild}>Item 1</SplitButton.Item>
+      <div onClick={onClickChild}>Item 2</div>
+      An invalid element
+    </SplitButton>
+  );
+
+  const dropdownButton = screen.getAllByRole('button')[1];
+  fireEvent.click(dropdownButton);
+
+  const item1 = screen.getByText('Item 1');
+  expect(item1).toBeInTheDocument();
+
+  fireEvent.click(item1);
+  expect(onClickChild).toBeCalled();
+  expect(item1).not.toBeInTheDocument();
+
+  fireEvent.click(dropdownButton);
+
+  const item2 = screen.getByText('Item 2');
+  expect(item2).toBeInTheDocument();
+
+  fireEvent.click(item2);
+  expect(onClickChild).toBeCalled();
+  expect(item2).not.toBeInTheDocument();
+});
+
+test('it calls onClick handler when user hits enter key on button', () => {
+  const onClick = jest.fn();
+  render(
+    <SplitButton ghost={true} onClick={onClick} label={'My button'}>
+      <SplitButton.Item onClick={onClick}>Item 1</SplitButton.Item>
+    </SplitButton>
+  );
+
+  const button = screen.getAllByRole('button')[0];
+  button.focus();
+  userEvent.type(button, '{enter}');
+
+  expect(onClick).toBeCalled();
+});
+
+test('it does not call onClick handler when user clicks on a disabled button', () => {
+  const onClick = jest.fn();
+  render(
+    <SplitButton disabled={true} ghost={true} onClick={onClick} label={'My button'}>
+      <SplitButton.Item onClick={onClick}>Item 1</SplitButton.Item>
+    </SplitButton>
+  );
+
+  const button = screen.getAllByRole('button')[0];
+  fireEvent.click(button);
+
+  expect(onClick).not.toBeCalled();
+});
+
+test('it does not call onClick handler when user hits enter key on a disabled button', () => {
+  const onClick = jest.fn();
+  render(
+    <SplitButton disabled={true} onClick={onClick} label={'My button'}>
+      <SplitButton.Item onClick={onClick}>Item 1</SplitButton.Item>
+    </SplitButton>
+  );
+
+  const button = screen.getAllByRole('button')[0];
+  fireEvent.keyDown(button, {key: 'Enter', code: 'Enter'});
+
+  expect(onClick).not.toBeCalled();
+});
+
+test('it does not trigger onClick when disabled', () => {
+  const onClick = jest.fn();
+  render(
+    <SplitButton disabled={true} onClick={onClick} label={'My button'}>
+      <SplitButton.Item onClick={onClick}>Item 1</SplitButton.Item>
+    </SplitButton>
+  );
+
+  const button = screen.getAllByRole('button')[0];
+  fireEvent.click(button);
+
+  expect(onClick).not.toBeCalled();
+});
+
+test('it does not trigger onClick when onClick is undefined', () => {
+  const onClick = jest.fn();
+  render(
+    <SplitButton onClick={undefined} label={'My button'}>
+      <SplitButton.Item onClick={onClick}>Item 1</SplitButton.Item>
+    </SplitButton>
+  );
+
+  fireEvent.click(screen.getAllByRole('button')[0]);
+
+  expect(onClick).not.toBeCalled();
+});
+
+test('Button supports ...rest props', () => {
+  render(
+    <SplitButton onClick={jest.fn()} data-testid="my_value" label={'My button'}>
+      <SplitButton.Item onClick={jest.fn()}>Item 1</SplitButton.Item>
+    </SplitButton>
+  );
+
+  expect(screen.getAllByTestId('my_value')[0]).toBeInTheDocument();
+});

package/src/components/index.ts

@@ -5,6 +5,7 @@ export * from './Block/Block';
 export * from './BlockButton/BlockButton';
 export * from './Breadcrumb/Breadcrumb';
 export * from './Button/Button';
+export * from './SplitButton/SplitButton';
 export * from './Card/Card';
 export * from './Checkbox/Checkbox';
 export * from './Collapse/Collapse';