@producteca/producteca-ui-kit 1.63.0-beta.1 → 1.63.0

package/dist/components/icons/index.d.js

@@ -8,4 +8,6 @@ export * from './customIcon/customIcon';
 export * from './emptyState/emptyStateIcon';
 export * from './errorState/errorStateIcon';
 export * from './checkIcon/checkIcon';
+export * from './successState/successStateIcon';
+export * from './newState/newStateIcon';
 export * from './maintenance/maintenanceIcon';

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

@@ -8,4 +8,6 @@ export * from './customIcon/customIcon';
 export * from './emptyState/emptyStateIcon';
 export * from './errorState/errorStateIcon';
 export * from './checkIcon/checkIcon';
+export * from './successState/successStateIcon';
+export * from './newState/newStateIcon';
 export * from './maintenance/maintenanceIcon';

package/dist/components/icons/newState/newStateIcon.d.js

@@ -0,0 +1 @@
+export {};

package/dist/components/icons/newState/newStateIcon.d.ts

@@ -0,0 +1,5 @@
+import { IconInterface } from '../parameters';
+
+export declare const NewStateIcon: ({ size, color, }: IconInterface) => import("react/jsx-runtime").JSX.Element;
+export type { IconInterface };
+export default NewStateIcon;

package/dist/components/icons/successState/successStateIcon.d.js

@@ -0,0 +1 @@
+export {};

package/dist/components/icons/successState/successStateIcon.d.ts

@@ -0,0 +1,5 @@
+import { IconInterface } from '../parameters';
+
+export declare const SuccessStateIcon: ({ size, color, }: IconInterface) => import("react/jsx-runtime").JSX.Element;
+export type { IconInterface };
+export default SuccessStateIcon;

package/dist/components/patterns/asyncContent/asyncContent.d.ts

@@ -1,6 +1,6 @@
 import { default as React } from 'react';
-import { AsyncContentProps, AsyncContentStatus } from './asyncContent.types';
+import { AsyncContentProps, AsyncContentStatus, AsyncContentErrorProps, AsyncContentEmptyProps, AsyncContentSuccessProps } from './asyncContent.types';
 
-export declare const AsyncContent: React.MemoExoticComponent<({ status, children, onErrorAction, onEmptyAction, emptyActionText, errorActionText, errorText, emptyText, }: AsyncContentProps) => import("react/jsx-runtime").JSX.Element>;
-export type { AsyncContentProps, AsyncContentStatus };
+export declare const AsyncContent: React.MemoExoticComponent<({ isLoading, error, empty, success, children, }: AsyncContentProps) => import("react/jsx-runtime").JSX.Element>;
+export type { AsyncContentProps, AsyncContentStatus, AsyncContentErrorProps, AsyncContentEmptyProps, AsyncContentSuccessProps, };
 export default AsyncContent;

package/dist/components/patterns/asyncContent/asyncContent.types.d.ts

@@ -1,13 +1,29 @@
 import { ReactNode } from 'react';
 
-export type AsyncContentStatus = 'loading' | 'error' | 'empty' | 'success';
+export type AsyncContentStatus = 'loading' | 'error' | 'empty' | 'creation' | 'success' | 'content';
+export interface AsyncContentErrorProps {
+    value: boolean;
+    text?: string;
+    actionText?: string;
+    onClick?: () => void;
+}
+export interface AsyncContentEmptyProps {
+    items: ReadonlyArray<unknown>;
+    creation?: boolean;
+    text?: string;
+    actionText?: string;
+    onClick?: () => void;
+}
+export interface AsyncContentSuccessProps {
+    value: boolean;
+    text?: string;
+    actionText?: string;
+    onClick?: () => void;
+}
 export interface AsyncContentProps {
     children: ReactNode;
-    errorText?: string;
-    emptyText?: string;
-    errorActionText?: string;
-    emptyActionText?: string;
-    status: AsyncContentStatus;
-    onErrorAction?: () => void;
-    onEmptyAction?: () => void;
+    isLoading?: boolean;
+    error?: AsyncContentErrorProps;
+    empty?: AsyncContentEmptyProps;
+    success?: AsyncContentSuccessProps;
 }

package/dist/components/patterns/asyncContent/views/emptyView.d.ts

@@ -1,9 +1,9 @@
 import { default as React } from 'react';
 
 interface EmptyViewProps {
-    emptyText?: string;
-    emptyActionText?: string;
-    onEmptyAction?: () => void;
+    text?: string;
+    actionText?: string;
+    onClick?: () => void;
 }
