@sinco/react 1.0.1 → 1.0.2-rc.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (10) hide show
  1. package/README.md +19 -32
  2. package/index.js +182 -3428
  3. package/package.json +1 -1
  4. package/src/lib/Theme/components.d.ts +2 -3
  5. package/src/lib/Theme/palette.d.ts +1 -2
  6. package/src/lib/Theme/shadows.d.ts +1 -2
  7. package/src/lib/Theme/typography.d.ts +1 -2
  8. package/src/lib/components/ToastNotification/interfaces.d.ts +13 -0
  9. package/src/lib/Theme/breackpoints.d.ts +0 -2
  10. package/src/lib/Theme/mixins.d.ts +0 -3
package/README.md CHANGED
@@ -1,52 +1,39 @@
1
1
  # @sinco/react
2
2
 
3
- Paquete de sinco react
3
+ Paquete de sinco react
4
4
 
5
5
  ## Cómo empezar
6
-
7
6
  npm i @sinco/react
8
7
 
9
8
  ## Pre-requisitos
10
9
 
11
- Asegúrate de tener instalado React en la versión 18. También, es necesario instalar Material-UI React. Puedes encontrar las instrucciones de instalación en el siguiente enlace: https://mui.com/material-ui/getting-started/installation/
10
+ React en la versión 18
11
+ Instalar mui react
12
+ https://mui.com/material-ui/getting-started/installation/
12
13
 
13
- ## Fuentes web de Google
14
14
 
15
- Puedes utilizar fuentes de Google Web Fonts en tu proyecto. Para hacerlo, agrega el siguiente fragmento de código dentro de la etiqueta `<head>` de tu proyecto:
15
+ ## Fuentes web de Google
16
+ Para instalar la fuente en su proyecto usando la CDN de Google Web Fonts, agregue el siguiente fragmento de código dentro de la <head />etiqueta de su proyecto:
16
17
 
17
- `<link
18
+ <link
18
19
  rel="stylesheet"
19
20
  href="https://fonts.googleapis.com/css2?family=Nunito:wght@300;400;600;700&family=Roboto:wght@300;400;500;700&display=swap"
20
- />`
21
- <br/>
22
- Otra opción es instalar las fuentes Roboto y Nunito desde npm utilizando los paquetes
23
- O ya sea instalando las fuentes [@fontsource/roboto](https://www.npmjs.com/package/@fontsource/roboto) y [@fontsource/nunito](https://www.npmjs.com/package/@fontsource/nunito) en su archivo `index.tsx`, los fontsource son que se necesitan son :
24
-
25
- ### Roboto
26
-
27
- import '@fontsource/roboto/400.css'; <br/>
28
- import '@fontsource/roboto/500.css';
29
-
30
- ### Nunito
31
-
32
- import '@fontsource/roboto/300.css'; <br/>
33
- import '@fontsource/roboto/400.css'; <br/>
34
- import '@fontsource/roboto/500.css'; <br/>
35
- import '@fontsource/roboto/600.css';
36
-
37
- Para usar el `Iconcomponent` de fuente, primero debe agregar la [fuente](https://mui.com/material-ui/getting-started/installation/#icons) Material Icons.
21
+ />
22
+ Para usar el Iconcomponent de fuente, primero debe agregar la fuente Material Icons .
23
+ <link
24
+ rel="stylesheet"
25
+ href="https://fonts.googleapis.com/icon?family=Material+Icons"
26
+ />
38
27
 
39
- ## Como utilizar
28
+ ## Como utilizar
29
+ Para poder utilizar el tema personalizado de sinco react, solo debes colocar la variable "SincoTheme" en el themeProvider
30
+ <ThemeProvider theme={SincoTheme}>
40
31
 
41
- Para utilizar el tema personalizado de sinco react, debes envolver tu aplicación con el componente `ThemeProvider` de Material-UI y proporcionar la variable `SincoTheme` como valor del prop `theme` en el [ThemeProvider](https://mui.com/material-ui/customization/theming/#themeprovider)
32
+ ## Más información
42
33
 
43
- ## Más información
34
+ Para tener más información de como utilizar react mui
44
35
 
45
- Puedes encontrar más información sobre cómo utilizar React y Material-UI en la documentación oficial:
36
+ https://mui.com/material-ui/getting-started/overview/
46
37
 
47
- - [React](https://es.react.dev/)
48
- - [Material-UI](https://mui.com/material-ui/getting-started/overview/)
49
38
 
50
- ## Recomendaciones
51
39
 
52
- Este paquete utiliza Data [Data grid pro](https://mui.com/x/react-data-grid/) para su tema personalizado. Si deseas utilizarlo, se recomienda instalar el paquete [@mui/x-data-grid](https://www.npmjs.com/package/@mui/x-data-grid).