@lifi/widget 0.0.0-preview-6cc63bac

package/dist/esm/themes/createTheme.js

@@ -0,0 +1,322 @@
+import { palette, paletteDark, paletteLight } from "./palettes.js";
+import { getStyleOverrides } from "./utils.js";
+import { alpha, buttonClasses, createTheme, css, darken, keyframes, lighten, tabsClasses, touchRippleClasses } from "@mui/material";
+//#region src/themes/createTheme.ts
+const shape = {
+	borderRadius: 12,
+	borderRadiusSecondary: 12,
+	borderRadiusTertiary: 24
+};
+const enterKeyframe = keyframes`
+  0% {
+    transform: scale(0);
+    opacity: 0.05;
+  }
+  100% {
+    transform: scale(1);
+    opacity: 0.1;
+  }
+`;
+const createTheme$1 = (widgetTheme = {}) => {
+	const configuredPaletteLight = widgetTheme.colorSchemes?.light?.palette;
+	const configuredPaletteDark = widgetTheme.colorSchemes?.dark?.palette;
+	const primaryMainColorLight = (configuredPaletteLight?.primary)?.main ?? palette.primary.main;
+	const primaryMainColorDark = (configuredPaletteDark?.primary)?.main ?? palette.primary.main;
+	const primaryLightenColorLight = lighten(primaryMainColorLight, .84);
+	const primaryDarkenColorLight = darken(primaryMainColorLight, .2);
+	const primaryLightenColorDark = primaryMainColorLight === primaryMainColorDark ? primaryLightenColorLight : lighten(primaryMainColorDark, .84);
+	const primaryDarkenColorDark = primaryMainColorLight === primaryMainColorDark ? primaryDarkenColorLight : darken(primaryMainColorDark, .2);
+	const secondaryMainColorLight = (configuredPaletteLight?.secondary)?.main ?? palette.secondary.main;
+	const secondaryMainColorDark = (configuredPaletteDark?.secondary)?.main ?? palette.secondary.main;
+	const secondaryLightenColorLight = lighten(secondaryMainColorLight, .84);
+	const secondaryDarkenColorLight = darken(secondaryMainColorLight, .2);
+	const secondaryLightenColorDark = secondaryMainColorLight === secondaryMainColorDark ? secondaryLightenColorLight : lighten(secondaryMainColorDark, .84);
+	const secondaryDarkenColorDark = secondaryMainColorLight === secondaryMainColorDark ? secondaryDarkenColorLight : darken(secondaryMainColorDark, .2);
+	const theme = createTheme({
+		cssVariables: {
+			cssVarPrefix: "lifi",
+			colorSchemeSelector: "class",
+			nativeColor: true
+		},
+		colorSchemes: {
+			light: { palette: {
+				...palette,
+				...paletteLight,
+				...widgetTheme.colorSchemes?.light?.palette,
+				primary: {
+					main: primaryMainColorLight,
+					light: primaryLightenColorLight,
+					dark: primaryDarkenColorLight
+				},
+				secondary: {
+					main: secondaryMainColorLight,
+					light: secondaryLightenColorLight,
+					dark: secondaryDarkenColorLight
+				}
+			} },
+			dark: { palette: {
+				...palette,
+				...paletteDark,
+				...widgetTheme.colorSchemes?.dark?.palette,
+				primary: {
+					main: primaryMainColorDark,
+					light: primaryLightenColorDark,
+					dark: primaryDarkenColorDark
+				},
+				secondary: {
+					main: secondaryMainColorDark,
+					light: secondaryLightenColorDark,
+					dark: secondaryDarkenColorDark
+				}
+			} }
+		},
+		container: widgetTheme.container,
+		routesContainer: widgetTheme.routesContainer,
+		chainSidebarContainer: widgetTheme.chainSidebarContainer,
+		header: widgetTheme.header,
+		navigation: {
+			edge: true,
+			...widgetTheme.navigation
+		},
+		typography: {
+			fontFamily: "Inter, sans-serif",
+			...widgetTheme.typography
+		},
+		shape: {
+			...shape,
+			...widgetTheme.shape
+		},
+		breakpoints: { values: {
+			xs: 360,
+			sm: 416,
+			md: 900,
+			lg: 1200,
+			xl: 1536
+		} },
+		components: {
+			MuiScopedCssBaseline: { styleOverrides: { root: {
+				fontFamily: "Inter, sans-serif",
+				...widgetTheme.typography
+			} } },
+			MuiAppBar: { styleOverrides: { root: ({ ownerState }) => ({
+				minHeight: 40,
+				padding: 0,
+				...getStyleOverrides("MuiAppBar", "root", widgetTheme, ownerState)
+			}) } },
+			MuiCard: {
+				defaultProps: {
+					variant: "outlined",
+					...widgetTheme.components?.MuiCard?.defaultProps
+				},
+				styleOverrides: { root: ({ ownerState, theme }) => {
+					const root = widgetTheme.components?.MuiCard?.styleOverrides?.root;
+					const rootHover = root?.["&:hover"];
+					return {
+						backgroundColor: theme.vars.palette.background.paper,
+						backgroundImage: "none",
+						borderRadius: theme.vars.shape.borderRadius,
+						overflow: "hidden",
+						position: "relative",
+						boxSizing: "border-box",
+						transition: theme.transitions.create(["background-color", "filter"], {
+							duration: theme.transitions.duration.enteringScreen,
+							easing: theme.transitions.easing.easeOut
+						}),
+						...!!ownerState.onClick && { "&:hover": { cursor: "pointer" } },
+						...!!ownerState.onClick && (ownerState.variant === "outlined" || ownerState.variant === "filled") && { "&:hover": {
+							cursor: "pointer",
+							backgroundColor: `color-mix(in srgb, ${theme.vars.palette.background.paper} 98%, black)`,
+							...theme.applyStyles("dark", { backgroundColor: `color-mix(in srgb, ${theme.vars.palette.background.paper} 98%, white)` })
+						} },
+						...!!ownerState.onClick && ownerState.variant === "elevation" && { "&:hover": {
+							cursor: "pointer",
+							filter: `drop-shadow(0 1px 4px color-mix(in srgb, ${theme.vars.palette.common.onBackground} 8%, transparent))`,
+							...theme.applyStyles("dark", { filter: `drop-shadow(0 1px 4px color-mix(in srgb, ${theme.vars.palette.common.background} 8%, transparent))` })
+						} },
+						...typeof root === "object" && root,
+						...!!ownerState.onClick && !!rootHover && { "&:hover": {
+							...rootHover,
+							...theme.applyStyles("dark", { ...rootHover })
+						} },
+						...!ownerState.onClick && { "&:hover": {} }
+					};
+				} },
+				variants: widgetTheme.components?.MuiCard?.variants ?? [
+					{
+						props: { variant: "outlined" },
+						style: ({ theme }) => ({
+							borderWidth: 1,
+							borderStyle: "solid",
+							borderColor: theme.vars.palette.grey[300],
+							...theme.applyStyles("dark", { borderColor: theme.vars.palette.grey[800] })
+						})
+					},
+					{
+						props: { variant: "elevation" },
+						style: ({ theme }) => ({
+							border: "none",
+							boxShadow: "none",
+							filter: `drop-shadow(0 1px 4px color-mix(in srgb, ${theme.vars.palette.common.onBackground} 4%, transparent))`,
+							...theme.applyStyles("dark", { filter: `drop-shadow(0 1px 4px color-mix(in srgb, ${theme.vars.palette.common.background} 4%, transparent))` })
+						})
+					},
+					{
+						props: { variant: "filled" },
+						style: { border: "none" }
+					}
+				]
+			},
+			MuiInputCard: { ...widgetTheme.components?.MuiInputCard },
+			MuiButtonBase: { styleOverrides: { root: css`
+            &
+              .${touchRippleClasses.ripple}.${touchRippleClasses.rippleVisible} {
+              opacity: 0.1;
+              animation-name: ${enterKeyframe};
+            }
+          ` } },
+			MuiButton: {
+				defaultProps: {
+					disableElevation: true,
+					...widgetTheme.components?.MuiButton?.defaultProps
+				},
+				styleOverrides: {
+					root: ({ theme, ownerState }) => ({
+						borderRadius: theme.vars.shape.borderRadiusSecondary,
+						textTransform: "none",
+						fontSize: 16,
+						fontWeight: 600,
+						"&.Mui-disabled, &.Mui-disabled:hover": {
+							color: `color-mix(in srgb, ${theme.vars.palette.common.onBackground} 56%, transparent)`,
+							cursor: "not-allowed",
+							pointerEvents: "auto"
+						},
+						[`&.${buttonClasses.loading}.Mui-disabled`]: {
+							backgroundColor: theme.vars.palette.primary.main,
+							color: theme.palette.getContrastText(theme.palette.primary.main),
+							cursor: "auto",
+							pointerEvents: "auto"
+						},
+						[`.${buttonClasses.loadingIndicator}`]: { color: theme.palette.getContrastText(theme.palette.primary.main) },
+						[`&.${buttonClasses.root}.${buttonClasses.loading}`]: { color: "transparent" },
+						...getStyleOverrides("MuiButton", "root", widgetTheme, ownerState)
+					}),
+					text: ({ theme, ownerState }) => ({
+						backgroundColor: `color-mix(in srgb, ${theme.vars.palette.primary.main} 8%, transparent)`,
+						color: theme.vars.palette.primary.main,
+						"&:hover": { backgroundColor: `color-mix(in srgb, ${theme.vars.palette.primary.main} 12%, transparent)` },
+						...theme.applyStyles("dark", {
+							backgroundColor: `color-mix(in srgb, ${theme.vars.palette.primary.main} 42%, transparent)`,
+							color: theme.palette.getContrastText(alpha(theme.palette.primary.main, .08)),
+							"&:hover": { backgroundColor: `color-mix(in srgb, ${theme.vars.palette.primary.main} 56%, transparent)` }
+						}),
+						...getStyleOverrides("MuiButton", "text", widgetTheme, ownerState)
+					}),
+					contained: ({ ownerState }) => ({
+						"&:hover": { color: theme.palette.getContrastText(theme.palette.primary.main) },
+						...getStyleOverrides("MuiButton", "contained", widgetTheme, ownerState)
+					}),
+					sizeMedium: ({ ownerState }) => ({
+						padding: "10px 14px",
+						...getStyleOverrides("MuiButton", "sizeMedium", widgetTheme, ownerState)
+					})
+				}
+			},
+			MuiIconButton: {
+				...widgetTheme.components?.MuiIconButton,
+				styleOverrides: {
+					...widgetTheme.components?.MuiIconButton?.styleOverrides,
+					root: ({ ownerState }) => ({
+						color: "inherit",
+						"&:hover": { color: "inherit" },
+						...getStyleOverrides("MuiIconButton", "root", widgetTheme, ownerState)
+					})
+				}
+			},
+			MuiAvatar: {
+				styleOverrides: {
+					root: {
+						height: 40,
+						width: 40
+					},
+					img: { objectFit: "contain" }
+				},
+				...widgetTheme.components?.MuiAvatar
+			},
+			MuiListItemText: { styleOverrides: {
+				primary: ({ theme }) => ({
+					fontWeight: 600,
+					fontSize: "1.125rem",
+					lineHeight: "1.2778",
+					color: theme.vars.palette.text.primary
+				}),
+				secondary: ({ theme }) => ({
+					fontWeight: 500,
+					fontSize: "0.75rem",
+					color: theme.vars.palette.text.secondary
+				})
+			} },
+			MuiTooltip: {
+				defaultProps: {
+					enterDelay: 400,
+					disableInteractive: true,
+					arrow: true,
+					placement: "top"
+				},
+				styleOverrides: {
+					tooltip: ({ theme }) => ({
+						backgroundColor: "rgb(0 0 0 / 64%)",
+						backdropFilter: "blur(3px)",
+						fontSize: "0.75rem",
+						padding: theme.spacing(1, 1.5)
+					}),
+					arrow: { color: "rgb(0 0 0 / 64%)" }
+				}
+			},
+			MuiMenu: { styleOverrides: { paper: ({ theme }) => ({
+				backgroundColor: theme.vars.palette.background.paper,
+				backgroundImage: "none"
+			}) } },
+			MuiDrawer: {
+				...widgetTheme.components?.MuiDrawer,
+				styleOverrides: {
+					paper: { backgroundImage: "none" },
+					...widgetTheme.components?.MuiDrawer?.styleOverrides
+				}
+			},
+			MuiPaper: { styleOverrides: { root: { backgroundImage: "none" } } },
+			MuiTabs: {
+				...widgetTheme.components?.MuiTabs,
+				styleOverrides: {
+					...widgetTheme.components?.MuiTabs?.styleOverrides,
+					root: ({ theme, ownerState }) => {
+						const rootStyleOverrides = getStyleOverrides("MuiTabs", "root", widgetTheme, ownerState);
+						return {
+							backgroundColor: `color-mix(in srgb, ${theme.vars.palette.common.onBackground} 4%, transparent)`,
+							...theme.applyStyles("dark", { backgroundColor: `color-mix(in srgb, ${theme.vars.palette.common.onBackground} 8%, transparent)` }),
+							borderRadius: theme.vars.shape.borderRadius,
+							...rootStyleOverrides,
+							[`.${tabsClasses.indicator}`]: {
+								backgroundColor: theme.vars.palette.background.paper,
+								...theme.applyStyles("dark", { backgroundColor: `color-mix(in srgb, ${theme.vars.palette.common.background} 56%, transparent)` }),
+								borderRadius: theme.shape.borderRadius > 0 ? `calc(${theme.vars.shape.borderRadius} - 4px)` : theme.vars.shape.borderRadius,
+								boxShadow: `0px 2px 4px color-mix(in srgb, ${theme.vars.palette.common.onBackground} 4%, transparent)`,
+								...rootStyleOverrides?.[`.${tabsClasses.indicator}`]
+							}
+						};
+					}
+				}
+			},
+			MuiNavigationTabs: { ...widgetTheme.components?.MuiNavigationTabs },
+			MuiNavigationTab: { ...widgetTheme.components?.MuiNavigationTab },
+			MuiCheckbox: {
+				styleOverrides: { root: { "&:hover": { backgroundColor: "transparent" } } },
+				...widgetTheme.components?.MuiCheckbox
+			}
+		}
+	});
+	return theme;
+};
+//#endregion
+export { createTheme$1 as createTheme };
+
+//# sourceMappingURL=createTheme.js.map

