@wakastellar/ui 0.1.6 → 0.1.10

package/dist/blocks/index.d.ts

@@ -3,3 +3,6 @@ export { Headtab } from './headtab';
 export { LanguageSelector as BlockLanguageSelector } from './language-selector';
 export { Layout } from './layout';
 export { Login } from './login';
+export type { LoginConfig, LoginColorConfig, LoginThemeConfig, LoginAssetsConfig, LoginSignupOptions, LoginFormData } from './login';
+export { WakaSidebar, SidebarLayout, useSidebar } from './sidebar';
+export type { WakaSidebarProps, SidebarLayoutProps, SidebarMenuItem, SidebarUserConfig, SidebarLogoConfig, } from './sidebar';

package/dist/blocks/sidebar/index.d.ts

@@ -0,0 +1,149 @@
+import * as React from "react";
+export interface SidebarMenuItem {
+    /** Identifiant unique */
+    id: string;
+    /** Label du menu */
+    label: string;
+    /** Icône (composant React) */
+    icon?: React.ReactNode;
+    /** URL de navigation */
+    href?: string;
+    /** Callback au clic */
+    onClick?: () => void;
+    /** Sous-menus */
+    children?: SidebarMenuItem[];
+    /** Menu actif */
+    active?: boolean;
+    /** Badge/compteur */
+    badge?: string | number;
+    /** Désactivé */
+    disabled?: boolean;
+}
+export interface SidebarUserConfig {
+    /** Nom de l'utilisateur */
+    name: string;
+    /** Email ou sous-titre */
+    email?: string;
+    /** URL de l'avatar */
+    avatarUrl?: string;
+    /** Initiales pour le fallback */
+    initials?: string;
+    /** Actions du menu utilisateur */
+    actions?: {
+        id: string;
+        label: string;
+        icon?: React.ReactNode;
+        onClick?: () => void;
+        href?: string;
+        variant?: "default" | "destructive";
+    }[];
+}
+export interface SidebarLogoConfig {
+    /** Image du logo */
+    src?: string;
+    /** Texte alternatif */
+    alt?: string;
+    /** Texte à côté du logo */
+    title?: string;
+    /** URL au clic sur le logo */
+    href?: string;
+    /** Callback au clic */
+    onClick?: () => void;
+    /** Composant logo personnalisé */
+    component?: React.ReactNode;
+}
+export interface WakaSidebarProps {
+    /** Configuration du logo */
+    logo?: SidebarLogoConfig;
+    /** Éléments du menu */
+    menu: SidebarMenuItem[];
+    /** Configuration utilisateur */
+    user?: SidebarUserConfig;
+    /** Largeur de la sidebar (desktop) */
+    width?: number;
+    /** Breakpoint pour le mode mobile (en px) */
+    mobileBreakpoint?: number;
+    /** Sidebar ouverte (mode mobile) */
+    open?: boolean;
+    /** Callback changement d'état (mode mobile) */
+    onOpenChange?: (open: boolean) => void;
+    /** Classes CSS additionnelles */
+    className?: string;
+    /** Classes CSS du contenu */
+    contentClassName?: string;
+    /** Couleur de fond */
+    backgroundColor?: string;
+    /** Couleur du texte */
+    textColor?: string;
+    /** Couleur de l'élément actif */
+    activeColor?: string;
+    /** Couleur de survol */
+    hoverColor?: string;
+    /** Position du menu utilisateur */
+    userPosition?: "top" | "bottom";
+    /** Afficher le bouton hamburger */
+    showHamburger?: boolean;
+    /** Position du bouton hamburger (pour usage externe) */
+    hamburgerPosition?: "left" | "right";
+    /** Rendu personnalisé d'un item */
+    renderItem?: (item: SidebarMenuItem, isChild: boolean) => React.ReactNode;
+    /** Footer personnalisé */
+    footer?: React.ReactNode;
+    /** Header personnalisé (après le logo) */
+    header?: React.ReactNode;
+}
+/**
+ * WakaSidebar - Sidebar personnalisable avec menu hamburger responsive
+ *
+ * @example
+ * ```tsx
+ * <WakaSidebar
+ *   logo={{ src: "/logo.svg", title: "WAKASTART" }}
+ *   menu={[
+ *     { id: "dashboard", label: "Tableau de bord", icon: <Home /> },
+ *     {
+ *       id: "admin",
+ *       label: "Administration",
+ *       icon: <Settings />,
+ *       children: [
+ *         { id: "users", label: "Utilisateurs" },
+ *         { id: "roles", label: "Rôles" },
+ *       ],
+ *     },
+ *   ]}
+ *   user={{
+ *     name: "John Doe",
+ *     email: "john@example.com",
+ *     avatarUrl: "/avatar.jpg",
+ *   }}
+ * />
+ * ```
+ */
+export declare function WakaSidebar({ logo, menu, user, width, mobileBreakpoint, open, onOpenChange, className, contentClassName, backgroundColor, textColor, activeColor, hoverColor, userPosition, showHamburger, hamburgerPosition, renderItem, footer, header, }: WakaSidebarProps): import("react/jsx-runtime").JSX.Element;
+/**
+ * Hook pour gérer l'état de la sidebar externalement
+ */
+export declare function useSidebar(): {
+    isOpen: boolean;
+    setIsOpen: React.Dispatch<React.SetStateAction<boolean>>;
+    open: () => void;
+    close: () => void;
+    toggle: () => void;
+};
+export interface SidebarLayoutProps {
+    /** Configuration de la sidebar */
+    sidebar: WakaSidebarProps;
+    /** Contenu principal */
+    children: React.ReactNode;
+    /** Largeur de la sidebar (override) */
+    sidebarWidth?: number;
+    /** Classes CSS du conteneur */
+    className?: string;
+    /** Classes CSS du contenu principal */
+    contentClassName?: string;
+}
+/**
+ * Layout avec sidebar intégrée
+ */
+export declare function SidebarLayout({ sidebar, children, sidebarWidth, className, contentClassName, }: SidebarLayoutProps): import("react/jsx-runtime").JSX.Element;
+export default WakaSidebar;

