@bit.rhplus/ui.grid 0.0.38 → 0.0.39

package/ColumnBuilder.jsx

@@ -875,7 +875,7 @@ class ColumnBuilder {
                 setCurrentMenuItems(updatedMenuItems);
               }
             } catch (error) {
-              console.error('Chyba při volání onBeforeShow:', error);
+              // Removed console.error for production
               if (isMountedRef.current) {
                 setCurrentMenuItems(menuItems);
               }

package/README-GridLayout.md

@@ -1,273 +1,271 @@
-# 🎛️ Grid Layout Management
-
-Automatické ukládání a načítání rozvržení sloupců gridu pomocí Grid API služby.
-
-## 📋 Funkcionality
-
-- ✅ **Automatické ukládání** rozložení sloupců (šířka, pořadí, viditelnost, připínání)
-- ✅ **Persistence** nastavení napříč relacemi uživatele
-- ✅ **Multi-aplikační podpora** s jasnou separací dat
-- ✅ **Debounced auto-save** pro předcházení častým API voláním
-- ✅ **Error handling** s fallback na default layout
-- ✅ **Manual controls** pro uložení, reset a reload
-
-## 🚀 Použití
-
-### Základní konfigurace
-
-```jsx
-import Grid from '@bit.rhplus/ui.grid';
-
-const MyGridComponent = () => {
-  const { accessToken } = useOidcAccessToken();
-  
-  return (
-    <Grid
-      // Standardní Grid props
-      columnDefs={columnDefs}
-      rowData={rowData}
-      
-      // Grid Layout props
-      layoutEnabled={true}                     // Zapnout layout management
-      gridName="invoices-master"               // Unikátní název gridu
-      applicationName="Portal.App"             // Název aplikace (default)
-      userKey={currentUser.id}                 // ID uživatele
-      filterName="default"                     // Volitelný název filtru
-      autoSave={true}                          // Automatické ukládání (default)
-      autoSaveDelay={2000}                     // Zpoždění auto-save v ms
-      accessToken={accessToken}                // Bearer token
-      
-      // Callback funkce
-      onLayoutLoaded={(fields, columnState) => {
-        console.log('Layout načten:', fields);
-      }}
-      onLayoutSaved={(fields, columnState) => {
-        console.log('Layout uložen:', fields);
-      }}
-      onLayoutError={(error, context) => {
-        console.error('Grid layout chyba:', error, context);
-      }}
-    />
-  );
-};
-```
-
-### Pokročilé použití s manuálními ovládacími prvky
-
-```jsx
-import Grid, { useGridLayout } from '@bit.rhplus/ui.grid';
-
-const AdvancedGridComponent = () => {
-  const { accessToken } = useOidcAccessToken();
-  const [gridApi, setGridApi] = useState(null);
-  
-  // Přímé použití useGridLayout hook
-  // POZOR: columnDefs musí být array! Pokud používáte ColumnBuilder, zavolejte .build()
-  const columnDefsArray = columnDefs.build ? columnDefs.build() : columnDefs;
-  
-  const gridLayout = useGridLayout({
-    userKey: currentUser.id,
-    applicationName: 'Portal.App',
-    gridName: 'advanced-grid',
-    enabled: true,
-    autoSave: false, // Manuální ukládání
-    columnDefs: columnDefsArray,
-    accessToken: accessToken
-  });
-  
-  const handleSaveLayout = async () => {
-    try {
-      await gridLayout.saveLayout();
-      notification.success('Layout uložen');
-    } catch (error) {
-      notification.error('Chyba při ukládání layoutu');
-    }
-  };
-  
-  const handleResetLayout = async () => {
-    try {
-      await gridLayout.resetToDefault();
-      notification.info('Layout resetován na výchozí');
-    } catch (error) {
-      notification.error('Chyba při resetování layoutu');
-    }
-  };
-  
-  return (
-    <div>
-      {/* Ovládací panel */}
-      <div style={{ marginBottom: 16 }}>
-        <Button 
-          onClick={handleSaveLayout}
-          loading={gridLayout.isSaving}
-          disabled={!gridLayout.hasUnsavedChanges}
-        >
-          Uložit layout
-        </Button>
-        <Button onClick={handleResetLayout}>
-          Resetovat layout
-        </Button>
-        {gridLayout.hasUnsavedChanges && (
-          <span style={{ color: 'orange', marginLeft: 8 }}>
-            Neuložené změny
-          </span>
-        )}
-      </div>
-      
-      {/* Grid s manuálním layoutem */}
-      <Grid
-        columnDefs={columnDefs}
-        rowData={rowData}
-        
-        layoutEnabled={true}
-        gridName="advanced-grid"
-        userKey={currentUser.id}
-        autoSave={false}
-        accessToken={accessToken}
-        
-        onGridReady={(params) => {
-          setGridApi(params.api);
-          gridLayout.onGridReady(params);
-        }}
-        onColumnMoved={gridLayout.onColumnMoved}
-        onColumnResized={gridLayout.onColumnResized}
-        onColumnVisible={gridLayout.onColumnVisible}
-        onColumnPinned={gridLayout.onColumnPinned}
-      />
-    </div>
-  );
-};
-```
-
-## ⚙️ Konfigurace Props
-
-| Prop | Type | Default | Popis |
-|------|------|---------|--------|
-| `layoutEnabled` | `boolean` | `false` | Zapnout/vypnout layout management |
-| `gridName` | `string` | **povinné** | Unikátní název gridu pro identifikaci |
-| `applicationName` | `string` | `'Portal.App'` | Název aplikace |
-| `userKey` | `string` | **povinné** | Identifikátor uživatele |
-| `filterName` | `string` | `null` | Volitelný název filtru pro více layoutů |
-| `autoSave` | `boolean` | `true` | Automatické ukládání při změnách |
-| `autoSaveDelay` | `number` | `2000` | Zpoždění auto-save v milisekundách |
-| `accessToken` | `string` | `null` | Bearer token pro API autorizaci |
-
-## 📞 Callback Props
-
-| Callback | Parametry | Popis |
-|----------|-----------|--------|
-| `onLayoutLoaded` | `(fields, columnState)` | Voláno při úspěšném načtení layoutu |
-| `onLayoutSaved` | `(fields, columnState)` | Voláno při úspěšném uložení layoutu |
-| `onLayoutError` | `(error, context)` | Voláno při chybě v layout managementu |
-
-## 🛠️ useGridLayout Hook API
-
-```jsx
-const {
-  // State
-  isLoading,           // boolean - načítání dat
-  isSaving,            // boolean - ukládání layoutu
-  error,               // Error | null - poslední chyba
-  hasUnsavedChanges,   // boolean - neuložené změny
-  isInitialized,       // boolean - layout byl inicializován
-  
-  // AG-Grid event handlers
-  onGridReady,         // function - AG-Grid onGridReady handler
-  onColumnMoved,       // function - AG-Grid onColumnMoved handler
-  onColumnResized,     // function - AG-Grid onColumnResized handler
-  onColumnVisible,     // function - AG-Grid onColumnVisible handler
-  onColumnPinned,      // function - AG-Grid onColumnPinned handler
-  
-  // Manual actions
-  saveLayout,          // function - manuální uložení
-  resetToDefault,      // function - reset na výchozí layout
-  reloadLayout,        // function - znovunačtení z API
-  
-  // Data
-  savedFields,         // Array - uložená pole z API
-  
-  // Utils
-  gridLayoutApi        // Object - Grid Layout API utils
-} = useGridLayout(config);
-```
-
-## 🌍 Grid Context
-
-Když je layout management zapnutý, Grid komponenta poskytuje context s layout informacemi:
-
-```jsx
-// V AG-Grid cell rendereru nebo custom komponentě
-const MyCustomRenderer = (params) => {
-  const { gridLayout } = params.context || {};
-  
-  if (gridLayout) {
-    const { isLoading, isSaving, hasUnsavedChanges, saveLayout } = gridLayout;
-    
-    return (
-      <div>
-        {isSaving && <Spin size="small" />}
-        {hasUnsavedChanges && <Badge status="warning" />}
-        <Button size="small" onClick={saveLayout}>Save</Button>
-      </div>
-    );
-  }
-  
-  return <span>{params.value}</span>;
-};
-```
-
-## 📊 Datový model
-
-### Grid API Field Structure
-```javascript
-{
-  name: "customerName",                    // Název pole
-  displayName: "Název zákazníka",         // Zobrazovaný název
-  dataType: "string",                     // Datový typ
-  isVisible: true,                        // Viditelnost sloupce
-  width: 150,                             // Šířka sloupce
-  order: 0,                               // Pořadí sloupce
-  isPinned: null,                         // Připínání ('left', 'right', null)
-  userField: {                            // Personalizované nastavení
-    isVisible: true,
-    width: 200,
-    order: 1,
-    isPinned: "left"
-  }
-}
-```
-
-## 🎯 Best Practices
-
-1. **Unikátní gridName**: Každý grid musí mít unikátní název v rámci aplikace
-2. **UserKey konzistence**: Používej konzistentní identifikátor uživatele
-3. **Error handling**: Vždy implementuj `onLayoutError` callback
-4. **AccessToken**: Poskytni access token pro autorizaci API volání
-5. **Debouncing**: Pro časté změny používej vyšší `autoSaveDelay`
-6. **Testing**: Testuj s různými kombinacemi column definitions
-
-## 🚨 Troubleshooting
-
-### Layout se nenačítá
-- Zkontroluj, že `layoutEnabled={true}`
-- Ověř, že `userKey`, `gridName` a `accessToken` jsou správně nastaveny
-- Zkontroluj network tab pro API chyby
-
-### Auto-save nefunguje
-- Ověř, že `autoSave={true}` (default)
-- Zkontroluj, že se spouští AG-Grid eventy (onColumnMoved, onColumnResized)
-- Zkontroluj console pro chyby
-
-### Performance problémy
-- Zvyš `autoSaveDelay` pro méně časté ukládání
-- Použij `autoSave={false}` pro manuální kontrolu
-- Implementuj vlastní debouncing v parent komponentě
-
-## 📝 Changelog
-
-### v1.0.0
-- ✅ Základní grid layout management
-- ✅ Auto-save funkcionalita
-- ✅ Integration s Grid API službou
-- ✅ Error handling a recovery
+# 🎛️ Grid Layout Management
+
+Automatické ukládání a načítání rozvržení sloupců gridu pomocí Grid API služby.
+
+## 📋 Funkcionality
+
+- ✅ **Automatické ukládání** rozložení sloupců (šířka, pořadí, viditelnost, připínání)
+- ✅ **Persistence** nastavení napříč relacemi uživatele
+- ✅ **Multi-aplikační podpora** s jasnou separací dat
+- ✅ **Debounced auto-save** pro předcházení častým API voláním
+- ✅ **Error handling** s fallback na default layout
+- ✅ **Manual controls** pro uložení, reset a reload
+
+## 🚀 Použití
+
+### Základní konfigurace
+
+```jsx
+import Grid from '@bit.rhplus/ui.grid';
+
+const MyGridComponent = () => {
+  const { accessToken } = useOidcAccessToken();
+  
+  return (
+    <Grid
+      // Standardní Grid props
+      columnDefs={columnDefs}
+      rowData={rowData}
+      
+      // Grid Layout props
+      layoutEnabled={true}                     // Zapnout layout management
+      gridName="invoices-master"               // Unikátní název gridu
+      applicationName="Portal.App"             // Název aplikace (default)
+      userKey={currentUser.id}                 // ID uživatele
+      filterName="default"                     // Volitelný název filtru
+      autoSave={true}                          // Automatické ukládání (default)
+      autoSaveDelay={2000}                     // Zpoždění auto-save v ms
+      accessToken={accessToken}                // Bearer token
+      
+      // Callback funkce
+      onLayoutLoaded={(fields, columnState) => {
+      }}
+      onLayoutSaved={(fields, columnState) => {
+      }}
+      onLayoutError={(error, context) => {
+        console.error('Grid layout chyba:', error, context);
+      }}
+    />
+  );
+};
+```
+
+### Pokročilé použití s manuálními ovládacími prvky
+
+```jsx
+import Grid, { useGridLayout } from '@bit.rhplus/ui.grid';
+
+const AdvancedGridComponent = () => {
+  const { accessToken } = useOidcAccessToken();
+  const [gridApi, setGridApi] = useState(null);
+  
+  // Přímé použití useGridLayout hook
+  // POZOR: columnDefs musí být array! Pokud používáte ColumnBuilder, zavolejte .build()
+  const columnDefsArray = columnDefs.build ? columnDefs.build() : columnDefs;
+  
+  const gridLayout = useGridLayout({
+    userKey: currentUser.id,
+    applicationName: 'Portal.App',
+    gridName: 'advanced-grid',
+    enabled: true,
+    autoSave: false, // Manuální ukládání
+    columnDefs: columnDefsArray,
+    accessToken: accessToken
+  });
+  
+  const handleSaveLayout = async () => {
+    try {
+      await gridLayout.saveLayout();
+      notification.success('Layout uložen');
+    } catch (error) {
+      notification.error('Chyba při ukládání layoutu');
+    }
+  };
+  
+  const handleResetLayout = async () => {
+    try {
+      await gridLayout.resetToDefault();
+      notification.info('Layout resetován na výchozí');
+    } catch (error) {
+      notification.error('Chyba při resetování layoutu');
+    }
+  };
+  
+  return (
+    <div>
+      {/* Ovládací panel */}
+      <div style={{ marginBottom: 16 }}>
+        <Button 
+          onClick={handleSaveLayout}
+          loading={gridLayout.isSaving}
+          disabled={!gridLayout.hasUnsavedChanges}
+        >
+          Uložit layout
+        </Button>
+        <Button onClick={handleResetLayout}>
+          Resetovat layout
+        </Button>
+        {gridLayout.hasUnsavedChanges && (
+          <span style={{ color: 'orange', marginLeft: 8 }}>
+            Neuložené změny
+          </span>
+        )}
+      </div>
+      
+      {/* Grid s manuálním layoutem */}
+      <Grid
+        columnDefs={columnDefs}
+        rowData={rowData}
+        
+        layoutEnabled={true}
+        gridName="advanced-grid"
+        userKey={currentUser.id}
+        autoSave={false}
+        accessToken={accessToken}
+        
+        onGridReady={(params) => {
+          setGridApi(params.api);
+          gridLayout.onGridReady(params);
+        }}
+        onColumnMoved={gridLayout.onColumnMoved}
+        onColumnResized={gridLayout.onColumnResized}
+        onColumnVisible={gridLayout.onColumnVisible}
+        onColumnPinned={gridLayout.onColumnPinned}
+      />
+    </div>
+  );
+};
+```
+
+## ⚙️ Konfigurace Props
+
+| Prop | Type | Default | Popis |
+|------|------|---------|--------|
+| `layoutEnabled` | `boolean` | `false` | Zapnout/vypnout layout management |
+| `gridName` | `string` | **povinné** | Unikátní název gridu pro identifikaci |
+| `applicationName` | `string` | `'Portal.App'` | Název aplikace |
+| `userKey` | `string` | **povinné** | Identifikátor uživatele |
+| `filterName` | `string` | `null` | Volitelný název filtru pro více layoutů |
+| `autoSave` | `boolean` | `true` | Automatické ukládání při změnách |
+| `autoSaveDelay` | `number` | `2000` | Zpoždění auto-save v milisekundách |
+| `accessToken` | `string` | `null` | Bearer token pro API autorizaci |
+
+## 📞 Callback Props
+
+| Callback | Parametry | Popis |
+|----------|-----------|--------|
+| `onLayoutLoaded` | `(fields, columnState)` | Voláno při úspěšném načtení layoutu |
+| `onLayoutSaved` | `(fields, columnState)` | Voláno při úspěšném uložení layoutu |
+| `onLayoutError` | `(error, context)` | Voláno při chybě v layout managementu |
+
+## 🛠️ useGridLayout Hook API
+
+```jsx
+const {
+  // State
+  isLoading,           // boolean - načítání dat
+  isSaving,            // boolean - ukládání layoutu
+  error,               // Error | null - poslední chyba
+  hasUnsavedChanges,   // boolean - neuložené změny
+  isInitialized,       // boolean - layout byl inicializován
+  
+  // AG-Grid event handlers
+  onGridReady,         // function - AG-Grid onGridReady handler
+  onColumnMoved,       // function - AG-Grid onColumnMoved handler
+  onColumnResized,     // function - AG-Grid onColumnResized handler
+  onColumnVisible,     // function - AG-Grid onColumnVisible handler
+  onColumnPinned,      // function - AG-Grid onColumnPinned handler
+  
+  // Manual actions
+  saveLayout,          // function - manuální uložení
+  resetToDefault,      // function - reset na výchozí layout
+  reloadLayout,        // function - znovunačtení z API
+  
+  // Data
+  savedFields,         // Array - uložená pole z API
+  
+  // Utils
+  gridLayoutApi        // Object - Grid Layout API utils
+} = useGridLayout(config);
+```
+
+## 🌍 Grid Context
+
+Když je layout management zapnutý, Grid komponenta poskytuje context s layout informacemi:
+
+```jsx
+// V AG-Grid cell rendereru nebo custom komponentě
+const MyCustomRenderer = (params) => {
+  const { gridLayout } = params.context || {};
+  
+  if (gridLayout) {
+    const { isLoading, isSaving, hasUnsavedChanges, saveLayout } = gridLayout;
+    
+    return (
+      <div>
+        {isSaving && <Spin size="small" />}
+        {hasUnsavedChanges && <Badge status="warning" />}
+        <Button size="small" onClick={saveLayout}>Save</Button>
+      </div>
+    );
+  }
+  
+  return <span>{params.value}</span>;
+};
+```
+
+## 📊 Datový model
+
+### Grid API Field Structure
+```javascript
+{
+  name: "customerName",                    // Název pole
+  displayName: "Název zákazníka",         // Zobrazovaný název
+  dataType: "string",                     // Datový typ
+  isVisible: true,                        // Viditelnost sloupce
+  width: 150,                             // Šířka sloupce
+  order: 0,                               // Pořadí sloupce
+  isPinned: null,                         // Připínání ('left', 'right', null)
+  userField: {                            // Personalizované nastavení
+    isVisible: true,
+    width: 200,
+    order: 1,
+    isPinned: "left"
+  }
+}
+```
+
+## 🎯 Best Practices
+
+1. **Unikátní gridName**: Každý grid musí mít unikátní název v rámci aplikace
+2. **UserKey konzistence**: Používej konzistentní identifikátor uživatele
+3. **Error handling**: Vždy implementuj `onLayoutError` callback
+4. **AccessToken**: Poskytni access token pro autorizaci API volání
+5. **Debouncing**: Pro časté změny používej vyšší `autoSaveDelay`
+6. **Testing**: Testuj s různými kombinacemi column definitions
+
+## 🚨 Troubleshooting
+
+### Layout se nenačítá
+- Zkontroluj, že `layoutEnabled={true}`
+- Ověř, že `userKey`, `gridName` a `accessToken` jsou správně nastaveny
+- Zkontroluj network tab pro API chyby
+
+### Auto-save nefunguje
+- Ověř, že `autoSave={true}` (default)
+- Zkontroluj, že se spouští AG-Grid eventy (onColumnMoved, onColumnResized)
+- Zkontroluj console pro chyby
+
+### Performance problémy
+- Zvyš `autoSaveDelay` pro méně časté ukládání
+- Použij `autoSave={false}` pro manuální kontrolu
+- Implementuj vlastní debouncing v parent komponentě
+
+## 📝 Changelog
+
+### v1.0.0
+- ✅ Základní grid layout management
+- ✅ Auto-save funkcionalita
+- ✅ Integration s Grid API službou
+- ✅ Error handling a recovery
 - ✅ Manual controls (save, reset, reload)

package/dist/ColumnBuilder.js

@@ -604,7 +604,7 @@ class ColumnBuilder {
                         }
                     }
                     catch (error) {
-                        console.error('Chyba při volání onBeforeShow:', error);
+                        // Removed console.error for production
                         if (isMountedRef.current) {
                             setCurrentMenuItems(menuItems);
                         }