package/dist/esm/themes/createTheme.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"createTheme.js","names":["createTheme","createMuiTheme"],"sources":["../../../src/themes/createTheme.ts"],"sourcesContent":["import type {\n  CSSObject,\n  Shape,\n  SimplePaletteColorOptions,\n  Theme,\n} from '@mui/material'\nimport {\n  alpha,\n  buttonClasses,\n  createTheme as createMuiTheme,\n  css,\n  darken,\n  keyframes,\n  lighten,\n  tabsClasses,\n  touchRippleClasses,\n} from '@mui/material'\nimport type { WidgetTheme } from '../types/widget.js'\nimport { palette, paletteDark, paletteLight } from './palettes.js'\nimport type {} from './types.js'\nimport { getStyleOverrides } from './utils.js'\n\nconst shape: Shape = {\n  borderRadius: 12,\n  borderRadiusSecondary: 12,\n  borderRadiusTertiary: 24,\n}\n\nconst enterKeyframe = keyframes`\n  0% {\n    transform: scale(0);\n    opacity: 0.05;\n  }\n  100% {\n    transform: scale(1);\n    opacity: 0.1;\n  }\n`\n\nexport const createTheme = (widgetTheme: WidgetTheme = {}): Theme => {\n  const configuredPaletteLight = widgetTheme.colorSchemes?.light?.palette\n  const configuredPaletteDark = widgetTheme.colorSchemes?.dark?.palette\n\n  const primaryMainColorLight =\n    (configuredPaletteLight?.primary as SimplePaletteColorOptions)?.main ??\n    palette.primary.main\n  const primaryMainColorDark =\n    (configuredPaletteDark?.primary as SimplePaletteColorOptions)?.main ??\n    palette.primary.main\n\n  const primaryLightenColorLight = lighten(primaryMainColorLight, 0.84)\n  const primaryDarkenColorLight = darken(primaryMainColorLight, 0.2)\n  const primaryLightenColorDark =\n    primaryMainColorLight === primaryMainColorDark\n      ? primaryLightenColorLight\n      : lighten(primaryMainColorDark, 0.84)\n  const primaryDarkenColorDark =\n    primaryMainColorLight === primaryMainColorDark\n      ? primaryDarkenColorLight\n      : darken(primaryMainColorDark, 0.2)\n\n  const secondaryMainColorLight =\n    (configuredPaletteLight?.secondary as SimplePaletteColorOptions)?.main ??\n    palette.secondary.main\n  const secondaryMainColorDark =\n    (configuredPaletteDark?.secondary as SimplePaletteColorOptions)?.main ??\n    palette.secondary.main\n\n  const secondaryLightenColorLight = lighten(secondaryMainColorLight, 0.84)\n  const secondaryDarkenColorLight = darken(secondaryMainColorLight, 0.2)\n  const secondaryLightenColorDark =\n    secondaryMainColorLight === secondaryMainColorDark\n      ? secondaryLightenColorLight\n      : lighten(secondaryMainColorDark, 0.84)\n  const secondaryDarkenColorDark =\n    secondaryMainColorLight === secondaryMainColorDark\n      ? secondaryDarkenColorLight\n      : darken(secondaryMainColorDark, 0.2)\n\n  const theme = createMuiTheme({\n    cssVariables: {\n      cssVarPrefix: 'lifi',\n      colorSchemeSelector: 'class',\n      nativeColor: true,\n    },\n    colorSchemes: {\n      light: {\n        palette: {\n          ...palette,\n          ...paletteLight,\n          ...widgetTheme.colorSchemes?.light?.palette,\n          primary: {\n            main: primaryMainColorLight,\n            light: primaryLightenColorLight,\n            dark: primaryDarkenColorLight,\n          },\n          secondary: {\n            main: secondaryMainColorLight,\n            light: secondaryLightenColorLight,\n            dark: secondaryDarkenColorLight,\n          },\n        },\n      },\n      dark: {\n        palette: {\n          ...palette,\n          ...paletteDark,\n          ...widgetTheme.colorSchemes?.dark?.palette,\n          primary: {\n            main: primaryMainColorDark,\n            light: primaryLightenColorDark,\n            dark: primaryDarkenColorDark,\n          },\n          secondary: {\n            main: secondaryMainColorDark,\n            light: secondaryLightenColorDark,\n            dark: secondaryDarkenColorDark,\n          },\n        },\n      },\n    },\n    container: widgetTheme.container,\n    routesContainer: widgetTheme.routesContainer,\n    chainSidebarContainer: widgetTheme.chainSidebarContainer,\n    header: widgetTheme.header,\n    navigation: {\n      edge: true,\n      ...widgetTheme.navigation,\n    },\n    typography: {\n      fontFamily: 'Inter, sans-serif',\n      ...widgetTheme.typography,\n    },\n    shape: {\n      ...shape,\n      ...widgetTheme.shape,\n    },\n    breakpoints: {\n      values: {\n        xs: 360,\n        sm: 416,\n        md: 900,\n        lg: 1200,\n        xl: 1536,\n      },\n    },\n    components: {\n      MuiScopedCssBaseline: {\n        styleOverrides: {\n          root: {\n            fontFamily: 'Inter, sans-serif',\n            ...widgetTheme.typography,\n          },\n        },\n      },\n      MuiAppBar: {\n        styleOverrides: {\n          root: ({ ownerState }) => ({\n            minHeight: 40,\n            padding: 0,\n            ...getStyleOverrides('MuiAppBar', 'root', widgetTheme, ownerState),\n          }),\n        },\n      },\n      MuiCard: {\n        defaultProps: {\n          variant: 'outlined',\n          ...widgetTheme.components?.MuiCard?.defaultProps,\n        },\n        styleOverrides: {\n          root: ({ ownerState, theme }) => {\n            const root = widgetTheme.components?.MuiCard?.styleOverrides\n              ?.root as CSSObject\n            const rootHover = root?.['&:hover']\n            return {\n              backgroundColor: theme.vars.palette.background.paper,\n              backgroundImage: 'none',\n              borderRadius: theme.vars.shape.borderRadius,\n              overflow: 'hidden',\n              position: 'relative',\n              boxSizing: 'border-box',\n              transition: theme.transitions.create(\n                ['background-color', 'filter'],\n                {\n                  duration: theme.transitions.duration.enteringScreen,\n                  easing: theme.transitions.easing.easeOut,\n                }\n              ),\n              ...(!!ownerState.onClick && {\n                '&:hover': {\n                  cursor: 'pointer',\n                },\n              }),\n              ...(!!ownerState.onClick &&\n                (ownerState.variant === 'outlined' ||\n                  ownerState.variant === 'filled') && {\n                  '&:hover': {\n                    cursor: 'pointer',\n                    backgroundColor: `color-mix(in srgb, ${theme.vars.palette.background.paper} 98%, black)`,\n                    ...theme.applyStyles('dark', {\n                      backgroundColor: `color-mix(in srgb, ${theme.vars.palette.background.paper} 98%, white)`,\n                    }),\n                  },\n                }),\n              ...(!!ownerState.onClick &&\n                ownerState.variant === 'elevation' && {\n                  '&:hover': {\n                    cursor: 'pointer',\n                    filter: `drop-shadow(0 1px 4px color-mix(in srgb, ${theme.vars.palette.common.onBackground} 8%, transparent))`,\n                    ...theme.applyStyles('dark', {\n                      filter: `drop-shadow(0 1px 4px color-mix(in srgb, ${theme.vars.palette.common.background} 8%, transparent))`,\n                    }),\n                  },\n                }),\n              ...(typeof root === 'object' && root),\n              ...(!!ownerState.onClick &&\n                !!rootHover && {\n                  '&:hover': {\n                    ...rootHover,\n                    ...theme.applyStyles('dark', {\n                      ...rootHover,\n                    }),\n                  },\n                }),\n              ...(!ownerState.onClick && {\n                '&:hover': {},\n              }),\n            }\n          },\n        },\n        variants: widgetTheme.components?.MuiCard?.variants ?? [\n          {\n            props: { variant: 'outlined' },\n            style: ({ theme }) => ({\n              borderWidth: 1,\n              borderStyle: 'solid',\n              borderColor: theme.vars.palette.grey[300],\n              ...theme.applyStyles('dark', {\n                borderColor: theme.vars.palette.grey[800],\n              }),\n            }),\n          },\n          {\n            props: { variant: 'elevation' },\n            style: ({ theme }) => ({\n              border: 'none',\n              boxShadow: 'none',\n              filter: `drop-shadow(0 1px 4px color-mix(in srgb, ${theme.vars.palette.common.onBackground} 4%, transparent))`,\n              ...theme.applyStyles('dark', {\n                filter: `drop-shadow(0 1px 4px color-mix(in srgb, ${theme.vars.palette.common.background} 4%, transparent))`,\n              }),\n            }),\n          },\n          {\n            props: { variant: 'filled' },\n            style: {\n              border: 'none',\n            },\n          },\n        ],\n      },\n      MuiInputCard: {\n        ...widgetTheme.components?.MuiInputCard,\n      },\n      MuiButtonBase: {\n        styleOverrides: {\n          // This `css()` function invokes keyframes. `styled-components` only supports keyframes\n          // in string templates. Do not convert these styles in JS object as it will break.\n          root: css`\n            &\n              .${touchRippleClasses.ripple}.${touchRippleClasses.rippleVisible} {\n              opacity: 0.1;\n              animation-name: ${enterKeyframe};\n            }\n          `,\n        },\n      },\n      MuiButton: {\n        defaultProps: {\n          disableElevation: true,\n          ...widgetTheme.components?.MuiButton?.defaultProps,\n        },\n        styleOverrides: {\n          root: ({ theme, ownerState }) => ({\n            borderRadius: theme.vars.shape.borderRadiusSecondary,\n            textTransform: 'none',\n            fontSize: 16,\n            fontWeight: 600,\n            '&.Mui-disabled, &.Mui-disabled:hover': {\n              color: `color-mix(in srgb, ${theme.vars.palette.common.onBackground} 56%, transparent)`,\n              cursor: 'not-allowed',\n              pointerEvents: 'auto',\n            },\n            [`&.${buttonClasses.loading}.Mui-disabled`]: {\n              backgroundColor: theme.vars.palette.primary.main,\n              color: theme.palette.getContrastText(theme.palette.primary.main),\n              cursor: 'auto',\n              pointerEvents: 'auto',\n            },\n            [`.${buttonClasses.loadingIndicator}`]: {\n              color: theme.palette.getContrastText(theme.palette.primary.main),\n            },\n            [`&.${buttonClasses.root}.${buttonClasses.loading}`]: {\n              color: 'transparent',\n            },\n            ...getStyleOverrides('MuiButton', 'root', widgetTheme, ownerState),\n          }),\n          text: ({ theme, ownerState }) => ({\n            backgroundColor: `color-mix(in srgb, ${theme.vars.palette.primary.main} 8%, transparent)`,\n            color: theme.vars.palette.primary.main,\n            '&:hover': {\n              backgroundColor: `color-mix(in srgb, ${theme.vars.palette.primary.main} 12%, transparent)`,\n            },\n            ...theme.applyStyles('dark', {\n              backgroundColor: `color-mix(in srgb, ${theme.vars.palette.primary.main} 42%, transparent)`,\n              color: theme.palette.getContrastText(\n                alpha(theme.palette.primary.main, 0.08)\n              ),\n              '&:hover': {\n                backgroundColor: `color-mix(in srgb, ${theme.vars.palette.primary.main} 56%, transparent)`,\n              },\n            }),\n            ...getStyleOverrides('MuiButton', 'text', widgetTheme, ownerState),\n          }),\n          contained: ({ ownerState }) => ({\n            '&:hover': {\n              color: theme.palette.getContrastText(theme.palette.primary.main),\n            },\n            ...getStyleOverrides(\n              'MuiButton',\n              'contained',\n              widgetTheme,\n              ownerState\n            ),\n          }),\n          sizeMedium: ({ ownerState }) => ({\n            padding: '10px 14px',\n            ...getStyleOverrides(\n              'MuiButton',\n              'sizeMedium',\n              widgetTheme,\n              ownerState\n            ),\n          }),\n        },\n      },\n      MuiIconButton: {\n        ...widgetTheme.components?.MuiIconButton,\n        styleOverrides: {\n          ...widgetTheme.components?.MuiIconButton?.styleOverrides,\n          root: ({ ownerState }) => ({\n            color: 'inherit',\n            '&:hover': {\n              color: 'inherit',\n            },\n            ...getStyleOverrides(\n              'MuiIconButton',\n              'root',\n              widgetTheme,\n              ownerState\n            ),\n          }),\n        },\n      },\n      MuiAvatar: {\n        styleOverrides: {\n          root: {\n            height: 40,\n            width: 40,\n          },\n          img: {\n            objectFit: 'contain',\n          },\n        },\n        ...widgetTheme.components?.MuiAvatar,\n      },\n      MuiListItemText: {\n        styleOverrides: {\n          primary: ({ theme }) => ({\n            fontWeight: 600,\n            fontSize: '1.125rem',\n            lineHeight: '1.2778',\n            color: theme.vars.palette.text.primary,\n          }),\n          secondary: ({ theme }) => ({\n            fontWeight: 500,\n            fontSize: '0.75rem',\n            color: theme.vars.palette.text.secondary,\n          }),\n        },\n      },\n      MuiTooltip: {\n        defaultProps: {\n          enterDelay: 400,\n          disableInteractive: true,\n          arrow: true,\n          placement: 'top',\n        },\n        styleOverrides: {\n          tooltip: ({ theme }) => ({\n            backgroundColor: 'rgb(0 0 0 / 64%)',\n            backdropFilter: 'blur(3px)',\n            fontSize: '0.75rem',\n            padding: theme.spacing(1, 1.5),\n          }),\n          arrow: {\n            color: 'rgb(0 0 0 / 64%)',\n          },\n        },\n      },\n      MuiMenu: {\n        styleOverrides: {\n          paper: ({ theme }) => ({\n            backgroundColor: theme.vars.palette.background.paper,\n            backgroundImage: 'none',\n          }),\n        },\n      },\n      MuiDrawer: {\n        ...widgetTheme.components?.MuiDrawer,\n        styleOverrides: {\n          paper: {\n            backgroundImage: 'none',\n          },\n          ...widgetTheme.components?.MuiDrawer?.styleOverrides,\n        },\n      },\n      MuiPaper: {\n        styleOverrides: {\n          root: {\n            backgroundImage: 'none',\n          },\n        },\n      },\n      MuiTabs: {\n        ...widgetTheme.components?.MuiTabs,\n        styleOverrides: {\n          ...widgetTheme.components?.MuiTabs?.styleOverrides,\n          root: ({ theme, ownerState }) => {\n            const rootStyleOverrides = getStyleOverrides(\n              'MuiTabs',\n              'root',\n              widgetTheme,\n              ownerState\n            )\n            return {\n              backgroundColor: `color-mix(in srgb, ${theme.vars.palette.common.onBackground} 4%, transparent)`,\n              ...theme.applyStyles('dark', {\n                backgroundColor: `color-mix(in srgb, ${theme.vars.palette.common.onBackground} 8%, transparent)`,\n              }),\n              borderRadius: theme.vars.shape.borderRadius,\n              ...rootStyleOverrides,\n              [`.${tabsClasses.indicator}`]: {\n                backgroundColor: theme.vars.palette.background.paper,\n                ...theme.applyStyles('dark', {\n                  backgroundColor: `color-mix(in srgb, ${theme.vars.palette.common.background} 56%, transparent)`,\n                }),\n                borderRadius:\n                  theme.shape.borderRadius > 0\n                    ? `calc(${theme.vars.shape.borderRadius} - 4px)`\n                    : theme.vars.shape.borderRadius,\n                boxShadow: `0px 2px 4px color-mix(in srgb, ${theme.vars.palette.common.onBackground} 4%, transparent)`,\n                ...rootStyleOverrides?.[`.${tabsClasses.indicator}`],\n              },\n            }\n          },\n        },\n      },\n      MuiNavigationTabs: {\n        ...widgetTheme.components?.MuiNavigationTabs,\n      },\n      MuiNavigationTab: {\n        ...widgetTheme.components?.MuiNavigationTab,\n      },\n      MuiCheckbox: {\n        styleOverrides: {\n          root: {\n            '&:hover': {\n              backgroundColor: 'transparent',\n            },\n          },\n        },\n        ...widgetTheme.components?.MuiCheckbox,\n      },\n    },\n  })\n\n  return theme\n}\n"],"mappings":"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"}