package/dist/components/DataTable/DataTable.d.ts

@@ -14,4 +14,4 @@ import { DataTableProps } from './types';
  * />
  * ```
  */
-export declare function DataTable<TData>({ data, columns: initialColumns, layout: layoutProp, variant, density: densityProp, filters, filterPosition, toolbar, pagination: paginationConfig, selection, actions, i18nNamespace, loading, error, emptyState, headerSticky, columnVisibilityToggle, columnResize, enableExport, enableImport, enableReorder, enableContextMenu, onRowClick, onRowDoubleClick, onSortingChange, onFiltersChange, onSelectionChange, className, tableId, virtualization, edit, }: DataTableProps<TData>): import("react/jsx-runtime").JSX.Element;
+export declare function DataTable<TData extends Record<string, unknown>>({ data, columns: initialColumns, layout: layoutProp, variant, density: densityProp, filters, filterPosition, toolbar, pagination: paginationConfig, selection, actions, i18nNamespace, loading, error, emptyState, headerSticky, columnVisibilityToggle, columnResize, enableExport, enableImport, enableReorder, enableContextMenu, onRowClick, onRowDoubleClick, onSortingChange, onFiltersChange, onSelectionChange, className, tableId, virtualization, edit, }: DataTableProps<TData>): import("react/jsx-runtime").JSX.Element;

package/dist/components/DataTable/DataTableAdvanced.d.ts

@@ -24,4 +24,4 @@ import { DataTableProps } from './types';
  * />
  * ```
  */
-export declare function DataTableAdvanced<TData>({ data, columns: initialColumns, layout: layoutProp, variant, density: densityProp, filters, filterPosition, toolbar, pagination: paginationConfig, selection, actions, i18nNamespace, loading, error, emptyState, headerSticky, columnVisibilityToggle, columnResize, columnOrder: columnOrderConfig, grouping, rowExpansion, virtualization, sortMode, enableExport, enableImport, enableReorder, enableContextMenu, onRowClick, onRowDoubleClick, onSortingChange, onFiltersChange, onSelectionChange, onColumnOrderChange, onExpandedChange, onGroupingChange, className, tableId, edit, theme, performance, }: DataTableProps<TData>): import("react/jsx-runtime").JSX.Element;
+export declare function DataTableAdvanced<TData extends Record<string, unknown>>({ data, columns: initialColumns, layout: layoutProp, variant, density: densityProp, filters, filterPosition, toolbar, pagination: paginationConfig, selection, actions, i18nNamespace, loading, error, emptyState, headerSticky, columnVisibilityToggle, columnResize, columnOrder: columnOrderConfig, grouping, rowExpansion, virtualization, sortMode, enableExport, enableImport, enableReorder, enableContextMenu, onRowClick, onRowDoubleClick, onSortingChange, onFiltersChange, onSelectionChange, onColumnOrderChange, onExpandedChange, onGroupingChange, className, tableId, edit, theme, performance, }: DataTableProps<TData>): import("react/jsx-runtime").JSX.Element;

