diff --git a/demo/pages/MarketingGuide.vue b/demo/pages/MarketingGuide.vue index 00b37bd..50bce39 100644 --- a/demo/pages/MarketingGuide.vue +++ b/demo/pages/MarketingGuide.vue @@ -347,6 +347,60 @@ const guides: Record = { }, ], }, + 'vue-datagrid-column-resize': { + title: 'Vue 3 Data Grid with Column Resize', + eyebrow: 'Vue 3 Feature Guide', + description: 'Vue 3 data grid with built-in column resize. TinyPivot includes drag-to-resize in the free tier — no configuration, no plugins, no subscription.', + intro: 'TinyPivot for Vue 3 includes column resize as a standard free-tier feature. Users can drag column edges directly in the grid to adjust widths — no configuration prop, no plugin, no custom handler required.', + sections: [ + { + title: 'Column resize in the free tier', + paragraphs: [ + 'Column resize is part of the core TinyPivot grid and is available at no cost. Users can drag any column edge to adjust its width, and the new width persists while the component is mounted. No configuration is needed — the behavior is on by default.', + 'Resizable columns make the grid practical for datasets where column labels and values vary in length. Product names, descriptions, and date strings often need wider columns; numeric columns are usually more compact. TinyPivot lets users adjust widths to fit their current view without developer intervention.', + ], + bullets: [ + 'Drag column edges to resize — enabled by default with no configuration', + 'Works alongside sorting, filtering, search, and pagination in the same view', + 'Column widths persist while the component is mounted', + 'Available in the free tier — no Pro license required', + ], + }, + { + title: 'Install TinyPivot for Vue 3', + paragraphs: [ + 'Install @smallwebco/tinypivot-vue, import the DataGrid component and its stylesheet, then bind your array of flat records to the data prop. Column resize is enabled automatically — no additional props are required for the default behavior.', + 'The Vue package is approximately 50 KB gzipped and has no mandatory dependencies beyond Vue 3 itself. TypeScript types are included.', + ], + }, + { + title: 'What else the free tier includes', + paragraphs: [ + 'Column resize sits alongside a broader set of free-tier features. The same install also gives users per-column filtering, multi-column sorting, full-text search, pagination, calculated fields, a pivot table with Sum aggregation and row and column totals, CSV export, and 22 built-in themes.', + ], + bullets: [ + 'Filter, sort, and search any array of records', + 'Sum aggregation with row and column totals in the pivot view', + 'Calculated fields for derived metrics such as margin or growth rate', + 'CSV export of the filtered and sorted view', + '22 built-in themes including dark and light variants', + ], + }, + { + title: 'Nuxt 3 compatibility', + paragraphs: [ + 'TinyPivot renders client-side. In a Nuxt 3 project, wrap the DataGrid component in a tag to avoid SSR hydration issues. No additional configuration is required beyond that.', + ], + }, + { + title: 'Upgrade to Pro for advanced analytics', + paragraphs: [ + 'When an analytics surface needs more than column resize and export, TinyPivot Pro adds the full aggregation set (Count, Count Distinct, Average, Min, Max, Median, Standard Deviation), a drag-and-drop chart builder, pivot drill-through to underlying rows, styled XLSX export, and session persistence that remembers column widths and pivot configuration across page loads.', + 'Pro also includes an optional BYOK AI Data Analyst that lets users ask natural-language questions about the loaded data. You configure the provider — OpenAI, Anthropic, or OpenRouter — and queries run through your own API key. Pro is a one-time perpetual purchase: Single ($49), Unlimited ($149), or Team ($399). One license covers both @smallwebco/tinypivot-vue and @smallwebco/tinypivot-react.', + ], + }, + ], + }, 'react-datagrid-csv-export': { title: 'React Data Grid with CSV Export', eyebrow: 'React Feature Guide', diff --git a/demo/router/routes.ts b/demo/router/routes.ts index f396a1e..ce2fbcf 100644 --- a/demo/router/routes.ts +++ b/demo/router/routes.ts @@ -63,6 +63,11 @@ export const marketingGuides = [ title: 'React Data Grid with Calculated Fields | TinyPivot', description: 'Add calculated fields to a React data grid for free with TinyPivot. Define derived metrics like margin or growth rate — no backend changes required.', }, + { + slug: 'vue-datagrid-column-resize', + title: 'Vue 3 Data Grid with Column Resize | TinyPivot', + description: 'Vue 3 data grid with built-in column resize. TinyPivot includes drag-to-resize in the free tier — no configuration, no plugins, no subscription.', + }, ] as const export type MarketingGuideSlug = typeof marketingGuides[number]['slug'] diff --git a/demo/sitemap.xml b/demo/sitemap.xml index 9dbc0cb..e5091d1 100644 --- a/demo/sitemap.xml +++ b/demo/sitemap.xml @@ -84,4 +84,10 @@ monthly 0.8 + + https://tiny-pivot.com/vue-datagrid-column-resize + 2026-08-24 + monthly + 0.8 + diff --git a/docs/distribution/keyword-backlog.md b/docs/distribution/keyword-backlog.md index eca917c..5a839dc 100644 --- a/docs/distribution/keyword-backlog.md +++ b/docs/distribution/keyword-backlog.md @@ -35,7 +35,7 @@ All keywords below are `queued` and ready for content generation. | Data grid React CSV export | feature | react-datagrid-csv-export | drafted | | Vue data grid filter sort search | feature | vue-datagrid-filter-sort-search | drafted | | React data grid calculated fields | feature | react-datagrid-calculated-fields | drafted | -| Vue 3 data grid column resize | feature | vue-datagrid-column-resize | queued | +| Vue 3 data grid column resize | feature | vue-datagrid-column-resize | drafted | | Next.js data grid pivot table | feature | nextjs-datagrid-pivot-table | queued | | Nuxt 3 data grid pivot table | feature | nuxt-datagrid-pivot-table | queued | | React pivot table with charts | feature | react-pivot-table-charts | queued | diff --git a/package.json b/package.json index ea37763..1dbf207 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "tinypivot-monorepo", "type": "module", - "version": "1.2.0", + "version": "1.2.1", "private": true, "packageManager": "pnpm@10.34.3", "description": "TinyPivot - Lightweight React & Vue data grid with free pivot tables, Pro charts, and optional AI Data Analyst.", diff --git a/packages/core/package.json b/packages/core/package.json index 09ae83a..8194a10 100644 --- a/packages/core/package.json +++ b/packages/core/package.json @@ -1,7 +1,7 @@ { "name": "@smallwebco/tinypivot-core", "type": "module", - "version": "1.2.0", + "version": "1.2.1", "description": "Core logic for TinyPivot - framework agnostic utilities for AI-enabled data grids, pivot tables, and embedded analytics", "author": "Small Web, LLC", "license": "SEE LICENSE IN LICENSE.md", @@ -38,7 +38,8 @@ "module": "./dist/index.js", "types": "./dist/index.d.ts", "files": [ - "dist" + "dist", + "src" ], "scripts": { "build": "tsc", diff --git a/packages/react/package.json b/packages/react/package.json index 9128e70..ef39447 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -1,7 +1,7 @@ { "name": "@smallwebco/tinypivot-react", "type": "module", - "version": "1.2.0", + "version": "1.2.1", "description": "TinyPivot React - Lightweight data grid with free pivot tables, Pro charts, and optional AI Data Analyst.", "author": "Small Web, LLC", "license": "SEE LICENSE IN LICENSE.md", @@ -61,7 +61,8 @@ "module": "./dist/index.js", "types": "./dist/index.d.ts", "files": [ - "dist" + "dist", + "src" ], "scripts": { "build": "tsup", diff --git a/packages/server/package.json b/packages/server/package.json index 3dfa5b6..7e83eb3 100644 --- a/packages/server/package.json +++ b/packages/server/package.json @@ -1,7 +1,7 @@ { "name": "@smallwebco/tinypivot-server", "type": "module", - "version": "1.2.0", + "version": "1.2.1", "description": "Server handlers for TinyPivot Embedded AI Data Analyst - PostgreSQL integration, AI chat proxy, and natural language to SQL", "license": "MIT", "homepage": "https://tiny-pivot.com", diff --git a/packages/vue/package.json b/packages/vue/package.json index 3c2cff5..8ae3d10 100644 --- a/packages/vue/package.json +++ b/packages/vue/package.json @@ -1,7 +1,7 @@ { "name": "@smallwebco/tinypivot-vue", "type": "module", - "version": "1.2.0", + "version": "1.2.1", "description": "TinyPivot Vue 3 - Lightweight data grid with free pivot tables, Pro charts, and optional AI Data Analyst.", "author": "Small Web, LLC", "license": "SEE LICENSE IN LICENSE.md", @@ -62,7 +62,8 @@ "module": "./dist/tinypivot-vue.js", "types": "./dist/index.d.ts", "files": [ - "dist" + "dist", + "src" ], "scripts": { "build": "vite build",