ソースを参照

Add RMWC icon button components

Tatiana Inama 6 年 前
コミット
700e4f3aa9

+ 7 - 10
recipes/src/components/Button/index.tsx

@@ -1,11 +1,10 @@
 import React, { ReactElement } from 'react';
 import Icon from 'components/Icon';
-import IconButton from '@material/react-icon-button';
+import { IconButton } from '@rmwc/icon-button';
 
 import classnames from 'classnames';
 
-import '@material/react-button/dist/button.css';
-import '@material/react-icon-button/dist/icon-button.css'
+import '@rmwc/icon-button/styles';
 
 import './styles.scss';
 
@@ -40,19 +39,17 @@ export default function CBKButton(props: CBKButtonProps) {
   if (props.icon) {
     return (
       <IconButton
+        icon={
+          <Icon material icon={props.icon}/>
+        }
         onClick={props.onClick}
-        unelevated={props.unelevated}
-        raised={props.raised}
-        outlined={props.outlined}
         className={classnames({
           'btn-small': props.small,
         }, props.className)}
-        type={props.type || 'button'}
         disabled={props.disabled}
         style={props.style}
-      >
-        <Icon material icon={props.icon}/>
-      </IconButton>
+        ripple
+      />
     );
   } else {
     return (

+ 2 - 2
recipes/src/components/Icon/index.tsx

@@ -1,9 +1,9 @@
 import React from 'react';
 import Svgs from 'svgs';
 import ReactSVG from 'react-svg';
-import MaterialIcon from '@material/react-material-icon';
+import { Icon as MaterialIcon } from '@rmwc/icon';
 
-import '@material/react-material-icon/dist/material-icon.css';
+import '@rmwc/icon/styles';
 
 export type IconProps = {
   icon: string,