package/dist/components/DataTable/DataTableBody.d.ts

@@ -0,0 +1,68 @@
+import { Table, Row } from '@tanstack/react-table';
+import { ColumnEditConfig, EditableCellValue, RowExpansionConfig } from './types';
+/**
+ * Props pour le composant DataTableBody
+ */
+export interface DataTableBodyProps<TData extends Record<string, unknown>> {
+    /** Instance de la table TanStack */
+    table: Table<TData>;
+    /** Configuration d'expansion des lignes */
+    rowExpansion?: RowExpansionConfig<TData>;
+    /** Classes CSS pour la densité */
+    densityClasses?: {
+        header?: string;
+        table?: string;
+        cell?: string;
+    };
+    /** Callback de clic sur ligne */
+    onRowClick?: (row: TData) => void;
+    /** Callback de double-clic */
+    onRowDoubleClick?: (row: TData) => void;
+    /** ID de la ligne en cours d'édition */
+    editingRowId?: string | null;
+    /** Configuration d'édition des colonnes */
+    editableColumns?: ColumnEditConfig<TData>[];
+    /** Callback pour mettre à jour un champ */
+    onUpdateField?: (field: keyof TData, value: EditableCellValue) => void;
+    /** Callback pour démarrer l'édition */
+    onStartEdit?: (rowId: string, originalData: TData) => void;
+    /** Callback pour sauvegarder */
+    onSaveEdit?: () => void;
+    /** Callback pour annuler */
+    onCancelEdit?: () => void;
+}
+/**
+ * Composant Body réutilisable pour DataTable
+ *
+ * Gère :
+ * - Le rendu des lignes
+ * - L'expansion des lignes
+ * - Le groupement
+ * - L'édition inline
+ */
+export declare function DataTableBody<TData extends Record<string, unknown>>({ table, rowExpansion, densityClasses, onRowClick, onRowDoubleClick, editingRowId, editableColumns, onUpdateField, onStartEdit, onSaveEdit, onCancelEdit, }: DataTableBodyProps<TData>): import("react/jsx-runtime").JSX.Element;
+/**
+ * Props pour DataTableBodyRow
+ */
+interface DataTableBodyRowProps<TData extends Record<string, unknown>> {
+    row: Row<TData>;
+    rowExpansion?: RowExpansionConfig<TData>;
+    densityClasses: {
+        header?: string;
+        table?: string;
+        cell?: string;
+    };
+    onRowClick?: (row: TData) => void;
+    onRowDoubleClick?: (row: TData) => void;
+    editingRowId?: string | null;
+    editableColumns?: ColumnEditConfig<TData>[];
+    onUpdateField?: (field: keyof TData, value: EditableCellValue) => void;
+    onStartEdit?: (rowId: string, originalData: TData) => void;
+    onSaveEdit?: () => void;
+    onCancelEdit?: () => void;
+}
+/**
+ * Ligne individuelle du body
+ */
+declare function DataTableBodyRow<TData extends Record<string, unknown>>({ row, rowExpansion, densityClasses, onRowClick, onRowDoubleClick, editingRowId, editableColumns, onUpdateField, onStartEdit, onSaveEdit, onCancelEdit, }: DataTableBodyRowProps<TData>): import("react/jsx-runtime").JSX.Element;
+export { DataTableBodyRow };

package/dist/components/DataTable/DataTableCell.d.ts