package/dist/esm/themes/jumper.d.ts

@@ -0,0 +1,7 @@
+import { WidgetTheme } from "../types/widget.js";
+
+//#region src/themes/jumper.d.ts
+declare const jumperTheme: WidgetTheme;
+//#endregion
+export { jumperTheme };
+//# sourceMappingURL=jumper.d.ts.map

package/dist/esm/themes/jumper.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"jumper.d.ts","names":[],"sources":["../../../src/themes/jumper.ts"],"mappings":";;;cAEa,WAAA,EAAa,WAAA"}

package/dist/esm/themes/jumper.js

@@ -0,0 +1,58 @@
+//#region src/themes/jumper.ts
+const jumperTheme = {
+	typography: {},
+	header: { overflow: "visible" },
+	container: {
+		filter: "drop-shadow(0px 8px 32px rgba(0, 0, 0, 0.12))",
+		borderRadius: "24px"
+	},
+	shape: {
+		borderRadius: 12,
+		borderRadiusSecondary: 24
+	},
+	colorSchemes: {
+		light: { palette: {
+			primary: { main: "#30007A" },
+			secondary: { main: "#8700B8" },
+			background: {
+				default: "#F9F5FF",
+				paper: "#FFFFFF"
+			},
+			text: {
+				primary: "#000000",
+				secondary: "#818084"
+			},
+			grey: {
+				200: "#ECEBF0",
+				300: "#E5E1EB",
+				700: "#70767A",
+				800: "#4B4F52"
+			},
+			playground: { main: "#F3EBFF" }
+		} },
+		dark: { palette: {
+			primary: { main: "#653BA3" },
+			secondary: { main: "#D35CFF" },
+			background: {
+				default: "#24203D",
+				paper: "#302B52"
+			},
+			text: {
+				primary: "#ffffff",
+				secondary: "#9490a5"
+			},
+			grey: {
+				200: "#ECEBF0",
+				300: "#DDDCE0",
+				700: "#70767A",
+				800: "#3c375c"
+			},
+			playground: { main: "#120F29" }
+		} }
+	},
+	components: { MuiCard: { defaultProps: { variant: "elevation" } } }
+};
+//#endregion
+export { jumperTheme };
+
+//# sourceMappingURL=jumper.js.map

