-/**\r
- * ============LICENSE_START========================================================================\r
- * ONAP : ccsdk feature sdnr wt odlux\r
- * =================================================================================================\r
- * Copyright (C) 2019 highstreet technologies GmbH Intellectual Property. All rights reserved.\r
- * =================================================================================================\r
- * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except\r
- * in compliance with the License. You may obtain a copy of the License at\r
- *\r
- * http://www.apache.org/licenses/LICENSE-2.0\r
- *\r
- * Unless required by applicable law or agreed to in writing, software distributed under the License\r
- * is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express\r
- * or implied. See the License for the specific language governing permissions and limitations under\r
- * the License.\r
- * ============LICENSE_END==========================================================================\r
- */\r
-import * as React from 'react';\r
-\r
-import { withStyles, Theme, WithStyles, createStyles } from '@material-ui/core/styles';\r
-\r
-import { ExpansionPanel, ExpansionPanelSummary, ExpansionPanelDetails, Typography, ExpansionPanelActions } from '@material-ui/core';\r
-\r
-import ExpandMoreIcon from '@material-ui/icons/ExpandMore';\r
-import { SvgIconProps } from '@material-ui/core/SvgIcon';\r
-\r
-const styles = (theme: Theme) => createStyles({\r
- accordion: {\r
- // background: theme.palette.secondary.dark,\r
- // color: theme.palette.primary.contrastText\r
- },\r
- detail: {\r
- // background: theme.palette.background.paper,\r
- // color: theme.palette.text.primary,\r
- position: "relative",\r
- display: 'flex',\r
- flexDirection: 'column'\r
- },\r
- text: {\r
- // color: theme.palette.common.white,\r
- // fontSize: "1rem"\r
- },\r
-});\r
-\r
-type PanalProps = WithStyles<typeof styles> & {\r
- activePanel: string | null,\r
- panelId: string,\r
- title: string,\r
- customActionButtons?: JSX.Element[];\r
- onToggle: (panelId: string | null) => void;\r
-}\r
-\r
-const PanelComponent: React.SFC<PanalProps> = (props) => {\r
- const { classes, activePanel, onToggle } = props;\r
- return (\r
- <ExpansionPanel className={classes.accordion} expanded={activePanel === props.panelId} onChange={() => onToggle(props.panelId)} >\r
- <ExpansionPanelSummary expandIcon={<ExpandMoreIcon />}>\r
- <Typography className={classes.text} >{props.title}</Typography>\r
- </ExpansionPanelSummary>\r
- <ExpansionPanelDetails className={classes.detail}>\r
- {props.children}\r
- </ExpansionPanelDetails>\r
- {props.customActionButtons\r
- ? <ExpansionPanelActions>\r
- {props.customActionButtons}\r
- </ExpansionPanelActions>\r
- : null}\r
- </ExpansionPanel>\r
- );\r
-};\r
-\r
-export const Panel = withStyles(styles)(PanelComponent);\r
+/**
+ * ============LICENSE_START========================================================================
+ * ONAP : ccsdk feature sdnr wt odlux
+ * =================================================================================================
+ * Copyright (C) 2019 highstreet technologies GmbH Intellectual Property. All rights reserved.
+ * =================================================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except
+ * in compliance with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under the License
+ * is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express
+ * or implied. See the License for the specific language governing permissions and limitations under
+ * the License.
+ * ============LICENSE_END==========================================================================
+ */
+import * as React from 'react';
+
+import { Theme } from '@mui/material/styles';
+
+import { WithStyles } from '@mui/styles';
+import withStyles from '@mui/styles/withStyles';
+import createStyles from '@mui/styles/createStyles';
+
+import { Accordion, AccordionSummary, AccordionDetails, Typography, AccordionActions } from '@mui/material';
+
+import ExpandMoreIcon from '@mui/icons-material/ExpandMore';
+import { SvgIconProps } from '@mui/material/SvgIcon';
+
+const styles = (theme: Theme) => createStyles({
+ accordion: {
+ // background: theme.palette.secondary.dark,
+ // color: theme.palette.primary.contrastText
+ },
+ detail: {
+ // background: theme.palette.background.paper,
+ // color: theme.palette.text.primary,
+ position: "relative",
+ flexDirection: 'column'
+ },
+ text: {
+ // color: theme.palette.common.white,
+ // fontSize: "1rem"
+ },
+});
+
+type PanalProps = WithStyles<typeof styles> & {
+ activePanel: string | null,
+ panelId: string,
+ title: string,
+ customActionButtons?: JSX.Element[];
+ onToggle: (panelId: string | null) => void;
+}
+
+const PanelComponent: React.SFC<PanalProps> = (props) => {
+ const { classes, activePanel, onToggle } = props;
+ return (
+ <Accordion className={classes.accordion} expanded={activePanel === props.panelId} onChange={() => onToggle(props.panelId)} >
+ <AccordionSummary expandIcon={<ExpandMoreIcon />}>
+ <Typography className={classes.text} >{props.title}</Typography>
+ </AccordionSummary>
+ <AccordionDetails className={classes.detail}>
+ {props.children}
+ </AccordionDetails>
+ {props.customActionButtons
+ ? <AccordionActions>
+ {props.customActionButtons}
+ </AccordionActions>
+ : null}
+ </Accordion>
+ );
+};
+
+export const Panel = withStyles(styles)(PanelComponent);
export default Panel;
\ No newline at end of file
Code Review / ccsdk / features.git / blobdiff