-export declare const EmptyView: React.MemoExoticComponent<({ emptyText, emptyActionText, onEmptyAction, }: EmptyViewProps) => import("react/jsx-runtime").JSX.Element>;
+export declare const EmptyView: React.MemoExoticComponent<({ text, actionText, onClick, }: EmptyViewProps) => import("react/jsx-runtime").JSX.Element>;
 export {};

package/dist/components/patterns/asyncContent/views/errorView.d.ts

@@ -1,9 +1,9 @@
 import { default as React } from 'react';
 
 interface ErrorViewProps {
-    errorText?: string;
-    errorActionText?: string;
-    onErrorAction?: () => void;
+    text?: string;
+    actionText?: string;
+    onClick?: () => void;
 }
-export declare const ErrorView: React.MemoExoticComponent<({ errorText, errorActionText, onErrorAction, }: ErrorViewProps) => import("react/jsx-runtime").JSX.Element>;
+export declare const ErrorView: React.MemoExoticComponent<({ text, actionText, onClick, }: ErrorViewProps) => import("react/jsx-runtime").JSX.Element>;
 export {};

package/dist/components/patterns/asyncContent/views/index.d.js

@@ -1,3 +1,5 @@
 export * from './loadingView';
 export * from './errorView';
-export * from './emptyView';
+export * from './emptyView';
+export * from './newView';
+export * from './successView';

package/dist/components/patterns/asyncContent/views/index.d.ts

@@ -1,3 +1,5 @@
 export * from './loadingView';
 export * from './errorView';
 export * from './emptyView';
+export * from './newView';
+export * from './successView';

package/dist/components/patterns/asyncContent/views/newView.d.js

@@ -0,0 +1 @@
+export {};

package/dist/components/patterns/asyncContent/views/newView.d.ts

@@ -0,0 +1,9 @@
+import { default as React } from 'react';
+
+interface NewViewProps {
+    text?: string;
+    actionText?: string;
+    onClick?: () => void;
+}
+export declare const NewView: React.MemoExoticComponent<({ text, actionText, onClick, }: NewViewProps) => import("react/jsx-runtime").JSX.Element>;
+export {};

package/dist/components/patterns/asyncContent/views/successView.d.js

@@ -0,0 +1 @@
+export {};

package/dist/components/patterns/asyncContent/views/successView.d.ts

@@ -0,0 +1,9 @@
+import { default as React } from 'react';
+
+interface SuccessViewProps {
+    text?: string;
+    actionText?: string;
+    onClick?: () => void;
+}
+export declare const SuccessView: React.MemoExoticComponent<({ text, actionText, onClick, }: SuccessViewProps) => import("react/jsx-runtime").JSX.Element>;
+export {};

package/dist/locales/description.d.ts

@@ -40,7 +40,7 @@ export declare const iconWithIdentifierExample = "\n## Uso del componente\n\nEl
 export declare const linkWithIconExample = "\n## Uso del componente\n\nEl componente `LinkWithIcon` muestra un enlace con un \u00EDcono a la izquierda.\n\n### Ejemplo b\u00E1sico:\n\n```tsx\n<LinkWithIcon\n  text=\"Historial de cambios\"\n  icon={<CustomIcon><History /></CustomIcon>}\n  onClick={() => navigate('/history')}\n/>\n```\n";
 export declare const conditionalOperatorExample = "\n## Uso del componente\n\nEl componente `ConditionalOperator` permite elegir entre operador l\u00F3gico \"Y\" u \"O\" para filtrar o combinar condiciones.\n\n### Ejemplo b\u00E1sico:\n\n```tsx\n<ConditionalOperator\n  value=\"or\"\n  options={[{ value: 'and', label: 'Y' }, { value: 'or', label: 'O' }]}\n  onChange={(event) => setOperator(event.target.value)}\n/>\n```\n";
 export declare const emptyStateExample = "\n## Uso del componente\n\nEl componente `EmptyState` muestra un estado vac\u00EDo con mensaje, \u00EDcono opcional y acci\u00F3n (por ejemplo \"Agregar\").\n\n### Ejemplo b\u00E1sico:\n\n```tsx\n<EmptyState\n  message=\"No hay resultados\"\n  actionLabel=\"Agregar\"\n  onAction={() => openCreate()}\n/>\n```\n";
