@toolbox-web/grid 1.26.1 → 1.27.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@toolbox-web/grid",
-  "version": "1.26.1",
+  "version": "1.27.0",
   "description": "Zero-dependency, framework-agnostic data grid web component with virtualization, sorting, filtering, editing, and 20+ plugins. Works in vanilla JS, React, Vue, Angular, and any framework.",
   "type": "module",
   "main": "./index.js",

package/public.d.ts

@@ -72,8 +72,6 @@ export declare function createGrid<TRow = unknown>(config?: Partial<GridConfig<T
  * ```
  *
  * @param selector - CSS selector to find the grid element
- * @param parentOrAwait - Parent node to search within, or `true` to wait for upgrade
- * @param awaitUpgrade - When `true`, waits for the custom element to be defined before resolving
  * @returns The typed grid element (or null), either synchronously or as a Promise
  */
 export declare function queryGrid<TRow = unknown>(selector: string): DataGridElement<TRow> | null;
@@ -209,11 +207,11 @@ export declare const PluginEvents: {
 export type PluginEventName = (typeof PluginEvents)[keyof typeof PluginEvents];
 export type { 
 /** @deprecated Use CellActivateDetail instead */
-ActivateCellDetail, AggregatorRef, AnimationConfig, AnimationMode, AnimationStyle, BaseColumnConfig, CellActivateDetail, CellActivateTrigger, CellChangeDetail, CellClickDetail, CellRenderContext, ColumnConfig, ColumnConfigMap, ColumnEditorContext, ColumnEditorSpec, ColumnResizeDetail, ColumnSortState, ColumnState, ColumnType, ColumnViewRenderer, DataChangeDetail, DataGridCustomEvent, DataGridElement as DataGridElementInterface, DataGridEventMap, ExpandCollapseAnimation, ExternalMountEditorDetail, ExternalMountViewDetail, FeatureConfig, FitMode, FrameworkAdapter, GridColumnState, GridConfig, GridIcons, GridPlugin, HeaderCellContext, HeaderContentDefinition, HeaderLabelContext, HeaderLabelRenderer, HeaderRenderer, IconValue, InferredColumnResult, LoadingContext, LoadingRenderer, LoadingSize, PrimitiveColumnType, PublicGrid, RowAnimationType, RowClickDetail, RowGroupRenderConfig, RowUpdate, ScrollToRowOptions, ShellConfig, ShellHeaderConfig, SortChangeDetail, SortHandler, SortState, ToolbarContentDefinition, ToolPanelConfig, ToolPanelDefinition, TypeDefault, UpdateSource } from './lib/core/types';
+ActivateCellDetail, AggregatorRef, AnimationConfig, AnimationMode, AnimationStyle, BaseColumnConfig, CellActivateDetail, CellActivateTrigger, CellChangeDetail, CellClickDetail, CellRenderContext, ColumnConfig, ColumnConfigMap, ColumnEditorContext, ColumnEditorSpec, ColumnResizeDetail, ColumnSortState, ColumnState, ColumnType, ColumnViewRenderer, DataChangeDetail, DataGridCustomEvent, DataGridElement as DataGridElementInterface, DataGridEventMap, ExpandCollapseAnimation, ExternalMountEditorDetail, ExternalMountViewDetail, FeatureConfig, FitMode, FrameworkAdapter, GridColumnState, GridConfig, GridIcons, GridPlugin, HeaderCellContext, HeaderContentDefinition, HeaderLabelContext, HeaderLabelRenderer, HeaderRenderer, IconValue, InferredColumnResult, LoadingContext, LoadingRenderer, LoadingSize, PrimitiveColumnType, PublicGrid, RowAnimationType, RowClickDetail, RowGroupRenderConfig, RowTransaction, RowUpdate, ScrollToRowOptions, ShellConfig, ShellHeaderConfig, SortChangeDetail, SortHandler, SortState, ToolbarContentDefinition, ToolPanelConfig, ToolPanelDefinition, TransactionResult, TypeDefault, UpdateSource, } from './lib/core/types';
 export { DEFAULT_ANIMATION_CONFIG, DEFAULT_GRID_ICONS, FitModeEnum } from './lib/core/types';
 export { builtInSort, defaultComparator } from './lib/core/internal/sorting';
 export { BaseGridPlugin, PLUGIN_QUERIES } from './lib/core/plugin';
-export type { AfterCellRenderContext, AfterRowRenderContext, CellMouseEvent, EventDefinition, PluginDependency, PluginManifest, PluginQuery, QueryDefinition } from './lib/core/plugin';
+export type { AfterCellRenderContext, AfterRowRenderContext, CellMouseEvent, EventDefinition, PluginDependency, PluginManifest, PluginQuery, QueryDefinition, } from './lib/core/plugin';
 export { GridClasses, GridCSSVars, GridDataAttrs, GridSelectors } from './lib/core/constants';
 export type { GridClassName, GridCSSVar, GridDataAttr } from './lib/core/constants';
 /**

package/themes/dg-theme-material.css

@@ -17,10 +17,10 @@
     --tbw-color-border: light-dark(#e7e0ec, #49454f);
     --tbw-color-border-strong: light-dark(#79747e, #938f99);
     --tbw-color-border-cell: transparent;
-    --tbw-color-border-header: light-dark(#e7e0ec, #49454f);
+    --tbw-color-border-header: var(--tbw-color-border);
 
     /* Row divider - subtle horizontal line */
-    --tbw-row-divider: 1px solid light-dark(#e7e0ec, #49454f);
+    --tbw-row-divider: 1px solid var(--tbw-color-border);
 
     /* M3 Primary - Purple/Violet */
     --tbw-color-accent: light-dark(#6750a4, #d0bcff);
@@ -68,7 +68,7 @@
 
     /* ========== Focus & Selection ========== */
     --tbw-focus-outline: 2px solid var(--tbw-color-accent);
-    --tbw-focus-outline-offset: 2px;
+    --tbw-focus-outline-offset: -2px;
     --tbw-focus-background: rgba(from var(--tbw-color-accent) r g b / 12%);
 
     --tbw-range-border-color: var(--tbw-color-accent);
@@ -84,7 +84,7 @@
     --tbw-sort-indicator-active-color: var(--tbw-color-accent);
 
     /* ========== Borders ========== */
-    --tbw-border-header: 1px solid light-dark(#e7e0ec, #49454f);
+    --tbw-border-header: 1px solid var(--tbw-color-border);
     --tbw-border-input: 1px solid light-dark(#79747e, #938f99);
     --tbw-editing-border: 2px solid var(--tbw-color-accent);
 
@@ -114,6 +114,18 @@
       }
     }
 
+    .header-row .cell {
+      &::after {
+        content: '';
+        position: absolute;
+        top: 30%;
+        right: 0;
+        width: 1px;
+        height: 40%;
+        background: var(--tbw-color-border);
+      }
+    }
+
     /* Filter button — larger for M3, works with any icon type */
     .header-row .cell .tbw-filter-btn {
       font-size: var(--tbw-icon-size-sm);