@sinco/react 1.0.8-rc.8 → 1.0.9-rc.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.
Files changed (15) hide show
  1. package/index.js +12747 -4306
  2. package/package.json +1 -1
  3. package/src/index.d.ts +3 -3
  4. package/src/lib/Components/Drawer.d.ts +11 -0
  5. package/src/lib/Components/EmptyState.d.ts +15 -0
  6. package/src/lib/Components/index.d.ts +2 -0
  7. package/src/lib/Hooks/index.d.ts +1 -0
  8. package/src/lib/Hooks/useDynamicColor.d.ts +3 -0
  9. package/src/lib/Theme/index.d.ts +14 -0
  10. package/src/lib/Theme/typography.d.ts +0 -14
  11. package/src/lib/Utils/dynamicColor.d.ts +7 -0
  12. package/src/lib/Utils/index.d.ts +1 -0
  13. package/README.md +0 -53
  14. package/src/lib/ToastNotification/ToastNofitication.d.ts +0 -4
  15. package/src/lib/ToastNotification/interfaces.d.ts +0 -18
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sinco/react",
3
- "version": "1.0.8-rc.8",
3
+ "version": "1.0.9-rc.0",
4
4
  "description": "package for the configuration of mui react sinco",
5
5
  "private": false,
6
6
  "license": "MIT",
package/src/index.d.ts CHANGED
@@ -1,4 +1,4 @@
1
1
  export * from './lib/Theme';
2
- export { default as ToastNotification } from './lib/ToastNotification/ToastNofitication';
3
- export * from './lib/ToastNotification/ToastNofitication';
4
- export * from './lib/ToastNotification/interfaces';
2
+ export * from './lib/Components';
3
+ export * from './lib/Hooks';
4
+ export * from './lib/Utils';
package/src/lib/Components/Drawer.d.ts ADDED
@@ -0,0 +1,11 @@
1
+ import React, { ReactNode } from "react";
2
+ export type Anchor = "left" | "right";
3
+ export interface DrawerComponentProps {
4
+ titulo: string;
5
+ children: ReactNode;
6
+ acciones: ReactNode;
7
+ open: boolean;
8
+ onClose: () => void;
9
+ anchor?: Anchor;
10
+ }
11
+ export declare const DrawerComponent: React.FC<DrawerComponentProps>;
package/src/lib/Components/EmptyState.d.ts ADDED
@@ -0,0 +1,15 @@
1
+ import { ReactNode } from 'react';
2
+ export interface EmptyStateProperties {
3
+ state?: States;
4
+ title?: string;
5
+ content?: string;
6
+ actions?: ReactNode;
7
+ }
8
+ export type States = 'create' | 'error' | 'noresult' | 'search';
9
+ export declare enum UrlImage {
10
+ error = "error",
11
+ search = "search",
12
+ noresult = "noresult",
13
+ create = "create"
14
+ }
15
+ export declare const EmptyState: ({ state, title, content, actions, }: EmptyStateProperties) => JSX.Element;
package/src/lib/Components/index.d.ts ADDED
@@ -0,0 +1,2 @@
1
+ export * from './EmptyState';
2
+ export * from './Drawer';
package/src/lib/Hooks/index.d.ts ADDED
@@ -0,0 +1 @@
1
+ export * from './useDynamicColor';
package/src/lib/Hooks/useDynamicColor.d.ts ADDED
@@ -0,0 +1,3 @@
1
+ export declare const useDynamicColor: (url: string) => {
2
+ loading: boolean;
3
+ };
package/src/lib/Theme/index.d.ts CHANGED
@@ -1 +1,15 @@
1
+ /// <reference types="react" />
2
+ declare module "@mui/material/styles" {
3
+ interface TypographyVariants {
4
+ body3: React.CSSProperties;
5
+ }
6
+ interface TypographyVariantsOptions {
7
+ body3?: React.CSSProperties;
8
+ }
9
+ }
10
+ declare module "@mui/material/Typography" {
11
+ interface TypographyPropsVariantOverrides {
12
+ body3: true;
13
+ }
14
+ }
1
15
  export declare const SincoTheme: import("@mui/material/styles").Theme;
