@zidsa/zidmui 2.5.16 → 2.5.18

package/dist/react/cjs/components/app-card.js

@@ -0,0 +1,51 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const React = require("react");
+const appTypography = require("./app-typography.js");
+const material = require("@mui/material");
+const stackRow = require("./stack-row.js");
+const stackColumn = require("./stack-column.js");
+const AppCard = ({
+  color,
+  title,
+  description,
+  descriptionProps,
+  titleProps,
+  titleSuffix,
+  titlePrefix,
+  children,
+  actions,
+  loading,
+  ...props
+}) => {
+  const hasActions = Boolean(actions && React.Children.toArray(actions)?.length > 0);
+  return /* @__PURE__ */ jsxRuntime.jsx(material.Card, { color, ...props, children: /* @__PURE__ */ jsxRuntime.jsxs(stackColumn.StackColumn, { gap: 1.25, children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(stackRow.StackRow, { alignItems: "center", gap: 1, p: 1.5, pb: 0, width: "100%", children: [
+      titlePrefix,
+      /* @__PURE__ */ jsxRuntime.jsxs(stackColumn.StackColumn, { gap: 0.25, width: "100%", children: [
+        typeof title === "string" ? /* @__PURE__ */ jsxRuntime.jsxs(appTypography.AppTypography, { variant: "subtitle1", color: "text.primary", gap: 1, ...titleProps, children: [
+          title,
+          " ",
+          titleSuffix ? titleSuffix : null
+        ] }) : title,
+        description && /* @__PURE__ */ jsxRuntime.jsx(
+          appTypography.AppTypography,
+          {
+            variant: "body2",
+            color: "text.primary",
+            whiteSpace: "pre-line",
+            ...descriptionProps,
+            children: description
+          }
+        )
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx(material.CardContent, { children: /* @__PURE__ */ jsxRuntime.jsxs(stackColumn.StackColumn, { gap: 2, children: [
+      children,
+      hasActions && !loading && /* @__PURE__ */ jsxRuntime.jsx(stackRow.StackRow, { justifyContent: "end", children: actions })
+    ] }) })
+  ] }) });
+};
+exports.AppCard = AppCard;
+//# sourceMappingURL=app-card.js.map

package/dist/react/cjs/components/app-card.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"app-card.js","sources":["../../../../src/components/app-card.tsx"],"sourcesContent":["import React from 'react';\n\nimport { AppTypography, type AppTypographyProps } from './app-typography';\n\nimport { type Theme, SxProps, Card, CardContent } from '@mui/material';\nimport { StackRow } from './stack-row';\nimport { StackColumn } from './stack-column';\n\n//\n//\n\nexport type AppCardColor = 'primary' | 'success' | 'error' | 'warning' | 'info' | 'neutral';\n\nexport type AppCardCorners = 'grouped' | 'all';\n\nexport type AppCard = {\n  children?: React.ReactNode;\n  color?: AppCardColor;\n  roundedCorners?: AppCardCorners;\n  title?: string | React.ReactNode;\n  titleProps?: AppTypographyProps;\n  titlePrefix?: React.ReactNode;\n  titleSuffix?: React.ReactNode;\n  description?: React.ReactNode;\n  descriptionProps?: AppTypographyProps;\n  sx?: SxProps<Theme>;\n  loading?: boolean;\n  actions?: React.ReactElement | null | (React.ReactElement | null)[];\n};\n\nexport const AppCard: React.FC<AppCard> = ({\n  color,\n  title,\n  description,\n  descriptionProps,\n  titleProps,\n  titleSuffix,\n  titlePrefix,\n  children,\n  actions,\n  loading,\n  ...props\n}) => {\n  const hasActions = Boolean(actions && React.Children.toArray(actions)?.length > 0);\n\n  return (\n    <Card color={color} {...props}>\n      <StackColumn gap={1.25}>\n        <StackRow alignItems=\"center\" gap={1} p={1.5} pb={0} width=\"100%\">\n          {titlePrefix}\n\n          <StackColumn gap={0.25} width=\"100%\">\n            {typeof title === 'string' ? (\n              <AppTypography variant=\"subtitle1\" color=\"text.primary\" gap={1} {...titleProps}>\n                {title} {titleSuffix ? titleSuffix : null}\n              </AppTypography>\n            ) : (\n              title\n            )}\n\n            {description && (\n              <AppTypography\n                variant=\"body2\"\n                color=\"text.primary\"\n                whiteSpace=\"pre-line\"\n                {...descriptionProps}\n              >\n                {description}\n              </AppTypography>\n            )}\n          </StackColumn>\n        </StackRow>\n\n        <CardContent>\n          <StackColumn gap={2}>\n            {children}\n\n            {hasActions && !loading && <StackRow justifyContent=\"end\">{actions}</StackRow>}\n          </StackColumn>\n        </CardContent>\n      </StackColumn>\n    </Card>\n  );\n};\n"],"names":["jsx","Card","jsxs","StackColumn","StackRow","AppTypography","CardContent"],"mappings":";;;;;;;;AA8BO,MAAM,UAA6B,CAAC;AAAA,EACzC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAM;AACJ,QAAM,aAAa,QAAQ,WAAW,MAAM,SAAS,QAAQ,OAAO,GAAG,SAAS,CAAC;AAEjF,SACEA,+BAACC,SAAAA,QAAK,OAAe,GAAG,OACtB,UAAAC,2BAAAA,KAACC,YAAAA,aAAA,EAAY,KAAK,MAChB,UAAA;AAAA,IAAAD,2BAAAA,KAACE,SAAAA,UAAA,EAAS,YAAW,UAAS,KAAK,GAAG,GAAG,KAAK,IAAI,GAAG,OAAM,QACxD,UAAA;AAAA,MAAA;AAAA,MAEDF,2BAAAA,KAACC,YAAAA,aAAA,EAAY,KAAK,MAAM,OAAM,QAC3B,UAAA;AAAA,QAAA,OAAO,UAAU,WAChBD,2BAAAA,KAACG,cAAAA,eAAA,EAAc,SAAQ,aAAY,OAAM,gBAAe,KAAK,GAAI,GAAG,YACjE,UAAA;AAAA,UAAA;AAAA,UAAM;AAAA,UAAE,cAAc,cAAc;AAAA,QAAA,EAAA,CACvC,IAEA;AAAA,QAGD,eACCL,2BAAAA;AAAAA,UAACK,cAAAA;AAAAA,UAAA;AAAA,YACC,SAAQ;AAAA,YACR,OAAM;AAAA,YACN,YAAW;AAAA,YACV,GAAG;AAAA,YAEH,UAAA;AAAA,UAAA;AAAA,QAAA;AAAA,MACH,EAAA,CAEJ;AAAA,IAAA,GACF;AAAA,IAEAL,+BAACM,SAAAA,aAAA,EACC,UAAAJ,2BAAAA,KAACC,YAAAA,aAAA,EAAY,KAAK,GACf,UAAA;AAAA,MAAA;AAAA,MAEA,cAAc,CAAC,0CAAYC,SAAAA,UAAA,EAAS,gBAAe,OAAO,UAAA,QAAA,CAAQ;AAAA,IAAA,EAAA,CACrE,EAAA,CACF;AAAA,EAAA,EAAA,CACF,EAAA,CACF;AAEJ;;"}

package/dist/react/cjs/components/app-status.js

@@ -11,51 +11,9 @@ const AppStatus = ({
   tooltipProps,
   ...props
 }) => {
-  if (color === "default") color = "neutral";
-  const element = /* @__PURE__ */ jsxRuntime.jsx(StatusElement, { color2: color, size, ref, ...props });
+  const element = /* @__PURE__ */ jsxRuntime.jsx(material.Chip, { color, size, ref, ...props });
   if (!tooltip) return element;
   return /* @__PURE__ */ jsxRuntime.jsx(appTooltip.AppTooltip, { description: tooltip, ...tooltipProps, children: element });
 };
-AppStatus.displayName = "AppStatus";
-const StatusElement = material.styled(material.Chip, {
-  shouldForwardProp: (prop) => prop !== "color2"
-})(({ theme, color2 = "neutral" }) => ({
-  ...color2 === "success" ? {
-    backgroundColor: theme.palette._components.status.success.background,
-    color: theme.palette._components.status.success.color
-  } : void 0,
-  ...color2 === "error" ? {
-    backgroundColor: theme.palette._components.status.error.background,
-    color: theme.palette._components.status.error.color
-  } : void 0,
-  ...color2 === "warning" ? {
-    backgroundColor: theme.palette._components.status.warning.background,
-    color: theme.palette._components.status.warning.color
-  } : void 0,
-  ...color2 === "neutral" ? {
-    backgroundColor: theme.palette._components.status.neutral.background,
-    color: theme.palette._components.status.neutral.color
-  } : void 0,
-  ...color2 === "disabled" ? {
-    backgroundColor: theme.palette._components.status.disabled.background,
-    color: theme.palette._components.status.disabled.color
-  } : void 0,
-  ...color2 === "info" ? {
-    backgroundColor: theme.palette._components.status.info.background,
-    color: theme.palette._components.status.info.color
-  } : void 0,
-  ...color2 === "orange" ? {
-    backgroundColor: theme.palette._components.status.orange.background,
-    color: theme.palette._components.status.orange.color
-  } : void 0,
-  ...color2 === "blue" ? {
-    backgroundColor: theme.palette._components.status.blue.background,
-    color: theme.palette._components.status.blue.color
-  } : void 0,
-  ...color2 === "primary" ? {
-    backgroundColor: theme.palette._components.status.primary.background,
-    color: theme.palette._components.status.primary.color
-  } : void 0
-}));
 exports.AppStatus = AppStatus;
 //# sourceMappingURL=app-status.js.map

package/dist/react/cjs/components/app-status.js.map

@@ -1 +1 @@
-{"version":3,"file":"app-status.js","sources":["../../../../src/components/app-status.tsx"],"sourcesContent":["import React from 'react';\n\nimport { styled, ChipProps, Chip, TooltipProps } from '@mui/material';\n\nimport { AppTooltip } from './app-tooltip';\n\n//\n//\n\nexport type AppStatusColor =\n  | 'primary'\n  | 'success'\n  | 'warning'\n  | 'error'\n  | 'neutral'\n  | 'default'\n  | 'disabled'\n  | 'info'\n  | 'orange'\n  | 'blue';\n\nexport type AppStatusProps = Omit<ChipProps, 'color' | 'variant' | 'size'> & {\n  size?: 'small' | 'medium';\n  color?: AppStatusColor;\n  tooltip?: TooltipProps['title'];\n  tooltipProps?: Omit<TooltipProps, 'title' | 'children'>;\n};\n\nexport const AppStatus: React.FC<AppStatusProps> = ({\n  ref,\n  color = 'neutral',\n  size = 'small',\n  tooltip,\n  tooltipProps,\n  ...props\n}) => {\n  if (color === 'default') color = 'neutral';\n\n  const element = <StatusElement color2={color} size={size} ref={ref} {...props} />;\n\n  //\n\n  if (!tooltip) return element;\n\n  return (\n    <AppTooltip description={tooltip} {...tooltipProps}>\n      {element}\n    </AppTooltip>\n  );\n};\n\nAppStatus.displayName = 'AppStatus';\n\n//\n\nconst StatusElement = styled(Chip, {\n  shouldForwardProp: prop => prop !== 'color2',\n})<{ color2?: AppStatusProps['color'] }>(({ theme, color2 = 'neutral' }) => ({\n  ...(color2 === 'success'\n    ? {\n        backgroundColor: theme.palette._components.status.success.background,\n        color: theme.palette._components.status.success.color,\n      }\n    : undefined),\n  ...(color2 === 'error'\n    ? {\n        backgroundColor: theme.palette._components.status.error.background,\n        color: theme.palette._components.status.error.color,\n      }\n    : undefined),\n  ...(color2 === 'warning'\n    ? {\n        backgroundColor: theme.palette._components.status.warning.background,\n        color: theme.palette._components.status.warning.color,\n      }\n    : undefined),\n  ...(color2 === 'neutral'\n    ? {\n        backgroundColor: theme.palette._components.status.neutral.background,\n        color: theme.palette._components.status.neutral.color,\n      }\n    : undefined),\n  ...(color2 === 'disabled'\n    ? {\n        backgroundColor: theme.palette._components.status.disabled.background,\n        color: theme.palette._components.status.disabled.color,\n      }\n    : undefined),\n  ...(color2 === 'info'\n    ? {\n        backgroundColor: theme.palette._components.status.info.background,\n        color: theme.palette._components.status.info.color,\n      }\n    : undefined),\n  ...(color2 === 'orange'\n    ? {\n        backgroundColor: theme.palette._components.status.orange.background,\n        color: theme.palette._components.status.orange.color,\n      }\n    : undefined),\n  ...(color2 === 'blue'\n    ? {\n        backgroundColor: theme.palette._components.status.blue.background,\n        color: theme.palette._components.status.blue.color,\n      }\n    : undefined),\n  ...(color2 === 'primary'\n    ? {\n        backgroundColor: theme.palette._components.status.primary.background,\n        color: theme.palette._components.status.primary.color,\n      }\n    : undefined),\n}));\n"],"names":["AppTooltip","styled","Chip"],"mappings":";;;;;AA4BO,MAAM,YAAsC,CAAC;AAAA,EAClD;AAAA,EACA,QAAQ;AAAA,EACR,OAAO;AAAA,EACP;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAM;AACJ,MAAI,UAAU,UAAW,SAAQ;AAEjC,QAAM,yCAAW,eAAA,EAAc,QAAQ,OAAO,MAAY,KAAW,GAAG,OAAO;AAI/E,MAAI,CAAC,QAAS,QAAO;AAErB,wCACGA,WAAAA,YAAA,EAAW,aAAa,SAAU,GAAG,cACnC,UAAA,SACH;AAEJ;AAEA,UAAU,cAAc;AAIxB,MAAM,gBAAgBC,SAAAA,OAAOC,eAAM;AAAA,EACjC,mBAAmB,UAAQ,SAAS;AACtC,CAAC,EAAwC,CAAC,EAAE,OAAO,SAAS,iBAAiB;AAAA,EAC3E,GAAI,WAAW,YACX;AAAA,IACE,iBAAiB,MAAM,QAAQ,YAAY,OAAO,QAAQ;AAAA,IAC1D,OAAO,MAAM,QAAQ,YAAY,OAAO,QAAQ;AAAA,EAAA,IAElD;AAAA,EACJ,GAAI,WAAW,UACX;AAAA,IACE,iBAAiB,MAAM,QAAQ,YAAY,OAAO,MAAM;AAAA,IACxD,OAAO,MAAM,QAAQ,YAAY,OAAO,MAAM;AAAA,EAAA,IAEhD;AAAA,EACJ,GAAI,WAAW,YACX;AAAA,IACE,iBAAiB,MAAM,QAAQ,YAAY,OAAO,QAAQ;AAAA,IAC1D,OAAO,MAAM,QAAQ,YAAY,OAAO,QAAQ;AAAA,EAAA,IAElD;AAAA,EACJ,GAAI,WAAW,YACX;AAAA,IACE,iBAAiB,MAAM,QAAQ,YAAY,OAAO,QAAQ;AAAA,IAC1D,OAAO,MAAM,QAAQ,YAAY,OAAO,QAAQ;AAAA,EAAA,IAElD;AAAA,EACJ,GAAI,WAAW,aACX;AAAA,IACE,iBAAiB,MAAM,QAAQ,YAAY,OAAO,SAAS;AAAA,IAC3D,OAAO,MAAM,QAAQ,YAAY,OAAO,SAAS;AAAA,EAAA,IAEnD;AAAA,EACJ,GAAI,WAAW,SACX;AAAA,IACE,iBAAiB,MAAM,QAAQ,YAAY,OAAO,KAAK;AAAA,IACvD,OAAO,MAAM,QAAQ,YAAY,OAAO,KAAK;AAAA,EAAA,IAE/C;AAAA,EACJ,GAAI,WAAW,WACX;AAAA,IACE,iBAAiB,MAAM,QAAQ,YAAY,OAAO,OAAO;AAAA,IACzD,OAAO,MAAM,QAAQ,YAAY,OAAO,OAAO;AAAA,EAAA,IAEjD;AAAA,EACJ,GAAI,WAAW,SACX;AAAA,IACE,iBAAiB,MAAM,QAAQ,YAAY,OAAO,KAAK;AAAA,IACvD,OAAO,MAAM,QAAQ,YAAY,OAAO,KAAK;AAAA,EAAA,IAE/C;AAAA,EACJ,GAAI,WAAW,YACX;AAAA,IACE,iBAAiB,MAAM,QAAQ,YAAY,OAAO,QAAQ;AAAA,IAC1D,OAAO,MAAM,QAAQ,YAAY,OAAO,QAAQ;AAAA,EAAA,IAElD;AACN,EAAE;;"}
+{"version":3,"file":"app-status.js","sources":["../../../../src/components/app-status.tsx"],"sourcesContent":["import React from 'react';\n\nimport { ChipProps, Chip, TooltipProps } from '@mui/material';\n\nimport { AppTooltip } from './app-tooltip';\n\n//\n//\n\nexport type AppStatusProps = Omit<ChipProps, 'size'> & {\n  size?: 'small' | 'medium';\n  tooltip?: TooltipProps['title'];\n  tooltipProps?: Omit<TooltipProps, 'title' | 'children'>;\n};\n\nexport const AppStatus: React.FC<AppStatusProps> = ({\n  ref,\n  color = 'neutral',\n  size = 'small',\n  tooltip,\n  tooltipProps,\n  ...props\n}) => {\n  const element = <Chip color={color} size={size} ref={ref} {...props} />;\n\n  //\n\n  if (!tooltip) return element;\n\n  return (\n    <AppTooltip description={tooltip} {...tooltipProps}>\n      {element}\n    </AppTooltip>\n  );\n};\n"],"names":["jsx","Chip","AppTooltip"],"mappings":";;;;;AAeO,MAAM,YAAsC,CAAC;AAAA,EAClD;AAAA,EACA,QAAQ;AAAA,EACR,OAAO;AAAA,EACP;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAM;AACJ,QAAM,UAAUA,2BAAAA,IAACC,eAAA,EAAK,OAAc,MAAY,KAAW,GAAG,OAAO;AAIrE,MAAI,CAAC,QAAS,QAAO;AAErB,wCACGC,WAAAA,YAAA,EAAW,aAAa,SAAU,GAAG,cACnC,UAAA,SACH;AAEJ;;"}

package/dist/react/cjs/theme/components/accordion.js

@@ -100,6 +100,7 @@ const MuiAccordionDetails = {
       flexDirection: "column",
       gap: theme.spacing(1.5),
       background: theme.palette.background.paper,
+      border: `1px solid ${theme.palette.divider}`,
       padding: theme.spacing(2),
       marginInline: theme.spacing(0.5),
       marginBottom: theme.spacing(0.5),

package/dist/react/cjs/theme/components/accordion.js.map

@@ -1 +1 @@
-{"version":3,"file":"accordion.js","sources":["../../../../../src/theme/components/accordion.ts"],"sourcesContent":["import { Components, CssVarsTheme, Theme } from '@mui/material';\n\n//\n//\n\nexport const MuiAccordion: Components<\n  Omit<Theme, 'components' | 'palette'> & CssVarsTheme\n>['MuiAccordion'] = {\n  defaultProps: {\n    disableGutters: true,\n    elevation: 0,\n  },\n  styleOverrides: {\n    root: ({ theme }) => ({\n      border: `1px solid ${theme.palette.divider}`,\n      backgroundColor: theme.palette.background.paper,\n      overflow: 'hidden',\n      '&.Mui-disabled': {\n        backgroundColor: theme.palette.action.disabledBackground,\n      },\n      ':first-of-type': {\n        borderTopLeftRadius: theme.spacing(2),\n        borderTopRightRadius: theme.spacing(2),\n      },\n      ':last-of-type': {\n        borderBottomLeftRadius: theme.spacing(2),\n        borderBottomRightRadius: theme.spacing(2),\n      },\n      '&[data-rounded-corners=\"all\"]': {\n        borderRadius: theme.spacing(2),\n      },\n    }),\n  },\n  variants: [\n    {\n      props: { color: 'primary' },\n      style: ({ theme }) => ({\n        '&.Mui-expanded': {\n          backgroundColor: theme.palette._components.accordion.primary.background,\n          borderColor: theme.palette._components.accordion.primary.border,\n        },\n      }),\n    },\n    {\n      props: { color: 'success' },\n      style: ({ theme }) => ({\n        '&.Mui-expanded': {\n          backgroundColor: theme.palette._components.accordion.success.background,\n          borderColor: theme.palette._components.accordion.success.border,\n        },\n      }),\n    },\n    {\n      props: { color: 'error' },\n      style: ({ theme }) => ({\n        '&.Mui-expanded': {\n          backgroundColor: theme.palette._components.accordion.error.background,\n          borderColor: theme.palette._components.accordion.error.border,\n        },\n      }),\n    },\n    {\n      props: { color: 'warning' },\n      style: ({ theme }) => ({\n        '&.Mui-expanded': {\n          backgroundColor: theme.palette._components.accordion.warning.background,\n          borderColor: theme.palette._components.accordion.warning.border,\n        },\n      }),\n    },\n    {\n      props: { color: 'info' },\n      style: ({ theme }) => ({\n        '&.Mui-expanded': {\n          backgroundColor: theme.palette._components.accordion.info.background,\n          borderColor: theme.palette._components.accordion.info.border,\n        },\n      }),\n    },\n    {\n      props: { color: 'neutral' },\n      style: ({ theme }) => ({\n        '&.Mui-expanded': {\n          backgroundColor: theme.palette._components.accordion.neutral.background,\n          borderColor: theme.palette._components.accordion.neutral.border,\n        },\n      }),\n    },\n  ],\n};\n\nexport const MuiAccordionSummary: Components<\n  Omit<Theme, 'components' | 'palette'> & CssVarsTheme\n>['MuiAccordionSummary'] = {\n  styleOverrides: {\n    root: ({ theme }) => ({\n      marginInline: theme.spacing(0.5),\n    }),\n    content: ({ theme }) => ({\n      marginBlock: theme.spacing(2),\n    }),\n  },\n};\n\nexport const MuiAccordionDetails: Components<\n  Omit<Theme, 'components' | 'palette'> & CssVarsTheme\n>['MuiAccordionDetails'] = {\n  styleOverrides: {\n    root: ({ theme }) => ({\n      display: 'flex',\n      flexDirection: 'column',\n      gap: theme.spacing(1.5),\n      background: theme.palette.background.paper,\n      padding: theme.spacing(2),\n      marginInline: theme.spacing(0.5),\n      marginBottom: theme.spacing(0.5),\n      borderBottomLeftRadius: theme.spacing(1.5),\n      borderBottomRightRadius: theme.spacing(1.5),\n      '.MuiAccordion-root[data-color] &': {\n        borderRadius: theme.spacing(1.5),\n        marginTop: '-2px',\n      },\n      // When parent Accordion has no color\n      '.MuiAccordion-root:not([data-color]) &': {\n        borderTop: `1px solid ${theme.palette.divider}`,\n        marginTop: 0,\n      },\n      '.Mui-disabled &': {\n        opacity: 0.5,\n      },\n    }),\n  },\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"accordion.js","sources":["../../../../../src/theme/components/accordion.ts"],"sourcesContent":["import { Components, CssVarsTheme, Theme } from '@mui/material';\n\n//\n//\n\nexport const MuiAccordion: Components<\n  Omit<Theme, 'components' | 'palette'> & CssVarsTheme\n>['MuiAccordion'] = {\n  defaultProps: {\n    disableGutters: true,\n    elevation: 0,\n  },\n  styleOverrides: {\n    root: ({ theme }) => ({\n      border: `1px solid ${theme.palette.divider}`,\n      backgroundColor: theme.palette.background.paper,\n      overflow: 'hidden',\n      '&.Mui-disabled': {\n        backgroundColor: theme.palette.action.disabledBackground,\n      },\n      ':first-of-type': {\n        borderTopLeftRadius: theme.spacing(2),\n        borderTopRightRadius: theme.spacing(2),\n      },\n      ':last-of-type': {\n        borderBottomLeftRadius: theme.spacing(2),\n        borderBottomRightRadius: theme.spacing(2),\n      },\n      '&[data-rounded-corners=\"all\"]': {\n        borderRadius: theme.spacing(2),\n      },\n    }),\n  },\n  variants: [\n    {\n      props: { color: 'primary' },\n      style: ({ theme }) => ({\n        '&.Mui-expanded': {\n          backgroundColor: theme.palette._components.accordion.primary.background,\n          borderColor: theme.palette._components.accordion.primary.border,\n        },\n      }),\n    },\n    {\n      props: { color: 'success' },\n      style: ({ theme }) => ({\n        '&.Mui-expanded': {\n          backgroundColor: theme.palette._components.accordion.success.background,\n          borderColor: theme.palette._components.accordion.success.border,\n        },\n      }),\n    },\n    {\n      props: { color: 'error' },\n      style: ({ theme }) => ({\n        '&.Mui-expanded': {\n          backgroundColor: theme.palette._components.accordion.error.background,\n          borderColor: theme.palette._components.accordion.error.border,\n        },\n      }),\n    },\n    {\n      props: { color: 'warning' },\n      style: ({ theme }) => ({\n        '&.Mui-expanded': {\n          backgroundColor: theme.palette._components.accordion.warning.background,\n          borderColor: theme.palette._components.accordion.warning.border,\n        },\n      }),\n    },\n    {\n      props: { color: 'info' },\n      style: ({ theme }) => ({\n        '&.Mui-expanded': {\n          backgroundColor: theme.palette._components.accordion.info.background,\n          borderColor: theme.palette._components.accordion.info.border,\n        },\n      }),\n    },\n    {\n      props: { color: 'neutral' },\n      style: ({ theme }) => ({\n        '&.Mui-expanded': {\n          backgroundColor: theme.palette._components.accordion.neutral.background,\n          borderColor: theme.palette._components.accordion.neutral.border,\n        },\n      }),\n    },\n  ],\n};\n\nexport const MuiAccordionSummary: Components<\n  Omit<Theme, 'components' | 'palette'> & CssVarsTheme\n>['MuiAccordionSummary'] = {\n  styleOverrides: {\n    root: ({ theme }) => ({\n      marginInline: theme.spacing(0.5),\n    }),\n    content: ({ theme }) => ({\n      marginBlock: theme.spacing(2),\n    }),\n  },\n};\n\nexport const MuiAccordionDetails: Components<\n  Omit<Theme, 'components' | 'palette'> & CssVarsTheme\n>['MuiAccordionDetails'] = {\n  styleOverrides: {\n    root: ({ theme }) => ({\n      display: 'flex',\n      flexDirection: 'column',\n      gap: theme.spacing(1.5),\n      background: theme.palette.background.paper,\n      border: `1px solid ${theme.palette.divider}`,\n      padding: theme.spacing(2),\n      marginInline: theme.spacing(0.5),\n      marginBottom: theme.spacing(0.5),\n      borderBottomLeftRadius: theme.spacing(1.5),\n      borderBottomRightRadius: theme.spacing(1.5),\n      '.MuiAccordion-root[data-color] &': {\n        borderRadius: theme.spacing(1.5),\n        marginTop: '-2px',\n      },\n      // When parent Accordion has no color\n      '.MuiAccordion-root:not([data-color]) &': {\n        borderTop: `1px solid ${theme.palette.divider}`,\n        marginTop: 0,\n      },\n      '.Mui-disabled &': {\n        opacity: 0.5,\n      },\n    }),\n  },\n};\n"],"names":[],"mappings":"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"}

package/dist/react/cjs/theme/components/card.js

@@ -1,21 +1,32 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const coloredCardContentStyle = (theme) => ({
+  "& .MuiCardContent-root": {
+    padding: 16,
+    background: theme.palette.colors.base.white,
+    border: `1px solid ${theme.palette.divider}`
+  }
+});
 const MuiCard = {
   styleOverrides: {
     root: ({ theme }) => ({
-      borderRadius: 16,
-      "& > .MuiCardContent-root:last-child": {
-        paddingBottom: 16
+      borderRadius: theme.shape.standardBorderRadius,
+      border: `1px solid ${theme.palette.divider}`,
+      backgroundColor: theme.palette.background.paper,
+      overflow: "hidden",
+      "& .MuiCardContent-root:last-child": {
+        paddingBottom: 16,
+        borderRadius: theme.shape.standardBorderRadius
       },
-      "& .MuiCardContent-root .MuiCardContent-root": {
-        borderRadius: 8,
-        border: `1px solid ${theme.palette.outlined?.outlined_2}`,
-        padding: 16
+      "& .MuiCardContent-root": {
+        padding: 9,
+        borderRadius: theme.spacing(2),
+        margin: `0 ${theme.spacing(0.6)} ${theme.spacing(0.6)}`
       },
       "& .MuiCardContent-root .MuiCardContent-root .MuiCardContent-root": {
+        border: "none",
         borderRadius: 4,
-        backgroundColor: theme.palette.background.gray,
-        border: "none"
+        backgroundColor: theme.palette.background.gray
       },
       form: {
         marginBottom: 0
@@ -25,7 +36,57 @@ const MuiCard = {
         paddingBottom: 0
       }
     })
-  }
+  },
+  variants: [
+    {
+      props: { color: "primary" },
+      style: ({ theme }) => ({
+        borderColor: theme.palette._components.card.primary.border,
+        backgroundColor: theme.palette._components.card.primary.background,
+        ...coloredCardContentStyle(theme)
+      })
+    },
+    {
+      props: { color: "success" },
+      style: ({ theme }) => ({
+        borderColor: theme.palette._components.card.success.border,
+        backgroundColor: theme.palette._components.card.success.background,
+        ...coloredCardContentStyle(theme)
+      })
+    },
+    {
+      props: { color: "error" },
+      style: ({ theme }) => ({
+        borderColor: theme.palette._components.card.error.border,
+        backgroundColor: theme.palette._components.card.error.background,
+        ...coloredCardContentStyle(theme)
+      })
+    },
+    {
+      props: { color: "warning" },
+      style: ({ theme }) => ({
+        borderColor: theme.palette._components.card.warning.border,
+        backgroundColor: theme.palette._components.card.warning.background,
+        ...coloredCardContentStyle(theme)
+      })
+    },
+    {
+      props: { color: "info" },
+      style: ({ theme }) => ({
+        borderColor: theme.palette._components.card.info.border,
+        backgroundColor: theme.palette._components.card.info.background,
+        ...coloredCardContentStyle(theme)
+      })
+    },
+    {
+      props: { color: "neutral" },
+      style: ({ theme }) => ({
+        borderColor: theme.palette._components.card.neutral.border,
+        backgroundColor: theme.palette._components.card.neutral.background,
+        ...coloredCardContentStyle(theme)
+      })
+    }
+  ]
 };
 exports.MuiCard = MuiCard;
 //# sourceMappingURL=card.js.map

package/dist/react/cjs/theme/components/card.js.map

@@ -1 +1 @@
-{"version":3,"file":"card.js","sources":["../../../../../src/theme/components/card.ts"],"sourcesContent":["import type {} from '@mui/lab/themeAugmentation';\nimport { Components, CssVarsTheme, Theme } from '@mui/material';\n\n//\n//\n\nexport const MuiCard: Components<Omit<Theme, 'components' | 'palette'> & CssVarsTheme>['MuiCard'] =\n  {\n    styleOverrides: {\n      root: ({ theme }) => ({\n        borderRadius: 16,\n\n        '& > .MuiCardContent-root:last-child': {\n          paddingBottom: 16,\n        },\n\n        '& .MuiCardContent-root .MuiCardContent-root': {\n          borderRadius: 8,\n          border: `1px solid ${theme.palette.outlined?.outlined_2}`,\n          padding: 16,\n        },\n\n        '& .MuiCardContent-root .MuiCardContent-root .MuiCardContent-root': {\n          borderRadius: 4,\n          backgroundColor: theme.palette.background.gray,\n          border: 'none',\n        },\n\n        form: {\n          marginBottom: 0,\n        },\n\n        '& .MuiList-root:last-child  .MuiListItem-root:last-of-type': {\n          borderBottom: 'none',\n          paddingBottom: 0,\n        },\n      }),\n    },\n  };\n"],"names":[],"mappings":";;AAMO,MAAM,UACX;AAAA,EACE,gBAAgB;AAAA,IACd,MAAM,CAAC,EAAE,aAAa;AAAA,MACpB,cAAc;AAAA,MAEd,uCAAuC;AAAA,QACrC,eAAe;AAAA,MAAA;AAAA,MAGjB,+CAA+C;AAAA,QAC7C,cAAc;AAAA,QACd,QAAQ,aAAa,MAAM,QAAQ,UAAU,UAAU;AAAA,QACvD,SAAS;AAAA,MAAA;AAAA,MAGX,oEAAoE;AAAA,QAClE,cAAc;AAAA,QACd,iBAAiB,MAAM,QAAQ,WAAW;AAAA,QAC1C,QAAQ;AAAA,MAAA;AAAA,MAGV,MAAM;AAAA,QACJ,cAAc;AAAA,MAAA;AAAA,MAGhB,8DAA8D;AAAA,QAC5D,cAAc;AAAA,QACd,eAAe;AAAA,MAAA;AAAA,IACjB;AAAA,EACF;AAEJ;;"}
+{"version":3,"file":"card.js","sources":["../../../../../src/theme/components/card.ts"],"sourcesContent":["import type {} from '@mui/lab/themeAugmentation';\nimport { Components, CssVarsTheme, Theme } from '@mui/material';\n\n//\n//\n\nconst coloredCardContentStyle = (theme: Theme) => ({\n  '& .MuiCardContent-root': {\n    padding: 16,\n    background: theme.palette.colors.base.white,\n    border: `1px solid ${theme.palette.divider}`,\n  },\n});\n\nexport const MuiCard: Components<Omit<Theme, 'components' | 'palette'> & CssVarsTheme>['MuiCard'] =\n  {\n    styleOverrides: {\n      root: ({ theme }) => ({\n        borderRadius: theme.shape.standardBorderRadius,\n        border: `1px solid ${theme.palette.divider}`,\n        backgroundColor: theme.palette.background.paper,\n        overflow: 'hidden',\n\n        '& .MuiCardContent-root:last-child': {\n          paddingBottom: 16,\n          borderRadius: theme.shape.standardBorderRadius,\n        },\n\n        '& .MuiCardContent-root': {\n          padding: 9,\n          borderRadius: theme.spacing(2),\n          margin: `0 ${theme.spacing(0.6)} ${theme.spacing(0.6)}`,\n        },\n\n        '& .MuiCardContent-root .MuiCardContent-root .MuiCardContent-root': {\n          border: 'none',\n          borderRadius: 4,\n          backgroundColor: theme.palette.background.gray,\n        },\n\n        form: {\n          marginBottom: 0,\n        },\n\n        '& .MuiList-root:last-child  .MuiListItem-root:last-of-type': {\n          borderBottom: 'none',\n          paddingBottom: 0,\n        },\n      }),\n    },\n    variants: [\n      {\n        props: { color: 'primary' },\n        style: ({ theme }) => ({\n          borderColor: theme.palette._components.card.primary.border,\n          backgroundColor: theme.palette._components.card.primary.background,\n          ...coloredCardContentStyle(theme),\n        }),\n      },\n      {\n        props: { color: 'success' },\n        style: ({ theme }) => ({\n          borderColor: theme.palette._components.card.success.border,\n          backgroundColor: theme.palette._components.card.success.background,\n          ...coloredCardContentStyle(theme),\n        }),\n      },\n      {\n        props: { color: 'error' },\n        style: ({ theme }) => ({\n          borderColor: theme.palette._components.card.error.border,\n          backgroundColor: theme.palette._components.card.error.background,\n          ...coloredCardContentStyle(theme),\n        }),\n      },\n      {\n        props: { color: 'warning' },\n        style: ({ theme }) => ({\n          borderColor: theme.palette._components.card.warning.border,\n          backgroundColor: theme.palette._components.card.warning.background,\n          ...coloredCardContentStyle(theme),\n        }),\n      },\n      {\n        props: { color: 'info' },\n        style: ({ theme }) => ({\n          borderColor: theme.palette._components.card.info.border,\n          backgroundColor: theme.palette._components.card.info.background,\n          ...coloredCardContentStyle(theme),\n        }),\n      },\n      {\n        props: { color: 'neutral' },\n        style: ({ theme }) => ({\n          borderColor: theme.palette._components.card.neutral.border,\n          backgroundColor: theme.palette._components.card.neutral.background,\n          ...coloredCardContentStyle(theme),\n        }),\n      },\n    ],\n  };\n"],"names":[],"mappings":";;AAMA,MAAM,0BAA0B,CAAC,WAAkB;AAAA,EACjD,0BAA0B;AAAA,IACxB,SAAS;AAAA,IACT,YAAY,MAAM,QAAQ,OAAO,KAAK;AAAA,IACtC,QAAQ,aAAa,MAAM,QAAQ,OAAO;AAAA,EAAA;AAE9C;AAEO,MAAM,UACX;AAAA,EACE,gBAAgB;AAAA,IACd,MAAM,CAAC,EAAE,aAAa;AAAA,MACpB,cAAc,MAAM,MAAM;AAAA,MAC1B,QAAQ,aAAa,MAAM,QAAQ,OAAO;AAAA,MAC1C,iBAAiB,MAAM,QAAQ,WAAW;AAAA,MAC1C,UAAU;AAAA,MAEV,qCAAqC;AAAA,QACnC,eAAe;AAAA,QACf,cAAc,MAAM,MAAM;AAAA,MAAA;AAAA,MAG5B,0BAA0B;AAAA,QACxB,SAAS;AAAA,QACT,cAAc,MAAM,QAAQ,CAAC;AAAA,QAC7B,QAAQ,KAAK,MAAM,QAAQ,GAAG,CAAC,IAAI,MAAM,QAAQ,GAAG,CAAC;AAAA,MAAA;AAAA,MAGvD,oEAAoE;AAAA,QAClE,QAAQ;AAAA,QACR,cAAc;AAAA,QACd,iBAAiB,MAAM,QAAQ,WAAW;AAAA,MAAA;AAAA,MAG5C,MAAM;AAAA,QACJ,cAAc;AAAA,MAAA;AAAA,MAGhB,8DAA8D;AAAA,QAC5D,cAAc;AAAA,QACd,eAAe;AAAA,MAAA;AAAA,IACjB;AAAA,EACF;AAAA,EAEF,UAAU;AAAA,IACR;AAAA,MACE,OAAO,EAAE,OAAO,UAAA;AAAA,MAChB,OAAO,CAAC,EAAE,aAAa;AAAA,QACrB,aAAa,MAAM,QAAQ,YAAY,KAAK,QAAQ;AAAA,QACpD,iBAAiB,MAAM,QAAQ,YAAY,KAAK,QAAQ;AAAA,QACxD,GAAG,wBAAwB,KAAK;AAAA,MAAA;AAAA,IAClC;AAAA,IAEF;AAAA,MACE,OAAO,EAAE,OAAO,UAAA;AAAA,MAChB,OAAO,CAAC,EAAE,aAAa;AAAA,QACrB,aAAa,MAAM,QAAQ,YAAY,KAAK,QAAQ;AAAA,QACpD,iBAAiB,MAAM,QAAQ,YAAY,KAAK,QAAQ;AAAA,QACxD,GAAG,wBAAwB,KAAK;AAAA,MAAA;AAAA,IAClC;AAAA,IAEF;AAAA,MACE,OAAO,EAAE,OAAO,QAAA;AAAA,MAChB,OAAO,CAAC,EAAE,aAAa;AAAA,QACrB,aAAa,MAAM,QAAQ,YAAY,KAAK,MAAM;AAAA,QAClD,iBAAiB,MAAM,QAAQ,YAAY,KAAK,MAAM;AAAA,QACtD,GAAG,wBAAwB,KAAK;AAAA,MAAA;AAAA,IAClC;AAAA,IAEF;AAAA,MACE,OAAO,EAAE,OAAO,UAAA;AAAA,MAChB,OAAO,CAAC,EAAE,aAAa;AAAA,QACrB,aAAa,MAAM,QAAQ,YAAY,KAAK,QAAQ;AAAA,QACpD,iBAAiB,MAAM,QAAQ,YAAY,KAAK,QAAQ;AAAA,QACxD,GAAG,wBAAwB,KAAK;AAAA,MAAA;AAAA,IAClC;AAAA,IAEF;AAAA,MACE,OAAO,EAAE,OAAO,OAAA;AAAA,MAChB,OAAO,CAAC,EAAE,aAAa;AAAA,QACrB,aAAa,MAAM,QAAQ,YAAY,KAAK,KAAK;AAAA,QACjD,iBAAiB,MAAM,QAAQ,YAAY,KAAK,KAAK;AAAA,QACrD,GAAG,wBAAwB,KAAK;AAAA,MAAA;AAAA,IAClC;AAAA,IAEF;AAAA,MACE,OAAO,EAAE,OAAO,UAAA;AAAA,MAChB,OAAO,CAAC,EAAE,aAAa;AAAA,QACrB,aAAa,MAAM,QAAQ,YAAY,KAAK,QAAQ;AAAA,QACpD,iBAAiB,MAAM,QAAQ,YAAY,KAAK,QAAQ;AAAA,QACxD,GAAG,wBAAwB,KAAK;AAAA,MAAA;AAAA,IAClC;AAAA,EACF;AAEJ;;"}

package/dist/react/cjs/theme/components/chip.js

@@ -18,6 +18,157 @@ const MuiChip = {
             fontSize: "0.75rem",
             lineHeight: "1.125rem"
           }
+        },
+        // Status colors
+        {
+          props: { color: "success" },
+          style: {
+            backgroundColor: theme.palette._components.status.success.background,
+            color: theme.palette._components.status.success.color
+          }
+        },
+        {
+          props: { color: "success", variant: "outlined" },
+          style: {
+            backgroundColor: "transparent",
+            color: theme.palette._components.status.success.outlined,
+            borderColor: theme.palette._components.status.success.outlined
+          }
+        },
+        {
+          props: { color: "error" },
+          style: {
+            backgroundColor: theme.palette._components.status.error.background,
+            color: theme.palette._components.status.error.color
+          }
+        },
+        {
+          props: { color: "error", variant: "outlined" },
+          style: {
+            backgroundColor: "transparent",
+            color: theme.palette._components.status.error.outlined,
+            borderColor: theme.palette._components.status.error.outlined
+          }
+        },
+        {
+          props: { color: "warning" },
+          style: {
+            backgroundColor: theme.palette._components.status.warning.background,
+            color: theme.palette._components.status.warning.color
+          }
+        },
+        {
+          props: { color: "warning", variant: "outlined" },
+          style: {
+            backgroundColor: "transparent",
+            color: theme.palette._components.status.warning.outlined,
+            borderColor: theme.palette._components.status.warning.outlined
+          }
+        },
+        {
+          props: { color: "info" },
+          style: {
+            backgroundColor: theme.palette._components.status.info.background,
+            color: theme.palette._components.status.info.color
+          }
+        },
+        {
+          props: { color: "info", variant: "outlined" },
+          style: {
+            backgroundColor: "transparent",
+            color: theme.palette._components.status.info.color,
+            borderColor: theme.palette._components.status.info.color
+          }
+        },
+        {
+          props: { color: "primary" },
+          style: {
+            backgroundColor: theme.palette._components.status.primary.background,
+            color: theme.palette._components.status.primary.color
+          }
+        },
+        {
+          props: { color: "primary", variant: "outlined" },
+          style: {
+            backgroundColor: "transparent",
+            color: theme.palette._components.status.primary.outlined,
+            borderColor: theme.palette._components.status.primary.outlined
+          }
+        },
+        {
+          props: { color: "disabled" },
+          style: {
+            backgroundColor: theme.palette._components.status.disabled.background,
+            color: theme.palette._components.status.disabled.color
+          }
+        },
+        {
+          props: { color: "disabled", variant: "outlined" },
+          style: {
+            backgroundColor: "transparent",
+            color: theme.palette._components.status.disabled.color,
+            borderColor: theme.palette._components.status.disabled.color
+          }
+        },
+        {
+          props: { color: "default" },
+          style: {
+            backgroundColor: theme.palette._components.status.neutral.background,
+            color: theme.palette._components.status.neutral.color
+          }
+        },
+        {
+          props: { color: "default", variant: "outlined" },
+          style: {
+            backgroundColor: "transparent",
+            color: theme.palette._components.status.neutral.color,
+            borderColor: theme.palette._components.status.neutral.color
+          }
+        },
+        {
+          props: { color: "neutral" },
+          style: {
+            backgroundColor: theme.palette._components.status.neutral.background,
+            color: theme.palette._components.status.neutral.color
+          }
+        },
+        {
+          props: { color: "neutral", variant: "outlined" },
+          style: {
+            backgroundColor: "transparent",
+            color: theme.palette._components.status.neutral.color,
+            borderColor: theme.palette._components.status.neutral.color
+          }
+        },
+        {
+          props: { color: "orange" },
+          style: {
+            backgroundColor: theme.palette._components.status.orange.background,
+            color: theme.palette._components.status.orange.color
+          }
+        },
+        {
+          props: { color: "orange", variant: "outlined" },
+          style: {
+            backgroundColor: "transparent",
+            color: theme.palette._components.status.orange.color,
+            borderColor: theme.palette._components.status.orange.color
+          }
+        },
+        {
+          props: { color: "blue" },
+          style: {
+            backgroundColor: theme.palette._components.status.blue.background,
+            color: theme.palette._components.status.blue.color
+          }
+        },
+        {
+          props: { color: "blue", variant: "outlined" },
+          style: {
+            backgroundColor: "transparent",
+            color: theme.palette._components.status.blue.color,
+            borderColor: theme.palette._components.status.blue.color
+          }
         }
       ]
     })

package/dist/react/cjs/theme/components/chip.js.map

@@ -1 +1 @@
-{"version":3,"file":"chip.js","sources":["../../../../../src/theme/components/chip.ts"],"sourcesContent":["import { Components, CssVarsTheme, Theme } from '@mui/material';\n\n//\n//\n\nexport const MuiChip: Components<Theme & CssVarsTheme>['MuiChip'] = {\n  styleOverrides: {\n    root: ({ theme }) => ({\n      minWidth: theme.spacing(7.5),\n      variants: [\n        {\n          props: { size: 'small' },\n          style: {\n            fontSize: '0.75rem',\n            lineHeight: '1.125rem',\n          },\n        },\n        {\n          props: { size: 'medium' },\n          style: {\n            fontSize: '0.75rem',\n            lineHeight: '1.125rem',\n          },\n        },\n      ],\n    }),\n  },\n};\n"],"names":[],"mappings":";;AAKO,MAAM,UAAuD;AAAA,EAClE,gBAAgB;AAAA,IACd,MAAM,CAAC,EAAE,aAAa;AAAA,MACpB,UAAU,MAAM,QAAQ,GAAG;AAAA,MAC3B,UAAU;AAAA,QACR;AAAA,UACE,OAAO,EAAE,MAAM,QAAA;AAAA,UACf,OAAO;AAAA,YACL,UAAU;AAAA,YACV,YAAY;AAAA,UAAA;AAAA,QACd;AAAA,QAEF;AAAA,UACE,OAAO,EAAE,MAAM,SAAA;AAAA,UACf,OAAO;AAAA,YACL,UAAU;AAAA,YACV,YAAY;AAAA,UAAA;AAAA,QACd;AAAA,MACF;AAAA,IACF;AAAA,EACF;AAEJ;;"}
+{"version":3,"file":"chip.js","sources":["../../../../../src/theme/components/chip.ts"],"sourcesContent":["import { Components, CssVarsTheme, Theme } from '@mui/material';\n\n//\n//\n\nexport const MuiChip: Components<Theme & CssVarsTheme>['MuiChip'] = {\n  styleOverrides: {\n    root: ({ theme }) => ({\n      minWidth: theme.spacing(7.5),\n      variants: [\n        {\n          props: { size: 'small' },\n          style: {\n            fontSize: '0.75rem',\n            lineHeight: '1.125rem',\n          },\n        },\n        {\n          props: { size: 'medium' },\n          style: {\n            fontSize: '0.75rem',\n            lineHeight: '1.125rem',\n          },\n        },\n        // Status colors\n        {\n          props: { color: 'success' },\n          style: {\n            backgroundColor: theme.palette._components.status.success.background,\n            color: theme.palette._components.status.success.color,\n          },\n        },\n        {\n          props: { color: 'success', variant: 'outlined' },\n          style: {\n            backgroundColor: 'transparent',\n            color: theme.palette._components.status.success.outlined,\n            borderColor: theme.palette._components.status.success.outlined,\n          },\n        },\n        {\n          props: { color: 'error' },\n          style: {\n            backgroundColor: theme.palette._components.status.error.background,\n            color: theme.palette._components.status.error.color,\n          },\n        },\n        {\n          props: { color: 'error', variant: 'outlined' },\n          style: {\n            backgroundColor: 'transparent',\n            color: theme.palette._components.status.error.outlined,\n            borderColor: theme.palette._components.status.error.outlined,\n          },\n        },\n        {\n          props: { color: 'warning' },\n          style: {\n            backgroundColor: theme.palette._components.status.warning.background,\n            color: theme.palette._components.status.warning.color,\n          },\n        },\n        {\n          props: { color: 'warning', variant: 'outlined' },\n          style: {\n            backgroundColor: 'transparent',\n            color: theme.palette._components.status.warning.outlined,\n            borderColor: theme.palette._components.status.warning.outlined,\n          },\n        },\n        {\n          props: { color: 'info' },\n          style: {\n            backgroundColor: theme.palette._components.status.info.background,\n            color: theme.palette._components.status.info.color,\n          },\n        },\n        {\n          props: { color: 'info', variant: 'outlined' },\n          style: {\n            backgroundColor: 'transparent',\n            color: theme.palette._components.status.info.color,\n            borderColor: theme.palette._components.status.info.color,\n          },\n        },\n        {\n          props: { color: 'primary' },\n          style: {\n            backgroundColor: theme.palette._components.status.primary.background,\n            color: theme.palette._components.status.primary.color,\n          },\n        },\n        {\n          props: { color: 'primary', variant: 'outlined' },\n          style: {\n            backgroundColor: 'transparent',\n            color: theme.palette._components.status.primary.outlined,\n            borderColor: theme.palette._components.status.primary.outlined,\n          },\n        },\n        {\n          props: { color: 'disabled' },\n          style: {\n            backgroundColor: theme.palette._components.status.disabled.background,\n            color: theme.palette._components.status.disabled.color,\n          },\n        },\n        {\n          props: { color: 'disabled', variant: 'outlined' },\n          style: {\n            backgroundColor: 'transparent',\n            color: theme.palette._components.status.disabled.color,\n            borderColor: theme.palette._components.status.disabled.color,\n          },\n        },\n        {\n          props: { color: 'default' },\n          style: {\n            backgroundColor: theme.palette._components.status.neutral.background,\n            color: theme.palette._components.status.neutral.color,\n          },\n        },\n        {\n          props: { color: 'default', variant: 'outlined' },\n          style: {\n            backgroundColor: 'transparent',\n            color: theme.palette._components.status.neutral.color,\n            borderColor: theme.palette._components.status.neutral.color,\n          },\n        },\n        {\n          props: { color: 'neutral' },\n          style: {\n            backgroundColor: theme.palette._components.status.neutral.background,\n            color: theme.palette._components.status.neutral.color,\n          },\n        },\n        {\n          props: { color: 'neutral', variant: 'outlined' },\n          style: {\n            backgroundColor: 'transparent',\n            color: theme.palette._components.status.neutral.color,\n            borderColor: theme.palette._components.status.neutral.color,\n          },\n        },\n        {\n          props: { color: 'orange' },\n          style: {\n            backgroundColor: theme.palette._components.status.orange.background,\n            color: theme.palette._components.status.orange.color,\n          },\n        },\n        {\n          props: { color: 'orange', variant: 'outlined' },\n          style: {\n            backgroundColor: 'transparent',\n            color: theme.palette._components.status.orange.color,\n            borderColor: theme.palette._components.status.orange.color,\n          },\n        },\n        {\n          props: { color: 'blue' },\n          style: {\n            backgroundColor: theme.palette._components.status.blue.background,\n            color: theme.palette._components.status.blue.color,\n          },\n        },\n        {\n          props: { color: 'blue', variant: 'outlined' },\n          style: {\n            backgroundColor: 'transparent',\n            color: theme.palette._components.status.blue.color,\n            borderColor: theme.palette._components.status.blue.color,\n          },\n        },\n      ],\n    }),\n  },\n};\n"],"names":[],"mappings":";;AAKO,MAAM,UAAuD;AAAA,EAClE,gBAAgB;AAAA,IACd,MAAM,CAAC,EAAE,aAAa;AAAA,MACpB,UAAU,MAAM,QAAQ,GAAG;AAAA,MAC3B,UAAU;AAAA,QACR;AAAA,UACE,OAAO,EAAE,MAAM,QAAA;AAAA,UACf,OAAO;AAAA,YACL,UAAU;AAAA,YACV,YAAY;AAAA,UAAA;AAAA,QACd;AAAA,QAEF;AAAA,UACE,OAAO,EAAE,MAAM,SAAA;AAAA,UACf,OAAO;AAAA,YACL,UAAU;AAAA,YACV,YAAY;AAAA,UAAA;AAAA,QACd;AAAA;AAAA,QAGF;AAAA,UACE,OAAO,EAAE,OAAO,UAAA;AAAA,UAChB,OAAO;AAAA,YACL,iBAAiB,MAAM,QAAQ,YAAY,OAAO,QAAQ;AAAA,YAC1D,OAAO,MAAM,QAAQ,YAAY,OAAO,QAAQ;AAAA,UAAA;AAAA,QAClD;AAAA,QAEF;AAAA,UACE,OAAO,EAAE,OAAO,WAAW,SAAS,WAAA;AAAA,UACpC,OAAO;AAAA,YACL,iBAAiB;AAAA,YACjB,OAAO,MAAM,QAAQ,YAAY,OAAO,QAAQ;AAAA,YAChD,aAAa,MAAM,QAAQ,YAAY,OAAO,QAAQ;AAAA,UAAA;AAAA,QACxD;AAAA,QAEF;AAAA,UACE,OAAO,EAAE,OAAO,QAAA;AAAA,UAChB,OAAO;AAAA,YACL,iBAAiB,MAAM,QAAQ,YAAY,OAAO,MAAM;AAAA,YACxD,OAAO,MAAM,QAAQ,YAAY,OAAO,MAAM;AAAA,UAAA;AAAA,QAChD;AAAA,QAEF;AAAA,UACE,OAAO,EAAE,OAAO,SAAS,SAAS,WAAA;AAAA,UAClC,OAAO;AAAA,YACL,iBAAiB;AAAA,YACjB,OAAO,MAAM,QAAQ,YAAY,OAAO,MAAM;AAAA,YAC9C,aAAa,MAAM,QAAQ,YAAY,OAAO,MAAM;AAAA,UAAA;AAAA,QACtD;AAAA,QAEF;AAAA,UACE,OAAO,EAAE,OAAO,UAAA;AAAA,UAChB,OAAO;AAAA,YACL,iBAAiB,MAAM,QAAQ,YAAY,OAAO,QAAQ;AAAA,YAC1D,OAAO,MAAM,QAAQ,YAAY,OAAO,QAAQ;AAAA,UAAA;AAAA,QAClD;AAAA,QAEF;AAAA,UACE,OAAO,EAAE,OAAO,WAAW,SAAS,WAAA;AAAA,UACpC,OAAO;AAAA,YACL,iBAAiB;AAAA,YACjB,OAAO,MAAM,QAAQ,YAAY,OAAO,QAAQ;AAAA,YAChD,aAAa,MAAM,QAAQ,YAAY,OAAO,QAAQ;AAAA,UAAA;AAAA,QACxD;AAAA,QAEF;AAAA,UACE,OAAO,EAAE,OAAO,OAAA;AAAA,UAChB,OAAO;AAAA,YACL,iBAAiB,MAAM,QAAQ,YAAY,OAAO,KAAK;AAAA,YACvD,OAAO,MAAM,QAAQ,YAAY,OAAO,KAAK;AAAA,UAAA;AAAA,QAC/C;AAAA,QAEF;AAAA,UACE,OAAO,EAAE,OAAO,QAAQ,SAAS,WAAA;AAAA,UACjC,OAAO;AAAA,YACL,iBAAiB;AAAA,YACjB,OAAO,MAAM,QAAQ,YAAY,OAAO,KAAK;AAAA,YAC7C,aAAa,MAAM,QAAQ,YAAY,OAAO,KAAK;AAAA,UAAA;AAAA,QACrD;AAAA,QAEF;AAAA,UACE,OAAO,EAAE,OAAO,UAAA;AAAA,UAChB,OAAO;AAAA,YACL,iBAAiB,MAAM,QAAQ,YAAY,OAAO,QAAQ;AAAA,YAC1D,OAAO,MAAM,QAAQ,YAAY,OAAO,QAAQ;AAAA,UAAA;AAAA,QAClD;AAAA,QAEF;AAAA,UACE,OAAO,EAAE,OAAO,WAAW,SAAS,WAAA;AAAA,UACpC,OAAO;AAAA,YACL,iBAAiB;AAAA,YACjB,OAAO,MAAM,QAAQ,YAAY,OAAO,QAAQ;AAAA,YAChD,aAAa,MAAM,QAAQ,YAAY,OAAO,QAAQ;AAAA,UAAA;AAAA,QACxD;AAAA,QAEF;AAAA,UACE,OAAO,EAAE,OAAO,WAAA;AAAA,UAChB,OAAO;AAAA,YACL,iBAAiB,MAAM,QAAQ,YAAY,OAAO,SAAS;AAAA,YAC3D,OAAO,MAAM,QAAQ,YAAY,OAAO,SAAS;AAAA,UAAA;AAAA,QACnD;AAAA,QAEF;AAAA,UACE,OAAO,EAAE,OAAO,YAAY,SAAS,WAAA;AAAA,UACrC,OAAO;AAAA,YACL,iBAAiB;AAAA,YACjB,OAAO,MAAM,QAAQ,YAAY,OAAO,SAAS;AAAA,YACjD,aAAa,MAAM,QAAQ,YAAY,OAAO,SAAS;AAAA,UAAA;AAAA,QACzD;AAAA,QAEF;AAAA,UACE,OAAO,EAAE,OAAO,UAAA;AAAA,UAChB,OAAO;AAAA,YACL,iBAAiB,MAAM,QAAQ,YAAY,OAAO,QAAQ;AAAA,YAC1D,OAAO,MAAM,QAAQ,YAAY,OAAO,QAAQ;AAAA,UAAA;AAAA,QAClD;AAAA,QAEF;AAAA,UACE,OAAO,EAAE,OAAO,WAAW,SAAS,WAAA;AAAA,UACpC,OAAO;AAAA,YACL,iBAAiB;AAAA,YACjB,OAAO,MAAM,QAAQ,YAAY,OAAO,QAAQ;AAAA,YAChD,aAAa,MAAM,QAAQ,YAAY,OAAO,QAAQ;AAAA,UAAA;AAAA,QACxD;AAAA,QAEF;AAAA,UACE,OAAO,EAAE,OAAO,UAAA;AAAA,UAChB,OAAO;AAAA,YACL,iBAAiB,MAAM,QAAQ,YAAY,OAAO,QAAQ;AAAA,YAC1D,OAAO,MAAM,QAAQ,YAAY,OAAO,QAAQ;AAAA,UAAA;AAAA,QAClD;AAAA,QAEF;AAAA,UACE,OAAO,EAAE,OAAO,WAAW,SAAS,WAAA;AAAA,UACpC,OAAO;AAAA,YACL,iBAAiB;AAAA,YACjB,OAAO,MAAM,QAAQ,YAAY,OAAO,QAAQ;AAAA,YAChD,aAAa,MAAM,QAAQ,YAAY,OAAO,QAAQ;AAAA,UAAA;AAAA,QACxD;AAAA,QAEF;AAAA,UACE,OAAO,EAAE,OAAO,SAAA;AAAA,UAChB,OAAO;AAAA,YACL,iBAAiB,MAAM,QAAQ,YAAY,OAAO,OAAO;AAAA,YACzD,OAAO,MAAM,QAAQ,YAAY,OAAO,OAAO;AAAA,UAAA;AAAA,QACjD;AAAA,QAEF;AAAA,UACE,OAAO,EAAE,OAAO,UAAU,SAAS,WAAA;AAAA,UACnC,OAAO;AAAA,YACL,iBAAiB;AAAA,YACjB,OAAO,MAAM,QAAQ,YAAY,OAAO,OAAO;AAAA,YAC/C,aAAa,MAAM,QAAQ,YAAY,OAAO,OAAO;AAAA,UAAA;AAAA,QACvD;AAAA,QAEF;AAAA,UACE,OAAO,EAAE,OAAO,OAAA;AAAA,UAChB,OAAO;AAAA,YACL,iBAAiB,MAAM,QAAQ,YAAY,OAAO,KAAK;AAAA,YACvD,OAAO,MAAM,QAAQ,YAAY,OAAO,KAAK;AAAA,UAAA;AAAA,QAC/C;AAAA,QAEF;AAAA,UACE,OAAO,EAAE,OAAO,QAAQ,SAAS,WAAA;AAAA,UACjC,OAAO;AAAA,YACL,iBAAiB;AAAA,YACjB,OAAO,MAAM,QAAQ,YAAY,OAAO,KAAK;AAAA,YAC7C,aAAa,MAAM,QAAQ,YAAY,OAAO,KAAK;AAAA,UAAA;AAAA,QACrD;AAAA,MACF;AAAA,IACF;AAAA,EACF;AAEJ;;"}

package/dist/react/cjs/theme/palette.dark.js

@@ -40,12 +40,12 @@ const paletteDark = {
   },
   text: {
     primary: "#FFFFFF",
-    secondary: "#A3A1A6",
+    secondary: colors.colors.neutral[400],
     tertiary: "#B1A4BB",
-    disabled: "#75727B",
+    disabled: colors.colors.neutral[500],
     deepGreen: "#9EEC98",
     darkOchre: "#F9E683",
-    contrastText: "#A3A1A6",
+    contrastText: colors.colors.neutral[400],
     primaryContrastTest: "#FFFFFF",
     _states: {
       hover: material.alpha("#FFFFFF", 0.04),
@@ -56,8 +56,8 @@ const paletteDark = {
   },
   icon: {
     primary: "#FFFFFF",
-    secondary: "#A3A1A6",
-    disabled: "#75727B",
+    secondary: colors.colors.neutral[400],
+    disabled: colors.colors.neutral[500],
     draggable: "#B1A4BB"
   },
   tabs: {
@@ -150,7 +150,7 @@ const paletteDark = {
   divider: "#383354",
   _components: {
     button: {
-      disabledText: "#75727B",
+      disabledText: colors.colors.neutral[500],
       disabledBorder: "#252540",
       primaryDarkText: {
         disabled: "#252540",
@@ -228,7 +228,7 @@ const paletteDark = {
       }
     },
     avatar: {
-      fill: "#75727B"
+      fill: colors.colors.neutral[500]
     },
     input: {
       _states: {
@@ -243,7 +243,7 @@ const paletteDark = {
     },
     switch: {
       knobFillEnabled: "#1D1D35",
-      slideFill: "#75727B",
+      slideFill: colors.colors.neutral[500],
       knowFillDisabled: "#252540",
       shadow: "#1C1C37",
       color: "#AE72FF",
@@ -298,39 +298,48 @@ const paletteDark = {
     status: {
       success: {
         background: "rgba(158, 236, 152, 0.15)",
-        color: colors.colors.green[500]
+        color: colors.colors.green[500],
+        outlined: colors.colors.green[500]
       },
       error: {
         background: "rgba(250, 55, 104, 0.15)",
-        color: colors.colors.red[400]
+        color: colors.colors.red[400],
+        outlined: colors.colors.red[400]
       },
       warning: {
         background: "rgba(249, 230, 131, 0.15)",
-        color: colors.colors.yellow[600]
+        color: colors.colors.yellow[600],
+        outlined: colors.colors.yellow[600]
       },
       neutral: {
         background: "#252540",
-        color: "#A3A1A6"
+        color: colors.colors.neutral[400],
+        outlined: colors.colors.neutral[400]
       },
       disabled: {
         background: "#1C1C37",
-        color: "#75727B"
+        color: colors.colors.neutral[500],
+        outlined: colors.colors.neutral[500]
       },
       info: {
         background: "rgba(135, 88, 198, 0.15)",
-        color: colors.colors.primary[400]
+        color: colors.colors.primary[400],
+        outlined: colors.colors.primary[400]
       },
       orange: {
         background: "rgba(255, 140, 58, 0.15)",
-        color: colors.colors.orange[500]
+        color: colors.colors.orange[500],
+        outlined: colors.colors.orange[500]
       },
       blue: {
         background: "rgba(96, 203, 203, 0.15)",
-        color: colors.colors.blue[500]
+        color: colors.colors.blue[500],
+        outlined: colors.colors.blue[500]
       },
       primary: {
         background: "rgba(135, 88, 198, 0.2)",
-        color: colors.colors.primary[400]
+        color: colors.colors.primary[400],
+        outlined: colors.colors.primary[400]
       }
     },
     accordion: {
@@ -359,8 +368,34 @@ const paletteDark = {
         border: "#383354"
       }
     },
+    card: {
+      primary: {
+        background: "rgba(135, 88, 198, 0.15)",
+        border: "rgba(135, 88, 198, 0.5)"
+      },
+      success: {
+        background: "rgba(158, 236, 152, 0.1)",
+        border: "rgba(158, 236, 152, 0.3)"
+      },
+      error: {
+        background: "rgba(250, 55, 104, 0.1)",
+        border: "rgba(250, 55, 104, 0.3)"
+      },
+      warning: {
+        background: "rgba(249, 230, 131, 0.1)",
+        border: "rgba(249, 230, 131, 0.3)"
+      },
+      info: {
+        background: "rgba(96, 203, 203, 0.1)",
+        border: "rgba(96, 203, 203, 0.3)"
+      },
+      neutral: {
+        background: "#252540",
+        border: "#383354"
+      }
+    },
     stepper: {
-      connector: "#75727B"
+      connector: colors.colors.neutral[500]
     },
     iconButton: {
       default: {