@idealyst/datagrid 1.2.14 → 1.2.15

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@idealyst/datagrid",
-  "version": "1.2.14",
+  "version": "1.2.15",
   "description": "High-performance datagrid component for React and React Native",
   "documentation": "https://github.com/IdealystIO/idealyst-framework/tree/main/packages/datagrid#readme",
   "readme": "README.md",
@@ -36,8 +36,8 @@
     "publish:npm": "npm publish"
   },
   "peerDependencies": {
-    "@idealyst/components": "^1.2.14",
-    "@idealyst/theme": "^1.2.14",
+    "@idealyst/components": "^1.2.15",
+    "@idealyst/theme": "^1.2.15",
     "react": ">=16.8.0",
     "react-native": ">=0.60.0",
     "react-native-unistyles": "^3.0.4",
@@ -61,8 +61,8 @@
     }
   },
   "devDependencies": {
-    "@idealyst/components": "^1.2.14",
-    "@idealyst/theme": "^1.2.14",
+    "@idealyst/components": "^1.2.15",
+    "@idealyst/theme": "^1.2.15",
     "@types/react": "^19.1.0",
     "@types/react-window": "^1.8.8",
     "react": "^19.1.0",

package/src/DataGrid/DataGrid.styles.tsx

@@ -32,7 +32,8 @@ export type DataGridStylesheet = {
 /**
  * Generate DataGrid styles
  */
-export const dataGridStyles = StyleSheet.create((theme: Theme) => {
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+export const dataGridStyles = StyleSheet.create(((theme: Theme) => {
   return {
     container: {
       borderWidth: 1,
@@ -165,7 +166,7 @@ export const dataGridStyles = StyleSheet.create((theme: Theme) => {
       variants: {
         selected: {
           true: {
-            backgroundColor: theme.intents.primary.hover,
+            backgroundColor: theme.intents.primary.light,
           },
           false: {
             backgroundColor: theme.colors.surface.primary,
@@ -209,4 +210,4 @@ export const dataGridStyles = StyleSheet.create((theme: Theme) => {
       borderWidth: 0,
     },
   };
-});
+}) as any);

package/src/DataGrid/DataGrid.tsx

@@ -120,7 +120,7 @@ export function DataGrid<T extends Record<string, any>>({
 
   const renderHeader = () => (
     <TableRow style={{
-      ...dataGridStyles.headerRow({ stickyHeader }),
+      ...(dataGridStyles.headerRow as any)({ stickyHeader }),
       minHeight: headerHeight,
       ...headerStyle,
     }}>
@@ -140,7 +140,7 @@ export function DataGrid<T extends Record<string, any>>({
           ) : (
             <Text
               weight="bold"
-              style={dataGridStyles.headerText({ clickable: column.sortable || false })}
+              style={(dataGridStyles.headerText as any)({ clickable: column.sortable || false })}
             >
               {column.header}
               {column.sortable && (
@@ -174,7 +174,7 @@ export function DataGrid<T extends Record<string, any>>({
       <TableRow
         key={actualIndex}
         style={{
-          ...dataGridStyles.row({ selected: isSelected }),
+          ...(dataGridStyles.row as any)({ selected: isSelected }),
           minHeight: rowHeight,
           ...computedRowStyle,
         }}
@@ -236,7 +236,7 @@ export function DataGrid<T extends Record<string, any>>({
           <Table style={{ width: minTableWidth, minWidth: minTableWidth }}>
             {renderColGroup()}
             <TableHeader style={{
-              ...dataGridStyles.header({ stickyHeader: true }),
+              ...(dataGridStyles.header as any)({ stickyHeader: true }),
               position: 'sticky',
               top: 0,
               zIndex: 100,
@@ -298,7 +298,7 @@ export function DataGrid<T extends Record<string, any>>({
         <View style={{ minWidth: minTableWidth }}>
           <Table style={{ width: minTableWidth, ...(virtualized ? { height: totalHeight } : {}) }}>
             {renderColGroup()}
-            <TableHeader style={dataGridStyles.header({ stickyHeader: false })}>
+            <TableHeader style={(dataGridStyles.header as any)({ stickyHeader: false })}>
               {renderHeader()}
             </TableHeader>
             <TableBody>

package/src/primitives/Cell/Cell.web.tsx

@@ -11,7 +11,7 @@ export const Cell: React.FC<CellProps> = ({ children, style }) => {
   let resolvedStyle = {};
   if (typeof style === 'function') {
     try {
-      resolvedStyle = style(UnistylesRuntime.theme);
+      resolvedStyle = style((UnistylesRuntime as any).theme);
     } catch (error) {
       console.warn('Error resolving Cell style:', error);
       resolvedStyle = {};

package/src/primitives/Row/Row.web.tsx

@@ -12,7 +12,7 @@ export const Row: React.FC<RowProps> = ({ children, style, onPress }) => {
   let resolvedStyle = {};
   if (typeof style === 'function') {
     try {
-      resolvedStyle = style(UnistylesRuntime.theme);
+      resolvedStyle = style((UnistylesRuntime as any).theme);
     } catch (error) {
       console.warn('Error resolving Row style:', error);
       resolvedStyle = {};

package/src/primitives/ScrollView/ScrollView.web.tsx

@@ -10,6 +10,9 @@ interface ScrollViewProps {
   scrollEventThrottle?: number;
   showsHorizontalScrollIndicator?: boolean;
   showsVerticalScrollIndicator?: boolean;
+  // Native-only props (ignored on web)
+  bounces?: boolean;
+  directionalLockEnabled?: boolean;
 }
 
 export const ScrollView: React.FC<ScrollViewProps> = ({

package/src/primitives/Table/Table.web.tsx

@@ -10,7 +10,7 @@ export const Table: React.FC<TableProps> = ({ children, style }) => {
   let resolvedStyle = {};
   if (typeof style === 'function') {
     try {
-      resolvedStyle = style(UnistylesRuntime.theme);
+      resolvedStyle = style((UnistylesRuntime as any).theme);
     } catch (error) {
       resolvedStyle = {};
     }
@@ -43,7 +43,7 @@ export const TableRow: React.FC<TableRowProps> = ({ children, style, onPress })
   let resolvedStyle = {};
   if (typeof style === 'function') {
     try {
-      resolvedStyle = style(UnistylesRuntime.theme);
+      resolvedStyle = style((UnistylesRuntime as any).theme);
     } catch (error) {
       resolvedStyle = {};
     }

package/src/primitives/Table/TableBody.web.tsx

@@ -10,7 +10,7 @@ export const TableBody: React.FC<TableBodyProps> = ({ children, style }) => {
   let resolvedStyle = {};
   if (typeof style === 'function') {
     try {
-      resolvedStyle = style(UnistylesRuntime.theme);
+      resolvedStyle = style((UnistylesRuntime as any).theme);
     } catch (error) {
       resolvedStyle = {};
     }

package/src/primitives/Table/TableHeader.web.tsx

@@ -10,7 +10,7 @@ export const TableHeader: React.FC<TableHeaderProps> = ({ children, style }) =>
   let resolvedStyle = {};
   if (typeof style === 'function') {
     try {
-      resolvedStyle = style(UnistylesRuntime.theme);
+      resolvedStyle = style((UnistylesRuntime as any).theme);
     } catch (error) {
       resolvedStyle = {};
     }

package/src/primitives/VirtualizedList/VirtualizedList.web.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { VariableSizeList, FixedSizeList } from 'react-window';
+import { VariableSizeList, FixedSizeList, ListChildComponentProps } from 'react-window';
 
 interface VirtualizedListProps {
   data: any[];
@@ -21,26 +21,32 @@ export const VirtualizedList: React.FC<VirtualizedListProps> = ({
   onScroll,
 }) => {
   const isVariableSize = typeof itemHeight === 'function';
-  const List = isVariableSize ? VariableSizeList : FixedSizeList;
-  
-  const listProps = {
-    height: horizontal ? '100%' : height,
+
+  const Row = ({ index, style }: ListChildComponentProps) => (
+    <div style={{ ...style, display: 'table-row-group' }}>
+      {renderItem({ item: data[index], index })}
+    </div>
+  );
+
+  const commonProps = {
+    height: horizontal ? '100%' as const : height,
     width: horizontal ? height : width,
     itemCount: data.length,
-    itemSize: itemHeight,
-    layout: horizontal ? 'horizontal' : 'vertical',
+    layout: horizontal ? 'horizontal' as const : 'vertical' as const,
     onScroll,
   };
 
   return (
     <div style={{ display: 'table', width: '100%', tableLayout: 'fixed' }}>
-      <List {...listProps}>
-        {({ index, style }) => (
-          <div style={{ ...style, display: 'table-row-group' }}>
-            {renderItem({ item: data[index], index })}
-          </div>
-        )}
-      </List>
+      {isVariableSize ? (
+        <VariableSizeList {...commonProps} itemSize={itemHeight as (index: number) => number}>
+          {Row}
+        </VariableSizeList>
+      ) : (
+        <FixedSizeList {...commonProps} itemSize={itemHeight as number}>
+          {Row}
+        </FixedSizeList>
+      )}
     </div>
   );
 };