@xyo-network/react-chain-shared 1.3.4 → 1.3.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/browser/index.mjs
CHANGED
|
@@ -9,9 +9,19 @@ var ActiveMenuItem = /* @__PURE__ */ __name(({ active, children, sx, ...props })
|
|
|
9
9
|
return /* @__PURE__ */ React.createElement(StyledMenuItem, {
|
|
10
10
|
disableRipple: true,
|
|
11
11
|
sx: {
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
12
|
+
// left border color and background color for active state
|
|
13
|
+
"borderLeft": `5px solid ${active ? theme.vars.palette.secondary.light : "transparent"}`,
|
|
14
|
+
"backgroundColor": active ? theme.vars.palette.secondary.dark : "transparent",
|
|
15
|
+
// force white text color for active state for improved readability with background color
|
|
16
|
+
"color": active ? "white" : "unset",
|
|
17
|
+
"&:hover": {
|
|
18
|
+
// overriding default hover color and backgroundColor since active state conflicts visually with
|
|
19
|
+
// default styles of MenuItem hover
|
|
20
|
+
...active ? {
|
|
21
|
+
backgroundColor: theme.vars.palette.secondary.dark
|
|
22
|
+
} : {},
|
|
23
|
+
color: active ? "white" : "unset"
|
|
24
|
+
},
|
|
15
25
|
...sx
|
|
16
26
|
},
|
|
17
27
|
...props
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/menu-item/ActiveMenuItem.tsx"],"sourcesContent":["import type { MenuItemProps } from '@mui/material'\nimport {\n MenuItem, styled, useTheme,\n} from '@mui/material'\nimport React from 'react'\n\nexport const ActiveMenuItem: React.FC<MenuItemProps & { active?: boolean }> = ({\n active, children, sx, ...props\n}) => {\n const theme = useTheme()\n return (\n <StyledMenuItem\n disableRipple\n sx={{\n borderLeft: `5px solid ${active ? theme.vars.palette.secondary.light : 'transparent'}`,\n backgroundColor: active ? theme.vars.palette.secondary.dark : 'transparent',\n color: active ? 'white' : '
|
|
1
|
+
{"version":3,"sources":["../../src/components/menu-item/ActiveMenuItem.tsx"],"sourcesContent":["import type { MenuItemProps } from '@mui/material'\nimport {\n MenuItem, styled, useTheme,\n} from '@mui/material'\nimport React from 'react'\n\nexport const ActiveMenuItem: React.FC<MenuItemProps & { active?: boolean }> = ({\n active, children, sx, ...props\n}) => {\n const theme = useTheme()\n return (\n <StyledMenuItem\n disableRipple\n sx={{\n // left border color and background color for active state\n 'borderLeft': `5px solid ${active ? theme.vars.palette.secondary.light : 'transparent'}`,\n 'backgroundColor': active ? theme.vars.palette.secondary.dark : 'transparent',\n // force white text color for active state for improved readability with background color\n 'color': active ? 'white' : 'unset',\n '&:hover': {\n // overriding default hover color and backgroundColor since active state conflicts visually with\n // default styles of MenuItem hover\n ...(active ? { backgroundColor: theme.vars.palette.secondary.dark } : {}),\n color: active ? 'white' : 'unset',\n },\n ...sx,\n }}\n {...props}\n >\n {children}\n </StyledMenuItem>\n )\n}\n\nconst StyledMenuItem = styled(MenuItem, { name: 'StyledMenuItem' })(({ theme }) => ({\n display: 'flex-inline',\n flexDirection: 'row',\n gap: theme.spacing(1),\n padding: 0,\n paddingLeft: theme.spacing(1),\n marginBottom: theme.spacing(1),\n}))\n"],"mappings":";;;;AACA,SACEA,UAAUC,QAAQC,gBACb;AACP,OAAOC,WAAW;AAEX,IAAMC,iBAAiE,wBAAC,EAC7EC,QAAQC,UAAUC,IAAI,GAAGC,MAAAA,MAC1B;AACC,QAAMC,QAAQC,SAAAA;AACd,SACE,sBAAA,cAACC,gBAAAA;IACCC,eAAAA;IACAL,IAAI;;MAEF,cAAc,aAAaF,SAASI,MAAMI,KAAKC,QAAQC,UAAUC,QAAQ,aAAA;MACzE,mBAAmBX,SAASI,MAAMI,KAAKC,QAAQC,UAAUE,OAAO;;MAEhE,SAASZ,SAAS,UAAU;MAC5B,WAAW;;;QAGT,GAAIA,SAAS;UAAEa,iBAAiBT,MAAMI,KAAKC,QAAQC,UAAUE;QAAK,IAAI,CAAC;QACvEE,OAAOd,SAAS,UAAU;MAC5B;MACA,GAAGE;IACL;IACC,GAAGC;KAEHF,QAAAA;AAGP,GA1B8E;AA4B9E,IAAMK,iBAAiBS,OAAOC,UAAU;EAAEC,MAAM;AAAiB,CAAA,EAAG,CAAC,EAAEb,MAAK,OAAQ;EAClFc,SAAS;EACTC,eAAe;EACfC,KAAKhB,MAAMiB,QAAQ,CAAA;EACnBC,SAAS;EACTC,aAAanB,MAAMiB,QAAQ,CAAA;EAC3BG,cAAcpB,MAAMiB,QAAQ,CAAA;AAC9B,EAAA;","names":["MenuItem","styled","useTheme","React","ActiveMenuItem","active","children","sx","props","theme","useTheme","StyledMenuItem","disableRipple","vars","palette","secondary","light","dark","backgroundColor","color","styled","MenuItem","name","display","flexDirection","gap","spacing","padding","paddingLeft","marginBottom"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ActiveMenuItem.d.ts","sourceRoot":"","sources":["../../../../src/components/menu-item/ActiveMenuItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,eAAe,CAAA;AAIlD,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,GAAG;IAAE,MAAM,CAAC,EAAE,OAAO,CAAA;CAAE,
|
|
1
|
+
{"version":3,"file":"ActiveMenuItem.d.ts","sourceRoot":"","sources":["../../../../src/components/menu-item/ActiveMenuItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,eAAe,CAAA;AAIlD,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,GAAG;IAAE,MAAM,CAAC,EAAE,OAAO,CAAA;CAAE,CA0BzE,CAAA"}
|
package/package.json
CHANGED
|
@@ -12,9 +12,17 @@ export const ActiveMenuItem: React.FC<MenuItemProps & { active?: boolean }> = ({
|
|
|
12
12
|
<StyledMenuItem
|
|
13
13
|
disableRipple
|
|
14
14
|
sx={{
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
15
|
+
// left border color and background color for active state
|
|
16
|
+
'borderLeft': `5px solid ${active ? theme.vars.palette.secondary.light : 'transparent'}`,
|
|
17
|
+
'backgroundColor': active ? theme.vars.palette.secondary.dark : 'transparent',
|
|
18
|
+
// force white text color for active state for improved readability with background color
|
|
19
|
+
'color': active ? 'white' : 'unset',
|
|
20
|
+
'&:hover': {
|
|
21
|
+
// overriding default hover color and backgroundColor since active state conflicts visually with
|
|
22
|
+
// default styles of MenuItem hover
|
|
23
|
+
...(active ? { backgroundColor: theme.vars.palette.secondary.dark } : {}),
|
|
24
|
+
color: active ? 'white' : 'unset',
|
|
25
|
+
},
|
|
18
26
|
...sx,
|
|
19
27
|
}}
|
|
20
28
|
{...props}
|