@alaarab/ogrid-vue-vuetify 2.0.7 → 2.0.9

package/dist/esm/DataGridTable/DataGridTable.js

@@ -1,10 +1,9 @@
 import { defineComponent, computed, h, Teleport } from 'vue';
 import { VCheckbox, VProgressCircular, VBtn } from 'vuetify/components';
-import { useDataGridTableSetup, getHeaderFilterConfig, getCellRenderDescriptor, resolveCellDisplayContent, resolveCellStyle, buildInlineEditorProps, buildPopoverEditorProps, getCellInteractionProps, buildHeaderRows, CHECKBOX_COLUMN_WIDTH, ROW_NUMBER_COLUMN_WIDTH, DEFAULT_MIN_COLUMN_WIDTH, } from '@alaarab/ogrid-vue';
+import { useDataGridTableSetup, getHeaderFilterConfig, getCellRenderDescriptor, resolveCellDisplayContent, resolveCellStyle, buildInlineEditorProps, buildPopoverEditorProps, getCellInteractionProps, buildHeaderRows, CHECKBOX_COLUMN_WIDTH, ROW_NUMBER_COLUMN_WIDTH, DEFAULT_MIN_COLUMN_WIDTH, StatusBar, } from '@alaarab/ogrid-vue';
 import { ColumnHeaderFilter } from '../ColumnHeaderFilter';
 import { ColumnHeaderMenu } from '../ColumnHeaderMenu/ColumnHeaderMenu';
 import { InlineCellEditor } from './InlineCellEditor';
-import { StatusBar } from './StatusBar';
 import { GridContextMenu } from './GridContextMenu';
 const NOOP = () => { };
 export const DataGridTable = defineComponent({

package/dist/esm/index.js

@@ -7,3 +7,7 @@ export { ColumnHeaderFilter } from './ColumnHeaderFilter/ColumnHeaderFilter';
 export { ColumnChooser } from './ColumnChooser/ColumnChooser';
 export { PaginationControls } from './PaginationControls/PaginationControls';
 export { ColumnHeaderMenu } from './ColumnHeaderMenu/ColumnHeaderMenu';
+// Re-export shared components from base
+export { StatusBar, MarchingAntsOverlay } from '@alaarab/ogrid-vue';
+export { GridContextMenu } from './DataGridTable/GridContextMenu';
+export { InlineCellEditor } from './DataGridTable/InlineCellEditor';

package/dist/types/index.d.ts

@@ -9,3 +9,6 @@ export { PaginationControls } from './PaginationControls/PaginationControls';
 export type { IPaginationControlsProps } from './PaginationControls/PaginationControls';
 export { ColumnHeaderMenu } from './ColumnHeaderMenu/ColumnHeaderMenu';
 export type { ColumnHeaderMenuProps } from './ColumnHeaderMenu/ColumnHeaderMenu';
+export { StatusBar, MarchingAntsOverlay } from '@alaarab/ogrid-vue';
+export { GridContextMenu } from './DataGridTable/GridContextMenu';
+export { InlineCellEditor } from './DataGridTable/InlineCellEditor';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@alaarab/ogrid-vue-vuetify",
-  "version": "2.0.7",
+  "version": "2.0.9",
   "description": "OGrid Vuetify – Vuetify-based data grid with sorting, filtering, pagination, column chooser, and CSV export.",
   "main": "dist/esm/index.js",
   "module": "dist/esm/index.js",
@@ -14,28 +14,47 @@
   },
   "scripts": {
     "build": "rimraf dist && tsc -p tsconfig.build.json",
-    "test": "jest --passWithNoTests"
+    "test": "jest --passWithNoTests",
+    "storybook": "storybook dev -p 6011 --no-open",
+    "build-storybook": "storybook build"
   },
-  "keywords": ["ogrid", "vue", "vuetify", "datatable", "typescript", "grid"],
+  "keywords": [
+    "ogrid",
+    "vue",
+    "vuetify",
+    "datatable",
+    "typescript",
+    "grid"
+  ],
   "author": "Ala Arab",
   "license": "MIT",
-  "files": ["dist", "README.md", "LICENSE"],
-  "engines": { "node": ">=18" },
+  "files": [
+    "dist",
+    "README.md",
+    "LICENSE"
+  ],
+  "engines": {
+    "node": ">=18"
+  },
   "dependencies": {
-    "@alaarab/ogrid-vue": "2.0.7"
+    "@alaarab/ogrid-vue": "2.0.9"
   },
   "peerDependencies": {
     "vue": "^3.3.0",
     "vuetify": "^3.0.0"
   },
   "devDependencies": {
-    "vue": "^3.5.28",
-    "vuetify": "^3.11.8",
+    "@storybook/vue3-vite": "^10.2.8",
     "@vitejs/plugin-vue": "^6.0.4",
+    "storybook": "^10.2.8",
+    "typescript": "^5.9.3",
     "vite": "^7.3.1",
     "vite-plugin-dts": "^4.5.4",
-    "typescript": "^5.9.3"
+    "vue": "^3.5.28",
+    "vuetify": "^3.11.8"
   },
   "sideEffects": false,
-  "publishConfig": { "access": "public" }
+  "publishConfig": {
+    "access": "public"
+  }
 }