package/src/lib/Theme/typography.d.ts CHANGED
@@ -1,17 +1,3 @@
1
- /// <reference types="react" />
2
1
  import { TypographyOptions } from '@mui/material/styles/createTypography';
3
- declare module '@mui/material/styles' {
4
- interface TypographyVariants {
5
- body3: React.CSSProperties;
6
- }
7
- interface TypographyVariantsOptions {
8
- body3?: React.CSSProperties;
9
- }
10
- }
11
- declare module '@mui/material/Typography' {
12
- interface TypographyPropsVariantOverrides {
13
- body3: true;
14
- }
15
- }
16
2
  declare const typography: TypographyOptions;
17
3
  export default typography;
package/src/lib/Utils/dynamicColor.d.ts ADDED
@@ -0,0 +1,7 @@
1
+ import { PaletteColor, TypeBackground } from "@mui/material";
2
+ declare const dynamicColor: (src: string) => Promise<{
3
+ primaryColor: PaletteColor;
4
+ secondaryColor: PaletteColor;
5
+ backgroundColor: TypeBackground;
6
+ }>;
7
+ export default dynamicColor;
package/src/lib/Utils/index.d.ts ADDED
@@ -0,0 +1 @@
1
+ export * from './dynamicColor';
package/README.md DELETED
@@ -1,53 +0,0 @@
1
- # @sinco/react
2
-
3
- Paquete de sinco react
4
-
5
- ## Cómo empezar
6
-
7
- npm i @sinco/react
8
-
9
- ## Pre-requisitos
10
-
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:
12
- https://mui.com/material-ui/getting-started/installation/
13
-
14
- ## Fuentes web de Google
15
-
16
- 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:
17
-
18
- ` <link
19
- rel="stylesheet"
20
- href="https://fonts.googleapis.com/css2?family=Nunito:wght@300;400;600;700&family=Roboto:wght@300;400;500;700&display=swap"
21
- />`
22
- <br/>
23
- Otra opción es instalar las fuentes Roboto y Nunito desde npm utilizando los paquetes 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';
28
- <br/>
29
- import '@fontsource/roboto/500.css';
30
- ## Nunito
31
- import '@fontsource/nunito/300.css';
32
- <br/>
33
- import '@fontsource/nunito/400.css';
34
- <br/>
35
- import '@fontsource/nunito/500.css';
36
- <br/>
37
- import '@fontsource/nunito/600.css';
38
-
39
- ## Icons
40
-
41
- Para usar el `Iconcomponent` de fuente, primero debe agregar la fuente [Material Icons](https://mui.com/material-ui/getting-started/installation/#icons).
42
-
43
- ## Como utilizar
44
-
45
- 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/#theme-provider)
46
-
47
- ## Más información
48
-
49
- Puedes encontrar más información sobre cómo utilizar React y Material-UI en la documentación oficial: -[React](https://reactnative.dev/) -[Material-UI](https://mui.com/material-ui/getting-started/)
50
-
51
- ## Recomendaciones
52
-
53
- 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 npm [@mui/x-data-grid.](https://www.npmjs.com/package/@mui/x-data-grid-pro)
package/src/lib/ToastNotification/ToastNofitication.d.ts DELETED
@@ -1,4 +0,0 @@
1
- /// <reference types="react" />
2
- import { Toast } from "./interfaces";
3
- declare const ToastNotification: (toast: Toast) => JSX.Element;
4
- export default ToastNotification;
package/src/lib/ToastNotification/interfaces.d.ts DELETED
@@ -1,18 +0,0 @@
1
- import { ReactElement } from "react";
2
- export interface Option {
3
- }
4
- export interface Toast {
5
- type?: string;
6
- subtitle?: string;
7
- time?: number | any;
8
- title?: string;
9
- dataOpt?: Option[];
10
- actions?: React.ReactNode;
11
- seeMore?: boolean;
12
- }
13
- export interface IconMap {
14
- [key: string]: ReactElement;
15
- }
16
- export interface ColorMap {
17
- [key: string]: "success" | "error" | "warning" | "info";
18
- }