@trii/components 2.0.102 → 2.0.104

package/dist/types/components/EditContactModal/context/EditContactApiContext.d.ts

@@ -70,6 +70,7 @@ export declare const EditContactApiProvider: import("react").Provider<{
     }) => Promise<{
         success: boolean;
         warnings: string[];
+        contactId?: string;
     }>;
     setContactAddress: ({ data, signal }: {
         signal?: AbortSignal;
@@ -170,6 +171,7 @@ export declare const useEditContactApi: () => {
     }) => Promise<{
         success: boolean;
         warnings: string[];
+        contactId?: string;
     }>;
     setContactAddress: ({ data, signal }: {
         signal?: AbortSignal;

package/dist/types/components/EditContactModal/services/api.d.ts

@@ -88,6 +88,7 @@ type CheckContactAddressData = {
 type ResultContactAddressCheck = {
     success: boolean;
     warnings: string[];
+    contactId?: string | null;
 };
 type DeleteContactAddressArgs = ApiArgs & {
     data: DeleteContactAddressData;

package/dist/types/components/EmptyState/EmptyState.d.ts

@@ -0,0 +1,22 @@
+import { ReactNode } from 'react';
+export interface EmptyStateProps {
+    /** Título principal (default: i18n `asyncState.emptyTitle`). */
+    title?: string;
+    /** Descripción secundaria (default: i18n `asyncState.emptyDescription`). */
+    description?: string;
+    /** Icono personalizado (default: `InboxIcon`). */
+    icon?: ReactNode;
+    /** Acción opcional bajo el texto (p.ej. botón "Crear el primero"). */
+    action?: ReactNode;
+    /** Versión compacta (menos padding e icono más chico). */
+    compact?: boolean;
+    /** Idioma de los textos por defecto ('es' | 'en'). Opcional: ver useComponentsTranslation. */
+    language?: string;
+}
+/**
+ * Estado "vacío real": la carga fue exitosa pero no hay datos que mostrar.
+ * No confundir con "aún no se cargó" (eso es loading) ni con un error.
+ * Presentacional y genérico (ver docs/ASYNC_STATE.md).
+ */
+declare const EmptyState: ({ title, description, icon, action, compact, language, }: EmptyStateProps) => import("react/jsx-runtime").JSX.Element;
+export default EmptyState;

package/dist/types/components/EmptyState/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './EmptyState';
+export type { EmptyStateProps } from './EmptyState';

package/dist/types/components/ErrorState/ErrorState.d.ts

@@ -0,0 +1,23 @@
+export interface ErrorStateProps {
+    /** Título principal (default: i18n `asyncState.errorTitle`). */
+    title?: string;
+    /** Descripción secundaria (default: i18n `asyncState.errorDescription`). */
+    description?: string;
+    /** Detalle técnico o mensaje del backend (se muestra atenuado). */
+    error?: string | null;
+    /** Si se provee, muestra el botón de reintento. */
+    onRetry?: () => void;
+    /** Texto del botón de reintento (default: i18n `asyncState.retry`). */
+    retryLabel?: string;
+    /** Versión compacta (menos padding e icono más chico) para paneles angostos. */
+    compact?: boolean;
+    /** Idioma de los textos por defecto ('es' | 'en'). Opcional: ver useComponentsTranslation. */
+    language?: string;
+}
+/**
+ * Estado de error a nivel panel, con retry opcional.
+ * Presentacional y genérico: no conoce Redux ni fetching
+ * (ver docs/ASYNC_STATE.md).
+ */
+declare const ErrorState: ({ title, description, error, onRetry, retryLabel, compact, language, }: ErrorStateProps) => import("react/jsx-runtime").JSX.Element;
+export default ErrorState;

package/dist/types/components/ErrorState/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './ErrorState';
+export type { ErrorStateProps } from './ErrorState';

package/dist/types/components/PanelErrorBoundary/PanelErrorBoundary.d.ts

@@ -0,0 +1,55 @@
+import { Component, ErrorInfo, ReactNode } from 'react';
+export interface PanelErrorBoundaryProps {
+    children: ReactNode;
+    /**
+     * Fallback custom ante un crash de render. Puede ser un nodo o una función
+     * que recibe el error y `resetErrorBoundary` (para reintentar).
+     */
+    fallback?: ReactNode | ((args: {
+        error: Error | null;
+        resetErrorBoundary: () => void;
+    }) => ReactNode);
+    /** Telemetría/logging del error (p.ej. enviar a un servicio externo). */
+    onError?: (error: Error, info: ErrorInfo) => void;
+    /**
+     * Claves que al cambiar resetean el boundary automáticamente
+     * (p.ej. el id de la ruta actual, para reintentar al navegar).
+     */
+    resetKeys?: ReadonlyArray<unknown>;
+    /** Overrides de textos del fallback por defecto. */
+    title?: string;
+    description?: string;
+    /** Idioma de los textos por defecto ('es' | 'en'). Opcional: ver useComponentsTranslation. */
+    language?: string;
+}
+interface PanelErrorBoundaryState {
+    hasError: boolean;
+    error: Error | null;
+}
+/**
+ * Aísla fallos de RENDER por panel: si el contenido explota, el resto de la
+ * UI (hermanos, otros paneles, la navegación) sigue funcionando y el panel
+ * muestra un fallback con reintento.
+ *
+ * ```tsx
+ * <PanelErrorBoundary resetKeys={[conversationId]}>
+ *   <ContactInfoPanel />
+ * </PanelErrorBoundary>
+ * <PanelErrorBoundary>
+ *   <MessagesPanel />
+ * </PanelErrorBoundary>
+ * ```
+ *
+ * NOTA: los boundaries NO capturan errores de fetching (para eso está
+ * `<AsyncContent>`), ni de event handlers, ni de código asíncrono.
+ * Guía completa: docs/ASYNC_STATE.md
+ */
+declare class PanelErrorBoundary extends Component<PanelErrorBoundaryProps, PanelErrorBoundaryState> {
+    state: PanelErrorBoundaryState;
+    static getDerivedStateFromError(error: Error): PanelErrorBoundaryState;
+    componentDidCatch(error: Error, info: ErrorInfo): void;
+    componentDidUpdate(prevProps: PanelErrorBoundaryProps): void;
+    reset: () => void;
+    render(): ReactNode;
+}
+export default PanelErrorBoundary;

package/dist/types/components/PanelErrorBoundary/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './PanelErrorBoundary';
+export type { PanelErrorBoundaryProps } from './PanelErrorBoundary';

package/dist/types/components/index.d.ts

@@ -4,5 +4,13 @@ export type { EditContactModalProps, EditContactMode } from './EditContactModal'
 export { default as EventsDialog } from './EventsDialog';
 export type { EventsDialogProps, EventData, TaskData } from './EventsDialog';
 export type { ModalMode, ItemType, Calendar, Contact, Notification } from './EventsDialog/types';
+export { default as AsyncContent } from './AsyncContent';
+export type { AsyncContentProps } from './AsyncContent';
+export { default as EmptyState } from './EmptyState';
+export type { EmptyStateProps } from './EmptyState';
+export { default as ErrorState } from './ErrorState';
+export type { ErrorStateProps } from './ErrorState';
+export { default as PanelErrorBoundary } from './PanelErrorBoundary';
+export type { PanelErrorBoundaryProps } from './PanelErrorBoundary';
 export { default as ContactSidebar } from './ContactSidebar';
 export type { ContactSidebarProps, SidebarChatIntegration, StartConversationTarget, } from './ContactSidebar';

package/dist/types/i18n/config.d.ts

@@ -1,2 +1,8 @@
 declare const i18nInstance: import("i18next").i18n;
+/**
+ * Normaliza lo que venga del anfitrión ('ES', 'En', 'es-AR', ...) a un idioma
+ * soportado por el paquete. El default es 'en' porque es el `fallbackLng` de
+ * esta instancia.
+ */
+export declare function normalizeLanguage(language?: string): 'en' | 'es';
 export default i18nInstance;

package/dist/types/i18n/useComponentsTranslation.d.ts

@@ -0,0 +1,17 @@
+import type { TFunction } from 'i18next';
+/**
+ * `t` atado a la instancia del paquete, SIN montar un `I18nextProvider`.
+ *
+ * Es la diferencia con el patrón de EditContactModal/ContactSidebar: esos
+ * componentes son un árbol cerrado y pueden pisar el context. Las primitivas
+ * de estado asíncrono (`AsyncContent`, `PanelErrorBoundary`) renderizan
+ * children DEL ANFITRIÓN; si montaran un provider, esos children resolverían
+ * sus claves contra la instancia del paquete y quedarían sin traducir.
+ * Pasando `{ i18n }` a `useTranslation`, solo los textos propios se atan.
+ *
+ * `language` es opcional: si el anfitrión ya sincroniza el idioma con
+ * `i18n.changeLanguage(...)` (exportado desde el índice del paquete), no hace
+ * falta pasarlo.
+ */
+export declare const useComponentsTranslation: (language?: string) => TFunction;
+export default useComponentsTranslation;

package/dist/types/index.d.ts

@@ -1,3 +1,4 @@
 export * from './components';
+export * from './asyncState';
 export { i18n } from './i18n';
 export * from './components/EventsDialog/theme';

package/package.json

@@ -1,159 +1,161 @@
-{
-  "name": "@trii/components",
-  "version": "2.0.102",
-  "description": "Trii components package",
-  "main": "dist/cjs/index.js",
-  "module": "dist/esm/index.js",
-  "types": "dist/index.d.ts",
-  "files": [
-    "dist"
-  ],
-  "scripts": {
-    "dev": "npm-run-all --parallel dev:types dev:js",
-    "dev:types": "tsc --watch",
-    "dev:js": "rollup -c --watch",
-    "build": "npm-run-all --serial build:types build:js",
-    "build:types": "tsc --project tsconfig.build.json --emitDeclarationOnly",
-    "build:js": "rollup -c",
-    "test": "jest --watchAll --verbose",
-    "storybook": "storybook dev -p 6006",
-    "build-storybook": "storybook build"
-  },
-  "author": "Ezequiel",
-  "license": "MIT",
-  "babel": {
-    "sourceType": "unambiguous",
-    "presets": [
-      [
-        "@babel/preset-env",
-        {
-          "targets": {
-            "chrome": 100,
-            "safari": 15,
-            "firefox": 91
-          }
-        }
-      ],
-      [
-        "@babel/preset-react",
-        {
-          "runtime": "automatic"
-        }
-      ],
-      "@babel/preset-typescript"
-    ]
-  },
-  "postcss": {
-    "plugins": {
-      "postcss-import": {}
-    }
-  },
-  "devDependencies": {
-    "@babel/core": "^7.23.0",
-    "@babel/preset-env": "^7.22.20",
-    "@babel/preset-react": "^7.22.15",
-    "@babel/preset-typescript": "^7.23.0",
-    "@emotion/react": "^11.11.4",
-    "@emotion/styled": "^11.11.5",
-    "@fontsource/material-icons": "^5.0.18",
-    "@fontsource/roboto": "^5.0.13",
-    "@mdi/js": "^7.4.47",
-    "@mdi/react": "^1.6.1",
-    "@mui/icons-material": "^5.15.15",
-    "@mui/lab": "^5.0.0-alpha.176",
-    "@mui/material": "^5.18.0",
-    "@reduxjs/toolkit": "^2.11.2",
-    "@rollup/plugin-commonjs": "^25.0.4",
-    "@rollup/plugin-image": "^3.0.3",
-    "@rollup/plugin-json": "^6.1.0",
-    "@rollup/plugin-node-resolve": "^15.2.1",
-    "@storybook/addon-essentials": "^8.5.3",
-    "@storybook/addon-interactions": "^8.5.3",
-    "@storybook/addon-links": "^8.5.3",
-    "@storybook/addon-onboarding": "^8.5.3",
-    "@storybook/addon-themes": "^8.5.3",
-    "@storybook/addon-webpack5-compiler-babel": "^3.0.5",
-    "@storybook/addon-webpack5-compiler-swc": "^2.0.0",
-    "@storybook/blocks": "^8.5.3",
-    "@storybook/react": "^8.5.3",
-    "@storybook/react-webpack5": "^8.5.3",
-    "@storybook/test": "^8.5.3",
-    "@testing-library/jest-dom": "^6.1.3",
-    "@testing-library/react": "^14.0.0",
-    "@types/google-libphonenumber": "^7.4.30",
-    "@types/google.maps": "^3.58.1",
-    "@types/jest": "^29.5.5",
-    "@types/react": "^18.2.23",
-    "@typescript-eslint/eslint-plugin": "^8.53.0",
-    "@typescript-eslint/parser": "^8.53.0",
-    "axios": "^1.14.0",
-    "babel-jest": "^29.7.0",
-    "date-fns": "^2.30.0",
-    "dompurify": "^2.5.8",
-    "esbuild": "^0.27.2",
-    "eslint": "^9.39.2",
-    "eslint-config-prettier": "^10.1.8",
-    "eslint-plugin-import": "^2.32.0",
-    "eslint-plugin-prettier": "^5.5.5",
-    "eslint-plugin-react": "^7.37.5",
-    "eslint-plugin-react-hooks": "^7.0.1",
-    "google-libphonenumber": "^3.2.44",
-    "handlebars": "^4.7.8",
-    "immer": "^11.1.4",
-    "jest": "^29.7.0",
-    "jest-environment-jsdom": "^29.7.0",
-    "markdown-it": "^14.1.0",
-    "markdown-it-emoji": "^3.0.0",
-    "npm-run-all": "^4.1.5",
-    "postcss": "^8.4.31",
-    "postcss-import": "^15.1.0",
-    "prettier": "^3.8.0",
-    "react": "^18.2.0",
-    "react-dom": "^18.2.0",
-    "react-file-icon": "^1.6.0",
-    "react-to-print": "^2.14.15",
-    "react-virtuoso": "^4.17.0",
-    "rollup": "^3.29.4",
-    "rollup-plugin-dts": "^6.0.2",
-    "rollup-plugin-esbuild": "^6.2.1",
-    "rollup-plugin-postcss": "^4.0.2",
-    "single-spa": "^5.9.3",
-    "single-spa-react": "^6.0.2",
-    "storybook": "^8.5.3",
-    "tslib": "^2.6.2",
-    "typescript": "^5.2.2",
-    "uuid": "^10.0.0",
-    "wavesurfer.js": "^6.6.3"
-  },
-  "peerDependencies": {
-    "@emotion/react": "^11.11.4",
-    "@mui/x-date-pickers": "^8.24.0",
-    "@mui/x-date-pickers-pro": "^8.24.0",
-    "@reduxjs/toolkit": ">=1.9.0",
-    "axios": ">=1.0.0",
-    "dayjs": "^1.11.19",
-    "google-libphonenumber": "^3.2.43",
-    "i18next": "^25.8.0",
-    "moment": "^2.30.1",
-    "react": ">=17.0.2 <19.0.0",
-    "react-dom": ">=17.0.2 <19.0.0",
-    "react-i18next": "^16.5.3",
-    "single-spa": "^5.9.3",
-    "single-spa-react": "^6.0.2"
-  },
-  "dependencies": {
-    "@mdi/js": "^7.4.47",
-    "@mdi/react": "^1.6.1",
-    "@trii/types": "^2.10.638",
-    "date-fns": "^2.30.0",
-    "dompurify": "^2.5.8",
-    "handlebars": "^4.7.8",
-    "markdown-it": "^14.1.0",
-    "markdown-it-emoji": "^3.0.0",
-    "react-file-icon": "^1.6.0",
-    "react-to-print": "^2.14.15",
-    "react-virtuoso": "^4.17.0",
-    "uuid": "^10.0.0",
-    "wavesurfer.js": "^6.6.3"
-  }
-}
+{
+  "name": "@trii/components",
+  "version": "2.0.104",
+  "description": "Trii components package",
+  "main": "dist/cjs/index.js",
+  "module": "dist/esm/index.js",
+  "types": "dist/index.d.ts",
+  "files": [
+    "dist",
+    "async-state"
+  ],
+  "scripts": {
+    "dev": "npm-run-all --parallel dev:types dev:js",
+    "dev:types": "tsc --watch",
+    "dev:js": "rollup -c --watch",
+    "build": "npm-run-all --serial build:types build:js",
+    "build:types": "tsc --project tsconfig.build.json --emitDeclarationOnly",
+    "build:js": "rollup -c",
+    "test": "jest",
+    "test:watch": "jest --watchAll --verbose",
+    "storybook": "storybook dev -p 6006",
+    "build-storybook": "storybook build"
+  },
+  "author": "Ezequiel",
+  "license": "MIT",
+  "babel": {
+    "sourceType": "unambiguous",
+    "presets": [
+      [
+        "@babel/preset-env",
+        {
+          "targets": {
+            "chrome": 100,
+            "safari": 15,
+            "firefox": 91
+          }
+        }
+      ],
+      [
+        "@babel/preset-react",
+        {
+          "runtime": "automatic"
+        }
+      ],
+      "@babel/preset-typescript"
+    ]
+  },
+  "postcss": {
+    "plugins": {
+      "postcss-import": {}
+    }
+  },
+  "devDependencies": {
+    "@babel/core": "^7.23.0",
+    "@babel/preset-env": "^7.22.20",
+    "@babel/preset-react": "^7.22.15",
+    "@babel/preset-typescript": "^7.23.0",
+    "@emotion/react": "^11.11.4",
+    "@emotion/styled": "^11.11.5",
+    "@fontsource/material-icons": "^5.0.18",
+    "@fontsource/roboto": "^5.0.13",
+    "@mdi/js": "^7.4.47",
+    "@mdi/react": "^1.6.1",
+    "@mui/icons-material": "^5.15.15",
+    "@mui/lab": "^5.0.0-alpha.176",
+    "@mui/material": "^5.18.0",
+    "@reduxjs/toolkit": "^2.11.2",
+    "@rollup/plugin-commonjs": "^25.0.4",
+    "@rollup/plugin-image": "^3.0.3",
+    "@rollup/plugin-json": "^6.1.0",
+    "@rollup/plugin-node-resolve": "^15.2.1",
+    "@storybook/addon-essentials": "^8.5.3",
+    "@storybook/addon-interactions": "^8.5.3",
+    "@storybook/addon-links": "^8.5.3",
+    "@storybook/addon-onboarding": "^8.5.3",
+    "@storybook/addon-themes": "^8.5.3",
+    "@storybook/addon-webpack5-compiler-babel": "^3.0.5",
+    "@storybook/addon-webpack5-compiler-swc": "^2.0.0",
+    "@storybook/blocks": "^8.5.3",
+    "@storybook/react": "^8.5.3",
+    "@storybook/react-webpack5": "^8.5.3",
+    "@storybook/test": "^8.5.3",
+    "@testing-library/jest-dom": "^6.1.3",
+    "@testing-library/react": "^14.0.0",
+    "@types/google-libphonenumber": "^7.4.30",
+    "@types/google.maps": "^3.58.1",
+    "@types/jest": "^29.5.5",
+    "@types/react": "^18.2.23",
+    "@typescript-eslint/eslint-plugin": "^8.53.0",
+    "@typescript-eslint/parser": "^8.53.0",
+    "axios": "^1.14.0",
+    "babel-jest": "^29.7.0",
+    "date-fns": "^2.30.0",
+    "dompurify": "^2.5.8",
+    "esbuild": "^0.27.2",
+    "eslint": "^9.39.2",
+    "eslint-config-prettier": "^10.1.8",
+    "eslint-plugin-import": "^2.32.0",
+    "eslint-plugin-prettier": "^5.5.5",
+    "eslint-plugin-react": "^7.37.5",
+    "eslint-plugin-react-hooks": "^7.0.1",
+    "google-libphonenumber": "^3.2.44",
+    "handlebars": "^4.7.8",
+    "immer": "^11.1.4",
+    "jest": "^29.7.0",
+    "jest-environment-jsdom": "^29.7.0",
+    "markdown-it": "^14.1.0",
+    "markdown-it-emoji": "^3.0.0",
+    "npm-run-all": "^4.1.5",
+    "postcss": "^8.4.31",
+    "postcss-import": "^15.1.0",
+    "prettier": "^3.8.0",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "react-file-icon": "^1.6.0",
+    "react-to-print": "^2.14.15",
+    "react-virtuoso": "^4.17.0",
+    "rollup": "^3.29.4",
+    "rollup-plugin-dts": "^6.0.2",
+    "rollup-plugin-esbuild": "^6.2.1",
+    "rollup-plugin-postcss": "^4.0.2",
+    "single-spa": "^5.9.3",
+    "single-spa-react": "^6.0.2",
+    "storybook": "^8.5.3",
+    "tslib": "^2.6.2",
+    "typescript": "^5.2.2",
+    "uuid": "^10.0.0",
+    "wavesurfer.js": "^6.6.3"
+  },
+  "peerDependencies": {
+    "@emotion/react": "^11.11.4",
+    "@mui/x-date-pickers": "^8.24.0",
+    "@mui/x-date-pickers-pro": "^8.24.0",
+    "@reduxjs/toolkit": ">=1.9.0",
+    "axios": ">=1.0.0",
+    "dayjs": "^1.11.19",
+    "google-libphonenumber": "^3.2.43",
+    "handlebars": "^4.7.8",
+    "i18next": "^25.8.0",
+    "moment": "^2.30.1",
+    "react": ">=17.0.2 <19.0.0",
+    "react-dom": ">=17.0.2 <19.0.0",
+    "react-i18next": "^16.5.3",
+    "single-spa": "^5.9.3",
+    "single-spa-react": "^6.0.2"
+  },
+  "dependencies": {
+    "@mdi/js": "^7.4.47",
+    "@mdi/react": "^1.6.1",
+    "@trii/types": "^2.10.638",
+    "date-fns": "^2.30.0",
+    "dompurify": "^2.5.8",
+    "markdown-it": "^14.1.0",
+    "markdown-it-emoji": "^3.0.0",
+    "react-file-icon": "^1.6.0",
+    "react-to-print": "^2.14.15",
+    "react-virtuoso": "^4.17.0",
+    "uuid": "^10.0.0",
+    "wavesurfer.js": "^6.6.3"
+  }
+}