diff --git a/packages/components/src/index.tsx b/packages/components/src/index.tsx index cbef6355..6ad8ba5e 100644 --- a/packages/components/src/index.tsx +++ b/packages/components/src/index.tsx @@ -36,11 +36,6 @@ export { ToggleButtonGroup } from './togglebuttongroup'; export { Toolbar } from './toolbar'; export { Tooltip } from './tooltip'; export { Typography } from './typography'; -export { Accordion } from './accordion'; -export { AccordionActions } from './accordionactions'; -export { AccordionDetails } from './accordiondetails'; -export { AccordionSummary } from './accordionsummary'; -export { AvatarGroup } from './avatargroup'; export { Badge } from './badge'; export { Backdrop } from './backdrop'; export { CardContent } from './cardcontent'; diff --git a/packages/design-system/index.html b/packages/design-system/index.html index 0c589ecc..891a9380 100644 --- a/packages/design-system/index.html +++ b/packages/design-system/index.html @@ -8,6 +8,6 @@
- + diff --git a/packages/design-system/package.json b/packages/design-system/package.json index cfcaeff7..69b2c6e9 100644 --- a/packages/design-system/package.json +++ b/packages/design-system/package.json @@ -5,10 +5,11 @@ "dependencies": { "@emotion/react": "^11.11.1", "@emotion/styled": "^11.11.0", - "@layer5/sistent-components": "0.1.0", "@mui/material": "^5.14.5", "react": "^18.2.0", - "react-dom": "^18.2.0" + "react-dom": "^18.2.0", + "@layer5/sistent-components": "*", + "@layer5/sistent-svg": "*" }, "scripts": { "dev": "vite", diff --git a/packages/design-system/src/App.jsx b/packages/design-system/src/App.tsx similarity index 89% rename from packages/design-system/src/App.jsx rename to packages/design-system/src/App.tsx index b56a31f0..70851a1a 100644 --- a/packages/design-system/src/App.jsx +++ b/packages/design-system/src/App.tsx @@ -1,4 +1,5 @@ import { BaseButton } from '@layer5/sistent-components'; +import React from 'react'; function App() { return ( diff --git a/packages/design-system/src/main.jsx b/packages/design-system/src/main.jsx deleted file mode 100644 index d76b7587..00000000 --- a/packages/design-system/src/main.jsx +++ /dev/null @@ -1,9 +0,0 @@ -import React from 'react'; -import ReactDOM from 'react-dom/client'; -import App from './App'; - -ReactDOM.createRoot(document.getElementById('root')).render( - - - -); diff --git a/packages/design-system/src/main.tsx b/packages/design-system/src/main.tsx new file mode 100644 index 00000000..51d08baf --- /dev/null +++ b/packages/design-system/src/main.tsx @@ -0,0 +1,11 @@ +import React from 'react'; +import App from './App'; +import { createRoot } from 'react-dom/client'; + +const rootContainer = document.getElementById('root'); +const root = createRoot(rootContainer!); +root.render( + + + +); diff --git a/packages/design-system/src/stories/Accordion.stories.tsx b/packages/design-system/src/stories/Accordion.stories.tsx index b2160665..aca0dc31 100644 --- a/packages/design-system/src/stories/Accordion.stories.tsx +++ b/packages/design-system/src/stories/Accordion.stories.tsx @@ -3,9 +3,9 @@ import { AccordionDetails, AccordionSummary, Typography -} from '@layer5/sistent-components/src'; +} from '@layer5/sistent-components'; import React from 'react'; -import { AddIcon } from '@layer5/sistent-svg/src'; //can anyone suggest a diff icon here? +import { AddIcon } from '@layer5/sistent-svg'; //can anyone suggest a diff icon here? export default { title: 'Example/Accordion', diff --git a/packages/design-system/src/stories/AppBar.stories.tsx b/packages/design-system/src/stories/AppBar.stories.tsx index 1e1e2e24..95ddabbe 100644 --- a/packages/design-system/src/stories/AppBar.stories.tsx +++ b/packages/design-system/src/stories/AppBar.stories.tsx @@ -1,4 +1,4 @@ -import { AppBar, Box, IconButton, Toolbar, Typography } from '@layer5/sistent-components/src'; +import { AppBar, Box, IconButton, Toolbar, Typography } from '@layer5/sistent-components'; import React from 'react'; export default { diff --git a/packages/design-system/src/stories/Avatar.stories.tsx b/packages/design-system/src/stories/Avatar.stories.tsx index 7a9f73f6..10c0c601 100644 --- a/packages/design-system/src/stories/Avatar.stories.tsx +++ b/packages/design-system/src/stories/Avatar.stories.tsx @@ -1,4 +1,4 @@ -import { Avatar, Stack, AvatarGroup, Badge } from '@layer5/sistent-components/src'; +import { Avatar, Stack, AvatarGroup, Badge } from '@layer5/sistent-components'; import React from 'react'; import { AddIcon } from '@layer5/sistent-svg/src'; //can anyone suggest a diff icon here? diff --git a/packages/design-system/src/stories/Backdrop.stories.tsx b/packages/design-system/src/stories/Backdrop.stories.tsx index 25bfc969..245d3fe8 100644 --- a/packages/design-system/src/stories/Backdrop.stories.tsx +++ b/packages/design-system/src/stories/Backdrop.stories.tsx @@ -1,4 +1,4 @@ -import { Backdrop, BaseButton } from '@layer5/sistent-components/src'; +import { Backdrop, BaseButton } from '@layer5/sistent-components'; import React from 'react'; export default { diff --git a/packages/design-system/src/stories/Badge.stories.tsx b/packages/design-system/src/stories/Badge.stories.tsx index 0631c7fb..d6bf7da2 100644 --- a/packages/design-system/src/stories/Badge.stories.tsx +++ b/packages/design-system/src/stories/Badge.stories.tsx @@ -1,6 +1,6 @@ -import { Badge, Stack, Switch } from '@layer5/sistent-components/src'; +import { Badge, Stack, Switch } from '@layer5/sistent-components'; import React from 'react'; -import { AddIcon } from '@layer5/sistent-svg/src'; //can anyone suggest a diff icon here? +import { AddIcon } from '@layer5/sistent-svg'; //can anyone suggest a diff icon here? export default { title: 'Example/Badge', diff --git a/packages/design-system/src/stories/Box.stories.tsx b/packages/design-system/src/stories/Box.stories.tsx index e1c9fe58..926e6cbb 100644 --- a/packages/design-system/src/stories/Box.stories.tsx +++ b/packages/design-system/src/stories/Box.stories.tsx @@ -1,4 +1,4 @@ -import { Box } from '@layer5/sistent-components/src'; +import { Box } from '@layer5/sistent-components'; import React from 'react'; export default { diff --git a/packages/design-system/src/stories/Button.stories.tsx b/packages/design-system/src/stories/Button.stories.tsx index ae2c06dc..11bf2d38 100644 --- a/packages/design-system/src/stories/Button.stories.tsx +++ b/packages/design-system/src/stories/Button.stories.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { BaseButton } from '@layer5/sistent-components/src'; +import { BaseButton } from '@layer5/sistent-components'; // More on how to set up stories at: https://storybook.js.org/docs/react/writing-stories/introduction export default { title: 'Example/Button', diff --git a/packages/design-system/src/stories/ButtonGrup.stories.tsx b/packages/design-system/src/stories/ButtonGrup.stories.tsx index 27dc25bf..012b6e91 100644 --- a/packages/design-system/src/stories/ButtonGrup.stories.tsx +++ b/packages/design-system/src/stories/ButtonGrup.stories.tsx @@ -1,4 +1,4 @@ -import { BaseButton, ButtonGroup, Stack, Paper } from '@layer5/sistent-components/src'; +import { BaseButton, ButtonGroup, Stack, Paper } from '@layer5/sistent-components'; import React from 'react'; export default { diff --git a/packages/design-system/src/stories/Card.stories.tsx b/packages/design-system/src/stories/Card.stories.tsx index cceefb15..87011ee4 100644 --- a/packages/design-system/src/stories/Card.stories.tsx +++ b/packages/design-system/src/stories/Card.stories.tsx @@ -5,7 +5,7 @@ import { Box, CardActions, CardContent -} from '@layer5/sistent-components/src'; +} from '@layer5/sistent-components'; import React from 'react'; export default { diff --git a/packages/design-system/src/stories/Chip.stories.tsx b/packages/design-system/src/stories/Chip.stories.tsx index c6ff662c..9229cf8a 100644 --- a/packages/design-system/src/stories/Chip.stories.tsx +++ b/packages/design-system/src/stories/Chip.stories.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { Chip, Stack } from '@layer5/sistent-components/src'; +import { Chip, Stack } from '@layer5/sistent-components'; export default { title: 'Example/Chip', diff --git a/packages/design-system/src/stories/Dialog.stories.tsx b/packages/design-system/src/stories/Dialog.stories.tsx index a2c37f98..cab4cea1 100644 --- a/packages/design-system/src/stories/Dialog.stories.tsx +++ b/packages/design-system/src/stories/Dialog.stories.tsx @@ -10,9 +10,9 @@ import { AppBar, Toolbar, IconButton -} from '@layer5/sistent-components/src'; +} from '@layer5/sistent-components'; import React from 'react'; -import { AddIconCircleBordered } from '@layer5/sistent-svg/src'; +import { AddIconCircleBordered } from '@layer5/sistent-svg'; export default { title: 'Example/Dialog', diff --git a/packages/design-system/src/stories/Paper.stories.tsx b/packages/design-system/src/stories/Paper.stories.tsx index 87cfaf9c..f917c9e2 100644 --- a/packages/design-system/src/stories/Paper.stories.tsx +++ b/packages/design-system/src/stories/Paper.stories.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { Box, Paper as MuiPaper } from '@layer5/sistent-components/src'; +import { Box, Paper as MuiPaper } from '@layer5/sistent-components'; export default { title: 'Example/Paper', diff --git a/packages/design-system/src/stories/Select.stories.tsx b/packages/design-system/src/stories/Select.stories.tsx index 510bf4b7..15b8ba09 100644 --- a/packages/design-system/src/stories/Select.stories.tsx +++ b/packages/design-system/src/stories/Select.stories.tsx @@ -1,4 +1,4 @@ -import { Select, Box, MenuItem } from '@layer5/sistent-components/src'; +import { Select, Box, MenuItem } from '@layer5/sistent-components'; import React from 'react'; export default { diff --git a/packages/design-system/src/stories/Tab.stories.jsx b/packages/design-system/src/stories/Tab.stories.tsx similarity index 74% rename from packages/design-system/src/stories/Tab.stories.jsx rename to packages/design-system/src/stories/Tab.stories.tsx index 6a05d837..23d666b9 100644 --- a/packages/design-system/src/stories/Tab.stories.jsx +++ b/packages/design-system/src/stories/Tab.stories.tsx @@ -1,16 +1,21 @@ import React, { useState } from 'react'; -import { Box, Stack, Tab as MuiTab, Tabs, Typography } from '@layer5/sistent-components/src'; +import { Box, Stack, Tab as MuiTab, Tabs, Typography } from '@layer5/sistent-components'; -function TabPanel(props) { - const { children, value, index, ...other } = props; +interface TabPanelProps { + children?: React.ReactNode; + value: number; + index: number; +} + +function TabPanel(props: TabPanelProps) { + const { children, value, index } = props; return (