From 6bc5cb046adf97bad260841e1a9b3cad4561ac5d Mon Sep 17 00:00:00 2001 From: Claude Date: Mon, 13 Jul 2026 13:06:30 +0000 Subject: [PATCH 1/3] content: add SEO guide "Vue 3 data grid column resize" Adds the marketing guide for the `vue-datagrid-column-resize` keyword (feature intent). Registers the route in marketingGuides, adds body content with 5 sections in MarketingGuide.vue, adds the URL to sitemap.xml, and marks the backlog row as drafted. Co-Authored-By: Claude Sonnet 4.6 Claude-Session: https://claude.ai/code/session_01Wh8MySSn5raFTndZDDQUPW --- demo/pages/MarketingGuide.vue | 53 ++++++++++++++++++++++++++++ demo/router/routes.ts | 5 +++ demo/sitemap.xml | 6 ++++ docs/distribution/keyword-backlog.md | 2 +- 4 files changed, 65 insertions(+), 1 deletion(-) diff --git a/demo/pages/MarketingGuide.vue b/demo/pages/MarketingGuide.vue index 00b37bd..de85f35 100644 --- a/demo/pages/MarketingGuide.vue +++ b/demo/pages/MarketingGuide.vue @@ -347,6 +347,59 @@ 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 columns in the free tier alongside sorting, filtering, search, and pivot tables.', + intro: 'TinyPivot for Vue 3 includes drag-to-resize columns as a standard free-tier feature. Pass your data to the DataGrid component and every column header is immediately resizable — no configuration, no plugin, no extra package required.', + sections: [ + { + title: 'Column resize in the free tier', + paragraphs: [ + 'Column resize is part of the core TinyPivot grid and available at no cost. Users drag the right edge of any column header to widen or narrow that column. The resized layout is preserved while the user stays on the page.', + 'Column resize works alongside all other free-tier interactions. A user can resize a column, sort it, filter it, and export the result to CSV in a single session — all without any additional setup.', + ], + bullets: [ + 'Drag-to-resize on every column header — no configuration required', + 'Works alongside sorting, filtering, and full-text search', + 'Column widths adjust independently without affecting other columns', + 'Export reflects the data view, not the column widths', + ], + }, + { + 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 definitions — including their resize handles — are derived from your object keys automatically.', + '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 is one part of a broader set of free features. The same install also provides per-column filtering, multi-column sort, full-text search, pagination, CSV export, a pivot table with Sum aggregation and row and column totals, calculated fields, and 22 built-in themes.', + ], + bullets: [ + 'Sort, filter, search, and paginate 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 and 22 built-in themes including dark variants', + ], + }, + { + title: 'Nuxt 3 compatibility', + paragraphs: [ + 'TinyPivot renders client-side. In a Nuxt 3 project, wrap the DataGrid in a tag to avoid SSR hydration issues. Column resize and all other interactions work as expected once the component is mounted on the client.', + ], + }, + { + title: 'Upgrade to Pro for advanced analytics', + paragraphs: [ + 'When a dashboard needs more than resizable columns 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. You configure the provider — OpenAI, Anthropic, or OpenRouter — and natural-language 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..e1a67ba 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 columns in the free tier alongside sorting, filtering, search, and pivot tables.', + }, ] as const export type MarketingGuideSlug = typeof marketingGuides[number]['slug'] diff --git a/demo/sitemap.xml b/demo/sitemap.xml index 9dbc0cb..7c89292 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-07-13 + 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 | From 646c3cb013d8460ca09ab5b0f63d3268cbf71d0d Mon Sep 17 00:00:00 2001 From: Brice Vallieres Date: Wed, 15 Jul 2026 13:50:20 -0400 Subject: [PATCH 2/3] release: v1.2.1 --- package.json | 2 +- packages/core/package.json | 5 +++-- packages/react/package.json | 5 +++-- packages/server/package.json | 2 +- packages/vue/package.json | 5 +++-- 5 files changed, 11 insertions(+), 8 deletions(-) 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", From 921ec293436cadd5c99240bd83688cc67ad3900f Mon Sep 17 00:00:00 2001 From: Claude Date: Mon, 24 Aug 2026 13:24:14 +0000 Subject: [PATCH 3/3] content: add SEO guide "Vue 3 data grid column resize" Adds the vue-datagrid-column-resize marketing guide page covering the free-tier column resize feature in @smallwebco/tinypivot-vue. Updates the keyword backlog status from queued to drafted. --- demo/pages/MarketingGuide.vue | 54 ++++++++++++++++++++++++++++ demo/router/routes.ts | 5 +++ demo/sitemap.xml | 6 ++++ docs/distribution/keyword-backlog.md | 2 +- 4 files changed, 66 insertions(+), 1 deletion(-) 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 |