npm - @zidsa/zidmui - Versions diffs - 2.1.7 → 2.1.8 - Mend

@zidsa/zidmui 2.1.7 → 2.1.8

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.

Files changed (6) hide show

package/dist/react/cjs/theme/components/switch.js +4 -0
package/dist/react/cjs/theme/components/switch.js.map +1 -1
package/dist/react/es/theme/components/switch.js +4 -0
package/dist/react/es/theme/components/switch.js.map +1 -1
package/dist/tsconfig.tsbuildinfo +1 -1
package/package.json +1 -1

package/dist/react/cjs/theme/components/switch.js CHANGED Viewed

@@ -115,6 +115,10 @@ const MuiSwitch = {
             boxShadow: "none"
           }
         },
+        "& .MuiSwitch-input": {
+          left: "unset",
+          width: "100%"
+        },
         "& .MuiSwitch-thumb": {
           boxSizing: "border-box",
           width: toggleCircleSize,

package/dist/react/cjs/theme/components/switch.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"switch.js","sources":["../../../../../src/theme/components/switch.ts"],"sourcesContent":["import type {} from '@mui/lab/themeAugmentation';\nimport { Components, CssVarsTheme, Theme } from '@mui/material';\n\nconst createSwitchActiveStyles = (theme: CssVarsTheme, colorKey: 'primary' \| 'error') => {\n const toggleCircleSize = theme.spacing(1.83);\n const pressedToggleCircleSize = theme.spacing(2.25);\n const transformValue = theme.spacing(0.5);\n\n return {\n '&:active': {\n '& .MuiSwitch-switchBase.Mui-checked + .MuiSwitch-track': {\n backgroundColor: theme.palette._components.switch?.[colorKey]?.pressedBackground,\n boxShadow: 'none',\n },\n '& .MuiSwitch-switchBase:not(.Mui-checked)': {\n '& + .MuiSwitch-track': {\n boxShadow: 'none',\n },\n '& .MuiSwitch-thumb': {\n width: `${pressedToggleCircleSize}`,\n transform: 'translateX(0)',\n borderRadius: toggleCircleSize,\n },\n },\n '& .MuiSwitch-switchBase.Mui-checked': {\n '& + .MuiSwitch-track': {\n boxShadow: 'none',\n },\n '& .MuiSwitch-thumb': {\n width: `${pressedToggleCircleSize}`,\n transform: `translateX(-${transformValue})`,\n borderRadius: toggleCircleSize,\n },\n },\n },\n };\n};\n\nexport const MuiSwitch: Components<\n Omit<Theme, 'components' \| 'palette'> & CssVarsTheme\n>['MuiSwitch'] = {\n defaultProps: {\n disableRipple: true,\n disableTouchRipple: true,\n },\n variants: [\n {\n props: { color: 'primary' },\n style: ({ theme }) => ({\n ...createSwitchActiveStyles(theme, 'primary'),\n '& .MuiSwitch-switchBase.Mui-checked': {\n '& + .MuiSwitch-track': {\n backgroundColor: theme.palette._components.switch?.primary?.activeBackground,\n },\n },\n }),\n },\n {\n props: { color: 'error' },\n style: ({ theme }) => ({\n ...createSwitchActiveStyles(theme, 'error'),\n '& .MuiSwitch-switchBase.Mui-checked': {\n '& + .MuiSwitch-track': {\n backgroundColor: theme.palette._components.switch?.error?.activeBackground,\n },\n },\n }),\n },\n ],\n styleOverrides: {\n root: ({ theme }) => {\n const toggleSwitchWidth = theme.spacing(4);\n const toggleSwitchHeight = theme.spacing(2.5);\n const toggleCircleSize = theme.spacing(1.83);\n const innerMargin = theme.spacing(0.33);\n const shadowValue = theme.spacing(0, 0, 0, 0.25);\n const transformValue = theme.spacing(1.51); // 4 - 1.83 - 0.33 * 2 = 1.51\n\n return {\n width: toggleSwitchWidth,\n height: toggleSwitchHeight,\n padding: 0,\n overflow: 'visible',\n marginInlineStart: theme.spacing(0),\n marginInlineEnd: theme.spacing(1),\n '&:hover': {\n '& .MuiSwitch-switchBase:not(.Mui-checked)': {\n '& + .MuiSwitch-track': {\n boxShadow: `${shadowValue} ${theme.palette._components.switch?.shadow}`,\n },\n },\n '& .MuiSwitch-switchBase.Mui-disabled + .MuiSwitch-track': {\n boxShadow: 'none',\n },\n },\n '& .MuiSwitch-switchBase': {\n padding: 0,\n margin: innerMargin,\n width: toggleCircleSize,\n transitionDuration: '300ms',\n '&.Mui-checked': {\n transform: `translateX(${transformValue})`,\n color: theme.palette._components?.switch?.knobFillEnabled,\n '& + .MuiSwitch-track': {\n opacity: 1,\n boxShadow: 'none',\n },\n '&.Mui-disabled + .MuiSwitch-track': {\n opacity: 0.5,\n },\n },\n '&.Mui-focusVisible .MuiSwitch-thumb': {\n color: theme.palette._components?.switch?.color,\n boxShadow: `${shadowValue} ${theme.palette._components?.switch?.background}`,\n },\n '&.Mui-disabled .MuiSwitch-thumb': {\n color: theme.palette._components?.switch?.knobFillEnabled,\n },\n '&.Mui-disabled + .MuiSwitch-track': {\n opacity: 0.7,\n boxShadow: 'none',\n },\n },\n '& .MuiSwitch-thumb': {\n boxSizing: 'border-box',\n width: toggleCircleSize,\n height: toggleCircleSize,\n borderRadius: toggleCircleSize,\n borderWidth: theme.spacing(0.08375),\n borderStyle: 'solid',\n borderColor: theme.palette._components.switch.knowFillDisabled,\n boxShadow: theme.shadows[2],\n transition: theme.transitions.create(['transform'], {\n duration: 300,\n }),\n },\n '& .MuiSwitch-track': {\n borderRadius: theme.spacing(8.25),\n backgroundColor: theme.palette._components.switch?.slideFill,\n opacity: 1,\n transition: theme.transitions.create(['background-color'], {\n duration: 500,\n }),\n boxShadow: `${shadowValue} transparent`,\n },\n };\n },\n },\n};\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"switch.js","sources":["../../../../../src/theme/components/switch.ts"],"sourcesContent":["import type {} from '@mui/lab/themeAugmentation';\nimport { Components, CssVarsTheme, Theme } from '@mui/material';\n\nconst createSwitchActiveStyles = (theme: CssVarsTheme, colorKey: 'primary' \| 'error') => {\n const toggleCircleSize = theme.spacing(1.83);\n const pressedToggleCircleSize = theme.spacing(2.25);\n const transformValue = theme.spacing(0.5);\n\n return {\n '&:active': {\n '& .MuiSwitch-switchBase.Mui-checked + .MuiSwitch-track': {\n backgroundColor: theme.palette._components.switch?.[colorKey]?.pressedBackground,\n boxShadow: 'none',\n },\n '& .MuiSwitch-switchBase:not(.Mui-checked)': {\n '& + .MuiSwitch-track': {\n boxShadow: 'none',\n },\n '& .MuiSwitch-thumb': {\n width: `${pressedToggleCircleSize}`,\n transform: 'translateX(0)',\n borderRadius: toggleCircleSize,\n },\n },\n '& .MuiSwitch-switchBase.Mui-checked': {\n '& + .MuiSwitch-track': {\n boxShadow: 'none',\n },\n '& .MuiSwitch-thumb': {\n width: `${pressedToggleCircleSize}`,\n transform: `translateX(-${transformValue})`,\n borderRadius: toggleCircleSize,\n },\n },\n },\n };\n};\n\nexport const MuiSwitch: Components<\n Omit<Theme, 'components' \| 'palette'> & CssVarsTheme\n>['MuiSwitch'] = {\n defaultProps: {\n disableRipple: true,\n disableTouchRipple: true,\n },\n variants: [\n {\n props: { color: 'primary' },\n style: ({ theme }) => ({\n ...createSwitchActiveStyles(theme, 'primary'),\n '& .MuiSwitch-switchBase.Mui-checked': {\n '& + .MuiSwitch-track': {\n backgroundColor: theme.palette._components.switch?.primary?.activeBackground,\n },\n },\n }),\n },\n {\n props: { color: 'error' },\n style: ({ theme }) => ({\n ...createSwitchActiveStyles(theme, 'error'),\n '& .MuiSwitch-switchBase.Mui-checked': {\n '& + .MuiSwitch-track': {\n backgroundColor: theme.palette._components.switch?.error?.activeBackground,\n },\n },\n }),\n },\n ],\n styleOverrides: {\n root: ({ theme }) => {\n const toggleSwitchWidth = theme.spacing(4);\n const toggleSwitchHeight = theme.spacing(2.5);\n const toggleCircleSize = theme.spacing(1.83);\n const innerMargin = theme.spacing(0.33);\n const shadowValue = theme.spacing(0, 0, 0, 0.25);\n const transformValue = theme.spacing(1.51); // 4 - 1.83 - 0.33 * 2 = 1.51\n\n return {\n width: toggleSwitchWidth,\n height: toggleSwitchHeight,\n padding: 0,\n overflow: 'visible',\n marginInlineStart: theme.spacing(0),\n marginInlineEnd: theme.spacing(1),\n '&:hover': {\n '& .MuiSwitch-switchBase:not(.Mui-checked)': {\n '& + .MuiSwitch-track': {\n boxShadow: `${shadowValue} ${theme.palette._components.switch?.shadow}`,\n },\n },\n '& .MuiSwitch-switchBase.Mui-disabled + .MuiSwitch-track': {\n boxShadow: 'none',\n },\n },\n '& .MuiSwitch-switchBase': {\n padding: 0,\n margin: innerMargin,\n width: toggleCircleSize,\n transitionDuration: '300ms',\n '&.Mui-checked': {\n transform: `translateX(${transformValue})`,\n color: theme.palette._components?.switch?.knobFillEnabled,\n '& + .MuiSwitch-track': {\n opacity: 1,\n boxShadow: 'none',\n },\n '&.Mui-disabled + .MuiSwitch-track': {\n opacity: 0.5,\n },\n },\n '&.Mui-focusVisible .MuiSwitch-thumb': {\n color: theme.palette._components?.switch?.color,\n boxShadow: `${shadowValue} ${theme.palette._components?.switch?.background}`,\n },\n '&.Mui-disabled .MuiSwitch-thumb': {\n color: theme.palette._components?.switch?.knobFillEnabled,\n },\n '&.Mui-disabled + .MuiSwitch-track': {\n opacity: 0.7,\n boxShadow: 'none',\n },\n },\n '& .MuiSwitch-input': {\n left: 'unset',\n width: '100%',\n },\n '& .MuiSwitch-thumb': {\n boxSizing: 'border-box',\n width: toggleCircleSize,\n height: toggleCircleSize,\n borderRadius: toggleCircleSize,\n borderWidth: theme.spacing(0.08375),\n borderStyle: 'solid',\n borderColor: theme.palette._components.switch.knowFillDisabled,\n boxShadow: theme.shadows[2],\n transition: theme.transitions.create(['transform'], {\n duration: 300,\n }),\n },\n '& .MuiSwitch-track': {\n borderRadius: theme.spacing(8.25),\n backgroundColor: theme.palette._components.switch?.slideFill,\n opacity: 1,\n transition: theme.transitions.create(['background-color'], {\n duration: 500,\n }),\n boxShadow: `${shadowValue} transparent`,\n },\n };\n },\n },\n};\n"],"names":[],"mappings":"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"}

package/dist/react/es/theme/components/switch.js CHANGED Viewed

@@ -113,6 +113,10 @@ const MuiSwitch = {
             boxShadow: "none"
           }
         },
+        "& .MuiSwitch-input": {
+          left: "unset",
+          width: "100%"
+        },
         "& .MuiSwitch-thumb": {
           boxSizing: "border-box",
           width: toggleCircleSize,

package/dist/react/es/theme/components/switch.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"switch.js","sources":["../../../../../src/theme/components/switch.ts"],"sourcesContent":["import type {} from '@mui/lab/themeAugmentation';\nimport { Components, CssVarsTheme, Theme } from '@mui/material';\n\nconst createSwitchActiveStyles = (theme: CssVarsTheme, colorKey: 'primary' \| 'error') => {\n const toggleCircleSize = theme.spacing(1.83);\n const pressedToggleCircleSize = theme.spacing(2.25);\n const transformValue = theme.spacing(0.5);\n\n return {\n '&:active': {\n '& .MuiSwitch-switchBase.Mui-checked + .MuiSwitch-track': {\n backgroundColor: theme.palette._components.switch?.[colorKey]?.pressedBackground,\n boxShadow: 'none',\n },\n '& .MuiSwitch-switchBase:not(.Mui-checked)': {\n '& + .MuiSwitch-track': {\n boxShadow: 'none',\n },\n '& .MuiSwitch-thumb': {\n width: `${pressedToggleCircleSize}`,\n transform: 'translateX(0)',\n borderRadius: toggleCircleSize,\n },\n },\n '& .MuiSwitch-switchBase.Mui-checked': {\n '& + .MuiSwitch-track': {\n boxShadow: 'none',\n },\n '& .MuiSwitch-thumb': {\n width: `${pressedToggleCircleSize}`,\n transform: `translateX(-${transformValue})`,\n borderRadius: toggleCircleSize,\n },\n },\n },\n };\n};\n\nexport const MuiSwitch: Components<\n Omit<Theme, 'components' \| 'palette'> & CssVarsTheme\n>['MuiSwitch'] = {\n defaultProps: {\n disableRipple: true,\n disableTouchRipple: true,\n },\n variants: [\n {\n props: { color: 'primary' },\n style: ({ theme }) => ({\n ...createSwitchActiveStyles(theme, 'primary'),\n '& .MuiSwitch-switchBase.Mui-checked': {\n '& + .MuiSwitch-track': {\n backgroundColor: theme.palette._components.switch?.primary?.activeBackground,\n },\n },\n }),\n },\n {\n props: { color: 'error' },\n style: ({ theme }) => ({\n ...createSwitchActiveStyles(theme, 'error'),\n '& .MuiSwitch-switchBase.Mui-checked': {\n '& + .MuiSwitch-track': {\n backgroundColor: theme.palette._components.switch?.error?.activeBackground,\n },\n },\n }),\n },\n ],\n styleOverrides: {\n root: ({ theme }) => {\n const toggleSwitchWidth = theme.spacing(4);\n const toggleSwitchHeight = theme.spacing(2.5);\n const toggleCircleSize = theme.spacing(1.83);\n const innerMargin = theme.spacing(0.33);\n const shadowValue = theme.spacing(0, 0, 0, 0.25);\n const transformValue = theme.spacing(1.51); // 4 - 1.83 - 0.33 * 2 = 1.51\n\n return {\n width: toggleSwitchWidth,\n height: toggleSwitchHeight,\n padding: 0,\n overflow: 'visible',\n marginInlineStart: theme.spacing(0),\n marginInlineEnd: theme.spacing(1),\n '&:hover': {\n '& .MuiSwitch-switchBase:not(.Mui-checked)': {\n '& + .MuiSwitch-track': {\n boxShadow: `${shadowValue} ${theme.palette._components.switch?.shadow}`,\n },\n },\n '& .MuiSwitch-switchBase.Mui-disabled + .MuiSwitch-track': {\n boxShadow: 'none',\n },\n },\n '& .MuiSwitch-switchBase': {\n padding: 0,\n margin: innerMargin,\n width: toggleCircleSize,\n transitionDuration: '300ms',\n '&.Mui-checked': {\n transform: `translateX(${transformValue})`,\n color: theme.palette._components?.switch?.knobFillEnabled,\n '& + .MuiSwitch-track': {\n opacity: 1,\n boxShadow: 'none',\n },\n '&.Mui-disabled + .MuiSwitch-track': {\n opacity: 0.5,\n },\n },\n '&.Mui-focusVisible .MuiSwitch-thumb': {\n color: theme.palette._components?.switch?.color,\n boxShadow: `${shadowValue} ${theme.palette._components?.switch?.background}`,\n },\n '&.Mui-disabled .MuiSwitch-thumb': {\n color: theme.palette._components?.switch?.knobFillEnabled,\n },\n '&.Mui-disabled + .MuiSwitch-track': {\n opacity: 0.7,\n boxShadow: 'none',\n },\n },\n '& .MuiSwitch-thumb': {\n boxSizing: 'border-box',\n width: toggleCircleSize,\n height: toggleCircleSize,\n borderRadius: toggleCircleSize,\n borderWidth: theme.spacing(0.08375),\n borderStyle: 'solid',\n borderColor: theme.palette._components.switch.knowFillDisabled,\n boxShadow: theme.shadows[2],\n transition: theme.transitions.create(['transform'], {\n duration: 300,\n }),\n },\n '& .MuiSwitch-track': {\n borderRadius: theme.spacing(8.25),\n backgroundColor: theme.palette._components.switch?.slideFill,\n opacity: 1,\n transition: theme.transitions.create(['background-color'], {\n duration: 500,\n }),\n boxShadow: `${shadowValue} transparent`,\n },\n };\n },\n },\n};\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"switch.js","sources":["../../../../../src/theme/components/switch.ts"],"sourcesContent":["import type {} from '@mui/lab/themeAugmentation';\nimport { Components, CssVarsTheme, Theme } from '@mui/material';\n\nconst createSwitchActiveStyles = (theme: CssVarsTheme, colorKey: 'primary' \| 'error') => {\n const toggleCircleSize = theme.spacing(1.83);\n const pressedToggleCircleSize = theme.spacing(2.25);\n const transformValue = theme.spacing(0.5);\n\n return {\n '&:active': {\n '& .MuiSwitch-switchBase.Mui-checked + .MuiSwitch-track': {\n backgroundColor: theme.palette._components.switch?.[colorKey]?.pressedBackground,\n boxShadow: 'none',\n },\n '& .MuiSwitch-switchBase:not(.Mui-checked)': {\n '& + .MuiSwitch-track': {\n boxShadow: 'none',\n },\n '& .MuiSwitch-thumb': {\n width: `${pressedToggleCircleSize}`,\n transform: 'translateX(0)',\n borderRadius: toggleCircleSize,\n },\n },\n '& .MuiSwitch-switchBase.Mui-checked': {\n '& + .MuiSwitch-track': {\n boxShadow: 'none',\n },\n '& .MuiSwitch-thumb': {\n width: `${pressedToggleCircleSize}`,\n transform: `translateX(-${transformValue})`,\n borderRadius: toggleCircleSize,\n },\n },\n },\n };\n};\n\nexport const MuiSwitch: Components<\n Omit<Theme, 'components' \| 'palette'> & CssVarsTheme\n>['MuiSwitch'] = {\n defaultProps: {\n disableRipple: true,\n disableTouchRipple: true,\n },\n variants: [\n {\n props: { color: 'primary' },\n style: ({ theme }) => ({\n ...createSwitchActiveStyles(theme, 'primary'),\n '& .MuiSwitch-switchBase.Mui-checked': {\n '& + .MuiSwitch-track': {\n backgroundColor: theme.palette._components.switch?.primary?.activeBackground,\n },\n },\n }),\n },\n {\n props: { color: 'error' },\n style: ({ theme }) => ({\n ...createSwitchActiveStyles(theme, 'error'),\n '& .MuiSwitch-switchBase.Mui-checked': {\n '& + .MuiSwitch-track': {\n backgroundColor: theme.palette._components.switch?.error?.activeBackground,\n },\n },\n }),\n },\n ],\n styleOverrides: {\n root: ({ theme }) => {\n const toggleSwitchWidth = theme.spacing(4);\n const toggleSwitchHeight = theme.spacing(2.5);\n const toggleCircleSize = theme.spacing(1.83);\n const innerMargin = theme.spacing(0.33);\n const shadowValue = theme.spacing(0, 0, 0, 0.25);\n const transformValue = theme.spacing(1.51); // 4 - 1.83 - 0.33 * 2 = 1.51\n\n return {\n width: toggleSwitchWidth,\n height: toggleSwitchHeight,\n padding: 0,\n overflow: 'visible',\n marginInlineStart: theme.spacing(0),\n marginInlineEnd: theme.spacing(1),\n '&:hover': {\n '& .MuiSwitch-switchBase:not(.Mui-checked)': {\n '& + .MuiSwitch-track': {\n boxShadow: `${shadowValue} ${theme.palette._components.switch?.shadow}`,\n },\n },\n '& .MuiSwitch-switchBase.Mui-disabled + .MuiSwitch-track': {\n boxShadow: 'none',\n },\n },\n '& .MuiSwitch-switchBase': {\n padding: 0,\n margin: innerMargin,\n width: toggleCircleSize,\n transitionDuration: '300ms',\n '&.Mui-checked': {\n transform: `translateX(${transformValue})`,\n color: theme.palette._components?.switch?.knobFillEnabled,\n '& + .MuiSwitch-track': {\n opacity: 1,\n boxShadow: 'none',\n },\n '&.Mui-disabled + .MuiSwitch-track': {\n opacity: 0.5,\n },\n },\n '&.Mui-focusVisible .MuiSwitch-thumb': {\n color: theme.palette._components?.switch?.color,\n boxShadow: `${shadowValue} ${theme.palette._components?.switch?.background}`,\n },\n '&.Mui-disabled .MuiSwitch-thumb': {\n color: theme.palette._components?.switch?.knobFillEnabled,\n },\n '&.Mui-disabled + .MuiSwitch-track': {\n opacity: 0.7,\n boxShadow: 'none',\n },\n },\n '& .MuiSwitch-input': {\n left: 'unset',\n width: '100%',\n },\n '& .MuiSwitch-thumb': {\n boxSizing: 'border-box',\n width: toggleCircleSize,\n height: toggleCircleSize,\n borderRadius: toggleCircleSize,\n borderWidth: theme.spacing(0.08375),\n borderStyle: 'solid',\n borderColor: theme.palette._components.switch.knowFillDisabled,\n boxShadow: theme.shadows[2],\n transition: theme.transitions.create(['transform'], {\n duration: 300,\n }),\n },\n '& .MuiSwitch-track': {\n borderRadius: theme.spacing(8.25),\n backgroundColor: theme.palette._components.switch?.slideFill,\n opacity: 1,\n transition: theme.transitions.create(['background-color'], {\n duration: 500,\n }),\n boxShadow: `${shadowValue} transparent`,\n },\n };\n },\n },\n};\n"],"names":[],"mappings":"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"}