@react-md/button - npm Package Compare versions

Comparing version 2.0.0-alpha.12 to 2.0.0-alpha.13

es/Button.js

@@ -24,14 +24,19 @@ var __assign = (this && this.__assign) || function () {
 /* eslint-disable react/button-has-type */
-import React, { forwardRef } from "react";
+import React, { forwardRef, } from "react";
 import { useInteractionStates, } from "@react-md/states";
 import buttonThemeClassNames from "./buttonThemeClassNames";
-var Button = function (providedProps) {
-    var _a = providedProps, _theme = _a.theme, themeType = _a.themeType, _buttonType = _a.buttonType, children = _a.children, forwardedRef = _a.forwardedRef, disableRipple = _a.disableRipple, disableProgrammaticRipple = _a.disableProgrammaticRipple, rippleTimeout = _a.rippleTimeout, rippleClassNames = _a.rippleClassNames, rippleClassName = _a.rippleClassName, rippleContainerClassName = _a.rippleContainerClassName, propEnablePressedAndRipple = _a.enablePressedAndRipple, props = __rest(_a, ["theme", "themeType", "buttonType", "children", "forwardedRef", "disableRipple", "disableProgrammaticRipple", "rippleTimeout", "rippleClassNames", "rippleClassName", "rippleContainerClassName", "enablePressedAndRipple"]);
-    var disabled = props.disabled;
+function Button(_a, ref) {
+    var _b = _a.type, type = _b === void 0 ? "button" : _b, _c = _a.disabled, disabled = _c === void 0 ? false : _c, _d = _a.theme, theme = _d === void 0 ? "clear" : _d, _e = _a.themeType, themeType = _e === void 0 ? "flat" : _e, _f = _a.buttonType, buttonType = _f === void 0 ? "text" : _f, propClassName = _a.className, children = _a.children, disableRipple = _a.disableRipple, disableProgrammaticRipple = _a.disableProgrammaticRipple, rippleTimeout = _a.rippleTimeout, rippleClassNames = _a.rippleClassNames, rippleClassName = _a.rippleClassName, rippleContainerClassName = _a.rippleContainerClassName, propEnablePressedAndRipple = _a.enablePressedAndRipple, props = __rest(_a, ["type", "disabled", "theme", "themeType", "buttonType", "className", "children", "disableRipple", "disableProgrammaticRipple", "rippleTimeout", "rippleClassNames", "rippleClassName", "rippleContainerClassName", "enablePressedAndRipple"]);
     var enablePressedAndRipple = typeof propEnablePressedAndRipple === "boolean"
         ? propEnablePressedAndRipple
         : themeType === "contained";
-    var _b = useInteractionStates({
+    var _g = useInteractionStates({
         handlers: props,
-        className: buttonThemeClassNames(providedProps),
+        className: buttonThemeClassNames({
+            theme: theme,
+            themeType: themeType,
+            buttonType: buttonType,
+            disabled: disabled,
+            className: propClassName,
+        }),
         disabled: disabled,
@@ -45,24 +50,12 @@ disableRipple: disableRipple,
         enablePressedAndRipple: enablePressedAndRipple,
-    }), ripples = _b.ripples, className = _b.className, handlers = _b.handlers;
-    return (React.createElement("button", __assign({}, props, handlers, { ref: forwardedRef, className: className }),
+    }), ripples = _g.ripples, className = _g.className, handlers = _g.handlers;
+    return (React.createElement("button", __assign({}, props, handlers, { ref: ref, type: type, className: className, disabled: disabled }),
         children,
         ripples));
-};
-var defaultProps = {
-    type: "button",
-    disabled: false,
-    theme: "clear",
-    themeType: "flat",
-    buttonType: "text",
-};
-Button.defaultProps = defaultProps;
+}
+var ForwardedButton = forwardRef(Button);
 if (process.env.NODE_ENV !== "production") {
-    Button.displayName = "Button";
-    var PropTypes = null;
     try {
-        PropTypes = require("prop-types");
-    }
-    catch (e) { }
-    if (PropTypes) {
-        Button.propTypes = {
+        var PropTypes = require("prop-types");
+        ForwardedButton.propTypes = {
             type: PropTypes.oneOf(["button", "reset", "submit"]),
@@ -83,4 +76,5 @@ className: PropTypes.string,
     }
+    catch (e) { }
 }
-export default forwardRef(function (props, ref) { return (React.createElement(Button, __assign({}, props, { forwardedRef: ref }))); });
+export default ForwardedButton;
 //# sourceMappingURL=Button.js.map

es/buttonThemeClassNames.js

@@ -5,7 +5,8 @@ import cn from "classnames";
 /**
- * Creates a button theme based on the button theming props. This is really just used so that
- * other elements like clickable `<div>`s or `<input type="file">` can look like buttons.
+ * Creates a button theme based on the button theming props. This is really just
+ * used so that other elements like clickable `<div>`s or `<input type="file">`
+ * can look like buttons.
  *
- * @param props An object containing the themeable button props to generate a button theme
- * className.
+ * @param props An object containing the themeable button props to generate a
+ * button theme className.
  * @return a string of class names to create an element with a button theme.
@@ -12,0 +13,0 @@ */

es/UnstyledButton.js

@@ -24,3 +24,3 @@ var __assign = (this && this.__assign) || function () {
 /* eslint-disable react/prop-types */
-import React, { forwardRef } from "react";
+import React, { forwardRef, } from "react";
 import cn from "classnames";
@@ -31,15 +31,11 @@ /**
  */
-var UnstyledButton = function (_a) {
-    var className = _a.className, children = _a.children, forwardedRef = _a.forwardedRef, props = __rest(_a, ["className", "children", "forwardedRef"]);
-    return (React.createElement("button", __assign({}, props, { type: "button", ref: forwardedRef, className: cn("rmd-button-unstyled", className) }), children));
-};
+function UnstyledButton(_a, ref) {
+    var className = _a.className, children = _a.children, props = __rest(_a, ["className", "children"]);
+    return (React.createElement("button", __assign({}, props, { type: "button", ref: ref, className: cn("rmd-button-unstyled", className) }), children));
+}
+var ForwardedUnstyledButton = forwardRef(UnstyledButton);
 if (process.env.NODE_ENV !== "production") {
-    UnstyledButton.displayName = "UnstyledButton";
-    var PropTypes = null;
     try {
-        PropTypes = require("prop-types");
-    }
-    catch (e) { }
-    if (PropTypes) {
-        UnstyledButton.propTypes = {
+        var PropTypes = require("prop-types");
+        ForwardedUnstyledButton.propTypes = {
             className: PropTypes.string,
@@ -50,4 +46,5 @@ disabled: PropTypes.bool,
     }
+    catch (e) { }
 }
-export default forwardRef(function (props, ref) { return React.createElement(UnstyledButton, __assign({}, props, { forwardedRef: ref })); });
+export default ForwardedUnstyledButton;
 //# sourceMappingURL=UnstyledButton.js.map

lib/Button.js

@@ -39,11 +39,16 @@ "use strict";
 var buttonThemeClassNames_1 = __importDefault(require("./buttonThemeClassNames"));
-var Button = function (providedProps) {
-    var _a = providedProps, _theme = _a.theme, themeType = _a.themeType, _buttonType = _a.buttonType, children = _a.children, forwardedRef = _a.forwardedRef, disableRipple = _a.disableRipple, disableProgrammaticRipple = _a.disableProgrammaticRipple, rippleTimeout = _a.rippleTimeout, rippleClassNames = _a.rippleClassNames, rippleClassName = _a.rippleClassName, rippleContainerClassName = _a.rippleContainerClassName, propEnablePressedAndRipple = _a.enablePressedAndRipple, props = __rest(_a, ["theme", "themeType", "buttonType", "children", "forwardedRef", "disableRipple", "disableProgrammaticRipple", "rippleTimeout", "rippleClassNames", "rippleClassName", "rippleContainerClassName", "enablePressedAndRipple"]);
-    var disabled = props.disabled;
+function Button(_a, ref) {
+    var _b = _a.type, type = _b === void 0 ? "button" : _b, _c = _a.disabled, disabled = _c === void 0 ? false : _c, _d = _a.theme, theme = _d === void 0 ? "clear" : _d, _e = _a.themeType, themeType = _e === void 0 ? "flat" : _e, _f = _a.buttonType, buttonType = _f === void 0 ? "text" : _f, propClassName = _a.className, children = _a.children, disableRipple = _a.disableRipple, disableProgrammaticRipple = _a.disableProgrammaticRipple, rippleTimeout = _a.rippleTimeout, rippleClassNames = _a.rippleClassNames, rippleClassName = _a.rippleClassName, rippleContainerClassName = _a.rippleContainerClassName, propEnablePressedAndRipple = _a.enablePressedAndRipple, props = __rest(_a, ["type", "disabled", "theme", "themeType", "buttonType", "className", "children", "disableRipple", "disableProgrammaticRipple", "rippleTimeout", "rippleClassNames", "rippleClassName", "rippleContainerClassName", "enablePressedAndRipple"]);
     var enablePressedAndRipple = typeof propEnablePressedAndRipple === "boolean"
         ? propEnablePressedAndRipple
         : themeType === "contained";
-    var _b = states_1.useInteractionStates({
+    var _g = states_1.useInteractionStates({
         handlers: props,
-        className: buttonThemeClassNames_1.default(providedProps),
+        className: buttonThemeClassNames_1.default({
+            theme: theme,
+            themeType: themeType,
+            buttonType: buttonType,
+            disabled: disabled,
+            className: propClassName,
+        }),
         disabled: disabled,
@@ -57,24 +62,12 @@ disableRipple: disableRipple,
         enablePressedAndRipple: enablePressedAndRipple,
-    }), ripples = _b.ripples, className = _b.className, handlers = _b.handlers;
-    return (react_1.default.createElement("button", __assign({}, props, handlers, { ref: forwardedRef, className: className }),
+    }), ripples = _g.ripples, className = _g.className, handlers = _g.handlers;
+    return (react_1.default.createElement("button", __assign({}, props, handlers, { ref: ref, type: type, className: className, disabled: disabled }),
         children,
         ripples));
-};
-var defaultProps = {
-    type: "button",
-    disabled: false,
-    theme: "clear",
-    themeType: "flat",
-    buttonType: "text",
-};
-Button.defaultProps = defaultProps;
+}
+var ForwardedButton = react_1.forwardRef(Button);
 if (process.env.NODE_ENV !== "production") {
-    Button.displayName = "Button";
-    var PropTypes = null;
     try {
-        PropTypes = require("prop-types");
-    }
-    catch (e) { }
-    if (PropTypes) {
-        Button.propTypes = {
+        var PropTypes = require("prop-types");
+        ForwardedButton.propTypes = {
             type: PropTypes.oneOf(["button", "reset", "submit"]),
@@ -95,4 +88,5 @@ className: PropTypes.string,
     }
+    catch (e) { }
 }
-exports.default = react_1.forwardRef(function (props, ref) { return (react_1.default.createElement(Button, __assign({}, props, { forwardedRef: ref }))); });
+exports.default = ForwardedButton;
 //# sourceMappingURL=Button.js.map

lib/buttonThemeClassNames.js

@@ -10,7 +10,8 @@ "use strict";
 /**
- * Creates a button theme based on the button theming props. This is really just used so that
- * other elements like clickable `<div>`s or `<input type="file">` can look like buttons.
+ * Creates a button theme based on the button theming props. This is really just
+ * used so that other elements like clickable `<div>`s or `<input type="file">`
+ * can look like buttons.
  *
- * @param props An object containing the themeable button props to generate a button theme
- * className.
+ * @param props An object containing the themeable button props to generate a
+ * button theme className.
  * @return a string of class names to create an element with a button theme.
@@ -17,0 +18,0 @@ */

lib/UnstyledButton.js

@@ -42,15 +42,11 @@ "use strict";
  */
-var UnstyledButton = function (_a) {
-    var className = _a.className, children = _a.children, forwardedRef = _a.forwardedRef, props = __rest(_a, ["className", "children", "forwardedRef"]);
-    return (react_1.default.createElement("button", __assign({}, props, { type: "button", ref: forwardedRef, className: classnames_1.default("rmd-button-unstyled", className) }), children));
-};
+function UnstyledButton(_a, ref) {
+    var className = _a.className, children = _a.children, props = __rest(_a, ["className", "children"]);
+    return (react_1.default.createElement("button", __assign({}, props, { type: "button", ref: ref, className: classnames_1.default("rmd-button-unstyled", className) }), children));
+}
+var ForwardedUnstyledButton = react_1.forwardRef(UnstyledButton);
 if (process.env.NODE_ENV !== "production") {
-    UnstyledButton.displayName = "UnstyledButton";
-    var PropTypes = null;
     try {
-        PropTypes = require("prop-types");
-    }
-    catch (e) { }
-    if (PropTypes) {
-        UnstyledButton.propTypes = {
+        var PropTypes = require("prop-types");
+        ForwardedUnstyledButton.propTypes = {
             className: PropTypes.string,
@@ -61,4 +57,5 @@ disabled: PropTypes.bool,
     }
+    catch (e) { }
 }
-exports.default = react_1.forwardRef(function (props, ref) { return react_1.default.createElement(UnstyledButton, __assign({}, props, { forwardedRef: ref })); });
+exports.default = ForwardedUnstyledButton;
 //# sourceMappingURL=UnstyledButton.js.map

package.json

 {
   "name": "@react-md/button",
-  "version": "2.0.0-alpha.12",
+  "version": "2.0.0-alpha.13",
   "description": "This package is used to create buttons with the material design spec. There is built-in support to be able to render accessible clickable divs that look like buttons, or even apply button styles to any element.",
@@ -40,8 +40,8 @@ "scripts": {
   "dependencies": {
-    "@react-md/elevation": "^2.0.0-alpha.12",
-    "@react-md/icon": "^2.0.0-alpha.12",
-    "@react-md/states": "^2.0.0-alpha.12",
-    "@react-md/theme": "^2.0.0-alpha.12",
-    "@react-md/typography": "^2.0.0-alpha.12",
-    "@react-md/utils": "^2.0.0-alpha.12",
+    "@react-md/elevation": "^2.0.0-alpha.13",
+    "@react-md/icon": "^2.0.0-alpha.13",
+    "@react-md/states": "^2.0.0-alpha.13",
+    "@react-md/theme": "^2.0.0-alpha.13",
+    "@react-md/typography": "^2.0.0-alpha.13",
+    "@react-md/utils": "^2.0.0-alpha.13",
     "classnames": "^2.2.6"
@@ -58,3 +58,3 @@ },
   },
-  "gitHead": "b31afe8dc076cf0647ac3e99dc0b61f8f4b7b0e2"
+  "gitHead": "47959dd8c691deae0310c7cd01b3c275699e6f8c"
 }

src/buttonThemeClassNames.ts

@@ -10,5 +10,5 @@ import cn from "classnames";
 /**
- * One of the valid material design default button themes that can be used. This will
- * update the general look and feel by updating the colors within the button while the
- * `ButtonThemeType` will update the borders or box shadow.
+ * One of the valid material design default button themes that can be used. This
+ * will update the general look and feel by updating the colors within the
+ * button while the `ButtonThemeType` will update the borders or box shadow.
  */
@@ -23,5 +23,5 @@ export type ButtonTheme =
 /**
- * One of the valid material design "themed" button types that can be used. This will
- * update the general look and feel by adding borders or box shadow to the button while
- * the `ButtonTheme` will update the colors.
+ * One of the valid material design "themed" button types that can be used. This
+ * will update the general look and feel by adding borders or box shadow to the
+ * button while the `ButtonTheme` will update the colors.
  */
@@ -31,9 +31,10 @@ export type ButtonThemeType = "flat" | "outline" | "contained";
 /**
- * This is an interface of all the button's customizable theme props. This is mainly used if you
- * want to add a button theme to another component and have it configurable via props.
+ * This is an interface of all the button's customizable theme props. This is
+ * mainly used if you want to add a button theme to another component and have
+ * it configurable via props.
  */
 export interface ButtonThemeProps {
   /**
-   * An optional className to also apply to the button for additional theming and styling. This
-   * will be merged with the `Button.theme` class name styles.
+   * An optional className to also apply to the button for additional theming
+   * and styling. This will be merged with the `Button.theme` class name styles.
    */
@@ -43,5 +44,5 @@ className?: string;
   /**
-   * Enabling this prop will apply the disabled styles to a `Button`. When this is also applied
-   * to the button component, the button will be updated so that it can no longer be interacted
-   * with.
+   * Enabling this prop will apply the disabled styles to a `Button`. When this
+   * is also applied to the button component, the button will be updated so that
+   * it can no longer be interacted with.
    */
@@ -51,6 +52,7 @@ disabled?: boolean;
   /**
-   * This is the specific material design button type to use. This can either be set to "text" or
-   * "icon". When this is set to "text", the styles applied will make buttons with just text or text
-   * with icons render nicely. When this is set to "icon", the styles applied will make icon only
-   * buttons render nicely.
+   * This is the specific material design button type to use. This can either be
+   * set to "text" or "icon". When this is set to "text", the styles applied
+   * will make buttons with just text or text with icons render nicely. When
+   * this is set to "icon", the styles applied will make icon only buttons
+   * render nicely.
    */
@@ -60,4 +62,5 @@ buttonType?: ButtonType;
   /**
-   * The material design theme to apply to the button. The theme prop will update the look and feel
-   * of the button by applying different background and/or foreground colors.
+   * The material design theme to apply to the button. The theme prop will
+   * update the look and feel of the button by applying different background
+   * and/or foreground colors.
    */
@@ -67,4 +70,4 @@ theme?: ButtonTheme;
   /**
-   * The material design theme type to apply. The themeTYpe prop will update the look and feel of
-   * the button by applying different border or box shadow.
+   * The material design theme type to apply. The themeTYpe prop will update the
+   * look and feel of the button by applying different border or box shadow.
    */
@@ -77,7 +80,8 @@ themeType?: ButtonThemeType;
 /**
- * Creates a button theme based on the button theming props. This is really just used so that
- * other elements like clickable `<div>`s or `<input type="file">` can look like buttons.
+ * Creates a button theme based on the button theming props. This is really just
+ * used so that other elements like clickable `<div>`s or `<input type="file">`
+ * can look like buttons.
  *
- * @param props An object containing the themeable button props to generate a button theme
- * className.
+ * @param props An object containing the themeable button props to generate a
+ * button theme className.
  * @return a string of class names to create an element with a button theme.
@@ -84,0 +88,0 @@ */

types/Button.d.ts

@@ -5,22 +5,23 @@ import React, { ButtonHTMLAttributes, ReactNode } from "react";
 /**
- * This interface includes all the props that the `Button` component accepts so the main
- * usecase might be creating a functionality wrapper for the `Button` component, but passes
- * all props down as normal.
+ * This interface includes all the props that the `Button` component accepts so
+ * the main use case might be creating a functionality wrapper for the `Button`
+ * component, but passes all props down as normal.
  */
 export interface ButtonProps extends ButtonThemeProps, ButtonHTMLAttributes<HTMLButtonElement>, Omit<InteractionStatesOptions<HTMLButtonElement>, "disableSpacebarClick"> {
     /**
-     * The button's type attribute. This is set to "button" by default so that forms are not
-     * accidentally submitted when this prop is omitted since buttons without a type attribute work
-     * as submit by default.
+     * The button's type attribute. This is set to "button" by default so that
+     * forms are not accidentally submitted when this prop is omitted since
+     * buttons without a type attribute work as submit by default.
      */
     type?: "button" | "reset" | "submit";
     /**
-     * Any children to render within the button. This will normally just be text or an icon.
+     * Any children to render within the button. This will normally just be text
+     * or an icon.
      *
-     * Please note that it is considered invalid html to have a `<div>` as a descendant of a
-     * `<button>`. You can fix this by enabling the `asDiv` prop.
+     * Please note that it is considered invalid html to have a `<div>` as a
+     * descendant of a `<button>`.
      */
     children?: ReactNode;
 }
-declare const _default: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
-export default _default;
+declare const ForwardedButton: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
+export default ForwardedButton;

types/buttonThemeClassNames.d.ts

@@ -6,44 +6,47 @@ /**
 /**
- * One of the valid material design default button themes that can be used. This will
- * update the general look and feel by updating the colors within the button while the
- * `ButtonThemeType` will update the borders or box shadow.
+ * One of the valid material design default button themes that can be used. This
+ * will update the general look and feel by updating the colors within the
+ * button while the `ButtonThemeType` will update the borders or box shadow.
  */
 export declare type ButtonTheme = "clear" | "primary" | "secondary" | "warning" | "error";
 /**
- * One of the valid material design "themed" button types that can be used. This will
- * update the general look and feel by adding borders or box shadow to the button while
- * the `ButtonTheme` will update the colors.
+ * One of the valid material design "themed" button types that can be used. This
+ * will update the general look and feel by adding borders or box shadow to the
+ * button while the `ButtonTheme` will update the colors.
  */
 export declare type ButtonThemeType = "flat" | "outline" | "contained";
 /**
- * This is an interface of all the button's customizable theme props. This is mainly used if you
- * want to add a button theme to another component and have it configurable via props.
+ * This is an interface of all the button's customizable theme props. This is
+ * mainly used if you want to add a button theme to another component and have
+ * it configurable via props.
  */
 export interface ButtonThemeProps {
     /**
-     * An optional className to also apply to the button for additional theming and styling. This
-     * will be merged with the `Button.theme` class name styles.
+     * An optional className to also apply to the button for additional theming
+     * and styling. This will be merged with the `Button.theme` class name styles.
      */
     className?: string;
     /**
-     * Enabling this prop will apply the disabled styles to a `Button`. When this is also applied
-     * to the button component, the button will be updated so that it can no longer be interacted
-     * with.
+     * Enabling this prop will apply the disabled styles to a `Button`. When this
+     * is also applied to the button component, the button will be updated so that
+     * it can no longer be interacted with.
      */
     disabled?: boolean;
     /**
-     * This is the specific material design button type to use. This can either be set to "text" or
-     * "icon". When this is set to "text", the styles applied will make buttons with just text or text
-     * with icons render nicely. When this is set to "icon", the styles applied will make icon only
-     * buttons render nicely.
+     * This is the specific material design button type to use. This can either be
+     * set to "text" or "icon". When this is set to "text", the styles applied
+     * will make buttons with just text or text with icons render nicely. When
+     * this is set to "icon", the styles applied will make icon only buttons
+     * render nicely.
      */
     buttonType?: ButtonType;
     /**
-     * The material design theme to apply to the button. The theme prop will update the look and feel
-     * of the button by applying different background and/or foreground colors.
+     * The material design theme to apply to the button. The theme prop will
+     * update the look and feel of the button by applying different background
+     * and/or foreground colors.
      */
     theme?: ButtonTheme;
     /**
-     * The material design theme type to apply. The themeTYpe prop will update the look and feel of
-     * the button by applying different border or box shadow.
+     * The material design theme type to apply. The themeTYpe prop will update the
+     * look and feel of the button by applying different border or box shadow.
      */
@@ -53,9 +56,10 @@ themeType?: ButtonThemeType;
 /**
- * Creates a button theme based on the button theming props. This is really just used so that
- * other elements like clickable `<div>`s or `<input type="file">` can look like buttons.
+ * Creates a button theme based on the button theming props. This is really just
+ * used so that other elements like clickable `<div>`s or `<input type="file">`
+ * can look like buttons.
  *
- * @param props An object containing the themeable button props to generate a button theme
- * className.
+ * @param props An object containing the themeable button props to generate a
+ * button theme className.
  * @return a string of class names to create an element with a button theme.
  */
 export default function buttonThemeClassNames(props: ButtonThemeProps): string;

types/UnstyledButton.d.ts

 import React, { ButtonHTMLAttributes } from "react";
 /**
- * The props for the unstyled button are just all the normal button html attributes
- * without the `type` since this component forces the `type="button"` value.
+ * The props for the unstyled button are just all the normal button html
+ * attributes without the `type` since this component forces the `type="button"`
+ * value.
  */
 export declare type UnstyledButtonProps = Omit<ButtonHTMLAttributes<HTMLButtonElement>, "type">;
-declare const _default: React.ForwardRefExoticComponent<Pick<React.ButtonHTMLAttributes<HTMLButtonElement>, "disabled" | "hidden" | "dir" | "form" | "slot" | "style" | "title" | "color" | "children" | "className" | "onScroll" | "value" | "onChange" | "onKeyDown" | "aria-label" | "aria-labelledby" | "onKeyUp" | "onMouseDown" | "onMouseUp" | "onMouseLeave" | "onClick" | "onTouchStart" | "onTouchMove" | "onTouchEnd" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDownCapture" | "onMouseEnter" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEndCapture" | "onTouchMoveCapture" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "name"> & React.RefAttributes<HTMLButtonElement>>;
-export default _default;
+declare const ForwardedUnstyledButton: React.ForwardRefExoticComponent<Pick<React.ButtonHTMLAttributes<HTMLButtonElement>, "disabled" | "hidden" | "dir" | "form" | "slot" | "style" | "title" | "color" | "children" | "className" | "onScroll" | "value" | "onChange" | "onKeyDown" | "aria-label" | "aria-labelledby" | "onKeyUp" | "onMouseDown" | "onMouseUp" | "onMouseLeave" | "onClick" | "onTouchStart" | "onTouchMove" | "onTouchEnd" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDownCapture" | "onMouseEnter" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEndCapture" | "onTouchMoveCapture" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "name"> & React.RefAttributes<HTMLButtonElement>>;
+export default ForwardedUnstyledButton;

No alert changes

Improved metrics

Total package byte prevSize

464385

increased by2.12%

Number of package files

51

increased by4.08%

Lines of code

1027

increased by2.6%

Dependency changes

• Updated@react-md/elevation@^2.0.0-alpha.13

• Updated@react-md/icon@^2.0.0-alpha.13

• Updated@react-md/states@^2.0.0-alpha.13

• Updated@react-md/theme@^2.0.0-alpha.13

• Updated@react-md/typography@^2.0.0-alpha.13

• Updated@react-md/utils@^2.0.0-alpha.13