package/dist/esm/DataGridTable/StatusBar.js

@@ -1,45 +0,0 @@
-import { defineComponent, h } from 'vue';
-import { getStatusBarParts } from '@alaarab/ogrid-vue';
-export const StatusBar = defineComponent({
-    name: 'StatusBar',
-    props: {
-        totalCount: { type: Number, required: true },
-        filteredCount: { type: Number, default: undefined },
-        selectedCount: { type: Number, default: undefined },
-        selectedCellCount: { type: Number, default: undefined },
-        aggregation: { type: Object, default: undefined },
-        suppressRowCount: { type: Boolean, default: false },
-    },
-    setup(props) {
-        return () => {
-            const parts = getStatusBarParts(props);
-            return h('div', {
-                role: 'status',
-                'aria-live': 'polite',
-                style: {
-                    marginTop: 'auto',
-                    padding: '6px 12px',
-                    borderTop: '1px solid rgba(0,0,0,0.12)',
-                    backgroundColor: 'rgba(0,0,0,0.04)',
-                    display: 'flex',
-                    alignItems: 'center',
-                    gap: '16px',
-                    fontSize: '0.875rem',
-                },
-            }, parts.map((p, i) => h('span', {
-                key: p.key,
-                style: {
-                    display: 'inline-flex',
-                    alignItems: 'center',
-                    gap: '4px',
-                    ...(i < parts.length - 1
-                        ? { marginRight: '16px', borderRight: '1px solid rgba(0,0,0,0.12)', paddingRight: '16px' }
-                        : {}),
-                },
-            }, [
-                h('span', { style: { color: 'rgba(0,0,0,0.6)' } }, p.label),
-                h('span', { style: { fontWeight: '600' } }, p.value.toLocaleString()),
-            ])));
-        };
-    },
-});

package/dist/types/DataGridTable/StatusBar.d.ts

@@ -1,80 +0,0 @@
-import { type PropType } from 'vue';
-export interface StatusBarProps {
-    totalCount: number;
-    filteredCount?: number;
-    selectedCount?: number;
-    selectedCellCount?: number;
-    aggregation?: {
-        sum: number;
-        avg: number;
-        min: number;
-        max: number;
-        count: number;
-    } | null;
-    suppressRowCount?: boolean;
-}
-export declare const StatusBar: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
-    totalCount: {
-        type: NumberConstructor;
-        required: true;
-    };
-    filteredCount: {
-        type: NumberConstructor;
-        default: undefined;
-    };
-    selectedCount: {
-        type: NumberConstructor;
-        default: undefined;
-    };
-    selectedCellCount: {
-        type: NumberConstructor;
-        default: undefined;
-    };
-    aggregation: {
-        type: PropType<StatusBarProps["aggregation"]>;
-        default: undefined;
-    };
-    suppressRowCount: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
-    [key: string]: any;
-}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
-    totalCount: {
-        type: NumberConstructor;
-        required: true;
-    };
-    filteredCount: {
-        type: NumberConstructor;
-        default: undefined;
-    };
-    selectedCount: {
-        type: NumberConstructor;
-        default: undefined;
-    };
-    selectedCellCount: {
-        type: NumberConstructor;
-        default: undefined;
-    };
-    aggregation: {
-        type: PropType<StatusBarProps["aggregation"]>;
-        default: undefined;
-    };
-    suppressRowCount: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-}>> & Readonly<{}>, {
-    aggregation: {
-        sum: number;
-        avg: number;
-        min: number;
-        max: number;
-        count: number;
-    } | null | undefined;
-    filteredCount: number;
-    selectedCount: number;
-    selectedCellCount: number;
-    suppressRowCount: boolean;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;