@ceed/ads 0.0.7 → 0.0.9

package/dist/components/Container/Container.d.ts

@@ -0,0 +1,5 @@
+import React from "react";
+declare const Container: React.ForwardRefExoticComponent<Omit<import("@mui/system").MUIStyledCommonProps<import("@mui/joy").Theme> & {
+    maxWidth?: "tablet" | "laptop" | "desktop" | undefined;
+} & React.ClassAttributes<HTMLDivElement> & React.HTMLAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export { Container };

package/dist/components/Container/Container.js

@@ -0,0 +1,47 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { styled } from "@mui/joy";
+import React, { forwardRef } from "react";
+var ContainerRoot = styled("div", {
+    name: "Container",
+    slot: "root",
+    shouldForwardProp: function (prop) { return prop !== "maxWidth"; },
+})(function (_a) {
+    var _b, _c, _d;
+    var theme = _a.theme, _e = _a.maxWidth, maxWidth = _e === void 0 ? "desktop" : _e;
+    return (__assign(__assign(__assign({ width: "100%", marginLeft: "auto", boxSizing: "border-box", marginRight: "auto", display: "block", paddingLeft: theme.spacing(2), paddingRight: theme.spacing(2) }, (maxWidth === "tablet" && (_b = {},
+        _b[theme.breakpoints.up("mobile")] = {
+            maxWidth: theme.breakpoints.values.tablet,
+        },
+        _b))), (maxWidth === "laptop" && (_c = {},
+        _c[theme.breakpoints.up("tablet")] = {
+            maxWidth: theme.breakpoints.values.laptop,
+        },
+        _c))), (maxWidth === "desktop" && (_d = {},
+        _d[theme.breakpoints.up("laptop")] = {
+            maxWidth: theme.breakpoints.values.desktop,
+        },
+        _d))));
+});
+var Container = forwardRef(function Container(props, ref) {
+    // prop destruction
+    // lib hooks
+    // state, ref, querystring hooks
+    // form hooks
+    // query hooks
+    // calculated values
+    // effects
+    // handlers
+    return React.createElement(ContainerRoot, __assign({ ref: ref }, props));
+});
+export { Container };
+Container.displayName = "Container";

package/dist/components/Container/index.d.ts

@@ -0,0 +1,3 @@
+import { Container } from "./Container";
+export * from "./Container";
+export default Container;

package/dist/components/Container/index.js

@@ -0,0 +1,3 @@
+import { Container } from "./Container";
+export * from "./Container";
+export default Container;

package/dist/components/Table/Table.d.ts

@@ -1,8 +1,60 @@
 import React from "react";
 import { TableProps } from "@mui/joy";
-import { MotionProps } from "framer-motion";
 declare const Table: {
-    (props: TableProps & MotionProps): React.JSX.Element;
+    (props: TableProps): React.JSX.Element;
     displayName: string;
 };
 export { Table };
+interface HeadCell {
+    label: string;
+    numeric?: boolean;
+    width?: string;
+}
+declare function TableHead<D extends Record<string, unknown>>(props: {
+    headCells: HeadCell[];
+    /**
+     * Show Checkbox to select all rows
+     */
+    showCheckbox?: boolean;
+    onCheckboxChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
+    /**
+     * Inject custom component
+     */
+    slots?: {
+        checkbox?: React.ElementType;
+    };
+    slotProps?: {
+        checkbox?: Partial<{
+            checked: boolean;
+            indeterminate: boolean;
+            [key: string]: any;
+        }>;
+    };
+}): React.JSX.Element;
+declare namespace TableHead {
+    var displayName: string;
+}
+export { TableHead };
+interface TableBodyProps<D extends Record<string, unknown>> {
+    rows: D[];
+    cellOrder: (keyof D)[];
+    rowOptions?: Partial<Record<keyof D, {
+        numeric?: boolean;
+    }>>;
+    showCheckbox?: boolean;
+    onCheckboxChange?: (event: React.ChangeEvent<HTMLInputElement>, rowIndex: number) => void;
+    slots?: {
+        checkbox?: React.ElementType;
+    };
+    slotProps?: {
+        checkbox?: Partial<{
+            checked: boolean;
+            [key: string]: any;
+        }>;
+    };
+}
+declare function TableBody<D extends Record<string, unknown>>(props: TableBodyProps<D>): React.JSX.Element;
+declare namespace TableBody {
+    var displayName: string;
+}
+export { TableBody };