@@ -0,0 +1,34 @@
+import { Cell, Row } from '@tanstack/react-table';
+import { ColumnEditConfig, EditableCellValue } from './types';
+/**
+ * Props pour le composant DataTableCell
+ */
+export interface DataTableCellProps<TData extends Record<string, unknown>> {
+    /** Cellule TanStack Table */
+    cell: Cell<TData, unknown>;
+    /** Ligne parente */
+    row: Row<TData>;
+    /** ID de la ligne en cours d'édition */
+    editingRowId?: string | null;
+    /** Configuration d'édition des colonnes */
+    editableColumns?: ColumnEditConfig<TData>[];
+    /** Callback pour mettre à jour un champ */
+    onUpdateField?: (field: keyof TData, value: EditableCellValue) => void;
+    /** Callback pour démarrer l'édition */
+    onStartEdit?: (rowId: string, originalData: TData) => void;
+    /** Callback pour sauvegarder */
+    onSaveEdit?: () => void;
+    /** Callback pour annuler */
+    onCancelEdit?: () => void;
+}
+/**
+ * Composant de cellule réutilisable pour DataTable
+ *
+ * Gère tous les types de cellules :
+ * - Cellules normales
+ * - Cellules éditables
+ * - Cellules groupées
+ * - Cellules agrégées
+ * - Cellules placeholder
+ */
+export declare function DataTableCell<TData extends Record<string, unknown>>({ cell, row, editingRowId, editableColumns, onUpdateField, onStartEdit, onSaveEdit, onCancelEdit, }: DataTableCellProps<TData>): import("react/jsx-runtime").JSX.Element | null;

package/dist/components/DataTable/DataTableConflictResolver.d.ts

@@ -0,0 +1,45 @@
+import { ConflictEntry } from './services/IndexedDBService';
+/**
+ * DataTableConflictResolver - Interface de résolution des conflits
+ */
+import * as React from "react";
+export interface DataTableConflictResolverProps<TData> {
+    /** Liste des conflits */
+    conflicts: ConflictEntry<TData>[];
+    /** Callback de résolution */
+    onResolve: (conflictId: string, resolution: "local" | "server" | "merge", mergedData?: Partial<TData>) => Promise<void>;
+    /** Ouvert */
+    open?: boolean;
+    /** Callback de fermeture */
+    onOpenChange?: (open: boolean) => void;
+    /** Afficher en mode sheet (sidebar) ou dialog */
+    mode?: "dialog" | "sheet";
+    /** Labels personnalisés */
+    labels?: {
+        title?: string;
+        description?: string;
+        localVersion?: string;
+        serverVersion?: string;
+        keepLocal?: string;
+        keepServer?: string;
+        merge?: string;
+        resolve?: string;
+        skip?: string;
+        noConflicts?: string;
+        conflictType?: Record<"create" | "update" | "delete", string>;
+    };
+    /** Fonction de rendu personnalisé pour les données */
+    renderData?: (data: Partial<TData> | null, type: "local" | "server") => React.ReactNode;
+    /** Clés à afficher dans la comparaison */
+    displayKeys?: (keyof TData)[];
+    /** Labels des clés */
+    keyLabels?: Record<string, string>;
+}
+/**
+ * Interface de résolution des conflits de synchronisation
+ */
+export declare function DataTableConflictResolver<TData extends Record<string, unknown>>({ conflicts, onResolve, open, onOpenChange, mode, labels: customLabels, renderData, displayKeys, keyLabels, }: DataTableConflictResolverProps<TData>): import("react/jsx-runtime").JSX.Element;
+export declare namespace DataTableConflictResolver {
+    var displayName: string;
+}
+export default DataTableConflictResolver;

package/dist/components/DataTable/DataTableFilterBuilder.d.ts

@@ -0,0 +1,14 @@
+import { FilterOperator, FilterableColumn, AdvancedFiltersState, AdvancedFiltersActions } from './types';
+interface DataTableFilterBuilderProps<TData> {
+    state: AdvancedFiltersState<TData>;
+    actions: AdvancedFiltersActions<TData>;
+    columns: FilterableColumn<TData>[];
+    getOperatorsForColumn: (column: keyof TData | string) => FilterOperator[];
+    className?: string;
+    maxNestingDepth?: number;
+}
+/**
+ * Composant de construction de filtres avancés
+ */
+export declare function DataTableFilterBuilder<TData>({ state, actions, columns, getOperatorsForColumn, className, maxNestingDepth, }: DataTableFilterBuilderProps<TData>): import("react/jsx-runtime").JSX.Element;
+export default DataTableFilterBuilder;

