catastyle 0.2.0 → 0.2.2
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/README.md +26 -24
- package/dist/index.d.mts +10 -7
- package/dist/index.d.ts +10 -7
- package/dist/index.js +26 -52
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +26 -33
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -6
- package/scripts/postinstall.js +24 -60
- package/scripts/templates/catastyle.config.ts.template +3 -6
- package/dist/config.default.d.mts +0 -10
- package/dist/config.default.d.ts +0 -10
- package/dist/config.default.js +0 -14
- package/dist/config.default.js.map +0 -1
- package/dist/config.default.mjs +0 -9
- package/dist/config.default.mjs.map +0 -1
- package/scripts/templates/assets/icon/icon-dark-theme.svg +0 -1
- package/scripts/templates/assets/icon/icon-light-theme.svg +0 -1
- package/scripts/templates/assets/logos/dark-theme.svg +0 -28
- package/scripts/templates/assets/logos/light-theme.svg +0 -31
package/README.md
CHANGED
|
@@ -12,22 +12,17 @@ npm install catastyle react react-dom styled-components react-router-dom
|
|
|
12
12
|
|
|
13
13
|
### Projetos com Vite
|
|
14
14
|
|
|
15
|
-
Em projetos que usam **Vite**, configure `resolve.dedupe` para garantir uma única instância de React e styled-components
|
|
15
|
+
Em projetos que usam **Vite**, configure `resolve.dedupe` para garantir uma única instância de React e styled-components (evita erros de contexto e duplicação de tema):
|
|
16
16
|
|
|
17
17
|
```ts
|
|
18
18
|
// vite.config.ts
|
|
19
19
|
import { defineConfig } from 'vite'
|
|
20
20
|
import react from '@vitejs/plugin-react'
|
|
21
|
-
import path from 'path'
|
|
22
21
|
|
|
23
22
|
export default defineConfig({
|
|
24
23
|
plugins: [react()],
|
|
25
24
|
resolve: {
|
|
26
25
|
dedupe: ['react', 'react-dom', 'styled-components'],
|
|
27
|
-
// Opcional: necessário só se você customizar logos/ícones no catastyle.config
|
|
28
|
-
alias: {
|
|
29
|
-
'catastyle/config': path.resolve(__dirname, 'src/catastyle/config/catastyle.config'),
|
|
30
|
-
},
|
|
31
26
|
},
|
|
32
27
|
})
|
|
33
28
|
```
|
|
@@ -74,10 +69,10 @@ function App() {
|
|
|
74
69
|
| `Input` | Campo de texto (inclui toggle de visibilidade para tipo password) |
|
|
75
70
|
| `Label` | Rótulo para formulários |
|
|
76
71
|
| `Link` | Link externo ou interno (integra com react-router-dom via `$isInternal`) |
|
|
77
|
-
| `Logo` | Logo com suporte a tema claro/escuro
|
|
78
|
-
| `Main` | Container principal com ThemeProvider, GlobalStyle e ThemeButton
|
|
72
|
+
| `Logo` | Logo com suporte a tema claro/escuro; aceita `logoLight`/`logoDark` opcionais (SVG importado); se não passar, usa o padrão do Catastyle |
|
|
73
|
+
| `Main` | Container principal com ThemeProvider, GlobalStyle e ThemeButton |
|
|
79
74
|
| `Text` | Parágrafo ou texto inline (`as="p"` ou `as="span"`) |
|
|
80
|
-
| `ThemeButton` | Botão para alternar tema claro/escuro
|
|
75
|
+
| `ThemeButton` | Botão para alternar tema claro/escuro; aceita `iconLight`/`iconDark` opcionais (SVG importado); se não passar, usa o padrão do Catastyle |
|
|
81
76
|
| `Title` | Título |
|
|
82
77
|
|
|
83
78
|
### Exemplo: Footer customizável
|
|
@@ -97,26 +92,21 @@ import { Footer, Text } from 'catastyle'
|
|
|
97
92
|
- **`DarkTheme`** e **`LightTheme`** — temas padrão do design system.
|
|
98
93
|
- Use `ThemeProvider` do `styled-components` (re-exportado) para aplicar o tema.
|
|
99
94
|
- Troca de tema: altere o objeto passado para `theme` no `ThemeProvider` (ex.: entre `DarkTheme` e `LightTheme`).
|
|
100
|
-
- O `Main` injeta **`isDark`** no tema para que `Logo` e `ThemeButton` escolham o asset certo (claro/escuro) mesmo com temas customizados.
|
|
101
95
|
|
|
102
96
|
## Customização (projeto consumidor)
|
|
103
97
|
|
|
104
|
-
Após instalar o pacote, o script **postinstall** cria
|
|
98
|
+
Após instalar o pacote, o script **postinstall** cria apenas a pasta de configuração (nenhuma pasta de logos, ícones ou temas é copiada; os padrões vêm do pacote):
|
|
105
99
|
|
|
106
100
|
```
|
|
107
101
|
src/catastyle/
|
|
108
|
-
|
|
109
|
-
│ └── catastyle.config.ts
|
|
110
|
-
└── assets/
|
|
111
|
-
├── logos/ (light-theme.svg, dark-theme.svg)
|
|
112
|
-
└── icon/ (icon-light-theme.svg, icon-dark-theme.svg)
|
|
102
|
+
└── catastyle.config.ts
|
|
113
103
|
```
|
|
114
104
|
|
|
115
|
-
|
|
105
|
+
Nesse arquivo você configura apenas **temas**. Logo e ícone do ThemeButton são definidos pelas props nos componentes (ou no `Main`); se não forem passados, usam os padrão do Catastyle.
|
|
116
106
|
|
|
117
107
|
### Temas customizados
|
|
118
108
|
|
|
119
|
-
Edite `src/catastyle/
|
|
109
|
+
Edite `src/catastyle/catastyle.config.ts` e defina `darkTheme` e/ou `lightTheme`. Se forem `null`, os temas padrão do Catastyle são usados.
|
|
120
110
|
|
|
121
111
|
Exemplo de tema customizado:
|
|
122
112
|
|
|
@@ -144,7 +134,7 @@ export const lightTheme: DefaultTheme | null = {
|
|
|
144
134
|
|
|
145
135
|
```tsx
|
|
146
136
|
import { Main } from 'catastyle'
|
|
147
|
-
import { darkTheme, lightTheme } from './catastyle/
|
|
137
|
+
import { darkTheme, lightTheme } from './catastyle/catastyle.config'
|
|
148
138
|
|
|
149
139
|
function App() {
|
|
150
140
|
return (
|
|
@@ -159,12 +149,25 @@ Assim o config entra no bundle e alterações em `catastyle.config.ts` refletem
|
|
|
159
149
|
|
|
160
150
|
### Logos e ícones customizados
|
|
161
151
|
|
|
162
|
-
|
|
152
|
+
Se não passar logo ou ícone, a **Logo** e o **ThemeButton** usam os padrões do Catastyle. Para usar os seus, importe os SVGs e passe como props:
|
|
163
153
|
|
|
164
|
-
|
|
154
|
+
```tsx
|
|
155
|
+
import { Logo, Main } from 'catastyle'
|
|
156
|
+
import logoClaro from '@/assets/meu-logo-claro.svg'
|
|
157
|
+
import logoEscuro from '@/assets/meu-logo-escuro.svg'
|
|
158
|
+
|
|
159
|
+
<Logo logoLight={logoClaro} logoDark={logoEscuro} />
|
|
160
|
+
```
|
|
161
|
+
|
|
162
|
+
```tsx
|
|
163
|
+
import { ThemeButton } from 'catastyle'
|
|
164
|
+
import iconClaro from '@/assets/meu-icone-claro.svg'
|
|
165
|
+
import iconEscuro from '@/assets/meu-icone-escuro.svg'
|
|
166
|
+
|
|
167
|
+
<ThemeButton iconLight={iconClaro} iconDark={iconEscuro} />
|
|
168
|
+
```
|
|
165
169
|
|
|
166
|
-
|
|
167
|
-
- **Com o alias:** o config do projeto é usado; por padrão aponta para os assets copiados em `src/catastyle/assets`.
|
|
170
|
+
Logo e ícone são definidos pelas props em `<Logo>` e `<ThemeButton>` (ou repassados pelo `Main`); o arquivo `catastyle.config.ts` é apenas para temas.
|
|
168
171
|
|
|
169
172
|
## Exports adicionais
|
|
170
173
|
|
|
@@ -225,7 +228,6 @@ O workflow está em `.github/workflows/ci.yml` e roda em qualquer branch.
|
|
|
225
228
|
- **`main`:** `./dist/index.js` (CommonJS)
|
|
226
229
|
- **`module`:** `./dist/index.mjs` (ESM)
|
|
227
230
|
- **`types`:** `./dist/index.d.ts`
|
|
228
|
-
- **Subpath `catastyle/config`:** `./dist/config.default.js` / `.mjs` — config padrão de logos/ícones; o app consumidor pode sobrescrever via alias do bundler.
|
|
229
231
|
|
|
230
232
|
## Sobre o projeto
|
|
231
233
|
|
package/dist/index.d.mts
CHANGED
|
@@ -93,8 +93,10 @@ declare const Link: ({ href, to, children, className, $target, $isInternal, $lgF
|
|
|
93
93
|
|
|
94
94
|
type LogoProps = {
|
|
95
95
|
className?: string;
|
|
96
|
+
logoLight?: string;
|
|
97
|
+
logoDark?: string;
|
|
96
98
|
} & WidthType;
|
|
97
|
-
declare const Logo: ({ className, $lgWidth, $mdWidth, $smWidth }: LogoProps) => react_jsx_runtime.JSX.Element;
|
|
99
|
+
declare const Logo: ({ className, $lgWidth, $mdWidth, $smWidth, logoLight, logoDark }: LogoProps) => react_jsx_runtime.JSX.Element;
|
|
98
100
|
|
|
99
101
|
type ThemeButtonPosition = 'top-right' | 'top-left' | 'bottom-right' | 'bottom-left';
|
|
100
102
|
|
|
@@ -104,9 +106,10 @@ type MainType = {
|
|
|
104
106
|
position?: ThemeButtonPosition;
|
|
105
107
|
darkTheme?: DefaultTheme | null;
|
|
106
108
|
lightTheme?: DefaultTheme | null;
|
|
107
|
-
|
|
109
|
+
iconLight?: string;
|
|
110
|
+
iconDark?: string;
|
|
108
111
|
};
|
|
109
|
-
declare const Main: ({ children, className, position, darkTheme: darkThemeProp, lightTheme: lightThemeProp,
|
|
112
|
+
declare const Main: ({ children, className, position, darkTheme: darkThemeProp, lightTheme: lightThemeProp, iconLight, iconDark }: MainType) => react_jsx_runtime.JSX.Element;
|
|
110
113
|
|
|
111
114
|
type TextType = {
|
|
112
115
|
as: 'p' | 'span';
|
|
@@ -120,8 +123,10 @@ type ThemeButtonType = {
|
|
|
120
123
|
className?: string;
|
|
121
124
|
onClick?: () => void;
|
|
122
125
|
position?: 'top-right' | 'top-left' | 'bottom-right' | 'bottom-left';
|
|
126
|
+
iconLight?: string;
|
|
127
|
+
iconDark?: string;
|
|
123
128
|
};
|
|
124
|
-
declare const ThemeButton: ({ className, onClick, position }: ThemeButtonType) => react_jsx_runtime.JSX.Element;
|
|
129
|
+
declare const ThemeButton: ({ className, onClick, position, iconLight, iconDark }: ThemeButtonType) => react_jsx_runtime.JSX.Element;
|
|
125
130
|
|
|
126
131
|
type TitleType = {
|
|
127
132
|
children: string;
|
|
@@ -136,8 +141,6 @@ declare const LightTheme: DefaultTheme$1;
|
|
|
136
141
|
|
|
137
142
|
declare const GlobalStyle: react.NamedExoticComponent<styled_components.ExecutionProps & object>;
|
|
138
143
|
|
|
139
|
-
declare const MainContainer: styled_components_dist_types.IStyledComponentBase<"web",
|
|
140
|
-
$centered?: boolean;
|
|
141
|
-
}>> & string;
|
|
144
|
+
declare const MainContainer: styled_components_dist_types.IStyledComponentBase<"web", styled_components.FastOmit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLElement>, HTMLElement>, never>> & string;
|
|
142
145
|
|
|
143
146
|
export { type BreakpointType, Button, Checkbox, DarkTheme, type FontSize, type FontSizeType, Footer, GlobalStyle, Input, Label, LightTheme, Link, Logo, Main, MainContainer, Text, ThemeButton, Title, type WidthType, fontSizeToRem, mdScreen, smScreen };
|
package/dist/index.d.ts
CHANGED
|
@@ -93,8 +93,10 @@ declare const Link: ({ href, to, children, className, $target, $isInternal, $lgF
|
|
|
93
93
|
|
|
94
94
|
type LogoProps = {
|
|
95
95
|
className?: string;
|
|
96
|
+
logoLight?: string;
|
|
97
|
+
logoDark?: string;
|
|
96
98
|
} & WidthType;
|
|
97
|
-
declare const Logo: ({ className, $lgWidth, $mdWidth, $smWidth }: LogoProps) => react_jsx_runtime.JSX.Element;
|
|
99
|
+
declare const Logo: ({ className, $lgWidth, $mdWidth, $smWidth, logoLight, logoDark }: LogoProps) => react_jsx_runtime.JSX.Element;
|
|
98
100
|
|
|
99
101
|
type ThemeButtonPosition = 'top-right' | 'top-left' | 'bottom-right' | 'bottom-left';
|
|
100
102
|
|
|
@@ -104,9 +106,10 @@ type MainType = {
|
|
|
104
106
|
position?: ThemeButtonPosition;
|
|
105
107
|
darkTheme?: DefaultTheme | null;
|
|
106
108
|
lightTheme?: DefaultTheme | null;
|
|
107
|
-
|
|
109
|
+
iconLight?: string;
|
|
110
|
+
iconDark?: string;
|
|
108
111
|
};
|
|
109
|
-
declare const Main: ({ children, className, position, darkTheme: darkThemeProp, lightTheme: lightThemeProp,
|
|
112
|
+
declare const Main: ({ children, className, position, darkTheme: darkThemeProp, lightTheme: lightThemeProp, iconLight, iconDark }: MainType) => react_jsx_runtime.JSX.Element;
|
|
110
113
|
|
|
111
114
|
type TextType = {
|
|
112
115
|
as: 'p' | 'span';
|
|
@@ -120,8 +123,10 @@ type ThemeButtonType = {
|
|
|
120
123
|
className?: string;
|
|
121
124
|
onClick?: () => void;
|
|
122
125
|
position?: 'top-right' | 'top-left' | 'bottom-right' | 'bottom-left';
|
|
126
|
+
iconLight?: string;
|
|
127
|
+
iconDark?: string;
|
|
123
128
|
};
|
|
124
|
-
declare const ThemeButton: ({ className, onClick, position }: ThemeButtonType) => react_jsx_runtime.JSX.Element;
|
|
129
|
+
declare const ThemeButton: ({ className, onClick, position, iconLight, iconDark }: ThemeButtonType) => react_jsx_runtime.JSX.Element;
|
|
125
130
|
|
|
126
131
|
type TitleType = {
|
|
127
132
|
children: string;
|
|
@@ -136,8 +141,6 @@ declare const LightTheme: DefaultTheme$1;
|
|
|
136
141
|
|
|
137
142
|
declare const GlobalStyle: react.NamedExoticComponent<styled_components.ExecutionProps & object>;
|
|
138
143
|
|
|
139
|
-
declare const MainContainer: styled_components_dist_types.IStyledComponentBase<"web",
|
|
140
|
-
$centered?: boolean;
|
|
141
|
-
}>> & string;
|
|
144
|
+
declare const MainContainer: styled_components_dist_types.IStyledComponentBase<"web", styled_components.FastOmit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLElement>, HTMLElement>, never>> & string;
|
|
142
145
|
|
|
143
146
|
export { type BreakpointType, Button, Checkbox, DarkTheme, type FontSize, type FontSizeType, Footer, GlobalStyle, Input, Label, LightTheme, Link, Logo, Main, MainContainer, Text, ThemeButton, Title, type WidthType, fontSizeToRem, mdScreen, smScreen };
|
package/dist/index.js
CHANGED
|
@@ -5,31 +5,11 @@ var jsxRuntime = require('react/jsx-runtime');
|
|
|
5
5
|
var react = require('react');
|
|
6
6
|
var fa6 = require('react-icons/fa6');
|
|
7
7
|
var reactRouterDom = require('react-router-dom');
|
|
8
|
-
var logoConfigModule = require('catastyle/config');
|
|
9
8
|
var path = require('path');
|
|
10
9
|
|
|
11
10
|
function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
|
|
12
11
|
|
|
13
|
-
function _interopNamespace(e) {
|
|
14
|
-
if (e && e.__esModule) return e;
|
|
15
|
-
var n = Object.create(null);
|
|
16
|
-
if (e) {
|
|
17
|
-
Object.keys(e).forEach(function (k) {
|
|
18
|
-
if (k !== 'default') {
|
|
19
|
-
var d = Object.getOwnPropertyDescriptor(e, k);
|
|
20
|
-
Object.defineProperty(n, k, d.get ? d : {
|
|
21
|
-
enumerable: true,
|
|
22
|
-
get: function () { return e[k]; }
|
|
23
|
-
});
|
|
24
|
-
}
|
|
25
|
-
});
|
|
26
|
-
}
|
|
27
|
-
n.default = e;
|
|
28
|
-
return Object.freeze(n);
|
|
29
|
-
}
|
|
30
|
-
|
|
31
12
|
var styled2__default = /*#__PURE__*/_interopDefault(styled2);
|
|
32
|
-
var logoConfigModule__namespace = /*#__PURE__*/_interopNamespace(logoConfigModule);
|
|
33
13
|
var path__default = /*#__PURE__*/_interopDefault(path);
|
|
34
14
|
|
|
35
15
|
var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require : typeof Proxy !== "undefined" ? new Proxy(x, {
|
|
@@ -483,6 +463,7 @@ var LogoStyled = styled2__default.default.div`
|
|
|
483
463
|
width: 100%;
|
|
484
464
|
height: auto;
|
|
485
465
|
display: block;
|
|
466
|
+
object-fit: contain;
|
|
486
467
|
}
|
|
487
468
|
|
|
488
469
|
${mdScreen} {
|
|
@@ -505,34 +486,31 @@ var icon_light_theme_default = 'data:image/svg+xml,<svg id="svg" version="1.1" x
|
|
|
505
486
|
|
|
506
487
|
// src/assets/icon/icon-dark-theme.svg
|
|
507
488
|
var icon_dark_theme_default = 'data:image/svg+xml,<svg id="svg" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="400" height="322.0125786163522" viewBox="0, 0, 400,322.0125786163522"><g id="svgg"><path id="path0" d="M252.709 0.463 C 247.236 2.414,244.266 12.366,243.226 32.233 C 242.620 43.835,242.581 44.041,240.461 47.074 C 239.517 48.424,237.017 52.288,234.905 55.660 C 231.276 61.455,229.882 64.131,221.219 81.942 C 217.174 90.258,211.311 95.721,200.697 101.067 C 198.061 102.394,195.108 104.237,194.788 104.754 C 194.667 104.951,193.207 105.756,191.544 106.543 C 189.882 107.330,186.375 109.187,183.750 110.669 C 181.126 112.152,177.355 114.262,175.371 115.358 C 172.695 116.836,170.966 118.084,168.679 120.186 C 166.983 121.746,165.103 123.396,164.502 123.853 C 162.951 125.033,152.399 136.562,150.727 138.904 C 148.851 141.531,144.567 148.631,144.032 150.000 C 143.796 150.605,142.899 152.516,142.040 154.245 C 135.093 168.232,128.739 197.489,128.107 218.396 C 127.757 229.983,131.224 253.327,134.738 263.050 C 140.639 279.380,141.560 285.769,139.270 294.497 C 137.499 301.244,136.127 302.054,125.157 302.823 C 122.476 303.012,117.877 303.447,114.937 303.790 C 106.454 304.782,97.029 305.613,88.365 306.133 C 83.954 306.397,77.020 306.961,72.956 307.385 C 68.598 307.839,61.438 308.295,55.503 308.497 C 42.594 308.934,34.802 309.314,29.874 309.745 C 20.913 310.529,16.101 309.627,12.330 306.454 C 8.330 303.088,12.725 292.216,24.409 276.572 C 41.464 253.736,65.466 238.341,84.182 238.232 C 89.402 238.201,89.573 238.320,87.874 240.792 C 86.135 243.322,73.624 253.724,70.245 255.448 L 69.263 255.949 69.852 254.795 C 71.715 251.139,70.162 251.041,65.123 254.495 C 63.913 255.324,60.617 257.060,57.798 258.352 C 49.232 262.279,47.777 263.749,49.167 267.075 C 53.302 276.970,75.012 272.051,90.608 257.684 C 109.792 240.012,96.474 224.693,67.296 230.870 C 31.446 238.459,-0.877 270.202,0.103 296.855 C 0.678 312.479,6.162 318.689,20.126 319.529 C 22.807 319.690,29.387 320.254,34.748 320.782 L 44.497 321.742 70.881 321.709 C 85.392 321.691,97.379 321.606,97.517 321.521 C 97.656 321.435,109.698 321.220,124.278 321.042 C 179.622 320.368,202.131 320.069,204.717 319.975 C 206.187 319.921,217.508 319.720,229.874 319.527 C 242.241 319.335,254.198 319.049,256.447 318.893 C 258.695 318.736,262.905 318.596,265.802 318.581 C 291.487 318.448,303.692 315.621,307.025 309.034 C 309.777 303.595,308.623 298.126,303.000 289.964 C 299.211 284.464,298.284 282.088,297.592 276.101 C 296.468 266.391,296.433 253.282,297.503 242.871 C 297.665 241.285,297.798 237.181,297.797 233.751 C 297.795 229.888,297.979 226.140,298.280 223.899 C 298.547 221.910,298.839 219.688,298.928 218.961 L 299.091 217.640 300.882 218.772 C 301.867 219.394,303.381 220.495,304.245 221.218 C 306.674 223.247,313.392 227.602,316.548 229.193 C 318.692 230.273,324.224 232.321,332.862 235.232 C 352.389 241.812,355.223 243.300,365.079 252.144 C 381.498 266.877,399.945 263.290,399.994 245.357 C 400.006 240.817,395.851 233.838,389.178 227.192 C 384.530 222.562,355.655 197.260,350.786 193.550 C 349.230 192.364,346.753 190.317,345.283 189.000 C 343.813 187.684,340.912 185.184,338.836 183.446 C 330.093 176.122,324.849 170.223,323.654 166.367 C 322.730 163.387,322.844 136.823,323.788 135.063 C 324.874 133.038,327.561 130.637,331.604 128.079 C 345.180 119.491,351.037 112.658,355.006 100.777 C 359.279 87.991,358.285 79.429,349.387 52.358 C 345.756 41.314,345.182 38.671,344.018 27.671 C 342.051 9.061,339.880 3.773,334.211 3.774 C 329.644 3.775,312.028 17.620,310.511 22.401 C 310.308 23.042,309.100 23.117,306.952 22.622 C 304.523 22.062,299.414 21.660,291.905 21.436 L 284.596 21.218 278.697 15.221 C 267.356 3.691,258.216 -1.500,252.709 0.463 " stroke="none" fill="%23ecfcec" fill-rule="evenodd"></path><path id="path1" d="" stroke="none" fill="%23f0fcec" fill-rule="evenodd"></path><path id="path2" d="" stroke="none" fill="%23f0fcec" fill-rule="evenodd"></path><path id="path3" d="" stroke="none" fill="%23f0fcec" fill-rule="evenodd"></path><path id="path4" d="" stroke="none" fill="%23f0fcec" fill-rule="evenodd"></path></g></svg>';
|
|
508
|
-
|
|
489
|
+
|
|
490
|
+
// src/utils/logoLoader.ts
|
|
509
491
|
function getLogoLight() {
|
|
510
|
-
if (logoConfig.logoLight && logoConfig.logoLight !== "default") {
|
|
511
|
-
return logoConfig.logoLight;
|
|
512
|
-
}
|
|
513
492
|
return light_theme_default;
|
|
514
493
|
}
|
|
515
494
|
function getLogoDark() {
|
|
516
|
-
if (logoConfig.logoDark && logoConfig.logoDark !== "default") {
|
|
517
|
-
return logoConfig.logoDark;
|
|
518
|
-
}
|
|
519
495
|
return dark_theme_default;
|
|
520
496
|
}
|
|
521
497
|
function getIconLight() {
|
|
522
|
-
if (logoConfig.iconLight && logoConfig.iconLight !== "default") {
|
|
523
|
-
return logoConfig.iconLight;
|
|
524
|
-
}
|
|
525
498
|
return icon_light_theme_default;
|
|
526
499
|
}
|
|
527
500
|
function getIconDark() {
|
|
528
|
-
if (logoConfig.iconDark && logoConfig.iconDark !== "default") {
|
|
529
|
-
return logoConfig.iconDark;
|
|
530
|
-
}
|
|
531
501
|
return icon_dark_theme_default;
|
|
532
502
|
}
|
|
533
|
-
var Logo = ({
|
|
503
|
+
var Logo = ({
|
|
504
|
+
className,
|
|
505
|
+
$lgWidth,
|
|
506
|
+
$mdWidth,
|
|
507
|
+
$smWidth,
|
|
508
|
+
logoLight,
|
|
509
|
+
logoDark
|
|
510
|
+
}) => {
|
|
534
511
|
const theme = styled2.useTheme();
|
|
535
512
|
const isDarkTheme = theme.isDark === true;
|
|
513
|
+
const src = isDarkTheme ? logoDark ?? getLogoDark() : logoLight ?? getLogoLight();
|
|
536
514
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
537
515
|
LogoStyled,
|
|
538
516
|
{
|
|
@@ -540,7 +518,7 @@ var Logo = ({ className, $lgWidth, $mdWidth, $smWidth }) => {
|
|
|
540
518
|
$lgWidth,
|
|
541
519
|
$mdWidth,
|
|
542
520
|
$smWidth,
|
|
543
|
-
children: /* @__PURE__ */ jsxRuntime.jsx("img", { src
|
|
521
|
+
children: /* @__PURE__ */ jsxRuntime.jsx("img", { src, alt: "Logo" })
|
|
544
522
|
}
|
|
545
523
|
);
|
|
546
524
|
};
|
|
@@ -561,15 +539,12 @@ body{
|
|
|
561
539
|
`;
|
|
562
540
|
var global_default = GlobalStyle;
|
|
563
541
|
var MainContainer = styled2__default.default.main`
|
|
564
|
-
width:
|
|
565
|
-
max-width: ${(props) => props.$centered !== false ? "1200px" : "none"};
|
|
566
|
-
margin: ${(props) => props.$centered !== false ? "0 auto" : "0"};
|
|
567
|
-
min-height: ${(props) => props.$centered !== false ? "100vh" : "auto"};
|
|
542
|
+
width: 100%;
|
|
568
543
|
display: flex;
|
|
569
544
|
flex-direction: column;
|
|
570
545
|
align-items: center;
|
|
571
546
|
justify-content: center;
|
|
572
|
-
overflow-y:
|
|
547
|
+
overflow-y: scroll;
|
|
573
548
|
&::-webkit-scrollbar {
|
|
574
549
|
display: none;
|
|
575
550
|
}
|
|
@@ -624,23 +599,20 @@ var ThemeButton = styled2__default.default(ButtonStyled)`
|
|
|
624
599
|
var ThemeButton2 = ({
|
|
625
600
|
className,
|
|
626
601
|
onClick,
|
|
627
|
-
position: position2 = "bottom-right"
|
|
602
|
+
position: position2 = "bottom-right",
|
|
603
|
+
iconLight,
|
|
604
|
+
iconDark
|
|
628
605
|
}) => {
|
|
629
606
|
const theme = styled2.useTheme();
|
|
630
607
|
const isDarkTheme = theme.isDark === true;
|
|
608
|
+
const src = isDarkTheme ? iconLight ?? getIconLight() : iconDark ?? getIconDark();
|
|
631
609
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
632
610
|
ThemeButton,
|
|
633
611
|
{
|
|
634
612
|
className,
|
|
635
613
|
onClick,
|
|
636
614
|
$position: position2,
|
|
637
|
-
children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
638
|
-
"img",
|
|
639
|
-
{
|
|
640
|
-
src: isDarkTheme ? getIconLight() : getIconDark(),
|
|
641
|
-
alt: "Theme Button"
|
|
642
|
-
}
|
|
643
|
-
)
|
|
615
|
+
children: /* @__PURE__ */ jsxRuntime.jsx("img", { src, alt: "Theme Button" })
|
|
644
616
|
}
|
|
645
617
|
);
|
|
646
618
|
};
|
|
@@ -675,7 +647,6 @@ function tryLoadUserThemeConfig() {
|
|
|
675
647
|
userProjectRoot,
|
|
676
648
|
"src",
|
|
677
649
|
"catastyle",
|
|
678
|
-
"config",
|
|
679
650
|
"catastyle.config.ts"
|
|
680
651
|
);
|
|
681
652
|
try {
|
|
@@ -707,7 +678,8 @@ var Main = ({
|
|
|
707
678
|
position: position2,
|
|
708
679
|
darkTheme: darkThemeProp,
|
|
709
680
|
lightTheme: lightThemeProp,
|
|
710
|
-
|
|
681
|
+
iconLight,
|
|
682
|
+
iconDark
|
|
711
683
|
}) => {
|
|
712
684
|
const [darkTheme, setDarkTheme] = react.useState(false);
|
|
713
685
|
function toggleTheme() {
|
|
@@ -716,12 +688,14 @@ var Main = ({
|
|
|
716
688
|
const theme = darkTheme ? darkThemeProp ?? getDarkTheme() : lightThemeProp ?? getLightTheme();
|
|
717
689
|
return /* @__PURE__ */ jsxRuntime.jsxs(styled2.ThemeProvider, { theme: { ...theme, isDark: darkTheme }, children: [
|
|
718
690
|
/* @__PURE__ */ jsxRuntime.jsx(global_default, {}),
|
|
719
|
-
/* @__PURE__ */ jsxRuntime.jsxs(MainContainer, { className,
|
|
691
|
+
/* @__PURE__ */ jsxRuntime.jsxs(MainContainer, { className, children: [
|
|
720
692
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
721
693
|
ThemeButton_default,
|
|
722
694
|
{
|
|
723
695
|
onClick: toggleTheme,
|
|
724
|
-
...position2 !== void 0 && { position: position2 }
|
|
696
|
+
...position2 !== void 0 && { position: position2 },
|
|
697
|
+
...iconLight !== void 0 && { iconLight },
|
|
698
|
+
...iconDark !== void 0 && { iconDark }
|
|
725
699
|
}
|
|
726
700
|
),
|
|
727
701
|
children
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/types/fontSize.ts","../src/types/breakpoints.ts","../src/components/Button/styles.ts","../src/components/Button/Button.tsx","../src/components/Input/styles.ts","../src/components/Checkbox/styles.ts","../src/components/Text/styles.ts","../src/components/Text/Text.tsx","../src/components/Checkbox/Checkbox.tsx","../src/components/Footer/styles.ts","../src/components/Footer/Footer.tsx","../src/components/Input/Input.tsx","../src/components/Label/styles.ts","../src/components/Label/Label.tsx","../src/components/Link/styles.ts","../src/components/Link/Link.tsx","../src/components/Logo/styles.ts","../src/utils/logoLoader.ts","../src/components/Logo/Logo.tsx","../src/styles/global.ts","../src/components/ThemeButton/styles.ts","../src/components/ThemeButton/ThemeButton.tsx","../src/themes/dark.ts","../src/themes/light.ts","../src/utils/themeLoader.ts","../src/components/Main/Main.tsx","../src/components/Title/styles.ts","../src/components/Title/Title.tsx"],"names":["styled","jsx","jsxs","useState","FaEye","FaEyeSlash","RouterLink","logoConfigModule","useTheme","createGlobalStyle","css","ThemeButton","position","path","ThemeProvider"],"mappings":"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","file":"index.js","sourcesContent":["export type FontSize = 4 | 8 | 12 | 16 | 20 | 24 | 32 | 40\n\nexport type FontSizeType = {\n $lgFontSize?: FontSize\n $mdFontSize?: FontSize\n $smFontSize?: FontSize\n}\n\nexport const fontSizeToRem = (size: FontSize): string => {\n const remMap: Record<FontSize, string> = {\n 4: '0.25rem',\n 8: '0.5rem',\n 12: '0.75rem',\n 16: '1rem',\n 20: '1.25rem',\n 24: '1.5rem',\n 32: '2rem',\n 40: '2.5rem'\n }\n return remMap[size]\n}\n","export const BREAKPOINTS = {\n md: '1024px',\n sm: '768px'\n} as const\n\nexport const mdScreen = `@media (max-width: ${BREAKPOINTS.md})`\nexport const smScreen = `@media (max-width: ${BREAKPOINTS.sm})`\n\nexport type BreakpointType = {\n mdScreen?: boolean\n smScreen?: boolean\n}\n\nexport const applyBreakpointStyles = (\n baseStyles: string,\n mdStyles?: string,\n smStyles?: string\n) => `\n ${baseStyles}\n\n ${mdStyles ? `${mdScreen} { ${mdStyles} }` : ''}\n ${smStyles ? `${smScreen} { ${smStyles} }` : ''}\n`\n","import styled from 'styled-components'\nimport { fontSizeToRem, mdScreen, smScreen, type FontSize } from '@/types'\n\ntype ButtonStyle = {\n id?: string | undefined\n disabled?: boolean | undefined\n as?: React.ElementType | undefined\n type?: 'button' | 'submit' | 'reset' | undefined\n $lgWidth?: number | undefined\n $mdWidth?: number | undefined\n $smWidth?: number | undefined\n $lgFontSize?: FontSize | undefined\n $mdFontSize?: FontSize | undefined\n $smFontSize?: FontSize | undefined\n}\n\nexport const ButtonStyled = styled.button<ButtonStyle>`\n width: ${(props) => props.$lgWidth || 100}%;\n font-size: ${(props) => fontSizeToRem(props.$lgFontSize || 16)};\n font-weight: 500;\n color: ${(props) => props.theme.bgColor};\n background-color: ${(props) => props.theme.primaryColor};\n padding: 12px 8px;\n border: none;\n border-radius: 6px;\n cursor: pointer;\n transition: 0.2s ease;\n\n &:hover {\n color: ${(props) => props.theme.primaryColor};\n background-color: ${(props) => props.theme.secondaryColor};\n }\n\n ${mdScreen} {\n width: ${(props) => props.$mdWidth || props.$lgWidth || 100}%;\n font-size: ${(props) =>\n fontSizeToRem(props.$mdFontSize || props.$lgFontSize || 16)};\n }\n\n ${smScreen} {\n width: ${(props) =>\n props.$smWidth || props.$mdWidth || props.$lgWidth || 100}%;\n font-size: ${(props) =>\n fontSizeToRem(\n props.$smFontSize || props.$mdFontSize || props.$lgFontSize || 16\n )};\n }\n`\n","import type { FontSizeType, WidthType } from '@/types'\nimport { ButtonStyled } from './styles'\n\nexport type ButtonType = {\n children: React.ReactNode\n className?: string\n id?: string\n onClick?: () => void\n disabled?: boolean\n as?: React.ElementType\n type?: 'button' | 'submit' | 'reset'\n} & WidthType &\n FontSizeType\n\nconst Button = ({\n children,\n className,\n onClick,\n disabled,\n $lgWidth,\n $mdWidth,\n $smWidth,\n $lgFontSize,\n $mdFontSize,\n $smFontSize,\n as,\n type,\n id\n}: ButtonType) => (\n <ButtonStyled\n className={className}\n onClick={onClick}\n disabled={disabled}\n $lgWidth={$lgWidth}\n $mdWidth={$mdWidth}\n $smWidth={$smWidth}\n $lgFontSize={$lgFontSize}\n $mdFontSize={$mdFontSize}\n $smFontSize={$smFontSize}\n as={as}\n type={type}\n id={id}\n >\n {children}\n </ButtonStyled>\n)\n\nexport default Button\n","import styled from 'styled-components'\nimport {\n mdScreen,\n smScreen,\n fontSizeToRem,\n type WidthType,\n type FontSize\n} from '@/types'\n\ntype InputWrapperProps = {\n display?: string | undefined\n} & WidthType\n\ntype InputStyle = {\n type?: string\n $lgFontSize?: FontSize | undefined\n $mdFontSize?: FontSize | undefined\n $smFontSize?: FontSize | undefined\n}\n\nexport const InputWrapper = styled.div<InputWrapperProps>`\n position: relative;\n display: ${(props) => props.display || 'block'};\n width: ${(props) => props.$lgWidth || 100}%;\n\n ${mdScreen} {\n width: ${(props) => props.$mdWidth || props.$lgWidth || 100}%;\n }\n\n ${smScreen} {\n width: ${(props) =>\n props.$smWidth || props.$mdWidth || props.$lgWidth || 100}%;\n }\n`\n\nexport const InputStyled = styled.input<InputStyle>`\n width: 100%;\n padding: 16px 8px;\n border-radius: 8px;\n border: 1px solid ${(props) => props.theme.tertiaryColor};\n background-color: transparent;\n color: ${(props) => props.theme.primaryColor};\n font-size: ${(props) => fontSizeToRem(props.$lgFontSize || 16)};\n\n &:focus {\n outline: none;\n box-shadow: 0 0 4px 2px ${(props) => props.theme.tertiaryColor};\n }\n\n ${mdScreen} {\n font-size: ${(props) =>\n fontSizeToRem(props.$mdFontSize || props.$lgFontSize || 16)};\n }\n\n ${smScreen} {\n font-size: ${(props) =>\n fontSizeToRem(\n props.$smFontSize || props.$mdFontSize || props.$lgFontSize || 16\n )};\n }\n`\n\nexport const EyeButton = styled.button<InputStyle>`\n position: absolute;\n right: 8px;\n top: 50%;\n transform: translateY(-50%);\n background: transparent;\n border: none;\n cursor: pointer;\n padding: 8px;\n display: flex;\n align-items: center;\n justify-content: center;\n color: ${(props) => props.theme.primaryColor};\n transition: color 0.2s ease;\n font-size: ${(props) => fontSizeToRem(props.$lgFontSize || 16)};\n\n svg {\n width: 20px;\n height: 20px;\n }\n\n ${mdScreen} {\n font-size: ${(props) =>\n fontSizeToRem(props.$mdFontSize || props.$lgFontSize || 16)};\n }\n\n ${smScreen} {\n font-size: ${(props) =>\n fontSizeToRem(\n props.$smFontSize || props.$mdFontSize || props.$lgFontSize || 16\n )};\n }\n`\n","import styled from 'styled-components'\nimport { mdScreen, smScreen, type WidthType } from '@/types'\nimport { InputStyled } from '@/components/Input/styles'\n\ntype CheckLabelStyled = {\n display?: string | undefined\n} & WidthType\n\nexport const CheckLabel = styled.label<CheckLabelStyled>`\n width: ${(props) => props.$lgWidth || 100}%;\n display: flex;\n align-items: center;\n gap: 4px;\n cursor: pointer;\n\n ${mdScreen} {\n width: ${(props) => props.$mdWidth || props.$lgWidth || 100}%;\n justify-content: center;\n }\n\n ${smScreen} {\n width: ${(props) =>\n props.$smWidth || props.$mdWidth || props.$lgWidth || 100}%;\n justify-content: center;\n }\n`\n\nexport const CheckInput = styled(InputStyled)<CheckLabelStyled>`\n width: ${(props) => props.$lgWidth || 5}%;\n height: 20px;\n margin: 0;\n cursor: pointer;\n box-shadow: none !important;\n\n ${mdScreen} {\n width: ${(props) => props.$mdWidth || props.$lgWidth || 5}%;\n }\n\n ${smScreen} {\n width: ${(props) =>\n props.$smWidth || props.$mdWidth || props.$lgWidth || 5}%;\n }\n`\n","import styled from 'styled-components'\nimport { fontSizeToRem, mdScreen, smScreen, type FontSize } from '@/types'\n\ntype TextStyledProps = {\n $lgFontSize?: FontSize | undefined\n $mdFontSize?: FontSize | undefined\n $smFontSize?: FontSize | undefined\n as?: 'p' | 'span'\n color?: 'primary' | 'secondary'\n}\n\nexport const TextStyled = styled.p<TextStyledProps>`\n font-size: ${(props) => fontSizeToRem(props.$lgFontSize || 16)};\n color: ${(props) =>\n props.color === 'primary'\n ? props.theme.primaryColor\n : props.theme.secondaryColor};\n\n ${mdScreen} {\n font-size: ${(props) =>\n fontSizeToRem(props.$mdFontSize || props.$lgFontSize || 16)};\n }\n\n ${smScreen} {\n font-size: ${(props) =>\n fontSizeToRem(\n props.$smFontSize || props.$mdFontSize || props.$lgFontSize || 16\n )};\n }\n`\n","import type { FontSizeType } from '@/types'\nimport { TextStyled } from './styles'\n\nexport type TextType = {\n as: 'p' | 'span'\n children: React.ReactNode\n className?: string\n color?: 'primary' | 'secondary'\n} & FontSizeType\n\nconst Text = ({\n as,\n children,\n className,\n color = 'primary',\n $lgFontSize,\n $mdFontSize,\n $smFontSize\n}: TextType) => (\n <TextStyled\n as={as}\n className={className}\n color={color}\n $lgFontSize={$lgFontSize}\n $mdFontSize={$mdFontSize}\n $smFontSize={$smFontSize}\n >\n {children}\n </TextStyled>\n)\n\nexport default Text\n","import type { WidthType, FontSizeType } from '@/types'\nimport { CheckInput, CheckLabel } from './styles'\nimport Text from '@/components/Text/Text'\n\nexport type CheckboxType = {\n id: string\n name: string\n checked?: boolean\n className?: string\n $disabled?: boolean\n children: string\n display?: string\n onClick?: () => void\n onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void\n} & WidthType &\n FontSizeType\n\nconst Checkbox = ({\n id,\n name,\n checked,\n className,\n $disabled,\n children,\n display,\n $lgWidth,\n $mdWidth,\n $smWidth,\n $lgFontSize = 16,\n $mdFontSize = 16,\n $smFontSize = 16,\n onClick,\n onChange\n}: CheckboxType) => (\n <CheckLabel\n className={className}\n htmlFor={id}\n display={display}\n $lgWidth={$lgWidth}\n $mdWidth={$mdWidth}\n $smWidth={$smWidth}\n >\n <CheckInput\n type=\"checkbox\"\n id={id}\n name={name}\n checked={checked}\n disabled={$disabled}\n display={display}\n onClick={onClick}\n onChange={onChange}\n />\n <Text\n as=\"span\"\n color=\"primary\"\n $lgFontSize={$lgFontSize}\n $mdFontSize={$mdFontSize}\n $smFontSize={$smFontSize}\n >\n {children}\n </Text>\n </CheckLabel>\n)\n\nexport default Checkbox\n","import styled from 'styled-components'\n\nexport const FooterStyled = styled.footer`\n width: 100%;\n margin-top: 2%;\n padding: 1rem;\n color: #fff;\n text-align: center;\n`\n","import { FooterStyled } from './styles'\ntype FooterType = {\n children: React.ReactNode\n className?: string\n}\nconst Footer = ({ children, className }: FooterType) => {\n return <FooterStyled className={className}>{children}</FooterStyled>\n}\n\nexport default Footer\n","import React, { useState } from 'react'\nimport { FaEye, FaEyeSlash } from 'react-icons/fa6'\nimport type { WidthType, FontSizeType } from '@/types'\nimport { EyeButton, InputStyled, InputWrapper } from './styles'\n\nexport type InputType = {\n type: string\n id: string\n name: string\n className?: string\n placeholder?: string\n value?: string\n display?: string\n $disabled?: boolean\n $required?: boolean\n onClick?: () => void\n onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void\n} & WidthType &\n FontSizeType\n\nconst Input = ({\n type,\n id,\n name,\n className,\n placeholder,\n display,\n $lgWidth,\n $mdWidth,\n $smWidth,\n $lgFontSize,\n $mdFontSize,\n $smFontSize,\n $disabled,\n $required,\n onClick,\n onChange\n}: InputType) => {\n const [showPassword, setShowPassword] = useState(false)\n\n return (\n <InputWrapper\n className={className}\n display={display}\n $lgWidth={$lgWidth}\n $mdWidth={$mdWidth}\n $smWidth={$smWidth}\n >\n <InputStyled\n type={type === 'password' ? (showPassword ? 'text' : 'password') : type}\n id={id}\n name={name}\n placeholder={placeholder}\n onClick={onClick}\n onChange={onChange}\n disabled={$disabled}\n required={$required}\n $lgFontSize={$lgFontSize}\n $mdFontSize={$mdFontSize}\n $smFontSize={$smFontSize}\n />\n {type === 'password' && (\n <EyeButton type=\"button\" onClick={() => setShowPassword(!showPassword)}>\n {showPassword ? <FaEye /> : <FaEyeSlash />}\n </EyeButton>\n )}\n </InputWrapper>\n )\n}\n\nexport default Input\n","import styled from 'styled-components'\nimport { mdScreen, smScreen, fontSizeToRem, type FontSize } from '@/types'\n\ntype LabelStyledProps = {\n $lgFontSize?: FontSize | undefined\n $mdFontSize?: FontSize | undefined\n $smFontSize?: FontSize | undefined\n}\n\nexport const LabelStyled = styled.label<LabelStyledProps>`\n font-size: ${(props) => fontSizeToRem(props.$lgFontSize || 16)};\n font-weight: 500;\n color: ${(props) => props.theme.primaryColor};\n margin-bottom: 4px;\n display: block;\n\n ${mdScreen} {\n font-size: ${(props) =>\n fontSizeToRem(props.$mdFontSize || props.$lgFontSize || 16)};\n }\n\n ${smScreen} {\n font-size: ${(props) =>\n fontSizeToRem(\n props.$smFontSize || props.$mdFontSize || props.$lgFontSize || 16\n )};\n }\n`\n","import React from 'react'\nimport type { FontSizeType } from '@/types'\nimport { LabelStyled } from './styles'\n\nexport type LabelType = {\n htmlFor: string\n children: React.ReactNode\n className?: string\n color?: 'primary' | 'secondary'\n} & FontSizeType\n\nconst Label = ({\n htmlFor,\n children,\n className,\n $lgFontSize,\n $mdFontSize,\n $smFontSize\n}: LabelType) => (\n <LabelStyled\n className={className}\n htmlFor={htmlFor}\n $lgFontSize={$lgFontSize}\n $mdFontSize={$mdFontSize}\n $smFontSize={$smFontSize}\n >\n {children}\n </LabelStyled>\n)\n\nexport default Label\n","import styled from 'styled-components'\nimport { fontSizeToRem, mdScreen, smScreen, type FontSize } from '@/types'\n\ntype LinkStyledProps = {\n $lgFontSize?: FontSize | undefined\n $mdFontSize?: FontSize | undefined\n $smFontSize?: FontSize | undefined\n $target?: '_blank' | '_self'\n color?: 'primary' | 'secondary'\n}\n\nexport const LinkStyled = styled.a<LinkStyledProps>`\n color: ${(props) =>\n props.color === 'primary'\n ? props.theme.primaryColor\n : props.color === 'secondary'\n ? props.theme.secondaryColor\n : props.theme.linkColor};\n text-decoration: none;\n font-size: ${(props) => fontSizeToRem(props.$lgFontSize || 16)};\n font-weight: normal;\n background-image: linear-gradient(currentColor, currentColor);\n background-position: 0 100%;\n background-size: 0% 2px;\n background-repeat: no-repeat;\n transition:\n background-size 0.2s,\n background-position 0s 0.2s;\n\n &:hover {\n background-position: 100% 100%;\n background-size: 100% 2px;\n }\n ${mdScreen} {\n font-size: ${(props) =>\n fontSizeToRem(props.$mdFontSize || props.$lgFontSize || 16)};\n }\n\n ${smScreen} {\n font-size: ${(props) =>\n fontSizeToRem(\n props.$smFontSize || props.$mdFontSize || props.$lgFontSize || 16\n )};\n }\n`\n","import type { FontSizeType } from '@/types'\nimport { LinkStyled } from './styles'\nimport { Link as RouterLink } from 'react-router-dom'\n\nexport type LinkType = {\n href?: string\n to?: string\n children: React.ReactNode\n className?: string\n $target?: '_blank' | '_self'\n $isInternal?: boolean\n} & FontSizeType\n\nconst Link = ({\n href,\n to,\n children,\n className,\n $target,\n $isInternal = false,\n $lgFontSize,\n $mdFontSize,\n $smFontSize\n}: LinkType) => {\n if ($isInternal && to) {\n return (\n <RouterLink to={to} style={{ textDecoration: 'none', color: 'inherit' }}>\n <LinkStyled\n className={className}\n $lgFontSize={$lgFontSize}\n $mdFontSize={$mdFontSize}\n $smFontSize={$smFontSize}\n >\n {children}\n </LinkStyled>\n </RouterLink>\n )\n }\n\n return (\n <LinkStyled\n className={className}\n href={href}\n target={$target}\n $lgFontSize={$lgFontSize}\n $mdFontSize={$mdFontSize}\n $smFontSize={$smFontSize}\n >\n {children}\n </LinkStyled>\n )\n}\n\nexport default Link\n","import styled from 'styled-components'\nimport type { WidthType } from '@/types'\nimport { mdScreen, smScreen } from '@/types'\n\nexport const LogoStyled = styled.div<WidthType>`\n width: ${(props) => props.$lgWidth || 100}%;\n & > img {\n width: 100%;\n height: auto;\n display: block;\n }\n\n ${mdScreen} {\n width: ${(props) => props.$mdWidth || props.$lgWidth || 100}%;\n }\n\n ${smScreen} {\n width: ${(props) =>\n props.$smWidth || props.$mdWidth || props.$lgWidth || 100}%;\n }\n`\n","import LogoLightDefault from '@/assets/logos/light-theme.svg'\nimport LogoDarkDefault from '@/assets/logos/dark-theme.svg'\nimport IconLightDefault from '@/assets/icon/icon-light-theme.svg'\nimport IconDarkDefault from '@/assets/icon/icon-dark-theme.svg'\nimport * as logoConfigModule from 'catastyle/config'\n\nconst logoConfig =\n (\n logoConfigModule as {\n default?: {\n logoLight?: string\n logoDark?: string\n iconLight?: string\n iconDark?: string\n }\n }\n ).default ?? logoConfigModule\n\nexport function getLogoLight(): string {\n if (logoConfig.logoLight && logoConfig.logoLight !== 'default') {\n return logoConfig.logoLight\n }\n return LogoLightDefault\n}\n\nexport function getLogoDark(): string {\n if (logoConfig.logoDark && logoConfig.logoDark !== 'default') {\n return logoConfig.logoDark\n }\n return LogoDarkDefault\n}\n\nexport function getIconLight(): string {\n if (logoConfig.iconLight && logoConfig.iconLight !== 'default') {\n return logoConfig.iconLight\n }\n return IconLightDefault\n}\n\nexport function getIconDark(): string {\n if (logoConfig.iconDark && logoConfig.iconDark !== 'default') {\n return logoConfig.iconDark\n }\n return IconDarkDefault\n}\n","import { LogoStyled } from './styles'\nimport type { WidthType } from '@/types'\nimport { useTheme } from 'styled-components'\nimport { getLogoLight, getLogoDark } from '@/utils/logoLoader'\n\ntype LogoProps = {\n className?: string\n} & WidthType\n\nconst Logo = ({ className, $lgWidth, $mdWidth, $smWidth }: LogoProps) => {\n const theme = useTheme()\n const isDarkTheme = theme.isDark === true\n\n return (\n <LogoStyled\n className={className}\n $lgWidth={$lgWidth}\n $mdWidth={$mdWidth}\n $smWidth={$smWidth}\n >\n <img src={isDarkTheme ? getLogoDark() : getLogoLight()} alt=\"Logo\" />\n </LogoStyled>\n )\n}\n\nexport default Logo\n","import styled, { createGlobalStyle } from 'styled-components'\n\nconst GlobalStyle = createGlobalStyle`\n*{\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n list-style: none;\n font-family: \"Inter\", sans-serif;\n}\n\nbody{\n background-color: ${(props) => props.theme.bgColor};\n color: ${(props) => props.theme.primaryColor};\n\n`\nexport default GlobalStyle\n\nexport const MainContainer = styled.main<{ $centered?: boolean }>`\n width: ${(props) => (props.$centered !== false ? '100vw' : '100%')};\n max-width: ${(props) => (props.$centered !== false ? '1200px' : 'none')};\n margin: ${(props) => (props.$centered !== false ? '0 auto' : '0')};\n min-height: ${(props) => (props.$centered !== false ? '100vh' : 'auto')};\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n overflow-y: auto;\n &::-webkit-scrollbar {\n display: none;\n }\n`\n","import styled, { css } from 'styled-components'\nimport { ButtonStyled } from '@/components/Button/styles'\nexport type ThemeButtonPosition =\n | 'top-right'\n | 'top-left'\n | 'bottom-right'\n | 'bottom-left'\ntype ButtonPosition = { $position?: ThemeButtonPosition }\nconst position = [\n {\n 'top-right': css`\n top: 1.25rem;\n right: 1.25rem;\n `\n },\n {\n 'top-left': css`\n top: 1.25rem;\n left: 1.25rem;\n `\n },\n {\n 'bottom-right': css`\n bottom: 1.25rem;\n right: 1.25rem;\n `\n },\n {\n 'bottom-left': css`\n bottom: 1.25rem;\n left: 1.25rem;\n `\n }\n]\nconst getPosition = (key: ThemeButtonPosition) =>\n (\n position.find((pos) => key in pos) as\n | Record<ThemeButtonPosition, ReturnType<typeof css>>\n | undefined\n )?.[key]\nexport const ThemeButton = styled(ButtonStyled)<ButtonPosition>`\n position: fixed;\n width: 3rem;\n height: 3rem;\n ${(props) => getPosition(props.$position ?? 'bottom-right')}\n z-index: 9999;\n border-radius: 50%;\n padding: 1%;\n display: flex;\n align-items: center;\n justify-content: center;\n & > img {\n width: 100%;\n height: 100%;\n }\n &:hover {\n background-color: ${(props) => props.theme.tertiaryColor};\n box-shadow: 0 0 10px 0 ${(props) => props.theme.primaryColor};\n }\n`\n","import { ThemeButton as ThemeButtonStyled } from './styles'\nimport { useTheme } from 'styled-components'\nimport { getIconDark, getIconLight } from '@/utils/logoLoader'\n\ntype ThemeButtonType = {\n className?: string\n onClick?: () => void\n position?: 'top-right' | 'top-left' | 'bottom-right' | 'bottom-left'\n}\nconst ThemeButton = ({\n className,\n onClick,\n position = 'bottom-right'\n}: ThemeButtonType) => {\n const theme = useTheme()\n const isDarkTheme = theme.isDark === true\n return (\n <ThemeButtonStyled\n className={className}\n onClick={onClick}\n $position={position}\n >\n <img\n src={isDarkTheme ? getIconLight() : getIconDark()}\n alt=\"Theme Button\"\n />\n </ThemeButtonStyled>\n )\n}\n\nexport default ThemeButton\n","import type { DefaultTheme } from 'styled-components/'\n\nconst DarkTheme: DefaultTheme = {\n primaryColor: '#EBFFEB',\n secondaryColor: '#538A53',\n tertiaryColor: '#669966',\n bgColor: '#011F1F',\n linkColor: '#33CC66'\n}\n\nexport default DarkTheme\n","import type { DefaultTheme } from 'styled-components/'\n\nconst LightTheme: DefaultTheme = {\n primaryColor: '#011F1F',\n secondaryColor: '#33CC66',\n tertiaryColor: '#538A53',\n bgColor: '#EBFFEB',\n linkColor: '#006633'\n}\n\nexport default LightTheme\n","import type { DefaultTheme } from 'styled-components'\nimport DarkThemeDefault from '@/themes/dark'\nimport LightThemeDefault from '@/themes/light'\nimport path from 'path'\n\nfunction tryLoadUserThemeConfig(): {\n darkTheme: DefaultTheme | null\n lightTheme: DefaultTheme | null\n} | null {\n if (typeof window !== 'undefined') {\n return null\n }\n\n try {\n const userProjectRoot = process.cwd()\n const configPath = path.join(\n userProjectRoot,\n 'src',\n 'catastyle',\n 'config',\n 'catastyle.config.ts'\n )\n\n try {\n const resolvedPath = require.resolve(configPath)\n delete require.cache[resolvedPath]\n const config = require(configPath)\n return {\n darkTheme: config.darkTheme ?? null,\n lightTheme: config.lightTheme ?? null\n }\n } catch {\n return null\n }\n } catch {\n return null\n }\n}\n\nexport function getDarkTheme(): DefaultTheme {\n const userConfig = tryLoadUserThemeConfig()\n return userConfig?.darkTheme ?? DarkThemeDefault\n}\n\nexport function getLightTheme(): DefaultTheme {\n const userConfig = tryLoadUserThemeConfig()\n return userConfig?.lightTheme ?? LightThemeDefault\n}\n","import GlobalStyle, { MainContainer } from '@/styles/global'\nimport { ThemeProvider } from 'styled-components'\nimport type { DefaultTheme } from 'styled-components'\nimport { useState } from 'react'\nimport ThemeButton from '@/components/ThemeButton/ThemeButton'\nimport { getDarkTheme, getLightTheme } from '@/utils/themeLoader'\nimport type { ThemeButtonPosition } from '../ThemeButton/styles'\n\nexport type MainType = {\n children: React.ReactNode\n className?: string\n position?: ThemeButtonPosition\n darkTheme?: DefaultTheme | null\n lightTheme?: DefaultTheme | null\n centered?: boolean\n}\nconst Main = ({\n children,\n className,\n position,\n darkTheme: darkThemeProp,\n lightTheme: lightThemeProp,\n centered = true\n}: MainType) => {\n const [darkTheme, setDarkTheme] = useState(false)\n function toggleTheme() {\n setDarkTheme(!darkTheme)\n }\n const theme = darkTheme\n ? (darkThemeProp ?? getDarkTheme())\n : (lightThemeProp ?? getLightTheme())\n return (\n <ThemeProvider theme={{ ...theme, isDark: darkTheme }}>\n <GlobalStyle />\n <MainContainer className={className} $centered={centered}>\n <ThemeButton\n onClick={toggleTheme}\n {...(position !== undefined && { position })}\n />\n {children}\n </MainContainer>\n </ThemeProvider>\n )\n}\n\nexport default Main\n","import styled from 'styled-components'\nimport { fontSizeToRem, mdScreen, smScreen, type FontSize } from '@/types'\n\ntype TitleStyledProps = {\n $lgFontSize?: FontSize | undefined\n $mdFontSize?: FontSize | undefined\n $smFontSize?: FontSize | undefined\n color: 'primary' | 'secondary'\n}\n\nexport const TitleStyled = styled.h1<TitleStyledProps>`\n font-size: ${(props) => fontSizeToRem(props.$lgFontSize || 32)};\n font-weight: 600;\n color: ${(props) =>\n props.color === 'primary'\n ? props.theme.primaryColor\n : props.theme.secondaryColor};\n\n ${mdScreen} {\n font-size: ${(props) =>\n fontSizeToRem(props.$mdFontSize || props.$lgFontSize || 32)};\n }\n\n ${smScreen} {\n font-size: ${(props) =>\n fontSizeToRem(\n props.$smFontSize || props.$mdFontSize || props.$lgFontSize || 32\n )};\n }\n`\n","import type { FontSizeType } from '@/types'\nimport { TitleStyled } from './styles'\n\nexport type TitleType = {\n children: string\n className?: string\n color: 'primary' | 'secondary'\n} & FontSizeType\n\nconst Title = ({\n children,\n className,\n color,\n $lgFontSize,\n $mdFontSize,\n $smFontSize\n}: TitleType) => (\n <TitleStyled\n className={className}\n color={color}\n $lgFontSize={$lgFontSize}\n $mdFontSize={$mdFontSize}\n $smFontSize={$smFontSize}\n >\n {children}\n </TitleStyled>\n)\n\nexport default Title\n"]}
|
|
1
|
+
{"version":3,"sources":["../src/types/fontSize.ts","../src/types/breakpoints.ts","../src/components/Button/styles.ts","../src/components/Button/Button.tsx","../src/components/Input/styles.ts","../src/components/Checkbox/styles.ts","../src/components/Text/styles.ts","../src/components/Text/Text.tsx","../src/components/Checkbox/Checkbox.tsx","../src/components/Footer/styles.ts","../src/components/Footer/Footer.tsx","../src/components/Input/Input.tsx","../src/components/Label/styles.ts","../src/components/Label/Label.tsx","../src/components/Link/styles.ts","../src/components/Link/Link.tsx","../src/components/Logo/styles.ts","../src/utils/logoLoader.ts","../src/components/Logo/Logo.tsx","../src/styles/global.ts","../src/components/ThemeButton/styles.ts","../src/components/ThemeButton/ThemeButton.tsx","../src/themes/dark.ts","../src/themes/light.ts","../src/utils/themeLoader.ts","../src/components/Main/Main.tsx","../src/components/Title/styles.ts","../src/components/Title/Title.tsx"],"names":["styled","jsx","jsxs","useState","FaEye","FaEyeSlash","RouterLink","useTheme","createGlobalStyle","css","ThemeButton","position","path","ThemeProvider"],"mappings":"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","file":"index.js","sourcesContent":["export type FontSize = 4 | 8 | 12 | 16 | 20 | 24 | 32 | 40\n\nexport type FontSizeType = {\n $lgFontSize?: FontSize\n $mdFontSize?: FontSize\n $smFontSize?: FontSize\n}\n\nexport const fontSizeToRem = (size: FontSize): string => {\n const remMap: Record<FontSize, string> = {\n 4: '0.25rem',\n 8: '0.5rem',\n 12: '0.75rem',\n 16: '1rem',\n 20: '1.25rem',\n 24: '1.5rem',\n 32: '2rem',\n 40: '2.5rem'\n }\n return remMap[size]\n}\n","export const BREAKPOINTS = {\n md: '1024px',\n sm: '768px'\n} as const\n\nexport const mdScreen = `@media (max-width: ${BREAKPOINTS.md})`\nexport const smScreen = `@media (max-width: ${BREAKPOINTS.sm})`\n\nexport type BreakpointType = {\n mdScreen?: boolean\n smScreen?: boolean\n}\n\nexport const applyBreakpointStyles = (\n baseStyles: string,\n mdStyles?: string,\n smStyles?: string\n) => `\n ${baseStyles}\n\n ${mdStyles ? `${mdScreen} { ${mdStyles} }` : ''}\n ${smStyles ? `${smScreen} { ${smStyles} }` : ''}\n`\n","import styled from 'styled-components'\nimport { fontSizeToRem, mdScreen, smScreen, type FontSize } from '@/types'\n\ntype ButtonStyle = {\n id?: string | undefined\n disabled?: boolean | undefined\n as?: React.ElementType | undefined\n type?: 'button' | 'submit' | 'reset' | undefined\n $lgWidth?: number | undefined\n $mdWidth?: number | undefined\n $smWidth?: number | undefined\n $lgFontSize?: FontSize | undefined\n $mdFontSize?: FontSize | undefined\n $smFontSize?: FontSize | undefined\n}\n\nexport const ButtonStyled = styled.button<ButtonStyle>`\n width: ${(props) => props.$lgWidth || 100}%;\n font-size: ${(props) => fontSizeToRem(props.$lgFontSize || 16)};\n font-weight: 500;\n color: ${(props) => props.theme.bgColor};\n background-color: ${(props) => props.theme.primaryColor};\n padding: 12px 8px;\n border: none;\n border-radius: 6px;\n cursor: pointer;\n transition: 0.2s ease;\n\n &:hover {\n color: ${(props) => props.theme.primaryColor};\n background-color: ${(props) => props.theme.secondaryColor};\n }\n\n ${mdScreen} {\n width: ${(props) => props.$mdWidth || props.$lgWidth || 100}%;\n font-size: ${(props) =>\n fontSizeToRem(props.$mdFontSize || props.$lgFontSize || 16)};\n }\n\n ${smScreen} {\n width: ${(props) =>\n props.$smWidth || props.$mdWidth || props.$lgWidth || 100}%;\n font-size: ${(props) =>\n fontSizeToRem(\n props.$smFontSize || props.$mdFontSize || props.$lgFontSize || 16\n )};\n }\n`\n","import type { FontSizeType, WidthType } from '@/types'\nimport { ButtonStyled } from './styles'\n\nexport type ButtonType = {\n children: React.ReactNode\n className?: string\n id?: string\n onClick?: () => void\n disabled?: boolean\n as?: React.ElementType\n type?: 'button' | 'submit' | 'reset'\n} & WidthType &\n FontSizeType\n\nconst Button = ({\n children,\n className,\n onClick,\n disabled,\n $lgWidth,\n $mdWidth,\n $smWidth,\n $lgFontSize,\n $mdFontSize,\n $smFontSize,\n as,\n type,\n id\n}: ButtonType) => (\n <ButtonStyled\n className={className}\n onClick={onClick}\n disabled={disabled}\n $lgWidth={$lgWidth}\n $mdWidth={$mdWidth}\n $smWidth={$smWidth}\n $lgFontSize={$lgFontSize}\n $mdFontSize={$mdFontSize}\n $smFontSize={$smFontSize}\n as={as}\n type={type}\n id={id}\n >\n {children}\n </ButtonStyled>\n)\n\nexport default Button\n","import styled from 'styled-components'\nimport {\n mdScreen,\n smScreen,\n fontSizeToRem,\n type WidthType,\n type FontSize\n} from '@/types'\n\ntype InputWrapperProps = {\n display?: string | undefined\n} & WidthType\n\ntype InputStyle = {\n type?: string\n $lgFontSize?: FontSize | undefined\n $mdFontSize?: FontSize | undefined\n $smFontSize?: FontSize | undefined\n}\n\nexport const InputWrapper = styled.div<InputWrapperProps>`\n position: relative;\n display: ${(props) => props.display || 'block'};\n width: ${(props) => props.$lgWidth || 100}%;\n\n ${mdScreen} {\n width: ${(props) => props.$mdWidth || props.$lgWidth || 100}%;\n }\n\n ${smScreen} {\n width: ${(props) =>\n props.$smWidth || props.$mdWidth || props.$lgWidth || 100}%;\n }\n`\n\nexport const InputStyled = styled.input<InputStyle>`\n width: 100%;\n padding: 16px 8px;\n border-radius: 8px;\n border: 1px solid ${(props) => props.theme.tertiaryColor};\n background-color: transparent;\n color: ${(props) => props.theme.primaryColor};\n font-size: ${(props) => fontSizeToRem(props.$lgFontSize || 16)};\n\n &:focus {\n outline: none;\n box-shadow: 0 0 4px 2px ${(props) => props.theme.tertiaryColor};\n }\n\n ${mdScreen} {\n font-size: ${(props) =>\n fontSizeToRem(props.$mdFontSize || props.$lgFontSize || 16)};\n }\n\n ${smScreen} {\n font-size: ${(props) =>\n fontSizeToRem(\n props.$smFontSize || props.$mdFontSize || props.$lgFontSize || 16\n )};\n }\n`\n\nexport const EyeButton = styled.button<InputStyle>`\n position: absolute;\n right: 8px;\n top: 50%;\n transform: translateY(-50%);\n background: transparent;\n border: none;\n cursor: pointer;\n padding: 8px;\n display: flex;\n align-items: center;\n justify-content: center;\n color: ${(props) => props.theme.primaryColor};\n transition: color 0.2s ease;\n font-size: ${(props) => fontSizeToRem(props.$lgFontSize || 16)};\n\n svg {\n width: 20px;\n height: 20px;\n }\n\n ${mdScreen} {\n font-size: ${(props) =>\n fontSizeToRem(props.$mdFontSize || props.$lgFontSize || 16)};\n }\n\n ${smScreen} {\n font-size: ${(props) =>\n fontSizeToRem(\n props.$smFontSize || props.$mdFontSize || props.$lgFontSize || 16\n )};\n }\n`\n","import styled from 'styled-components'\nimport { mdScreen, smScreen, type WidthType } from '@/types'\nimport { InputStyled } from '@/components/Input/styles'\n\ntype CheckLabelStyled = {\n display?: string | undefined\n} & WidthType\n\nexport const CheckLabel = styled.label<CheckLabelStyled>`\n width: ${(props) => props.$lgWidth || 100}%;\n display: flex;\n align-items: center;\n gap: 4px;\n cursor: pointer;\n\n ${mdScreen} {\n width: ${(props) => props.$mdWidth || props.$lgWidth || 100}%;\n justify-content: center;\n }\n\n ${smScreen} {\n width: ${(props) =>\n props.$smWidth || props.$mdWidth || props.$lgWidth || 100}%;\n justify-content: center;\n }\n`\n\nexport const CheckInput = styled(InputStyled)<CheckLabelStyled>`\n width: ${(props) => props.$lgWidth || 5}%;\n height: 20px;\n margin: 0;\n cursor: pointer;\n box-shadow: none !important;\n\n ${mdScreen} {\n width: ${(props) => props.$mdWidth || props.$lgWidth || 5}%;\n }\n\n ${smScreen} {\n width: ${(props) =>\n props.$smWidth || props.$mdWidth || props.$lgWidth || 5}%;\n }\n`\n","import styled from 'styled-components'\nimport { fontSizeToRem, mdScreen, smScreen, type FontSize } from '@/types'\n\ntype TextStyledProps = {\n $lgFontSize?: FontSize | undefined\n $mdFontSize?: FontSize | undefined\n $smFontSize?: FontSize | undefined\n as?: 'p' | 'span'\n color?: 'primary' | 'secondary'\n}\n\nexport const TextStyled = styled.p<TextStyledProps>`\n font-size: ${(props) => fontSizeToRem(props.$lgFontSize || 16)};\n color: ${(props) =>\n props.color === 'primary'\n ? props.theme.primaryColor\n : props.theme.secondaryColor};\n\n ${mdScreen} {\n font-size: ${(props) =>\n fontSizeToRem(props.$mdFontSize || props.$lgFontSize || 16)};\n }\n\n ${smScreen} {\n font-size: ${(props) =>\n fontSizeToRem(\n props.$smFontSize || props.$mdFontSize || props.$lgFontSize || 16\n )};\n }\n`\n","import type { FontSizeType } from '@/types'\nimport { TextStyled } from './styles'\n\nexport type TextType = {\n as: 'p' | 'span'\n children: React.ReactNode\n className?: string\n color?: 'primary' | 'secondary'\n} & FontSizeType\n\nconst Text = ({\n as,\n children,\n className,\n color = 'primary',\n $lgFontSize,\n $mdFontSize,\n $smFontSize\n}: TextType) => (\n <TextStyled\n as={as}\n className={className}\n color={color}\n $lgFontSize={$lgFontSize}\n $mdFontSize={$mdFontSize}\n $smFontSize={$smFontSize}\n >\n {children}\n </TextStyled>\n)\n\nexport default Text\n","import type { WidthType, FontSizeType } from '@/types'\nimport { CheckInput, CheckLabel } from './styles'\nimport Text from '@/components/Text/Text'\n\nexport type CheckboxType = {\n id: string\n name: string\n checked?: boolean\n className?: string\n $disabled?: boolean\n children: string\n display?: string\n onClick?: () => void\n onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void\n} & WidthType &\n FontSizeType\n\nconst Checkbox = ({\n id,\n name,\n checked,\n className,\n $disabled,\n children,\n display,\n $lgWidth,\n $mdWidth,\n $smWidth,\n $lgFontSize = 16,\n $mdFontSize = 16,\n $smFontSize = 16,\n onClick,\n onChange\n}: CheckboxType) => (\n <CheckLabel\n className={className}\n htmlFor={id}\n display={display}\n $lgWidth={$lgWidth}\n $mdWidth={$mdWidth}\n $smWidth={$smWidth}\n >\n <CheckInput\n type=\"checkbox\"\n id={id}\n name={name}\n checked={checked}\n disabled={$disabled}\n display={display}\n onClick={onClick}\n onChange={onChange}\n />\n <Text\n as=\"span\"\n color=\"primary\"\n $lgFontSize={$lgFontSize}\n $mdFontSize={$mdFontSize}\n $smFontSize={$smFontSize}\n >\n {children}\n </Text>\n </CheckLabel>\n)\n\nexport default Checkbox\n","import styled from 'styled-components'\n\nexport const FooterStyled = styled.footer`\n width: 100%;\n margin-top: 2%;\n padding: 1rem;\n color: #fff;\n text-align: center;\n`\n","import { FooterStyled } from './styles'\ntype FooterType = {\n children: React.ReactNode\n className?: string\n}\nconst Footer = ({ children, className }: FooterType) => {\n return <FooterStyled className={className}>{children}</FooterStyled>\n}\n\nexport default Footer\n","import React, { useState } from 'react'\nimport { FaEye, FaEyeSlash } from 'react-icons/fa6'\nimport type { WidthType, FontSizeType } from '@/types'\nimport { EyeButton, InputStyled, InputWrapper } from './styles'\n\nexport type InputType = {\n type: string\n id: string\n name: string\n className?: string\n placeholder?: string\n value?: string\n display?: string\n $disabled?: boolean\n $required?: boolean\n onClick?: () => void\n onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void\n} & WidthType &\n FontSizeType\n\nconst Input = ({\n type,\n id,\n name,\n className,\n placeholder,\n display,\n $lgWidth,\n $mdWidth,\n $smWidth,\n $lgFontSize,\n $mdFontSize,\n $smFontSize,\n $disabled,\n $required,\n onClick,\n onChange\n}: InputType) => {\n const [showPassword, setShowPassword] = useState(false)\n\n return (\n <InputWrapper\n className={className}\n display={display}\n $lgWidth={$lgWidth}\n $mdWidth={$mdWidth}\n $smWidth={$smWidth}\n >\n <InputStyled\n type={type === 'password' ? (showPassword ? 'text' : 'password') : type}\n id={id}\n name={name}\n placeholder={placeholder}\n onClick={onClick}\n onChange={onChange}\n disabled={$disabled}\n required={$required}\n $lgFontSize={$lgFontSize}\n $mdFontSize={$mdFontSize}\n $smFontSize={$smFontSize}\n />\n {type === 'password' && (\n <EyeButton type=\"button\" onClick={() => setShowPassword(!showPassword)}>\n {showPassword ? <FaEye /> : <FaEyeSlash />}\n </EyeButton>\n )}\n </InputWrapper>\n )\n}\n\nexport default Input\n","import styled from 'styled-components'\nimport { mdScreen, smScreen, fontSizeToRem, type FontSize } from '@/types'\n\ntype LabelStyledProps = {\n $lgFontSize?: FontSize | undefined\n $mdFontSize?: FontSize | undefined\n $smFontSize?: FontSize | undefined\n}\n\nexport const LabelStyled = styled.label<LabelStyledProps>`\n font-size: ${(props) => fontSizeToRem(props.$lgFontSize || 16)};\n font-weight: 500;\n color: ${(props) => props.theme.primaryColor};\n margin-bottom: 4px;\n display: block;\n\n ${mdScreen} {\n font-size: ${(props) =>\n fontSizeToRem(props.$mdFontSize || props.$lgFontSize || 16)};\n }\n\n ${smScreen} {\n font-size: ${(props) =>\n fontSizeToRem(\n props.$smFontSize || props.$mdFontSize || props.$lgFontSize || 16\n )};\n }\n`\n","import React from 'react'\nimport type { FontSizeType } from '@/types'\nimport { LabelStyled } from './styles'\n\nexport type LabelType = {\n htmlFor: string\n children: React.ReactNode\n className?: string\n color?: 'primary' | 'secondary'\n} & FontSizeType\n\nconst Label = ({\n htmlFor,\n children,\n className,\n $lgFontSize,\n $mdFontSize,\n $smFontSize\n}: LabelType) => (\n <LabelStyled\n className={className}\n htmlFor={htmlFor}\n $lgFontSize={$lgFontSize}\n $mdFontSize={$mdFontSize}\n $smFontSize={$smFontSize}\n >\n {children}\n </LabelStyled>\n)\n\nexport default Label\n","import styled from 'styled-components'\nimport { fontSizeToRem, mdScreen, smScreen, type FontSize } from '@/types'\n\ntype LinkStyledProps = {\n $lgFontSize?: FontSize | undefined\n $mdFontSize?: FontSize | undefined\n $smFontSize?: FontSize | undefined\n $target?: '_blank' | '_self'\n color?: 'primary' | 'secondary'\n}\n\nexport const LinkStyled = styled.a<LinkStyledProps>`\n color: ${(props) =>\n props.color === 'primary'\n ? props.theme.primaryColor\n : props.color === 'secondary'\n ? props.theme.secondaryColor\n : props.theme.linkColor};\n text-decoration: none;\n font-size: ${(props) => fontSizeToRem(props.$lgFontSize || 16)};\n font-weight: normal;\n background-image: linear-gradient(currentColor, currentColor);\n background-position: 0 100%;\n background-size: 0% 2px;\n background-repeat: no-repeat;\n transition:\n background-size 0.2s,\n background-position 0s 0.2s;\n\n &:hover {\n background-position: 100% 100%;\n background-size: 100% 2px;\n }\n ${mdScreen} {\n font-size: ${(props) =>\n fontSizeToRem(props.$mdFontSize || props.$lgFontSize || 16)};\n }\n\n ${smScreen} {\n font-size: ${(props) =>\n fontSizeToRem(\n props.$smFontSize || props.$mdFontSize || props.$lgFontSize || 16\n )};\n }\n`\n","import type { FontSizeType } from '@/types'\nimport { LinkStyled } from './styles'\nimport { Link as RouterLink } from 'react-router-dom'\n\nexport type LinkType = {\n href?: string\n to?: string\n children: React.ReactNode\n className?: string\n $target?: '_blank' | '_self'\n $isInternal?: boolean\n} & FontSizeType\n\nconst Link = ({\n href,\n to,\n children,\n className,\n $target,\n $isInternal = false,\n $lgFontSize,\n $mdFontSize,\n $smFontSize\n}: LinkType) => {\n if ($isInternal && to) {\n return (\n <RouterLink to={to} style={{ textDecoration: 'none', color: 'inherit' }}>\n <LinkStyled\n className={className}\n $lgFontSize={$lgFontSize}\n $mdFontSize={$mdFontSize}\n $smFontSize={$smFontSize}\n >\n {children}\n </LinkStyled>\n </RouterLink>\n )\n }\n\n return (\n <LinkStyled\n className={className}\n href={href}\n target={$target}\n $lgFontSize={$lgFontSize}\n $mdFontSize={$mdFontSize}\n $smFontSize={$smFontSize}\n >\n {children}\n </LinkStyled>\n )\n}\n\nexport default Link\n","import styled from 'styled-components'\nimport type { WidthType } from '@/types'\nimport { mdScreen, smScreen } from '@/types'\n\nexport const LogoStyled = styled.div<WidthType>`\n width: ${(props) => props.$lgWidth || 100}%;\n & > img {\n width: 100%;\n height: auto;\n display: block;\n object-fit: contain;\n }\n\n ${mdScreen} {\n width: ${(props) => props.$mdWidth || props.$lgWidth || 100}%;\n }\n\n ${smScreen} {\n width: ${(props) =>\n props.$smWidth || props.$mdWidth || props.$lgWidth || 100}%;\n }\n`\n","import LogoLightDefault from '@/assets/logos/light-theme.svg'\nimport LogoDarkDefault from '@/assets/logos/dark-theme.svg'\nimport IconLightDefault from '@/assets/icon/icon-light-theme.svg'\nimport IconDarkDefault from '@/assets/icon/icon-dark-theme.svg'\n\nexport function getLogoLight(): string {\n return LogoLightDefault\n}\n\nexport function getLogoDark(): string {\n return LogoDarkDefault\n}\n\nexport function getIconLight(): string {\n return IconLightDefault\n}\n\nexport function getIconDark(): string {\n return IconDarkDefault\n}\n","import { LogoStyled } from './styles'\nimport type { WidthType } from '@/types'\nimport { useTheme } from 'styled-components'\nimport { getLogoLight, getLogoDark } from '@/utils/logoLoader'\n\ntype LogoProps = {\n className?: string\n logoLight?: string\n logoDark?: string\n} & WidthType\n\nconst Logo = ({\n className,\n $lgWidth,\n $mdWidth,\n $smWidth,\n logoLight,\n logoDark\n}: LogoProps) => {\n const theme = useTheme()\n const isDarkTheme = theme.isDark === true\n const src = isDarkTheme\n ? (logoDark ?? getLogoDark())\n : (logoLight ?? getLogoLight())\n\n return (\n <LogoStyled\n className={className}\n $lgWidth={$lgWidth}\n $mdWidth={$mdWidth}\n $smWidth={$smWidth}\n >\n <img src={src} alt=\"Logo\" />\n </LogoStyled>\n )\n}\n\nexport default Logo\n","import styled, { createGlobalStyle } from 'styled-components'\n\nconst GlobalStyle = createGlobalStyle`\n*{\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n list-style: none;\n font-family: \"Inter\", sans-serif;\n}\n\nbody{\n background-color: ${(props) => props.theme.bgColor};\n color: ${(props) => props.theme.primaryColor};\n\n`\nexport default GlobalStyle\n\nexport const MainContainer = styled.main`\n width: 100%;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n overflow-y: scroll;\n &::-webkit-scrollbar {\n display: none;\n }\n`\n","import styled, { css } from 'styled-components'\nimport { ButtonStyled } from '@/components/Button/styles'\nexport type ThemeButtonPosition =\n | 'top-right'\n | 'top-left'\n | 'bottom-right'\n | 'bottom-left'\ntype ButtonPosition = { $position?: ThemeButtonPosition }\nconst position = [\n {\n 'top-right': css`\n top: 1.25rem;\n right: 1.25rem;\n `\n },\n {\n 'top-left': css`\n top: 1.25rem;\n left: 1.25rem;\n `\n },\n {\n 'bottom-right': css`\n bottom: 1.25rem;\n right: 1.25rem;\n `\n },\n {\n 'bottom-left': css`\n bottom: 1.25rem;\n left: 1.25rem;\n `\n }\n]\nconst getPosition = (key: ThemeButtonPosition) =>\n (\n position.find((pos) => key in pos) as\n | Record<ThemeButtonPosition, ReturnType<typeof css>>\n | undefined\n )?.[key]\nexport const ThemeButton = styled(ButtonStyled)<ButtonPosition>`\n position: fixed;\n width: 3rem;\n height: 3rem;\n ${(props) => getPosition(props.$position ?? 'bottom-right')}\n z-index: 9999;\n border-radius: 50%;\n padding: 1%;\n display: flex;\n align-items: center;\n justify-content: center;\n & > img {\n width: 100%;\n height: 100%;\n }\n &:hover {\n background-color: ${(props) => props.theme.tertiaryColor};\n box-shadow: 0 0 10px 0 ${(props) => props.theme.primaryColor};\n }\n`\n","import { ThemeButton as ThemeButtonStyled } from './styles'\nimport { useTheme } from 'styled-components'\nimport { getIconDark, getIconLight } from '@/utils/logoLoader'\n\ntype ThemeButtonType = {\n className?: string\n onClick?: () => void\n position?: 'top-right' | 'top-left' | 'bottom-right' | 'bottom-left'\n iconLight?: string\n iconDark?: string\n}\nconst ThemeButton = ({\n className,\n onClick,\n position = 'bottom-right',\n iconLight,\n iconDark\n}: ThemeButtonType) => {\n const theme = useTheme()\n const isDarkTheme = theme.isDark === true\n const src = isDarkTheme\n ? (iconLight ?? getIconLight())\n : (iconDark ?? getIconDark())\n return (\n <ThemeButtonStyled\n className={className}\n onClick={onClick}\n $position={position}\n >\n <img src={src} alt=\"Theme Button\" />\n </ThemeButtonStyled>\n )\n}\n\nexport default ThemeButton\n","import type { DefaultTheme } from 'styled-components/'\n\nconst DarkTheme: DefaultTheme = {\n primaryColor: '#EBFFEB',\n secondaryColor: '#538A53',\n tertiaryColor: '#669966',\n bgColor: '#011F1F',\n linkColor: '#33CC66'\n}\n\nexport default DarkTheme\n","import type { DefaultTheme } from 'styled-components/'\n\nconst LightTheme: DefaultTheme = {\n primaryColor: '#011F1F',\n secondaryColor: '#33CC66',\n tertiaryColor: '#538A53',\n bgColor: '#EBFFEB',\n linkColor: '#006633'\n}\n\nexport default LightTheme\n","import type { DefaultTheme } from 'styled-components'\nimport DarkThemeDefault from '@/themes/dark'\nimport LightThemeDefault from '@/themes/light'\nimport path from 'path'\n\nfunction tryLoadUserThemeConfig(): {\n darkTheme: DefaultTheme | null\n lightTheme: DefaultTheme | null\n} | null {\n if (typeof window !== 'undefined') {\n return null\n }\n\n try {\n const userProjectRoot = process.cwd()\n const configPath = path.join(\n userProjectRoot,\n 'src',\n 'catastyle',\n 'catastyle.config.ts'\n )\n\n try {\n const resolvedPath = require.resolve(configPath)\n delete require.cache[resolvedPath]\n const config = require(configPath)\n return {\n darkTheme: config.darkTheme ?? null,\n lightTheme: config.lightTheme ?? null\n }\n } catch {\n return null\n }\n } catch {\n return null\n }\n}\n\nexport function getDarkTheme(): DefaultTheme {\n const userConfig = tryLoadUserThemeConfig()\n return userConfig?.darkTheme ?? DarkThemeDefault\n}\n\nexport function getLightTheme(): DefaultTheme {\n const userConfig = tryLoadUserThemeConfig()\n return userConfig?.lightTheme ?? LightThemeDefault\n}\n","import GlobalStyle, { MainContainer } from '@/styles/global'\nimport { ThemeProvider } from 'styled-components'\nimport type { DefaultTheme } from 'styled-components'\nimport { useState } from 'react'\nimport ThemeButton from '@/components/ThemeButton/ThemeButton'\nimport { getDarkTheme, getLightTheme } from '@/utils/themeLoader'\nimport type { ThemeButtonPosition } from '../ThemeButton/styles'\n\nexport type MainType = {\n children: React.ReactNode\n className?: string\n position?: ThemeButtonPosition\n darkTheme?: DefaultTheme | null\n lightTheme?: DefaultTheme | null\n iconLight?: string\n iconDark?: string\n}\nconst Main = ({\n children,\n className,\n position,\n darkTheme: darkThemeProp,\n lightTheme: lightThemeProp,\n iconLight,\n iconDark\n}: MainType) => {\n const [darkTheme, setDarkTheme] = useState(false)\n function toggleTheme() {\n setDarkTheme(!darkTheme)\n }\n const theme = darkTheme\n ? (darkThemeProp ?? getDarkTheme())\n : (lightThemeProp ?? getLightTheme())\n return (\n <ThemeProvider theme={{ ...theme, isDark: darkTheme }}>\n <GlobalStyle />\n <MainContainer className={className}>\n <ThemeButton\n onClick={toggleTheme}\n {...(position !== undefined && { position })}\n {...(iconLight !== undefined && { iconLight })}\n {...(iconDark !== undefined && { iconDark })}\n />\n {children}\n </MainContainer>\n </ThemeProvider>\n )\n}\n\nexport default Main\n","import styled from 'styled-components'\nimport { fontSizeToRem, mdScreen, smScreen, type FontSize } from '@/types'\n\ntype TitleStyledProps = {\n $lgFontSize?: FontSize | undefined\n $mdFontSize?: FontSize | undefined\n $smFontSize?: FontSize | undefined\n color: 'primary' | 'secondary'\n}\n\nexport const TitleStyled = styled.h1<TitleStyledProps>`\n font-size: ${(props) => fontSizeToRem(props.$lgFontSize || 32)};\n font-weight: 600;\n color: ${(props) =>\n props.color === 'primary'\n ? props.theme.primaryColor\n : props.theme.secondaryColor};\n\n ${mdScreen} {\n font-size: ${(props) =>\n fontSizeToRem(props.$mdFontSize || props.$lgFontSize || 32)};\n }\n\n ${smScreen} {\n font-size: ${(props) =>\n fontSizeToRem(\n props.$smFontSize || props.$mdFontSize || props.$lgFontSize || 32\n )};\n }\n`\n","import type { FontSizeType } from '@/types'\nimport { TitleStyled } from './styles'\n\nexport type TitleType = {\n children: string\n className?: string\n color: 'primary' | 'secondary'\n} & FontSizeType\n\nconst Title = ({\n children,\n className,\n color,\n $lgFontSize,\n $mdFontSize,\n $smFontSize\n}: TitleType) => (\n <TitleStyled\n className={className}\n color={color}\n $lgFontSize={$lgFontSize}\n $mdFontSize={$mdFontSize}\n $smFontSize={$smFontSize}\n >\n {children}\n </TitleStyled>\n)\n\nexport default Title\n"]}
|