完全跑通1.0版本
This commit is contained in:
+16
@@ -0,0 +1,16 @@
|
||||
import { SFCWithInstall } from "../../utils/vue/typescript.js";
|
||||
import { Alignment, FixedDir, SortOrder } from "./src/constants.js";
|
||||
import { Column, Columns, SortBy, SortState, TableV2CustomizedHeaderSlotParam } from "./src/types.js";
|
||||
import { ColumnResizeHandler, ColumnSortHandler, ColumnSortParams, ExpandedRowsChangeHandler, ExtraCellPropGetter, ExtractHeaderCellPropGetter, ExtractHeaderPropGetter, ExtractRowPropGetter, HeaderClassNameGetter, RowClassNameGetter, TableV2Props, TableV2PropsPublic, tableV2Props } from "./src/table.js";
|
||||
import { RowEventHandler, RowEventHandlerParams, RowEventHandlers, RowExpandHandler, RowExpandParams, RowHeightChangeHandler, RowHeightChangedParams, RowHoverHandler, RowHoverParams, TableV2RowProps, TableV2RowPropsPublic, tableV2RowProps } from "./src/row.js";
|
||||
import TableV2, { TableV2Instance } from "./src/table-v2.js";
|
||||
import AutoResizer from "./src/components/auto-resizer.js";
|
||||
import { AutoResizerProps, AutoResizerPropsPublic, autoResizerProps } from "./src/auto-resizer.js";
|
||||
import { placeholderSign } from "./src/private.js";
|
||||
import { HeaderCellSlotProps } from "./src/renderers/header-cell.js";
|
||||
|
||||
//#region ../../packages/components/table-v2/index.d.ts
|
||||
declare const ElTableV2: SFCWithInstall<typeof TableV2>;
|
||||
declare const ElAutoResizer: SFCWithInstall<typeof AutoResizer>;
|
||||
//#endregion
|
||||
export { AutoResizerProps, AutoResizerPropsPublic, type Column, ColumnResizeHandler, ColumnSortHandler, ColumnSortParams, type Columns, ElAutoResizer, ElTableV2, ExpandedRowsChangeHandler, ExtraCellPropGetter, ExtractHeaderCellPropGetter, ExtractHeaderPropGetter, ExtractRowPropGetter, type HeaderCellSlotProps, HeaderClassNameGetter, RowClassNameGetter, RowEventHandler, RowEventHandlerParams, RowEventHandlers, RowExpandHandler, RowExpandParams, RowHeightChangeHandler, RowHeightChangedParams, RowHoverHandler, RowHoverParams, type SortBy, type SortState, TableV2, Alignment as TableV2Alignment, type TableV2CustomizedHeaderSlotParam, FixedDir as TableV2FixedDir, type TableV2Instance, placeholderSign as TableV2Placeholder, TableV2Props, TableV2PropsPublic, TableV2RowProps, TableV2RowPropsPublic, SortOrder as TableV2SortOrder, autoResizerProps, tableV2Props, tableV2RowProps };
|
||||
+25
@@ -0,0 +1,25 @@
|
||||
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
||||
const require_install = require("../../utils/vue/install.js");
|
||||
const require_constants = require("./src/constants.js");
|
||||
const require_private = require("./src/private.js");
|
||||
const require_row = require("./src/row.js");
|
||||
const require_table = require("./src/table.js");
|
||||
const require_table_v2 = require("./src/table-v2.js");
|
||||
const require_auto_resizer = require("./src/auto-resizer.js");
|
||||
const require_auto_resizer$1 = require("./src/components/auto-resizer.js");
|
||||
//#region ../../packages/components/table-v2/index.ts
|
||||
const ElTableV2 = require_install.withInstall(require_table_v2.default);
|
||||
const ElAutoResizer = require_install.withInstall(require_auto_resizer$1.default);
|
||||
//#endregion
|
||||
exports.ElAutoResizer = ElAutoResizer;
|
||||
exports.ElTableV2 = ElTableV2;
|
||||
exports.TableV2 = require_table_v2.default;
|
||||
exports.TableV2Alignment = require_constants.Alignment;
|
||||
exports.TableV2FixedDir = require_constants.FixedDir;
|
||||
exports.TableV2Placeholder = require_private.placeholderSign;
|
||||
exports.TableV2SortOrder = require_constants.SortOrder;
|
||||
exports.autoResizerProps = require_auto_resizer.autoResizerProps;
|
||||
exports.tableV2Props = require_table.tableV2Props;
|
||||
exports.tableV2RowProps = require_row.tableV2RowProps;
|
||||
|
||||
//# sourceMappingURL=index.js.map
|
||||
+1
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"index.js","names":["withInstall","TableV2","AutoResizer"],"sources":["../../../../../packages/components/table-v2/index.ts"],"sourcesContent":["import { withInstall } from '@element-plus/utils'\nimport TableV2 from './src/table-v2'\nimport AutoResizer from './src/components/auto-resizer'\n\nimport type { SFCWithInstall } from '@element-plus/utils'\n\nexport {\n Alignment as TableV2Alignment,\n FixedDir as TableV2FixedDir,\n SortOrder as TableV2SortOrder,\n} from './src/constants'\nexport { default as TableV2 } from './src/table-v2'\nexport * from './src/auto-resizer'\nexport { placeholderSign as TableV2Placeholder } from './src/private'\n\nexport const ElTableV2: SFCWithInstall<typeof TableV2> = withInstall(TableV2)\nexport const ElAutoResizer: SFCWithInstall<typeof AutoResizer> =\n withInstall(AutoResizer)\n\nexport type {\n Column,\n Columns,\n SortBy,\n SortState,\n TableV2CustomizedHeaderSlotParam,\n} from './src/types'\nexport type { TableV2Instance } from './src/table-v2'\nexport * from './src/table'\nexport * from './src/row'\n\nexport type { HeaderCellSlotProps } from './src/renderers/header-cell'\n"],"mappings":";;;;;;;;;;AAeA,MAAa,YAA4CA,gBAAAA,YAAYC,iBAAAA,QAAQ;AAC7E,MAAa,gBACXD,gBAAAA,YAAYE,uBAAAA,QAAY"}
|
||||
+22
@@ -0,0 +1,22 @@
|
||||
import * as _$vue from "vue";
|
||||
import { ExtractPropTypes, ExtractPublicPropTypes } from "vue";
|
||||
|
||||
//#region ../../packages/components/table-v2/src/auto-resizer.d.ts
|
||||
type AutoResizeHandler = (event: {
|
||||
height: number;
|
||||
width: number;
|
||||
}) => void;
|
||||
declare const autoResizerProps: {
|
||||
readonly disableWidth: BooleanConstructor;
|
||||
readonly disableHeight: BooleanConstructor;
|
||||
readonly onResize: {
|
||||
readonly type: _$vue.PropType<AutoResizeHandler>;
|
||||
readonly required: false;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
};
|
||||
type AutoResizerProps = ExtractPropTypes<typeof autoResizerProps>;
|
||||
type AutoResizerPropsPublic = ExtractPublicPropTypes<typeof autoResizerProps>;
|
||||
//#endregion
|
||||
export { AutoResizerProps, AutoResizerPropsPublic, autoResizerProps };
|
||||
+12
@@ -0,0 +1,12 @@
|
||||
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
||||
const require_runtime = require("../../../utils/vue/props/runtime.js");
|
||||
//#region ../../packages/components/table-v2/src/auto-resizer.ts
|
||||
const autoResizerProps = require_runtime.buildProps({
|
||||
disableWidth: Boolean,
|
||||
disableHeight: Boolean,
|
||||
onResize: { type: require_runtime.definePropType(Function) }
|
||||
});
|
||||
//#endregion
|
||||
exports.autoResizerProps = autoResizerProps;
|
||||
|
||||
//# sourceMappingURL=auto-resizer.js.map
|
||||
Generated
Vendored
+1
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"auto-resizer.js","names":["buildProps","definePropType"],"sources":["../../../../../../packages/components/table-v2/src/auto-resizer.ts"],"sourcesContent":["import { buildProps, definePropType } from '@element-plus/utils'\n\nimport type { ExtractPropTypes, ExtractPublicPropTypes } from 'vue'\n\ntype AutoResizeHandler = (event: { height: number; width: number }) => void\n\nexport const autoResizerProps = buildProps({\n disableWidth: Boolean,\n disableHeight: Boolean,\n onResize: {\n type: definePropType<AutoResizeHandler>(Function),\n },\n} as const)\n\nexport type AutoResizerProps = ExtractPropTypes<typeof autoResizerProps>\nexport type AutoResizerPropsPublic = ExtractPublicPropTypes<\n typeof autoResizerProps\n>\n"],"mappings":";;;AAMA,MAAa,mBAAmBA,gBAAAA,WAAW;CACzC,cAAc;CACd,eAAe;CACf,UAAU,EACR,MAAMC,gBAAAA,eAAkC,SAAS,EAClD;CACF,CAAU"}
|
||||
+34
@@ -0,0 +1,34 @@
|
||||
import { EpPropFinalized } from "../../../utils/vue/props/types.js";
|
||||
import { AnyColumn } from "./common.js";
|
||||
import * as _$vue from "vue";
|
||||
import { ExtractPropTypes, ExtractPublicPropTypes, StyleValue } from "vue";
|
||||
|
||||
//#region ../../packages/components/table-v2/src/cell.d.ts
|
||||
declare const tableV2CellProps: {
|
||||
readonly class: StringConstructor;
|
||||
readonly cellData: {
|
||||
readonly type: _$vue.PropType<any>;
|
||||
readonly required: false;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
readonly column: {
|
||||
readonly type: _$vue.PropType<AnyColumn>;
|
||||
readonly required: false;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
readonly columnIndex: NumberConstructor;
|
||||
readonly style: EpPropFinalized<(new (...args: any[]) => string | false | _$vue.CSSProperties | StyleValue[]) | (() => StyleValue) | (((new (...args: any[]) => string | false | _$vue.CSSProperties | StyleValue[]) | (() => StyleValue)) | null)[], unknown, unknown, undefined, boolean>;
|
||||
readonly rowData: {
|
||||
readonly type: _$vue.PropType<any>;
|
||||
readonly required: false;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
readonly rowIndex: NumberConstructor;
|
||||
};
|
||||
type TableV2CellProps = ExtractPropTypes<typeof tableV2CellProps>;
|
||||
type TableV2CellPropsPublic = ExtractPublicPropTypes<typeof tableV2CellProps>;
|
||||
//#endregion
|
||||
export { TableV2CellProps, TableV2CellPropsPublic, tableV2CellProps };
|
||||
+30
@@ -0,0 +1,30 @@
|
||||
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
||||
const require_runtime = require("../../../utils/vue/props/runtime.js");
|
||||
const require_common = require("./common.js");
|
||||
//#region ../../packages/components/table-v2/src/cell.ts
|
||||
const tableV2CellProps = require_runtime.buildProps({
|
||||
class: String,
|
||||
cellData: { type: require_runtime.definePropType([
|
||||
String,
|
||||
Boolean,
|
||||
Number,
|
||||
Object
|
||||
]) },
|
||||
column: require_common.column,
|
||||
columnIndex: Number,
|
||||
style: {
|
||||
type: require_runtime.definePropType([
|
||||
String,
|
||||
Array,
|
||||
Object,
|
||||
Boolean
|
||||
]),
|
||||
default: void 0
|
||||
},
|
||||
rowData: { type: require_runtime.definePropType(Object) },
|
||||
rowIndex: Number
|
||||
});
|
||||
//#endregion
|
||||
exports.tableV2CellProps = tableV2CellProps;
|
||||
|
||||
//# sourceMappingURL=cell.js.map
|
||||
+1
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"cell.js","names":["buildProps","definePropType"],"sources":["../../../../../../packages/components/table-v2/src/cell.ts"],"sourcesContent":["import { buildProps, definePropType } from '@element-plus/utils'\nimport { column } from './common'\n\nimport type { ExtractPropTypes, ExtractPublicPropTypes, StyleValue } from 'vue'\n\nexport const tableV2CellProps = buildProps({\n class: String,\n cellData: {\n type: definePropType<any>([String, Boolean, Number, Object]),\n },\n column,\n columnIndex: Number,\n style: {\n type: definePropType<StyleValue>([String, Array, Object, Boolean]),\n default: undefined,\n },\n rowData: {\n type: definePropType<any>(Object),\n },\n rowIndex: Number,\n} as const)\n\nexport type TableV2CellProps = ExtractPropTypes<typeof tableV2CellProps>\nexport type TableV2CellPropsPublic = ExtractPublicPropTypes<\n typeof tableV2CellProps\n>\n"],"mappings":";;;;AAKA,MAAa,mBAAmBA,gBAAAA,WAAW;CACzC,OAAO;CACP,UAAU,EACR,MAAMC,gBAAAA,eAAoB;EAAC;EAAQ;EAAS;EAAQ;EAAO,CAAC,EAC7D;CACD,QAAA,eAAA;CACA,aAAa;CACb,OAAO;EACL,MAAMA,gBAAAA,eAA2B;GAAC;GAAQ;GAAO;GAAQ;GAAQ,CAAC;EAClE,SAAS,KAAA;EACV;CACD,SAAS,EACP,MAAMA,gBAAAA,eAAoB,OAAO,EAClC;CACD,UAAU;CACX,CAAU"}
|
||||
+47
@@ -0,0 +1,47 @@
|
||||
import { Column, KeyType } from "./types.js";
|
||||
import * as _$vue from "vue";
|
||||
import { CSSProperties } from "vue";
|
||||
|
||||
//#region ../../packages/components/table-v2/src/common.d.ts
|
||||
type AnyColumn = Column<any>;
|
||||
/**
|
||||
* @Note even though we can use `string[] | string` as the type but for
|
||||
* convenience here we only use `string` as the acceptable value here.
|
||||
*/
|
||||
declare const classType: StringConstructor;
|
||||
declare const columns: {
|
||||
readonly type: _$vue.PropType<AnyColumn[]>;
|
||||
readonly required: true;
|
||||
};
|
||||
declare const column: {
|
||||
readonly type: _$vue.PropType<AnyColumn>;
|
||||
};
|
||||
declare const fixedDataType: {
|
||||
readonly type: _$vue.PropType<any[]>;
|
||||
};
|
||||
declare const dataType: {
|
||||
readonly required: true;
|
||||
readonly type: _$vue.PropType<any[]>;
|
||||
};
|
||||
declare const expandColumnKey: StringConstructor;
|
||||
declare const expandKeys: {
|
||||
readonly type: _$vue.PropType<KeyType[]>;
|
||||
readonly default: () => never[];
|
||||
};
|
||||
declare const requiredNumber: {
|
||||
readonly type: NumberConstructor;
|
||||
readonly required: true;
|
||||
};
|
||||
declare const rowKey: {
|
||||
readonly type: _$vue.PropType<KeyType>;
|
||||
readonly default: "id";
|
||||
};
|
||||
/**
|
||||
* @note even though we can use `StyleValue` but that would be difficult for us to mapping them,
|
||||
* so we only use `CSSProperties` as the acceptable value here.
|
||||
*/
|
||||
declare const styleType: {
|
||||
type: _$vue.PropType<CSSProperties>;
|
||||
};
|
||||
//#endregion
|
||||
export { AnyColumn, classType, column, columns, dataType, expandColumnKey, expandKeys, fixedDataType, requiredNumber, rowKey, styleType };
|
||||
+54
@@ -0,0 +1,54 @@
|
||||
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
||||
const require_runtime = require("../../../utils/vue/props/runtime.js");
|
||||
const require_typescript = require("../../../utils/typescript.js");
|
||||
//#region ../../packages/components/table-v2/src/common.ts
|
||||
/**
|
||||
* @Note even though we can use `string[] | string` as the type but for
|
||||
* convenience here we only use `string` as the acceptable value here.
|
||||
*/
|
||||
const classType = String;
|
||||
const columns = {
|
||||
type: require_runtime.definePropType(Array),
|
||||
required: true
|
||||
};
|
||||
const column = { type: require_runtime.definePropType(Object) };
|
||||
const fixedDataType = { type: require_runtime.definePropType(Array) };
|
||||
const dataType = {
|
||||
...fixedDataType,
|
||||
required: true
|
||||
};
|
||||
const expandColumnKey = String;
|
||||
const expandKeys = {
|
||||
type: require_runtime.definePropType(Array),
|
||||
default: () => require_typescript.mutable([])
|
||||
};
|
||||
const requiredNumber = {
|
||||
type: Number,
|
||||
required: true
|
||||
};
|
||||
const rowKey = {
|
||||
type: require_runtime.definePropType([
|
||||
String,
|
||||
Number,
|
||||
Symbol
|
||||
]),
|
||||
default: "id"
|
||||
};
|
||||
/**
|
||||
* @note even though we can use `StyleValue` but that would be difficult for us to mapping them,
|
||||
* so we only use `CSSProperties` as the acceptable value here.
|
||||
*/
|
||||
const styleType = { type: require_runtime.definePropType(Object) };
|
||||
//#endregion
|
||||
exports.classType = classType;
|
||||
exports.column = column;
|
||||
exports.columns = columns;
|
||||
exports.dataType = dataType;
|
||||
exports.expandColumnKey = expandColumnKey;
|
||||
exports.expandKeys = expandKeys;
|
||||
exports.fixedDataType = fixedDataType;
|
||||
exports.requiredNumber = requiredNumber;
|
||||
exports.rowKey = rowKey;
|
||||
exports.styleType = styleType;
|
||||
|
||||
//# sourceMappingURL=common.js.map
|
||||
+1
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"common.js","names":["definePropType","mutable"],"sources":["../../../../../../packages/components/table-v2/src/common.ts"],"sourcesContent":["import { definePropType, mutable } from '@element-plus/utils'\n\nimport type { CSSProperties } from 'vue'\nimport type { Column, KeyType } from './types'\n\nexport type AnyColumn = Column<any>\n\n/**\n * @Note even though we can use `string[] | string` as the type but for\n * convenience here we only use `string` as the acceptable value here.\n */\nexport const classType = String\n\nexport const columns = {\n type: definePropType<AnyColumn[]>(Array),\n required: true,\n} as const\n\nexport const column = {\n type: definePropType<AnyColumn>(Object),\n} as const\n\nexport const fixedDataType = {\n type: definePropType<any[]>(Array),\n} as const\n\nexport const dataType = {\n ...fixedDataType,\n required: true,\n} as const\n\nexport const expandColumnKey = String\n\nexport const expandKeys = {\n type: definePropType<KeyType[]>(Array),\n default: () => mutable([]),\n} as const\n\nexport const requiredNumber = {\n type: Number,\n required: true,\n} as const\n\nexport const rowKey = {\n type: definePropType<KeyType>([String, Number, Symbol]),\n default: 'id',\n} as const\n\n/**\n * @note even though we can use `StyleValue` but that would be difficult for us to mapping them,\n * so we only use `CSSProperties` as the acceptable value here.\n */\nexport const styleType = {\n type: definePropType<CSSProperties>(Object),\n}\n"],"mappings":";;;;;;;;AAWA,MAAa,YAAY;AAEzB,MAAa,UAAU;CACrB,MAAMA,gBAAAA,eAA4B,MAAM;CACxC,UAAU;CACX;AAED,MAAa,SAAS,EACpB,MAAMA,gBAAAA,eAA0B,OAAO,EACxC;AAED,MAAa,gBAAgB,EAC3B,MAAMA,gBAAAA,eAAsB,MAAM,EACnC;AAED,MAAa,WAAW;CACtB,GAAG;CACH,UAAU;CACX;AAED,MAAa,kBAAkB;AAE/B,MAAa,aAAa;CACxB,MAAMA,gBAAAA,eAA0B,MAAM;CACtC,eAAeC,mBAAAA,QAAQ,EAAE,CAAC;CAC3B;AAED,MAAa,iBAAiB;CAC5B,MAAM;CACN,UAAU;CACX;AAED,MAAa,SAAS;CACpB,MAAMD,gBAAAA,eAAwB;EAAC;EAAQ;EAAQ;EAAO,CAAC;CACvD,SAAS;CACV;;;;;AAMD,MAAa,YAAY,EACvB,MAAMA,gBAAAA,eAA8B,OAAO,EAC5C"}
|
||||
Generated
Vendored
+34
@@ -0,0 +1,34 @@
|
||||
import * as _$vue from "vue";
|
||||
import * as _$vue_jsx_runtime0 from "vue/jsx-runtime";
|
||||
|
||||
//#region ../../packages/components/table-v2/src/components/auto-resizer.d.ts
|
||||
declare const AutoResizer: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
|
||||
readonly disableWidth: BooleanConstructor;
|
||||
readonly disableHeight: BooleanConstructor;
|
||||
readonly onResize: {
|
||||
readonly type: _$vue.PropType<(event: {
|
||||
height: number;
|
||||
width: number;
|
||||
}) => void>;
|
||||
readonly required: false;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
}>, () => _$vue_jsx_runtime0.JSX.Element, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {}, string, _$vue.PublicProps, Readonly<_$vue.ExtractPropTypes<{
|
||||
readonly disableWidth: BooleanConstructor;
|
||||
readonly disableHeight: BooleanConstructor;
|
||||
readonly onResize: {
|
||||
readonly type: _$vue.PropType<(event: {
|
||||
height: number;
|
||||
width: number;
|
||||
}) => void>;
|
||||
readonly required: false;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
}>> & Readonly<{}>, {
|
||||
readonly disableWidth: boolean;
|
||||
readonly disableHeight: boolean;
|
||||
}, {}, {}, {}, string, _$vue.ComponentProvideOptions, true, {}, any>;
|
||||
//#endregion
|
||||
export { AutoResizer as default };
|
||||
Generated
Vendored
+32
@@ -0,0 +1,32 @@
|
||||
require("../../../../_virtual/_rolldown/runtime.js");
|
||||
const require_index = require("../../../../hooks/use-namespace/index.js");
|
||||
const require_use_auto_resize = require("../composables/use-auto-resize.js");
|
||||
const require_auto_resizer = require("../auto-resizer.js");
|
||||
let vue = require("vue");
|
||||
//#region ../../packages/components/table-v2/src/components/auto-resizer.tsx
|
||||
const AutoResizer = /* @__PURE__ */ (0, vue.defineComponent)({
|
||||
name: "ElAutoResizer",
|
||||
props: require_auto_resizer.autoResizerProps,
|
||||
setup(props, { slots }) {
|
||||
const ns = require_index.useNamespace("auto-resizer");
|
||||
const { height, width, sizer } = require_use_auto_resize.useAutoResize(props);
|
||||
const style = {
|
||||
width: "100%",
|
||||
height: "100%"
|
||||
};
|
||||
return () => {
|
||||
return (0, vue.createVNode)("div", {
|
||||
"ref": sizer,
|
||||
"class": ns.b(),
|
||||
"style": style
|
||||
}, [slots.default?.({
|
||||
height: height.value,
|
||||
width: width.value
|
||||
})]);
|
||||
};
|
||||
}
|
||||
});
|
||||
//#endregion
|
||||
exports.default = AutoResizer;
|
||||
|
||||
//# sourceMappingURL=auto-resizer.js.map
|
||||
Generated
Vendored
+1
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"auto-resizer.js","names":["defineComponent","createVNode","_createVNode","useNamespace","autoResizerProps","useAutoResize","AutoResizer","name","props","setup","slots","ns","height","width","sizer","style","b","default","value"],"sources":["../../../../../../../packages/components/table-v2/src/components/auto-resizer.tsx"],"sourcesContent":["import { defineComponent } from 'vue'\nimport { useNamespace } from '@element-plus/hooks'\nimport { autoResizerProps } from '../auto-resizer'\nimport { useAutoResize } from '../composables'\n\nconst AutoResizer = defineComponent({\n name: 'ElAutoResizer',\n props: autoResizerProps,\n setup(props, { slots }) {\n const ns = useNamespace('auto-resizer')\n const { height, width, sizer } = useAutoResize(props)\n const style = {\n width: '100%',\n height: '100%',\n }\n\n return () => {\n return (\n <div ref={sizer} class={ns.b()} style={style}>\n {slots.default?.({\n height: height.value,\n width: width.value,\n })}\n </div>\n )\n }\n },\n})\n\nexport default AutoResizer\n"],"mappings":";;;;;;AAKA,MAAMM,cAAcN,iBAAAA,GAAAA,IAAAA,iBAAgB;CAClCO,MAAM;CACNC,OAAOJ,qBAAAA;CACPK,MAAMD,OAAO,EAAEE,SAAS;EACtB,MAAMC,KAAKR,cAAAA,aAAa,eAAe;EACvC,MAAM,EAAES,QAAQC,OAAOC,UAAUT,wBAAAA,cAAcG,MAAM;EACrD,MAAMO,QAAQ;GACZF,OAAO;GACPD,QAAQ;GACT;EAED,aAAa;GACX,QAAA,GAAA,IAAA,aAAA,OAAA;IAAA,OACYE;IAAK,SAASH,GAAGK,GAAG;IAAA,SAASD;IAAK,EAAA,CACzCL,MAAMO,UAAU;IACfL,QAAQA,OAAOM;IACfL,OAAOA,MAAMK;IACd,CAAC,CAAA,CAAA;;;CAKX,CAAC"}
|
||||
Generated
Vendored
+7
@@ -0,0 +1,7 @@
|
||||
import { TableV2CellProps } from "../cell.js";
|
||||
import { FunctionalComponent } from "vue";
|
||||
|
||||
//#region ../../packages/components/table-v2/src/components/cell.d.ts
|
||||
declare const TableV2Cell: FunctionalComponent<TableV2CellProps>;
|
||||
//#endregion
|
||||
export { TableV2Cell as default };
|
||||
Generated
Vendored
+19
@@ -0,0 +1,19 @@
|
||||
require("../../../../_virtual/_rolldown/runtime.js");
|
||||
let vue = require("vue");
|
||||
//#region ../../packages/components/table-v2/src/components/cell.tsx
|
||||
const TableV2Cell = (props, { slots }) => {
|
||||
const { cellData, style } = props;
|
||||
const displayText = cellData?.toString?.() || "";
|
||||
const defaultSlot = (0, vue.renderSlot)(slots, "default", props, () => [displayText]);
|
||||
return (0, vue.createVNode)("div", {
|
||||
"class": props.class,
|
||||
"title": displayText,
|
||||
"style": style
|
||||
}, [defaultSlot]);
|
||||
};
|
||||
TableV2Cell.displayName = "ElTableV2Cell";
|
||||
TableV2Cell.inheritAttrs = false;
|
||||
//#endregion
|
||||
exports.default = TableV2Cell;
|
||||
|
||||
//# sourceMappingURL=cell.js.map
|
||||
Generated
Vendored
+1
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"cell.js","names":["renderSlot","createVNode","_createVNode","TableV2Cell","props","slots","cellData","style","displayText","toString","defaultSlot","class","displayName","inheritAttrs"],"sources":["../../../../../../../packages/components/table-v2/src/components/cell.tsx"],"sourcesContent":["import { renderSlot } from 'vue'\n\nimport type { FunctionalComponent } from 'vue'\nimport type { TableV2CellProps } from '../cell'\n\nconst TableV2Cell: FunctionalComponent<TableV2CellProps> = (\n props: TableV2CellProps,\n { slots }\n) => {\n const { cellData, style } = props\n const displayText = cellData?.toString?.() || ''\n const defaultSlot = renderSlot(slots, 'default', props, () => [displayText])\n return (\n <div class={props.class} title={displayText} style={style}>\n {defaultSlot}\n </div>\n )\n}\n\nTableV2Cell.displayName = 'ElTableV2Cell'\nTableV2Cell.inheritAttrs = false\n\nexport default TableV2Cell\n"],"mappings":";;;AAKA,MAAMG,eACJC,OACA,EAAEC,YACC;CACH,MAAM,EAAEC,UAAUC,UAAUH;CAC5B,MAAMI,cAAcF,UAAUG,YAAY,IAAI;CAC9C,MAAMC,eAAAA,GAAAA,IAAAA,YAAyBL,OAAO,WAAWD,aAAa,CAACI,YAAY,CAAC;CAC5E,QAAA,GAAA,IAAA,aAAA,OAAA;EAAA,SACcJ,MAAMO;EAAK,SAASH;EAAW,SAASD;EAAK,EAAA,CACtDG,YAAW,CAAA;;AAKlBP,YAAYS,cAAc;AAC1BT,YAAYU,eAAe"}
|
||||
Generated
Vendored
+19
@@ -0,0 +1,19 @@
|
||||
import { TableV2RowCellRenderParam } from "./row.js";
|
||||
import { StyleValue } from "vue";
|
||||
import * as _$vue_jsx_runtime0 from "vue/jsx-runtime";
|
||||
|
||||
//#region ../../packages/components/table-v2/src/components/expand-icon.d.ts
|
||||
declare const ExpandIcon: {
|
||||
(props: TableV2RowCellRenderParam["expandIconProps"] & {
|
||||
class?: string | string[];
|
||||
style: StyleValue;
|
||||
ariaLabel?: string;
|
||||
size: number;
|
||||
expanded: boolean;
|
||||
expandable: boolean;
|
||||
}): _$vue_jsx_runtime0.JSX.Element;
|
||||
inheritAttrs: boolean;
|
||||
};
|
||||
type ExpandIconInstance = ReturnType<typeof ExpandIcon>;
|
||||
//#endregion
|
||||
export { ExpandIconInstance, ExpandIcon as default };
|
||||
Generated
Vendored
+22
@@ -0,0 +1,22 @@
|
||||
require("../../../../_virtual/_rolldown/runtime.js");
|
||||
const require_index = require("../../../icon/index.js");
|
||||
let _element_plus_icons_vue = require("@element-plus/icons-vue");
|
||||
let vue = require("vue");
|
||||
//#region ../../packages/components/table-v2/src/components/expand-icon.tsx
|
||||
const ExpandIcon = (props) => {
|
||||
const { expanded, expandable, onExpand, style, size, ariaLabel } = props;
|
||||
return (0, vue.createVNode)("button", (0, vue.mergeProps)({
|
||||
onClick: expandable ? () => onExpand(!expanded) : void 0,
|
||||
ariaLabel,
|
||||
ariaExpanded: expanded,
|
||||
class: props.class
|
||||
}, { "type": "button" }), [(0, vue.createVNode)(require_index.ElIcon, {
|
||||
"size": size,
|
||||
"style": style
|
||||
}, { default: () => [(0, vue.createVNode)(_element_plus_icons_vue.ArrowRight, null, null)] })]);
|
||||
};
|
||||
ExpandIcon.inheritAttrs = false;
|
||||
//#endregion
|
||||
exports.default = ExpandIcon;
|
||||
|
||||
//# sourceMappingURL=expand-icon.js.map
|
||||
Generated
Vendored
+1
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"expand-icon.js","names":["ElIcon","ArrowRight","ExpandIcon","props","expanded","expandable","onExpand","style","size","ariaLabel","expandIconProps","onClick","undefined","ariaExpanded","class","_createVNode","_mergeProps","default","inheritAttrs"],"sources":["../../../../../../../packages/components/table-v2/src/components/expand-icon.tsx"],"sourcesContent":["import ElIcon from '@element-plus/components/icon'\nimport { ArrowRight } from '@element-plus/icons-vue'\n\nimport type { StyleValue } from 'vue'\nimport type { TableV2RowCellRenderParam } from './row'\n\nconst ExpandIcon = (\n props: TableV2RowCellRenderParam['expandIconProps'] & {\n class?: string | string[]\n style: StyleValue\n ariaLabel?: string\n size: number\n expanded: boolean\n expandable: boolean\n }\n) => {\n const { expanded, expandable, onExpand, style, size, ariaLabel } = props\n\n const expandIconProps = {\n onClick: expandable ? () => onExpand(!expanded) : undefined,\n ariaLabel,\n ariaExpanded: expanded,\n class: props.class,\n } as any\n\n return (\n <button {...expandIconProps} type=\"button\">\n <ElIcon size={size} style={style}>\n <ArrowRight />\n </ElIcon>\n </button>\n )\n}\n\nExpandIcon.inheritAttrs = false\n\nexport default ExpandIcon\n\nexport type ExpandIconInstance = ReturnType<typeof ExpandIcon>\n"],"mappings":";;;;;AAMA,MAAME,cACJC,UAQG;CACH,MAAM,EAAEC,UAAUC,YAAYC,UAAUC,OAAOC,MAAMC,cAAcN;CASnE,QAAA,GAAA,IAAA,aAAA,WAAA,GAAA,IAAA,YACcO;EAPZC,SAASN,mBAAmBC,SAAS,CAACF,SAAS,GAAGQ,KAAAA;EAClDH;EACAI,cAAcT;EACdU,OAAOX,MAAMW;EAIc,EAAA,EAAA,QAAA,UAAA,CAAA,EAAA,EAAA,GAAA,IAAA,aAAAd,cAAAA,QAAA;EAAA,QACXQ;EAAI,SAASD;EAAK,EAAA,EAAAU,eAAA,EAAA,GAAA,IAAA,aAAAhB,wBAAAA,YAAA,MAAA,KAAA,CAAA,EAAA,CAAA,CAAA,CAAA;;AAOtCC,WAAWgB,eAAe"}
|
||||
Generated
Vendored
+7
@@ -0,0 +1,7 @@
|
||||
import { TableV2HeaderCell } from "../header-cell.js";
|
||||
import { FunctionalComponent } from "vue";
|
||||
|
||||
//#region ../../packages/components/table-v2/src/components/header-cell.d.ts
|
||||
declare const HeaderCell: FunctionalComponent<TableV2HeaderCell>;
|
||||
//#endregion
|
||||
export { HeaderCell as default };
|
||||
Generated
Vendored
+13
@@ -0,0 +1,13 @@
|
||||
require("../../../../_virtual/_rolldown/runtime.js");
|
||||
let vue = require("vue");
|
||||
//#region ../../packages/components/table-v2/src/components/header-cell.tsx
|
||||
const HeaderCell = (props, { slots }) => (0, vue.renderSlot)(slots, "default", props, () => [(0, vue.createVNode)("div", {
|
||||
"class": props.class,
|
||||
"title": props.column?.title
|
||||
}, [props.column?.title])]);
|
||||
HeaderCell.displayName = "ElTableV2HeaderCell";
|
||||
HeaderCell.inheritAttrs = false;
|
||||
//#endregion
|
||||
exports.default = HeaderCell;
|
||||
|
||||
//# sourceMappingURL=header-cell.js.map
|
||||
Generated
Vendored
+1
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"header-cell.js","names":["renderSlot","createVNode","_createVNode","HeaderCell","props","slots","class","column","title","displayName","inheritAttrs"],"sources":["../../../../../../../packages/components/table-v2/src/components/header-cell.tsx"],"sourcesContent":["import { renderSlot } from 'vue'\n\nimport type { FunctionalComponent } from 'vue'\nimport type { TableV2HeaderCell } from '../header-cell'\n\nconst HeaderCell: FunctionalComponent<TableV2HeaderCell> = (props, { slots }) =>\n renderSlot(slots, 'default', props, () => [\n <div class={props.class} title={props.column?.title}>\n {props.column?.title}\n </div>,\n ])\n\nHeaderCell.displayName = 'ElTableV2HeaderCell'\nHeaderCell.inheritAttrs = false\n\nexport default HeaderCell\n"],"mappings":";;;AAKA,MAAMG,cAAsDC,OAAO,EAAEC,aAAAA,GAAAA,IAAAA,YACxDA,OAAO,WAAWD,aAAa,EAAA,GAAA,IAAA,aAAA,OAAA;CAAA,SAC5BA,MAAME;CAAK,SAASF,MAAMG,QAAQC;CAAK,EAAA,CAChDJ,MAAMG,QAAQC,MAAK,CAAA,CAEvB,CAAC;AAEJL,WAAWM,cAAc;AACzBN,WAAWO,eAAe"}
|
||||
Generated
Vendored
+65
@@ -0,0 +1,65 @@
|
||||
import { ColumnCellsType, KeyType } from "../types.js";
|
||||
import { AnyColumn } from "../common.js";
|
||||
import { TableV2HeaderRowProps } from "../header-row.js";
|
||||
import * as _$vue from "vue";
|
||||
import { CSSProperties } from "vue";
|
||||
import * as _$vue_jsx_runtime0 from "vue/jsx-runtime";
|
||||
|
||||
//#region ../../packages/components/table-v2/src/components/header-row.d.ts
|
||||
declare const TableV2HeaderRow: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
|
||||
readonly class: StringConstructor;
|
||||
readonly columns: {
|
||||
readonly type: _$vue.PropType<AnyColumn[]>;
|
||||
readonly required: true;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
readonly columnsStyles: {
|
||||
readonly type: _$vue.PropType<Record<KeyType, CSSProperties>>;
|
||||
readonly required: true;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
readonly headerIndex: NumberConstructor;
|
||||
readonly style: {
|
||||
readonly type: _$vue.PropType<CSSProperties>;
|
||||
readonly required: false;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
}>, () => _$vue_jsx_runtime0.JSX.Element, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {}, string, _$vue.PublicProps, Readonly<_$vue.ExtractPropTypes<{
|
||||
readonly class: StringConstructor;
|
||||
readonly columns: {
|
||||
readonly type: _$vue.PropType<AnyColumn[]>;
|
||||
readonly required: true;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
readonly columnsStyles: {
|
||||
readonly type: _$vue.PropType<Record<KeyType, CSSProperties>>;
|
||||
readonly required: true;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
readonly headerIndex: NumberConstructor;
|
||||
readonly style: {
|
||||
readonly type: _$vue.PropType<CSSProperties>;
|
||||
readonly required: false;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
}>> & Readonly<{}>, {}, {}, {}, {}, string, _$vue.ComponentProvideOptions, true, {}, any>;
|
||||
type TableV2HeaderRowCellRendererParams = {
|
||||
columns: TableV2HeaderRowProps['columns'];
|
||||
column: TableV2HeaderRowProps['columns'][number];
|
||||
columnIndex: number;
|
||||
headerIndex: number;
|
||||
style: CSSProperties;
|
||||
};
|
||||
type TableV2HeaderRowRendererParams = {
|
||||
cells: ColumnCellsType;
|
||||
columns: TableV2HeaderRowProps['columns'];
|
||||
headerIndex: number;
|
||||
};
|
||||
//#endregion
|
||||
export { TableV2HeaderRowCellRendererParams, TableV2HeaderRowRendererParams, TableV2HeaderRow as default };
|
||||
Generated
Vendored
+40
@@ -0,0 +1,40 @@
|
||||
require("../../../../_virtual/_rolldown/runtime.js");
|
||||
const require_header_row = require("../header-row.js");
|
||||
let vue = require("vue");
|
||||
let _vue_shared = require("@vue/shared");
|
||||
//#region ../../packages/components/table-v2/src/components/header-row.tsx
|
||||
const TableV2HeaderRow = /* @__PURE__ */ (0, vue.defineComponent)({
|
||||
name: "ElTableV2HeaderRow",
|
||||
props: require_header_row.tableV2HeaderRowProps,
|
||||
setup(props, { slots }) {
|
||||
return () => {
|
||||
const { columns, columnsStyles, headerIndex, style } = props;
|
||||
let Cells = columns.map((column, columnIndex) => {
|
||||
return slots.cell({
|
||||
columns,
|
||||
column,
|
||||
columnIndex,
|
||||
headerIndex,
|
||||
style: columnsStyles[column.key]
|
||||
});
|
||||
});
|
||||
if (slots.header) Cells = slots.header({
|
||||
cells: Cells.map((node) => {
|
||||
if ((0, _vue_shared.isArray)(node) && node.length === 1) return node[0];
|
||||
return node;
|
||||
}),
|
||||
columns,
|
||||
headerIndex
|
||||
});
|
||||
return (0, vue.createVNode)("div", {
|
||||
"class": props.class,
|
||||
"style": style,
|
||||
"role": "row"
|
||||
}, [Cells]);
|
||||
};
|
||||
}
|
||||
});
|
||||
//#endregion
|
||||
exports.default = TableV2HeaderRow;
|
||||
|
||||
//# sourceMappingURL=header-row.js.map
|
||||
Generated
Vendored
+1
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"header-row.js","names":["defineComponent","createVNode","_createVNode","isArray","tableV2HeaderRowProps","TableV2HeaderRow","name","props","setup","slots","columns","columnsStyles","headerIndex","style","Cells","map","column","columnIndex","cell","key","header","cells","node","length","class"],"sources":["../../../../../../../packages/components/table-v2/src/components/header-row.tsx"],"sourcesContent":["import { defineComponent } from 'vue'\nimport { isArray } from '@element-plus/utils'\nimport { tableV2HeaderRowProps } from '../header-row'\n\nimport type { CSSProperties } from 'vue'\nimport type { ColumnCellsType } from '../types'\nimport type { TableV2HeaderRowProps } from '../header-row'\n\nconst TableV2HeaderRow = defineComponent({\n name: 'ElTableV2HeaderRow',\n props: tableV2HeaderRowProps,\n setup(props, { slots }) {\n return () => {\n const { columns, columnsStyles, headerIndex, style } = props\n let Cells: ColumnCellsType = columns.map((column, columnIndex) => {\n return slots.cell!({\n columns,\n column,\n columnIndex,\n headerIndex,\n style: columnsStyles[column.key!],\n })\n })\n\n if (slots.header) {\n Cells = slots.header({\n cells: Cells.map((node) => {\n if (isArray(node) && node.length === 1) {\n return node[0]\n }\n return node\n }),\n columns,\n headerIndex,\n })\n }\n\n return (\n <div class={props.class} style={style} role=\"row\">\n {Cells}\n </div>\n )\n }\n },\n})\n\nexport default TableV2HeaderRow\n\nexport type TableV2HeaderRowCellRendererParams = {\n columns: TableV2HeaderRowProps['columns']\n column: TableV2HeaderRowProps['columns'][number]\n columnIndex: number\n headerIndex: number\n style: CSSProperties\n}\n\nexport type TableV2HeaderRowRendererParams = {\n cells: ColumnCellsType\n columns: TableV2HeaderRowProps['columns']\n headerIndex: number\n}\n"],"mappings":";;;;;AAQA,MAAMK,mBAAmBL,iBAAAA,GAAAA,IAAAA,iBAAgB;CACvCM,MAAM;CACNC,OAAOH,mBAAAA;CACPI,MAAMD,OAAO,EAAEE,SAAS;EACtB,aAAa;GACX,MAAM,EAAEC,SAASC,eAAeC,aAAaC,UAAUN;GACvD,IAAIO,QAAyBJ,QAAQK,KAAKC,QAAQC,gBAAgB;IAChE,OAAOR,MAAMS,KAAM;KACjBR;KACAM;KACAC;KACAL;KACAC,OAAOF,cAAcK,OAAOG;KAC7B,CAAC;KACF;GAEF,IAAIV,MAAMW,QACRN,QAAQL,MAAMW,OAAO;IACnBC,OAAOP,MAAMC,KAAKO,SAAS;KACzB,KAAA,GAAA,YAAA,SAAYA,KAAK,IAAIA,KAAKC,WAAW,GACnC,OAAOD,KAAK;KAEd,OAAOA;MACP;IACFZ;IACAE;IACD,CAAC;GAGJ,QAAA,GAAA,IAAA,aAAA,OAAA;IAAA,SACcL,MAAMiB;IAAK,SAASX;IAAK,QAAA;IAAA,EAAA,CAClCC,MAAK,CAAA;;;CAKf,CAAC"}
|
||||
Generated
Vendored
+112
@@ -0,0 +1,112 @@
|
||||
import { EpPropFinalized, EpPropMergeType } from "../../../../utils/vue/props/types.js";
|
||||
import { AnyColumn } from "../common.js";
|
||||
import { TableV2HeaderProps } from "../header.js";
|
||||
import { UseColumnsReturn } from "../composables/use-columns.js";
|
||||
import * as _$vue from "vue";
|
||||
import { CSSProperties, UnwrapRef } from "vue";
|
||||
import * as _$vue_jsx_runtime0 from "vue/jsx-runtime";
|
||||
|
||||
//#region ../../packages/components/table-v2/src/components/header.d.ts
|
||||
declare const TableV2Header: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
|
||||
readonly class: StringConstructor;
|
||||
readonly columns: {
|
||||
readonly type: _$vue.PropType<AnyColumn[]>;
|
||||
readonly required: true;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
readonly fixedHeaderData: {
|
||||
readonly type: _$vue.PropType<any[]>;
|
||||
readonly required: false;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
readonly headerData: {
|
||||
readonly type: _$vue.PropType<any[]>;
|
||||
readonly required: true;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
readonly headerHeight: EpPropFinalized<(new (...args: any[]) => number | number[]) | (() => number | number[]) | (((new (...args: any[]) => number | number[]) | (() => number | number[])) | null)[], unknown, unknown, 50, boolean>;
|
||||
readonly rowWidth: {
|
||||
readonly type: _$vue.PropType<number>;
|
||||
readonly required: true;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
readonly rowHeight: EpPropFinalized<NumberConstructor, unknown, unknown, 50, boolean>;
|
||||
readonly height: {
|
||||
readonly type: _$vue.PropType<number>;
|
||||
readonly required: true;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
readonly width: {
|
||||
readonly type: _$vue.PropType<number>;
|
||||
readonly required: true;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
}>, () => _$vue_jsx_runtime0.JSX.Element | undefined, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {}, string, _$vue.PublicProps, Readonly<_$vue.ExtractPropTypes<{
|
||||
readonly class: StringConstructor;
|
||||
readonly columns: {
|
||||
readonly type: _$vue.PropType<AnyColumn[]>;
|
||||
readonly required: true;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
readonly fixedHeaderData: {
|
||||
readonly type: _$vue.PropType<any[]>;
|
||||
readonly required: false;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
readonly headerData: {
|
||||
readonly type: _$vue.PropType<any[]>;
|
||||
readonly required: true;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
readonly headerHeight: EpPropFinalized<(new (...args: any[]) => number | number[]) | (() => number | number[]) | (((new (...args: any[]) => number | number[]) | (() => number | number[])) | null)[], unknown, unknown, 50, boolean>;
|
||||
readonly rowWidth: {
|
||||
readonly type: _$vue.PropType<number>;
|
||||
readonly required: true;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
readonly rowHeight: EpPropFinalized<NumberConstructor, unknown, unknown, 50, boolean>;
|
||||
readonly height: {
|
||||
readonly type: _$vue.PropType<number>;
|
||||
readonly required: true;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
readonly width: {
|
||||
readonly type: _$vue.PropType<number>;
|
||||
readonly required: true;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
}>> & Readonly<{}>, {
|
||||
readonly rowHeight: number;
|
||||
readonly headerHeight: EpPropMergeType<(new (...args: any[]) => number | number[]) | (() => number | number[]) | (((new (...args: any[]) => number | number[]) | (() => number | number[])) | null)[], unknown, unknown>;
|
||||
}, {}, {}, {}, string, _$vue.ComponentProvideOptions, true, {}, any>;
|
||||
type TableV2HeaderInstance = InstanceType<typeof TableV2Header> & {
|
||||
/**
|
||||
* @description scroll to position based on the provided value
|
||||
*/
|
||||
scrollToLeft: (left?: number) => void;
|
||||
};
|
||||
type TableV2HeaderRendererParams = {
|
||||
class: string;
|
||||
columns: TableV2HeaderProps['columns'];
|
||||
columnsStyles: UnwrapRef<UseColumnsReturn['columnsStyles']>;
|
||||
headerIndex: number;
|
||||
style: CSSProperties;
|
||||
};
|
||||
type TableV2HeaderRowRendererParams = {
|
||||
rowData: any;
|
||||
rowIndex: number;
|
||||
} & Omit<TableV2HeaderRendererParams, 'headerIndex'>;
|
||||
//#endregion
|
||||
export { TableV2HeaderInstance, TableV2HeaderRendererParams, TableV2HeaderRowRendererParams, TableV2Header as default };
|
||||
Generated
Vendored
+89
@@ -0,0 +1,89 @@
|
||||
require("../../../../_virtual/_rolldown/runtime.js");
|
||||
const require_index = require("../../../../hooks/use-namespace/index.js");
|
||||
const require_utils = require("../utils.js");
|
||||
const require_tokens = require("../tokens.js");
|
||||
const require_header = require("../header.js");
|
||||
let vue = require("vue");
|
||||
let lodash_unified = require("lodash-unified");
|
||||
//#region ../../packages/components/table-v2/src/components/header.tsx
|
||||
const TableV2Header = /* @__PURE__ */ (0, vue.defineComponent)({
|
||||
name: "ElTableV2Header",
|
||||
props: require_header.tableV2HeaderProps,
|
||||
setup(props, { slots, expose }) {
|
||||
const ns = require_index.useNamespace("table-v2");
|
||||
const scrollLeftInfo = (0, vue.inject)(require_tokens.TABLE_V2_GRID_INJECTION_KEY);
|
||||
const headerRef = (0, vue.ref)();
|
||||
const headerStyle = (0, vue.computed)(() => require_utils.enforceUnit({
|
||||
width: props.width,
|
||||
height: props.height
|
||||
}));
|
||||
const rowStyle = (0, vue.computed)(() => require_utils.enforceUnit({
|
||||
width: props.rowWidth,
|
||||
height: props.height
|
||||
}));
|
||||
const headerHeights = (0, vue.computed)(() => (0, lodash_unified.castArray)((0, vue.unref)(props.headerHeight)));
|
||||
const scrollToLeft = (left) => {
|
||||
const headerEl = (0, vue.unref)(headerRef);
|
||||
(0, vue.nextTick)(() => {
|
||||
headerEl?.scroll && headerEl.scroll({ left });
|
||||
});
|
||||
};
|
||||
const renderFixedRows = () => {
|
||||
const fixedRowClassName = ns.e("fixed-header-row");
|
||||
const { columns, fixedHeaderData, rowHeight } = props;
|
||||
return fixedHeaderData?.map((fixedRowData, fixedRowIndex) => {
|
||||
const style = require_utils.enforceUnit({
|
||||
height: rowHeight,
|
||||
width: "100%"
|
||||
});
|
||||
return slots.fixed?.({
|
||||
class: fixedRowClassName,
|
||||
columns,
|
||||
rowData: fixedRowData,
|
||||
rowIndex: -(fixedRowIndex + 1),
|
||||
style
|
||||
});
|
||||
});
|
||||
};
|
||||
const renderDynamicRows = () => {
|
||||
const dynamicRowClassName = ns.e("dynamic-header-row");
|
||||
const { columns } = props;
|
||||
return (0, vue.unref)(headerHeights).map((rowHeight, rowIndex) => {
|
||||
const style = require_utils.enforceUnit({
|
||||
width: "100%",
|
||||
height: rowHeight
|
||||
});
|
||||
return slots.dynamic?.({
|
||||
class: dynamicRowClassName,
|
||||
columns,
|
||||
headerIndex: rowIndex,
|
||||
style
|
||||
});
|
||||
});
|
||||
};
|
||||
(0, vue.onUpdated)(() => {
|
||||
if (scrollLeftInfo?.value) scrollToLeft(scrollLeftInfo.value);
|
||||
});
|
||||
expose({
|
||||
/**
|
||||
* @description scroll to position based on the provided value
|
||||
*/
|
||||
scrollToLeft });
|
||||
return () => {
|
||||
if (props.height <= 0) return;
|
||||
return (0, vue.createVNode)("div", {
|
||||
"ref": headerRef,
|
||||
"class": props.class,
|
||||
"style": (0, vue.unref)(headerStyle),
|
||||
"role": "rowgroup"
|
||||
}, [(0, vue.createVNode)("div", {
|
||||
"style": (0, vue.unref)(rowStyle),
|
||||
"class": ns.e("header")
|
||||
}, [renderDynamicRows(), renderFixedRows()])]);
|
||||
};
|
||||
}
|
||||
});
|
||||
//#endregion
|
||||
exports.default = TableV2Header;
|
||||
|
||||
//# sourceMappingURL=header.js.map
|
||||
Generated
Vendored
+1
File diff suppressed because one or more lines are too long
Generated
Vendored
+8
@@ -0,0 +1,8 @@
|
||||
import TableV2Cell from "./cell.js";
|
||||
import HeaderCell from "./header-cell.js";
|
||||
import TableV2HeaderRow, { TableV2HeaderRowCellRendererParams, TableV2HeaderRowRendererParams } from "./header-row.js";
|
||||
import TableV2Header, { TableV2HeaderInstance, TableV2HeaderRendererParams } from "./header.js";
|
||||
import TableV2Row, { TableV2RowCellRenderParam, TableV2RowSlotProps } from "./row.js";
|
||||
import SortIcon from "./sort-icon.js";
|
||||
import ExpandIcon from "./expand-icon.js";
|
||||
export { ExpandIcon, TableV2Header as Header, HeaderCell, TableV2HeaderRow as HeaderRow, TableV2Row as Row, SortIcon, TableV2Cell as TableCell, type TableV2HeaderInstance, type TableV2HeaderRendererParams, type TableV2HeaderRowCellRendererParams, type TableV2HeaderRowRendererParams, type TableV2RowCellRenderParam, type TableV2RowSlotProps };
|
||||
Generated
Vendored
+15
@@ -0,0 +1,15 @@
|
||||
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
||||
const require_cell = require("./cell.js");
|
||||
const require_header_cell = require("./header-cell.js");
|
||||
const require_header_row = require("./header-row.js");
|
||||
const require_header = require("./header.js");
|
||||
const require_row = require("./row.js");
|
||||
const require_sort_icon = require("./sort-icon.js");
|
||||
const require_expand_icon = require("./expand-icon.js");
|
||||
exports.ExpandIcon = require_expand_icon.default;
|
||||
exports.Header = require_header.default;
|
||||
exports.HeaderCell = require_header_cell.default;
|
||||
exports.HeaderRow = require_header_row.default;
|
||||
exports.Row = require_row.default;
|
||||
exports.SortIcon = require_sort_icon.default;
|
||||
exports.TableCell = require_cell.default;
|
||||
Generated
Vendored
+174
@@ -0,0 +1,174 @@
|
||||
import { EpPropFinalized, EpPropMergeType } from "../../../../utils/vue/props/types.js";
|
||||
import { KeyType } from "../types.js";
|
||||
import { AnyColumn } from "../common.js";
|
||||
import { RowEventHandlers, RowExpandHandler, RowHeightChangeHandler, RowHoverHandler, TableV2RowProps } from "../row.js";
|
||||
import * as _$vue from "vue";
|
||||
import { CSSProperties, VNode } from "vue";
|
||||
import * as _$vue_jsx_runtime0 from "vue/jsx-runtime";
|
||||
|
||||
//#region ../../packages/components/table-v2/src/components/row.d.ts
|
||||
declare const TableV2Row: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
|
||||
readonly class: StringConstructor;
|
||||
readonly columns: {
|
||||
readonly type: _$vue.PropType<AnyColumn[]>;
|
||||
readonly required: true;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
readonly columnsStyles: {
|
||||
readonly type: _$vue.PropType<Record<KeyType, CSSProperties>>;
|
||||
readonly required: true;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
readonly depth: NumberConstructor;
|
||||
readonly expandColumnKey: StringConstructor;
|
||||
readonly estimatedRowHeight: {
|
||||
readonly default: undefined;
|
||||
readonly type: _$vue.PropType<number>;
|
||||
readonly required: false;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
readonly __epPropKey: true;
|
||||
};
|
||||
readonly isScrolling: BooleanConstructor;
|
||||
readonly onRowExpand: {
|
||||
readonly type: _$vue.PropType<RowExpandHandler>;
|
||||
readonly required: false;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
readonly onRowHover: {
|
||||
readonly type: _$vue.PropType<RowHoverHandler>;
|
||||
readonly required: false;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
readonly onRowHeightChange: {
|
||||
readonly type: _$vue.PropType<RowHeightChangeHandler>;
|
||||
readonly required: false;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
readonly rowData: {
|
||||
readonly type: _$vue.PropType<any>;
|
||||
readonly required: true;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
readonly rowEventHandlers: {
|
||||
readonly type: _$vue.PropType<RowEventHandlers>;
|
||||
readonly required: false;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
readonly rowIndex: {
|
||||
readonly type: _$vue.PropType<number>;
|
||||
readonly required: true;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
readonly rowKey: EpPropFinalized<(new (...args: any[]) => string | number | symbol) | (() => KeyType) | (((new (...args: any[]) => string | number | symbol) | (() => KeyType)) | null)[], unknown, unknown, "id", boolean>;
|
||||
readonly style: {
|
||||
readonly type: _$vue.PropType<CSSProperties>;
|
||||
readonly required: false;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
}>, () => _$vue_jsx_runtime0.JSX.Element, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {}, string, _$vue.PublicProps, Readonly<_$vue.ExtractPropTypes<{
|
||||
readonly class: StringConstructor;
|
||||
readonly columns: {
|
||||
readonly type: _$vue.PropType<AnyColumn[]>;
|
||||
readonly required: true;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
readonly columnsStyles: {
|
||||
readonly type: _$vue.PropType<Record<KeyType, CSSProperties>>;
|
||||
readonly required: true;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
readonly depth: NumberConstructor;
|
||||
readonly expandColumnKey: StringConstructor;
|
||||
readonly estimatedRowHeight: {
|
||||
readonly default: undefined;
|
||||
readonly type: _$vue.PropType<number>;
|
||||
readonly required: false;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
readonly __epPropKey: true;
|
||||
};
|
||||
readonly isScrolling: BooleanConstructor;
|
||||
readonly onRowExpand: {
|
||||
readonly type: _$vue.PropType<RowExpandHandler>;
|
||||
readonly required: false;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
readonly onRowHover: {
|
||||
readonly type: _$vue.PropType<RowHoverHandler>;
|
||||
readonly required: false;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
readonly onRowHeightChange: {
|
||||
readonly type: _$vue.PropType<RowHeightChangeHandler>;
|
||||
readonly required: false;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
readonly rowData: {
|
||||
readonly type: _$vue.PropType<any>;
|
||||
readonly required: true;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
readonly rowEventHandlers: {
|
||||
readonly type: _$vue.PropType<RowEventHandlers>;
|
||||
readonly required: false;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
readonly rowIndex: {
|
||||
readonly type: _$vue.PropType<number>;
|
||||
readonly required: true;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
readonly rowKey: EpPropFinalized<(new (...args: any[]) => string | number | symbol) | (() => KeyType) | (((new (...args: any[]) => string | number | symbol) | (() => KeyType)) | null)[], unknown, unknown, "id", boolean>;
|
||||
readonly style: {
|
||||
readonly type: _$vue.PropType<CSSProperties>;
|
||||
readonly required: false;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
}>> & Readonly<{}>, {
|
||||
readonly isScrolling: boolean;
|
||||
readonly estimatedRowHeight: number;
|
||||
readonly rowKey: EpPropMergeType<(new (...args: any[]) => string | number | symbol) | (() => KeyType) | (((new (...args: any[]) => string | number | symbol) | (() => KeyType)) | null)[], unknown, unknown>;
|
||||
}, {}, {}, {}, string, _$vue.ComponentProvideOptions, true, {}, any>;
|
||||
type TableV2RowCellRenderParam = {
|
||||
column: TableV2RowProps['columns'][number];
|
||||
columns: TableV2RowProps['columns'];
|
||||
columnIndex: number;
|
||||
depth: number;
|
||||
style: CSSProperties;
|
||||
rowData: any;
|
||||
rowIndex: number;
|
||||
isScrolling: boolean;
|
||||
expandIconProps?: {
|
||||
rowData: any;
|
||||
rowIndex: number;
|
||||
onExpand: (expand: boolean) => void;
|
||||
};
|
||||
};
|
||||
type TableV2RowSlotProps = {
|
||||
cells: VNode[];
|
||||
columns: TableV2RowProps['columns'];
|
||||
depth: number;
|
||||
style: TableV2RowProps['style'];
|
||||
rowData: any;
|
||||
rowIndex: number;
|
||||
isScrolling: boolean;
|
||||
};
|
||||
//#endregion
|
||||
export { TableV2RowCellRenderParam, TableV2RowSlotProps, TableV2Row as default };
|
||||
+154
@@ -0,0 +1,154 @@
|
||||
require("../../../../_virtual/_rolldown/runtime.js");
|
||||
const require_types = require("../../../../utils/types.js");
|
||||
const require_private = require("../private.js");
|
||||
const require_tokens = require("../tokens.js");
|
||||
const require_row = require("../row.js");
|
||||
let vue = require("vue");
|
||||
let _vue_shared = require("@vue/shared");
|
||||
//#region ../../packages/components/table-v2/src/components/row.tsx
|
||||
const useTableRow = (props) => {
|
||||
const { isScrolling } = (0, vue.inject)(require_tokens.TableV2InjectionKey);
|
||||
const measured = (0, vue.ref)(false);
|
||||
const rowRef = (0, vue.ref)();
|
||||
const measurable = (0, vue.computed)(() => {
|
||||
return require_types.isNumber(props.estimatedRowHeight) && props.rowIndex >= 0;
|
||||
});
|
||||
const doMeasure = (isInit = false) => {
|
||||
const $rowRef = (0, vue.unref)(rowRef);
|
||||
if (!$rowRef) return;
|
||||
const { columns, onRowHeightChange, rowKey, rowIndex, style } = props;
|
||||
const { height } = $rowRef.getBoundingClientRect();
|
||||
measured.value = true;
|
||||
(0, vue.nextTick)(() => {
|
||||
if (isInit || height !== Number.parseInt(style.height)) {
|
||||
const firstColumn = columns[0];
|
||||
const isPlaceholder = firstColumn?.placeholderSign === require_private.placeholderSign;
|
||||
onRowHeightChange?.({
|
||||
rowKey,
|
||||
height,
|
||||
rowIndex
|
||||
}, firstColumn && !isPlaceholder && firstColumn.fixed);
|
||||
}
|
||||
});
|
||||
};
|
||||
const eventHandlers = (0, vue.computed)(() => {
|
||||
const { rowData, rowIndex, rowKey, onRowHover } = props;
|
||||
const handlers = props.rowEventHandlers || {};
|
||||
const eventHandlers = {};
|
||||
Object.entries(handlers).forEach(([eventName, handler]) => {
|
||||
if ((0, _vue_shared.isFunction)(handler)) eventHandlers[eventName] = (event) => {
|
||||
handler({
|
||||
event,
|
||||
rowData,
|
||||
rowIndex,
|
||||
rowKey
|
||||
});
|
||||
};
|
||||
});
|
||||
if (onRowHover) [{
|
||||
name: "onMouseleave",
|
||||
hovered: false
|
||||
}, {
|
||||
name: "onMouseenter",
|
||||
hovered: true
|
||||
}].forEach(({ name, hovered }) => {
|
||||
const existedHandler = eventHandlers[name];
|
||||
eventHandlers[name] = (event) => {
|
||||
onRowHover({
|
||||
event,
|
||||
hovered,
|
||||
rowData,
|
||||
rowIndex,
|
||||
rowKey
|
||||
});
|
||||
existedHandler?.(event);
|
||||
};
|
||||
});
|
||||
return eventHandlers;
|
||||
});
|
||||
const onExpand = (expanded) => {
|
||||
const { onRowExpand, rowData, rowIndex, rowKey } = props;
|
||||
onRowExpand?.({
|
||||
expanded,
|
||||
rowData,
|
||||
rowIndex,
|
||||
rowKey
|
||||
});
|
||||
};
|
||||
(0, vue.onMounted)(() => {
|
||||
if ((0, vue.unref)(measurable)) doMeasure(true);
|
||||
});
|
||||
return {
|
||||
isScrolling,
|
||||
measurable,
|
||||
measured,
|
||||
rowRef,
|
||||
eventHandlers,
|
||||
onExpand
|
||||
};
|
||||
};
|
||||
const TableV2Row = /* @__PURE__ */ (0, vue.defineComponent)({
|
||||
name: "ElTableV2TableRow",
|
||||
props: require_row.tableV2RowProps,
|
||||
setup(props, { expose, slots, attrs }) {
|
||||
const { eventHandlers, isScrolling, measurable, measured, rowRef, onExpand } = useTableRow(props);
|
||||
expose({
|
||||
/**
|
||||
* @description manually dispatching expand action on row.
|
||||
*/
|
||||
onExpand });
|
||||
return () => {
|
||||
const { columns, columnsStyles, expandColumnKey, depth, rowData, rowIndex, style } = props;
|
||||
let ColumnCells = columns.map((column, columnIndex) => {
|
||||
const expandable = (0, _vue_shared.isArray)(rowData.children) && rowData.children.length > 0 && column.key === expandColumnKey;
|
||||
return slots.cell({
|
||||
column,
|
||||
columns,
|
||||
columnIndex,
|
||||
depth,
|
||||
style: columnsStyles[column.key],
|
||||
rowData,
|
||||
rowIndex,
|
||||
isScrolling: (0, vue.unref)(isScrolling),
|
||||
expandIconProps: expandable ? {
|
||||
rowData,
|
||||
rowIndex,
|
||||
onExpand
|
||||
} : void 0
|
||||
});
|
||||
});
|
||||
if (slots.row) ColumnCells = slots.row({
|
||||
cells: ColumnCells.map((node) => {
|
||||
if ((0, _vue_shared.isArray)(node) && node.length === 1) return node[0];
|
||||
return node;
|
||||
}),
|
||||
style,
|
||||
columns,
|
||||
depth,
|
||||
rowData,
|
||||
rowIndex,
|
||||
isScrolling: (0, vue.unref)(isScrolling)
|
||||
});
|
||||
if ((0, vue.unref)(measurable)) {
|
||||
const { height, ...exceptHeightStyle } = style || {};
|
||||
const _measured = (0, vue.unref)(measured);
|
||||
return (0, vue.createVNode)("div", (0, vue.mergeProps)({
|
||||
"ref": rowRef,
|
||||
"class": props.class,
|
||||
"style": _measured ? style : exceptHeightStyle,
|
||||
"role": "row"
|
||||
}, attrs, (0, vue.unref)(eventHandlers)), [ColumnCells]);
|
||||
}
|
||||
return (0, vue.createVNode)("div", (0, vue.mergeProps)(attrs, {
|
||||
"ref": rowRef,
|
||||
"class": props.class,
|
||||
"style": style,
|
||||
"role": "row"
|
||||
}, (0, vue.unref)(eventHandlers)), [ColumnCells]);
|
||||
};
|
||||
}
|
||||
});
|
||||
//#endregion
|
||||
exports.default = TableV2Row;
|
||||
|
||||
//# sourceMappingURL=row.js.map
|
||||
Generated
Vendored
+1
File diff suppressed because one or more lines are too long
Generated
Vendored
+12
@@ -0,0 +1,12 @@
|
||||
import { SortOrder } from "../constants.js";
|
||||
import { FunctionalComponent } from "vue";
|
||||
|
||||
//#region ../../packages/components/table-v2/src/components/sort-icon.d.ts
|
||||
type SortIconProps = {
|
||||
sortOrder: SortOrder;
|
||||
ariaLabel?: string;
|
||||
class?: JSX.IntrinsicAttributes['class'];
|
||||
};
|
||||
declare const SortIcon: FunctionalComponent<SortIconProps>;
|
||||
//#endregion
|
||||
export { SortIconProps, SortIcon as default };
|
||||
Generated
Vendored
+18
@@ -0,0 +1,18 @@
|
||||
require("../../../../_virtual/_rolldown/runtime.js");
|
||||
const require_index = require("../../../icon/index.js");
|
||||
require("../constants.js");
|
||||
let _element_plus_icons_vue = require("@element-plus/icons-vue");
|
||||
let vue = require("vue");
|
||||
//#region ../../packages/components/table-v2/src/components/sort-icon.tsx
|
||||
const SortIcon = (props) => {
|
||||
const { sortOrder } = props;
|
||||
return (0, vue.createVNode)("button", {
|
||||
"type": "button",
|
||||
"aria-label": props.ariaLabel,
|
||||
"class": props.class
|
||||
}, [(0, vue.createVNode)(require_index.ElIcon, { "size": 14 }, { default: () => [sortOrder === "asc" ? (0, vue.createVNode)(_element_plus_icons_vue.SortUp, null, null) : (0, vue.createVNode)(_element_plus_icons_vue.SortDown, null, null)] })]);
|
||||
};
|
||||
//#endregion
|
||||
exports.default = SortIcon;
|
||||
|
||||
//# sourceMappingURL=sort-icon.js.map
|
||||
Generated
Vendored
+1
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"sort-icon.js","names":["ElIcon","SortDown","SortUp","SortOrder","SortIcon","props","sortOrder","_createVNode","ariaLabel","class","default","ASC"],"sources":["../../../../../../../packages/components/table-v2/src/components/sort-icon.tsx"],"sourcesContent":["import ElIcon from '@element-plus/components/icon'\nimport { SortDown, SortUp } from '@element-plus/icons-vue'\nimport { SortOrder } from '../constants'\n\nimport type { FunctionalComponent } from 'vue'\n\nexport type SortIconProps = {\n sortOrder: SortOrder\n ariaLabel?: string\n class?: JSX.IntrinsicAttributes['class']\n}\n\nconst SortIcon: FunctionalComponent<SortIconProps> = (props) => {\n const { sortOrder } = props\n\n return (\n <button type=\"button\" aria-label={props.ariaLabel} class={props.class}>\n <ElIcon size={14}>\n {sortOrder === SortOrder.ASC ? <SortUp /> : <SortDown />}\n </ElIcon>\n </button>\n )\n}\n\nexport default SortIcon\n"],"mappings":";;;;;;AAYA,MAAMI,YAAgDC,UAAU;CAC9D,MAAM,EAAEC,cAAcD;CAEtB,QAAA,GAAA,IAAA,aAAA,UAAA;EAAA,QAAA;EAAA,cACoCA,MAAMG;EAAS,SAASH,MAAMI;EAAK,EAAA,EAAA,GAAA,IAAA,aAAAT,cAAAA,QAAA,EAAA,QACrD,IAAE,EAAA,EAAAU,eAAA,CACbJ,cAAAA,SAAAA,GAAAA,IAAAA,aAA2BJ,wBAAAA,QAAA,MAAA,KAAA,IAAA,GAAA,IAAA,aAAAD,wBAAAA,UAAA,MAAA,KAA4B,CAAA,EAAA,CAAA,CAAA,CAAA"}
|
||||
Generated
Vendored
+8
@@ -0,0 +1,8 @@
|
||||
import { Alignment } from "../../../virtual-list/src/types.js";
|
||||
import { ScrollPos, useScrollbar } from "./use-scrollbar.js";
|
||||
import { UseColumnsReturn, useColumns } from "./use-columns.js";
|
||||
import { UseRowReturn, useRow } from "./use-row.js";
|
||||
import { UseDataReturn, useData } from "./use-data.js";
|
||||
import { UseStyleReturn, useStyles } from "./use-styles.js";
|
||||
import { useAutoResize } from "./use-auto-resize.js";
|
||||
export { ScrollPos, Alignment as ScrollStrategy, UseColumnsReturn, UseDataReturn, UseRowReturn, UseStyleReturn, useAutoResize, useColumns, useData, useRow, useScrollbar, useStyles };
|
||||
Generated
Vendored
+13
@@ -0,0 +1,13 @@
|
||||
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
||||
const require_use_columns = require("./use-columns.js");
|
||||
const require_use_scrollbar = require("./use-scrollbar.js");
|
||||
const require_use_row = require("./use-row.js");
|
||||
const require_use_data = require("./use-data.js");
|
||||
const require_use_styles = require("./use-styles.js");
|
||||
const require_use_auto_resize = require("./use-auto-resize.js");
|
||||
exports.useAutoResize = require_use_auto_resize.useAutoResize;
|
||||
exports.useColumns = require_use_columns.useColumns;
|
||||
exports.useData = require_use_data.useData;
|
||||
exports.useRow = require_use_row.useRow;
|
||||
exports.useScrollbar = require_use_scrollbar.useScrollbar;
|
||||
exports.useStyles = require_use_styles.useStyles;
|
||||
Generated
Vendored
+11
@@ -0,0 +1,11 @@
|
||||
import { AutoResizerProps } from "../auto-resizer.js";
|
||||
import * as _$vue from "vue";
|
||||
|
||||
//#region ../../packages/components/table-v2/src/composables/use-auto-resize.d.ts
|
||||
declare const useAutoResize: (props: AutoResizerProps) => {
|
||||
sizer: _$vue.Ref<HTMLElement | undefined, HTMLElement | undefined>;
|
||||
width: _$vue.Ref<number, number>;
|
||||
height: _$vue.Ref<number, number>;
|
||||
};
|
||||
//#endregion
|
||||
export { useAutoResize };
|
||||
Generated
Vendored
+41
@@ -0,0 +1,41 @@
|
||||
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
||||
require("../../../../_virtual/_rolldown/runtime.js");
|
||||
let _vueuse_core = require("@vueuse/core");
|
||||
let vue = require("vue");
|
||||
//#region ../../packages/components/table-v2/src/composables/use-auto-resize.ts
|
||||
const useAutoResize = (props) => {
|
||||
const sizer = (0, vue.ref)();
|
||||
const width$ = (0, vue.ref)(0);
|
||||
const height$ = (0, vue.ref)(0);
|
||||
let resizerStopper;
|
||||
(0, vue.onMounted)(() => {
|
||||
resizerStopper = (0, _vueuse_core.useResizeObserver)(sizer, ([entry]) => {
|
||||
const { width, height } = entry.contentRect;
|
||||
const { paddingLeft, paddingRight, paddingTop, paddingBottom } = getComputedStyle(entry.target);
|
||||
const left = Number.parseInt(paddingLeft) || 0;
|
||||
const right = Number.parseInt(paddingRight) || 0;
|
||||
const top = Number.parseInt(paddingTop) || 0;
|
||||
const bottom = Number.parseInt(paddingBottom) || 0;
|
||||
width$.value = width - left - right;
|
||||
height$.value = height - top - bottom;
|
||||
}).stop;
|
||||
});
|
||||
(0, vue.onBeforeUnmount)(() => {
|
||||
resizerStopper?.();
|
||||
});
|
||||
(0, vue.watch)([width$, height$], ([width, height]) => {
|
||||
props.onResize?.({
|
||||
width,
|
||||
height
|
||||
});
|
||||
});
|
||||
return {
|
||||
sizer,
|
||||
width: width$,
|
||||
height: height$
|
||||
};
|
||||
};
|
||||
//#endregion
|
||||
exports.useAutoResize = useAutoResize;
|
||||
|
||||
//# sourceMappingURL=use-auto-resize.js.map
|
||||
Generated
Vendored
+1
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"use-auto-resize.js","names":[],"sources":["../../../../../../../packages/components/table-v2/src/composables/use-auto-resize.ts"],"sourcesContent":["import { onBeforeUnmount, onMounted, ref, watch } from 'vue'\nimport { useResizeObserver } from '@vueuse/core'\n\nimport type { AutoResizerProps } from '../auto-resizer'\n\nconst useAutoResize = (props: AutoResizerProps) => {\n const sizer = ref<HTMLElement>()\n const width$ = ref(0)\n const height$ = ref(0)\n\n let resizerStopper: ReturnType<typeof useResizeObserver>['stop']\n onMounted(() => {\n resizerStopper = useResizeObserver(sizer, ([entry]) => {\n const { width, height } = entry.contentRect\n const { paddingLeft, paddingRight, paddingTop, paddingBottom } =\n getComputedStyle(entry.target)\n\n const left = Number.parseInt(paddingLeft) || 0\n const right = Number.parseInt(paddingRight) || 0\n const top = Number.parseInt(paddingTop) || 0\n const bottom = Number.parseInt(paddingBottom) || 0\n\n width$.value = width - left - right\n height$.value = height - top - bottom\n }).stop\n })\n\n onBeforeUnmount(() => {\n resizerStopper?.()\n })\n\n watch([width$, height$], ([width, height]) => {\n props.onResize?.({\n width,\n height,\n })\n })\n\n return {\n sizer,\n width: width$,\n height: height$,\n }\n}\n\nexport { useAutoResize }\n"],"mappings":";;;;;AAKA,MAAM,iBAAiB,UAA4B;CACjD,MAAM,SAAA,GAAA,IAAA,MAA0B;CAChC,MAAM,UAAA,GAAA,IAAA,KAAa,EAAE;CACrB,MAAM,WAAA,GAAA,IAAA,KAAc,EAAE;CAEtB,IAAI;CACJ,CAAA,GAAA,IAAA,iBAAgB;EACd,kBAAA,GAAA,aAAA,mBAAmC,QAAQ,CAAC,WAAW;GACrD,MAAM,EAAE,OAAO,WAAW,MAAM;GAChC,MAAM,EAAE,aAAa,cAAc,YAAY,kBAC7C,iBAAiB,MAAM,OAAO;GAEhC,MAAM,OAAO,OAAO,SAAS,YAAY,IAAI;GAC7C,MAAM,QAAQ,OAAO,SAAS,aAAa,IAAI;GAC/C,MAAM,MAAM,OAAO,SAAS,WAAW,IAAI;GAC3C,MAAM,SAAS,OAAO,SAAS,cAAc,IAAI;GAEjD,OAAO,QAAQ,QAAQ,OAAO;GAC9B,QAAQ,QAAQ,SAAS,MAAM;IAC/B,CAAC;GACH;CAEF,CAAA,GAAA,IAAA,uBAAsB;EACpB,kBAAkB;GAClB;CAEF,CAAA,GAAA,IAAA,OAAM,CAAC,QAAQ,QAAQ,GAAG,CAAC,OAAO,YAAY;EAC5C,MAAM,WAAW;GACf;GACA;GACD,CAAC;GACF;CAEF,OAAO;EACL;EACA,OAAO;EACP,QAAQ;EACT"}
|
||||
Generated
Vendored
+132
@@ -0,0 +1,132 @@
|
||||
import { Alignment, AnyColumns, CellRenderer, ClassNameGetter, Column, FixedDirection, HeaderCellRenderer, HeaderClassGetter, KeyType } from "../types.js";
|
||||
import { TableV2Props } from "../table.js";
|
||||
import * as _$vue from "vue";
|
||||
import { CSSProperties, Ref } from "vue";
|
||||
|
||||
//#region ../../packages/components/table-v2/src/composables/use-columns.d.ts
|
||||
declare function useColumns(props: TableV2Props, columns: Ref<AnyColumns>, fixed: Ref<boolean>): {
|
||||
columns: _$vue.ComputedRef<{
|
||||
key: KeyType;
|
||||
align?: Alignment;
|
||||
class?: string | ClassNameGetter<any> | undefined;
|
||||
dataKey?: KeyType;
|
||||
fixed?: true | FixedDirection;
|
||||
flexGrow?: CSSProperties["flexGrow"];
|
||||
flexShrink?: CSSProperties["flexShrink"];
|
||||
title?: string;
|
||||
hidden?: boolean;
|
||||
headerClass?: string | HeaderClassGetter<any> | undefined;
|
||||
maxWidth?: number;
|
||||
minWidth?: number;
|
||||
style?: CSSProperties;
|
||||
sortable?: boolean;
|
||||
width: number;
|
||||
cellRenderer?: CellRenderer<any> | undefined;
|
||||
headerCellRenderer?: HeaderCellRenderer<any> | undefined;
|
||||
}[]>;
|
||||
columnsStyles: _$vue.ComputedRef<Record<KeyType, CSSProperties>>;
|
||||
columnsTotalWidth: _$vue.ComputedRef<number>;
|
||||
fixedColumnsOnLeft: _$vue.ComputedRef<{
|
||||
key: KeyType;
|
||||
align?: Alignment;
|
||||
class?: string | ClassNameGetter<any> | undefined;
|
||||
dataKey?: KeyType;
|
||||
fixed?: true | FixedDirection;
|
||||
flexGrow?: CSSProperties["flexGrow"];
|
||||
flexShrink?: CSSProperties["flexShrink"];
|
||||
title?: string;
|
||||
hidden?: boolean;
|
||||
headerClass?: string | HeaderClassGetter<any> | undefined;
|
||||
maxWidth?: number;
|
||||
minWidth?: number;
|
||||
style?: CSSProperties;
|
||||
sortable?: boolean;
|
||||
width: number;
|
||||
cellRenderer?: CellRenderer<any> | undefined;
|
||||
headerCellRenderer?: HeaderCellRenderer<any> | undefined;
|
||||
}[]>;
|
||||
fixedColumnsOnRight: _$vue.ComputedRef<{
|
||||
key: KeyType;
|
||||
align?: Alignment;
|
||||
class?: string | ClassNameGetter<any> | undefined;
|
||||
dataKey?: KeyType;
|
||||
fixed?: true | FixedDirection;
|
||||
flexGrow?: CSSProperties["flexGrow"];
|
||||
flexShrink?: CSSProperties["flexShrink"];
|
||||
title?: string;
|
||||
hidden?: boolean;
|
||||
headerClass?: string | HeaderClassGetter<any> | undefined;
|
||||
maxWidth?: number;
|
||||
minWidth?: number;
|
||||
style?: CSSProperties;
|
||||
sortable?: boolean;
|
||||
width: number;
|
||||
cellRenderer?: CellRenderer<any> | undefined;
|
||||
headerCellRenderer?: HeaderCellRenderer<any> | undefined;
|
||||
}[]>;
|
||||
hasFixedColumns: _$vue.ComputedRef<number>;
|
||||
mainColumns: _$vue.ComputedRef<AnyColumns>;
|
||||
normalColumns: _$vue.ComputedRef<{
|
||||
key: KeyType;
|
||||
align?: Alignment;
|
||||
class?: string | ClassNameGetter<any> | undefined;
|
||||
dataKey?: KeyType;
|
||||
fixed?: true | FixedDirection;
|
||||
flexGrow?: CSSProperties["flexGrow"];
|
||||
flexShrink?: CSSProperties["flexShrink"];
|
||||
title?: string;
|
||||
hidden?: boolean;
|
||||
headerClass?: string | HeaderClassGetter<any> | undefined;
|
||||
maxWidth?: number;
|
||||
minWidth?: number;
|
||||
style?: CSSProperties;
|
||||
sortable?: boolean;
|
||||
width: number;
|
||||
cellRenderer?: CellRenderer<any> | undefined;
|
||||
headerCellRenderer?: HeaderCellRenderer<any> | undefined;
|
||||
}[]>;
|
||||
visibleColumns: _$vue.ComputedRef<{
|
||||
key: KeyType;
|
||||
align?: Alignment;
|
||||
class?: string | ClassNameGetter<any> | undefined;
|
||||
dataKey?: KeyType;
|
||||
fixed?: true | FixedDirection;
|
||||
flexGrow?: CSSProperties["flexGrow"];
|
||||
flexShrink?: CSSProperties["flexShrink"];
|
||||
title?: string;
|
||||
hidden?: boolean;
|
||||
headerClass?: string | HeaderClassGetter<any> | undefined;
|
||||
maxWidth?: number;
|
||||
minWidth?: number;
|
||||
style?: CSSProperties;
|
||||
sortable?: boolean;
|
||||
width: number;
|
||||
cellRenderer?: CellRenderer<any> | undefined;
|
||||
headerCellRenderer?: HeaderCellRenderer<any> | undefined;
|
||||
}[]>;
|
||||
getColumn: (key: KeyType) => {
|
||||
key: KeyType;
|
||||
align?: Alignment;
|
||||
class?: string | ClassNameGetter<any> | undefined;
|
||||
dataKey?: KeyType;
|
||||
fixed?: true | FixedDirection;
|
||||
flexGrow?: CSSProperties["flexGrow"];
|
||||
flexShrink?: CSSProperties["flexShrink"];
|
||||
title?: string;
|
||||
hidden?: boolean;
|
||||
headerClass?: string | HeaderClassGetter<any> | undefined;
|
||||
maxWidth?: number;
|
||||
minWidth?: number;
|
||||
style?: CSSProperties;
|
||||
sortable?: boolean;
|
||||
width: number;
|
||||
cellRenderer?: CellRenderer<any> | undefined;
|
||||
headerCellRenderer?: HeaderCellRenderer<any> | undefined;
|
||||
} | undefined;
|
||||
getColumnStyle: (key: KeyType) => CSSProperties;
|
||||
updateColumnWidth: (column: Column<any>, width: number) => void;
|
||||
onColumnSorted: (e: MouseEvent) => void;
|
||||
};
|
||||
type UseColumnsReturn = ReturnType<typeof useColumns>;
|
||||
//#endregion
|
||||
export { UseColumnsReturn, useColumns };
|
||||
Generated
Vendored
+92
@@ -0,0 +1,92 @@
|
||||
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
||||
require("../../../../_virtual/_rolldown/runtime.js");
|
||||
const require_constants = require("../constants.js");
|
||||
const require_private = require("../private.js");
|
||||
const require_utils = require("./utils.js");
|
||||
let vue = require("vue");
|
||||
let _vue_shared = require("@vue/shared");
|
||||
//#region ../../packages/components/table-v2/src/composables/use-columns.ts
|
||||
function useColumns(props, columns, fixed) {
|
||||
const _columns = (0, vue.computed)(() => (0, vue.unref)(columns).map((column, index) => ({
|
||||
...column,
|
||||
key: column.key ?? column.dataKey ?? index
|
||||
})));
|
||||
const visibleColumns = (0, vue.computed)(() => {
|
||||
return (0, vue.unref)(_columns).filter((column) => !column.hidden);
|
||||
});
|
||||
const fixedColumnsOnLeft = (0, vue.computed)(() => (0, vue.unref)(visibleColumns).filter((column) => column.fixed === "left" || column.fixed === true));
|
||||
const fixedColumnsOnRight = (0, vue.computed)(() => (0, vue.unref)(visibleColumns).filter((column) => column.fixed === "right"));
|
||||
const normalColumns = (0, vue.computed)(() => (0, vue.unref)(visibleColumns).filter((column) => !column.fixed));
|
||||
const mainColumns = (0, vue.computed)(() => {
|
||||
const ret = [];
|
||||
(0, vue.unref)(fixedColumnsOnLeft).forEach((column) => {
|
||||
ret.push({
|
||||
...column,
|
||||
placeholderSign: require_private.placeholderSign
|
||||
});
|
||||
});
|
||||
(0, vue.unref)(normalColumns).forEach((column) => {
|
||||
ret.push(column);
|
||||
});
|
||||
(0, vue.unref)(fixedColumnsOnRight).forEach((column) => {
|
||||
ret.push({
|
||||
...column,
|
||||
placeholderSign: require_private.placeholderSign
|
||||
});
|
||||
});
|
||||
return ret;
|
||||
});
|
||||
const hasFixedColumns = (0, vue.computed)(() => {
|
||||
return (0, vue.unref)(fixedColumnsOnLeft).length || (0, vue.unref)(fixedColumnsOnRight).length;
|
||||
});
|
||||
const columnsStyles = (0, vue.computed)(() => {
|
||||
return (0, vue.unref)(_columns).reduce((style, column) => {
|
||||
style[column.key] = require_utils.calcColumnStyle(column, (0, vue.unref)(fixed), props.fixed);
|
||||
return style;
|
||||
}, {});
|
||||
});
|
||||
const columnsTotalWidth = (0, vue.computed)(() => {
|
||||
return (0, vue.unref)(visibleColumns).reduce((width, column) => width + column.width, 0);
|
||||
});
|
||||
const getColumn = (key) => {
|
||||
return (0, vue.unref)(_columns).find((column) => column.key === key);
|
||||
};
|
||||
const getColumnStyle = (key) => {
|
||||
return (0, vue.unref)(columnsStyles)[key];
|
||||
};
|
||||
const updateColumnWidth = (column, width) => {
|
||||
column.width = width;
|
||||
};
|
||||
function onColumnSorted(e) {
|
||||
const { key } = e.currentTarget.dataset;
|
||||
if (!key) return;
|
||||
const { sortState, sortBy } = props;
|
||||
let order = "asc";
|
||||
if ((0, _vue_shared.isObject)(sortState)) order = require_constants.oppositeOrderMap[sortState[key]];
|
||||
else order = require_constants.oppositeOrderMap[sortBy.order];
|
||||
props.onColumnSort?.({
|
||||
column: getColumn(key),
|
||||
key,
|
||||
order
|
||||
});
|
||||
}
|
||||
return {
|
||||
columns: _columns,
|
||||
columnsStyles,
|
||||
columnsTotalWidth,
|
||||
fixedColumnsOnLeft,
|
||||
fixedColumnsOnRight,
|
||||
hasFixedColumns,
|
||||
mainColumns,
|
||||
normalColumns,
|
||||
visibleColumns,
|
||||
getColumn,
|
||||
getColumnStyle,
|
||||
updateColumnWidth,
|
||||
onColumnSorted
|
||||
};
|
||||
}
|
||||
//#endregion
|
||||
exports.useColumns = useColumns;
|
||||
|
||||
//# sourceMappingURL=use-columns.js.map
|
||||
Generated
Vendored
+1
File diff suppressed because one or more lines are too long
Generated
Vendored
+22
@@ -0,0 +1,22 @@
|
||||
import { KeyType } from "../types.js";
|
||||
import { TableV2Props } from "../table.js";
|
||||
import { UseRowReturn } from "./use-row.js";
|
||||
import * as _$vue from "vue";
|
||||
|
||||
//#region ../../packages/components/table-v2/src/composables/use-data.d.ts
|
||||
type UseDataProps = {
|
||||
expandedRowKeys: UseRowReturn['expandedRowKeys'];
|
||||
lastRenderedRowIndex: UseRowReturn['lastRenderedRowIndex'];
|
||||
resetAfterIndex: UseRowReturn['resetAfterIndex'];
|
||||
};
|
||||
declare const useData: (props: TableV2Props, {
|
||||
expandedRowKeys,
|
||||
lastRenderedRowIndex,
|
||||
resetAfterIndex
|
||||
}: UseDataProps) => {
|
||||
data: _$vue.ComputedRef<any[]>;
|
||||
depthMap: _$vue.Ref<Record<KeyType, number>, Record<KeyType, number>>;
|
||||
};
|
||||
type UseDataReturn = ReturnType<typeof useData>;
|
||||
//#endregion
|
||||
export { UseDataReturn, useData };
|
||||
Generated
Vendored
+47
@@ -0,0 +1,47 @@
|
||||
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
||||
require("../../../../_virtual/_rolldown/runtime.js");
|
||||
let vue = require("vue");
|
||||
let _vue_shared = require("@vue/shared");
|
||||
//#region ../../packages/components/table-v2/src/composables/use-data.ts
|
||||
const useData = (props, { expandedRowKeys, lastRenderedRowIndex, resetAfterIndex }) => {
|
||||
const depthMap = (0, vue.ref)({});
|
||||
const flattenedData = (0, vue.computed)(() => {
|
||||
const depths = {};
|
||||
const { data, rowKey } = props;
|
||||
const _expandedRowKeys = (0, vue.unref)(expandedRowKeys);
|
||||
if (!_expandedRowKeys || !_expandedRowKeys.length) return data;
|
||||
const array = [];
|
||||
const keysSet = /* @__PURE__ */ new Set();
|
||||
_expandedRowKeys.forEach((x) => keysSet.add(x));
|
||||
let copy = data.slice();
|
||||
copy.forEach((x) => depths[x[rowKey]] = 0);
|
||||
while (copy.length > 0) {
|
||||
const item = copy.shift();
|
||||
array.push(item);
|
||||
if (keysSet.has(item[rowKey]) && (0, _vue_shared.isArray)(item.children) && item.children.length > 0) {
|
||||
copy = [...item.children, ...copy];
|
||||
item.children.forEach((child) => depths[child[rowKey]] = depths[item[rowKey]] + 1);
|
||||
}
|
||||
}
|
||||
depthMap.value = depths;
|
||||
return array;
|
||||
});
|
||||
const data = (0, vue.computed)(() => {
|
||||
const { data, expandColumnKey } = props;
|
||||
return expandColumnKey ? (0, vue.unref)(flattenedData) : data;
|
||||
});
|
||||
(0, vue.watch)(data, (val, prev) => {
|
||||
if (val !== prev) {
|
||||
lastRenderedRowIndex.value = -1;
|
||||
resetAfterIndex(0, true);
|
||||
}
|
||||
});
|
||||
return {
|
||||
data,
|
||||
depthMap
|
||||
};
|
||||
};
|
||||
//#endregion
|
||||
exports.useData = useData;
|
||||
|
||||
//# sourceMappingURL=use-data.js.map
|
||||
Generated
Vendored
+1
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"use-data.js","names":[],"sources":["../../../../../../../packages/components/table-v2/src/composables/use-data.ts"],"sourcesContent":["import { computed, ref, unref, watch } from 'vue'\nimport { isArray } from '@element-plus/utils'\n\nimport type { TableV2Props } from '../table'\nimport type { KeyType } from '../types'\nimport type { UseRowReturn } from './use-row'\n\ntype UseDataProps = {\n expandedRowKeys: UseRowReturn['expandedRowKeys']\n lastRenderedRowIndex: UseRowReturn['lastRenderedRowIndex']\n resetAfterIndex: UseRowReturn['resetAfterIndex']\n}\n\nexport const useData = (\n props: TableV2Props,\n { expandedRowKeys, lastRenderedRowIndex, resetAfterIndex }: UseDataProps\n) => {\n const depthMap = ref<Record<KeyType, number>>({})\n\n const flattenedData = computed(() => {\n const depths: Record<KeyType, number> = {}\n const { data, rowKey } = props\n\n const _expandedRowKeys = unref(expandedRowKeys)\n\n if (!_expandedRowKeys || !_expandedRowKeys.length) return data\n\n const array: any[] = []\n const keysSet = new Set()\n _expandedRowKeys.forEach((x) => keysSet.add(x))\n\n let copy: any[] = data.slice()\n copy.forEach((x) => (depths[x[rowKey]] = 0))\n while (copy.length > 0) {\n const item = copy.shift()!\n\n array.push(item)\n if (\n keysSet.has(item[rowKey]) &&\n isArray(item.children) &&\n item.children.length > 0\n ) {\n copy = [...item.children, ...copy]\n item.children.forEach(\n (child: any) => (depths[child[rowKey]] = depths[item[rowKey]] + 1)\n )\n }\n }\n\n depthMap.value = depths\n return array\n })\n\n const data = computed(() => {\n const { data, expandColumnKey } = props\n return expandColumnKey ? unref(flattenedData) : data\n })\n\n watch(data, (val, prev) => {\n if (val !== prev) {\n lastRenderedRowIndex.value = -1\n resetAfterIndex(0, true)\n }\n })\n\n return {\n data,\n depthMap,\n }\n}\n\nexport type UseDataReturn = ReturnType<typeof useData>\n"],"mappings":";;;;;AAaA,MAAa,WACX,OACA,EAAE,iBAAiB,sBAAsB,sBACtC;CACH,MAAM,YAAA,GAAA,IAAA,KAAwC,EAAE,CAAC;CAEjD,MAAM,iBAAA,GAAA,IAAA,gBAA+B;EACnC,MAAM,SAAkC,EAAE;EAC1C,MAAM,EAAE,MAAM,WAAW;EAEzB,MAAM,oBAAA,GAAA,IAAA,OAAyB,gBAAgB;EAE/C,IAAI,CAAC,oBAAoB,CAAC,iBAAiB,QAAQ,OAAO;EAE1D,MAAM,QAAe,EAAE;EACvB,MAAM,0BAAU,IAAI,KAAK;EACzB,iBAAiB,SAAS,MAAM,QAAQ,IAAI,EAAE,CAAC;EAE/C,IAAI,OAAc,KAAK,OAAO;EAC9B,KAAK,SAAS,MAAO,OAAO,EAAE,WAAW,EAAG;EAC5C,OAAO,KAAK,SAAS,GAAG;GACtB,MAAM,OAAO,KAAK,OAAO;GAEzB,MAAM,KAAK,KAAK;GAChB,IACE,QAAQ,IAAI,KAAK,QAAQ,KAAA,GAAA,YAAA,SACjB,KAAK,SAAS,IACtB,KAAK,SAAS,SAAS,GACvB;IACA,OAAO,CAAC,GAAG,KAAK,UAAU,GAAG,KAAK;IAClC,KAAK,SAAS,SACX,UAAgB,OAAO,MAAM,WAAW,OAAO,KAAK,WAAW,EACjE;;;EAIL,SAAS,QAAQ;EACjB,OAAO;GACP;CAEF,MAAM,QAAA,GAAA,IAAA,gBAAsB;EAC1B,MAAM,EAAE,MAAM,oBAAoB;EAClC,OAAO,mBAAA,GAAA,IAAA,OAAwB,cAAc,GAAG;GAChD;CAEF,CAAA,GAAA,IAAA,OAAM,OAAO,KAAK,SAAS;EACzB,IAAI,QAAQ,MAAM;GAChB,qBAAqB,QAAQ;GAC7B,gBAAgB,GAAG,KAAK;;GAE1B;CAEF,OAAO;EACL;EACA;EACD"}
|
||||
Generated
Vendored
+54
@@ -0,0 +1,54 @@
|
||||
import { UseNamespaceReturn } from "../../../../hooks/use-namespace/index.js";
|
||||
import { FixedDirection, KeyType } from "../types.js";
|
||||
import { onRowRenderedParams } from "../grid.js";
|
||||
import { TableV2Props } from "../table.js";
|
||||
import { TableGridInstance } from "../table-grid.js";
|
||||
import { RowExpandParams, RowHeightChangedParams, RowHoverParams } from "../row.js";
|
||||
import * as _$vue from "vue";
|
||||
import { ComponentInternalInstance, Ref, ShallowRef } from "vue";
|
||||
|
||||
//#region ../../packages/components/table-v2/src/composables/use-row.d.ts
|
||||
type Heights = Record<KeyType, number>;
|
||||
type GridInstanceRef = Ref<TableGridInstance | undefined>;
|
||||
type UseRowProps = {
|
||||
mainTableRef: GridInstanceRef;
|
||||
leftTableRef: GridInstanceRef;
|
||||
rightTableRef: GridInstanceRef;
|
||||
tableInstance: ComponentInternalInstance;
|
||||
ns: UseNamespaceReturn;
|
||||
isScrolling: ShallowRef<boolean>;
|
||||
};
|
||||
declare const useRow: (props: TableV2Props, {
|
||||
mainTableRef,
|
||||
leftTableRef,
|
||||
rightTableRef,
|
||||
tableInstance,
|
||||
ns,
|
||||
isScrolling
|
||||
}: UseRowProps) => {
|
||||
expandedRowKeys: Ref<KeyType[], KeyType[]>;
|
||||
lastRenderedRowIndex: Ref<number, number>;
|
||||
isDynamic: _$vue.ComputedRef<boolean>;
|
||||
isResetting: ShallowRef<boolean, boolean>;
|
||||
rowHeights: Ref<Heights, Heights>;
|
||||
resetAfterIndex: (index: number, forceUpdate?: boolean) => void;
|
||||
onRowExpanded: ({
|
||||
expanded,
|
||||
rowData,
|
||||
rowIndex,
|
||||
rowKey
|
||||
}: RowExpandParams) => void;
|
||||
onRowHovered: ({
|
||||
hovered,
|
||||
rowKey
|
||||
}: RowHoverParams) => void;
|
||||
onRowsRendered: (params: onRowRenderedParams) => void;
|
||||
onRowHeightChange: ({
|
||||
rowKey,
|
||||
height,
|
||||
rowIndex
|
||||
}: RowHeightChangedParams, fixedDir: FixedDirection) => void;
|
||||
};
|
||||
type UseRowReturn = ReturnType<typeof useRow>;
|
||||
//#endregion
|
||||
export { UseRowReturn, useRow };
|
||||
Generated
Vendored
+114
@@ -0,0 +1,114 @@
|
||||
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
||||
require("../../../../_virtual/_rolldown/runtime.js");
|
||||
const require_types = require("../../../../utils/types.js");
|
||||
require("../constants.js");
|
||||
let lodash_unified = require("lodash-unified");
|
||||
let vue = require("vue");
|
||||
//#region ../../packages/components/table-v2/src/composables/use-row.ts
|
||||
const useRow = (props, { mainTableRef, leftTableRef, rightTableRef, tableInstance, ns, isScrolling }) => {
|
||||
const vm = (0, vue.getCurrentInstance)();
|
||||
const { emit } = vm;
|
||||
const isResetting = (0, vue.shallowRef)(false);
|
||||
const expandedRowKeys = (0, vue.ref)(props.defaultExpandedRowKeys || []);
|
||||
const lastRenderedRowIndex = (0, vue.ref)(-1);
|
||||
const resetIndex = (0, vue.shallowRef)(null);
|
||||
const rowHeights = (0, vue.ref)({});
|
||||
const pendingRowHeights = (0, vue.ref)({});
|
||||
const leftTableHeights = (0, vue.shallowRef)({});
|
||||
const mainTableHeights = (0, vue.shallowRef)({});
|
||||
const rightTableHeights = (0, vue.shallowRef)({});
|
||||
const isDynamic = (0, vue.computed)(() => require_types.isNumber(props.estimatedRowHeight));
|
||||
function onRowsRendered(params) {
|
||||
props.onRowsRendered?.(params);
|
||||
if (params.rowCacheEnd > (0, vue.unref)(lastRenderedRowIndex)) lastRenderedRowIndex.value = params.rowCacheEnd;
|
||||
}
|
||||
function onRowHovered({ hovered, rowKey }) {
|
||||
if (isScrolling.value) return;
|
||||
tableInstance.vnode.el.querySelectorAll(`[rowkey="${String(rowKey)}"]`).forEach((row) => {
|
||||
if (hovered) row.classList.add(ns.is("hovered"));
|
||||
else row.classList.remove(ns.is("hovered"));
|
||||
});
|
||||
}
|
||||
function onRowExpanded({ expanded, rowData, rowIndex, rowKey }) {
|
||||
const _expandedRowKeys = [...(0, vue.unref)(expandedRowKeys)];
|
||||
const currentKeyIndex = _expandedRowKeys.indexOf(rowKey);
|
||||
if (expanded) {
|
||||
if (currentKeyIndex === -1) _expandedRowKeys.push(rowKey);
|
||||
} else if (currentKeyIndex > -1) _expandedRowKeys.splice(currentKeyIndex, 1);
|
||||
expandedRowKeys.value = _expandedRowKeys;
|
||||
emit("update:expandedRowKeys", _expandedRowKeys);
|
||||
props.onRowExpand?.({
|
||||
expanded,
|
||||
rowData,
|
||||
rowIndex,
|
||||
rowKey
|
||||
});
|
||||
props.onExpandedRowsChange?.(_expandedRowKeys);
|
||||
if (tableInstance.vnode.el.querySelector(`.${ns.is("hovered")}[rowkey="${String(rowKey)}"]`)) (0, vue.nextTick)(() => onRowHovered({
|
||||
hovered: true,
|
||||
rowKey
|
||||
}));
|
||||
}
|
||||
const flushingRowHeights = (0, lodash_unified.debounce)(() => {
|
||||
isResetting.value = true;
|
||||
rowHeights.value = {
|
||||
...(0, vue.unref)(rowHeights),
|
||||
...(0, vue.unref)(pendingRowHeights)
|
||||
};
|
||||
resetAfterIndex((0, vue.unref)(resetIndex), false);
|
||||
pendingRowHeights.value = {};
|
||||
resetIndex.value = null;
|
||||
mainTableRef.value?.forceUpdate();
|
||||
leftTableRef.value?.forceUpdate();
|
||||
rightTableRef.value?.forceUpdate();
|
||||
vm.proxy?.$forceUpdate();
|
||||
isResetting.value = false;
|
||||
}, 0);
|
||||
function resetAfterIndex(index, forceUpdate = false) {
|
||||
if (!(0, vue.unref)(isDynamic)) return;
|
||||
[
|
||||
mainTableRef,
|
||||
leftTableRef,
|
||||
rightTableRef
|
||||
].forEach((tableRef) => {
|
||||
const table = (0, vue.unref)(tableRef);
|
||||
if (table) table.resetAfterRowIndex(index, forceUpdate);
|
||||
});
|
||||
}
|
||||
function resetHeights(rowKey, height, rowIdx) {
|
||||
const resetIdx = (0, vue.unref)(resetIndex);
|
||||
if (resetIdx === null) resetIndex.value = rowIdx;
|
||||
else if (resetIdx > rowIdx) resetIndex.value = rowIdx;
|
||||
pendingRowHeights.value[rowKey] = height;
|
||||
}
|
||||
function onRowHeightChange({ rowKey, height, rowIndex }, fixedDir) {
|
||||
if (!fixedDir) mainTableHeights.value[rowKey] = height;
|
||||
else if (fixedDir === "right") rightTableHeights.value[rowKey] = height;
|
||||
else leftTableHeights.value[rowKey] = height;
|
||||
const maximumHeight = Math.max(...[
|
||||
leftTableHeights,
|
||||
rightTableHeights,
|
||||
mainTableHeights
|
||||
].map((records) => records.value[rowKey] || 0));
|
||||
if ((0, vue.unref)(rowHeights)[rowKey] !== maximumHeight) {
|
||||
resetHeights(rowKey, maximumHeight, rowIndex);
|
||||
flushingRowHeights();
|
||||
}
|
||||
}
|
||||
return {
|
||||
expandedRowKeys,
|
||||
lastRenderedRowIndex,
|
||||
isDynamic,
|
||||
isResetting,
|
||||
rowHeights,
|
||||
resetAfterIndex,
|
||||
onRowExpanded,
|
||||
onRowHovered,
|
||||
onRowsRendered,
|
||||
onRowHeightChange
|
||||
};
|
||||
};
|
||||
//#endregion
|
||||
exports.useRow = useRow;
|
||||
|
||||
//# sourceMappingURL=use-row.js.map
|
||||
Generated
Vendored
+1
File diff suppressed because one or more lines are too long
Generated
Vendored
+41
@@ -0,0 +1,41 @@
|
||||
import { Alignment } from "../../../virtual-list/src/types.js";
|
||||
import { TableV2Props } from "../table.js";
|
||||
import { TableGridInstance } from "../table-grid.js";
|
||||
import { Ref } from "vue";
|
||||
|
||||
//#region ../../packages/components/table-v2/src/composables/use-scrollbar.d.ts
|
||||
type ScrollPos = {
|
||||
scrollLeft: number;
|
||||
scrollTop: number;
|
||||
};
|
||||
type GridInstanceRef = Ref<TableGridInstance | undefined>;
|
||||
type UseScrollBarProps = {
|
||||
mainTableRef: GridInstanceRef;
|
||||
leftTableRef: GridInstanceRef;
|
||||
rightTableRef: GridInstanceRef;
|
||||
onMaybeEndReached: () => void;
|
||||
};
|
||||
declare const useScrollbar: (props: TableV2Props, {
|
||||
mainTableRef,
|
||||
leftTableRef,
|
||||
rightTableRef,
|
||||
onMaybeEndReached
|
||||
}: UseScrollBarProps) => {
|
||||
scrollPos: Ref<{
|
||||
scrollLeft: number;
|
||||
scrollTop: number;
|
||||
}, ScrollPos | {
|
||||
scrollLeft: number;
|
||||
scrollTop: number;
|
||||
}>;
|
||||
scrollTo: (params: ScrollPos) => void;
|
||||
scrollToLeft: (scrollLeft: number) => void;
|
||||
scrollToTop: (scrollTop: number) => void;
|
||||
scrollToRow: (row: number, strategy?: Alignment) => void;
|
||||
onScroll: (params: ScrollPos) => void;
|
||||
onVerticalScroll: ({
|
||||
scrollTop
|
||||
}: ScrollPos) => void;
|
||||
};
|
||||
//#endregion
|
||||
export { ScrollPos, type Alignment as ScrollStrategy, useScrollbar };
|
||||
Generated
Vendored
+55
@@ -0,0 +1,55 @@
|
||||
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
||||
require("../../../../_virtual/_rolldown/runtime.js");
|
||||
let vue = require("vue");
|
||||
//#region ../../packages/components/table-v2/src/composables/use-scrollbar.ts
|
||||
const useScrollbar = (props, { mainTableRef, leftTableRef, rightTableRef, onMaybeEndReached }) => {
|
||||
const scrollPos = (0, vue.ref)({
|
||||
scrollLeft: 0,
|
||||
scrollTop: 0
|
||||
});
|
||||
function doScroll(params) {
|
||||
const { scrollTop } = params;
|
||||
mainTableRef.value?.scrollTo(params);
|
||||
leftTableRef.value?.scrollToTop(scrollTop);
|
||||
rightTableRef.value?.scrollToTop(scrollTop);
|
||||
}
|
||||
function scrollTo(params) {
|
||||
scrollPos.value = params;
|
||||
doScroll(params);
|
||||
}
|
||||
function scrollToTop(scrollTop) {
|
||||
scrollPos.value.scrollTop = scrollTop;
|
||||
doScroll((0, vue.unref)(scrollPos));
|
||||
}
|
||||
function scrollToLeft(scrollLeft) {
|
||||
scrollPos.value.scrollLeft = scrollLeft;
|
||||
mainTableRef.value?.scrollTo?.((0, vue.unref)(scrollPos));
|
||||
}
|
||||
function onScroll(params) {
|
||||
scrollTo(params);
|
||||
props.onScroll?.(params);
|
||||
}
|
||||
function onVerticalScroll({ scrollTop }) {
|
||||
const { scrollTop: currentScrollTop } = (0, vue.unref)(scrollPos);
|
||||
if (scrollTop !== currentScrollTop) scrollToTop(scrollTop);
|
||||
}
|
||||
function scrollToRow(row, strategy = "auto") {
|
||||
mainTableRef.value?.scrollToRow(row, strategy);
|
||||
}
|
||||
(0, vue.watch)(() => (0, vue.unref)(scrollPos).scrollTop, (cur, prev) => {
|
||||
if (cur > prev) onMaybeEndReached();
|
||||
});
|
||||
return {
|
||||
scrollPos,
|
||||
scrollTo,
|
||||
scrollToLeft,
|
||||
scrollToTop,
|
||||
scrollToRow,
|
||||
onScroll,
|
||||
onVerticalScroll
|
||||
};
|
||||
};
|
||||
//#endregion
|
||||
exports.useScrollbar = useScrollbar;
|
||||
|
||||
//# sourceMappingURL=use-scrollbar.js.map
|
||||
Generated
Vendored
+1
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"use-scrollbar.js","names":[],"sources":["../../../../../../../packages/components/table-v2/src/composables/use-scrollbar.ts"],"sourcesContent":["import { ref, unref, watch } from 'vue'\n\nimport type { Ref } from 'vue'\nimport type { Alignment as ScrollStrategy } from '@element-plus/components/virtual-list'\nimport type { TableV2Props } from '../table'\nimport type { TableGridInstance } from '../table-grid'\n\nexport type ScrollPos = { scrollLeft: number; scrollTop: number }\ntype GridInstanceRef = Ref<TableGridInstance | undefined>\n\ntype UseScrollBarProps = {\n mainTableRef: GridInstanceRef\n leftTableRef: GridInstanceRef\n rightTableRef: GridInstanceRef\n\n onMaybeEndReached: () => void\n}\n\nexport type { ScrollStrategy }\n\nexport const useScrollbar = (\n props: TableV2Props,\n {\n mainTableRef,\n leftTableRef,\n rightTableRef,\n onMaybeEndReached,\n }: UseScrollBarProps\n) => {\n const scrollPos = ref<ScrollPos>({ scrollLeft: 0, scrollTop: 0 })\n\n function doScroll(params: ScrollPos) {\n const { scrollTop } = params\n\n mainTableRef.value?.scrollTo(params)\n leftTableRef.value?.scrollToTop(scrollTop)\n rightTableRef.value?.scrollToTop(scrollTop)\n }\n\n // methods\n function scrollTo(params: ScrollPos) {\n scrollPos.value = params\n\n doScroll(params)\n }\n\n function scrollToTop(scrollTop: number) {\n scrollPos.value.scrollTop = scrollTop\n\n doScroll(unref(scrollPos))\n }\n\n function scrollToLeft(scrollLeft: number) {\n scrollPos.value.scrollLeft = scrollLeft\n\n mainTableRef.value?.scrollTo?.(unref(scrollPos))\n }\n\n function onScroll(params: ScrollPos) {\n scrollTo(params)\n props.onScroll?.(params)\n }\n\n function onVerticalScroll({ scrollTop }: ScrollPos) {\n const { scrollTop: currentScrollTop } = unref(scrollPos)\n if (scrollTop !== currentScrollTop) scrollToTop(scrollTop)\n }\n\n function scrollToRow(row: number, strategy: ScrollStrategy = 'auto') {\n mainTableRef.value?.scrollToRow(row, strategy)\n }\n\n // When scrollTop changes, maybe reaching the bottom\n watch(\n () => unref(scrollPos).scrollTop,\n (cur, prev) => {\n if (cur > prev) onMaybeEndReached()\n }\n )\n\n return {\n scrollPos,\n\n scrollTo,\n scrollToLeft,\n scrollToTop,\n scrollToRow,\n onScroll,\n onVerticalScroll,\n }\n}\n"],"mappings":";;;;AAoBA,MAAa,gBACX,OACA,EACE,cACA,cACA,eACA,wBAEC;CACH,MAAM,aAAA,GAAA,IAAA,KAA2B;EAAE,YAAY;EAAG,WAAW;EAAG,CAAC;CAEjE,SAAS,SAAS,QAAmB;EACnC,MAAM,EAAE,cAAc;EAEtB,aAAa,OAAO,SAAS,OAAO;EACpC,aAAa,OAAO,YAAY,UAAU;EAC1C,cAAc,OAAO,YAAY,UAAU;;CAI7C,SAAS,SAAS,QAAmB;EACnC,UAAU,QAAQ;EAElB,SAAS,OAAO;;CAGlB,SAAS,YAAY,WAAmB;EACtC,UAAU,MAAM,YAAY;EAE5B,UAAA,GAAA,IAAA,OAAe,UAAU,CAAC;;CAG5B,SAAS,aAAa,YAAoB;EACxC,UAAU,MAAM,aAAa;EAE7B,aAAa,OAAO,YAAA,GAAA,IAAA,OAAiB,UAAU,CAAC;;CAGlD,SAAS,SAAS,QAAmB;EACnC,SAAS,OAAO;EAChB,MAAM,WAAW,OAAO;;CAG1B,SAAS,iBAAiB,EAAE,aAAwB;EAClD,MAAM,EAAE,WAAW,sBAAA,GAAA,IAAA,OAA2B,UAAU;EACxD,IAAI,cAAc,kBAAkB,YAAY,UAAU;;CAG5D,SAAS,YAAY,KAAa,WAA2B,QAAQ;EACnE,aAAa,OAAO,YAAY,KAAK,SAAS;;CAIhD,CAAA,GAAA,IAAA,cAAA,GAAA,IAAA,OACc,UAAU,CAAC,YACtB,KAAK,SAAS;EACb,IAAI,MAAM,MAAM,mBAAmB;GAEtC;CAED,OAAO;EACL;EAEA;EACA;EACA;EACA;EACA;EACA;EACD"}
|
||||
Generated
Vendored
+31
@@ -0,0 +1,31 @@
|
||||
import { TableV2Props } from "../table.js";
|
||||
import { UseColumnsReturn } from "./use-columns.js";
|
||||
import { CSSProperties, ComputedRef } from "vue";
|
||||
|
||||
//#region ../../packages/components/table-v2/src/composables/use-styles.d.ts
|
||||
type UseStyleProps = {
|
||||
columnsTotalWidth: UseColumnsReturn['columnsTotalWidth'];
|
||||
fixedColumnsOnLeft: UseColumnsReturn['fixedColumnsOnLeft'];
|
||||
fixedColumnsOnRight: UseColumnsReturn['fixedColumnsOnRight'];
|
||||
rowsHeight: ComputedRef<number>;
|
||||
};
|
||||
declare const useStyles: (props: TableV2Props, {
|
||||
columnsTotalWidth,
|
||||
rowsHeight,
|
||||
fixedColumnsOnLeft,
|
||||
fixedColumnsOnRight
|
||||
}: UseStyleProps) => {
|
||||
bodyWidth: ComputedRef<number>;
|
||||
fixedTableHeight: ComputedRef<number>;
|
||||
mainTableHeight: ComputedRef<number>;
|
||||
leftTableWidth: ComputedRef<number>;
|
||||
rightTableWidth: ComputedRef<number>;
|
||||
windowHeight: ComputedRef<number>;
|
||||
footerHeight: ComputedRef<CSSProperties>;
|
||||
emptyStyle: ComputedRef<CSSProperties>;
|
||||
rootStyle: ComputedRef<CSSProperties>;
|
||||
headerHeight: ComputedRef<number>;
|
||||
};
|
||||
type UseStyleReturn = ReturnType<typeof useStyles>;
|
||||
//#endregion
|
||||
export { UseStyleReturn, useStyles };
|
||||
Generated
Vendored
+69
@@ -0,0 +1,69 @@
|
||||
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
||||
require("../../../../_virtual/_rolldown/runtime.js");
|
||||
const require_types = require("../../../../utils/types.js");
|
||||
const require_style = require("../../../../utils/dom/style.js");
|
||||
const require_utils = require("../utils.js");
|
||||
let vue = require("vue");
|
||||
//#region ../../packages/components/table-v2/src/composables/use-styles.ts
|
||||
const useStyles = (props, { columnsTotalWidth, rowsHeight, fixedColumnsOnLeft, fixedColumnsOnRight }) => {
|
||||
const bodyWidth = (0, vue.computed)(() => {
|
||||
const { fixed, width, vScrollbarSize } = props;
|
||||
const ret = width - vScrollbarSize;
|
||||
return fixed ? Math.max(Math.round((0, vue.unref)(columnsTotalWidth)), ret) : ret;
|
||||
});
|
||||
const mainTableHeight = (0, vue.computed)(() => {
|
||||
const { height = 0, maxHeight = 0, footerHeight, hScrollbarSize } = props;
|
||||
if (maxHeight > 0) {
|
||||
const _fixedRowsHeight = (0, vue.unref)(fixedRowsHeight);
|
||||
const _rowsHeight = (0, vue.unref)(rowsHeight);
|
||||
const total = (0, vue.unref)(headerHeight) + _fixedRowsHeight + _rowsHeight + hScrollbarSize;
|
||||
return Math.min(total, maxHeight - footerHeight);
|
||||
}
|
||||
return height - footerHeight;
|
||||
});
|
||||
const fixedTableHeight = (0, vue.computed)(() => {
|
||||
const { maxHeight } = props;
|
||||
const tableHeight = (0, vue.unref)(mainTableHeight);
|
||||
if (require_types.isNumber(maxHeight) && maxHeight > 0) return tableHeight;
|
||||
const totalHeight = (0, vue.unref)(rowsHeight) + (0, vue.unref)(headerHeight) + (0, vue.unref)(fixedRowsHeight);
|
||||
return Math.min(tableHeight, totalHeight);
|
||||
});
|
||||
const mapColumn = (column) => column.width;
|
||||
const leftTableWidth = (0, vue.computed)(() => require_utils.sum((0, vue.unref)(fixedColumnsOnLeft).map(mapColumn)));
|
||||
const rightTableWidth = (0, vue.computed)(() => require_utils.sum((0, vue.unref)(fixedColumnsOnRight).map(mapColumn)));
|
||||
const headerHeight = (0, vue.computed)(() => require_utils.sum(props.headerHeight));
|
||||
const fixedRowsHeight = (0, vue.computed)(() => {
|
||||
return (props.fixedData?.length || 0) * props.rowHeight;
|
||||
});
|
||||
const windowHeight = (0, vue.computed)(() => {
|
||||
return (0, vue.unref)(mainTableHeight) - (0, vue.unref)(headerHeight) - (0, vue.unref)(fixedRowsHeight);
|
||||
});
|
||||
const rootStyle = (0, vue.computed)(() => {
|
||||
const { style = {}, height, width } = props;
|
||||
return require_utils.enforceUnit({
|
||||
...style,
|
||||
height,
|
||||
width
|
||||
});
|
||||
});
|
||||
return {
|
||||
bodyWidth,
|
||||
fixedTableHeight,
|
||||
mainTableHeight,
|
||||
leftTableWidth,
|
||||
rightTableWidth,
|
||||
windowHeight,
|
||||
footerHeight: (0, vue.computed)(() => require_utils.enforceUnit({ height: props.footerHeight })),
|
||||
emptyStyle: (0, vue.computed)(() => ({
|
||||
top: require_style.addUnit((0, vue.unref)(headerHeight)),
|
||||
bottom: require_style.addUnit(props.footerHeight),
|
||||
width: require_style.addUnit(props.width)
|
||||
})),
|
||||
rootStyle,
|
||||
headerHeight
|
||||
};
|
||||
};
|
||||
//#endregion
|
||||
exports.useStyles = useStyles;
|
||||
|
||||
//# sourceMappingURL=use-styles.js.map
|
||||
Generated
Vendored
+1
File diff suppressed because one or more lines are too long
Generated
Vendored
+7
@@ -0,0 +1,7 @@
|
||||
import { AnyColumns } from "../types.js";
|
||||
import { CSSProperties } from "vue";
|
||||
|
||||
//#region ../../packages/components/table-v2/src/composables/utils.d.ts
|
||||
declare const calcColumnStyle: (column: AnyColumns[number], fixedColumn: boolean, fixed: boolean) => CSSProperties;
|
||||
//#endregion
|
||||
export { calcColumnStyle };
|
||||
Generated
Vendored
+27
@@ -0,0 +1,27 @@
|
||||
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
||||
//#region ../../packages/components/table-v2/src/composables/utils.ts
|
||||
const calcColumnStyle = (column, fixedColumn, fixed) => {
|
||||
const flex = {
|
||||
flexGrow: 0,
|
||||
flexShrink: 0,
|
||||
...fixed ? {} : {
|
||||
flexGrow: column.flexGrow ?? 0,
|
||||
flexShrink: column.flexShrink ?? 1
|
||||
}
|
||||
};
|
||||
const style = {
|
||||
...column.style ?? {},
|
||||
...flex,
|
||||
flexBasis: "auto",
|
||||
width: column.width
|
||||
};
|
||||
if (!fixedColumn) {
|
||||
if (column.maxWidth) style.maxWidth = column.maxWidth;
|
||||
if (column.minWidth) style.minWidth = column.minWidth;
|
||||
}
|
||||
return style;
|
||||
};
|
||||
//#endregion
|
||||
exports.calcColumnStyle = calcColumnStyle;
|
||||
|
||||
//# sourceMappingURL=utils.js.map
|
||||
Generated
Vendored
+1
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"utils.js","names":[],"sources":["../../../../../../../packages/components/table-v2/src/composables/utils.ts"],"sourcesContent":["import type { CSSProperties } from 'vue'\nimport type { AnyColumns } from '../types'\n\nexport const calcColumnStyle = (\n column: AnyColumns[number],\n fixedColumn: boolean,\n fixed: boolean\n): CSSProperties => {\n const flex = {\n flexGrow: 0,\n flexShrink: 0,\n ...(fixed\n ? {}\n : {\n flexGrow: column.flexGrow ?? 0,\n flexShrink: column.flexShrink ?? 1,\n }),\n }\n\n const style = {\n ...(column.style ?? {}),\n ...flex,\n flexBasis: 'auto',\n width: column.width,\n }\n\n if (!fixedColumn) {\n if (column.maxWidth) style.maxWidth = column.maxWidth\n if (column.minWidth) style.minWidth = column.minWidth\n }\n\n return style\n}\n"],"mappings":";;AAGA,MAAa,mBACX,QACA,aACA,UACkB;CAClB,MAAM,OAAO;EACX,UAAU;EACV,YAAY;EACZ,GAAI,QACA,EAAE,GACF;GACE,UAAU,OAAO,YAAY;GAC7B,YAAY,OAAO,cAAc;GAClC;EACN;CAED,MAAM,QAAQ;EACZ,GAAI,OAAO,SAAS,EAAE;EACtB,GAAG;EACH,WAAW;EACX,OAAO,OAAO;EACf;CAED,IAAI,CAAC,aAAa;EAChB,IAAI,OAAO,UAAU,MAAM,WAAW,OAAO;EAC7C,IAAI,OAAO,UAAU,MAAM,WAAW,OAAO;;CAG/C,OAAO"}
|
||||
+21
@@ -0,0 +1,21 @@
|
||||
//#region ../../packages/components/table-v2/src/constants.d.ts
|
||||
declare enum SortOrder {
|
||||
ASC = "asc",
|
||||
DESC = "desc"
|
||||
}
|
||||
declare enum Alignment {
|
||||
LEFT = "left",
|
||||
CENTER = "center",
|
||||
RIGHT = "right"
|
||||
}
|
||||
declare enum FixedDir {
|
||||
LEFT = "left",
|
||||
RIGHT = "right"
|
||||
}
|
||||
declare const oppositeOrderMap: {
|
||||
asc: SortOrder;
|
||||
desc: SortOrder;
|
||||
};
|
||||
declare const sortOrders: readonly [SortOrder.ASC, SortOrder.DESC];
|
||||
//#endregion
|
||||
export { Alignment, FixedDir, SortOrder, oppositeOrderMap, sortOrders };
|
||||
+31
@@ -0,0 +1,31 @@
|
||||
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
||||
//#region ../../packages/components/table-v2/src/constants.ts
|
||||
let SortOrder = /* @__PURE__ */ function(SortOrder) {
|
||||
SortOrder["ASC"] = "asc";
|
||||
SortOrder["DESC"] = "desc";
|
||||
return SortOrder;
|
||||
}({});
|
||||
let Alignment = /* @__PURE__ */ function(Alignment) {
|
||||
Alignment["LEFT"] = "left";
|
||||
Alignment["CENTER"] = "center";
|
||||
Alignment["RIGHT"] = "right";
|
||||
return Alignment;
|
||||
}({});
|
||||
let FixedDir = /* @__PURE__ */ function(FixedDir) {
|
||||
FixedDir["LEFT"] = "left";
|
||||
FixedDir["RIGHT"] = "right";
|
||||
return FixedDir;
|
||||
}({});
|
||||
const oppositeOrderMap = {
|
||||
["asc"]: "desc",
|
||||
["desc"]: "asc"
|
||||
};
|
||||
const sortOrders = ["asc", "desc"];
|
||||
//#endregion
|
||||
exports.Alignment = Alignment;
|
||||
exports.FixedDir = FixedDir;
|
||||
exports.SortOrder = SortOrder;
|
||||
exports.oppositeOrderMap = oppositeOrderMap;
|
||||
exports.sortOrders = sortOrders;
|
||||
|
||||
//# sourceMappingURL=constants.js.map
|
||||
+1
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"constants.js","names":[],"sources":["../../../../../../packages/components/table-v2/src/constants.ts"],"sourcesContent":["export enum SortOrder {\n ASC = 'asc',\n DESC = 'desc',\n}\n\nexport enum Alignment {\n LEFT = 'left',\n CENTER = 'center',\n RIGHT = 'right',\n}\n\nexport enum FixedDir {\n LEFT = 'left',\n RIGHT = 'right',\n}\n\nexport const oppositeOrderMap = {\n [SortOrder.ASC]: SortOrder.DESC,\n [SortOrder.DESC]: SortOrder.ASC,\n}\n\nexport const sortOrders = [SortOrder.ASC, SortOrder.DESC] as const\n"],"mappings":";;AAAA,IAAY,YAAL,yBAAA,WAAA;CACL,UAAA,SAAA;CACA,UAAA,UAAA;;KACD;AAED,IAAY,YAAL,yBAAA,WAAA;CACL,UAAA,UAAA;CACA,UAAA,YAAA;CACA,UAAA,WAAA;;KACD;AAED,IAAY,WAAL,yBAAA,UAAA;CACL,SAAA,UAAA;CACA,SAAA,WAAA;;KACD;AAED,MAAa,mBAAmB;;;CAG/B;AAED,MAAa,aAAa,CAAA,OAAA,OAA+B"}
|
||||
+113
@@ -0,0 +1,113 @@
|
||||
import { EpPropFinalized } from "../../../utils/vue/props/types.js";
|
||||
import { ItemSize } from "../../virtual-list/src/types.js";
|
||||
import { KeyType } from "./types.js";
|
||||
import { AnyColumn } from "./common.js";
|
||||
import * as _$vue from "vue";
|
||||
import { ExtractPropTypes, ExtractPublicPropTypes } from "vue";
|
||||
|
||||
//#region ../../packages/components/table-v2/src/grid.d.ts
|
||||
type onRowRenderedParams = {
|
||||
rowCacheStart: number;
|
||||
rowCacheEnd: number;
|
||||
rowVisibleStart: number;
|
||||
rowVisibleEnd: number;
|
||||
};
|
||||
declare const tableV2GridProps: {
|
||||
readonly columns: {
|
||||
readonly type: _$vue.PropType<AnyColumn[]>;
|
||||
readonly required: true;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
readonly data: {
|
||||
readonly type: _$vue.PropType<any[]>;
|
||||
readonly required: true;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
readonly fixedData: {
|
||||
readonly type: _$vue.PropType<any[]>;
|
||||
readonly required: false;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
readonly estimatedRowHeight: {
|
||||
readonly default: undefined;
|
||||
readonly type: _$vue.PropType<number>;
|
||||
readonly required: false;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
readonly __epPropKey: true;
|
||||
};
|
||||
readonly width: {
|
||||
readonly type: _$vue.PropType<number>;
|
||||
readonly required: true;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
readonly height: {
|
||||
readonly type: _$vue.PropType<number>;
|
||||
readonly required: true;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
readonly headerWidth: {
|
||||
readonly type: _$vue.PropType<number>;
|
||||
readonly required: true;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
readonly headerHeight: EpPropFinalized<(new (...args: any[]) => number | number[]) | (() => number | number[]) | (((new (...args: any[]) => number | number[]) | (() => number | number[])) | null)[], unknown, unknown, 50, boolean>;
|
||||
readonly bodyWidth: {
|
||||
readonly type: _$vue.PropType<number>;
|
||||
readonly required: true;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
readonly rowHeight: {
|
||||
readonly type: _$vue.PropType<number>;
|
||||
readonly required: true;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
readonly cache: EpPropFinalized<NumberConstructor, never, never, 2, false>;
|
||||
readonly useIsScrolling: BooleanConstructor;
|
||||
readonly scrollbarAlwaysOn: BooleanConstructor;
|
||||
readonly scrollbarStartGap: EpPropFinalized<NumberConstructor, unknown, unknown, 0, boolean>;
|
||||
readonly scrollbarEndGap: EpPropFinalized<NumberConstructor, unknown, unknown, 2, boolean>;
|
||||
readonly class: StringConstructor;
|
||||
readonly style: {
|
||||
readonly type: _$vue.PropType<_$vue.CSSProperties>;
|
||||
readonly required: false;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
readonly containerStyle: {
|
||||
readonly type: _$vue.PropType<_$vue.CSSProperties>;
|
||||
readonly required: false;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
readonly getRowHeight: {
|
||||
readonly type: _$vue.PropType<ItemSize>;
|
||||
readonly required: true;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
readonly rowKey: EpPropFinalized<(new (...args: any[]) => string | number | symbol) | (() => KeyType) | (((new (...args: any[]) => string | number | symbol) | (() => KeyType)) | null)[], unknown, unknown, "id", boolean>;
|
||||
readonly onRowsRendered: {
|
||||
readonly type: _$vue.PropType<(params: onRowRenderedParams) => void>;
|
||||
readonly required: false;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
readonly onScroll: {
|
||||
readonly type: _$vue.PropType<(...args: any[]) => void>;
|
||||
readonly required: false;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
};
|
||||
type TableV2GridProps = ExtractPropTypes<typeof tableV2GridProps>;
|
||||
type TableV2GridPropsPublic = ExtractPublicPropTypes<typeof tableV2GridProps>;
|
||||
//#endregion
|
||||
export { TableV2GridProps, TableV2GridPropsPublic, onRowRenderedParams, tableV2GridProps };
|
||||
+50
@@ -0,0 +1,50 @@
|
||||
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
||||
const require_runtime = require("../../../utils/vue/props/runtime.js");
|
||||
const require_props = require("../../virtual-list/src/props.js");
|
||||
const require_common = require("./common.js");
|
||||
const require_row = require("./row.js");
|
||||
const require_header = require("./header.js");
|
||||
//#region ../../packages/components/table-v2/src/grid.ts
|
||||
const tableV2GridProps = require_runtime.buildProps({
|
||||
columns: require_common.columns,
|
||||
data: require_common.dataType,
|
||||
fixedData: require_common.fixedDataType,
|
||||
estimatedRowHeight: require_row.tableV2RowProps.estimatedRowHeight,
|
||||
/**
|
||||
* Size related attributes
|
||||
*/
|
||||
width: require_common.requiredNumber,
|
||||
height: require_common.requiredNumber,
|
||||
headerWidth: require_common.requiredNumber,
|
||||
headerHeight: require_header.tableV2HeaderProps.headerHeight,
|
||||
bodyWidth: require_common.requiredNumber,
|
||||
rowHeight: require_common.requiredNumber,
|
||||
/**
|
||||
* Special attributes
|
||||
*/
|
||||
cache: require_props.virtualizedListProps.cache,
|
||||
useIsScrolling: Boolean,
|
||||
scrollbarAlwaysOn: require_props.virtualizedGridProps.scrollbarAlwaysOn,
|
||||
scrollbarStartGap: require_props.virtualizedGridProps.scrollbarStartGap,
|
||||
scrollbarEndGap: require_props.virtualizedGridProps.scrollbarEndGap,
|
||||
/**
|
||||
* CSS attributes
|
||||
*/
|
||||
class: require_common.classType,
|
||||
style: require_common.styleType,
|
||||
containerStyle: require_common.styleType,
|
||||
getRowHeight: {
|
||||
type: require_runtime.definePropType(Function),
|
||||
required: true
|
||||
},
|
||||
rowKey: require_row.tableV2RowProps.rowKey,
|
||||
/**
|
||||
* Event handlers
|
||||
*/
|
||||
onRowsRendered: { type: require_runtime.definePropType(Function) },
|
||||
onScroll: { type: require_runtime.definePropType(Function) }
|
||||
});
|
||||
//#endregion
|
||||
exports.tableV2GridProps = tableV2GridProps;
|
||||
|
||||
//# sourceMappingURL=grid.js.map
|
||||
+1
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"grid.js","names":["buildProps","dataType","fixedDataType","tableV2RowProps","requiredNumber","tableV2HeaderProps","virtualizedListProps","virtualizedGridProps","classType","styleType","definePropType"],"sources":["../../../../../../packages/components/table-v2/src/grid.ts"],"sourcesContent":["import { buildProps, definePropType } from '@element-plus/utils'\nimport {\n virtualizedGridProps,\n virtualizedListProps,\n} from '@element-plus/components/virtual-list'\nimport {\n classType,\n columns,\n dataType,\n fixedDataType,\n requiredNumber,\n styleType,\n} from './common'\nimport { tableV2HeaderProps } from './header'\nimport { tableV2RowProps } from './row'\n\nimport type { ExtractPropTypes, ExtractPublicPropTypes } from 'vue'\nimport type { ItemSize } from '@element-plus/components/virtual-list'\n\nexport type onRowRenderedParams = {\n rowCacheStart: number\n rowCacheEnd: number\n rowVisibleStart: number\n rowVisibleEnd: number\n}\n\nexport const tableV2GridProps = buildProps({\n columns,\n data: dataType,\n fixedData: fixedDataType,\n estimatedRowHeight: tableV2RowProps.estimatedRowHeight,\n\n /**\n * Size related attributes\n */\n width: requiredNumber,\n height: requiredNumber,\n\n headerWidth: requiredNumber,\n headerHeight: tableV2HeaderProps.headerHeight,\n\n bodyWidth: requiredNumber,\n rowHeight: requiredNumber,\n\n /**\n * Special attributes\n */\n cache: virtualizedListProps.cache,\n useIsScrolling: Boolean,\n scrollbarAlwaysOn: virtualizedGridProps.scrollbarAlwaysOn,\n scrollbarStartGap: virtualizedGridProps.scrollbarStartGap,\n scrollbarEndGap: virtualizedGridProps.scrollbarEndGap,\n\n /**\n * CSS attributes\n */\n class: classType,\n style: styleType,\n containerStyle: styleType,\n\n getRowHeight: {\n type: definePropType<ItemSize>(Function),\n required: true,\n },\n rowKey: tableV2RowProps.rowKey,\n\n /**\n * Event handlers\n */\n onRowsRendered: {\n type: definePropType<(params: onRowRenderedParams) => void>(Function),\n },\n onScroll: {\n type: definePropType<(...args: any[]) => void>(Function),\n },\n} as const)\n\nexport type TableV2GridProps = ExtractPropTypes<typeof tableV2GridProps>\nexport type TableV2GridPropsPublic = ExtractPublicPropTypes<\n typeof tableV2GridProps\n>\n"],"mappings":";;;;;;;AA0BA,MAAa,mBAAmBA,gBAAAA,WAAW;CACzC,SAAA,eAAA;CACA,MAAMC,eAAAA;CACN,WAAWC,eAAAA;CACX,oBAAoBC,YAAAA,gBAAgB;;;;CAKpC,OAAOC,eAAAA;CACP,QAAQA,eAAAA;CAER,aAAaA,eAAAA;CACb,cAAcC,eAAAA,mBAAmB;CAEjC,WAAWD,eAAAA;CACX,WAAWA,eAAAA;;;;CAKX,OAAOE,cAAAA,qBAAqB;CAC5B,gBAAgB;CAChB,mBAAmBC,cAAAA,qBAAqB;CACxC,mBAAmBA,cAAAA,qBAAqB;CACxC,iBAAiBA,cAAAA,qBAAqB;;;;CAKtC,OAAOC,eAAAA;CACP,OAAOC,eAAAA;CACP,gBAAgBA,eAAAA;CAEhB,cAAc;EACZ,MAAMC,gBAAAA,eAAyB,SAAS;EACxC,UAAU;EACX;CACD,QAAQP,YAAAA,gBAAgB;;;;CAKxB,gBAAgB,EACd,MAAMO,gBAAAA,eAAsD,SAAS,EACtE;CACD,UAAU,EACR,MAAMA,gBAAAA,eAAyC,SAAS,EACzD;CACF,CAAU"}
|
||||
+19
@@ -0,0 +1,19 @@
|
||||
import { AnyColumn } from "./common.js";
|
||||
import * as _$vue from "vue";
|
||||
import { ExtractPropTypes, ExtractPublicPropTypes } from "vue";
|
||||
|
||||
//#region ../../packages/components/table-v2/src/header-cell.d.ts
|
||||
declare const tableV2HeaderCell: {
|
||||
class: StringConstructor;
|
||||
columnIndex: NumberConstructor;
|
||||
column: {
|
||||
readonly type: _$vue.PropType<AnyColumn>;
|
||||
readonly required: false;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
};
|
||||
type TableV2HeaderCell = ExtractPropTypes<typeof tableV2HeaderCell>;
|
||||
type TableV2HeaderCellPublic = ExtractPublicPropTypes<typeof tableV2HeaderCell>;
|
||||
//#endregion
|
||||
export { TableV2HeaderCell, TableV2HeaderCellPublic, tableV2HeaderCell };
|
||||
+13
@@ -0,0 +1,13 @@
|
||||
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
||||
const require_runtime = require("../../../utils/vue/props/runtime.js");
|
||||
const require_common = require("./common.js");
|
||||
//#region ../../packages/components/table-v2/src/header-cell.ts
|
||||
const tableV2HeaderCell = require_runtime.buildProps({
|
||||
class: require_common.classType,
|
||||
columnIndex: Number,
|
||||
column: require_common.column
|
||||
});
|
||||
//#endregion
|
||||
exports.tableV2HeaderCell = tableV2HeaderCell;
|
||||
|
||||
//# sourceMappingURL=header-cell.js.map
|
||||
Generated
Vendored
+1
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"header-cell.js","names":["buildProps","classType"],"sources":["../../../../../../packages/components/table-v2/src/header-cell.ts"],"sourcesContent":["import { buildProps } from '@element-plus/utils'\nimport { classType, column } from './common'\n\nimport type { ExtractPropTypes, ExtractPublicPropTypes } from 'vue'\n\nexport const tableV2HeaderCell = buildProps({\n class: classType,\n columnIndex: Number,\n column,\n})\n\nexport type TableV2HeaderCell = ExtractPropTypes<typeof tableV2HeaderCell>\nexport type TableV2HeaderCellPublic = ExtractPublicPropTypes<\n typeof tableV2HeaderCell\n>\n"],"mappings":";;;;AAKA,MAAa,oBAAoBA,gBAAAA,WAAW;CAC1C,OAAOC,eAAAA;CACP,aAAa;CACb,QAAA,eAAA;CACD,CAAC"}
|
||||
+32
@@ -0,0 +1,32 @@
|
||||
import { KeyType } from "./types.js";
|
||||
import { AnyColumn } from "./common.js";
|
||||
import * as _$vue from "vue";
|
||||
import { CSSProperties, ExtractPropTypes, ExtractPublicPropTypes } from "vue";
|
||||
|
||||
//#region ../../packages/components/table-v2/src/header-row.d.ts
|
||||
declare const tableV2HeaderRowProps: {
|
||||
readonly class: StringConstructor;
|
||||
readonly columns: {
|
||||
readonly type: _$vue.PropType<AnyColumn[]>;
|
||||
readonly required: true;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
readonly columnsStyles: {
|
||||
readonly type: _$vue.PropType<Record<KeyType, CSSProperties>>;
|
||||
readonly required: true;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
readonly headerIndex: NumberConstructor;
|
||||
readonly style: {
|
||||
readonly type: _$vue.PropType<CSSProperties>;
|
||||
readonly required: false;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
};
|
||||
type TableV2HeaderRowProps = ExtractPropTypes<typeof tableV2HeaderRowProps>;
|
||||
type TableV2HeaderRowPropsPublic = ExtractPublicPropTypes<typeof tableV2HeaderRowProps>;
|
||||
//#endregion
|
||||
export { TableV2HeaderRowProps, TableV2HeaderRowPropsPublic, tableV2HeaderRowProps };
|
||||
+18
@@ -0,0 +1,18 @@
|
||||
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
||||
const require_runtime = require("../../../utils/vue/props/runtime.js");
|
||||
const require_common = require("./common.js");
|
||||
//#region ../../packages/components/table-v2/src/header-row.ts
|
||||
const tableV2HeaderRowProps = require_runtime.buildProps({
|
||||
class: String,
|
||||
columns: require_common.columns,
|
||||
columnsStyles: {
|
||||
type: require_runtime.definePropType(Object),
|
||||
required: true
|
||||
},
|
||||
headerIndex: Number,
|
||||
style: { type: require_runtime.definePropType(Object) }
|
||||
});
|
||||
//#endregion
|
||||
exports.tableV2HeaderRowProps = tableV2HeaderRowProps;
|
||||
|
||||
//# sourceMappingURL=header-row.js.map
|
||||
+1
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"header-row.js","names":["buildProps","definePropType"],"sources":["../../../../../../packages/components/table-v2/src/header-row.ts"],"sourcesContent":["import { buildProps, definePropType } from '@element-plus/utils'\nimport { columns } from './common'\n\nimport type {\n CSSProperties,\n ExtractPropTypes,\n ExtractPublicPropTypes,\n} from 'vue'\nimport type { KeyType } from './types'\n\nexport const tableV2HeaderRowProps = buildProps({\n class: String,\n columns,\n columnsStyles: {\n type: definePropType<Record<KeyType, CSSProperties>>(Object),\n required: true,\n },\n headerIndex: Number,\n style: { type: definePropType<CSSProperties>(Object) },\n} as const)\n\nexport type TableV2HeaderRowProps = ExtractPropTypes<\n typeof tableV2HeaderRowProps\n>\nexport type TableV2HeaderRowPropsPublic = ExtractPublicPropTypes<\n typeof tableV2HeaderRowProps\n>\n"],"mappings":";;;;AAUA,MAAa,wBAAwBA,gBAAAA,WAAW;CAC9C,OAAO;CACP,SAAA,eAAA;CACA,eAAe;EACb,MAAMC,gBAAAA,eAA+C,OAAO;EAC5D,UAAU;EACX;CACD,aAAa;CACb,OAAO,EAAE,MAAMA,gBAAAA,eAA8B,OAAO,EAAE;CACvD,CAAU"}
|
||||
+51
@@ -0,0 +1,51 @@
|
||||
import { EpPropFinalized } from "../../../utils/vue/props/types.js";
|
||||
import { AnyColumn } from "./common.js";
|
||||
import * as _$vue from "vue";
|
||||
import { ExtractPropTypes, ExtractPublicPropTypes } from "vue";
|
||||
|
||||
//#region ../../packages/components/table-v2/src/header.d.ts
|
||||
declare const tableV2HeaderProps: {
|
||||
readonly class: StringConstructor;
|
||||
readonly columns: {
|
||||
readonly type: _$vue.PropType<AnyColumn[]>;
|
||||
readonly required: true;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
readonly fixedHeaderData: {
|
||||
readonly type: _$vue.PropType<any[]>;
|
||||
readonly required: false;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
readonly headerData: {
|
||||
readonly type: _$vue.PropType<any[]>;
|
||||
readonly required: true;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
readonly headerHeight: EpPropFinalized<(new (...args: any[]) => number | number[]) | (() => number | number[]) | (((new (...args: any[]) => number | number[]) | (() => number | number[])) | null)[], unknown, unknown, 50, boolean>;
|
||||
readonly rowWidth: {
|
||||
readonly type: _$vue.PropType<number>;
|
||||
readonly required: true;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
readonly rowHeight: EpPropFinalized<NumberConstructor, unknown, unknown, 50, boolean>;
|
||||
readonly height: {
|
||||
readonly type: _$vue.PropType<number>;
|
||||
readonly required: true;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
readonly width: {
|
||||
readonly type: _$vue.PropType<number>;
|
||||
readonly required: true;
|
||||
readonly validator: ((val: unknown) => boolean) | undefined;
|
||||
__epPropKey: true;
|
||||
};
|
||||
};
|
||||
type TableV2HeaderProps = ExtractPropTypes<typeof tableV2HeaderProps>;
|
||||
type TableV2HeaderPropsPublic = ExtractPublicPropTypes<typeof tableV2HeaderProps>;
|
||||
//#endregion
|
||||
export { TableV2HeaderProps, TableV2HeaderPropsPublic, tableV2HeaderProps };
|
||||
+32
@@ -0,0 +1,32 @@
|
||||
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
||||
const require_runtime = require("../../../utils/vue/props/runtime.js");
|
||||
const require_common = require("./common.js");
|
||||
//#region ../../packages/components/table-v2/src/header.ts
|
||||
const requiredNumberType = {
|
||||
type: Number,
|
||||
required: true
|
||||
};
|
||||
const tableV2HeaderProps = require_runtime.buildProps({
|
||||
class: String,
|
||||
columns: require_common.columns,
|
||||
fixedHeaderData: { type: require_runtime.definePropType(Array) },
|
||||
headerData: {
|
||||
type: require_runtime.definePropType(Array),
|
||||
required: true
|
||||
},
|
||||
headerHeight: {
|
||||
type: require_runtime.definePropType([Number, Array]),
|
||||
default: 50
|
||||
},
|
||||
rowWidth: requiredNumberType,
|
||||
rowHeight: {
|
||||
type: Number,
|
||||
default: 50
|
||||
},
|
||||
height: requiredNumberType,
|
||||
width: requiredNumberType
|
||||
});
|
||||
//#endregion
|
||||
exports.tableV2HeaderProps = tableV2HeaderProps;
|
||||
|
||||
//# sourceMappingURL=header.js.map
|
||||
+1
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"header.js","names":["buildProps","definePropType"],"sources":["../../../../../../packages/components/table-v2/src/header.ts"],"sourcesContent":["import { buildProps, definePropType } from '@element-plus/utils'\nimport { columns } from './common'\n\nimport type { ExtractPropTypes, ExtractPublicPropTypes } from 'vue'\n\nconst requiredNumberType = {\n type: Number,\n required: true,\n} as const\n\nexport const tableV2HeaderProps = buildProps({\n class: String,\n columns,\n fixedHeaderData: {\n type: definePropType<any[]>(Array),\n },\n headerData: {\n type: definePropType<any[]>(Array),\n required: true,\n },\n headerHeight: {\n type: definePropType<number | number[]>([Number, Array]),\n default: 50,\n },\n rowWidth: requiredNumberType,\n rowHeight: {\n type: Number,\n default: 50,\n },\n height: requiredNumberType,\n width: requiredNumberType,\n} as const)\n\nexport type TableV2HeaderProps = ExtractPropTypes<typeof tableV2HeaderProps>\nexport type TableV2HeaderPropsPublic = ExtractPublicPropTypes<\n typeof tableV2HeaderProps\n>\n"],"mappings":";;;;AAKA,MAAM,qBAAqB;CACzB,MAAM;CACN,UAAU;CACX;AAED,MAAa,qBAAqBA,gBAAAA,WAAW;CAC3C,OAAO;CACP,SAAA,eAAA;CACA,iBAAiB,EACf,MAAMC,gBAAAA,eAAsB,MAAM,EACnC;CACD,YAAY;EACV,MAAMA,gBAAAA,eAAsB,MAAM;EAClC,UAAU;EACX;CACD,cAAc;EACZ,MAAMA,gBAAAA,eAAkC,CAAC,QAAQ,MAAM,CAAC;EACxD,SAAS;EACV;CACD,UAAU;CACV,WAAW;EACT,MAAM;EACN,SAAS;EACV;CACD,QAAQ;CACR,OAAO;CACR,CAAU"}
|
||||
+4
@@ -0,0 +1,4 @@
|
||||
//#region ../../packages/components/table-v2/src/private.d.ts
|
||||
declare const placeholderSign: unique symbol;
|
||||
//#endregion
|
||||
export { placeholderSign };
|
||||
+7
@@ -0,0 +1,7 @@
|
||||
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
||||
//#region ../../packages/components/table-v2/src/private.ts
|
||||
const placeholderSign = Symbol("placeholder");
|
||||
//#endregion
|
||||
exports.placeholderSign = placeholderSign;
|
||||
|
||||
//# sourceMappingURL=private.js.map
|
||||
+1
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"private.js","names":[],"sources":["../../../../../../packages/components/table-v2/src/private.ts"],"sourcesContent":["export const placeholderSign = Symbol('placeholder')\n"],"mappings":";;AAAA,MAAa,kBAAkB,OAAO,cAAc"}
|
||||
Generated
Vendored
+15
@@ -0,0 +1,15 @@
|
||||
import { Translator } from "../../../../hooks/use-locale/index.js";
|
||||
import { UseNamespaceReturn } from "../../../../hooks/use-namespace/index.js";
|
||||
import { TableV2Props } from "../table.js";
|
||||
import { TableV2RowCellRenderParam } from "../components/row.js";
|
||||
import { UseTableReturn } from "../use-table.js";
|
||||
import { FunctionalComponent, UnwrapNestedRefs } from "vue";
|
||||
|
||||
//#region ../../packages/components/table-v2/src/renderers/cell.d.ts
|
||||
type CellRendererProps = TableV2RowCellRenderParam & Pick<TableV2Props, 'cellProps' | 'expandColumnKey' | 'indentSize' | 'iconSize' | 'rowKey'> & UnwrapNestedRefs<Pick<UseTableReturn, 'expandedRowKeys'>> & {
|
||||
ns: UseNamespaceReturn;
|
||||
t: Translator;
|
||||
};
|
||||
declare const CellRenderer: FunctionalComponent<CellRendererProps>;
|
||||
//#endregion
|
||||
export { CellRenderer as default };
|
||||
+73
@@ -0,0 +1,73 @@
|
||||
require("../../../../_virtual/_rolldown/runtime.js");
|
||||
require("../constants.js");
|
||||
const require_private = require("../private.js");
|
||||
const require_utils = require("../utils.js");
|
||||
const require_cell = require("../components/cell.js");
|
||||
const require_expand_icon = require("../components/expand-icon.js");
|
||||
let lodash_unified = require("lodash-unified");
|
||||
let vue = require("vue");
|
||||
let _vue_shared = require("@vue/shared");
|
||||
//#region ../../packages/components/table-v2/src/renderers/cell.tsx
|
||||
const CellRenderer = ({ columns, column, columnIndex, depth, expandIconProps, isScrolling, rowData, rowIndex, style, expandedRowKeys, ns, t, cellProps: _cellProps, expandColumnKey, indentSize, iconSize, rowKey }, { slots }) => {
|
||||
const cellStyle = require_utils.enforceUnit(style);
|
||||
if (column.placeholderSign === require_private.placeholderSign) return (0, vue.createVNode)("div", {
|
||||
"class": ns.em("row-cell", "placeholder"),
|
||||
"style": cellStyle
|
||||
}, null);
|
||||
const { cellRenderer, dataKey, dataGetter } = column;
|
||||
const cellData = (0, _vue_shared.isFunction)(dataGetter) ? dataGetter({
|
||||
columns,
|
||||
column,
|
||||
columnIndex,
|
||||
rowData,
|
||||
rowIndex
|
||||
}) : (0, lodash_unified.get)(rowData, dataKey ?? "");
|
||||
const extraCellProps = require_utils.tryCall(_cellProps, {
|
||||
cellData,
|
||||
columns,
|
||||
column,
|
||||
columnIndex,
|
||||
rowIndex,
|
||||
rowData
|
||||
});
|
||||
const cellProps = {
|
||||
class: ns.e("cell-text"),
|
||||
columns,
|
||||
column,
|
||||
columnIndex,
|
||||
cellData,
|
||||
isScrolling,
|
||||
rowData,
|
||||
rowIndex
|
||||
};
|
||||
const columnCellRenderer = require_utils.componentToSlot(cellRenderer);
|
||||
const Cell = columnCellRenderer ? columnCellRenderer(cellProps) : (0, vue.renderSlot)(slots, "default", cellProps, () => [(0, vue.createVNode)(require_cell.default, cellProps, null)]);
|
||||
const kls = [
|
||||
ns.e("row-cell"),
|
||||
column.class,
|
||||
column.align === "center" && ns.is("align-center"),
|
||||
column.align === "right" && ns.is("align-right")
|
||||
];
|
||||
const expandable = rowIndex >= 0 && expandColumnKey && column.key === expandColumnKey;
|
||||
const expanded = rowIndex >= 0 && expandedRowKeys.includes(rowData[rowKey]);
|
||||
let IconOrPlaceholder;
|
||||
const iconStyle = `margin-inline-start: ${depth * indentSize}px;`;
|
||||
if (expandable) if ((0, _vue_shared.isObject)(expandIconProps)) IconOrPlaceholder = (0, vue.createVNode)(require_expand_icon.default, (0, vue.mergeProps)(expandIconProps, {
|
||||
"class": [ns.e("expand-icon"), ns.is("expanded", expanded)],
|
||||
"size": iconSize,
|
||||
"expanded": expanded,
|
||||
"ariaLabel": t(expanded ? "el.table.collapseRowLabel" : "el.table.expandRowLabel"),
|
||||
"style": iconStyle,
|
||||
"expandable": true
|
||||
}), null);
|
||||
else IconOrPlaceholder = (0, vue.createVNode)("div", { "style": [iconStyle, `width: ${iconSize}px; height: ${iconSize}px;`].join(" ") }, null);
|
||||
return (0, vue.createVNode)("div", (0, vue.mergeProps)({
|
||||
"class": kls,
|
||||
"style": cellStyle
|
||||
}, extraCellProps, { "role": "cell" }), [IconOrPlaceholder, Cell]);
|
||||
};
|
||||
CellRenderer.inheritAttrs = false;
|
||||
//#endregion
|
||||
exports.default = CellRenderer;
|
||||
|
||||
//# sourceMappingURL=cell.js.map
|
||||
Generated
Vendored
+1
File diff suppressed because one or more lines are too long
Generated
Vendored
+10
@@ -0,0 +1,10 @@
|
||||
import { CSSProperties, FunctionalComponent } from "vue";
|
||||
|
||||
//#region ../../packages/components/table-v2/src/renderers/empty.d.ts
|
||||
type EmptyRendererProps = {
|
||||
class?: JSX.IntrinsicAttributes['class'];
|
||||
style?: CSSProperties;
|
||||
};
|
||||
declare const Footer: FunctionalComponent<EmptyRendererProps>;
|
||||
//#endregion
|
||||
export { Footer as default };
|
||||
Generated
Vendored
+16
@@ -0,0 +1,16 @@
|
||||
require("../../../../_virtual/_rolldown/runtime.js");
|
||||
const require_index = require("../../../empty/index.js");
|
||||
let vue = require("vue");
|
||||
//#region ../../packages/components/table-v2/src/renderers/empty.tsx
|
||||
const Footer = (props, { slots }) => {
|
||||
const defaultSlot = (0, vue.renderSlot)(slots, "default", {}, () => [(0, vue.createVNode)(require_index.ElEmpty, null, null)]);
|
||||
return (0, vue.createVNode)("div", {
|
||||
"class": props.class,
|
||||
"style": props.style
|
||||
}, [defaultSlot]);
|
||||
};
|
||||
Footer.displayName = "ElTableV2Empty";
|
||||
//#endregion
|
||||
exports.default = Footer;
|
||||
|
||||
//# sourceMappingURL=empty.js.map
|
||||
Generated
Vendored
+1
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"empty.js","names":["renderSlot","createVNode","_createVNode","ElEmpty","Footer","props","slots","defaultSlot","class","style","displayName"],"sources":["../../../../../../../packages/components/table-v2/src/renderers/empty.tsx"],"sourcesContent":["import { renderSlot } from 'vue'\nimport ElEmpty from '@element-plus/components/empty'\n\nimport type { CSSProperties, FunctionalComponent } from 'vue'\n\ntype EmptyRendererProps = {\n class?: JSX.IntrinsicAttributes['class']\n style?: CSSProperties\n}\n\nconst Footer: FunctionalComponent<EmptyRendererProps> = (props, { slots }) => {\n const defaultSlot = renderSlot(slots, 'default', {}, () => [<ElEmpty />])\n return (\n <div class={props.class} style={props.style}>\n {defaultSlot}\n </div>\n )\n}\n\nFooter.displayName = 'ElTableV2Empty'\n\nexport default Footer\n"],"mappings":";;;;AAUA,MAAMI,UAAmDC,OAAO,EAAEC,YAAY;CAC5E,MAAMC,eAAAA,GAAAA,IAAAA,YAAyBD,OAAO,WAAW,EAAE,QAAQ,EAAA,GAAA,IAAA,aAAAH,cAAAA,SAAA,MAAA,KAAA,CAAa,CAAC;CACzE,QAAA,GAAA,IAAA,aAAA,OAAA;EAAA,SACcE,MAAMG;EAAK,SAASH,MAAMI;EAAK,EAAA,CACxCF,YAAW,CAAA;;AAKlBH,OAAOM,cAAc"}
|
||||
Generated
Vendored
+10
@@ -0,0 +1,10 @@
|
||||
import { CSSProperties, FunctionalComponent } from "vue";
|
||||
|
||||
//#region ../../packages/components/table-v2/src/renderers/footer.d.ts
|
||||
type FooterRendererProps = {
|
||||
class?: JSX.IntrinsicAttributes['class'];
|
||||
style: CSSProperties;
|
||||
};
|
||||
declare const Footer: FunctionalComponent<FooterRendererProps>;
|
||||
//#endregion
|
||||
export { Footer as default };
|
||||
Generated
Vendored
+14
@@ -0,0 +1,14 @@
|
||||
require("../../../../_virtual/_rolldown/runtime.js");
|
||||
let vue = require("vue");
|
||||
//#region ../../packages/components/table-v2/src/renderers/footer.tsx
|
||||
const Footer = (props, { slots }) => {
|
||||
return (0, vue.createVNode)("div", {
|
||||
"class": props.class,
|
||||
"style": props.style
|
||||
}, [slots.default?.()]);
|
||||
};
|
||||
Footer.displayName = "ElTableV2Footer";
|
||||
//#endregion
|
||||
exports.default = Footer;
|
||||
|
||||
//# sourceMappingURL=footer.js.map
|
||||
Generated
Vendored
+1
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"footer.js","names":["Footer","props","slots","_createVNode","class","style","default","displayName"],"sources":["../../../../../../../packages/components/table-v2/src/renderers/footer.tsx"],"sourcesContent":["import type { CSSProperties, FunctionalComponent } from 'vue'\n\ntype FooterRendererProps = {\n class?: JSX.IntrinsicAttributes['class']\n style: CSSProperties\n}\n\nconst Footer: FunctionalComponent<FooterRendererProps> = (props, { slots }) => {\n return (\n <div class={props.class} style={props.style}>\n {slots.default?.()}\n </div>\n )\n}\n\nFooter.displayName = 'ElTableV2Footer'\n\nexport default Footer\n"],"mappings":";;;AAOA,MAAMA,UAAoDC,OAAO,EAAEC,YAAY;CAC7E,QAAA,GAAA,IAAA,aAAA,OAAA;EAAA,SACcD,MAAMG;EAAK,SAASH,MAAMI;EAAK,EAAA,CACxCH,MAAMI,WAAW,CAAA,CAAA;;AAKxBN,OAAOO,cAAc"}
|
||||
Generated
Vendored
+18
@@ -0,0 +1,18 @@
|
||||
import { Translator } from "../../../../hooks/use-locale/index.js";
|
||||
import { UseNamespaceReturn } from "../../../../hooks/use-namespace/index.js";
|
||||
import { TableV2Props } from "../table.js";
|
||||
import { TableV2HeaderRowCellRendererParams } from "../components/header-row.js";
|
||||
import { UseTableReturn } from "../use-table.js";
|
||||
import { FunctionalComponent, UnwrapNestedRefs } from "vue";
|
||||
|
||||
//#region ../../packages/components/table-v2/src/renderers/header-cell.d.ts
|
||||
type HeaderCellRendererProps = TableV2HeaderRowCellRendererParams & UnwrapNestedRefs<Pick<UseTableReturn, 'onColumnSorted'>> & Pick<TableV2Props, 'sortBy' | 'sortState' | 'headerCellProps'> & {
|
||||
ns: UseNamespaceReturn;
|
||||
t: Translator;
|
||||
};
|
||||
declare const HeaderCellRenderer: FunctionalComponent<HeaderCellRendererProps>;
|
||||
type HeaderCellSlotProps = HeaderCellRendererProps & {
|
||||
class: string;
|
||||
};
|
||||
//#endregion
|
||||
export { HeaderCellRendererProps, HeaderCellSlotProps, HeaderCellRenderer as default };
|
||||
Generated
Vendored
+65
@@ -0,0 +1,65 @@
|
||||
require("../../../../_virtual/_rolldown/runtime.js");
|
||||
const require_constants = require("../constants.js");
|
||||
const require_private = require("../private.js");
|
||||
const require_utils = require("../utils.js");
|
||||
const require_header_cell = require("../components/header-cell.js");
|
||||
const require_sort_icon = require("../components/sort-icon.js");
|
||||
let vue = require("vue");
|
||||
//#region ../../packages/components/table-v2/src/renderers/header-cell.tsx
|
||||
const HeaderCellRenderer = (props, { slots }) => {
|
||||
const { column, ns, t, style, onColumnSorted } = props;
|
||||
const cellStyle = require_utils.enforceUnit(style);
|
||||
if (column.placeholderSign === require_private.placeholderSign) return (0, vue.createVNode)("div", {
|
||||
"class": ns.em("header-row-cell", "placeholder"),
|
||||
"style": cellStyle
|
||||
}, null);
|
||||
const { headerCellRenderer, headerClass, sortable } = column;
|
||||
/**
|
||||
* render Cell children
|
||||
*/
|
||||
const cellProps = {
|
||||
...props,
|
||||
class: ns.e("header-cell-text")
|
||||
};
|
||||
const columnCellRenderer = require_utils.componentToSlot(headerCellRenderer);
|
||||
const Cell = columnCellRenderer ? columnCellRenderer(cellProps) : (0, vue.renderSlot)(slots, "default", cellProps, () => [(0, vue.createVNode)(require_header_cell.default, cellProps, null)]);
|
||||
/**
|
||||
* Render cell container and sort indicator
|
||||
*/
|
||||
const { sortBy, sortState, headerCellProps } = props;
|
||||
let sorting, sortOrder, ariaSort;
|
||||
if (sortState) {
|
||||
const order = sortState[column.key];
|
||||
sorting = Boolean(require_constants.oppositeOrderMap[order]);
|
||||
sortOrder = sorting ? order : "asc";
|
||||
} else {
|
||||
sorting = column.key === sortBy.key;
|
||||
sortOrder = sorting ? sortBy.order : "asc";
|
||||
}
|
||||
if (sortOrder === "asc") ariaSort = "ascending";
|
||||
else if (sortOrder === "desc") ariaSort = "descending";
|
||||
else ariaSort = void 0;
|
||||
const cellKls = [
|
||||
ns.e("header-cell"),
|
||||
require_utils.tryCall(headerClass, props, ""),
|
||||
column.align === "center" && ns.is("align-center"),
|
||||
column.align === "right" && ns.is("align-right"),
|
||||
sortable && ns.is("sortable")
|
||||
];
|
||||
return (0, vue.createVNode)("div", (0, vue.mergeProps)({
|
||||
...require_utils.tryCall(headerCellProps, props),
|
||||
onClick: column.sortable ? onColumnSorted : void 0,
|
||||
ariaSort: sortable ? ariaSort : void 0,
|
||||
class: cellKls,
|
||||
style: cellStyle,
|
||||
["data-key"]: column.key
|
||||
}, { "role": "columnheader" }), [Cell, sortable && (0, vue.createVNode)(require_sort_icon.default, {
|
||||
"class": [ns.e("sort-icon"), sorting && ns.is("sorting")],
|
||||
"sortOrder": sortOrder,
|
||||
"ariaLabel": t("el.table.sortLabel", { column: column.title || "" })
|
||||
}, null)]);
|
||||
};
|
||||
//#endregion
|
||||
exports.default = HeaderCellRenderer;
|
||||
|
||||
//# sourceMappingURL=header-cell.js.map
|
||||
Generated
Vendored
+1
File diff suppressed because one or more lines are too long
Generated
Vendored
+12
@@ -0,0 +1,12 @@
|
||||
import { UseNamespaceReturn } from "../../../../hooks/use-namespace/index.js";
|
||||
import { TableV2Props } from "../table.js";
|
||||
import { TableV2HeaderRendererParams } from "../components/header.js";
|
||||
import { FunctionalComponent } from "vue";
|
||||
|
||||
//#region ../../packages/components/table-v2/src/renderers/header.d.ts
|
||||
type HeaderRendererProps = TableV2HeaderRendererParams & Pick<TableV2Props, 'headerClass' | 'headerProps'> & {
|
||||
ns: UseNamespaceReturn;
|
||||
};
|
||||
declare const HeaderRenderer: FunctionalComponent<HeaderRendererProps>;
|
||||
//#endregion
|
||||
export { HeaderRenderer as default };
|
||||
Generated
Vendored
+31
@@ -0,0 +1,31 @@
|
||||
require("../../../../_virtual/_rolldown/runtime.js");
|
||||
const require_utils = require("../utils.js");
|
||||
const require_header_row = require("../components/header-row.js");
|
||||
let vue = require("vue");
|
||||
//#region ../../packages/components/table-v2/src/renderers/header.tsx
|
||||
function _isSlot(s) {
|
||||
return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !(0, vue.isVNode)(s);
|
||||
}
|
||||
const HeaderRenderer = ({ columns, columnsStyles, headerIndex, style, headerClass, headerProps, ns }, { slots }) => {
|
||||
const param = {
|
||||
columns,
|
||||
headerIndex
|
||||
};
|
||||
const kls = [
|
||||
ns.e("header-row"),
|
||||
require_utils.tryCall(headerClass, param, ""),
|
||||
ns.is("customized", Boolean(slots.header))
|
||||
];
|
||||
return (0, vue.createVNode)(require_header_row.default, {
|
||||
...require_utils.tryCall(headerProps, param),
|
||||
columnsStyles,
|
||||
class: kls,
|
||||
columns,
|
||||
headerIndex,
|
||||
style
|
||||
}, _isSlot(slots) ? slots : { default: () => [slots] });
|
||||
};
|
||||
//#endregion
|
||||
exports.default = HeaderRenderer;
|
||||
|
||||
//# sourceMappingURL=header.js.map
|
||||
Generated
Vendored
+1
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"header.js","names":["HeaderRow","tryCall","_isSlot","s","Object","prototype","toString","call","_isVNode","HeaderRenderer","columns","columnsStyles","headerIndex","style","headerClass","headerProps","ns","slots","param","kls","e","is","Boolean","header","extraProps","class","_createVNode","default"],"sources":["../../../../../../../packages/components/table-v2/src/renderers/header.tsx"],"sourcesContent":["import { HeaderRow } from '../components'\nimport { tryCall } from '../utils'\n\nimport type { FunctionalComponent } from 'vue'\nimport type { UseNamespaceReturn } from '@element-plus/hooks'\nimport type { TableV2HeaderRendererParams } from '../components'\nimport type { TableV2Props } from '../table'\n\ntype HeaderRendererProps = TableV2HeaderRendererParams &\n Pick<TableV2Props, 'headerClass' | 'headerProps'> & {\n ns: UseNamespaceReturn\n }\n\nconst HeaderRenderer: FunctionalComponent<HeaderRendererProps> = (\n {\n columns,\n columnsStyles,\n headerIndex,\n style,\n // derived from root\n headerClass,\n headerProps,\n\n ns,\n },\n { slots }\n) => {\n const param = { columns, headerIndex }\n\n const kls = [\n ns.e('header-row'),\n tryCall(headerClass, param, ''),\n ns.is('customized', Boolean(slots.header)),\n ]\n\n const extraProps = {\n ...tryCall(headerProps, param),\n columnsStyles,\n class: kls,\n columns,\n headerIndex,\n style,\n }\n\n return <HeaderRow {...extraProps}>{slots}</HeaderRow>\n}\n\nexport default HeaderRenderer\n"],"mappings":";;;;;AACkC,SAAAE,QAAAC,GAAA;CAAA,OAAA,OAAAA,MAAA,cAAAC,OAAAC,UAAAC,SAAAC,KAAAJ,EAAA,KAAA,qBAAA,EAAA,GAAA,IAAA,SAAAA,EAAA;;AAYlC,MAAMM,kBACJ,EACEC,SACAC,eACAC,aACAC,OAEAC,aACAC,aAEAC,MAEF,EAAEC,YACC;CACH,MAAMC,QAAQ;EAAER;EAASE;EAAa;CAEtC,MAAMO,MAAM;EACVH,GAAGI,EAAE,aAAa;EAClBnB,cAAAA,QAAQa,aAAaI,OAAO,GAAG;EAC/BF,GAAGK,GAAG,cAAcC,QAAQL,MAAMM,OAAO,CAAC;EAC3C;CAWD,QAAA,GAAA,IAAA,aAAAvB,mBAAAA,SAAsBwB;EARpB,GAAGvB,cAAAA,QAAQc,aAAaG,MAAM;EAC9BP;EACAc,OAAON;EACPT;EACAE;EACAC;EAG8B,EAAAX,QAAGe,MAAK,GAALA,QAAK,EAAAU,eAAA,CAALV,MAAK,EAAA,CAAA"}
|
||||
Generated
Vendored
+11
@@ -0,0 +1,11 @@
|
||||
import { TableV2GridProps } from "../grid.js";
|
||||
import { TableGridInstance } from "../table-grid.js";
|
||||
import { FunctionalComponent, Ref } from "vue";
|
||||
|
||||
//#region ../../packages/components/table-v2/src/renderers/left-table.d.ts
|
||||
type LeftTableProps = TableV2GridProps & {
|
||||
leftTableRef: Ref<TableGridInstance | undefined>;
|
||||
};
|
||||
declare const LeftTable: FunctionalComponent<LeftTableProps>;
|
||||
//#endregion
|
||||
export { LeftTable as default };
|
||||
Generated
Vendored
+16
@@ -0,0 +1,16 @@
|
||||
require("../../../../_virtual/_rolldown/runtime.js");
|
||||
const require_table_grid = require("../table-grid.js");
|
||||
let vue = require("vue");
|
||||
//#region ../../packages/components/table-v2/src/renderers/left-table.tsx
|
||||
function _isSlot(s) {
|
||||
return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !(0, vue.isVNode)(s);
|
||||
}
|
||||
const LeftTable = (props, { slots }) => {
|
||||
if (!props.columns.length) return;
|
||||
const { leftTableRef, ...rest } = props;
|
||||
return (0, vue.createVNode)(require_table_grid.default, (0, vue.mergeProps)({ "ref": leftTableRef }, rest), _isSlot(slots) ? slots : { default: () => [slots] });
|
||||
};
|
||||
//#endregion
|
||||
exports.default = LeftTable;
|
||||
|
||||
//# sourceMappingURL=left-table.js.map
|
||||
Generated
Vendored
+1
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"left-table.js","names":["Table","_isSlot","s","Object","prototype","toString","call","_isVNode","LeftTable","props","slots","columns","length","leftTableRef","rest","_createVNode","_mergeProps","default"],"sources":["../../../../../../../packages/components/table-v2/src/renderers/left-table.tsx"],"sourcesContent":["import Table from '../table-grid'\n\nimport type { FunctionalComponent, Ref } from 'vue'\nimport type { TableV2GridProps } from '../grid'\nimport type { TableGridInstance } from '../table-grid'\n\ntype LeftTableProps = TableV2GridProps & {\n leftTableRef: Ref<TableGridInstance | undefined>\n}\n\nconst LeftTable: FunctionalComponent<LeftTableProps> = (props, { slots }) => {\n if (!props.columns.length) return\n\n const { leftTableRef, ...rest } = props\n\n return (\n <Table ref={leftTableRef} {...rest}>\n {slots}\n </Table>\n )\n}\n\nexport default LeftTable\n"],"mappings":";;;;AAAiC,SAAAC,QAAAC,GAAA;CAAA,OAAA,OAAAA,MAAA,cAAAC,OAAAC,UAAAC,SAAAC,KAAAJ,EAAA,KAAA,qBAAA,EAAA,GAAA,IAAA,SAAAA,EAAA;;AAUjC,MAAMM,aAAkDC,OAAO,EAAEC,YAAY;CAC3E,IAAI,CAACD,MAAME,QAAQC,QAAQ;CAE3B,MAAM,EAAEC,cAAc,GAAGC,SAASL;CAElC,QAAA,GAAA,IAAA,aAAAT,mBAAAA,UAAAA,GAAAA,IAAAA,YAAA,EAAA,OACca,cAAY,EAAMC,KAAI,EAAAb,QAC/BS,MAAK,GAALA,QAAK,EAAAO,eAAA,CAALP,MAAK,EAAA,CAAA"}
|
||||
Generated
Vendored
+11
@@ -0,0 +1,11 @@
|
||||
import { TableV2GridProps } from "../grid.js";
|
||||
import { TableGridInstance } from "../table-grid.js";
|
||||
import { FunctionalComponent, Ref } from "vue";
|
||||
|
||||
//#region ../../packages/components/table-v2/src/renderers/main-table.d.ts
|
||||
type MainTableRendererProps = TableV2GridProps & {
|
||||
mainTableRef: Ref<TableGridInstance | undefined>;
|
||||
};
|
||||
declare const MainTable: FunctionalComponent<MainTableRendererProps>;
|
||||
//#endregion
|
||||
export { MainTableRendererProps, MainTable as default };
|
||||
Generated
Vendored
+15
@@ -0,0 +1,15 @@
|
||||
require("../../../../_virtual/_rolldown/runtime.js");
|
||||
const require_table_grid = require("../table-grid.js");
|
||||
let vue = require("vue");
|
||||
//#region ../../packages/components/table-v2/src/renderers/main-table.tsx
|
||||
function _isSlot(s) {
|
||||
return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !(0, vue.isVNode)(s);
|
||||
}
|
||||
const MainTable = (props, { slots }) => {
|
||||
const { mainTableRef, ...rest } = props;
|
||||
return (0, vue.createVNode)(require_table_grid.default, (0, vue.mergeProps)({ "ref": mainTableRef }, rest), _isSlot(slots) ? slots : { default: () => [slots] });
|
||||
};
|
||||
//#endregion
|
||||
exports.default = MainTable;
|
||||
|
||||
//# sourceMappingURL=main-table.js.map
|
||||
Generated
Vendored
+1
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"main-table.js","names":["Table","_isSlot","s","Object","prototype","toString","call","_isVNode","MainTable","props","slots","mainTableRef","rest","_createVNode","_mergeProps","default"],"sources":["../../../../../../../packages/components/table-v2/src/renderers/main-table.tsx"],"sourcesContent":["import Table from '../table-grid'\n\nimport type { FunctionalComponent, Ref } from 'vue'\nimport type { TableV2GridProps } from '../grid'\nimport type { TableGridInstance } from '../table-grid'\n\nexport type MainTableRendererProps = TableV2GridProps & {\n mainTableRef: Ref<TableGridInstance | undefined>\n}\n\nconst MainTable: FunctionalComponent<MainTableRendererProps> = (\n props: MainTableRendererProps,\n { slots }\n) => {\n const { mainTableRef, ...rest } = props\n return (\n <Table ref={mainTableRef} {...rest}>\n {slots}\n </Table>\n )\n}\n\nexport default MainTable\n"],"mappings":";;;;AAAiC,SAAAC,QAAAC,GAAA;CAAA,OAAA,OAAAA,MAAA,cAAAC,OAAAC,UAAAC,SAAAC,KAAAJ,EAAA,KAAA,qBAAA,EAAA,GAAA,IAAA,SAAAA,EAAA;;AAUjC,MAAMM,aACJC,OACA,EAAEC,YACC;CACH,MAAM,EAAEC,cAAc,GAAGC,SAASH;CAClC,QAAA,GAAA,IAAA,aAAAT,mBAAAA,UAAAA,GAAAA,IAAAA,YAAA,EAAA,OACcW,cAAY,EAAMC,KAAI,EAAAX,QAC/BS,MAAK,GAALA,QAAK,EAAAK,eAAA,CAALL,MAAK,EAAA,CAAA"}
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user