datocms-react-ui 0.3.24 → 0.3.28

package/dist/cjs/SelectInput/index.js

@@ -85,7 +85,7 @@ var useStyles = function (isDisabled, error) {
             },
             multiValueRemove: function (provided) { return (__assign(__assign({}, provided), { cursor: 'pointer' })); },
             menu: function (provided) {
-                return __assign(__assign({}, provided), { minWidth: 250 });
+                return __assign(__assign({}, provided), { zIndex: 1000, minWidth: 250 });
             },
             input: function (provided) {
                 var result = __assign(__assign({}, provided), { boxShadow: 'none', 'input:focus': {
@@ -94,7 +94,7 @@ var useStyles = function (isDisabled, error) {
                 return result;
             },
             multiValue: function (provided) {
-                return __assign(__assign({}, provided), { zIndex: 100000, backgroundColor: 'var(--light-color)' });
+                return __assign(__assign({}, provided), { zIndex: 100, backgroundColor: 'var(--light-color)' });
             },
             multiValueLabel: function (provided) { return (__assign(__assign({}, provided), { fontSize: 'inherit', padding: 3 })); },
         };

package/dist/cjs/SelectInput/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/SelectInput/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAAuC;AACvC,8DAKsB;AACtB,6DAAgE;AAChE,iFAEsC;AACtC,qEAA4E;AAE5E,IAAM,WAAW,GAAgB,UAAC,QAAQ,IAAK,OAAA,uBAC1C,QAAQ,KACX,YAAY,EAAE,CAAC,EACf,MAAM,wBACD,QAAQ,CAAC,MAAM,KAClB,SAAS,EAAE,sCAAsC;QACjD,WAAW;QACX,SAAS,EAAE,qBAAqB;QAChC,SAAS;QACT,SAAS,EAAE,qBAAqB;QAChC,UAAU;QACV,OAAO,EAAE,qBAAqB;QAC9B,QAAQ;QACR,SAAS,EAAE,4BAA4B,OAEzC,EAf6C,CAe7C,CAAC;AAEH,IAAM,SAAS,GAAG,UAAC,UAAoB,EAAE,KAAe;IACtD,OAAO,IAAA,eAAO,EAAe;QAC3B,OAAO;YACL,WAAW,EAAE,UAAC,QAAQ,IAAK,OAAA,uBACtB,QAAQ,KACX,KAAK,EAAE,+BAA+B,IACtC,EAHyB,CAGzB;YACF,SAAS,EAAE,UAAC,QAAQ;gBAClB,6BACK,QAAQ,KACX,QAAQ,EAAE,SAAS,IACnB;YACJ,CAAC;YAED,OAAO,EAAE,UAAC,QAAQ,EAAE,EAAa;oBAAX,SAAS,eAAA;gBAC7B,IAAI,MAAM,GAAG,QAAQ,CAAC;gBAEtB,MAAM,yBACD,MAAM,KACT,SAAS,EAAE,EAAE,GACd,CAAC;gBAEF,IAAI,SAAS,EAAE;oBACb,6BACK,MAAM,KACT,WAAW,EAAE,KAAK,CAAC,CAAC,CAAC,oBAAoB,CAAC,CAAC,CAAC,qBAAqB,EACjE,eAAe,EAAE,UAAU,CAAC,CAAC,CAAC,uBAAuB,CAAC,CAAC,CAAC,OAAO,EAC/D,SAAS,EAAE,gBACT,KAAK;4BACH,CAAC,CAAC,8CAA8C;4BAChD,CAAC,CAAC,sCAAsC,CAC1C,EACF,SAAS,EAAE;4BACT,WAAW,EAAE,KAAK,CAAC,CAAC,CAAC,oBAAoB,CAAC,CAAC,CAAC,qBAAqB;yBAClE,IACD;iBACH;gBAED,6BACK,MAAM,KACT,WAAW,EAAE,KAAK,CAAC,CAAC,CAAC,oBAAoB,CAAC,CAAC,CAAC,qBAAqB,EACjE,eAAe,EAAE,UAAU,CAAC,CAAC,CAAC,uBAAuB,CAAC,CAAC,CAAC,OAAO,EAC/D,SAAS,EAAE;wBACT,WAAW,EAAE,KAAK;4BAChB,CAAC,CAAC,oBAAoB;4BACtB,CAAC,CAAC,4BAA4B;qBACjC,IACD;YACJ,CAAC;YACD,gBAAgB,EAAE,UAAC,QAAQ,IAAK,OAAA,uBAC3B,QAAQ,KACX,MAAM,EAAE,SAAS,IACjB,EAH8B,CAG9B;YACF,IAAI,EAAE,UAAC,QAAQ;gBACb,6BACK,QAAQ,KACX,QAAQ,EAAE,GAAG,IACb;YACJ,CAAC;YACD,KAAK,EAAE,UAAC,QAAQ;gBACd,IAAM,MAAM,yBACP,QAAQ,KACX,SAAS,EAAE,MAAM,EACjB,aAAa,EAAE;wBACb,SAAS,EAAE,MAAM;qBAClB,GACF,CAAC;gBAEF,OAAO,MAAM,CAAC;YAChB,CAAC;YACD,UAAU,EAAE,UAAC,QAAQ;gBACnB,6BACK,QAAQ,KACX,MAAM,EAAE,MAAM,EACd,eAAe,EAAE,oBAAoB,IACrC;YACJ,CAAC;YACD,eAAe,EAAE,UAAC,QAAQ,IAAK,OAAA,uBAC1B,QAAQ,KACX,QAAQ,EAAE,SAAS,EACnB,OAAO,EAAE,CAAC,IACV,EAJ6B,CAI7B;SACH,CAAC;IACJ,CAAC,EAAE,CAAC,UAAU,EAAE,KAAK,CAAC,CAAC,CAAC;AAC1B,CAAC,CAAC;AAWF,SAAgB,WAAW,CAIzB,EAIyC;IAHzC,IAAA,UAAU,gBAAA,EACV,KAAK,WAAA,EACF,KAAK,cAHR,uBAID,CADS;IAER,IAAM,MAAM,GAAG,SAAS,CAAC,UAAU,EAAE,KAAK,CAAC,CAAC;IAE5C,OAAO,CACL,8BAAC,sBAAS,eACJ,KAAK,IACT,UAAU,EAAE,UAAU,EACtB,KAAK,EAAE,WAAW;QAClB,8DAA8D;QAC9D,MAAM,EAAE,MAAa,IACrB,CACH,CAAC;AACJ,CAAC;AApBD,kCAoBC;AAQD,SAAgB,gBAAgB,CAI9B,EAI8C;IAH9C,IAAA,UAAU,gBAAA,EACV,KAAK,WAAA,EACF,KAAK,cAHR,uBAID,CADS;IAER,IAAM,MAAM,GAAG,SAAS,CAAC,UAAU,EAAE,KAAK,CAAC,CAAC;IAE5C,OAAO,CACL,8BAAC,eAAc,eACT,KAAK,IACT,UAAU,EAAE,UAAU,EACtB,KAAK,EAAE,WAAW;QAClB,8DAA8D;QAC9D,MAAM,EAAE,MAAa,IACrB,CACH,CAAC;AACJ,CAAC;AApBD,4CAoBC;AASD,SAAgB,oBAAoB,CAIlC,EAIkD;IAHlD,IAAA,UAAU,gBAAA,EACV,KAAK,WAAA,EACF,KAAK,cAHR,uBAID,CADS;IAER,IAAM,MAAM,GAAG,SAAS,CAAC,UAAU,EAAE,KAAK,CAAC,CAAC;IAE5C,OAAO,CACL,8BAAC,mBAAkB,eACb,KAAK,IACT,UAAU,EAAE,UAAU,EACtB,KAAK,EAAE,WAAW;QAClB,8DAA8D;QAC9D,MAAM,EAAE,MAAa,IACrB,CACH,CAAC;AACJ,CAAC;AApBD,oDAoBC;AASD,SAAgB,yBAAyB,CAIvC,EAIuD;IAHvD,IAAA,UAAU,gBAAA,EACV,KAAK,WAAA,EACF,KAAK,cAHR,uBAID,CADS;IAER,IAAM,MAAM,GAAG,SAAS,CAAC,UAAU,EAAE,KAAK,CAAC,CAAC;IAE5C,OAAO,CACL,8BAAC,yBAAuB,eAClB,KAAK,IACT,UAAU,EAAE,UAAU,EACtB,KAAK,EAAE,WAAW;QAClB,8DAA8D;QAC9D,MAAM,EAAE,MAAa,IACrB,CACH,CAAC;AACJ,CAAC;AApBD,8DAoBC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/SelectInput/index.tsx"],"names":[],"mappings":"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"}

package/dist/esm/SelectInput/index.js

@@ -60,7 +60,7 @@ var useStyles = function (isDisabled, error) {
             },
             multiValueRemove: function (provided) { return (__assign(__assign({}, provided), { cursor: 'pointer' })); },
             menu: function (provided) {
-                return __assign(__assign({}, provided), { minWidth: 250 });
+                return __assign(__assign({}, provided), { zIndex: 1000, minWidth: 250 });
             },
             input: function (provided) {
                 var result = __assign(__assign({}, provided), { boxShadow: 'none', 'input:focus': {
@@ -69,7 +69,7 @@ var useStyles = function (isDisabled, error) {
                 return result;
             },
             multiValue: function (provided) {
-                return __assign(__assign({}, provided), { zIndex: 100000, backgroundColor: 'var(--light-color)' });
+                return __assign(__assign({}, provided), { zIndex: 100, backgroundColor: 'var(--light-color)' });
             },
             multiValueLabel: function (provided) { return (__assign(__assign({}, provided), { fontSize: 'inherit', padding: 3 })); },
         };

package/dist/esm/SelectInput/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/SelectInput/index.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/SelectInput/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,SAKN,MAAM,cAAc,CAAC;AACtB,OAAO,cAA8B,MAAM,oBAAoB,CAAC;AAChE,OAAO,uBAEN,MAAM,8BAA8B,CAAC;AACtC,OAAO,kBAAsC,MAAM,wBAAwB,CAAC;AAE5E,IAAM,WAAW,GAAgB,UAAC,QAAQ,IAAK,OAAA,uBAC1C,QAAQ,KACX,YAAY,EAAE,CAAC,EACf,MAAM,wBACD,QAAQ,CAAC,MAAM,KAClB,SAAS,EAAE,sCAAsC;QACjD,WAAW;QACX,SAAS,EAAE,qBAAqB;QAChC,SAAS;QACT,SAAS,EAAE,qBAAqB;QAChC,UAAU;QACV,OAAO,EAAE,qBAAqB;QAC9B,QAAQ;QACR,SAAS,EAAE,4BAA4B,OAEzC,EAf6C,CAe7C,CAAC;AAEH,IAAM,SAAS,GAAG,UAAC,UAAoB,EAAE,KAAe;IACtD,OAAO,OAAO,CAAe;QAC3B,OAAO;YACL,WAAW,EAAE,UAAC,QAAQ,IAAK,OAAA,uBACtB,QAAQ,KACX,KAAK,EAAE,+BAA+B,IACtC,EAHyB,CAGzB;YACF,SAAS,EAAE,UAAC,QAAQ;gBAClB,6BACK,QAAQ,KACX,QAAQ,EAAE,SAAS,IACnB;YACJ,CAAC;YAED,OAAO,EAAE,UAAC,QAAQ,EAAE,EAAa;oBAAX,SAAS,eAAA;gBAC7B,IAAI,MAAM,GAAG,QAAQ,CAAC;gBAEtB,MAAM,yBACD,MAAM,KACT,SAAS,EAAE,EAAE,GACd,CAAC;gBAEF,IAAI,SAAS,EAAE;oBACb,6BACK,MAAM,KACT,WAAW,EAAE,KAAK,CAAC,CAAC,CAAC,oBAAoB,CAAC,CAAC,CAAC,qBAAqB,EACjE,eAAe,EAAE,UAAU,CAAC,CAAC,CAAC,uBAAuB,CAAC,CAAC,CAAC,OAAO,EAC/D,SAAS,EAAE,gBACT,KAAK;4BACH,CAAC,CAAC,8CAA8C;4BAChD,CAAC,CAAC,sCAAsC,CAC1C,EACF,SAAS,EAAE;4BACT,WAAW,EAAE,KAAK,CAAC,CAAC,CAAC,oBAAoB,CAAC,CAAC,CAAC,qBAAqB;yBAClE,IACD;iBACH;gBAED,6BACK,MAAM,KACT,WAAW,EAAE,KAAK,CAAC,CAAC,CAAC,oBAAoB,CAAC,CAAC,CAAC,qBAAqB,EACjE,eAAe,EAAE,UAAU,CAAC,CAAC,CAAC,uBAAuB,CAAC,CAAC,CAAC,OAAO,EAC/D,SAAS,EAAE;wBACT,WAAW,EAAE,KAAK;4BAChB,CAAC,CAAC,oBAAoB;4BACtB,CAAC,CAAC,4BAA4B;qBACjC,IACD;YACJ,CAAC;YACD,gBAAgB,EAAE,UAAC,QAAQ,IAAK,OAAA,uBAC3B,QAAQ,KACX,MAAM,EAAE,SAAS,IACjB,EAH8B,CAG9B;YACF,IAAI,EAAE,UAAC,QAAQ;gBACb,6BACK,QAAQ,KACX,MAAM,EAAE,IAAI,EACZ,QAAQ,EAAE,GAAG,IACb;YACJ,CAAC;YACD,KAAK,EAAE,UAAC,QAAQ;gBACd,IAAM,MAAM,yBACP,QAAQ,KACX,SAAS,EAAE,MAAM,EACjB,aAAa,EAAE;wBACb,SAAS,EAAE,MAAM;qBAClB,GACF,CAAC;gBAEF,OAAO,MAAM,CAAC;YAChB,CAAC;YACD,UAAU,EAAE,UAAC,QAAQ;gBACnB,6BACK,QAAQ,KACX,MAAM,EAAE,GAAG,EACX,eAAe,EAAE,oBAAoB,IACrC;YACJ,CAAC;YACD,eAAe,EAAE,UAAC,QAAQ,IAAK,OAAA,uBAC1B,QAAQ,KACX,QAAQ,EAAE,SAAS,EACnB,OAAO,EAAE,CAAC,IACV,EAJ6B,CAI7B;SACH,CAAC;IACJ,CAAC,EAAE,CAAC,UAAU,EAAE,KAAK,CAAC,CAAC,CAAC;AAC1B,CAAC,CAAC;AAWF,MAAM,UAAU,WAAW,CAIzB,EAIyC;IAHzC,IAAA,UAAU,gBAAA,EACV,KAAK,WAAA,EACF,KAAK,cAHR,uBAID,CADS;IAER,IAAM,MAAM,GAAG,SAAS,CAAC,UAAU,EAAE,KAAK,CAAC,CAAC;IAE5C,OAAO,CACL,oBAAC,SAAS,eACJ,KAAK,IACT,UAAU,EAAE,UAAU,EACtB,KAAK,EAAE,WAAW;QAClB,8DAA8D;QAC9D,MAAM,EAAE,MAAa,IACrB,CACH,CAAC;AACJ,CAAC;AAQD,MAAM,UAAU,gBAAgB,CAI9B,EAI8C;IAH9C,IAAA,UAAU,gBAAA,EACV,KAAK,WAAA,EACF,KAAK,cAHR,uBAID,CADS;IAER,IAAM,MAAM,GAAG,SAAS,CAAC,UAAU,EAAE,KAAK,CAAC,CAAC;IAE5C,OAAO,CACL,oBAAC,cAAc,eACT,KAAK,IACT,UAAU,EAAE,UAAU,EACtB,KAAK,EAAE,WAAW;QAClB,8DAA8D;QAC9D,MAAM,EAAE,MAAa,IACrB,CACH,CAAC;AACJ,CAAC;AASD,MAAM,UAAU,oBAAoB,CAIlC,EAIkD;IAHlD,IAAA,UAAU,gBAAA,EACV,KAAK,WAAA,EACF,KAAK,cAHR,uBAID,CADS;IAER,IAAM,MAAM,GAAG,SAAS,CAAC,UAAU,EAAE,KAAK,CAAC,CAAC;IAE5C,OAAO,CACL,oBAAC,kBAAkB,eACb,KAAK,IACT,UAAU,EAAE,UAAU,EACtB,KAAK,EAAE,WAAW;QAClB,8DAA8D;QAC9D,MAAM,EAAE,MAAa,IACrB,CACH,CAAC;AACJ,CAAC;AASD,MAAM,UAAU,yBAAyB,CAIvC,EAIuD;IAHvD,IAAA,UAAU,gBAAA,EACV,KAAK,WAAA,EACF,KAAK,cAHR,uBAID,CADS;IAER,IAAM,MAAM,GAAG,SAAS,CAAC,UAAU,EAAE,KAAK,CAAC,CAAC;IAE5C,OAAO,CACL,oBAAC,uBAAuB,eAClB,KAAK,IACT,UAAU,EAAE,UAAU,EACtB,KAAK,EAAE,WAAW;QAClB,8DAA8D;QAC9D,MAAM,EAAE,MAAa,IACrB,CACH,CAAC;AACJ,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "datocms-react-ui",
-  "version": "0.3.24",
+  "version": "0.3.28",
   "description": "React components to use inside DatoCMS plugins",
   "keywords": [
     "datocms",
@@ -19,6 +19,7 @@
     "test": "__tests__"
   },
   "files": [
+    "src",
     "dist",
     "styles.css",
     "types.json"
@@ -40,7 +41,7 @@
   },
   "dependencies": {
     "classnames": "^2.3.1",
-    "datocms-plugin-sdk": "^0.3.24",
+    "datocms-plugin-sdk": "^0.3.27",
     "react-intersection-observer": "^8.31.0",
     "react-select": "^5.2.1",
     "scroll-into-view-if-needed": "^2.2.20"
@@ -56,5 +57,5 @@
     "postcss-nested": "^5.0.6",
     "typedoc": "^0.22.8"
   },
-  "gitHead": "8de7e2cbfcb4514cd07ca0978be12c9e8c4996aa"
+  "gitHead": "19af57b61bd763cdb9c3d4aa945408b577602cc0"
 }

package/src/Button/index.tsx

@@ -0,0 +1,173 @@
+import React, { CSSProperties, MouseEventHandler, ReactNode } from 'react';
+import cn from 'classnames';
+import styles from './styles.module.css.json';
+
+export type ButtonProps = {
+  children?: ReactNode;
+  type?: React.ButtonHTMLAttributes<HTMLButtonElement>['type'];
+  className?: string;
+  disabled?: boolean;
+  onClick?: MouseEventHandler;
+  buttonType?: 'primary' | 'muted' | 'negative';
+  buttonSize?: 'xxs' | 'xs' | 's' | 'm' | 'l' | 'xl';
+  leftIcon?: ReactNode;
+  rightIcon?: ReactNode;
+  fullWidth?: boolean;
+  style?: CSSProperties;
+};
+
+/**
+ * @example Button types
+ *
+ * ```js
+ * <Canvas ctx={ctx}>
+ *   <div style={{ marginBottom: 'var(--spacing-m)' }}>
+ *     <Button buttonType="muted">Submit</Button>{' '}
+ *     <Button buttonType="primary">Submit</Button>{' '}
+ *     <Button buttonType="negative">Submit</Button>
+ *   </div>
+ *   <div>
+ *     <Button buttonType="muted" disabled>
+ *       Submit
+ *     </Button>{' '}
+ *     <Button buttonType="primary" disabled>
+ *       Submit
+ *     </Button>{' '}
+ *     <Button buttonType="negative" disabled>
+ *       Submit
+ *     </Button>
+ *   </div>
+ * </Canvas>;
+ * ```
+ *
+ * @example Full-width
+ *
+ * ```js
+ * <Canvas ctx={ctx}>
+ *   <Button fullWidth>Submit</Button>
+ * </Canvas>;
+ * ```
+ *
+ * @example Sizing
+ *
+ * ```js
+ * <Canvas ctx={ctx}>
+ *   <Button buttonSize="xxs">Submit</Button>{' '}
+ *   <Button buttonSize="xs">Submit</Button>{' '}
+ *   <Button buttonSize="s">Submit</Button>{' '}
+ *   <Button buttonSize="m">Submit</Button>{' '}
+ *   <Button buttonSize="l">Submit</Button>{' '}
+ *   <Button buttonSize="xl">Submit</Button>{' '}
+ * </Canvas>;
+ * ```
+ *
+ * @example Icons
+ *
+ * ```js
+ * <Canvas ctx={ctx}>
+ *   <div style={{ marginBottom: 'var(--spacing-m)' }}>
+ *     <Button leftIcon={<PlusIcon />}>Submit</Button>
+ *   </div>
+ *   <div style={{ marginBottom: 'var(--spacing-m)' }}>
+ *     <Button rightIcon={<ChevronDownIcon />}>Options</Button>
+ *   </div>
+ *   <div>
+ *     <Button leftIcon={<PlusIcon />} />
+ *   </div>
+ * </Canvas>;
+ * ```
+ */
+export function Button({
+  children,
+  className,
+  disabled,
+  buttonType = 'muted',
+  buttonSize = 'm',
+  fullWidth,
+  onClick,
+  style,
+  leftIcon,
+  rightIcon,
+  type = 'button',
+}: ButtonProps): JSX.Element {
+  return (
+    <button
+      type={type}
+      className={cn(
+        styles.button,
+        styles[`buttonType-${buttonType}`],
+        styles[`buttonSize-${buttonSize}`],
+        {
+          [styles.disabled]: disabled,
+          [styles.fullWidth]: fullWidth,
+        },
+        className,
+      )}
+      disabled={disabled}
+      onClick={onClick}
+      style={style}
+    >
+      {leftIcon && (
+        <span className={styles['button__leftIcon']}>{leftIcon}</span>
+      )}
+      {children && <span>{children}</span>}
+      {rightIcon && (
+        <span className={styles['button__rightIcon']}>{rightIcon}</span>
+      )}
+    </button>
+  );
+}
+
+export type ButtonLinkProps = {
+  children?: ReactNode;
+  href: string;
+  target?: React.AnchorHTMLAttributes<HTMLAnchorElement>['target'];
+  className?: string;
+  onClick?: MouseEventHandler;
+  buttonType?: 'primary' | 'muted' | 'negative';
+  buttonSize?: 'xxs' | 'xs' | 's' | 'm' | 'l' | 'xl';
+  fullWidth?: boolean;
+  style?: CSSProperties;
+  leftIcon?: ReactNode;
+  rightIcon?: ReactNode;
+};
+
+export function ButtonLink({
+  children,
+  href,
+  target = '_blank',
+  className,
+  buttonType = 'muted',
+  buttonSize = 'm',
+  onClick,
+  fullWidth,
+  leftIcon,
+  rightIcon,
+  style,
+}: ButtonLinkProps): JSX.Element {
+  return (
+    <a
+      href={href}
+      target={target}
+      className={cn(
+        styles.button,
+        styles[`buttonType-${buttonType}`],
+        styles[`buttonSize-${buttonSize}`],
+        {
+          [styles.fullWidth]: fullWidth,
+        },
+        className,
+      )}
+      style={style}
+      onClick={onClick}
+    >
+      {leftIcon && (
+        <span className={styles['button__leftIcon']}>{leftIcon}</span>
+      )}
+      {children && <span>{children}</span>}
+      {rightIcon && (
+        <span className={styles['button__rightIcon']}>{rightIcon}</span>
+      )}
+    </a>
+  );
+}

package/src/Button/styles.module.css

@@ -0,0 +1,149 @@
+.button {
+  text-decoration: none;
+  display: inline-block;
+  vertical-align: middle;
+  white-space: nowrap;
+  font-family: inherit;
+  cursor: pointer;
+  line-height: inherit;
+  background-color: transparent;
+  color: var(--base-body-color);
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  border-radius: 4px;
+  box-sizing: border-box;
+  transition: all 0.3s var(--material-ease);
+  font-weight: var(--font-weight-bold);
+  border: 0;
+  opacity: 1;
+
+  &:hover,
+  &:focus {
+    opacity: 0.8;
+  }
+
+  &:active {
+    opacity: 0.7;
+  }
+}
+
+.disabled {
+  cursor: not-allowed;
+}
+
+.buttonType-muted {
+  background-color: var(--light-color);
+  color: var(--accent-color);
+
+  &.disabled {
+    background-color: var(--light-bg-color);
+    color: rgba(0, 0, 0, 0.2);
+
+    &:hover,
+    &:focus,
+    &:active {
+      color: rgba(0, 0, 0, 0.2);
+    }
+  }
+}
+
+.buttonType-primary {
+  background-color: var(--accent-color);
+  color: white;
+
+  &:hover,
+  &:focus,
+  &:active {
+    color: white;
+  }
+
+  &.disabled {
+    background-color: var(--disabled-bg-color);
+    color: rgba(0, 0, 0, 0.2);
+    &:hover,
+    &:focus,
+    &:active {
+      color: rgba(0, 0, 0, 0.2);
+    }
+  }
+}
+
+.buttonType-negative {
+  background-color: var(--alert-color);
+  color: white;
+
+  &:hover,
+  &:focus,
+  &:active {
+    color: white;
+    background-color: var(--alert-color);
+  }
+
+  &.disabled {
+    background-color: var(--disabled-bg-color);
+    color: rgba(0, 0, 0, 0.2);
+  }
+}
+
+.buttonSize-xxs {
+  font-size: 1em;
+  padding: 0.5em 0.8em;
+}
+
+.buttonSize-xs {
+  font-size: 1em;
+  padding: 0.6em 0.8em;
+}
+
+.buttonSize-s {
+  padding: 0.7em 1em;
+  font-size: 1em;
+}
+
+.buttonSize-m {
+  padding: 0.7em 1em;
+  font-size: 1.1em;
+}
+
+.buttonSize-l {
+  padding: 0.7em 1em;
+  font-size: 1.2em;
+}
+
+.buttonSize-xl {
+  font-size: 1.2em;
+  padding: 1em 1em;
+}
+
+.fullWidth {
+  text-align: center;
+  display: block;
+  width: 100%;
+}
+
+.button__leftIcon,
+.button__rightIcon {
+  display: inline-block;
+  vertical-align: middle;
+  line-height: 0.6;
+
+  svg {
+    fill: var(--accent-color);
+  }
+}
+
+.button__leftIcon {
+  margin-right: 0.5em;
+
+  &:last-child {
+    margin-right: 0;
+  }
+}
+
+.button__rightIcon {
+  margin-left: 0.5em;
+
+  &:first-child {
+    margin-left: 0;
+  }
+}

package/src/Button/styles.module.css.json

@@ -0,0 +1 @@
+{"button":"_button_474wk_1","disabled":"_disabled_474wk_30","buttonType-muted":"_buttonType-muted_474wk_34","buttonType-primary":"_buttonType-primary_474wk_50","buttonType-negative":"_buttonType-negative_474wk_71","buttonSize-xxs":"_buttonSize-xxs_474wk_88","buttonSize-xs":"_buttonSize-xs_474wk_93","buttonSize-s":"_buttonSize-s_474wk_98","buttonSize-m":"_buttonSize-m_474wk_103","buttonSize-l":"_buttonSize-l_474wk_108","buttonSize-xl":"_buttonSize-xl_474wk_113","fullWidth":"_fullWidth_474wk_118","button__leftIcon":"_button__leftIcon_474wk_124","button__rightIcon":"_button__rightIcon_474wk_125"}

package/src/ButtonGroup/Button/index.tsx

@@ -0,0 +1,40 @@
+import classNames from 'classnames';
+import React, { CSSProperties, MouseEventHandler, ReactNode } from 'react';
+import s from './styles.module.css.json';
+
+export type ButtonProps = {
+  children?: ReactNode;
+  className?: string;
+  selected?: boolean;
+  disabled?: boolean;
+  style?: CSSProperties;
+  onClick?: MouseEventHandler;
+};
+
+export function Button({
+  children,
+  style,
+  className,
+  selected,
+  disabled,
+  onClick,
+}: ButtonProps): JSX.Element {
+  return (
+    <button
+      type="button"
+      onClick={onClick}
+      disabled={disabled}
+      className={classNames(
+        s['Button'],
+        {
+          [s['Button--selected']]: selected,
+          [s['Button--disabled']]: disabled,
+        },
+        className,
+      )}
+      style={style}
+    >
+      {children}
+    </button>
+  );
+}

package/src/ButtonGroup/Button/styles.module.css

@@ -0,0 +1,72 @@
+.Button {
+  font-family: inherit;
+  cursor: pointer;
+  line-height: inherit;
+  background-color: white;
+  color: var(--base-body-color);
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  font-size: inherit;
+  box-sizing: border-box;
+  border: 0;
+  padding: 0;
+  padding: 7px 13px;
+  border-right: 1px solid var(--border-color);
+  border: 1px solid var(--border-color);
+  border-left-width: 0;
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+  justify-column: center;
+  color: rgba(var(--base-body-color-rgb-components, 0.6));
+}
+
+.Button:hover {
+  background-color: var(--light-bg-color);
+}
+
+.Button svg {
+  fill: var(--light-body-color);
+}
+
+.Button--s {
+  padding: 3px 10px;
+}
+
+.Button--disabled {
+  cursor: not-allowed;
+  color: var(--light-body-color);
+}
+
+.Button--disabled:hover {
+  background: white;
+}
+
+.Button--selected {
+  background-color: var(--accent-color);
+  border-color: var(--accent-color);
+  color: white;
+}
+
+.Button--selected svg {
+  fill: white;
+}
+
+.Button--selected:hover {
+  background-color: var(--accent-color);
+}
+
+.Button--selected:hover,
+.Button--selected.Button--disabled {
+  background-color: rgba(var(--accent-color-rgb-components), 0.8);
+  border-color: rgba(var(--accent-color-rgb-components), 0.8);
+}
+
+.Button:first-child {
+  border-radius: 4px 0 0 4px;
+  border-left-width: 1px;
+}
+
+.Button:last-child {
+  border-radius: 0 4px 4px 0;
+}

package/src/ButtonGroup/Button/styles.module.css.json

@@ -0,0 +1 @@
+{"Button":"_Button_1h1w1_1","Button--s":"_Button--s_1h1w1_32","Button--disabled":"_Button--disabled_1h1w1_36","Button--selected":"_Button--selected_1h1w1_45"}

package/src/ButtonGroup/Group/index.tsx

@@ -0,0 +1,31 @@
+import classNames from 'classnames';
+import React, { CSSProperties, ReactNode } from 'react';
+import s from './styles.module.css.json';
+
+export type GroupProps = {
+  children?: ReactNode;
+  className?: string;
+  style?: CSSProperties;
+};
+
+/**
+ * @example Basic example
+ *
+ * ```js
+ * <Canvas ctx={ctx}>
+ *   <ButtonGroup>
+ *     <ButtonGroupButton>First</ButtonGroupButton>
+ *     <ButtonGroupButton selected>Second</ButtonGroupButton>
+ *     <ButtonGroupButton>Third</ButtonGroupButton>
+ *     <ButtonGroupButton disabled>Fourth</ButtonGroupButton>
+ *   </ButtonGroup>
+ * </Canvas>;
+ * ```
+ */
+export function Group({ children, style, className }: GroupProps): JSX.Element {
+  return (
+    <div className={classNames(s['Group'], className)} style={style}>
+      {children}
+    </div>
+  );
+}

package/src/ButtonGroup/Group/styles.module.css

@@ -0,0 +1,6 @@
+.Group {
+  display: flex;
+  align-items: stretch;
+  background-color: white;
+  overflow: hidden;
+}

package/src/ButtonGroup/Group/styles.module.css.json

@@ -0,0 +1 @@
+{"Group":"_Group_10mj4_1"}

package/src/ButtonGroup/index.ts

@@ -0,0 +1,4 @@
+export { Group as ButtonGroup } from './Group';
+export type { GroupProps as ButtonGroupProps } from './Group';
+export { Button as ButtonGroupButton } from './Button';
+export type { ButtonProps as ButtonGroupButtonProps } from './Button';