package/dist/esm/themes/jumper.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"jumper.js","names":[],"sources":["../../../src/themes/jumper.ts"],"sourcesContent":["import type { WidgetTheme } from '../types/widget.js'\n\nexport const jumperTheme: WidgetTheme = {\n  typography: {},\n  header: {\n    overflow: 'visible',\n  },\n  container: {\n    filter: 'drop-shadow(0px 8px 32px rgba(0, 0, 0, 0.12))',\n    borderRadius: '24px',\n  },\n  shape: {\n    borderRadius: 12,\n    borderRadiusSecondary: 24,\n  },\n  colorSchemes: {\n    light: {\n      palette: {\n        primary: {\n          main: '#30007A',\n        },\n        secondary: {\n          main: '#8700B8',\n        },\n        background: {\n          default: '#F9F5FF',\n          paper: '#FFFFFF',\n        },\n        text: {\n          primary: '#000000',\n          secondary: '#818084',\n        },\n        grey: {\n          200: '#ECEBF0',\n          300: '#E5E1EB',\n          700: '#70767A',\n          800: '#4B4F52',\n        },\n        playground: {\n          main: '#F3EBFF',\n        },\n      },\n    },\n    dark: {\n      palette: {\n        primary: {\n          main: '#653BA3',\n        },\n        secondary: {\n          main: '#D35CFF',\n        },\n        background: {\n          default: '#24203D',\n          paper: '#302B52',\n        },\n        text: {\n          primary: '#ffffff',\n          secondary: '#9490a5',\n        },\n        grey: {\n          200: '#ECEBF0',\n          300: '#DDDCE0',\n          700: '#70767A',\n          800: '#3c375c',\n        },\n        playground: {\n          main: '#120F29',\n        },\n      },\n    },\n  },\n  components: {\n    MuiCard: {\n      defaultProps: { variant: 'elevation' },\n    },\n  },\n}\n"],"mappings":";AAEA,MAAa,cAA2B;CACtC,YAAY,CAAC;CACb,QAAQ,EACN,UAAU,UACZ;CACA,WAAW;EACT,QAAQ;EACR,cAAc;CAChB;CACA,OAAO;EACL,cAAc;EACd,uBAAuB;CACzB;CACA,cAAc;EACZ,OAAO,EACL,SAAS;GACP,SAAS,EACP,MAAM,UACR;GACA,WAAW,EACT,MAAM,UACR;GACA,YAAY;IACV,SAAS;IACT,OAAO;GACT;GACA,MAAM;IACJ,SAAS;IACT,WAAW;GACb;GACA,MAAM;IACJ,KAAK;IACL,KAAK;IACL,KAAK;IACL,KAAK;GACP;GACA,YAAY,EACV,MAAM,UACR;EACF,EACF;EACA,MAAM,EACJ,SAAS;GACP,SAAS,EACP,MAAM,UACR;GACA,WAAW,EACT,MAAM,UACR;GACA,YAAY;IACV,SAAS;IACT,OAAO;GACT;GACA,MAAM;IACJ,SAAS;IACT,WAAW;GACb;GACA,MAAM;IACJ,KAAK;IACL,KAAK;IACL,KAAK;IACL,KAAK;GACP;GACA,YAAY,EACV,MAAM,UACR;EACF,EACF;CACF;CACA,YAAY,EACV,SAAS,EACP,cAAc,EAAE,SAAS,YAAY,EACvC,EACF;AACF"}