package/dist/components/DataTable/DataTableFilters.d.ts

@@ -1,10 +1,10 @@
-import { Table } from '@tanstack/react-table';
+import { Table, ColumnFiltersState } from '@tanstack/react-table';
 import { FilterConfig, FilterPosition } from './types';
 interface DataTableFiltersProps<TData> {
     table: Table<TData>;
-    filters?: FilterConfig[];
+    filters?: FilterConfig<TData>[];
     position?: FilterPosition;
-    onFiltersChange?: (filters: any[]) => void;
+    onFiltersChange?: (filters: ColumnFiltersState) => void;
 }
 /**
  * Composant de filtrage avancé pour DataTable

package/dist/components/DataTable/DataTableGroupRow.d.ts

@@ -0,0 +1,35 @@
+import { Row } from '@tanstack/react-table';
+import { EditConfig } from './types';
+import * as React from "react";
+interface DataTableGroupRowProps<TData> {
+    row: Row<TData>;
+    index: number;
+    columns: any[];
+    onRowClick?: (data: TData) => void;
+    onRowDoubleClick?: (data: TData) => void;
+    themeDensityClasses: {
+        cell: string;
+    };
+    editState?: {
+        editingRowId: string | null;
+        hasChanges: boolean;
+    };
+    editActions?: {
+        startEdit: (rowId: string, data: TData) => void;
+        saveEdit: () => void;
+        cancelEdit: () => void;
+        updateField: (field: keyof TData, value: any) => void;
+    };
+    edit?: EditConfig<TData>;
+    rowExpansion?: {
+        enabled?: boolean;
+        renderExpanded?: (row: TData) => React.ReactNode;
+    };
+}
+/**
+ * DataTableGroupRow - Composant pour le rendu d'une ligne groupée du DataTable
+ *
+ * Gère l'affichage des lignes groupées avec expansion et agrégation
+ */
+export declare function DataTableGroupRow<TData>({ row, index, columns, onRowClick, onRowDoubleClick, themeDensityClasses, editState, editActions, edit, rowExpansion, }: DataTableGroupRowProps<TData>): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/DataTable/DataTableHeader.d.ts

@@ -0,0 +1,48 @@
+import { Table, HeaderGroup } from '@tanstack/react-table';
+/**
+ * Props pour le composant DataTableHeader
+ */
+export interface DataTableHeaderProps<TData> {
+    /** Instance de la table TanStack */
+    table: Table<TData>;
+    /** Header sticky */
+    headerSticky?: boolean;
+    /** Classes CSS pour la densité */
+    densityClasses?: {
+        header?: string;
+        table?: string;
+        cell?: string;
+    };
+    /** Activer le redimensionnement des colonnes */
+    enableColumnResize?: boolean;
+    /** Mode de redimensionnement */
+    columnResizeMode?: "onChange" | "onEnd";
+}
+/**
+ * Composant Header réutilisable pour DataTable
+ *
+ * Gère :
+ * - Le tri des colonnes
+ * - Le redimensionnement
+ * - Le sticky header
+ */
+export declare function DataTableHeader<TData>({ table, headerSticky, densityClasses, enableColumnResize, columnResizeMode, }: DataTableHeaderProps<TData>): import("react/jsx-runtime").JSX.Element;
+/**
+ * Props pour DataTableHeaderRow
+ */
+interface DataTableHeaderRowProps<TData> {
+    headerGroup: HeaderGroup<TData>;
+    densityClasses: {
+        header?: string;
+        table?: string;
+        cell?: string;
+    };
+    enableColumnResize: boolean;
+    columnResizeMode: "onChange" | "onEnd";
+    table: Table<TData>;
+}
+/**
+ * Ligne d'en-tête individuelle
+ */
+declare function DataTableHeaderRow<TData>({ headerGroup, densityClasses, enableColumnResize, columnResizeMode, table, }: DataTableHeaderRowProps<TData>): import("react/jsx-runtime").JSX.Element;
+export { DataTableHeaderRow };

package/dist/components/DataTable/DataTableRow.d.ts

