diff --git a/.github/label-commenter-config.yml b/.github/label-commenter-config.yml
new file mode 100644
index 00000000..0a97e9b5
--- /dev/null
+++ b/.github/label-commenter-config.yml
@@ -0,0 +1,55 @@
+comment:
+ # header: "Please note the following requirement:"
+ footer: "\
+ ---\n\n
+ > Be sure to [join the community](https://slack.meshery.io), if you haven't yet and please leave a :star: [star on the project](../stargazers) :smile:
+ "
+
+labels:
+ - name: issue/design required
+ labeled:
+ issue:
+ body: This issue has been labeled with 'design-required'. Note that prior to commencing on implementation, a design specification needs to be created and reviewed for approval. See [Creating a Functional Specification](https://docs.google.com/document/d/1RP3IWLc-MiQS-QYasqCoVuCH7--G87p5ezE5f_nOzB8/edit?usp=sharing) to create a design spec.
+ action: open
+ - name: issue/remind
+ labeled:
+ issue:
+ body: Checking in... it has been awhile since we've heard from you on this issue. Are you still working on it? Please let us know and please don't hesitate to contact a [MeshMate](https://layer5.io/community/meshmates/) or any other [community member](https://layer5.io/community/members) for assistance.
+ action: open
+ pr:
+ body: Checking in... it has been awhile since we've heard from you on this issue. Are you still working on it? Please let us know and please don't hesitate to contact a [MeshMate](https://layer5.io/community/meshmates/) or any other [community member](https://layer5.io/community/members) for assistance.
+ action: open
+ - name: issue/dco
+ labeled:
+ issue:
+ body: "🚨 Alert! Git Police! We couldn’t help but notice that one or more of your commits is missing a sign-off. _A what?_ A commit sign-off (your email address).\n\n
+ To amend the commits in this PR with your signoff using the instructions provided in the DCO check. \n\n
+ To configure your dev environment to automatically signoff on your commits in the future, see [these instructions](https://github.com/meshery/meshery/blob/master/CONTRIBUTING.md#signing-off-on-commits-developer-certificate-of-origin)."
+ action: open
+ pr:
+ body: "🚨 Alert! Git Police! We couldn’t help but notice that one or more of your commits is missing a sign-off. _A what?_ A commit sign-off (your email address).\n\n
+ To amend the commits in this PR with your signoff using the instructions provided in the DCO check. \n\n
+ To configure your dev environment to automatically signoff on your commits in the future, see [these instructions](https://github.com/meshery/meshery/blob/master/CONTRIBUTING.md#signing-off-on-commits-developer-certificate-of-origin)."
+ action: open
+ - name: component/ui
+ labeled:
+ issue:
+ body: This issue has been labeled with 'component/ui'. 🧰 Here are docs on [Contributing to Meshery UI](https://docs.meshery.io/project/contributing/contributing-ui). 🎨 Here is the [Meshery UI Figma File](https://www.figma.com/file/SMP3zxOjZztdOLtgN4dS2W/Meshery-UI?node-id=4%3A0) File. Lastly, here are docs on [Contributing to Meshery's End-to-End Tests Using Cypress](https://docs.meshery.io/project/contributing/contributing-cypress).
+ action: open
+ pr:
+ body: This PR has been labeled with 'component/ui'. 🧰 Here are docs on [Contributing to Meshery UI](https://docs.meshery.io/project/contributing/contributing-ui). 🎨 Here is the [Meshery UI Figma File](https://www.figma.com/file/SMP3zxOjZztdOLtgN4dS2W/Meshery-UI?node-id=4%3A0) File. Lastly, here are docs on [Contributing to Meshery's End-to-End Tests Using Cypress](https://docs.meshery.io/project/contributing/contributing-cypress)
+ action: open
+ - name: component/mesheryctl
+ labeled:
+ issue:
+ body: This issue has been labeled with 'component/mesheryctl'. Note that after making changes you need to update it in the [mesheryctl command tracker](https://docs.google.com/spreadsheets/d/1q63sIGAuCnIeDs8PeM-0BAkNj8BBgPUXhLbe1Y-318o/edit#gid=0) spreadsheet.
+ action: open
+ pr:
+ body: This PR has been labeled with 'component/mesheryctl'. Note that after making changes you need to update it in the [mesheryctl command tracker](https://docs.google.com/spreadsheets/d/1q63sIGAuCnIeDs8PeM-0BAkNj8BBgPUXhLbe1Y-318o/edit#gid=0) spreadsheet.
+ action: open
+ # pr:
+ # body: Hi, please note that this issue will need an approved design specification before implementation proceeds. See [Creating a Functional Specification](https://docs.google.com/document/d/1RP3IWLc-MiQS-QYasqCoVuCH7--G87p5ezE5f_nOzB8/edit?usp=sharing) to create a design spec.
+ # action: open
+
+
+
diff --git a/.github/workflows/label-commenter.yml b/.github/workflows/label-commenter.yml
new file mode 100644
index 00000000..2ad4e1cc
--- /dev/null
+++ b/.github/workflows/label-commenter.yml
@@ -0,0 +1,29 @@
+name: Label Commenter
+
+on:
+ issues:
+ types:
+ - labeled
+
+ pull_request_target:
+ types:
+ - labeled
+
+permissions:
+ contents: read
+ issues: write
+ pull-requests: write
+
+jobs:
+ comment:
+ runs-on: ubuntu-22.04
+ steps:
+ - name: Checkout repo 🛎️
+ uses: actions/checkout@master
+ with:
+ ref: master # Set your default branch
+ env:
+ GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+ - name: Label Commenter
+ uses: peaceiris/actions-label-commenter@v1.10.0
+
diff --git a/README.md b/README.md
index c6f5e807..405eacc6 100644
--- a/README.md
+++ b/README.md
@@ -72,7 +72,7 @@ attach sistent to your project:
## Join the Layer5 community!
Layer5 Community Welcome Guide for a tour of resources available to you and jump into our Slack !
+Our projects are community-built and welcome collaboration. 👍 Be sure to see the Layer5 Community Welcome Guide for a tour of resources available to you and jump into our Slack !
, index: number) => void;
+}
+
+interface ActionButtonProps {
+ defaultActionClick: () => void;
+ options: Option[];
+ label: string;
+}
+
+export default function ActionButton({
+ defaultActionClick,
+ options,
+ label
+}: ActionButtonProps): JSX.Element {
+ const [open, setOpen] = React.useState(false);
+ const [anchorEl, setAnchorEl] = React.useState(null);
+ const handleMenuItemClick = () => {
+ setOpen(false);
+ };
+
+ const handleToggle = (event: React.MouseEvent) => {
+ event.stopPropagation();
+ setAnchorEl(event.currentTarget);
+ setOpen((prevOpen) => !prevOpen);
+ };
+
+ const handleClose = () => {
+ setAnchorEl(null);
+ setOpen(false);
+ };
+
+ return (
+
+
+
+ {label}
+
+
+
+
+
+
+
+
+
+
+
+
+ );
+}
diff --git a/src/custom/ActionButton/index.tsx b/src/custom/ActionButton/index.tsx
new file mode 100644
index 00000000..b06dacf4
--- /dev/null
+++ b/src/custom/ActionButton/index.tsx
@@ -0,0 +1,3 @@
+import ActionButton from './ActionButton';
+
+export { ActionButton };
diff --git a/src/custom/CustomTooltip/customTooltip.tsx b/src/custom/CustomTooltip/customTooltip.tsx
index b8cc173a..03ba5d92 100644
--- a/src/custom/CustomTooltip/customTooltip.tsx
+++ b/src/custom/CustomTooltip/customTooltip.tsx
@@ -6,6 +6,7 @@ type CustomTooltipProps = {
title: string | React.ReactNode | JSX.Element;
onClick?: (event: React.MouseEvent) => void;
children: React.ReactNode;
+ fontSize?: string;
} & Omit;
function CustomTooltip({
@@ -13,6 +14,7 @@ function CustomTooltip({
onClick,
placement,
children,
+ fontSize = '1rem',
...props
}: CustomTooltipProps): JSX.Element {
return (
@@ -22,10 +24,9 @@ function CustomTooltip({
sx: {
background: CHARCOAL,
color: WHITE,
- fontSize: '0.75rem',
+ fontSize: { fontSize },
borderRadius: '0.9375rem',
- padding: '0.9rem',
- zIndex: '999999'
+ padding: '0.9rem'
}
},
popper: {
@@ -36,8 +37,8 @@ function CustomTooltip({
}}
title={title}
placement={placement}
- onClick={onClick}
arrow
+ onClick={onClick}
{...props}
>
{children}
diff --git a/src/custom/Feedback/FeedbackButton.tsx b/src/custom/Feedback/FeedbackButton.tsx
index f8c2b666..fde59a90 100644
--- a/src/custom/Feedback/FeedbackButton.tsx
+++ b/src/custom/Feedback/FeedbackButton.tsx
@@ -1,5 +1,5 @@
import Typography from '@mui/material/Typography';
-import React, { CSSProperties, useRef, useState } from 'react';
+import React, { CSSProperties, useState } from 'react';
import {
CalenderIcon,
CloseIcon,
@@ -107,21 +107,23 @@ interface FeedbackComponentProps {
| 'right-top'
| 'right-middle'
| 'right-bottom';
+ defaultMessage?: string;
+ defaultOpen?: boolean;
}
const FeedbackComponent: React.FC = ({
onSubmit,
containerStyles,
feedbackOptionStyles,
- renderPosition
+ renderPosition,
+ defaultMessage = undefined,
+ defaultOpen = false
}) => {
- const [isOpen, setIsOpen] = useState(false);
+ const [isOpen, setIsOpen] = useState(defaultOpen);
const [submitted, setSubmitted] = useState(false);
- const [category, setCategory] = useState();
- const [messageValue, setMessageValue] = useState();
- const feedbackTextRef = useRef(null);
- const [isChecked, setIsChecked] = useState(false);
-
+ const [category, setCategory] = useState(feedbackData[0]);
+ const [messageValue, setMessageValue] = useState(defaultMessage);
+ const [isChecked, setIsChecked] = useState(!!defaultMessage);
const handleCheckboxChange = (event: React.ChangeEvent) => {
setIsChecked(event.target.checked);
};
@@ -229,7 +231,6 @@ const FeedbackComponent: React.FC = ({
onChange={(e) => {
setMessageValue(e.target.value);
}}
- ref={feedbackTextRef}
required
placeholder={category.placeholder}
rows={5}
diff --git a/src/custom/Feedback/style.tsx b/src/custom/Feedback/style.tsx
index 5a9e4bfe..36d6484d 100644
--- a/src/custom/Feedback/style.tsx
+++ b/src/custom/Feedback/style.tsx
@@ -268,10 +268,12 @@ export const FeedbackOptionButton = styled(Button)(({ them
? SNOW_WHITE
: SNOW_WHITE,
fill: isOpen ? (theme.palette.mode === 'dark' ? CULTURED : DARK_PRIMARY_COLOR) : CULTURED,
+ stroke: isOpen ? SNOW_WHITE : KEPPEL,
'&:hover': {
color: theme.palette.mode === 'dark' ? SNOW_WHITE : BLACK,
fill: theme.palette.mode === 'dark' ? CULTURED : DARK_PRIMARY_COLOR,
- backgroundColor: WHITE
+ backgroundColor: WHITE,
+ stroke: SNOW_WHITE
}
}));
diff --git a/src/custom/FlipCard/FlipCard.tsx b/src/custom/FlipCard/FlipCard.tsx
index 3d39607a..7ecceaa0 100644
--- a/src/custom/FlipCard/FlipCard.tsx
+++ b/src/custom/FlipCard/FlipCard.tsx
@@ -1,83 +1,94 @@
+import { styled } from '@mui/material';
import React from 'react';
+import { BUTTON_MODAL_DARK, WHITE } from '../../theme/colors/colors';
-/**
- * Wrapper component for flip cards.
- *
- * @param {Object} props - The component props.
- * @param {Object} props.frontComponents - The components of the card front.
- * @param {string} props.backComponents - The components of the card back.
- * @param {Boolean} props.disableFlip - The card can be flip or not.
- *
- */
+export type FlipCardProps = {
+ duration?: number;
+ onClick?: () => void;
+ onShow?: () => void;
+ children: [React.ReactNode, React.ReactNode];
+};
-export interface FlipCardProps {
- frontComponents: JSX.Element;
- backComponents?: JSX.Element;
- disableFlip?: boolean;
+function GetChild(children: [React.ReactNode, React.ReactNode], key: number) {
+ if (!children) throw Error('FlipCard requires exactly two child components');
+ if (children.length != 2) throw Error('FlipCard requires exactly two child components');
+
+ return children[key];
}
-function FlipCard({ frontComponents, backComponents, disableFlip }: FlipCardProps): JSX.Element {
- const [isFlipped, setIsFlipped] = React.useState(false);
+const Card = styled('div')(({ theme }) => ({
+ height: '100%',
+ backgroundColor: 'transparent',
+ perspective: theme.spacing(125)
+}));
+
+const InnerCard = styled('div')(({ theme }) => ({
+ padding: theme.spacing(2),
+ borderRadius: theme.spacing(1),
+ transformStyle: 'preserve-3d',
+ boxShadow: '0 4px 8px 0 rgba(0,0,0,0.2)',
+ backgroundColor: theme.palette.mode === 'dark' ? BUTTON_MODAL_DARK : WHITE,
+ cursor: 'pointer',
+ transformOrigin: '50% 50% 10%'
+}));
+
+const FrontContent = styled('div')({
+ backfaceVisibility: 'hidden'
+});
+
+const BackContent = styled('div')({
+ backfaceVisibility: 'hidden',
+ transform: 'scale(-1, 1)',
+ wordBreak: 'break-word'
+});
+
+export function FlipCard({ duration = 500, onClick, onShow, children }: FlipCardProps) {
+ const [flipped, setFlipped] = React.useState(false);
+ const [activeBack, setActiveBack] = React.useState(false);
- const handleFlip = () => {
- if (!disableFlip) {
- setIsFlipped(!isFlipped);
- }
- };
+ const timeout = React.useRef(null);
+
+ const Front = GetChild(children, 0);
+ const Back = GetChild(children, 1);
+
+ React.useEffect(() => {
+ // This function makes sure that the inner content of the card disappears roughly
+ // after 30 deg rotation has already occured. It will ensure that the user doesn't gets
+ // a "blank" card while the card is rotating
+ //
+ // This guarantee can be offered because of two main reasons:
+ // 1. In sufficiently modern browsers JS and CSS are handled in different threads
+ // hence ones execution doesn't blocks another.
+ // 2. setTimeout will put its callback at the end of current context's end hence ensuring
+ // this callback doesn't gets blocked by another JS process.
+
+ if (timeout.current) clearTimeout(timeout.current);
+
+ timeout.current = setTimeout(() => {
+ setActiveBack(flipped);
+ }, duration / 6);
+ }, [flipped, duration]);
return (
- <>
- {
+ setFlipped((flipped) => !flipped);
+ onClick && onClick();
+ onShow && onShow();
+ }}
+ >
+
-
-
- {frontComponents}
-
-
- {backComponents}
-
-
{React.isValidElement(Front) ? Front : null}
+ ) : (
+ {React.isValidElement(Back) ? Back : null}
+ )}
+
+
);
}
-
-export default FlipCard;
diff --git a/src/custom/FlipCard/index.tsx b/src/custom/FlipCard/index.tsx
index 8916a26a..a504789f 100644
--- a/src/custom/FlipCard/index.tsx
+++ b/src/custom/FlipCard/index.tsx
@@ -1,3 +1,4 @@
-import FlipCard from './FlipCard';
+import { FlipCard, FlipCardProps } from './FlipCard';
export { FlipCard };
+export type { FlipCardProps };
diff --git a/src/custom/index.tsx b/src/custom/index.tsx
index 08660155..75e5077d 100644
--- a/src/custom/index.tsx
+++ b/src/custom/index.tsx
@@ -1,3 +1,5 @@
+
+import { ActionButton } from './ActionButton';
import CatalogFilter, { CatalogFilterProps } from './CatalogFilter/CatalogFilter';
import { ConnectionChip } from './ConnectionChip';
import {
@@ -21,7 +23,7 @@ import {
withSuppressedErrorBoundary
} from './ErrorBoundary';
import { FeedbackButton } from './Feedback';
-import { FlipCard } from './FlipCard';
+import { FlipCard, FlipCardProps } from './FlipCard';
import { useWindowDimensions } from './Helpers/Dimension';
import { useNotificationHandler } from './Helpers/Notification';
import { ModalCard } from './ModalCard';
@@ -34,6 +36,7 @@ import UniversalFilter, { UniversalFilterProps } from './UniversalFilter';
export { StyledChartDialog } from './ChartDialog';
export { StyledSearchBar } from './StyledSearchBar';
export {
+ ActionButton,
CatalogFilter,
ConnectionChip,
CustomColumnVisibilityControl,
@@ -63,6 +66,7 @@ export type {
CustomColumn,
CustomColumnVisibilityControlProps,
CustomDialogProps,
+ FlipCardProps,
IPopperListener,
ResponsiveDataTableProps,
SearchBarProps,
diff --git a/src/icons/Calender/CalenderIcon.tsx b/src/icons/Calender/CalenderIcon.tsx
index ca0cf326..5b04635c 100644
--- a/src/icons/Calender/CalenderIcon.tsx
+++ b/src/icons/Calender/CalenderIcon.tsx
@@ -10,6 +10,7 @@ const CalenderIcon: FC = ({ width, height, ...props }) => {
version="1.1"
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 19 24"
+ stroke="none"
{...props}
>
+
+ );
+};
+
+export default DoneAllIcon;
diff --git a/src/icons/Done/DoneIcon.tsx b/src/icons/Done/DoneIcon.tsx
new file mode 100644
index 00000000..c125dd66
--- /dev/null
+++ b/src/icons/Done/DoneIcon.tsx
@@ -0,0 +1,22 @@
+import { DEFAULT_HEIGHT, DEFAULT_WIDTH } from '../../constants/constants';
+import { IconProps } from '../types';
+
+export const DoneIcon = ({
+ width = DEFAULT_WIDTH,
+ height = DEFAULT_HEIGHT,
+ ...props
+}: IconProps): JSX.Element => {
+ return (
+
+
+ );
+};
+
+export default DoneIcon;
diff --git a/src/icons/Done/index.tsx b/src/icons/Done/index.tsx
new file mode 100644
index 00000000..a6d037a0
--- /dev/null
+++ b/src/icons/Done/index.tsx
@@ -0,0 +1,2 @@
+export { default as DoneAllIcon } from './DoneAllIcon';
+export { default as DoneIcon } from './DoneIcon';
diff --git a/src/icons/DropDownIcon/DropDownIcon.tsx b/src/icons/DropDownIcon/DropDownIcon.tsx
new file mode 100644
index 00000000..4ed159b9
--- /dev/null
+++ b/src/icons/DropDownIcon/DropDownIcon.tsx
@@ -0,0 +1,23 @@
+import { DEFAULT_HEIGHT, DEFAULT_WIDTH } from '../../constants/constants';
+import { IconProps } from '../types';
+
+export const DropDownIcon = ({
+ width = DEFAULT_WIDTH,
+ height = DEFAULT_HEIGHT,
+ ...props
+}: IconProps): JSX.Element => {
+ return (
+
+
+ );
+};
+
+export default DropDownIcon;
diff --git a/src/icons/DropDownIcon/index.ts b/src/icons/DropDownIcon/index.ts
new file mode 100644
index 00000000..f05b787d
--- /dev/null
+++ b/src/icons/DropDownIcon/index.ts
@@ -0,0 +1 @@
+export { default as DropDownIcon } from './DropDownIcon';
diff --git a/src/icons/Edit/EditIcon.tsx b/src/icons/Edit/EditIcon.tsx
new file mode 100644
index 00000000..d33f1fb8
--- /dev/null
+++ b/src/icons/Edit/EditIcon.tsx
@@ -0,0 +1,22 @@
+import { DEFAULT_HEIGHT, DEFAULT_WIDTH } from '../../constants/constants';
+import { IconProps } from '../types';
+
+export const EditIcon = ({
+ width = DEFAULT_WIDTH,
+ height = DEFAULT_HEIGHT,
+ ...props
+}: IconProps): JSX.Element => {
+ return (
+
+
+ );
+};
+
+export default EditIcon;
diff --git a/src/icons/Edit/index.tsx b/src/icons/Edit/index.tsx
new file mode 100644
index 00000000..e6465b57
--- /dev/null
+++ b/src/icons/Edit/index.tsx
@@ -0,0 +1 @@
+export { default as EditIcon } from './EditIcon';
diff --git a/src/icons/Feedback/FeedbackIcon.tsx b/src/icons/Feedback/FeedbackIcon.tsx
index f62f91fb..0d17d3ad 100644
--- a/src/icons/Feedback/FeedbackIcon.tsx
+++ b/src/icons/Feedback/FeedbackIcon.tsx
@@ -38,6 +38,12 @@ const FeedbackIcon: FC = ({
stroke={props.secondaryFill || 'transparent'}
stroke-width="2"
/>
+ = ({ width = DEFAULT_WIDTH, height = DEFAULT_HEIGH
version="1.1"
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 15 24"
+ stroke="none"
{...props}
>
+
+ );
+};
+
+export default PublishIcon;
diff --git a/src/icons/Publish/index.tsx b/src/icons/Publish/index.tsx
new file mode 100644
index 00000000..fa81689e
--- /dev/null
+++ b/src/icons/Publish/index.tsx
@@ -0,0 +1 @@
+export { default as PublishIcon } from './PublishIcon';
diff --git a/src/icons/index.ts b/src/icons/index.ts
index a29e2ba1..f3a56743 100644
--- a/src/icons/index.ts
+++ b/src/icons/index.ts
@@ -22,6 +22,7 @@ export * from './Delete';
export * from './Deploy';
export * from './Designer';
export * from './Detail';
+export * from './DropDownIcon';
export * from './Error';
export * from './Favorite';
export * from './Filter';
@@ -36,6 +37,8 @@ export * from './Mesh';
// export { default as ModifiedApplicationFileIcon } from "./ModifiedApplicationFileIcon";
// export { default as OriginalApplicationFileIcon } from "./OriginalApplicationFileIcon";
export * from './Calender';
+export * from './Done';
+export * from './Edit';
export * from './Environment';
export * from './ExternalLink';
export * from './Feedback';
@@ -47,6 +50,7 @@ export * from './LeftArrow';
export * from './PanTool';
export * from './Pattern';
export * from './Pod';
+export * from './Publish';
export * from './Question';
export * from './Read';
export * from './Rectangle';
diff --git a/src/schemas/importDesign/schema.tsx b/src/schemas/importDesign/schema.tsx
index 98d1b27f..1fd27733 100644
--- a/src/schemas/importDesign/schema.tsx
+++ b/src/schemas/importDesign/schema.tsx
@@ -15,7 +15,7 @@ const importDesignSchema = {
default: 'Meshery Design',
'x-rjsf-grid-area': '6',
description:
- "Select the type of design you are uploading. The 'Design Type' determines the format, structure, and content of the file you are uploading. Choose the appropriate design type that matches the nature of your file. Checkout https://docs.meshery.io/guides/meshery-design to learn more about designs"
+ "Select the type of design you are uploading. The 'Design Type' determines the format, structure, and content of the file you are uploading. Choose the appropriate design type that matches the nature of your file. Checkout https://docs.meshery.io/guides/configuration-management/creating-a-meshery-design to learn more about designs"
}
},
allOf: [
diff --git a/site/package-lock.json b/site/package-lock.json
index e39eff1c..0e885a37 100644
--- a/site/package-lock.json
+++ b/site/package-lock.json
@@ -8101,6 +8101,11 @@
"node": ">=0.10"
}
},
+ "node_modules/esniff/node_modules/type": {
+ "version": "2.7.2",
+ "resolved": "https://registry.npmjs.org/type/-/type-2.7.2.tgz",
+ "integrity": "sha512-dzlvlNlt6AXU7EBSfpAscydQ7gXB+pPGsPnfJnZpiNJBDj7IaJzQlBZYGdEi4R9HmPdBv2XmWJ6YUtoTa7lmCw=="
+ },
"node_modules/espree": {
"version": "7.3.1",
"resolved": "https://registry.npmjs.org/espree/-/espree-7.3.1.tgz",
@@ -8247,6 +8252,9 @@
"version": "4.19.1",
"resolved": "https://registry.npmjs.org/express/-/express-4.19.1.tgz",
"integrity": "sha512-K4w1/Bp7y8iSiVObmCrtq8Cs79XjJc/RU2YYkZQ7wpUu5ZyZ7MtPHkqoMz4pf+mgXfNvo2qft8D9OnrH2ABk9w==",
+ "version": "4.19.2",
+ "resolved": "https://registry.npmjs.org/express/-/express-4.19.2.tgz",
+ "integrity": "sha512-5T6nhjsT+EOMzuck8JjBHARTHfMht0POzlA60WV2pMD3gyXw2LZnZ+ueGdNxG+0calOJcWKbpFcuzLZ91YWq9Q==",
"dependencies": {
"accepts": "~1.3.8",
"array-flatten": "1.1.1",
diff --git a/src/base/Grow/Grow.tsx b/src/base/Grow/Grow.tsx
new file mode 100644
index 00000000..558f294b
--- /dev/null
+++ b/src/base/Grow/Grow.tsx
@@ -0,0 +1,5 @@
+import { Grow as MuiGrow, GrowProps as MuiGrowProps } from '@mui/material';
+
+export function Grow(props: MuiGrowProps): JSX.Element {
+ return