explicit define JSX.Element and revised imports to types

Signed-off-by: Antonette Caldwell <[email protected]>

packages/components/src/accordion.tsx

@@ -1,6 +1,6 @@
-import { AccordionProps, Accordion as MuiAccordion } from '@mui/material';
+import { Accordion as MuiAccordion, type AccordionProps } from '@mui/material';
 import React from 'react';
 
-export function Accordion(props: AccordionProps) {
+export function Accordion(props: AccordionProps): JSX.Element {
   return <MuiAccordion {...props} />;
 }

packages/components/src/accordionactions.tsx

@@ -1,6 +1,6 @@
-import { AccordionActionsProps, AccordionActions as MuiAccordionActions } from '@mui/material';
+import { AccordionActions as MuiAccordionActions, type AccordionActionsProps } from '@mui/material';
 import React from 'react';
 
-export function AccordionActions(props: AccordionActionsProps) {
+export function AccordionActions(props: AccordionActionsProps): JSX.Element {
   return <MuiAccordionActions {...props} />;
 }

packages/components/src/accordiondetails.tsx

@@ -1,6 +1,6 @@
-import { AccordionDetailsProps, AccordionDetails as MuiAccordionDetails } from '@mui/material';
+import { AccordionDetails as MuiAccordionDetails, type AccordionDetailsProps } from '@mui/material';
 import React from 'react';
 
-export function AccordionDetails(props: AccordionDetailsProps) {
+export function AccordionDetails(props: AccordionDetailsProps): JSX.Element {
   return <MuiAccordionDetails {...props} />;
 }

packages/components/src/accordionsummary.tsx

@@ -1,6 +1,6 @@
-import { AccordionSummaryProps, AccordionSummary as MuiAccordionSummary } from '@mui/material';
+import { AccordionSummary as MuiAccordionSummary, type AccordionSummaryProps } from '@mui/material';
 import React from 'react';
 
-export function AccordionSummary(props: AccordionSummaryProps) {
+export function AccordionSummary(props: AccordionSummaryProps): JSX.Element {
   return <MuiAccordionSummary {...props} />;
 }

packages/components/src/appbar.tsx

@@ -1,6 +1,6 @@
-import { AppBarProps, AppBar as MuiAppBar } from '@mui/material';
+import { AppBar as MuiAppBar, type AppBarProps } from '@mui/material';
 import React from 'react';
 
-export function AppBar(props: AppBarProps) {
+export function AppBar(props: AppBarProps): JSX.Element {
   return <MuiAppBar {...props} />;
 }

packages/components/src/avatar.tsx

@@ -1,6 +1,6 @@
-import { AvatarProps, Avatar as MuiAvatar } from '@mui/material';
+import { Avatar as MuiAvatar, type AvatarProps } from '@mui/material';
 import React from 'react';
 
-export function Avatar(props: AvatarProps) {
+export function Avatar(props: AvatarProps): JSX.Element {
   return <MuiAvatar {...props} />;
 }

packages/components/src/avatargroup.tsx

@@ -1,6 +1,6 @@
-import { AvatarGroupProps, AvatarGroup as MuiAvatarGroup } from '@mui/material';
+import { AvatarGroup as MuiAvatarGroup, type AvatarGroupProps } from '@mui/material';
 import React from 'react';
 
-export function AvatarGroup(props: AvatarGroupProps) {
+export function AvatarGroup(props: AvatarGroupProps): JSX.Element {
   return <MuiAvatarGroup {...props} />;
 }

packages/components/src/backdrop.tsx

@@ -1,6 +1,6 @@
-import { BackdropProps, Backdrop as MuiBackdrop } from '@mui/material';
+import { Backdrop as MuiBackdrop, type BackdropProps } from '@mui/material';
 import React from 'react';
 
-export function Backdrop(props: BackdropProps) {
+export function Backdrop(props: BackdropProps): JSX.Element {
   return <MuiBackdrop {...props} />;
 }

packages/components/src/badge.tsx

@@ -1,6 +1,6 @@
-import { BadgeProps, Badge as MuiBadge } from '@mui/material';
+import { Badge as MuiBadge, type BadgeProps } from '@mui/material';
 import React from 'react';
 
-export function Badge(props: BadgeProps) {
+export function Badge(props: BadgeProps): JSX.Element {
   return <MuiBadge {...props} />;
 }

packages/components/src/box.tsx

@@ -1,6 +1,6 @@
-import { BoxProps, Box as MuiBox } from '@mui/material';
+import { Box as MuiBox, type BoxProps } from '@mui/material';
 import React from 'react';
 
-export function Box(props: BoxProps) {
+export function Box(props: BoxProps): JSX.Element {
   return <MuiBox {...props} />;
 }

packages/components/src/button.tsx

@@ -1,6 +1,6 @@
-import { ButtonProps, Button as MuiButton } from '@mui/material';
+import { Button as MuiButton, type ButtonProps } from '@mui/material';
 import * as React from 'react';
 
-export const BaseButton = (props: ButtonProps) => {
+export const BaseButton = (props: ButtonProps): JSX.Element => {
   return <MuiButton {...props} />;
 };

packages/components/src/buttongroup.tsx

@@ -1,6 +1,6 @@
-import { ButtonGroupProps, ButtonGroup as MuiButtonGroup } from '@mui/material';
+import { ButtonGroup as MuiButtonGroup, type ButtonGroupProps } from '@mui/material';
 import React from 'react';
 
-export const ButtonGroup = (props: ButtonGroupProps) => {
+export const ButtonGroup = (props: ButtonGroupProps): JSX.Element => {
   return <MuiButtonGroup {...props} />;
 };

packages/components/src/card.tsx

@@ -1,6 +1,6 @@
-import { CardProps, Card as MuiCard } from '@mui/material';
+import { Card as MuiCard, type CardProps } from '@mui/material';
 import React from 'react';
 
-export const Card = (props: CardProps) => {
+export const Card = (props: CardProps): JSX.Element => {
   return <MuiCard {...props} />;
 };

packages/components/src/checkbox.tsx

@@ -1,6 +1,6 @@
-import { CheckboxProps, Checkbox as MuiCheckbox } from '@mui/material';
+import { Checkbox as MuiCheckbox, type CheckboxProps } from '@mui/material';
 import React from 'react';
 
-export function Checkbox(props: CheckboxProps) {
+export function Checkbox(props: CheckboxProps): JSX.Element {
   return <MuiCheckbox {...props} />;
 }

packages/components/src/chip.tsx

@@ -1,6 +1,6 @@
-import { ChipProps, Chip as MuiChip } from '@mui/material';
+import { Chip as MuiChip, type ChipProps } from '@mui/material';
 import React from 'react';
 
-export function Chip(props: ChipProps) {
+export function Chip(props: ChipProps): JSX.Element {
   return <MuiChip {...props} />;
 }

packages/components/src/dialog.tsx

@@ -1,6 +1,6 @@
-import { DialogProps, Dialog as MuiDialog } from '@mui/material';
+import { Dialog as MuiDialog, type DialogProps } from '@mui/material';
 import React from 'react';
 
-export function Dialog(props: DialogProps) {
+export function Dialog(props: DialogProps): JSX.Element {
   return <MuiDialog {...props} />;
 }

packages/components/src/dialogactions.tsx

@@ -1,6 +1,6 @@
-import { DialogActionsProps, DialogActions as MuiDialogActions } from '@mui/material';
+import { DialogActions as MuiDialogActions, type DialogActionsProps } from '@mui/material';
 import React from 'react';
 
-export function DialogActions(props: DialogActionsProps) {
+export function DialogActions(props: DialogActionsProps): JSX.Element {
   return <MuiDialogActions {...props} />;
 }

packages/components/src/dialogcontent.tsx

@@ -1,6 +1,6 @@
-import { DialogContentProps, DialogContent as MuiDialogContent } from '@mui/material';
+import { DialogContent as MuiDialogContent, type DialogContentProps } from '@mui/material';
 import React from 'react';
 
-export function DialogContent(props: DialogContentProps) {
+export function DialogContent(props: DialogContentProps): JSX.Element {
   return <MuiDialogContent {...props} />;
 }

packages/components/src/dialogcontenttext.tsx

@@ -1,6 +1,9 @@
-import { DialogContentTextProps, DialogContentText as MuiDialogContentText } from '@mui/material';
+import {
+  DialogContentText as MuiDialogContentText,
+  type DialogContentTextProps
+} from '@mui/material';
 import React from 'react';
 
-export function DialogContentText(props: DialogContentTextProps) {
+export function DialogContentText(props: DialogContentTextProps): JSX.Element {
   return <MuiDialogContentText {...props} />;
 }

packages/components/src/dialogtitle.tsx

@@ -1,6 +1,6 @@
-import { DialogTitleProps, DialogTitle as MuiDialogTitle } from '@mui/material';
+import { DialogTitle as MuiDialogTitle, type DialogTitleProps } from '@mui/material';
 import React from 'react';
 
-export function DialogTitle(props: DialogTitleProps) {
+export function DialogTitle(props: DialogTitleProps): JSX.Element {
   return <MuiDialogTitle {...props} />;
 }

packages/components/src/divider.tsx

@@ -1,6 +1,6 @@
-import { DividerProps, Divider as MuiDivider } from '@mui/material';
+import { Divider as MuiDivider, type DividerProps } from '@mui/material';
 import React from 'react';
 
-export function Divider(props: DividerProps) {
+export function Divider(props: DividerProps): JSX.Element {
   return <MuiDivider {...props} />;
 }

packages/components/src/drawer.tsx

@@ -1,6 +1,6 @@
-import { DrawerProps, Drawer as MuiDrawer } from '@mui/material';
+import { Drawer as MuiDrawer, type DrawerProps } from '@mui/material';
 import React from 'react';
 
-export function Drawer(props: DrawerProps) {
+export function Drawer(props: DrawerProps): JSX.Element {
   return <MuiDrawer {...props} />;
 }

packages/components/src/iconbutton.tsx

@@ -1,6 +1,6 @@
-import { IconButtonProps, IconButton as MuiIconButton } from '@mui/material';
+import { IconButton as MuiIconButton, type IconButtonProps } from '@mui/material';
 import React from 'react';
 
-export function IconButton(props: IconButtonProps) {
+export function IconButton(props: IconButtonProps): JSX.Element {
   return <MuiIconButton {...props} />;
 }

packages/components/src/list.tsx

@@ -1,6 +1,6 @@
-import { ListProps, List as MuiList } from '@mui/material';
+import { List as MuiList, type ListProps } from '@mui/material';
 import React from 'react';
 
-export const List = (props: ListProps) => {
+export const List = (props: ListProps): JSX.Element => {
   return <MuiList {...props} />;
 };

packages/components/src/menu.tsx

@@ -1,6 +1,6 @@
-import { MenuProps, Menu as MuiMenu } from '@mui/material';
+import { Menu as MuiMenu, type MenuProps } from '@mui/material';
 import React from 'react';
 
-export const Menu = (props: MenuProps) => {
+export const Menu = (props: MenuProps): JSX.Element => {
   return <MuiMenu {...props} />;
 };

packages/components/src/paper.tsx

@@ -1,6 +1,6 @@
-import { Paper as MuiPaper, PaperProps } from '@mui/material';
+import { Paper as MuiPaper, type PaperProps } from '@mui/material';
 import React from 'react';
 
-export function Paper(props: PaperProps) {
+export function Paper(props: PaperProps): JSX.Element {
   return <MuiPaper {...props}>{props.children}</MuiPaper>;
 }

packages/components/src/radiogroup.tsx

@@ -1,6 +1,6 @@
-import { RadioGroup as MuiRadioGroup, RadioGroupProps } from '@mui/material';
+import { RadioGroup as MuiRadioGroup, type RadioGroupProps } from '@mui/material';
 import React from 'react';
 
-export function RadioGroup(props: RadioGroupProps) {
+export function RadioGroup(props: RadioGroupProps): JSX.Element {
   return <MuiRadioGroup {...props} />;
 }

packages/components/src/select.tsx

@@ -1,6 +1,6 @@
-import { Select as MuiSelect, SelectProps } from '@mui/material';
+import { Select as MuiSelect, type SelectProps } from '@mui/material';
 import React from 'react';
 
-export const Select = (props: SelectProps) => {
+export const Select = (props: SelectProps): JSX.Element => {
   return <MuiSelect {...props} />;
 };

packages/components/src/slide.tsx

@@ -1,6 +1,6 @@
-import { Slide as MuiSlide, SlideProps } from '@mui/material';
+import { Slide as MuiSlide, type SlideProps } from '@mui/material';
 import React from 'react';
 
-export function Slide(props: SlideProps) {
+export function Slide(props: SlideProps): JSX.Element {
   return <MuiSlide {...props} />;
 }

packages/components/src/stack.tsx

@@ -1,6 +1,6 @@
-import { Stack as MuiStack, StackProps } from '@mui/material';
+import { Stack as MuiStack, type StackProps } from '@mui/material';
 import React from 'react';
 
-export function Stack(props: StackProps) {
+export function Stack(props: StackProps): JSX.Element {
   return <MuiStack {...props} />;
 }

packages/components/src/switch.tsx

@@ -1,6 +1,6 @@
-import { Switch as MuiSwitch, SwitchProps } from '@mui/material';
+import { Switch as MuiSwitch, type SwitchProps } from '@mui/material';
 import React from 'react';
 
-export const Switch = (props: SwitchProps) => {
+export const Switch = (props: SwitchProps): JSX.Element => {
   return <MuiSwitch {...props} />;
 };

packages/components/src/tab.tsx

@@ -1,6 +1,6 @@
-import { Tab as MuiTab, TabProps } from '@mui/material';
+import { Tab as MuiTab, type TabProps } from '@mui/material';
 import React from 'react';
 
-export function Tab(props: TabProps) {
+export function Tab(props: TabProps): JSX.Element {
   return <MuiTab {...props} />;
 }

packages/components/src/table.tsx

@@ -1,6 +1,6 @@
-import { Table as MuiTable, TableProps } from '@mui/material';
+import { Table as MuiTable, type TableProps } from '@mui/material';
 import React from 'react';
 
-export const Table = (props: TableProps) => {
+export const Table = (props: TableProps): JSX.Element => {
   return <MuiTable {...props} />;
 };

packages/components/src/tabs.tsx

@@ -1,6 +1,6 @@
-import { Tabs as MuiTabs, TabsProps } from '@mui/material';
+import { Tabs as MuiTabs, type TabsProps } from '@mui/material';
 import React from 'react';
 
-export function Tabs(props: TabsProps) {
+export function Tabs(props: TabsProps): JSX.Element {
   return <MuiTabs {...props} />;
 }

packages/components/src/textfield.tsx

@@ -1,6 +1,6 @@
-import { TextField as MuiTextField, TextFieldProps } from '@mui/material';
+import { TextField as MuiTextField, type TextFieldProps } from '@mui/material';
 import React from 'react';
 
-export const TextField = (props: TextFieldProps) => {
+export const TextField = (props: TextFieldProps): JSX.Element => {
   return <MuiTextField {...props} />;
 };

packages/components/src/togglebutton.tsx

@@ -1,6 +1,6 @@
-import { ToggleButton as MuiToggleButton, ToggleButtonProps } from '@mui/material';
+import { ToggleButton as MuiToggleButton, type ToggleButtonProps } from '@mui/material';
 import React from 'react';
 
-export function ToggleButton(props: ToggleButtonProps) {
+export function ToggleButton(props: ToggleButtonProps): JSX.Element {
   return <MuiToggleButton {...props} />;
 }

packages/components/src/togglebuttongroup.tsx

@@ -1,6 +1,9 @@
-import { ToggleButtonGroup as MuiToggleButtonGroup, ToggleButtonGroupProps } from '@mui/material';
+import {
+  ToggleButtonGroup as MuiToggleButtonGroup,
+  type ToggleButtonGroupProps
+} from '@mui/material';
 import React from 'react';
 
-export function ToggleButtonGroup(props: ToggleButtonGroupProps) {
+export function ToggleButtonGroup(props: ToggleButtonGroupProps): JSX.Element {
   return <MuiToggleButtonGroup {...props} />;
 }

packages/components/src/toolbar.tsx

@@ -1,6 +1,6 @@
-import { Toolbar as MuiToolbar, ToolbarProps } from '@mui/material';
+import { Toolbar as MuiToolbar, type ToolbarProps } from '@mui/material';
 import React from 'react';
 
-export function Toolbar(props: ToolbarProps) {
+export function Toolbar(props: ToolbarProps): JSX.Element {
   return <MuiToolbar {...props} />;
 }

packages/components/src/tooltip.tsx

@@ -1,6 +1,6 @@
-import { Tooltip as MuiTooltip, TooltipProps } from '@mui/material';
+import { Tooltip as MuiTooltip, type TooltipProps } from '@mui/material';
 import React from 'react';
 
-export function Tooltip(props: TooltipProps) {
+export function Tooltip(props: TooltipProps): JSX.Element {
   return <MuiTooltip {...props} />;
 }

packages/components/src/typography.tsx

@@ -1,6 +1,6 @@
-import { Typography as MuiTypography, TypographyProps } from '@mui/material';
+import { Typography as MuiTypography, type TypographyProps } from '@mui/material';
 import React from 'react';
 
-export function Typography(props: TypographyProps) {
+export function Typography(props: TypographyProps): JSX.Element {
   return <MuiTypography {...props} />;
 }

packages/design-system/package.json

@@ -5,7 +5,8 @@
   "dependencies": {
     "@emotion/react": "^11.11.1",
     "@emotion/styled": "^11.11.0",
-    "@layer5/sistent-components": "0.1.0",
+    "@layer5/sistent-components": "*",
+    "@layer5/sistent-svg": "*",
     "@mui/material": "^5.14.5",
     "react": "^18.2.0",
     "react-dom": "^18.2.0"