package/dist/esm/themes/palettes.d.ts

@@ -0,0 +1,54 @@
+//#region src/themes/palettes.d.ts
+declare const palette: {
+  primary: {
+    main: string;
+  };
+  secondary: {
+    main: string;
+  };
+  success: {
+    main: string;
+  };
+  warning: {
+    main: string;
+  };
+  error: {
+    main: string;
+  };
+  info: {
+    main: string;
+  };
+  common: {
+    black: string;
+    white: string;
+  };
+  grey: {
+    "200": string;
+    "300": string;
+    "700": string;
+    "800": string;
+  };
+};
+declare const paletteDark: {
+  background: {
+    paper: string;
+    default: string;
+  };
+  text: {
+    primary: string;
+    secondary: string;
+  };
+};
+declare const paletteLight: {
+  background: {
+    paper: string;
+    default: string;
+  };
+  text: {
+    primary: string;
+    secondary: string;
+  };
+};
+//#endregion
+export { palette, paletteDark, paletteLight };
+//# sourceMappingURL=palettes.d.ts.map

package/dist/esm/themes/palettes.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"palettes.d.ts","names":[],"sources":["../../../src/themes/palettes.ts"],"mappings":";cAAa,OAAA;EACX,OAAA;IACE,IAAA;EAAA;EAEF,SAAA;IACE,IAAA;EAAA;EAEF,OAAA;IACE,IAAA;EAAA;EAEF,OAAA;IACE,IAAA;EAAA;EAEF,KAAA;IACE,IAAA;EAAA;EAEF,IAAA;IACE,IAAA;EAAA;EAEF,MAAA;IACE,KAAA;IACA,KAAA;EAAA;EAEF,IAAA;IACE,KAAA;IACA,KAAA;IACA,KAAA;IACA,KAAA;EAAA;AAAA;AAAA,cAIS,WAAA;EACX,UAAA;IACE,KAAA;IACA,OAAA;EAAA;EAEF,IAAA;IACE,OAAA;IACA,SAAA;EAAA;AAAA;AAAA,cAIS,YAAA;EACX,UAAA;IACE,KAAA;IACA,OAAA;EAAA;EAEF,IAAA;IACE,OAAA;IACA,SAAA;EAAA;AAAA"}

