@pipelinesolucoes/button 1.0.0 → 1.1.0
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/components/NavigationButton.d.ts +9 -0
- package/dist/components/NavigationButton.js +25 -7
- package/dist/components/NavigationButton.js.map +1 -1
- package/dist/components/StyledButton.js +16 -7
- package/dist/components/StyledButton.js.map +1 -1
- package/dist/theme.d.ts +0 -27
- package/dist/theme.js +0 -189
- package/dist/theme.js.map +1 -1
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/dist/types/ButtonKind.d.ts +1 -1
- package/package.json +1 -1
|
@@ -16,6 +16,15 @@ interface NavigationButtonProps extends CommonStyleProps {
|
|
|
16
16
|
* - Se `url` contiver `http`, o link é tratado como externo e abre em nova aba.
|
|
17
17
|
* - Caso contrário, é tratado como link interno ou âncora.
|
|
18
18
|
*
|
|
19
|
+
* Uso da prop `kind`:
|
|
20
|
+
* - A prop `kind` aplica estilos automaticamente a partir dos tokens
|
|
21
|
+
* definidos no tema do projeto (`theme.palette.custom`) conforme README”.
|
|
22
|
+
* - Para utilizar `kind`, é necessário que o projeto implemente essa
|
|
23
|
+
* estrutura no `ThemeProvider`.
|
|
24
|
+
* - Caso o tema não possua essa configuração, o componente continuará
|
|
25
|
+
* funcionando normalmente, utilizando apenas os valores informados
|
|
26
|
+
* via props ou os padrões do Material UI.
|
|
27
|
+
*
|
|
19
28
|
* @param {ButtonKind} [kind="none"] Tipo de botão baseado nos tokens do tema.
|
|
20
29
|
* @param {string} url URL ou âncora de destino.
|
|
21
30
|
* @param {string} aria_label Texto para acessibilidade.
|
|
@@ -6,13 +6,22 @@ import { Typography } from '@mui/material';
|
|
|
6
6
|
const ButtonStyled = styled('a', {
|
|
7
7
|
shouldForwardProp: (prop) => !['kind', ...COMMON_STYLE_FORWARD_PROPS].includes(prop),
|
|
8
8
|
})(({ theme, kind, background, backgroundHover, colorText, colorHover, padding, borderRadius, border, width, margin, boxShadow, }) => {
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
9
|
+
var _a, _b, _c, _d;
|
|
10
|
+
let tokens;
|
|
11
|
+
switch (kind) {
|
|
12
|
+
case "primary":
|
|
13
|
+
tokens = (_a = theme.palette.custom) === null || _a === void 0 ? void 0 : _a.primaryButton;
|
|
14
|
+
break;
|
|
15
|
+
case "secondary":
|
|
16
|
+
tokens = (_b = theme.palette.custom) === null || _b === void 0 ? void 0 : _b.secondaryButton;
|
|
17
|
+
break;
|
|
18
|
+
case "tertiary":
|
|
19
|
+
tokens = (_c = theme.palette.custom) === null || _c === void 0 ? void 0 : _c.tertiaryButton;
|
|
20
|
+
break;
|
|
21
|
+
case "delete":
|
|
22
|
+
tokens = (_d = theme.palette.custom) === null || _d === void 0 ? void 0 : _d.deleteButton;
|
|
23
|
+
break;
|
|
24
|
+
}
|
|
16
25
|
return {
|
|
17
26
|
width: width !== null && width !== void 0 ? width : 'auto',
|
|
18
27
|
margin: margin !== null && margin !== void 0 ? margin : '0',
|
|
@@ -41,6 +50,15 @@ const ButtonStyled = styled('a', {
|
|
|
41
50
|
* - Se `url` contiver `http`, o link é tratado como externo e abre em nova aba.
|
|
42
51
|
* - Caso contrário, é tratado como link interno ou âncora.
|
|
43
52
|
*
|
|
53
|
+
* Uso da prop `kind`:
|
|
54
|
+
* - A prop `kind` aplica estilos automaticamente a partir dos tokens
|
|
55
|
+
* definidos no tema do projeto (`theme.palette.custom`) conforme README”.
|
|
56
|
+
* - Para utilizar `kind`, é necessário que o projeto implemente essa
|
|
57
|
+
* estrutura no `ThemeProvider`.
|
|
58
|
+
* - Caso o tema não possua essa configuração, o componente continuará
|
|
59
|
+
* funcionando normalmente, utilizando apenas os valores informados
|
|
60
|
+
* via props ou os padrões do Material UI.
|
|
61
|
+
*
|
|
44
62
|
* @param {ButtonKind} [kind="none"] Tipo de botão baseado nos tokens do tema.
|
|
45
63
|
* @param {string} url URL ou âncora de destino.
|
|
46
64
|
* @param {string} aria_label Texto para acessibilidade.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NavigationButton.js","sourceRoot":"","sources":["../../src/components/NavigationButton.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAGb,OAAO,
|
|
1
|
+
{"version":3,"file":"NavigationButton.js","sourceRoot":"","sources":["../../src/components/NavigationButton.tsx"],"names":[],"mappings":"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"}
|
|
@@ -3,13 +3,22 @@ import { Button, styled } from "@mui/material";
|
|
|
3
3
|
export const StyledButtonKind = styled(Button, {
|
|
4
4
|
shouldForwardProp: (prop) => !["kind", ...COMMON_STYLE_FORWARD_PROPS].includes(prop),
|
|
5
5
|
})(({ theme, kind = "primary", width, height, padding, margin, background, backgroundHover, colorText, colorHover, borderRadius, boxShadow }) => {
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
6
|
+
var _a, _b, _c, _d;
|
|
7
|
+
let tokens;
|
|
8
|
+
switch (kind) {
|
|
9
|
+
case "primary":
|
|
10
|
+
tokens = (_a = theme.palette.custom) === null || _a === void 0 ? void 0 : _a.primaryButton;
|
|
11
|
+
break;
|
|
12
|
+
case "secondary":
|
|
13
|
+
tokens = (_b = theme.palette.custom) === null || _b === void 0 ? void 0 : _b.secondaryButton;
|
|
14
|
+
break;
|
|
15
|
+
case "tertiary":
|
|
16
|
+
tokens = (_c = theme.palette.custom) === null || _c === void 0 ? void 0 : _c.tertiaryButton;
|
|
17
|
+
break;
|
|
18
|
+
case "delete":
|
|
19
|
+
tokens = (_d = theme.palette.custom) === null || _d === void 0 ? void 0 : _d.deleteButton;
|
|
20
|
+
break;
|
|
21
|
+
}
|
|
13
22
|
return {
|
|
14
23
|
// Dimensões
|
|
15
24
|
width: width,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"StyledButton.js","sourceRoot":"","sources":["../../src/components/StyledButton.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,0BAA0B,EAAE,MAAM,6BAA6B,CAAC;AAEzE,OAAO,EAAE,MAAM,
|
|
1
|
+
{"version":3,"file":"StyledButton.js","sourceRoot":"","sources":["../../src/components/StyledButton.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,0BAA0B,EAAE,MAAM,6BAA6B,CAAC;AAEzE,OAAO,EAAE,MAAM,EAAiB,MAAM,EAAE,MAAM,eAAe,CAAC;AAM9D,MAAM,CAAC,MAAM,gBAAgB,GAAG,MAAM,CAAC,MAAM,EAAE;IAC7C,iBAAiB,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC,CAAC,MAAM,EAAE,GAAG,0BAA0B,CAAE,CAAC,QAAQ,CAAC,IAAc,CAAC;CAC/F,CAAC,CAEA,CAAC,EAAE,KAAK,EAAE,IAAI,GAAG,SAAS,EAAE,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,eAAe,EAAE,SAAS,EAAE,UAAU,EAAE,YAAY,EAAE,SAAS,EAAE,EAAE,EAAE;;IAE5I,IAAI,MAAiC,CAAC;IACtC,QAAQ,IAAI,EAAE,CAAC;QACb,KAAK,SAAS;YACZ,MAAM,GAAG,MAAA,KAAK,CAAC,OAAO,CAAC,MAAM,0CAAE,aAAa,CAAC;YAC7C,MAAM;QAER,KAAK,WAAW;YACd,MAAM,GAAG,MAAA,KAAK,CAAC,OAAO,CAAC,MAAM,0CAAE,eAAe,CAAC;YAC/C,MAAM;QAER,KAAK,UAAU;YACT,MAAM,GAAG,MAAA,KAAK,CAAC,OAAO,CAAC,MAAM,0CAAE,cAAc,CAAC;YAC9C,MAAM;QAEZ,KAAK,QAAQ;YACX,MAAM,GAAG,MAAA,KAAK,CAAC,OAAO,CAAC,MAAM,0CAAE,YAAY,CAAC;YAC5C,MAAM;IACV,CAAC;IAGD,OAAO;QACL,YAAY;QACZ,KAAK,EAAE,KAAK;QACZ,MAAM,EAAE,MAAM;QACd,MAAM,EAAE,MAAM;QACd,OAAO,EAAE,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO;QAE1C,SAAS;QACT,aAAa,EAAE,MAAM;QACrB,YAAY,EAAE,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,YAAY,CAAC,CAAC,CAAC,YAAY;QACzD,SAAS,EAAE,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS;QAEhD,QAAQ;QACR,UAAU,EAAE,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC,CAAC,UAAU;QACnD,KAAK,EAAE,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS;QAExC,SAAS,EAAE;YACT,UAAU,EAAE,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,eAAe,CAAC,CAAC,CAAC,CAAE,eAAe,aAAf,eAAe,cAAf,eAAe,GAAI,UAAU,CAAC;YAC9E,KAAK,EAAE,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,UAAU,aAAV,UAAU,cAAV,UAAU,GAAI,SAAS,CAAC;YAC7D,SAAS,EAAE,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS;SACjD;QAED,kBAAkB;QAClB,gBAAgB,EAAE;YAChB,UAAU,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC;YACnC,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,QAAQ;YAClC,SAAS,EAAE,MAAM;SAClB;KACF,CAAC;AACN,CAAC,CAAC,CAAC"}
|
package/dist/theme.d.ts
CHANGED
|
@@ -1,29 +1,2 @@
|
|
|
1
|
-
declare module '@mui/material/styles' {
|
|
2
|
-
interface ButtonOptions {
|
|
3
|
-
background: string;
|
|
4
|
-
backgroundHover: string;
|
|
5
|
-
color: string;
|
|
6
|
-
colorHover: string;
|
|
7
|
-
borderRadius: string;
|
|
8
|
-
boxShadow?: string;
|
|
9
|
-
padding: string;
|
|
10
|
-
}
|
|
11
|
-
interface Palette {
|
|
12
|
-
custom: {
|
|
13
|
-
primaryButton: ButtonOptions;
|
|
14
|
-
secondaryButton: ButtonOptions;
|
|
15
|
-
deleteButton: ButtonOptions;
|
|
16
|
-
borderColor?: string;
|
|
17
|
-
};
|
|
18
|
-
}
|
|
19
|
-
interface PaletteOptions {
|
|
20
|
-
custom?: {
|
|
21
|
-
primaryButton: ButtonOptions;
|
|
22
|
-
secondaryButton: ButtonOptions;
|
|
23
|
-
deleteButton: ButtonOptions;
|
|
24
|
-
borderColor?: string;
|
|
25
|
-
};
|
|
26
|
-
}
|
|
27
|
-
}
|
|
28
1
|
declare const theme: import("@mui/material/styles").Theme;
|
|
29
2
|
export { theme };
|
package/dist/theme.js
CHANGED
|
@@ -1,37 +1,7 @@
|
|
|
1
1
|
import { createTheme } from '@mui/material/styles';
|
|
2
2
|
// Definindo o tema personalizado
|
|
3
3
|
const theme = createTheme({
|
|
4
|
-
breakpoints: {
|
|
5
|
-
values: {
|
|
6
|
-
xs: 0, // Extra small devices (phones)
|
|
7
|
-
sm: 600, // Small devices (tablets)
|
|
8
|
-
md: 960, // Medium devices (desktops)
|
|
9
|
-
lg: 1280, // Large devices (large desktops)
|
|
10
|
-
xl: 1920, // Extra large devices (extra large desktops)
|
|
11
|
-
},
|
|
12
|
-
},
|
|
13
|
-
shape: {
|
|
14
|
-
borderRadius: 12
|
|
15
|
-
},
|
|
16
4
|
palette: {
|
|
17
|
-
background: {
|
|
18
|
-
default: '#FEFEFE',
|
|
19
|
-
paper: 'linear-gradient(180deg, #edf3fa, white 50%, #edf3fa)',
|
|
20
|
-
},
|
|
21
|
-
primary: {
|
|
22
|
-
main: "#0a58c8",
|
|
23
|
-
dark: "#003d5c",
|
|
24
|
-
light: "#d1e6ff",
|
|
25
|
-
},
|
|
26
|
-
secondary: {
|
|
27
|
-
main: '#F2F4F6',
|
|
28
|
-
light: '#FEFEFE',
|
|
29
|
-
},
|
|
30
|
-
text: {
|
|
31
|
-
primary: '#334866',
|
|
32
|
-
secondary: '#FEFEFE',
|
|
33
|
-
disabled: '#A9A9A9',
|
|
34
|
-
},
|
|
35
5
|
custom: {
|
|
36
6
|
primaryButton: {
|
|
37
7
|
background: "#216fed",
|
|
@@ -57,176 +27,17 @@ const theme = createTheme({
|
|
|
57
27
|
borderRadius: "9999px",
|
|
58
28
|
padding: '0',
|
|
59
29
|
},
|
|
60
|
-
borderColor: '#8c8c8c',
|
|
61
|
-
},
|
|
62
|
-
info: {
|
|
63
|
-
main: '#555f56',
|
|
64
|
-
},
|
|
65
|
-
error: {
|
|
66
|
-
main: '#F44336',
|
|
67
|
-
},
|
|
68
|
-
success: {
|
|
69
|
-
main: '#4CAF50',
|
|
70
|
-
},
|
|
71
|
-
grey: {
|
|
72
|
-
"100": '#F2F4F6',
|
|
73
|
-
"200": '#edf3fa',
|
|
74
|
-
"300": '#e2e3e4',
|
|
75
|
-
"400": '#edf3fa',
|
|
76
|
-
'700': '#0000008a',
|
|
77
|
-
"900": '#334866',
|
|
78
30
|
},
|
|
79
31
|
},
|
|
80
32
|
typography: {
|
|
81
33
|
fontFamily: 'var(--font-plusjakarta), Arial, sans-serif',
|
|
82
|
-
h1: {
|
|
83
|
-
fontSize: '50px', // Desktop
|
|
84
|
-
lineHeight: '1.0',
|
|
85
|
-
letterSpacing: '0.01em',
|
|
86
|
-
fontWeight: 600,
|
|
87
|
-
margin: 0,
|
|
88
|
-
fontStyle: 'normal',
|
|
89
|
-
color: '#2b2e33',
|
|
90
|
-
padding: '8px 0px',
|
|
91
|
-
'@media (min-width:601px) and (max-width:1280px)': {
|
|
92
|
-
fontSize: '44px', // Tablet
|
|
93
|
-
},
|
|
94
|
-
'@media (max-width:600px)': {
|
|
95
|
-
fontSize: '36px', // Mobile
|
|
96
|
-
},
|
|
97
|
-
},
|
|
98
|
-
h2: {
|
|
99
|
-
fontSize: '18px', // Desktop
|
|
100
|
-
lineHeight: '1.5',
|
|
101
|
-
letterSpacing: '0.01em',
|
|
102
|
-
fontWeight: 400,
|
|
103
|
-
margin: 0,
|
|
104
|
-
color: '#292929',
|
|
105
|
-
'@media (min-width:601px) and (max-width:960px)': {
|
|
106
|
-
fontSize: '18px', // Tablet
|
|
107
|
-
},
|
|
108
|
-
fontStyle: 'normal',
|
|
109
|
-
'@media (max-width:600px)': {
|
|
110
|
-
fontSize: '16px', // Mobile
|
|
111
|
-
},
|
|
112
|
-
},
|
|
113
|
-
h3: {
|
|
114
|
-
fontSize: '32px', // Desktop
|
|
115
|
-
lineHeight: '1.5',
|
|
116
|
-
letterSpacing: '0.01em',
|
|
117
|
-
fontWeight: 600,
|
|
118
|
-
margin: 0,
|
|
119
|
-
fontStyle: 'normal',
|
|
120
|
-
'@media (min-width:601px) and (max-width:960px)': {
|
|
121
|
-
fontSize: '28px', // Tablet
|
|
122
|
-
},
|
|
123
|
-
'@media (max-width:600px)': {
|
|
124
|
-
fontSize: '24px', // Mobile
|
|
125
|
-
},
|
|
126
|
-
},
|
|
127
|
-
h4: {
|
|
128
|
-
fontSize: '24px', // Desktop
|
|
129
|
-
lineHeight: '1.5',
|
|
130
|
-
letterSpacing: '0.01em',
|
|
131
|
-
fontWeight: 600,
|
|
132
|
-
margin: 0,
|
|
133
|
-
fontStyle: 'normal',
|
|
134
|
-
'@media (min-width:601px) and (max-width:960px)': {
|
|
135
|
-
fontSize: '24px', // Tablet
|
|
136
|
-
},
|
|
137
|
-
'@media (max-width:600px)': {
|
|
138
|
-
fontSize: '20px', // Mobile
|
|
139
|
-
},
|
|
140
|
-
},
|
|
141
|
-
h5: {
|
|
142
|
-
fontSize: '18px', // Desktop
|
|
143
|
-
lineHeight: '1.5',
|
|
144
|
-
letterSpacing: '0.01em',
|
|
145
|
-
fontWeight: 400,
|
|
146
|
-
margin: 0,
|
|
147
|
-
fontStyle: 'normal',
|
|
148
|
-
'@media (min-width:601px) and (max-width:960px)': {
|
|
149
|
-
fontSize: '18px', // Tablet
|
|
150
|
-
},
|
|
151
|
-
'@media (max-width:600px)': {
|
|
152
|
-
fontSize: '18px', // Mobile
|
|
153
|
-
},
|
|
154
|
-
},
|
|
155
34
|
body1: {
|
|
156
35
|
fontSize: '16px', // Desktop
|
|
157
36
|
lineHeight: '1.5',
|
|
158
37
|
letterSpacing: '0.01em',
|
|
159
38
|
fontWeight: 400,
|
|
160
|
-
fontStyle: 'normal',
|
|
161
|
-
'@media (min-width:601px) and (max-width:960px)': {
|
|
162
|
-
fontSize: '16px', // Tablet
|
|
163
|
-
},
|
|
164
|
-
'@media (max-width:600px)': {
|
|
165
|
-
fontSize: '16px', // Mobile
|
|
166
|
-
},
|
|
167
|
-
},
|
|
168
|
-
body2: {
|
|
169
|
-
fontSize: '16px', // Desktop
|
|
170
|
-
lineHeight: '1.5',
|
|
171
|
-
letterSpacing: '0.01em',
|
|
172
|
-
fontWeight: 600,
|
|
173
|
-
fontStyle: 'normal',
|
|
174
|
-
'@media (min-width:601px) and (max-width:960px)': {
|
|
175
|
-
fontSize: '16px', // Tablet
|
|
176
|
-
},
|
|
177
|
-
'@media (max-width:600px)': {
|
|
178
|
-
fontSize: '16px', // Mobile
|
|
179
|
-
},
|
|
180
|
-
},
|
|
181
|
-
caption: {
|
|
182
|
-
/* tipografia pensada para textos de apoio ou legendas pequenas, normalmente usados abaixo de imagens, gráficos, tabelas ou ícones */
|
|
183
|
-
fontSize: '14px', // Desktop
|
|
184
|
-
lineHeight: '1.5',
|
|
185
|
-
letterSpacing: '0.01em',
|
|
186
|
-
fontWeight: 600,
|
|
187
|
-
fontStyle: 'normal',
|
|
188
|
-
'@media (min-width:601px) and (max-width:960px)': {
|
|
189
|
-
fontSize: '14px', // Tablet
|
|
190
|
-
},
|
|
191
|
-
'@media (max-width:600px)': {
|
|
192
|
-
fontSize: '14px', // Mobile
|
|
193
|
-
},
|
|
194
|
-
},
|
|
195
|
-
subtitle1: {
|
|
196
|
-
/* tipografia pensada para textos secundários, geralmente usados em legendas, descrições curtas ou suporte visual para títulos.*/
|
|
197
|
-
fontSize: '18px', // Desktop
|
|
198
|
-
lineHeight: '1.5',
|
|
199
|
-
letterSpacing: '0.01em',
|
|
200
|
-
fontWeight: 500,
|
|
201
|
-
margin: 0,
|
|
202
|
-
fontStyle: 'normal',
|
|
203
|
-
'@media (min-width:601px) and (max-width:960px)': {
|
|
204
|
-
fontSize: '18px', // Tablet
|
|
205
|
-
},
|
|
206
|
-
'@media (max-width:600px)': {
|
|
207
|
-
fontSize: '18px', // Mobile
|
|
208
|
-
},
|
|
209
|
-
},
|
|
210
|
-
subtitle2: {
|
|
211
|
-
/* tipografia pensada para textos secundários, geralmente usados em legendas, descrições curtas ou suporte visual para títulos.*/
|
|
212
|
-
fontSize: '18px', // Desktop
|
|
213
|
-
lineHeight: '1.5',
|
|
214
|
-
letterSpacing: '0.01em',
|
|
215
|
-
fontWeight: 600,
|
|
216
|
-
margin: 0,
|
|
217
|
-
fontStyle: 'normal',
|
|
218
|
-
'@media (min-width:601px) and (max-width:960px)': {
|
|
219
|
-
fontSize: '18px', // Tablet
|
|
220
|
-
},
|
|
221
|
-
'@media (max-width:600px)': {
|
|
222
|
-
fontSize: '18px', // Mobile
|
|
223
|
-
},
|
|
224
39
|
},
|
|
225
|
-
overline: {
|
|
226
|
-
/* para rótulos, categorias, ou textos auxiliares curtos, nunca para parágrafos ou longos blocos de texto. */
|
|
227
|
-
}
|
|
228
40
|
},
|
|
229
|
-
spacing: 8,
|
|
230
41
|
});
|
|
231
42
|
export { theme };
|
|
232
43
|
//# sourceMappingURL=theme.js.map
|
package/dist/theme.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"theme.js","sourceRoot":"","sources":["../src/theme.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;
|
|
1
|
+
{"version":3,"file":"theme.js","sourceRoot":"","sources":["../src/theme.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAEnD,iCAAiC;AACjC,MAAM,KAAK,GAAG,WAAW,CAAC;IAExB,OAAO,EAAE;QAEP,MAAM,EAAE;YACN,aAAa,EAAC;gBACZ,UAAU,EAAE,SAAS;gBACrB,eAAe,EAAE,SAAS;gBAC1B,KAAK,EAAE,SAAS;gBAChB,UAAU,EAAE,SAAS;gBACrB,YAAY,EAAE,QAAQ;gBACtB,OAAO,EAAE,GAAG;aACb;YACD,eAAe,EAAE;gBACf,UAAU,EAAE,SAAS;gBACrB,eAAe,EAAE,SAAS;gBAC1B,KAAK,EAAE,SAAS;gBAChB,UAAU,EAAE,SAAS;gBACrB,YAAY,EAAE,QAAQ;gBACtB,OAAO,EAAE,GAAG;aACb;YACD,YAAY,EAAC;gBACX,UAAU,EAAE,SAAS;gBACrB,eAAe,EAAE,SAAS;gBAC1B,KAAK,EAAE,SAAS;gBAChB,UAAU,EAAE,SAAS;gBACrB,YAAY,EAAE,QAAQ;gBACtB,OAAO,EAAE,GAAG;aACb;SACF;KACF;IACD,UAAU,EAAE;QACV,UAAU,EAAE,4CAA4C;QACxD,KAAK,EAAE;YACL,QAAQ,EAAE,MAAM,EAAE,UAAU;YAC5B,UAAU,EAAE,KAAK;YACjB,aAAa,EAAE,QAAQ;YACvB,UAAU,EAAE,GAAG;SAChB;KACF;CACF,CAAC,CAAC;AAEH,OAAO,EAAE,KAAK,EAAE,CAAC"}
|