ece-docs-components 1.0.8 → 1.0.9
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/cjs/components/Button.js +9 -6
- package/dist/cjs/components/Button.js.map +1 -1
- package/dist/cjs/components/Input.js +8 -10
- package/dist/cjs/components/Input.js.map +1 -1
- package/dist/esm/components/Button.js +9 -6
- package/dist/esm/components/Button.js.map +1 -1
- package/dist/esm/components/Input.js +8 -10
- package/dist/esm/components/Input.js.map +1 -1
- package/package.json +1 -1
|
@@ -23,13 +23,14 @@ const StyledButton = styles.styled(material.Button, {
|
|
|
23
23
|
fontSize: '1.125rem',
|
|
24
24
|
},
|
|
25
25
|
};
|
|
26
|
-
// Base styles
|
|
26
|
+
// Base styles - ADD BORDER TO ALL VARIANTS
|
|
27
27
|
const baseStyles = {
|
|
28
28
|
fontWeight: 500,
|
|
29
29
|
borderRadius: '8px',
|
|
30
30
|
textTransform: 'none',
|
|
31
31
|
transition: 'all 0.2s',
|
|
32
32
|
boxShadow: 'none',
|
|
33
|
+
border: '2px solid transparent',
|
|
33
34
|
'&:hover': {
|
|
34
35
|
boxShadow: 'none',
|
|
35
36
|
},
|
|
@@ -44,6 +45,7 @@ const StyledButton = styles.styled(material.Button, {
|
|
|
44
45
|
primary: {
|
|
45
46
|
backgroundColor: currentTheme.primary.main,
|
|
46
47
|
color: currentTheme.custom?.primaryButtonTextColor || '#FFFFFF',
|
|
48
|
+
borderColor: 'transparent', // Transparent border
|
|
47
49
|
boxShadow: '0 1px 2px 0 rgba(0, 0, 0, 0.05)',
|
|
48
50
|
'&:hover': {
|
|
49
51
|
backgroundColor: currentTheme.primary.main,
|
|
@@ -53,6 +55,7 @@ const StyledButton = styles.styled(material.Button, {
|
|
|
53
55
|
secondary: {
|
|
54
56
|
backgroundColor: currentTheme.secondary.main,
|
|
55
57
|
color: currentTheme.dark.main,
|
|
58
|
+
borderColor: 'transparent', // Transparent border
|
|
56
59
|
boxShadow: '0 1px 2px 0 rgba(0, 0, 0, 0.05)',
|
|
57
60
|
'&:hover': {
|
|
58
61
|
backgroundColor: currentTheme.secondary.main,
|
|
@@ -61,7 +64,7 @@ const StyledButton = styles.styled(material.Button, {
|
|
|
61
64
|
},
|
|
62
65
|
outline: {
|
|
63
66
|
backgroundColor: currentTheme.light.main,
|
|
64
|
-
|
|
67
|
+
borderColor: 'rgba(77, 48, 25, 0.2)', // Visible border
|
|
65
68
|
color: currentTheme.dark.main,
|
|
66
69
|
'&:hover': {
|
|
67
70
|
backgroundColor: 'rgba(77, 48, 25, 0.05)',
|
|
@@ -70,9 +73,8 @@ const StyledButton = styles.styled(material.Button, {
|
|
|
70
73
|
},
|
|
71
74
|
'marked-read': {
|
|
72
75
|
backgroundColor: 'rgba(163, 217, 119, 0.1)',
|
|
73
|
-
|
|
76
|
+
borderColor: currentTheme.markedRead.main, // Visible border
|
|
74
77
|
color: currentTheme.dark.main,
|
|
75
|
-
isDisabled: true,
|
|
76
78
|
'&:hover': {
|
|
77
79
|
backgroundColor: 'rgba(163, 217, 119, 0.2)',
|
|
78
80
|
cursor: 'not-allowed',
|
|
@@ -80,15 +82,16 @@ const StyledButton = styles.styled(material.Button, {
|
|
|
80
82
|
},
|
|
81
83
|
'mark-read': {
|
|
82
84
|
backgroundColor: currentTheme.custom?.markAsReadBackgroundColor || currentTheme.accent.main,
|
|
83
|
-
|
|
85
|
+
borderColor: currentTheme.custom?.markAsReadBorderColor || currentTheme.secondary.main, // Visible border
|
|
84
86
|
color: currentTheme.dark.main,
|
|
85
87
|
'&:hover': {
|
|
86
88
|
opacity: 0.9,
|
|
87
89
|
},
|
|
88
90
|
},
|
|
89
91
|
danger: {
|
|
90
|
-
backgroundColor: '#D32F2F',
|
|
92
|
+
backgroundColor: '#D32F2F',
|
|
91
93
|
color: '#FFFFFF',
|
|
94
|
+
borderColor: 'transparent', // Transparent border
|
|
92
95
|
boxShadow: '0 1px 2px 0 rgba(0, 0, 0, 0.05)',
|
|
93
96
|
'&:hover': {
|
|
94
97
|
backgroundColor: '#B71C1C',
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.js","sources":["../../../../src/components/Button.tsx"],"sourcesContent":["import React from 'react';\nimport { Button as MuiButton, ButtonProps as MuiButtonProps } from '@mui/material';\nimport { styled } from '@mui/material/styles';\n\ninterface CustomButtonProps extends Omit<MuiButtonProps, 'variant' | 'size'> {\n variant?: 'primary' | 'secondary' | 'outline' | 'marked-read' | 'mark-read' | 'danger'
|
|
1
|
+
{"version":3,"file":"Button.js","sources":["../../../../src/components/Button.tsx"],"sourcesContent":["import React from 'react';\nimport { Button as MuiButton, ButtonProps as MuiButtonProps } from '@mui/material';\nimport { styled } from '@mui/material/styles';\n\ninterface CustomButtonProps extends Omit<MuiButtonProps, 'variant' | 'size'> {\n variant?: 'primary' | 'secondary' | 'outline' | 'marked-read' | 'mark-read' | 'danger';\n size?: 'sm' | 'md' | 'lg';\n}\n\nconst StyledButton = styled(MuiButton, {\n shouldForwardProp: (prop) => prop !== 'customVariant' && prop !== 'customSize',\n})<{ customVariant: string; customSize: string }>(({ theme, customVariant, customSize }) => {\n const currentTheme = theme.palette;\n\n // Size styles\n const sizeStyles = {\n sm: {\n padding: '6px 12px',\n fontSize: '0.875rem',\n },\n md: {\n padding: '10px 16px',\n fontSize: '1rem',\n },\n lg: {\n padding: '12px 24px',\n fontSize: '1.125rem',\n },\n };\n\n // Base styles - ADD BORDER TO ALL VARIANTS\n const baseStyles = {\n fontWeight: 500,\n borderRadius: '8px',\n textTransform: 'none' as const,\n transition: 'all 0.2s',\n boxShadow: 'none',\n border: '2px solid transparent',\n '&:hover': {\n boxShadow: 'none',\n },\n '&.Mui-disabled': {\n opacity: 0.5,\n cursor: 'not-allowed',\n },\n ...sizeStyles[customSize as keyof typeof sizeStyles],\n };\n\n // Variant styles\n const variantStyles = {\n primary: {\n backgroundColor: currentTheme.primary.main,\n color: currentTheme.custom?.primaryButtonTextColor || '#FFFFFF',\n borderColor: 'transparent', // Transparent border\n boxShadow: '0 1px 2px 0 rgba(0, 0, 0, 0.05)',\n '&:hover': {\n backgroundColor: currentTheme.primary.main,\n opacity: 0.9,\n },\n },\n secondary: {\n backgroundColor: currentTheme.secondary.main,\n color: currentTheme.dark.main,\n borderColor: 'transparent', // Transparent border\n boxShadow: '0 1px 2px 0 rgba(0, 0, 0, 0.05)',\n '&:hover': {\n backgroundColor: currentTheme.secondary.main,\n opacity: 0.9,\n },\n },\n outline: {\n backgroundColor: currentTheme.light.main,\n borderColor: 'rgba(77, 48, 25, 0.2)', // Visible border\n color: currentTheme.dark.main,\n '&:hover': {\n backgroundColor: 'rgba(77, 48, 25, 0.05)',\n borderColor: 'rgba(77, 48, 25, 0.3)',\n },\n },\n 'marked-read': {\n backgroundColor: 'rgba(163, 217, 119, 0.1)',\n borderColor: currentTheme.markedRead.main, // Visible border\n color: currentTheme.dark.main,\n '&:hover': {\n backgroundColor: 'rgba(163, 217, 119, 0.2)',\n cursor: 'not-allowed',\n },\n },\n 'mark-read': {\n backgroundColor: currentTheme.custom?.markAsReadBackgroundColor || currentTheme.accent.main,\n borderColor: currentTheme.custom?.markAsReadBorderColor || currentTheme.secondary.main, // Visible border\n color: currentTheme.dark.main,\n '&:hover': {\n opacity: 0.9,\n },\n },\n danger: {\n backgroundColor: '#D32F2F',\n color: '#FFFFFF',\n borderColor: 'transparent', // Transparent border\n boxShadow: '0 1px 2px 0 rgba(0, 0, 0, 0.05)',\n '&:hover': {\n backgroundColor: '#B71C1C',\n opacity: 0.9,\n },\n },\n };\n\n return {\n ...baseStyles,\n ...variantStyles[customVariant as keyof typeof variantStyles],\n };\n});\n\nexport const Button: React.FC<CustomButtonProps> = ({\n variant = 'primary',\n size = 'md',\n children,\n fullWidth = false,\n ...props\n}) => {\n return (\n <StyledButton\n customVariant={variant}\n customSize={size}\n fullWidth={fullWidth}\n disableRipple\n {...props}\n >\n {children}\n </StyledButton>\n );\n};\n"],"names":["styled","MuiButton","_jsx"],"mappings":"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"}
|
|
@@ -30,16 +30,7 @@ const StyledTextField = material.styled(material.TextField, {
|
|
|
30
30
|
fontSize: '1rem',
|
|
31
31
|
color: theme.palette.dark.main,
|
|
32
32
|
minWidth: 0,
|
|
33
|
-
padding:
|
|
34
|
-
[theme.breakpoints.up('sm')]: {
|
|
35
|
-
padding: theme.spacing(0, 4),
|
|
36
|
-
},
|
|
37
|
-
'& .MuiInputBase-input': {
|
|
38
|
-
padding: theme.spacing(1, 0),
|
|
39
|
-
[theme.breakpoints.up('sm')]: {
|
|
40
|
-
padding: theme.spacing(1.25, 0),
|
|
41
|
-
},
|
|
42
|
-
},
|
|
33
|
+
padding: 0, // Remove padding from root
|
|
43
34
|
'&:focus-within': {
|
|
44
35
|
outline: `2px solid ${errorMessage ? theme.palette.accent.main : theme.palette.primary.main}`,
|
|
45
36
|
outlineOffset: 0,
|
|
@@ -61,6 +52,13 @@ const StyledTextField = material.styled(material.TextField, {
|
|
|
61
52
|
},
|
|
62
53
|
},
|
|
63
54
|
},
|
|
55
|
+
// Target the actual input element for padding
|
|
56
|
+
'& .MuiInputBase-input': {
|
|
57
|
+
padding: theme.spacing(1, 3),
|
|
58
|
+
[theme.breakpoints.up('sm')]: {
|
|
59
|
+
padding: theme.spacing(1.25, 4),
|
|
60
|
+
},
|
|
61
|
+
},
|
|
64
62
|
'& .MuiFormHelperText-root': {
|
|
65
63
|
marginTop: theme.spacing(0.75),
|
|
66
64
|
fontSize: '0.875rem',
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Input.js","sources":["../../../../src/components/Input.tsx"],"sourcesContent":["
|
|
1
|
+
{"version":3,"file":"Input.js","sources":["../../../../src/components/Input.tsx"],"sourcesContent":["import React from 'react';\nimport { styled, TextField, TextFieldProps, InputLabel } from '@mui/material';\n\ninterface InputProps extends Omit<TextFieldProps, 'variant' | 'error'> {\n error?: string;\n}\n\nconst InputWrapper = styled('div')(({ theme }) => ({\n width: '100%',\n}));\n\nconst StyledLabel = styled(InputLabel)(({ theme }) => ({\n fontSize: '0.875rem',\n fontWeight: 500,\n color: theme.palette.dark.main,\n marginBottom: theme.spacing(0.75),\n display: 'block',\n position: 'static',\n transform: 'none',\n '&.Mui-focused': {\n color: theme.palette.dark.main,\n },\n}));\n\nconst StyledTextField = styled(TextField, {\n shouldForwardProp: (prop) => !['errorMessage'].includes(prop as string),\n})<{ errorMessage?: string }>(({ theme, errorMessage }) => ({\n width: '100%',\n '& .MuiInputBase-root': {\n backgroundColor: theme.palette.light.main,\n borderRadius: (typeof theme.shape.borderRadius === 'string'\n ? parseInt(theme.shape.borderRadius, 10)\n : theme.shape.borderRadius || 4) * 2,\n fontSize: '1rem',\n color: theme.palette.dark.main,\n minWidth: 0,\n padding: 0, // Remove padding from root\n '&:focus-within': {\n outline: `2px solid ${errorMessage ? theme.palette.accent.main : theme.palette.primary.main}`,\n outlineOffset: 0,\n },\n '& .MuiOutlinedInput-notchedOutline': {\n borderColor: errorMessage ? theme.palette.accent.main : `${theme.palette.dark.main}33`,\n },\n '&:hover .MuiOutlinedInput-notchedOutline': {\n borderColor: errorMessage ? theme.palette.accent.main : theme.palette.primary.main,\n },\n '&.Mui-disabled': {\n backgroundColor: `${theme.palette.dark.main}0D`,\n '& .MuiInputBase-input': {\n color: `${theme.palette.dark.main}80`,\n cursor: 'not-allowed',\n },\n '& .MuiOutlinedInput-notchedOutline': {\n borderColor: `${theme.palette.dark.main}33`,\n },\n },\n },\n // Target the actual input element for padding\n '& .MuiInputBase-input': {\n padding: theme.spacing(1, 3),\n [theme.breakpoints.up('sm')]: {\n padding: theme.spacing(1.25, 4),\n },\n },\n '& .MuiFormHelperText-root': {\n marginTop: theme.spacing(0.75),\n fontSize: '0.875rem',\n color: errorMessage ? theme.palette.accent.main : `${theme.palette.dark.main}99`,\n },\n}));\n\nexport const Input: React.FC<InputProps> = ({\n error,\n fullWidth = false,\n id,\n label,\n ...props\n}) => {\n const inputId = id || `input-${Math.random().toString(36).substr(2, 9)}`;\n\n return (\n <InputWrapper sx={{ ...(!fullWidth && { width: 'auto' }) }}>\n {label && (\n <StyledLabel htmlFor={inputId}>\n {label}\n </StyledLabel>\n )}\n <StyledTextField\n id={inputId}\n error={!!error}\n helperText={error || props.helperText}\n errorMessage={error}\n fullWidth={fullWidth}\n variant=\"outlined\"\n {...props}\n />\n </InputWrapper>\n );\n};\n"],"names":["styled","InputLabel","TextField","_jsxs","_jsx"],"mappings":"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"}
|
|
@@ -21,13 +21,14 @@ const StyledButton = styled(Button$1, {
|
|
|
21
21
|
fontSize: '1.125rem',
|
|
22
22
|
},
|
|
23
23
|
};
|
|
24
|
-
// Base styles
|
|
24
|
+
// Base styles - ADD BORDER TO ALL VARIANTS
|
|
25
25
|
const baseStyles = {
|
|
26
26
|
fontWeight: 500,
|
|
27
27
|
borderRadius: '8px',
|
|
28
28
|
textTransform: 'none',
|
|
29
29
|
transition: 'all 0.2s',
|
|
30
30
|
boxShadow: 'none',
|
|
31
|
+
border: '2px solid transparent',
|
|
31
32
|
'&:hover': {
|
|
32
33
|
boxShadow: 'none',
|
|
33
34
|
},
|
|
@@ -42,6 +43,7 @@ const StyledButton = styled(Button$1, {
|
|
|
42
43
|
primary: {
|
|
43
44
|
backgroundColor: currentTheme.primary.main,
|
|
44
45
|
color: currentTheme.custom?.primaryButtonTextColor || '#FFFFFF',
|
|
46
|
+
borderColor: 'transparent', // Transparent border
|
|
45
47
|
boxShadow: '0 1px 2px 0 rgba(0, 0, 0, 0.05)',
|
|
46
48
|
'&:hover': {
|
|
47
49
|
backgroundColor: currentTheme.primary.main,
|
|
@@ -51,6 +53,7 @@ const StyledButton = styled(Button$1, {
|
|
|
51
53
|
secondary: {
|
|
52
54
|
backgroundColor: currentTheme.secondary.main,
|
|
53
55
|
color: currentTheme.dark.main,
|
|
56
|
+
borderColor: 'transparent', // Transparent border
|
|
54
57
|
boxShadow: '0 1px 2px 0 rgba(0, 0, 0, 0.05)',
|
|
55
58
|
'&:hover': {
|
|
56
59
|
backgroundColor: currentTheme.secondary.main,
|
|
@@ -59,7 +62,7 @@ const StyledButton = styled(Button$1, {
|
|
|
59
62
|
},
|
|
60
63
|
outline: {
|
|
61
64
|
backgroundColor: currentTheme.light.main,
|
|
62
|
-
|
|
65
|
+
borderColor: 'rgba(77, 48, 25, 0.2)', // Visible border
|
|
63
66
|
color: currentTheme.dark.main,
|
|
64
67
|
'&:hover': {
|
|
65
68
|
backgroundColor: 'rgba(77, 48, 25, 0.05)',
|
|
@@ -68,9 +71,8 @@ const StyledButton = styled(Button$1, {
|
|
|
68
71
|
},
|
|
69
72
|
'marked-read': {
|
|
70
73
|
backgroundColor: 'rgba(163, 217, 119, 0.1)',
|
|
71
|
-
|
|
74
|
+
borderColor: currentTheme.markedRead.main, // Visible border
|
|
72
75
|
color: currentTheme.dark.main,
|
|
73
|
-
isDisabled: true,
|
|
74
76
|
'&:hover': {
|
|
75
77
|
backgroundColor: 'rgba(163, 217, 119, 0.2)',
|
|
76
78
|
cursor: 'not-allowed',
|
|
@@ -78,15 +80,16 @@ const StyledButton = styled(Button$1, {
|
|
|
78
80
|
},
|
|
79
81
|
'mark-read': {
|
|
80
82
|
backgroundColor: currentTheme.custom?.markAsReadBackgroundColor || currentTheme.accent.main,
|
|
81
|
-
|
|
83
|
+
borderColor: currentTheme.custom?.markAsReadBorderColor || currentTheme.secondary.main, // Visible border
|
|
82
84
|
color: currentTheme.dark.main,
|
|
83
85
|
'&:hover': {
|
|
84
86
|
opacity: 0.9,
|
|
85
87
|
},
|
|
86
88
|
},
|
|
87
89
|
danger: {
|
|
88
|
-
backgroundColor: '#D32F2F',
|
|
90
|
+
backgroundColor: '#D32F2F',
|
|
89
91
|
color: '#FFFFFF',
|
|
92
|
+
borderColor: 'transparent', // Transparent border
|
|
90
93
|
boxShadow: '0 1px 2px 0 rgba(0, 0, 0, 0.05)',
|
|
91
94
|
'&:hover': {
|
|
92
95
|
backgroundColor: '#B71C1C',
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.js","sources":["../../../../src/components/Button.tsx"],"sourcesContent":["import React from 'react';\nimport { Button as MuiButton, ButtonProps as MuiButtonProps } from '@mui/material';\nimport { styled } from '@mui/material/styles';\n\ninterface CustomButtonProps extends Omit<MuiButtonProps, 'variant' | 'size'> {\n variant?: 'primary' | 'secondary' | 'outline' | 'marked-read' | 'mark-read' | 'danger'
|
|
1
|
+
{"version":3,"file":"Button.js","sources":["../../../../src/components/Button.tsx"],"sourcesContent":["import React from 'react';\nimport { Button as MuiButton, ButtonProps as MuiButtonProps } from '@mui/material';\nimport { styled } from '@mui/material/styles';\n\ninterface CustomButtonProps extends Omit<MuiButtonProps, 'variant' | 'size'> {\n variant?: 'primary' | 'secondary' | 'outline' | 'marked-read' | 'mark-read' | 'danger';\n size?: 'sm' | 'md' | 'lg';\n}\n\nconst StyledButton = styled(MuiButton, {\n shouldForwardProp: (prop) => prop !== 'customVariant' && prop !== 'customSize',\n})<{ customVariant: string; customSize: string }>(({ theme, customVariant, customSize }) => {\n const currentTheme = theme.palette;\n\n // Size styles\n const sizeStyles = {\n sm: {\n padding: '6px 12px',\n fontSize: '0.875rem',\n },\n md: {\n padding: '10px 16px',\n fontSize: '1rem',\n },\n lg: {\n padding: '12px 24px',\n fontSize: '1.125rem',\n },\n };\n\n // Base styles - ADD BORDER TO ALL VARIANTS\n const baseStyles = {\n fontWeight: 500,\n borderRadius: '8px',\n textTransform: 'none' as const,\n transition: 'all 0.2s',\n boxShadow: 'none',\n border: '2px solid transparent',\n '&:hover': {\n boxShadow: 'none',\n },\n '&.Mui-disabled': {\n opacity: 0.5,\n cursor: 'not-allowed',\n },\n ...sizeStyles[customSize as keyof typeof sizeStyles],\n };\n\n // Variant styles\n const variantStyles = {\n primary: {\n backgroundColor: currentTheme.primary.main,\n color: currentTheme.custom?.primaryButtonTextColor || '#FFFFFF',\n borderColor: 'transparent', // Transparent border\n boxShadow: '0 1px 2px 0 rgba(0, 0, 0, 0.05)',\n '&:hover': {\n backgroundColor: currentTheme.primary.main,\n opacity: 0.9,\n },\n },\n secondary: {\n backgroundColor: currentTheme.secondary.main,\n color: currentTheme.dark.main,\n borderColor: 'transparent', // Transparent border\n boxShadow: '0 1px 2px 0 rgba(0, 0, 0, 0.05)',\n '&:hover': {\n backgroundColor: currentTheme.secondary.main,\n opacity: 0.9,\n },\n },\n outline: {\n backgroundColor: currentTheme.light.main,\n borderColor: 'rgba(77, 48, 25, 0.2)', // Visible border\n color: currentTheme.dark.main,\n '&:hover': {\n backgroundColor: 'rgba(77, 48, 25, 0.05)',\n borderColor: 'rgba(77, 48, 25, 0.3)',\n },\n },\n 'marked-read': {\n backgroundColor: 'rgba(163, 217, 119, 0.1)',\n borderColor: currentTheme.markedRead.main, // Visible border\n color: currentTheme.dark.main,\n '&:hover': {\n backgroundColor: 'rgba(163, 217, 119, 0.2)',\n cursor: 'not-allowed',\n },\n },\n 'mark-read': {\n backgroundColor: currentTheme.custom?.markAsReadBackgroundColor || currentTheme.accent.main,\n borderColor: currentTheme.custom?.markAsReadBorderColor || currentTheme.secondary.main, // Visible border\n color: currentTheme.dark.main,\n '&:hover': {\n opacity: 0.9,\n },\n },\n danger: {\n backgroundColor: '#D32F2F',\n color: '#FFFFFF',\n borderColor: 'transparent', // Transparent border\n boxShadow: '0 1px 2px 0 rgba(0, 0, 0, 0.05)',\n '&:hover': {\n backgroundColor: '#B71C1C',\n opacity: 0.9,\n },\n },\n };\n\n return {\n ...baseStyles,\n ...variantStyles[customVariant as keyof typeof variantStyles],\n };\n});\n\nexport const Button: React.FC<CustomButtonProps> = ({\n variant = 'primary',\n size = 'md',\n children,\n fullWidth = false,\n ...props\n}) => {\n return (\n <StyledButton\n customVariant={variant}\n customSize={size}\n fullWidth={fullWidth}\n disableRipple\n {...props}\n >\n {children}\n </StyledButton>\n );\n};\n"],"names":["MuiButton","_jsx"],"mappings":"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"}
|
|
@@ -28,16 +28,7 @@ const StyledTextField = styled(TextField, {
|
|
|
28
28
|
fontSize: '1rem',
|
|
29
29
|
color: theme.palette.dark.main,
|
|
30
30
|
minWidth: 0,
|
|
31
|
-
padding:
|
|
32
|
-
[theme.breakpoints.up('sm')]: {
|
|
33
|
-
padding: theme.spacing(0, 4),
|
|
34
|
-
},
|
|
35
|
-
'& .MuiInputBase-input': {
|
|
36
|
-
padding: theme.spacing(1, 0),
|
|
37
|
-
[theme.breakpoints.up('sm')]: {
|
|
38
|
-
padding: theme.spacing(1.25, 0),
|
|
39
|
-
},
|
|
40
|
-
},
|
|
31
|
+
padding: 0, // Remove padding from root
|
|
41
32
|
'&:focus-within': {
|
|
42
33
|
outline: `2px solid ${errorMessage ? theme.palette.accent.main : theme.palette.primary.main}`,
|
|
43
34
|
outlineOffset: 0,
|
|
@@ -59,6 +50,13 @@ const StyledTextField = styled(TextField, {
|
|
|
59
50
|
},
|
|
60
51
|
},
|
|
61
52
|
},
|
|
53
|
+
// Target the actual input element for padding
|
|
54
|
+
'& .MuiInputBase-input': {
|
|
55
|
+
padding: theme.spacing(1, 3),
|
|
56
|
+
[theme.breakpoints.up('sm')]: {
|
|
57
|
+
padding: theme.spacing(1.25, 4),
|
|
58
|
+
},
|
|
59
|
+
},
|
|
62
60
|
'& .MuiFormHelperText-root': {
|
|
63
61
|
marginTop: theme.spacing(0.75),
|
|
64
62
|
fontSize: '0.875rem',
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Input.js","sources":["../../../../src/components/Input.tsx"],"sourcesContent":["
|
|
1
|
+
{"version":3,"file":"Input.js","sources":["../../../../src/components/Input.tsx"],"sourcesContent":["import React from 'react';\nimport { styled, TextField, TextFieldProps, InputLabel } from '@mui/material';\n\ninterface InputProps extends Omit<TextFieldProps, 'variant' | 'error'> {\n error?: string;\n}\n\nconst InputWrapper = styled('div')(({ theme }) => ({\n width: '100%',\n}));\n\nconst StyledLabel = styled(InputLabel)(({ theme }) => ({\n fontSize: '0.875rem',\n fontWeight: 500,\n color: theme.palette.dark.main,\n marginBottom: theme.spacing(0.75),\n display: 'block',\n position: 'static',\n transform: 'none',\n '&.Mui-focused': {\n color: theme.palette.dark.main,\n },\n}));\n\nconst StyledTextField = styled(TextField, {\n shouldForwardProp: (prop) => !['errorMessage'].includes(prop as string),\n})<{ errorMessage?: string }>(({ theme, errorMessage }) => ({\n width: '100%',\n '& .MuiInputBase-root': {\n backgroundColor: theme.palette.light.main,\n borderRadius: (typeof theme.shape.borderRadius === 'string'\n ? parseInt(theme.shape.borderRadius, 10)\n : theme.shape.borderRadius || 4) * 2,\n fontSize: '1rem',\n color: theme.palette.dark.main,\n minWidth: 0,\n padding: 0, // Remove padding from root\n '&:focus-within': {\n outline: `2px solid ${errorMessage ? theme.palette.accent.main : theme.palette.primary.main}`,\n outlineOffset: 0,\n },\n '& .MuiOutlinedInput-notchedOutline': {\n borderColor: errorMessage ? theme.palette.accent.main : `${theme.palette.dark.main}33`,\n },\n '&:hover .MuiOutlinedInput-notchedOutline': {\n borderColor: errorMessage ? theme.palette.accent.main : theme.palette.primary.main,\n },\n '&.Mui-disabled': {\n backgroundColor: `${theme.palette.dark.main}0D`,\n '& .MuiInputBase-input': {\n color: `${theme.palette.dark.main}80`,\n cursor: 'not-allowed',\n },\n '& .MuiOutlinedInput-notchedOutline': {\n borderColor: `${theme.palette.dark.main}33`,\n },\n },\n },\n // Target the actual input element for padding\n '& .MuiInputBase-input': {\n padding: theme.spacing(1, 3),\n [theme.breakpoints.up('sm')]: {\n padding: theme.spacing(1.25, 4),\n },\n },\n '& .MuiFormHelperText-root': {\n marginTop: theme.spacing(0.75),\n fontSize: '0.875rem',\n color: errorMessage ? theme.palette.accent.main : `${theme.palette.dark.main}99`,\n },\n}));\n\nexport const Input: React.FC<InputProps> = ({\n error,\n fullWidth = false,\n id,\n label,\n ...props\n}) => {\n const inputId = id || `input-${Math.random().toString(36).substr(2, 9)}`;\n\n return (\n <InputWrapper sx={{ ...(!fullWidth && { width: 'auto' }) }}>\n {label && (\n <StyledLabel htmlFor={inputId}>\n {label}\n </StyledLabel>\n )}\n <StyledTextField\n id={inputId}\n error={!!error}\n helperText={error || props.helperText}\n errorMessage={error}\n fullWidth={fullWidth}\n variant=\"outlined\"\n {...props}\n />\n </InputWrapper>\n );\n};\n"],"names":["_jsxs","_jsx"],"mappings":"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"}
|