package/dist/esm/themes/palettes.js

@@ -0,0 +1,43 @@
+//#region src/themes/palettes.ts
+const palette = {
+	primary: { main: "#5C67FF" },
+	secondary: { main: "#F7C2FF" },
+	success: { main: "#0AA65B" },
+	warning: { main: "#FFCC00" },
+	error: { main: "#E5452F" },
+	info: { main: "#297EFF" },
+	common: {
+		black: "#000000",
+		white: "#ffffff"
+	},
+	grey: {
+		"200": "#eeeeee",
+		"300": "#e0e0e0",
+		"700": "#616161",
+		"800": "#424242"
+	}
+};
+const paletteDark = {
+	background: {
+		paper: "#212121",
+		default: "#121212"
+	},
+	text: {
+		primary: "#ffffff",
+		secondary: "#bbbbbb"
+	}
+};
+const paletteLight = {
+	background: {
+		paper: "#ffffff",
+		default: "#ffffff"
+	},
+	text: {
+		primary: "#000000",
+		secondary: "#747474"
+	}
+};
+//#endregion
+export { palette, paletteDark, paletteLight };
+
+//# sourceMappingURL=palettes.js.map

package/dist/esm/themes/palettes.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"palettes.js","names":[],"sources":["../../../src/themes/palettes.ts"],"sourcesContent":["export const palette = {\n  primary: {\n    main: '#5C67FF',\n  },\n  secondary: {\n    main: '#F7C2FF',\n  },\n  success: {\n    main: '#0AA65B',\n  },\n  warning: {\n    main: '#FFCC00',\n  },\n  error: {\n    main: '#E5452F',\n  },\n  info: {\n    main: '#297EFF',\n  },\n  common: {\n    black: '#000000',\n    white: '#ffffff',\n  },\n  grey: {\n    '200': '#eeeeee',\n    '300': '#e0e0e0',\n    '700': '#616161',\n    '800': '#424242',\n  },\n}\n\nexport const paletteDark = {\n  background: {\n    paper: '#212121',\n    default: '#121212',\n  },\n  text: {\n    primary: '#ffffff',\n    secondary: '#bbbbbb',\n  },\n}\n\nexport const paletteLight = {\n  background: {\n    paper: '#ffffff',\n    default: '#ffffff',\n  },\n  text: {\n    primary: '#000000',\n    secondary: '#747474',\n  },\n}\n"],"mappings":";AAAA,MAAa,UAAU;CACrB,SAAS,EACP,MAAM,UACR;CACA,WAAW,EACT,MAAM,UACR;CACA,SAAS,EACP,MAAM,UACR;CACA,SAAS,EACP,MAAM,UACR;CACA,OAAO,EACL,MAAM,UACR;CACA,MAAM,EACJ,MAAM,UACR;CACA,QAAQ;EACN,OAAO;EACP,OAAO;CACT;CACA,MAAM;EACJ,OAAO;EACP,OAAO;EACP,OAAO;EACP,OAAO;CACT;AACF;AAEA,MAAa,cAAc;CACzB,YAAY;EACV,OAAO;EACP,SAAS;CACX;CACA,MAAM;EACJ,SAAS;EACT,WAAW;CACb;AACF;AAEA,MAAa,eAAe;CAC1B,YAAY;EACV,OAAO;EACP,SAAS;CACX;CACA,MAAM;EACJ,SAAS;EACT,WAAW;CACb;AACF"}

