How to use @react-md/button - 4 common examples

To help you get started, we’ve selected a few @react-md/button examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github mlaursen / react-md / packages / form / src / file-input / FileInput.tsx View on Github external
const { id, disabled } = props;
  const icon = useIcon("download", propIcon);

  const { ripples, className, handlers } = useInteractionStates({
    handlers: {
      onKeyDown,
      onKeyUp,
      onMouseDown,
      onMouseUp,
      onMouseLeave,
      onClick,
      onTouchStart,
      onTouchMove,
      onTouchEnd,
    },
    className: buttonThemeClassNames({
      theme,
      themeType,
      buttonType,
      disabled,
      className: propClassName,
    }),
    // pressent enter or space would trigger two click events otherwise.
    disableEnterClick: true,
  });

  let content: ReactNode = icon;
  if (disableIconSpacing || (children && !icon)) {
    content = (
      
        {!iconAfter && icon}
        {children}
github mlaursen / react-md / packages / examples / src / components / menus / MenuButton.tsx View on Github external
> = allProps => {
  const { theme: t, themeType, buttonType, className, ...props } = allProps;
  return (
    
  );
};
github mlaursen / react-md / packages / documentation / components / LinkButton.tsx View on Github external
const LinkButton: FC = providedProps => {
  const {
    className: propClassName,
    theme,
    buttonType,
    themeType,
    portal,
    portalInto,
    portalIntoId,
    children,
    ...props
  } = providedProps;

  const { ripples, className, handlers } = useInteractionStates({
    handlers: props,
    className: buttonThemeClassNames(providedProps),
  });

  return (
    
      {ripples}
      {children}
github mlaursen / react-md / packages / documentation / src / components / LinkButton.tsx View on Github external
const LinkButton: FC = providedProps => {
  const {
    className: _className,
    theme,
    buttonType,
    themeType,
    children,
    ...props
  } = providedProps;

  const { ripples, className, handlers } = useInteractionStates({
    handlers: props,
    className: buttonThemeClassNames(providedProps),
  });

  return (
    
      {ripples}
      {children}

@react-md/button

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.

MIT
Latest version published 4 months ago

Package Health Score

70 / 100
Full package analysis

Popular @react-md/button functions