-export declare const asyncContentExample = "\n## Uso del componente\n\nEl componente `AsyncContent` maneja los estados de una operaci\u00F3n as\u00EDncrona: `loading`, `error`, `empty` y `success`. Muestra el contenido solo en `success`.\n\n### Ejemplo b\u00E1sico:\n\n```tsx\n<AsyncContent\n  status={status}\n  errorText=\"Ocurri\u00F3 un error\"\n  emptyText=\"No hay datos\"\n  onRetry={() => refetch()}\n>\n  <div>Contenido cuando status === 'success'</div>\n</AsyncContent>\n```\n";
+export declare const asyncContentExample = "\n## Uso del componente\n\nEl componente `AsyncContent` maneja los estados de una operaci\u00F3n as\u00EDncrona deriv\u00E1ndolos de las props `isLoading`, `error` y `empty`. La prioridad es: `isLoading` \u2192 `error.value` \u2192 `empty.items` vac\u00EDo \u2192 `success`. Muestra el contenido solo en `success`.\n\n### Ejemplo b\u00E1sico:\n\n```tsx\n<AsyncContent\n  isLoading={isLoading}\n  error={{\n    value: hasError,\n    text: 'Ocurri\u00F3 un error',\n    actionText: 'Reintentar',\n    onClick: () => refetch(),\n  }}\n  empty={{\n    items,\n    text: 'No hay datos',\n  }}\n>\n  <div>Contenido cuando hay datos disponibles</div>\n</AsyncContent>\n```\n";
 export declare const tooltipExample = "\n## Uso del componente\n\nLos componentes de tooltip (`WithTooltip`, `WithOverflowTooltip`) muestran un mensaje al hacer hover o click. `WithOverflowTooltip` solo muestra el tooltip cuando el contenido se desborda.\n\n### Ejemplo b\u00E1sico:\n\n```tsx\n<WithTooltip content=\"Texto del tooltip\" placement=\"top\">\n  <span>Hover sobre m\u00ED</span>\n</WithTooltip>\n```\n\n### Solo si hay overflow:\n\n```tsx\n<WithOverflowTooltip maxWidth=\"200px\">\n  <span>Texto que puede truncarse...</span>\n</WithOverflowTooltip>\n```\n";
 export declare const tableHeaderExample = "\n## Uso del componente\n\n`Table.Header` renderiza el encabezado de la tabla. Lee las columnas del contexto provisto por `Table`. Opcionalmente acepta `columns` como prop para sobrescribir el contexto.\n\n### Usando el contexto de Table (recomendado):\n\n```tsx\nconst columns: TableColumn<MyRow>[] = [\n  { key: 'name', header: 'Nombre' },\n  { key: 'status', header: 'Estado', sx: { textAlign: 'center' } },\n  { key: 'price', header: 'Precio', sx: { textAlign: 'right', width: 100 } },\n]\n\n<Table columns={columns}>\n  <Table.Header />\n</Table>\n```\n\n### Pasando columns directamente como prop:\n\n```tsx\n<Table columns={columns}>\n  <Table.Header columns={customColumns} />\n</Table>\n```\n";
 export declare const tableBodyExample = "\n## Uso del componente\n\n`Table.Body` renderiza las filas de datos. Lee las columnas del contexto provisto por `Table`. Cuando `data` est\u00E1 vac\u00EDo muestra un `EmptyState` con `emptyMessage`.\n\n### Ejemplo b\u00E1sico:\n\n```tsx\n<Table columns={columns}>\n  <Table.Body data={rows} />\n</Table>\n```\n\n### Estado vac\u00EDo personalizado:\n\n```tsx\n<Table columns={columns}>\n  <Table.Body\n    data={[]}\n    emptyMessage=\"No encontramos resultados para tu b\u00FAsqueda\"\n  />\n</Table>\n```\n";

package/dist/locales/es.d.ts

@@ -476,12 +476,16 @@ declare const _default: {
         contentLoadedTitle: string;
         contentLoadedDescription: string;
         componentDescription: string;
-        statusDescription: string;
-        errorTextDescription: string;
-        emptyTextDescription: string;
-        errorActionTextDescription: string;
-        emptyActionTextDescription: string;
+        isLoadingDescription: string;
+        errorDescription: string;
+        emptyDescription: string;
+        successDescription: string;
+        successCompleted: string;
+        successAction: string;
+        operationSucceeded: string;
         interactiveFlowDescription: string;
+        createFirstItem: string;
+        createAction: string;
     };
     conditionalOperator: {
         or: string;