package/dist/esm/themes/types.d.ts

@@ -0,0 +1,67 @@
+import { NavigationProps } from "../types/widget.js";
+import { CSSProperties } from "react";
+import { CardProps, ComponentsOverrides, ComponentsVariants, SimplePaletteColorOptions, TabProps, TabsProps } from "@mui/material";
+
+//#region src/themes/types.d.ts
+declare module "@mui/material/styles" {
+  interface Shape {
+    borderRadius: number;
+    borderRadiusSecondary: number;
+    borderRadiusTertiary: number;
+  }
+  interface Theme {
+    shape: Shape;
+    container: CSSProperties;
+    routesContainer: CSSProperties;
+    chainSidebarContainer: CSSProperties;
+    header: CSSProperties;
+    navigation: NavigationProps;
+  }
+  interface ThemeOptions {
+    shape?: Partial<Shape>;
+    container?: CSSProperties;
+    routesContainer?: CSSProperties;
+    chainSidebarContainer?: CSSProperties;
+    header?: CSSProperties;
+    navigation?: NavigationProps;
+  }
+  interface ComponentNameToClassKey {
+    MuiInputCard: "root";
+    MuiNavigationTabs: "root";
+    MuiNavigationTab: "root";
+  }
+  interface ComponentsPropsList {
+    MuiInputCard: Partial<CardProps>;
+    MuiNavigationTabs: Partial<TabsProps>;
+    MuiNavigationTab: Partial<TabProps>;
+  }
+  interface Components {
+    MuiInputCard?: {
+      defaultProps?: ComponentsPropsList["MuiInputCard"];
+      styleOverrides?: ComponentsOverrides<Omit<Theme, "components">>["MuiInputCard"];
+      variants?: ComponentsVariants["MuiInputCard"];
+    };
+    MuiNavigationTabs?: {
+      defaultProps?: ComponentsPropsList["MuiNavigationTabs"];
+      styleOverrides?: ComponentsOverrides<Omit<Theme, "components">>["MuiNavigationTabs"];
+      variants?: ComponentsVariants["MuiNavigationTabs"];
+    };
+    MuiNavigationTab?: {
+      defaultProps?: ComponentsPropsList["MuiNavigationTab"];
+      styleOverrides?: ComponentsOverrides<Omit<Theme, "components">>["MuiNavigationTab"];
+      variants?: ComponentsVariants["MuiNavigationTab"];
+    };
+  }
+  interface Palette {
+    playground: Palette["primary"];
+  }
+  interface PaletteOptions {
+    playground?: SimplePaletteColorOptions;
+  }
+}
+declare module "@mui/material/Paper" {
+  interface PaperPropsVariantOverrides {
+    filled: true;
+  }
+}
+//# sourceMappingURL=types.d.ts.map