package/dist/components/Table/Table.js

@@ -9,12 +9,23 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
 import React from "react";
 import { Table as JoyTable } from "@mui/joy";
-import { motion } from "framer-motion";
-var MotionTable = motion(JoyTable);
+import Checkbox from "../Checkbox";
 var Table = function (props) {
     // prop destruction
+    var children = props.children, inheritProps = __rest(props, ["children"]);
     // lib hooks
     // state, ref, querystring hooks
     // form hooks
@@ -22,7 +33,55 @@ var Table = function (props) {
     // calculated values
     // effects
     // handlers
-    return React.createElement(MotionTable, __assign({}, props));
+    return React.createElement(JoyTable, __assign({}, inheritProps), children);
 };
 export { Table };
 Table.displayName = "Table";
+function TableHead(props) {
+    // prop destruction
+    var headCells = props.headCells, showCheckbox = props.showCheckbox, onCheckboxChange = props.onCheckboxChange, _a = props.slots, _b = _a === void 0 ? {} : _a, _c = _b.checkbox, RenderCheckbox = _c === void 0 ? Checkbox : _c, _d = props.slotProps, _e = _d === void 0 ? {} : _d, _f = _e.checkbox, checkboxProps = _f === void 0 ? {} : _f;
+    // lib hooks
+    // state, ref, querystring hooks
+    // form hooks
+    // query hooks
+    // calculated values
+    // effects
+    // handlers
+    return (React.createElement("thead", null,
+        React.createElement("tr", null,
+            showCheckbox && (React.createElement("th", { style: {
+                    width: "40px",
+                    textAlign: "center",
+                } },
+                React.createElement(RenderCheckbox, __assign({ onChange: onCheckboxChange }, checkboxProps)))),
+            headCells.map(function (headCell) { return (React.createElement("th", { key: headCell.label, style: {
+                    width: headCell.width,
+                    textAlign: headCell.numeric ? "right" : "left",
+                } }, headCell.label)); }))));
+}
+TableHead.displayName = "TableHead";
+export { TableHead };
+function TableBody(props) {
+    // prop destruction
+    var rows = props.rows, cellOrder = props.cellOrder, rowOptions = props.rowOptions, showCheckbox = props.showCheckbox, onCheckboxChange = props.onCheckboxChange, _a = props.slots, _b = _a === void 0 ? {} : _a, _c = _b.checkbox, RenderCheckbox = _c === void 0 ? Checkbox : _c, _d = props.slotProps, _e = _d === void 0 ? {} : _d, _f = _e.checkbox, checkboxProps = _f === void 0 ? {} : _f;
+    // lib hooks
+    // state, ref, querystring hooks
+    // form hooks
+    // query hooks
+    // calculated values
+    // effects
+    // handlers
+    return (React.createElement("tbody", null, rows.map(function (row, rowIndex) { return (React.createElement("tr", { key: rowIndex },
+        showCheckbox && (React.createElement("td", { style: {
+                textAlign: "center",
+            } },
+            React.createElement(RenderCheckbox, __assign({ onChange: function (event) { return onCheckboxChange === null || onCheckboxChange === void 0 ? void 0 : onCheckboxChange(event, rowIndex); } }, checkboxProps)))),
+        cellOrder.map(function (cellKey) {
+            var _a;
+            return (React.createElement("td", { key: cellKey, style: {
+                    textAlign: ((_a = rowOptions === null || rowOptions === void 0 ? void 0 : rowOptions[cellKey]) === null || _a === void 0 ? void 0 : _a.numeric) ? "right" : "left",
+                } }, row[cellKey]));
+        }))); })));
+}
+TableBody.displayName = "TableBody";
+export { TableBody };

package/dist/components/ThemeProvider/ThemeProvider.d.ts

@@ -1,4 +1,17 @@
-import React from 'react';
+import React from "react";
+declare module "@mui/joy/styles" {
+    interface BreakpointOverrides {
+        xs: false;
+        sm: false;
+        md: false;
+        lg: false;
+        xl: false;
+        mobile: true;
+        tablet: true;
+        laptop: true;
+        desktop: true;
+    }
+}
 declare function ThemeProvider(props: {
     children?: React.ReactNode;
 }): React.JSX.Element;

package/dist/components/ThemeProvider/ThemeProvider.js

@@ -1,7 +1,35 @@
-import React from 'react';
-import { CssBaseline, CssVarsProvider, extendTheme } from '@mui/joy';
+import React from "react";
+import { CssBaseline, CssVarsProvider, checkboxClasses, extendTheme, } from "@mui/joy";
 var defaultTheme = extendTheme({
-    cssVarPrefix: 'ceed',
+    cssVarPrefix: "ceed",
+    breakpoints: {
+        values: {
+            mobile: 0,
+            tablet: 768,
+            laptop: 1024,
+            desktop: 1280,
+        },
+    },
+    components: {
+        JoyTable: {
+            defaultProps: {
+                size: "sm",
+                borderAxis: "bothBetween",
+            },
+            styleOverrides: {
+                root: function (_a) {
+                    var _b;
+                    var theme = _a.theme;
+                    return (_b = {},
+                        // "--TableRow-hoverBackground": theme.palette.primary.outlinedHoverBg,
+                        _b["& .".concat(checkboxClasses.root)] = {
+                            verticalAlign: "middle",
+                        },
+                        _b);
+                },
+            },
+        },
+    },
 });
 function ThemeProvider(props) {
     return (React.createElement(React.Fragment, null,
@@ -10,4 +38,4 @@ function ThemeProvider(props) {
             props.children)));
 }
 export { ThemeProvider };
-ThemeProvider.displayName = 'ThemeProvider';
+ThemeProvider.displayName = "ThemeProvider";

package/dist/components/index.d.ts

@@ -1,6 +1,7 @@
 export { Box } from "./Box";
 export { Button } from "./Button";
 export { Checkbox } from "./Checkbox";
+export { Container } from "./Container";
 export { DialogActions } from "./DialogActions";
 export { DialogContent } from "./DialogContent";
 export { DialogTitle } from "./DialogTitle";
@@ -12,14 +13,14 @@ export { FormLabel } from "./FormLabel";
 export { Grid } from "./Grid";
 export { IconButton } from "./IconButton";
 export { Input } from "./Input";
-export { Menu } from "./Menu";
+export { Menu, MenuButton, MenuItem } from "./Menu";
 export { Modal, ModalClose, ModalDialog, ModalOverflow } from "./Modal";
 export { Radio, RadioGroup } from "./Radio";
 export { Select, Option } from "./Select";
 export { Sheet } from "./Sheet";
 export { Stack } from "./Stack";
 export { Switch } from "./Switch";
-export { Table } from "./Table";
+export { Table, TableHead, TableBody } from "./Table";
 export { Textarea } from "./Textarea";
 export { ThemeProvider } from "./ThemeProvider";
 export { Tooltip } from "./Tooltip";

package/dist/components/index.js

@@ -1,6 +1,7 @@
 export { Box } from "./Box";
 export { Button } from "./Button";
 export { Checkbox } from "./Checkbox";
+export { Container } from "./Container";
 export { DialogActions } from "./DialogActions";
 export { DialogContent } from "./DialogContent";
 export { DialogTitle } from "./DialogTitle";
@@ -12,14 +13,14 @@ export { FormLabel } from "./FormLabel";
 export { Grid } from "./Grid";
 export { IconButton } from "./IconButton";
 export { Input } from "./Input";
-export { Menu } from "./Menu";
+export { Menu, MenuButton, MenuItem } from "./Menu";
 export { Modal, ModalClose, ModalDialog, ModalOverflow } from "./Modal";
 export { Radio, RadioGroup } from "./Radio";
 export { Select, Option } from "./Select";
 export { Sheet } from "./Sheet";
 export { Stack } from "./Stack";
 export { Switch } from "./Switch";
-export { Table } from "./Table";
+export { Table, TableHead, TableBody } from "./Table";
 export { Textarea } from "./Textarea";
 export { ThemeProvider } from "./ThemeProvider";
 export { Tooltip } from "./Tooltip";

package/dist/index.d.ts

@@ -1,2 +1,2 @@
 export { boxClasses, buttonClasses, checkboxClasses, dividerClasses, iconButtonClasses, inputClasses, menuClasses, menuButtonClasses, menuItemClasses, optionClasses, radioClasses, radioGroupClasses, selectClasses, switchClasses, tableClasses, textareaClasses, typographyClasses, formControlClasses, formLabelClasses, formHelperTextClasses, gridClasses, stackClasses, sheetClasses, modalClasses, modalCloseClasses, modalDialogClasses, modalOverflowClasses, dialogTitleClasses, dialogContentClasses, dialogActionsClasses, tooltipClasses, Avatar, avatarClasses, AvatarGroup, avatarGroupClasses, Chip, chipClasses, } from "@mui/joy";
-export { Box, Button, Checkbox, DialogActions, DialogContent, DialogTitle, Divider, Dropdown, FormControl, FormHelperText, FormLabel, Grid, IconButton, Input, Menu, Modal, ModalClose, ModalDialog, ModalOverflow, Radio, RadioGroup, Select, Option, Sheet, Stack, Switch, Table, Textarea, ThemeProvider, Tooltip, Typography, } from "./components";
+export { Box, Button, Checkbox, Container, DialogActions, DialogContent, DialogTitle, Divider, Dropdown, FormControl, FormHelperText, FormLabel, Grid, IconButton, Input, Menu, MenuButton, MenuItem, Modal, ModalClose, ModalDialog, ModalOverflow, Radio, RadioGroup, Select, Option, Sheet, Stack, Switch, Table, TableHead, TableBody, Textarea, ThemeProvider, Tooltip, Typography, } from "./components";

package/dist/index.js

@@ -3,4 +3,4 @@ export {
 boxClasses, buttonClasses, checkboxClasses, dividerClasses, iconButtonClasses, inputClasses, menuClasses, menuButtonClasses, menuItemClasses, optionClasses, radioClasses, radioGroupClasses, selectClasses, switchClasses, tableClasses, textareaClasses, typographyClasses, formControlClasses, formLabelClasses, formHelperTextClasses, gridClasses, stackClasses, sheetClasses, modalClasses, modalCloseClasses, modalDialogClasses, modalOverflowClasses, dialogTitleClasses, dialogContentClasses, dialogActionsClasses, tooltipClasses, 
 // Pure JoyUI
 Avatar, avatarClasses, AvatarGroup, avatarGroupClasses, Chip, chipClasses, } from "@mui/joy";
-export { Box, Button, Checkbox, DialogActions, DialogContent, DialogTitle, Divider, Dropdown, FormControl, FormHelperText, FormLabel, Grid, IconButton, Input, Menu, Modal, ModalClose, ModalDialog, ModalOverflow, Radio, RadioGroup, Select, Option, Sheet, Stack, Switch, Table, Textarea, ThemeProvider, Tooltip, Typography, } from "./components";
+export { Box, Button, Checkbox, Container, DialogActions, DialogContent, DialogTitle, Divider, Dropdown, FormControl, FormHelperText, FormLabel, Grid, IconButton, Input, Menu, MenuButton, MenuItem, Modal, ModalClose, ModalDialog, ModalOverflow, Radio, RadioGroup, Select, Option, Sheet, Stack, Switch, Table, TableHead, TableBody, Textarea, ThemeProvider, Tooltip, Typography, } from "./components";

package/framer/index.js

@@ -24372,6 +24372,47 @@ var Checkbox3 = (props) => {
 };
 Checkbox3.displayName = "Checkbox";
 
+// src/components/Checkbox/index.ts
+var Checkbox_default2 = Checkbox3;
+
+// src/components/Container/Container.tsx
+import { forwardRef as forwardRef48 } from "react";
+var ContainerRoot = styled_default2("div", {
+  name: "Container",
+  slot: "root",
+  shouldForwardProp: (prop) => prop !== "maxWidth"
+})(
+  ({ theme, maxWidth: maxWidth2 = "desktop" }) => ({
+    width: "100%",
+    marginLeft: "auto",
+    boxSizing: "border-box",
+    marginRight: "auto",
+    display: "block",
+    // Fix IE11 layout when used with main.
+    paddingLeft: theme.spacing(2),
+    paddingRight: theme.spacing(2),
+    ...maxWidth2 === "tablet" && {
+      [theme.breakpoints.up("mobile")]: {
+        maxWidth: theme.breakpoints.values.tablet
+      }
+    },
+    ...maxWidth2 === "laptop" && {
+      [theme.breakpoints.up("tablet")]: {
+        maxWidth: theme.breakpoints.values.laptop
+      }
+    },
+    ...maxWidth2 === "desktop" && {
+      [theme.breakpoints.up("laptop")]: {
+        maxWidth: theme.breakpoints.values.desktop
+      }
+    }
+  })
+);
+var Container = forwardRef48(function Container2(props, ref) {
+  return /* @__PURE__ */ jsx2(ContainerRoot, { ref, ...props });
+});
+Container.displayName = "Container";
+
 // src/components/DialogActions/DialogActions.tsx
 import { motion as motion4 } from "framer-motion";
 var MotionDialogActions = motion4(DialogActions_default);
@@ -24549,16 +24590,87 @@ var Switch3 = (props) => {
 Switch3.displayName = "Switch";
 
 // src/components/Table/Table.tsx
-import { motion as motion22 } from "framer-motion";
-var MotionTable = motion22(Table_default);
 var Table3 = (props) => {
-  return /* @__PURE__ */ jsx2(MotionTable, { ...props });
+  const { children, ...inheritProps } = props;
+  return /* @__PURE__ */ jsx2(Table_default, { ...inheritProps, children });
 };
 Table3.displayName = "Table";
+function TableHead(props) {
+  const {
+    headCells,
+    showCheckbox,
+    onCheckboxChange,
+    slots: { checkbox: RenderCheckbox = Checkbox_default2 } = {},
+    slotProps: { checkbox: checkboxProps = {} } = {}
+  } = props;
+  return /* @__PURE__ */ jsx2("thead", { children: /* @__PURE__ */ jsxs2("tr", { children: [
+    showCheckbox && /* @__PURE__ */ jsx2(
+      "th",
+      {
+        style: {
+          width: "40px",
+          textAlign: "center"
+        },
+        children: /* @__PURE__ */ jsx2(RenderCheckbox, { onChange: onCheckboxChange, ...checkboxProps })
+      }
+    ),
+    headCells.map((headCell) => /* @__PURE__ */ jsx2(
+      "th",
+      {
+        style: {
+          width: headCell.width,
+          textAlign: headCell.numeric ? "right" : "left"
+        },
+        children: headCell.label
+      },
+      headCell.label
+    ))
+  ] }) });
+}
+TableHead.displayName = "TableHead";
+function TableBody(props) {
+  const {
+    rows,
+    cellOrder,
+    rowOptions,
+    showCheckbox,
+    onCheckboxChange,
+    slots: { checkbox: RenderCheckbox = Checkbox_default2 } = {},
+    slotProps: { checkbox: checkboxProps = {} } = {}
+  } = props;
+  return /* @__PURE__ */ jsx2("tbody", { children: rows.map((row, rowIndex) => /* @__PURE__ */ jsxs2("tr", { children: [
+    showCheckbox && /* @__PURE__ */ jsx2(
+      "td",
+      {
+        style: {
+          textAlign: "center"
+        },
+        children: /* @__PURE__ */ jsx2(
+          RenderCheckbox,
+          {
+            onChange: (event) => onCheckboxChange?.(event, rowIndex),
+            ...checkboxProps
+          }
+        )
+      }
+    ),
+    cellOrder.map((cellKey) => /* @__PURE__ */ jsx2(
+      "td",
+      {
+        style: {
+          textAlign: rowOptions?.[cellKey]?.numeric ? "right" : "left"
+        },
+        children: row[cellKey]
+      },
+      cellKey
+    ))
+  ] }, rowIndex)) });
+}
+TableBody.displayName = "TableBody";
 
 // src/components/Textarea/Textarea.tsx
-import { motion as motion23 } from "framer-motion";
-var MotionTextarea = motion23(Textarea_default);
+import { motion as motion22 } from "framer-motion";
+var MotionTextarea = motion22(Textarea_default);
 var Textarea3 = (props) => {
   return /* @__PURE__ */ jsx2(MotionTextarea, { ...props });
 };
@@ -24566,7 +24678,31 @@ Textarea3.displayName = "Textarea";
 
 // src/components/ThemeProvider/ThemeProvider.tsx
 var defaultTheme4 = extendTheme({
-  cssVarPrefix: "ceed"
+  cssVarPrefix: "ceed",
+  breakpoints: {
+    values: {
+      mobile: 0,
+      tablet: 768,
+      laptop: 1024,
+      desktop: 1280
+    }
+  },
+  components: {
+    JoyTable: {
+      defaultProps: {
+        size: "sm",
+        borderAxis: "bothBetween"
+      },
+      styleOverrides: {
+        root: ({ theme }) => ({
+          // "--TableRow-hoverBackground": theme.palette.primary.outlinedHoverBg,
+          [`& .${checkboxClasses_default.root}`]: {
+            verticalAlign: "middle"
+          }
+        })
+      }
+    }
+  }
 });
 function ThemeProvider4(props) {
   return /* @__PURE__ */ jsx2(Fragment12, { children: /* @__PURE__ */ jsxs2(CssVarsProvider, { theme: defaultTheme4, children: [
@@ -24577,16 +24713,16 @@ function ThemeProvider4(props) {
 ThemeProvider4.displayName = "ThemeProvider";
 
 // src/components/Tooltip/Tooltip.tsx
-import { motion as motion24 } from "framer-motion";
-var MotionTooltip = motion24(Tooltip_default);
+import { motion as motion23 } from "framer-motion";
+var MotionTooltip = motion23(Tooltip_default);
 var Tooltip3 = (props) => {
   return /* @__PURE__ */ jsx2(MotionTooltip, { ...props });
 };
 Tooltip3.displayName = "Tooltip";
 
 // src/components/Typography/Typography.tsx
-import { motion as motion25 } from "framer-motion";
-var MotionTypography = motion25(Typography_default);
+import { motion as motion24 } from "framer-motion";
+var MotionTypography = motion24(Typography_default);
 var Typography3 = (props) => {
   return /* @__PURE__ */ jsx2(MotionTypography, { ...props });
 };
@@ -24598,6 +24734,7 @@ export {
   Button3 as Button,
   Checkbox3 as Checkbox,
   Chip_default as Chip,
+  Container,
   DialogActions3 as DialogActions,
   DialogContent3 as DialogContent,
   DialogTitle3 as DialogTitle,
@@ -24610,6 +24747,8 @@ export {
   IconButton3 as IconButton,
   Input3 as Input,
   Menu3 as Menu,
+  MenuButton3 as MenuButton,
+  MenuItem3 as MenuItem,
   Modal3 as Modal,
   ModalClose3 as ModalClose,
   ModalDialog3 as ModalDialog,
@@ -24622,6 +24761,8 @@ export {
   Stack2 as Stack,
   Switch3 as Switch,
   Table3 as Table,
+  TableBody,
+  TableHead,
   Textarea3 as Textarea,
   ThemeProvider4 as ThemeProvider,
   Tooltip3 as Tooltip,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ceed/ads",
-  "version": "0.0.7",
+  "version": "0.0.9",
   "main": "dist/index.js",
   "type": "module",
   "description": "UI tool for Ecube Labs front-end developers",
@@ -42,14 +42,10 @@
     "@storybook/react-webpack5": "^7.6.13",
     "@storybook/test": "^7.6.13",
     "@storybook/theming": "^7.6.13",
-    "@types/tmp": "^0",
     "esbuild": "^0.20.1",
-    "postcss": "^8.4.35",
-    "postcss-modules": "^6.0.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "storybook": "^7.6.13",
-    "tmp": "^0.2.1",
     "typescript": "^5.3.3"
   },
   "repository": {