forked from sombochea/verdaccio-ui
fix: introduced forwardRef (#164)
This commit is contained in:
parent
9eb698f7e1
commit
909a8d9fb8
@ -2,7 +2,6 @@ import React, { SyntheticEvent, Component, Fragment, ReactElement } from 'react'
|
||||
import { Link } from 'react-router-dom';
|
||||
import { css } from 'emotion';
|
||||
|
||||
import Button from '@material-ui/core/Button';
|
||||
import MenuItem from '@material-ui/core/MenuItem';
|
||||
import Menu from '@material-ui/core/Menu';
|
||||
import Info from '@material-ui/icons/Info';
|
||||
@ -19,6 +18,7 @@ import RegistryInfoContent from '../RegistryInfoContent/RegistryInfoContent';
|
||||
|
||||
import IconButton from '../../muiComponents/IconButton';
|
||||
import Tooltip from '../../muiComponents/Tooltip';
|
||||
import Button from '../../muiComponents/Button';
|
||||
|
||||
import {
|
||||
Greetings,
|
||||
|
@ -1,4 +1,3 @@
|
||||
import Button from '@material-ui/core/Button';
|
||||
import CardActions from '@material-ui/core/CardActions';
|
||||
import CardContent from '@material-ui/core/CardContent';
|
||||
import Typography from '@material-ui/core/Typography';
|
||||
@ -6,6 +5,7 @@ import React, { Fragment } from 'react';
|
||||
|
||||
import { getRegistryURL } from '../../utils/url';
|
||||
import CopyToClipBoard from '../CopyToClipBoard';
|
||||
import Button from '../../muiComponents/Button';
|
||||
|
||||
import { CardStyled as Card, HelpTitle } from './styles';
|
||||
|
||||
@ -35,7 +35,7 @@ const Help: React.FC = () => {
|
||||
<Typography variant="body2">{'3. Refresh this page.'}</Typography>
|
||||
</CardContent>
|
||||
<CardActions>
|
||||
<Button color="primary" href="https://verdaccio.org/docs/en/installation" size="small" target="_blank">
|
||||
<Button color="primary" href="https://verdaccio.org/docs/en/installation" size="small">
|
||||
{'Learn More'}
|
||||
</Button>
|
||||
</CardActions>
|
||||
|
@ -1,3 +1,3 @@
|
||||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`<Help /> component should render the component in default state 1`] = `"<div class=\\"MuiPaper-root MuiPaper-elevation1 MuiCard-root css-ryznli e1wgaou60 MuiPaper-rounded\\" id=\\"help-card\\"><div class=\\"MuiCardContent-root\\"><h2 class=\\"MuiTypography-root MuiTypography-h5 MuiTypography-gutterBottom\\" id=\\"help-card__title\\">No Package Published Yet.</h2><p class=\\"MuiTypography-root css-zg2fwz e1wgaou61 MuiTypography-body1 MuiTypography-colorTextSecondary MuiTypography-gutterBottom\\">To publish your first package just:</p><p class=\\"MuiTypography-root MuiTypography-body1\\">1. Login</p><div class=\\"css-1mta3t8 eb8w2fo0\\"><span class=\\"css-1m8aenu eb8w2fo1\\">npm adduser --registry http://localhost</span><button class=\\"MuiButtonBase-root MuiIconButton-root css-0 eb8w2fo2\\" tabindex=\\"0\\" type=\\"button\\" title=\\"Copy to Clipboard\\"><span class=\\"MuiIconButton-label\\"><svg class=\\"MuiSvgIcon-root\\" focusable=\\"false\\" viewBox=\\"0 0 24 24\\" aria-hidden=\\"true\\" role=\\"presentation\\"><path d=\\"M16 1H4c-1.1 0-2 .9-2 2v14h2V3h12V1zm-1 4l6 6v10c0 1.1-.9 2-2 2H7.99C6.89 23 6 22.1 6 21l.01-14c0-1.1.89-2 1.99-2h7zm-1 7h5.5L14 6.5V12z\\"></path></svg></span><span class=\\"MuiTouchRipple-root\\"></span></button></div><p class=\\"MuiTypography-root MuiTypography-body1\\">2. Publish</p><div class=\\"css-1mta3t8 eb8w2fo0\\"><span class=\\"css-1m8aenu eb8w2fo1\\">npm publish --registry http://localhost</span><button class=\\"MuiButtonBase-root MuiIconButton-root css-0 eb8w2fo2\\" tabindex=\\"0\\" type=\\"button\\" title=\\"Copy to Clipboard\\"><span class=\\"MuiIconButton-label\\"><svg class=\\"MuiSvgIcon-root\\" focusable=\\"false\\" viewBox=\\"0 0 24 24\\" aria-hidden=\\"true\\" role=\\"presentation\\"><path d=\\"M16 1H4c-1.1 0-2 .9-2 2v14h2V3h12V1zm-1 4l6 6v10c0 1.1-.9 2-2 2H7.99C6.89 23 6 22.1 6 21l.01-14c0-1.1.89-2 1.99-2h7zm-1 7h5.5L14 6.5V12z\\"></path></svg></span><span class=\\"MuiTouchRipple-root\\"></span></button></div><p class=\\"MuiTypography-root MuiTypography-body2\\">3. Refresh this page.</p></div><div class=\\"MuiCardActions-root MuiCardActions-spacing\\"><a class=\\"MuiButtonBase-root MuiButton-root MuiButton-text MuiButton-textPrimary MuiButton-sizeSmall\\" tabindex=\\"0\\" aria-disabled=\\"false\\" href=\\"https://verdaccio.org/docs/en/installation\\" target=\\"_blank\\"><span class=\\"MuiButton-label\\">Learn More</span><span class=\\"MuiTouchRipple-root\\"></span></a></div></div>"`;
|
||||
exports[`<Help /> component should render the component in default state 1`] = `"<div class=\\"MuiPaper-root MuiPaper-elevation1 MuiCard-root css-ryznli e1wgaou60 MuiPaper-rounded\\" id=\\"help-card\\"><div class=\\"MuiCardContent-root\\"><h2 class=\\"MuiTypography-root MuiTypography-h5 MuiTypography-gutterBottom\\" id=\\"help-card__title\\">No Package Published Yet.</h2><p class=\\"MuiTypography-root css-zg2fwz e1wgaou61 MuiTypography-body1 MuiTypography-colorTextSecondary MuiTypography-gutterBottom\\">To publish your first package just:</p><p class=\\"MuiTypography-root MuiTypography-body1\\">1. Login</p><div class=\\"css-1mta3t8 eb8w2fo0\\"><span class=\\"css-1m8aenu eb8w2fo1\\">npm adduser --registry http://localhost</span><button class=\\"MuiButtonBase-root MuiIconButton-root css-0 eb8w2fo2\\" tabindex=\\"0\\" type=\\"button\\" title=\\"Copy to Clipboard\\"><span class=\\"MuiIconButton-label\\"><svg class=\\"MuiSvgIcon-root\\" focusable=\\"false\\" viewBox=\\"0 0 24 24\\" aria-hidden=\\"true\\" role=\\"presentation\\"><path d=\\"M16 1H4c-1.1 0-2 .9-2 2v14h2V3h12V1zm-1 4l6 6v10c0 1.1-.9 2-2 2H7.99C6.89 23 6 22.1 6 21l.01-14c0-1.1.89-2 1.99-2h7zm-1 7h5.5L14 6.5V12z\\"></path></svg></span><span class=\\"MuiTouchRipple-root\\"></span></button></div><p class=\\"MuiTypography-root MuiTypography-body1\\">2. Publish</p><div class=\\"css-1mta3t8 eb8w2fo0\\"><span class=\\"css-1m8aenu eb8w2fo1\\">npm publish --registry http://localhost</span><button class=\\"MuiButtonBase-root MuiIconButton-root css-0 eb8w2fo2\\" tabindex=\\"0\\" type=\\"button\\" title=\\"Copy to Clipboard\\"><span class=\\"MuiIconButton-label\\"><svg class=\\"MuiSvgIcon-root\\" focusable=\\"false\\" viewBox=\\"0 0 24 24\\" aria-hidden=\\"true\\" role=\\"presentation\\"><path d=\\"M16 1H4c-1.1 0-2 .9-2 2v14h2V3h12V1zm-1 4l6 6v10c0 1.1-.9 2-2 2H7.99C6.89 23 6 22.1 6 21l.01-14c0-1.1.89-2 1.99-2h7zm-1 7h5.5L14 6.5V12z\\"></path></svg></span><span class=\\"MuiTouchRipple-root\\"></span></button></div><p class=\\"MuiTypography-root MuiTypography-body2\\">3. Refresh this page.</p></div><div class=\\"MuiCardActions-root MuiCardActions-spacing\\"><a class=\\"MuiButtonBase-root MuiButton-root MuiButton-text MuiButton-textPrimary MuiButton-sizeSmall\\" tabindex=\\"0\\" aria-disabled=\\"false\\" href=\\"https://verdaccio.org/docs/en/installation\\"><span class=\\"MuiButton-label\\">Learn More</span><span class=\\"MuiTouchRipple-root\\"></span></a></div></div>"`;
|
||||
|
@ -1,5 +1,4 @@
|
||||
import React, { Component } from 'react';
|
||||
import Button from '@material-ui/core/Button';
|
||||
import DialogTitle from '@material-ui/core/DialogTitle';
|
||||
import Dialog from '@material-ui/core/Dialog';
|
||||
import DialogActions from '@material-ui/core/DialogActions';
|
||||
@ -13,6 +12,7 @@ import FormHelperText from '@material-ui/core/FormHelperText';
|
||||
import { css } from 'emotion';
|
||||
|
||||
import * as classes from './styles';
|
||||
import Button from '../../muiComponents/Button';
|
||||
|
||||
interface FormFields {
|
||||
required: boolean;
|
||||
|
@ -1,10 +1,10 @@
|
||||
import React from 'react';
|
||||
import Dialog from '@material-ui/core/Dialog';
|
||||
import DialogActions from '@material-ui/core/DialogActions';
|
||||
import Button from '@material-ui/core/Button';
|
||||
import { Title, Content } from './styles';
|
||||
|
||||
import { Props } from './types';
|
||||
import Button from '../../muiComponents/Button';
|
||||
|
||||
const LABEL = 'CLOSE';
|
||||
|
||||
|
12
src/muiComponents/Button/Button.tsx
Normal file
12
src/muiComponents/Button/Button.tsx
Normal file
@ -0,0 +1,12 @@
|
||||
import React, { forwardRef } from 'react';
|
||||
import { default as MaterialUIButton, ButtonProps } from '@material-ui/core/Button';
|
||||
|
||||
type ButtonRef = HTMLElementTagNameMap['button'];
|
||||
|
||||
/* eslint-disable verdaccio/jsx-spread */
|
||||
// eslint-disable-next-line react/display-name
|
||||
const Button = forwardRef<ButtonRef, ButtonProps>(function Button(props, ref) {
|
||||
return <MaterialUIButton {...props} ref={ref} />;
|
||||
});
|
||||
|
||||
export default Button;
|
1
src/muiComponents/Button/index.ts
Normal file
1
src/muiComponents/Button/index.ts
Normal file
@ -0,0 +1 @@
|
||||
export { default } from './Button';
|
Loading…
Reference in New Issue
Block a user