package/dist/esm/themes/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","names":[],"sources":["../../../src/themes/types.ts"],"mappings":";;;;;;YAcY,KAAA;IACR,YAAA;IACA,qBAAA;IACA,oBAAA;EAAA;EAAA,UAEQ,KAAA;IACR,KAAA,EAAO,KAAA;IACP,SAAA,EAAW,aAAA;IACX,eAAA,EAAiB,aAAA;IACjB,qBAAA,EAAuB,aAAA;IACvB,MAAA,EAAQ,aAAA;IACR,UAAA,EAAY,eAAA;EAAA;EAAA,UAEJ,YAAA;IACR,KAAA,GAAQ,OAAA,CAAQ,KAAA;IAChB,SAAA,GAAY,aAAA;IACZ,eAAA,GAAkB,aAAA;IAClB,qBAAA,GAAwB,aAAA;IACxB,MAAA,GAAS,aAAA;IACT,UAAA,GAAa,eAAA;EAAA;EAAA,UAEL,uBAAA;IACR,YAAA;IACA,iBAAA;IACA,gBAAA;EAAA;EAAA,UAEQ,mBAAA;IACR,YAAA,EAAc,OAAA,CAAQ,SAAA;IACtB,iBAAA,EAAmB,OAAA,CAAQ,SAAA;IAC3B,gBAAA,EAAkB,OAAA,CAAQ,QAAA;EAAA;EAAA,UAElB,UAAA;IACR,YAAA;MACE,YAAA,GAAe,mBAAA;MACf,cAAA,GAAiB,mBAAA,CACf,IAAA,CAAK,KAAA;MAEP,QAAA,GAAW,kBAAA;IAAA;IAEb,iBAAA;MACE,YAAA,GAAe,mBAAA;MACf,cAAA,GAAiB,mBAAA,CACf,IAAA,CAAK,KAAA;MAEP,QAAA,GAAW,kBAAA;IAAA;IAEb,gBAAA;MACE,YAAA,GAAe,mBAAA;MACf,cAAA,GAAiB,mBAAA,CACf,IAAA,CAAK,KAAA;MAEP,QAAA,GAAW,kBAAA;IAAA;EAAA;EAAA,UAGL,OAAA;IACR,UAAA,EAAY,OAAA;EAAA;EAAA,UAGJ,cAAA;IACR,UAAA,GAAa,yBAAA;EAAA;AAAA;AAAA;EAAA,UAKL,0BAAA;IACR,MAAA;EAAA;AAAA"}

package/dist/esm/themes/utils.js

@@ -0,0 +1,13 @@
+//#region src/themes/utils.ts
+const getStyleOverrides = (componentName, styleOverrideProp, theme, ownerState) => {
+	const property = ((theme.components?.[componentName])?.styleOverrides)?.[styleOverrideProp];
+	if (typeof property === "function") return property({
+		theme,
+		ownerState
+	});
+	return property;
+};
+//#endregion
+export { getStyleOverrides };
+
+//# sourceMappingURL=utils.js.map

package/dist/esm/themes/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","names":[],"sources":["../../../src/themes/utils.ts"],"sourcesContent":["import type { WidgetTheme, WidgetThemeComponents } from '../types/widget.js'\n\ntype ComponentName = keyof WidgetThemeComponents\n\nexport const getStyleOverrides = (\n  componentName: ComponentName,\n  styleOverrideProp: string,\n  theme: WidgetTheme,\n  ownerState?: any\n): any => {\n  const component = theme.components?.[componentName]\n  const property = (component?.styleOverrides as any)?.[styleOverrideProp]\n\n  if (typeof property === 'function') {\n    return property({ theme, ownerState })\n  }\n  return property\n}\n"],"mappings":";AAIA,MAAa,qBACX,eACA,mBACA,OACA,eACQ;CAER,MAAM,aADY,MAAM,aAAa,iBACR,kBAAyB;CAEtD,IAAI,OAAO,aAAa,YACtB,OAAO,SAAS;EAAE;EAAO;CAAW,CAAC;CAEvC,OAAO;AACT"}

package/dist/esm/themes/watermelonLight.d.ts

@@ -0,0 +1,7 @@
+import { WidgetTheme } from "../types/widget.js";
+
+//#region src/themes/watermelonLight.d.ts
+declare const watermelonLightTheme: WidgetTheme;
+//#endregion
+export { watermelonLightTheme };
+//# sourceMappingURL=watermelonLight.d.ts.map

package/dist/esm/themes/watermelonLight.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"watermelonLight.d.ts","names":[],"sources":["../../../src/themes/watermelonLight.ts"],"mappings":";;;cAGa,oBAAA,EAAsB,WAAA"}