@@ -0,0 +1,28 @@
+import { Row } from '@tanstack/react-table';
+import { EditConfig } from './types';
+interface DataTableRowProps<TData> {
+    row: Row<TData>;
+    onRowClick?: (data: TData) => void;
+    onRowDoubleClick?: (data: TData) => void;
+    themeDensityClasses: {
+        cell: string;
+    };
+    editState?: {
+        editingRowId: string | null;
+        hasChanges: boolean;
+    };
+    editActions?: {
+        startEdit: (rowId: string, data: TData) => void;
+        saveEdit: () => void;
+        cancelEdit: () => void;
+        updateField: (field: keyof TData, value: any) => void;
+    };
+    edit?: EditConfig<TData>;
+}
+/**
+ * DataTableRow - Composant pour le rendu d'une ligne standard du DataTable
+ *
+ * Extrait de DataTableAdvanced pour réduire la complexité
+ */
+export declare function DataTableRow<TData>({ row, onRowClick, onRowDoubleClick, themeDensityClasses, editState, editActions, edit, }: DataTableRowProps<TData>): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/DataTable/DataTableSelection.d.ts

@@ -1,10 +1,22 @@
+import { Table } from '@tanstack/react-table';
 import * as React from "react";
+/**
+ * Type pour une action de sélection
+ */
+export interface SelectionAction<TData> {
+    id: string;
+    label: string;
+    icon?: React.ReactNode;
+    onClick: (selectedRows: TData[]) => void;
+    disabled?: boolean;
+    destructive?: boolean;
+}
 /**
  * Props pour la sélection avancée du DataTable
  */
 export interface DataTableSelectionProps<TData> {
     /** Table instance */
-    table: any;
+    table: Table<TData>;
     /** Mode de sélection */
     selectionMode?: "single" | "multiple" | "range";
     /** Données sélectionnées */
@@ -12,14 +24,7 @@ export interface DataTableSelectionProps<TData> {
     /** Callback de changement de sélection */
     onSelectionChange?: (selectedRows: TData[]) => void;
     /** Actions sur la sélection */
-    selectionActions?: Array<{
-        id: string;
-        label: string;
-        icon?: React.ReactNode;
-        onClick: (selectedRows: TData[]) => void;
-        disabled?: boolean;
-        destructive?: boolean;
-    }>;
+    selectionActions?: SelectionAction<TData>[];
     /** Classe CSS personnalisée */
     className?: string;
 }
@@ -31,7 +36,7 @@ export declare function DataTableSelection<TData>({ table, selectionMode, select
  * Hook pour la sélection avancée
  */
 export declare function useDataTableSelection<TData>({ table, selectionMode, onSelectionChange, }: {
-    table: any;
+    table: Table<TData>;
     selectionMode?: "single" | "multiple" | "range";
     onSelectionChange?: (selectedRows: TData[]) => void;
 }): {
@@ -41,6 +46,6 @@ export declare function useDataTableSelection<TData>({ table, selectionMode, onS
     selectRange: (start: number, end: number, selected?: boolean) => void;
     selectByCriteria: (criteria: (row: TData) => boolean) => void;
     clearSelection: () => void;
-    isAllSelected: any;
-    isSomeSelected: any;
+    isAllSelected: boolean;
+    isSomeSelected: boolean;
 };

package/dist/components/DataTable/DataTableSyncStatus.d.ts

@@ -0,0 +1,31 @@
+import { OfflineState } from './hooks/useDataTableOffline';
+export interface DataTableSyncStatusProps<TData> {
+    /** État offline */
+    state: OfflineState<TData>;
+    /** Callback de synchronisation */
+    onSync?: () => void;
+    /** Afficher les détails */
+    showDetails?: boolean;
+    /** Classes CSS additionnelles */
+    className?: string;
+    /** Variante d'affichage */
+    variant?: "default" | "compact" | "badge";
+    /** Labels personnalisés */
+    labels?: {
+        online?: string;
+        offline?: string;
+        syncing?: string;
+        pending?: string;
+        conflicts?: string;
+        sync?: string;
+        lastSync?: string;
+    };
+}
+/**
+ * Indicateur de statut de synchronisation pour le mode offline
+ */
+export declare function DataTableSyncStatus<TData>({ state, onSync, showDetails, className, variant, labels: customLabels, }: DataTableSyncStatusProps<TData>): import("react/jsx-runtime").JSX.Element | null;
+export declare namespace DataTableSyncStatus {
+    var displayName: string;
+}
+export default DataTableSyncStatus;