@tanstack/vue-table 9.0.0-alpha.39 → 9.0.0-alpha.40
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/FlexRender.cjs +8 -1
- package/dist/FlexRender.cjs.map +1 -1
- package/dist/FlexRender.js +8 -1
- package/dist/FlexRender.js.map +1 -1
- package/package.json +1 -1
- package/src/FlexRender.ts +18 -4
package/dist/FlexRender.cjs
CHANGED
|
@@ -59,7 +59,14 @@ const FlexRender = (0, vue.defineComponent)({
|
|
|
59
59
|
},
|
|
60
60
|
setup: (props) => {
|
|
61
61
|
return () => {
|
|
62
|
-
if (props.cell)
|
|
62
|
+
if (props.cell) {
|
|
63
|
+
var _cell$getIsAggregated, _cell$getIsPlaceholde;
|
|
64
|
+
const cell = props.cell;
|
|
65
|
+
const def = cell.column.columnDef;
|
|
66
|
+
if ((_cell$getIsAggregated = cell.getIsAggregated) === null || _cell$getIsAggregated === void 0 ? void 0 : _cell$getIsAggregated.call(cell)) return flexRender(def.aggregatedCell ?? def.cell, cell.getContext());
|
|
67
|
+
if ((_cell$getIsPlaceholde = cell.getIsPlaceholder) === null || _cell$getIsPlaceholde === void 0 ? void 0 : _cell$getIsPlaceholde.call(cell)) return null;
|
|
68
|
+
return flexRender(def.cell, cell.getContext());
|
|
69
|
+
}
|
|
63
70
|
if (props.header) return flexRender(props.header.column.columnDef.header, props.header.getContext());
|
|
64
71
|
if (props.footer) return flexRender(props.footer.column.columnDef.footer, props.footer.getContext());
|
|
65
72
|
return flexRender(props.render, props.props);
|
package/dist/FlexRender.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FlexRender.cjs","names":[],"sources":["../src/FlexRender.ts"],"sourcesContent":["import { defineComponent, h, isVNode } from 'vue'\nimport type { PropType } from 'vue'\nimport type {\n Cell,\n CellData,\n Header,\n RowData,\n TableFeatures,\n} from '@tanstack/table-core'\n\n/**\n * If rendering headers, cells, or footers with custom markup, use flexRender instead of `cell.getValue()` or `cell.renderValue()`.\n * @example flexRender(cell.column.columnDef.cell, cell.getContext())\n */\nexport function flexRender(render: any, props: any): any {\n if (typeof render === 'function') {\n const rendered = render(props)\n\n if (isVNode(rendered)) {\n return rendered\n }\n\n if (typeof rendered === 'function' || typeof rendered === 'object') {\n return h(rendered, props)\n }\n\n return rendered\n }\n\n if (typeof render === 'object') {\n return h(render, props)\n }\n\n return render\n}\n\n/**\n * Simplified component for rendering headers, cells, or footers.\n *\n * Supports both the new shorthand pattern and the legacy `:render`/`:props` pattern:\n * @example\n * ```vue\n * <!-- New shorthand pattern -->\n * <FlexRender :cell=\"cell\" />\n * <FlexRender :header=\"header\" />\n * <FlexRender :footer=\"header\" />\n *\n * <!-- Legacy pattern (still supported) -->\n * <FlexRender :render=\"cell.column.columnDef.cell\" :props=\"cell.getContext()\" />\n * ```\n */\nexport const FlexRender = defineComponent({\n props: {\n render: {\n type: [Function, Object, String] as PropType<any>,\n default: undefined,\n },\n props: {\n type: Object as PropType<any>,\n default: undefined,\n },\n cell: {\n type: Object as PropType<Cell<any, any, any>>,\n default: undefined,\n },\n header: {\n type: Object as PropType<Header<any, any, any>>,\n default: undefined,\n },\n footer: {\n type: Object as PropType<Header<any, any, any>>,\n default: undefined,\n },\n },\n setup: (props: {\n render?: any\n props?: any\n cell?: Cell<any, any, any>\n header?: Header<any, any, any>\n footer?: Header<any, any, any>\n }) => {\n return () => {\n // New shorthand pattern: extract render and props from cell/header/footer\n if (props.cell) {\n
|
|
1
|
+
{"version":3,"file":"FlexRender.cjs","names":[],"sources":["../src/FlexRender.ts"],"sourcesContent":["import { defineComponent, h, isVNode } from 'vue'\nimport type { PropType } from 'vue'\nimport type {\n Cell,\n CellData,\n Header,\n RowData,\n TableFeatures,\n} from '@tanstack/table-core'\n\n/**\n * If rendering headers, cells, or footers with custom markup, use flexRender instead of `cell.getValue()` or `cell.renderValue()`.\n * @example flexRender(cell.column.columnDef.cell, cell.getContext())\n */\nexport function flexRender(render: any, props: any): any {\n if (typeof render === 'function') {\n const rendered = render(props)\n\n if (isVNode(rendered)) {\n return rendered\n }\n\n if (typeof rendered === 'function' || typeof rendered === 'object') {\n return h(rendered, props)\n }\n\n return rendered\n }\n\n if (typeof render === 'object') {\n return h(render, props)\n }\n\n return render\n}\n\n/**\n * Simplified component for rendering headers, cells, or footers.\n *\n * Supports both the new shorthand pattern and the legacy `:render`/`:props` pattern:\n * @example\n * ```vue\n * <!-- New shorthand pattern -->\n * <FlexRender :cell=\"cell\" />\n * <FlexRender :header=\"header\" />\n * <FlexRender :footer=\"header\" />\n *\n * <!-- Legacy pattern (still supported) -->\n * <FlexRender :render=\"cell.column.columnDef.cell\" :props=\"cell.getContext()\" />\n * ```\n */\nexport const FlexRender = defineComponent({\n props: {\n render: {\n type: [Function, Object, String] as PropType<any>,\n default: undefined,\n },\n props: {\n type: Object as PropType<any>,\n default: undefined,\n },\n cell: {\n type: Object as PropType<Cell<any, any, any>>,\n default: undefined,\n },\n header: {\n type: Object as PropType<Header<any, any, any>>,\n default: undefined,\n },\n footer: {\n type: Object as PropType<Header<any, any, any>>,\n default: undefined,\n },\n },\n setup: (props: {\n render?: any\n props?: any\n cell?: Cell<any, any, any>\n header?: Header<any, any, any>\n footer?: Header<any, any, any>\n }) => {\n return () => {\n // New shorthand pattern: extract render and props from cell/header/footer\n if (props.cell) {\n const cell = props.cell\n const def = cell.column.columnDef\n // When the column-grouping feature is registered, a cell can be in\n // one of three special modes that should not render `columnDef.cell`\n // directly:\n // - aggregated: render `columnDef.aggregatedCell` (falling back to\n // `columnDef.cell` if the column did not define one)\n // - placeholder: a duplicate value within a group — render nothing\n // - grouped: fall through to `columnDef.cell`; consumers that want\n // a custom group header typically branch on `cell.getIsGrouped()`\n // themselves first\n if (cell.getIsAggregated?.()) {\n return flexRender(def.aggregatedCell ?? def.cell, cell.getContext())\n }\n if (cell.getIsPlaceholder?.()) {\n return null\n }\n return flexRender(def.cell, cell.getContext())\n }\n\n if (props.header) {\n return flexRender(\n props.header.column.columnDef.header,\n props.header.getContext(),\n )\n }\n\n if (props.footer) {\n return flexRender(\n props.footer.column.columnDef.footer,\n props.footer.getContext(),\n )\n }\n\n // Legacy pattern: use render and props directly\n return flexRender(props.render, props.props)\n }\n },\n})\n"],"mappings":";;;;;;;AAcA,SAAgB,WAAW,QAAa,OAAiB;AACvD,KAAI,OAAO,WAAW,YAAY;EAChC,MAAM,WAAW,OAAO,MAAM;AAE9B,uBAAY,SAAS,CACnB,QAAO;AAGT,MAAI,OAAO,aAAa,cAAc,OAAO,aAAa,SACxD,mBAAS,UAAU,MAAM;AAG3B,SAAO;;AAGT,KAAI,OAAO,WAAW,SACpB,mBAAS,QAAQ,MAAM;AAGzB,QAAO;;;;;;;;;;;;;;;;;AAkBT,MAAa,sCAA6B;CACxC,OAAO;EACL,QAAQ;GACN,MAAM;IAAC;IAAU;IAAQ;IAAO;GAChC,SAAS;GACV;EACD,OAAO;GACL,MAAM;GACN,SAAS;GACV;EACD,MAAM;GACJ,MAAM;GACN,SAAS;GACV;EACD,QAAQ;GACN,MAAM;GACN,SAAS;GACV;EACD,QAAQ;GACN,MAAM;GACN,SAAS;GACV;EACF;CACD,QAAQ,UAMF;AACJ,eAAa;AAEX,OAAI,MAAM,MAAM;;IACd,MAAM,OAAO,MAAM;IACnB,MAAM,MAAM,KAAK,OAAO;AAUxB,iCAAI,KAAK,yGAAmB,CAC1B,QAAO,WAAW,IAAI,kBAAkB,IAAI,MAAM,KAAK,YAAY,CAAC;AAEtE,iCAAI,KAAK,0GAAoB,CAC3B,QAAO;AAET,WAAO,WAAW,IAAI,MAAM,KAAK,YAAY,CAAC;;AAGhD,OAAI,MAAM,OACR,QAAO,WACL,MAAM,OAAO,OAAO,UAAU,QAC9B,MAAM,OAAO,YAAY,CAC1B;AAGH,OAAI,MAAM,OACR,QAAO,WACL,MAAM,OAAO,OAAO,UAAU,QAC9B,MAAM,OAAO,YAAY,CAC1B;AAIH,UAAO,WAAW,MAAM,QAAQ,MAAM,MAAM;;;CAGjD,CAAC"}
|
package/dist/FlexRender.js
CHANGED
|
@@ -59,7 +59,14 @@ const FlexRender = defineComponent({
|
|
|
59
59
|
},
|
|
60
60
|
setup: (props) => {
|
|
61
61
|
return () => {
|
|
62
|
-
if (props.cell)
|
|
62
|
+
if (props.cell) {
|
|
63
|
+
var _cell$getIsAggregated, _cell$getIsPlaceholde;
|
|
64
|
+
const cell = props.cell;
|
|
65
|
+
const def = cell.column.columnDef;
|
|
66
|
+
if ((_cell$getIsAggregated = cell.getIsAggregated) === null || _cell$getIsAggregated === void 0 ? void 0 : _cell$getIsAggregated.call(cell)) return flexRender(def.aggregatedCell ?? def.cell, cell.getContext());
|
|
67
|
+
if ((_cell$getIsPlaceholde = cell.getIsPlaceholder) === null || _cell$getIsPlaceholde === void 0 ? void 0 : _cell$getIsPlaceholde.call(cell)) return null;
|
|
68
|
+
return flexRender(def.cell, cell.getContext());
|
|
69
|
+
}
|
|
63
70
|
if (props.header) return flexRender(props.header.column.columnDef.header, props.header.getContext());
|
|
64
71
|
if (props.footer) return flexRender(props.footer.column.columnDef.footer, props.footer.getContext());
|
|
65
72
|
return flexRender(props.render, props.props);
|
package/dist/FlexRender.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FlexRender.js","names":[],"sources":["../src/FlexRender.ts"],"sourcesContent":["import { defineComponent, h, isVNode } from 'vue'\nimport type { PropType } from 'vue'\nimport type {\n Cell,\n CellData,\n Header,\n RowData,\n TableFeatures,\n} from '@tanstack/table-core'\n\n/**\n * If rendering headers, cells, or footers with custom markup, use flexRender instead of `cell.getValue()` or `cell.renderValue()`.\n * @example flexRender(cell.column.columnDef.cell, cell.getContext())\n */\nexport function flexRender(render: any, props: any): any {\n if (typeof render === 'function') {\n const rendered = render(props)\n\n if (isVNode(rendered)) {\n return rendered\n }\n\n if (typeof rendered === 'function' || typeof rendered === 'object') {\n return h(rendered, props)\n }\n\n return rendered\n }\n\n if (typeof render === 'object') {\n return h(render, props)\n }\n\n return render\n}\n\n/**\n * Simplified component for rendering headers, cells, or footers.\n *\n * Supports both the new shorthand pattern and the legacy `:render`/`:props` pattern:\n * @example\n * ```vue\n * <!-- New shorthand pattern -->\n * <FlexRender :cell=\"cell\" />\n * <FlexRender :header=\"header\" />\n * <FlexRender :footer=\"header\" />\n *\n * <!-- Legacy pattern (still supported) -->\n * <FlexRender :render=\"cell.column.columnDef.cell\" :props=\"cell.getContext()\" />\n * ```\n */\nexport const FlexRender = defineComponent({\n props: {\n render: {\n type: [Function, Object, String] as PropType<any>,\n default: undefined,\n },\n props: {\n type: Object as PropType<any>,\n default: undefined,\n },\n cell: {\n type: Object as PropType<Cell<any, any, any>>,\n default: undefined,\n },\n header: {\n type: Object as PropType<Header<any, any, any>>,\n default: undefined,\n },\n footer: {\n type: Object as PropType<Header<any, any, any>>,\n default: undefined,\n },\n },\n setup: (props: {\n render?: any\n props?: any\n cell?: Cell<any, any, any>\n header?: Header<any, any, any>\n footer?: Header<any, any, any>\n }) => {\n return () => {\n // New shorthand pattern: extract render and props from cell/header/footer\n if (props.cell) {\n
|
|
1
|
+
{"version":3,"file":"FlexRender.js","names":[],"sources":["../src/FlexRender.ts"],"sourcesContent":["import { defineComponent, h, isVNode } from 'vue'\nimport type { PropType } from 'vue'\nimport type {\n Cell,\n CellData,\n Header,\n RowData,\n TableFeatures,\n} from '@tanstack/table-core'\n\n/**\n * If rendering headers, cells, or footers with custom markup, use flexRender instead of `cell.getValue()` or `cell.renderValue()`.\n * @example flexRender(cell.column.columnDef.cell, cell.getContext())\n */\nexport function flexRender(render: any, props: any): any {\n if (typeof render === 'function') {\n const rendered = render(props)\n\n if (isVNode(rendered)) {\n return rendered\n }\n\n if (typeof rendered === 'function' || typeof rendered === 'object') {\n return h(rendered, props)\n }\n\n return rendered\n }\n\n if (typeof render === 'object') {\n return h(render, props)\n }\n\n return render\n}\n\n/**\n * Simplified component for rendering headers, cells, or footers.\n *\n * Supports both the new shorthand pattern and the legacy `:render`/`:props` pattern:\n * @example\n * ```vue\n * <!-- New shorthand pattern -->\n * <FlexRender :cell=\"cell\" />\n * <FlexRender :header=\"header\" />\n * <FlexRender :footer=\"header\" />\n *\n * <!-- Legacy pattern (still supported) -->\n * <FlexRender :render=\"cell.column.columnDef.cell\" :props=\"cell.getContext()\" />\n * ```\n */\nexport const FlexRender = defineComponent({\n props: {\n render: {\n type: [Function, Object, String] as PropType<any>,\n default: undefined,\n },\n props: {\n type: Object as PropType<any>,\n default: undefined,\n },\n cell: {\n type: Object as PropType<Cell<any, any, any>>,\n default: undefined,\n },\n header: {\n type: Object as PropType<Header<any, any, any>>,\n default: undefined,\n },\n footer: {\n type: Object as PropType<Header<any, any, any>>,\n default: undefined,\n },\n },\n setup: (props: {\n render?: any\n props?: any\n cell?: Cell<any, any, any>\n header?: Header<any, any, any>\n footer?: Header<any, any, any>\n }) => {\n return () => {\n // New shorthand pattern: extract render and props from cell/header/footer\n if (props.cell) {\n const cell = props.cell\n const def = cell.column.columnDef\n // When the column-grouping feature is registered, a cell can be in\n // one of three special modes that should not render `columnDef.cell`\n // directly:\n // - aggregated: render `columnDef.aggregatedCell` (falling back to\n // `columnDef.cell` if the column did not define one)\n // - placeholder: a duplicate value within a group — render nothing\n // - grouped: fall through to `columnDef.cell`; consumers that want\n // a custom group header typically branch on `cell.getIsGrouped()`\n // themselves first\n if (cell.getIsAggregated?.()) {\n return flexRender(def.aggregatedCell ?? def.cell, cell.getContext())\n }\n if (cell.getIsPlaceholder?.()) {\n return null\n }\n return flexRender(def.cell, cell.getContext())\n }\n\n if (props.header) {\n return flexRender(\n props.header.column.columnDef.header,\n props.header.getContext(),\n )\n }\n\n if (props.footer) {\n return flexRender(\n props.footer.column.columnDef.footer,\n props.footer.getContext(),\n )\n }\n\n // Legacy pattern: use render and props directly\n return flexRender(props.render, props.props)\n }\n },\n})\n"],"mappings":";;;;;;;AAcA,SAAgB,WAAW,QAAa,OAAiB;AACvD,KAAI,OAAO,WAAW,YAAY;EAChC,MAAM,WAAW,OAAO,MAAM;AAE9B,MAAI,QAAQ,SAAS,CACnB,QAAO;AAGT,MAAI,OAAO,aAAa,cAAc,OAAO,aAAa,SACxD,QAAO,EAAE,UAAU,MAAM;AAG3B,SAAO;;AAGT,KAAI,OAAO,WAAW,SACpB,QAAO,EAAE,QAAQ,MAAM;AAGzB,QAAO;;;;;;;;;;;;;;;;;AAkBT,MAAa,aAAa,gBAAgB;CACxC,OAAO;EACL,QAAQ;GACN,MAAM;IAAC;IAAU;IAAQ;IAAO;GAChC,SAAS;GACV;EACD,OAAO;GACL,MAAM;GACN,SAAS;GACV;EACD,MAAM;GACJ,MAAM;GACN,SAAS;GACV;EACD,QAAQ;GACN,MAAM;GACN,SAAS;GACV;EACD,QAAQ;GACN,MAAM;GACN,SAAS;GACV;EACF;CACD,QAAQ,UAMF;AACJ,eAAa;AAEX,OAAI,MAAM,MAAM;;IACd,MAAM,OAAO,MAAM;IACnB,MAAM,MAAM,KAAK,OAAO;AAUxB,iCAAI,KAAK,yGAAmB,CAC1B,QAAO,WAAW,IAAI,kBAAkB,IAAI,MAAM,KAAK,YAAY,CAAC;AAEtE,iCAAI,KAAK,0GAAoB,CAC3B,QAAO;AAET,WAAO,WAAW,IAAI,MAAM,KAAK,YAAY,CAAC;;AAGhD,OAAI,MAAM,OACR,QAAO,WACL,MAAM,OAAO,OAAO,UAAU,QAC9B,MAAM,OAAO,YAAY,CAC1B;AAGH,OAAI,MAAM,OACR,QAAO,WACL,MAAM,OAAO,OAAO,UAAU,QAC9B,MAAM,OAAO,YAAY,CAC1B;AAIH,UAAO,WAAW,MAAM,QAAQ,MAAM,MAAM;;;CAGjD,CAAC"}
|
package/package.json
CHANGED
package/src/FlexRender.ts
CHANGED
|
@@ -82,10 +82,24 @@ export const FlexRender = defineComponent({
|
|
|
82
82
|
return () => {
|
|
83
83
|
// New shorthand pattern: extract render and props from cell/header/footer
|
|
84
84
|
if (props.cell) {
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
85
|
+
const cell = props.cell
|
|
86
|
+
const def = cell.column.columnDef
|
|
87
|
+
// When the column-grouping feature is registered, a cell can be in
|
|
88
|
+
// one of three special modes that should not render `columnDef.cell`
|
|
89
|
+
// directly:
|
|
90
|
+
// - aggregated: render `columnDef.aggregatedCell` (falling back to
|
|
91
|
+
// `columnDef.cell` if the column did not define one)
|
|
92
|
+
// - placeholder: a duplicate value within a group — render nothing
|
|
93
|
+
// - grouped: fall through to `columnDef.cell`; consumers that want
|
|
94
|
+
// a custom group header typically branch on `cell.getIsGrouped()`
|
|
95
|
+
// themselves first
|
|
96
|
+
if (cell.getIsAggregated?.()) {
|
|
97
|
+
return flexRender(def.aggregatedCell ?? def.cell, cell.getContext())
|
|
98
|
+
}
|
|
99
|
+
if (cell.getIsPlaceholder?.()) {
|
|
100
|
+
return null
|
|
101
|
+
}
|
|
102
|
+
return flexRender(def.cell, cell.getContext())
|
|
89
103
|
}
|
|
90
104
|
|
|
91
105
|
if (props.header) {
|