@visactor/vtable 0.20.2-alpha.3 → 0.20.3

package/dist/vtable.js

@@ -21847,13 +21847,122 @@
         }
     }
 
-    function of$2(columnStyle, bodyStyle, styleArg, StyleClassDef = Style$1, globalAutoWrapText) {
+    let defaultStyle$5;
+    let CheckboxStyle$1 = class CheckboxStyle extends Style$1 {
+        _size;
+        _spaceBetweenTextAndIcon;
+        _defaultFill;
+        _defaultStroke;
+        _disableFill;
+        _checkedFill;
+        _checkedStroke;
+        _disableCheckedFill;
+        _disableCheckedStroke;
+        _checkIconImage;
+        _indeterminateIconImage;
+        static get DEFAULT() {
+            return defaultStyle$5 ? defaultStyle$5 : (defaultStyle$5 = new CheckboxStyle());
+        }
+        constructor(style = {}, headerStyle = {}, checkboxThemeStyle = {}) {
+            super(style, headerStyle);
+            this._size = (style?.size ?? headerStyle?.size ?? checkboxThemeStyle?.size) || 14;
+            this._spaceBetweenTextAndIcon =
+                (style?.spaceBetweenTextAndIcon ??
+                    headerStyle?.spaceBetweenTextAndIcon ??
+                    checkboxThemeStyle?.spaceBetweenTextAndIcon) ||
+                    8;
+            this._defaultFill = style?.checkboxStyle?.defaultFill ?? checkboxThemeStyle?.defaultFill;
+            this._defaultStroke = style?.checkboxStyle?.defaultStroke ?? checkboxThemeStyle?.defaultStroke;
+            this._disableFill = style?.checkboxStyle?.disableFill ?? checkboxThemeStyle?.disableFill;
+            this._checkedFill = style?.checkboxStyle?.checkedFill ?? checkboxThemeStyle?.checkedFill;
+            this._checkedStroke = style?.checkboxStyle?.checkedStroke ?? checkboxThemeStyle?.checkedStroke;
+            this._disableCheckedFill = style?.checkboxStyle?.disableCheckedFill ?? checkboxThemeStyle?.disableCheckedFill;
+            this._disableCheckedStroke = style?.checkboxStyle?.disableCheckedStroke ?? checkboxThemeStyle?.disableCheckedStroke;
+            this._checkIconImage = style?.checkboxStyle?.checkIconImage ?? checkboxThemeStyle?.checkIconImage;
+            this._indeterminateIconImage =
+                style?.checkboxStyle?.indeterminateIconImage ?? checkboxThemeStyle?.indeterminateIconImage;
+        }
+        get size() {
+            return this._size;
+        }
+        set size(size) {
+            this._size = size;
+        }
+        get spaceBetweenTextAndIcon() {
+            return this._spaceBetweenTextAndIcon;
+        }
+        set spaceBetweenTextAndIcon(spaceBetweenTextAndIcon) {
+            this._spaceBetweenTextAndIcon = spaceBetweenTextAndIcon;
+        }
+        get defaultFill() {
+            return this._defaultFill;
+        }
+        set defaultFill(defaultFill) {
+            this._defaultFill = defaultFill;
+        }
+        get defaultStroke() {
+            return this._defaultStroke;
+        }
+        set defaultStroke(defaultStroke) {
+            this._defaultStroke = defaultStroke;
+        }
+        get disableFill() {
+            return this._disableFill;
+        }
+        set disableFill(disableFill) {
+            this._disableFill = disableFill;
+        }
+        get checkedFill() {
+            return this._checkedFill;
+        }
+        set checkedFill(checkedFill) {
+            this._checkedFill = checkedFill;
+        }
+        get checkedStroke() {
+            return this._checkedStroke;
+        }
+        set checkedStroke(checkedStroke) {
+            this._checkedStroke = checkedStroke;
+        }
+        get disableCheckedFill() {
+            return this._disableCheckedFill;
+        }
+        set disableCheckedFill(disableCheckedFill) {
+            this._disableCheckedFill = disableCheckedFill;
+        }
+        get disableCheckedStroke() {
+            return this._disableCheckedStroke;
+        }
+        set disableCheckedStroke(disableCheckedStroke) {
+            this._disableCheckedStroke = disableCheckedStroke;
+        }
+        get checkIconImage() {
+            return this._checkIconImage;
+        }
+        set checkIconImage(checkIconImage) {
+            this._checkIconImage = checkIconImage;
+        }
+        get indeterminateIconImage() {
+            return this._indeterminateIconImage;
+        }
+        set indeterminateIconImage(indeterminateIconImage) {
+            this._indeterminateIconImage = indeterminateIconImage;
+        }
+        getStyle(style) {
+            return new CheckboxStyle(style, this);
+        }
+        clone() {
+            return new CheckboxStyle(this);
+        }
+    };
+
+    function of$2(columnStyle, bodyStyle, styleArg, StyleClassDef = Style$1, globalAutoWrapText, theme) {
         if (columnStyle || bodyStyle) {
             if (columnStyle instanceof Style$1) {
                 return columnStyle;
             }
             else if (typeof columnStyle === 'function') {
-                return of$2(columnStyle(styleArg), bodyStyle, styleArg, StyleClassDef, globalAutoWrapText);
+                return of$2(columnStyle(styleArg), bodyStyle, styleArg, StyleClassDef, globalAutoWrapText, theme);
             }
             if (!columnStyle) {
                 columnStyle = {};
@@ -21861,12 +21970,15 @@
             if (globalAutoWrapText && !isValid$1(columnStyle.autoWrapText)) {
                 columnStyle.autoWrapText = true;
             }
+            if (StyleClassDef === CheckboxStyle$1) {
+                return new CheckboxStyle$1(columnStyle ?? {}, (bodyStyle ?? {}), (theme.checkboxStyle ?? {}));
+            }
             return new StyleClassDef((columnStyle ?? {}), (bodyStyle ?? {}));
         }
         return StyleClassDef.DEFAULT;
     }
 
-    let defaultStyle$5;
+    let defaultStyle$4;
     const EVENT_TYPE$1 = {
         CHANGE_STYLE: 'change_style'
     };
@@ -21901,7 +22013,7 @@
             return EVENT_TYPE$1;
         }
         static get DEFAULT() {
-            return defaultStyle$5 ? defaultStyle$5 : (defaultStyle$5 = new Style());
+            return defaultStyle$4 ? defaultStyle$4 : (defaultStyle$4 = new Style());
         }
         constructor(style = {}, headerStyle = {}) {
             super();
@@ -22086,12 +22198,12 @@
         }
     }
 
-    let defaultStyle$4;
+    let defaultStyle$3;
     class TextHeaderStyle extends Style {
         _autoWrapText;
         _lineClamp;
         static get DEFAULT() {
-            return defaultStyle$4 ? defaultStyle$4 : (defaultStyle$4 = new TextHeaderStyle());
+            return defaultStyle$3 ? defaultStyle$3 : (defaultStyle$3 = new TextHeaderStyle());
         }
         constructor(style = {}, headerStyle = null) {
             super(style, headerStyle);
@@ -22115,13 +22227,122 @@
         }
     }
 
-    function of$1(headerStyle, defaultHeaderStyle, styleArg, StyleClass, globalAutoWrapText) {
+    let defaultStyle$2;
+    class CheckboxStyle extends Style {
+        _size;
+        _spaceBetweenTextAndIcon;
+        _defaultFill;
+        _defaultStroke;
+        _disableFill;
+        _checkedFill;
+        _checkedStroke;
+        _disableCheckedFill;
+        _disableCheckedStroke;
+        _checkIconImage;
+        _indeterminateIconImage;
+        static get DEFAULT() {
+            return defaultStyle$2 ? defaultStyle$2 : (defaultStyle$2 = new CheckboxStyle());
+        }
+        constructor(style = {}, headerStyle = {}, checkboxThemeStyle = {}) {
+            super(style, headerStyle);
+            this._size = (style?.size ?? headerStyle?.size ?? checkboxThemeStyle?.size) || 14;
+            this._spaceBetweenTextAndIcon =
+                (style?.spaceBetweenTextAndIcon ??
+                    headerStyle?.spaceBetweenTextAndIcon ??
+                    checkboxThemeStyle?.spaceBetweenTextAndIcon) ||
+                    8;
+            this._defaultFill = style?.checkboxStyle?.defaultFill ?? checkboxThemeStyle?.defaultFill;
+            this._defaultStroke = style?.checkboxStyle?.defaultStroke ?? checkboxThemeStyle?.defaultStroke;
+            this._disableFill = style?.checkboxStyle?.disableFill ?? checkboxThemeStyle?.disableFill;
+            this._checkedFill = style?.checkboxStyle?.checkedFill ?? checkboxThemeStyle?.checkedFill;
+            this._checkedStroke = style?.checkboxStyle?.checkedStroke ?? checkboxThemeStyle?.checkedStroke;
+            this._disableCheckedFill = style?.checkboxStyle?.disableCheckedFill ?? checkboxThemeStyle?.disableCheckedFill;
+            this._disableCheckedStroke = style?.checkboxStyle?.disableCheckedStroke ?? checkboxThemeStyle?.disableCheckedStroke;
+            this._checkIconImage = style?.checkboxStyle?.checkIconImage ?? checkboxThemeStyle?.checkIconImage;
+            this._indeterminateIconImage =
+                style?.checkboxStyle?.indeterminateIconImage ?? checkboxThemeStyle?.indeterminateIconImage;
+        }
+        get size() {
+            return this._size;
+        }
+        set size(size) {
+            this._size = size;
+        }
+        get spaceBetweenTextAndIcon() {
+            return this._spaceBetweenTextAndIcon;
+        }
+        set spaceBetweenTextAndIcon(spaceBetweenTextAndIcon) {
+            this._spaceBetweenTextAndIcon = spaceBetweenTextAndIcon;
+        }
+        get defaultFill() {
+            return this._defaultFill;
+        }
+        set defaultFill(defaultFill) {
+            this._defaultFill = defaultFill;
+        }
+        get defaultStroke() {
+            return this._defaultStroke;
+        }
+        set defaultStroke(defaultStroke) {
+            this._defaultStroke = defaultStroke;
+        }
+        get disableFill() {
+            return this._disableFill;
+        }
+        set disableFill(disableFill) {
+            this._disableFill = disableFill;
+        }
+        get checkedFill() {
+            return this._checkedFill;
+        }
+        set checkedFill(checkedFill) {
+            this._checkedFill = checkedFill;
+        }
+        get checkedStroke() {
+            return this._checkedStroke;
+        }
+        set checkedStroke(checkedStroke) {
+            this._checkedStroke = checkedStroke;
+        }
+        get disableCheckedFill() {
+            return this._disableCheckedFill;
+        }
+        set disableCheckedFill(disableCheckedFill) {
+            this._disableCheckedFill = disableCheckedFill;
+        }
+        get disableCheckedStroke() {
+            return this._disableCheckedStroke;
+        }
+        set disableCheckedStroke(disableCheckedStroke) {
+            this._disableCheckedStroke = disableCheckedStroke;
+        }
+        get checkIconImage() {
+            return this._checkIconImage;
+        }
+        set checkIconImage(checkIconImage) {
+            this._checkIconImage = checkIconImage;
+        }
+        get indeterminateIconImage() {
+            return this._indeterminateIconImage;
+        }
+        set indeterminateIconImage(indeterminateIconImage) {
+            this._indeterminateIconImage = indeterminateIconImage;
+        }
+        getStyle(style) {
+            return new CheckboxStyle(style, this);
+        }
+        clone() {
+            return new CheckboxStyle(this);
+        }
+    }
+
+    function of$1(headerStyle, defaultHeaderStyle, styleArg, StyleClass, globalAutoWrapText, theme) {
         if (headerStyle || defaultHeaderStyle) {
             if (headerStyle instanceof Style) {
                 return headerStyle;
             }
             else if (typeof headerStyle === 'function') {
-                return of$1(headerStyle(styleArg), defaultHeaderStyle, styleArg, StyleClass, globalAutoWrapText);
+                return of$1(headerStyle(styleArg), defaultHeaderStyle, styleArg, StyleClass, globalAutoWrapText, theme);
             }
             if (!headerStyle) {
                 headerStyle = {};
@@ -22129,6 +22350,9 @@
             if (globalAutoWrapText && !isValid$1(headerStyle.autoWrapText)) {
                 headerStyle.autoWrapText = true;
             }
+            if (StyleClass === CheckboxStyle) {
+                return new CheckboxStyle(headerStyle ?? {}, (defaultHeaderStyle ?? {}), (theme.checkboxStyle ?? {}));
+            }
             return new StyleClass(headerStyle ?? {}, (defaultHeaderStyle ?? {}));
         }
         return StyleClass.DEFAULT;
@@ -23758,7 +23982,9 @@
         _frozenColumnLine = null;
         _selectionStyle = null;
         _axisStyle = null;
+        _checkboxStyle = null;
         _textPopTipStyle = null;
+        isPivot = false;
         constructor(obj, superTheme) {
             this.internalTheme = {
                 obj,
@@ -23773,18 +23999,6 @@
             const { obj, superTheme } = this.internalTheme;
             return getProp$1(obj, superTheme, ['underlayBackgroundColor']);
         }
-        get cellInnerBorder() {
-            const { obj, superTheme } = this.internalTheme;
-            return !!getProp$1(obj, superTheme, ['cellInnerBorder']);
-        }
-        get cellBorderClipDirection() {
-            const { obj, superTheme } = this.internalTheme;
-            return getProp$1(obj, superTheme, ['cellBorderClipDirection']) ?? 'top-left';
-        }
-        get _contentOffset() {
-            const { obj, superTheme } = this.internalTheme;
-            return getProp$1(obj, superTheme, ['_contentOffset']) ?? 0;
-        }
         get defaultStyle() {
             if (!this._defaultStyle) {
                 const { obj, superTheme } = this.internalTheme;
@@ -23970,7 +24184,7 @@
         get rowHeaderStyle() {
             if (!this._rowHeader) {
                 const { obj, superTheme } = this.internalTheme;
-                const header = ingoreNoneValueMerge({}, this.defaultStyle, superTheme.rowHeaderStyle, obj.rowHeaderStyle ?? obj.headerStyle);
+                const header = ingoreNoneValueMerge({}, this.defaultStyle, superTheme.rowHeaderStyle, obj.rowHeaderStyle ?? (this.isPivot ? null : obj.headerStyle));
                 this._rowHeader = this.getStyle(header);
             }
             return this._rowHeader;
@@ -24191,6 +24405,14 @@
             }
             return this._axisStyle;
         }
+        get checkboxStyle() {
+            if (!this._checkboxStyle) {
+                const { obj, superTheme } = this.internalTheme;
+                const checkboxStyle = ingoreNoneValueMerge({}, superTheme.checkboxStyle, obj.checkboxStyle);
+                this._checkboxStyle = checkboxStyle;
+            }
+            return this._checkboxStyle;
+        }
         get textPopTipStyle() {
             if (!this._textPopTipStyle) {
                 const { obj, superTheme } = this.internalTheme;
@@ -32835,16 +33057,22 @@
         let fontFamily;
         let fontSize;
         let fontWeight;
+        let fontStyle;
+        let fontVariant;
         if (font) {
-            const { family, size, weight } = parseFont(font);
+            const { family, size, weight, style, variant } = parseFont(font);
             fontFamily = family.join(' ');
             fontSize = size;
             fontWeight = weight;
+            fontStyle = style;
+            fontStyle = variant;
         }
         else {
             fontFamily = getProp('fontFamily', headerStyle, col, row, table);
             fontSize = getProp('fontSize', headerStyle, col, row, table);
             fontWeight = getProp('fontWeight', headerStyle, col, row, table);
+            fontStyle = getProp('fontStyle', headerStyle, col, row, table);
+            fontVariant = getProp('fontVariant', headerStyle, col, row, table);
         }
         const textAlign = getProp('textAlign', headerStyle, col, row, table);
         const textBaseline = getProp('textBaseline', headerStyle, col, row, table);
@@ -32880,6 +33108,8 @@
                 fontFamily,
                 fontSize,
                 fontWeight,
+                fontStyle,
+                fontVariant,
                 fill: color,
                 textAlign,
                 textBaseline,
@@ -33932,50 +34162,6 @@
         return undefined;
     }
 
-    function getCellBorderStrokeWidth(col, row, cellTheme, table) {
-        let strokeArrayWidth = cellTheme?.group?.strokeArrayWidth ?? undefined;
-        if (!table.theme.cellInnerBorder) {
-            return strokeArrayWidth;
-        }
-        if (col === 0) {
-            strokeArrayWidth = strokeArrayWidth ?? [
-                cellTheme?.group?.lineWidth,
-                cellTheme?.group?.lineWidth,
-                cellTheme?.group?.lineWidth,
-                cellTheme?.group?.lineWidth
-            ];
-            strokeArrayWidth[3] = 0;
-        }
-        if (col === table.colCount - 1) {
-            strokeArrayWidth = strokeArrayWidth ?? [
-                cellTheme?.group?.lineWidth,
-                cellTheme?.group?.lineWidth,
-                cellTheme?.group?.lineWidth,
-                cellTheme?.group?.lineWidth
-            ];
-            strokeArrayWidth[1] = 0;
-        }
-        if (row === 0) {
-            strokeArrayWidth = strokeArrayWidth ?? [
-                cellTheme?.group?.lineWidth,
-                cellTheme?.group?.lineWidth,
-                cellTheme?.group?.lineWidth,
-                cellTheme?.group?.lineWidth
-            ];
-            strokeArrayWidth[0] = 0;
-        }
-        if (row === table.rowCount - 1) {
-            strokeArrayWidth = strokeArrayWidth ?? [
-                cellTheme?.group?.lineWidth,
-                cellTheme?.group?.lineWidth,
-                cellTheme?.group?.lineWidth,
-                cellTheme?.group?.lineWidth
-            ];
-            strokeArrayWidth[2] = 0;
-        }
-        return strokeArrayWidth;
-    }
-
     function createImageCellGroup(columnGroup, xOrigin, yOrigin, col, row, width, height, keepAspectRatio, imageAutoSizing, padding, textAlign, textBaseline, table, cellTheme) {
         const headerStyle = table._getCellStyle(col, row);
         const functionalPadding = getFunctionalProp('padding', headerStyle, col, row, table);
@@ -33988,7 +34174,6 @@
         if (cellTheme?.text?.textBaseline) {
             textBaseline = cellTheme?.text?.textBaseline;
         }
-        const strokeArrayWidth = getCellBorderStrokeWidth(col, row, cellTheme, table);
         const cellGroup = new Group$1({
             x: xOrigin,
             y: yOrigin,
@@ -33997,7 +34182,7 @@
             lineWidth: cellTheme?.group?.lineWidth ?? undefined,
             fill: cellTheme?.group?.fill ?? undefined,
             stroke: cellTheme?.group?.stroke ?? undefined,
-            strokeArrayWidth: strokeArrayWidth ?? undefined,
+            strokeArrayWidth: cellTheme?.group?.strokeArrayWidth ?? undefined,
             strokeArrayColor: cellTheme?.group?.strokeArrayColor ?? undefined,
             cursor: cellTheme?.group?.cursor ?? undefined,
             lineDash: cellTheme?.group?.lineDash ?? undefined,
@@ -34642,7 +34827,6 @@
     const yScale = new LinearScale();
     function createSparkLineCellGroup(cellGroup, columnGroup, xOrigin, yOrigin, col, row, width, height, padding, table, cellTheme) {
         if (!cellGroup) {
-            const strokeArrayWidth = getCellBorderStrokeWidth(col, row, cellTheme, table);
             cellGroup = new Group$1({
                 x: xOrigin,
                 y: yOrigin,
@@ -34651,7 +34835,7 @@
                 lineWidth: cellTheme?.group?.lineWidth ?? undefined,
                 fill: cellTheme?.group?.fill ?? undefined,
                 stroke: cellTheme?.group?.stroke ?? undefined,
-                strokeArrayWidth: strokeArrayWidth,
+                strokeArrayWidth: cellTheme?.group?.strokeArrayWidth ?? undefined,
                 strokeArrayColor: cellTheme?.group?.strokeArrayColor ?? undefined,
                 cursor: cellTheme?.group?.cursor ?? undefined,
                 lineDash: cellTheme?.group?.lineDash ?? undefined,
@@ -35026,7 +35210,6 @@
             padding = functionalPadding;
         }
         if (!cellGroup) {
-            const strokeArrayWidth = getCellBorderStrokeWidth(col, row, cellTheme, table);
             cellGroup = new Group$1({
                 x: xOrigin,
                 y: yOrigin,
@@ -35035,7 +35218,7 @@
                 lineWidth: cellTheme?.group?.lineWidth ?? undefined,
                 fill: cellTheme?.group?.fill ?? undefined,
                 stroke: cellTheme?.group?.stroke ?? undefined,
-                strokeArrayWidth: strokeArrayWidth,
+                strokeArrayWidth: cellTheme?.group?.strokeArrayWidth ?? undefined,
                 strokeArrayColor: cellTheme?.group?.strokeArrayColor ?? undefined,
                 cursor: cellTheme?.group?.cursor ?? undefined,
                 lineDash: cellTheme?.group?.lineDash ?? undefined,
@@ -35287,15 +35470,6 @@
                 const hierarchyOffset = range
                     ? getHierarchyOffset(range.start.col, range.start.row, table)
                     : getHierarchyOffset(cellGroup.col, cellGroup.row, table);
-                let _contentOffset = 0;
-                if (isNumber$2(table.theme._contentOffset)) {
-                    if (textAlign === 'left') {
-                        _contentOffset = table.theme._contentOffset;
-                    }
-                    else if (textAlign === 'right') {
-                        _contentOffset = -table.theme._contentOffset;
-                    }
-                }
                 const attribute = {
                     text: text.length === 1 ? text[0] : text,
                     maxLineWidth: autoColWidth ? Infinity : cellWidth - (padding[1] + padding[3] + hierarchyOffset),
@@ -35305,7 +35479,7 @@
                     wordBreak: 'break-word',
                     heightLimit: autoRowHeight ? -1 : cellHeight - (padding[0] + padding[2]),
                     pickable: false,
-                    dx: hierarchyOffset + _contentOffset,
+                    dx: hierarchyOffset,
                     whiteSpace: text.length === 1 && !autoWrapText ? 'no-wrap' : 'normal'
                 };
                 const wrapText = new Text$1(cellTheme.text ? Object.assign({}, cellTheme.text, attribute) : attribute);
@@ -35381,15 +35555,6 @@
             });
             let textMark;
             if (inlineFrontIcons.length === 0 && inlineEndIcons.length === 0) {
-                let _contentOffset = 0;
-                if (isNumber$2(table.theme._contentOffset)) {
-                    if (textAlign === 'left') {
-                        _contentOffset = table.theme._contentOffset;
-                    }
-                    else if (textAlign === 'right') {
-                        _contentOffset = -table.theme._contentOffset;
-                    }
-                }
                 const text = convertInternal(textStr).replace(/\r?\n/g, '\n').replace(/\r/g, '\n').split('\n');
                 const attribute = {
                     text: text.length === 1 ? text[0] : text,
@@ -35400,8 +35565,7 @@
                     autoWrapText,
                     lineClamp,
                     wordBreak: 'break-word',
-                    whiteSpace: text.length === 1 && !autoWrapText ? 'no-wrap' : 'normal',
-                    dx: _contentOffset
+                    whiteSpace: text.length === 1 && !autoWrapText ? 'no-wrap' : 'normal'
                 };
                 const wrapText = new Text$1(cellTheme.text ? Object.assign({}, cellTheme.text, attribute) : attribute);
                 wrapText.name = 'text';
@@ -35777,7 +35941,6 @@
         const autoColWidth = colWidth === 'auto';
         const autoWrapText = headerStyle.autoWrapText ?? table.internalProps.autoWrapText;
         const lineClamp = headerStyle.lineClamp;
-        const strokeArrayWidth = getCellBorderStrokeWidth(col, row, cellTheme, table);
         const cellGroup = new Group$1({
             x: xOrigin,
             y: yOrigin,
@@ -35786,7 +35949,7 @@
             lineWidth: cellTheme?.group?.lineWidth ?? undefined,
             fill: cellTheme?.group?.fill ?? undefined,
             stroke: cellTheme?.group?.stroke ?? undefined,
-            strokeArrayWidth: strokeArrayWidth ?? undefined,
+            strokeArrayWidth: cellTheme?.group?.strokeArrayWidth ?? undefined,
             strokeArrayColor: cellTheme?.group?.strokeArrayColor ?? undefined,
             cursor: cellTheme?.group?.cursor ?? undefined,
             lineDash: cellTheme?.group?.lineDash ?? undefined,
@@ -35850,7 +36013,6 @@
         if (cellTheme?.text?.textBaseline) {
             textBaseline = cellTheme?.text?.textBaseline;
         }
-        const strokeArrayWidth = getCellBorderStrokeWidth(col, row, cellTheme, table);
         const cellGroup = new Group$1({
             x: xOrigin,
             y: yOrigin,
@@ -35859,7 +36021,7 @@
             lineWidth: cellTheme?.group?.lineWidth ?? undefined,
             fill: cellTheme?.group?.fill ?? undefined,
             stroke: cellTheme?.group?.stroke ?? undefined,
-            strokeArrayWidth: strokeArrayWidth,
+            strokeArrayWidth: cellTheme?.group?.strokeArrayWidth ?? undefined,
             strokeArrayColor: cellTheme?.group?.strokeArrayColor ?? undefined,
             cursor: cellTheme?.group?.cursor ?? undefined,
             lineDash: cellTheme?.group?.lineDash ?? undefined,
@@ -35944,7 +36106,6 @@
 
     function createCheckboxCellGroup(cellGroup, columnGroup, xOrigin, yOrigin, col, row, colWidth, width, height, padding, textAlign, textBaseline, table, cellTheme, define) {
         if (!cellGroup) {
-            const strokeArrayWidth = getCellBorderStrokeWidth(col, row, cellTheme, table);
             cellGroup = new Group$1({
                 x: xOrigin,
                 y: yOrigin,
@@ -35953,7 +36114,7 @@
                 lineWidth: cellTheme?.group?.lineWidth ?? undefined,
                 fill: cellTheme?.group?.fill ?? undefined,
                 stroke: cellTheme?.group?.stroke ?? undefined,
-                strokeArrayWidth: strokeArrayWidth,
+                strokeArrayWidth: cellTheme?.group?.strokeArrayWidth ?? undefined,
                 strokeArrayColor: cellTheme?.group?.strokeArrayColor ?? undefined,
                 cursor: cellTheme?.group?.cursor ?? undefined,
                 lineDash: cellTheme?.group?.lineDash ?? undefined,
@@ -35997,6 +36158,15 @@
         const style = table._getCellStyle(col, row);
         const size = getProp('size', style, col, row, table);
         const spaceBetweenTextAndIcon = getProp('spaceBetweenTextAndIcon', style, col, row, table);
+        const defaultFill = getProp('defaultFill', style, col, row, table);
+        const defaultStroke = getProp('defaultStroke', style, col, row, table);
+        const disableFill = getProp('disableFill', style, col, row, table);
+        const checkedFill = getProp('checkedFill', style, col, row, table);
+        const checkedStroke = getProp('checkedStroke', style, col, row, table);
+        const disableCheckedFill = getProp('disableCheckedFill', style, col, row, table);
+        const disableCheckedStroke = getProp('disableCheckedStroke', style, col, row, table);
+        const checkIconImage = getProp('checkIconImage', style, col, row, table);
+        const indeterminateIconImage = getProp('indeterminateIconImage', style, col, row, table);
         const value = table.getCellValue(col, row);
         const dataValue = table.getCellOriginValue(col, row);
         let isChecked;
@@ -36053,45 +36223,39 @@
             whiteSpace: text.length === 1 && !autoWrapText ? 'no-wrap' : 'normal'
         };
         const testAttribute = cellTheme.text ? Object.assign({}, cellTheme.text, attribute) : attribute;
-        let checkbox;
+        const checkboxAttributes = {
+            x: 0,
+            y: 0,
+            text: testAttribute,
+            icon: {
+                width: Math.floor(size / 1.4),
+                height: Math.floor(size / 1.4)
+            },
+            box: {
+                width: size,
+                height: size
+            },
+            spaceBetweenTextAndIcon,
+            disabled: isDisabled ?? globalDisable ?? false
+        };
         if (isChecked === 'indeterminate') {
-            checkbox = new CheckBox({
-                x: 0,
-                y: 0,
-                text: testAttribute,
-                icon: {
-                    width: Math.floor(size / 1.4),
-                    height: Math.floor(size / 1.4)
-                },
-                box: {
-                    width: size,
-                    height: size
-                },
-                spaceBetweenTextAndIcon,
-                checked: undefined,
-                indeterminate: true,
-                disabled: isDisabled ?? globalDisable ?? false
-            });
+            checkboxAttributes.checked = undefined;
+            checkboxAttributes.indeterminate = true;
         }
         else {
-            checkbox = new CheckBox({
-                x: 0,
-                y: 0,
-                text: testAttribute,
-                icon: {
-                    width: Math.floor(size / 1.4),
-                    height: Math.floor(size / 1.4)
-                },
-                box: {
-                    width: size,
-                    height: size
-                },
-                spaceBetweenTextAndIcon,
-                checked: isChecked,
-                indeterminate: undefined,
-                disabled: isDisabled ?? globalDisable ?? false
-            });
-        }
+            checkboxAttributes.checked = isChecked;
+            checkboxAttributes.indeterminate = undefined;
+        }
+        defaultFill && (checkboxAttributes.box.fill = defaultFill);
+        defaultStroke && (checkboxAttributes.box.stroke = defaultStroke);
+        disableFill && (checkboxAttributes.box.disableFill = disableFill);
+        checkedFill && (checkboxAttributes.box.checkedFill = checkedFill);
+        checkedStroke && (checkboxAttributes.box.checkedStroke = checkedStroke);
+        disableCheckedFill && (checkboxAttributes.box.disableCheckedFill = disableCheckedFill);
+        disableCheckedStroke && (checkboxAttributes.box.disableCheckedStroke = disableCheckedStroke);
+        checkIconImage && (checkboxAttributes.icon.checkIconImage = checkIconImage);
+        indeterminateIconImage && (checkboxAttributes.icon.indeterminateIconImage = indeterminateIconImage);
+        const checkbox = new CheckBox(checkboxAttributes);
         checkbox.name = 'checkbox';
         return checkbox;
     }
@@ -40117,29 +40281,9 @@
             if (Array.isArray(strokeArrayColor) || Array.isArray(strokeArrayWidth)) {
                 if ((typeof lineWidth === 'number' && lineWidth & 1) ||
                     (Array.isArray(strokeArrayWidth) && strokeArrayWidth.some(width => width & 1))) {
-                    const table = group.stage.table;
-                    const bottomRight = table.theme.cellBorderClipDirection === 'bottom-right';
-                    let deltaWidth = 0;
-                    let deltaHeight = 0;
-                    if (bottomRight) {
-                        x = Math.floor(x) - 0.5;
-                        y = Math.floor(y) - 0.5;
-                        if (group.role === 'cell') {
-                            const col = group.col;
-                            const row = group.row;
-                            if (table && col === table.colCount - 1) {
-                                deltaWidth = 1;
-                            }
-                            if (table && row === table.rowCount - 1) {
-                                deltaHeight = 1;
-                            }
-                        }
-                    }
-                    else {
-                        x = Math.floor(x) + 0.5;
-                        y = Math.floor(y) + 0.5;
-                    }
-                    const { width: widthFroDraw, height: heightFroDraw } = getCellSizeForDraw(group, Math.ceil(width + deltaWidth), Math.ceil(height + deltaHeight));
+                    x = Math.floor(x) + 0.5;
+                    y = Math.floor(y) + 0.5;
+                    const { width: widthFroDraw, height: heightFroDraw } = getCellSizeForDraw(group, Math.ceil(width), Math.ceil(height));
                     widthForStroke = widthFroDraw;
                     heightForStroke = heightFroDraw;
                 }
@@ -40353,29 +40497,9 @@
             let widthForStroke;
             let heightForStroke;
             if (lineWidth & 1) {
-                const table = group.stage.table;
-                const bottomRight = table.theme.cellBorderClipDirection === 'bottom-right';
-                let deltaWidth = 0;
-                let deltaHeight = 0;
-                if (bottomRight) {
-                    x = Math.floor(x) - 0.5;
-                    y = Math.floor(y) - 0.5;
-                    if (group.role === 'cell') {
-                        const col = group.col;
-                        const row = group.row;
-                        if (table && col === table.colCount - 1) {
-                            deltaWidth = 1;
-                        }
-                        if (table && row === table.rowCount - 1) {
-                            deltaHeight = 1;
-                        }
-                    }
-                }
-                else {
-                    x = Math.floor(x) + 0.5;
-                    y = Math.floor(y) + 0.5;
-                }
-                const { width: widthFroDraw, height: heightFroDraw } = getCellSizeForDraw(group, Math.ceil(width + deltaWidth), Math.ceil(height + deltaHeight));
+                x = Math.floor(x) + 0.5;
+                y = Math.floor(y) + 0.5;
+                const { width: widthFroDraw, height: heightFroDraw } = getCellSizeForDraw(group, Math.ceil(width), Math.ceil(height));
                 widthForStroke = widthFroDraw;
                 heightForStroke = heightFroDraw;
             }
@@ -40445,30 +40569,10 @@
                 lineWidth & 1) {
                 const { width: widthFroDraw, height: heightFroDraw } = getCellSizeForDraw(group, Math.ceil(width), Math.ceil(height));
                 context.beginPath();
-                const table = group.stage.table;
-                const bottomRight = table.theme.cellBorderClipDirection === 'bottom-right';
-                let deltaWidth = 0;
-                let deltaHeight = 0;
-                if (bottomRight) {
-                    x = Math.floor(x) - 0.5;
-                    y = Math.floor(y) - 0.5;
-                    if (group.role === 'cell') {
-                        const col = group.col;
-                        const row = group.row;
-                        if (table && col === table.colCount - 1) {
-                            deltaWidth = 1;
-                        }
-                        if (table && row === table.rowCount - 1) {
-                            deltaHeight = 1;
-                        }
-                    }
-                }
-                else {
-                    x = Math.floor(x) + 0.5;
-                    y = Math.floor(y) + 0.5;
-                }
+                x = Math.floor(x) + 0.5;
+                y = Math.floor(y) + 0.5;
                 if (cornerRadius) {
-                    createRectPath(context, x, y, widthFroDraw + deltaWidth, heightFroDraw + deltaHeight, cornerRadius);
+                    createRectPath(context, x, y, widthFroDraw, heightFroDraw, cornerRadius);
                 }
                 else {
                     context.rect(x, y, widthFroDraw, heightFroDraw);
@@ -40673,24 +40777,14 @@
                 return;
             }
             if (Array.isArray(stroke) || Array.isArray(strokeArrayColor) || Array.isArray(strokeArrayWidth)) {
-                let deltaWidth = 0;
-                let deltaHeight = 0;
-                if ((typeof lineWidth === 'number' && lineWidth & 1) ||
-                    (Array.isArray(strokeArrayWidth) && strokeArrayWidth.some(width => width & 1))) {
-                    const table = rect.stage.table;
-                    const bottomRight = table.theme.cellBorderClipDirection === 'bottom-right';
-                    if (bottomRight) {
-                        x = Math.floor(x) - 0.5;
-                        y = Math.floor(y) - 0.5;
-                        deltaWidth = 0.5;
-                        deltaHeight = 0.5;
-                    }
-                    else {
-                        x = Math.floor(x) + 0.5;
-                        y = Math.floor(y) + 0.5;
-                    }
+                if (rect.name !== 'border-rect' &&
+                    rect.name !== 'table-border-rect' &&
+                    ((typeof lineWidth === 'number' && lineWidth & 1) ||
+                        (Array.isArray(strokeArrayWidth) && strokeArrayWidth.some(width => width & 1)))) {
+                    x = Math.floor(x) + 0.5;
+                    y = Math.floor(y) + 0.5;
                 }
-                renderStroke(rect, context, x, y, rectAttribute, stroke, strokeArrayWidth || lineWidth, strokeArrayColor || strokeColor, Math.ceil(width + deltaWidth), Math.ceil(height + deltaHeight));
+                renderStroke(rect, context, x, y, rectAttribute, stroke, strokeArrayWidth || lineWidth, strokeArrayColor || strokeColor, Math.ceil(width), Math.ceil(height));
             }
         }
     };
@@ -45551,17 +45645,17 @@
                 }
             }
             if (this.table.bottomFrozenRowCount > 0) {
-                this.bottomFrozenGroup.setAttribute('y', this.tableGroup.attribute.height - this.bottomFrozenGroup.attribute.height);
+                this.bottomFrozenGroup.setAttribute('y', this.tableGroup.attribute.height - this.table.getBottomFrozenRowsHeight());
                 this.leftBottomCornerGroup.setAttributes({
                     visible: true,
-                    y: this.tableGroup.attribute.height - this.bottomFrozenGroup.attribute.height,
-                    height: this.bottomFrozenGroup.attribute.height,
+                    y: this.tableGroup.attribute.height - this.table.getBottomFrozenRowsHeight(),
+                    height: this.table.getBottomFrozenRowsHeight(),
                     width: this.table.getFrozenColsWidth()
                 });
                 this.rightBottomCornerGroup.setAttributes({
                     visible: true,
-                    y: this.tableGroup.attribute.height - this.bottomFrozenGroup.attribute.height,
-                    height: this.bottomFrozenGroup.attribute.height
+                    y: this.tableGroup.attribute.height - this.table.getBottomFrozenRowsHeight(),
+                    height: this.table.getBottomFrozenRowsHeight()
                 });
             }
             if (this.table.rightFrozenColCount > 0) {
@@ -48197,7 +48291,10 @@
                 if (cellGoup?.role === 'cell' &&
                     isValid$1(cellGoup.col) &&
                     isValid$1(cellGoup.row) &&
-                    (cellGoup.col !== table.stateManager.hover.cellPos.col || cellGoup.row !== table.stateManager.hover.cellPos.row)) {
+                    (cellGoup.col !== table.stateManager.hover.cellPos.col ||
+                        cellGoup.row !== table.stateManager.hover.cellPos.row) &&
+                    (cellGoup.col !== table.stateManager.hover.cellPosContainHeader?.col ||
+                        cellGoup.row !== table.stateManager.hover.cellPosContainHeader?.row)) {
                     table.fireListeners(TABLE_EVENT_TYPE.MOUSEENTER_CELL, {
                         col: cellGoup.col,
                         row: cellGoup.row,
@@ -49522,7 +49619,7 @@
         }
     }
 
-    let defaultStyle$3;
+    let defaultStyle$1;
     const DEFAULT_BAR_COLOR = (args) => {
         const num = args.value;
         if (Number(num) > 80) {
@@ -49553,7 +49650,7 @@
         _barMarkPosition;
         _barRightToLeft;
         static get DEFAULT() {
-            return defaultStyle$3 ? defaultStyle$3 : (defaultStyle$3 = new ProgressBarStyle());
+            return defaultStyle$1 ? defaultStyle$1 : (defaultStyle$1 = new ProgressBarStyle());
         }
         constructor(style = {}, bodyStyle = {}) {
             super(style, bodyStyle);
@@ -49691,35 +49788,6 @@
     ];
     const iconPropKeys = ICON_PROP_KEYS;
 
-    let defaultStyle$2;
-    let CheckboxStyle$1 = class CheckboxStyle extends Style$1 {
-        _size;
-        _spaceBetweenTextAndIcon;
-        static get DEFAULT() {
-            return defaultStyle$2 ? defaultStyle$2 : (defaultStyle$2 = new CheckboxStyle());
-        }
-        constructor(style = {}, headerStyle = {}) {
-            super(style, headerStyle);
-            this._size = (style.size ?? headerStyle?.size) || 14;
-            this._spaceBetweenTextAndIcon = (style.spaceBetweenTextAndIcon ?? headerStyle?.spaceBetweenTextAndIcon) || 8;
-        }
-        get size() {
-            return this._size;
-        }
-        set size(size) {
-            this._size = size;
-        }
-        get spaceBetweenTextAndIcon() {
-            return this._spaceBetweenTextAndIcon;
-        }
-        set spaceBetweenTextAndIcon(spaceBetweenTextAndIcon) {
-            this._spaceBetweenTextAndIcon = spaceBetweenTextAndIcon;
-        }
-        clone() {
-            return new CheckboxStyle(this);
-        }
-    };
-
     class BodyHelper {
         expandIcon;
         collapseIcon;
@@ -50441,10 +50509,10 @@
         return itemContainer;
     }
 
-    let defaultStyle$1;
+    let defaultStyle;
     class ImageStyle extends Style {
         static get DEFAULT() {
-            return defaultStyle$1 ? defaultStyle$1 : (defaultStyle$1 = new ImageStyle());
+            return defaultStyle ? defaultStyle : (defaultStyle = new ImageStyle());
         }
         constructor(style = {}, headerStyle = {}) {
             super(style, headerStyle);
@@ -50455,35 +50523,6 @@
         }
     }
 
-    let defaultStyle;
-    class CheckboxStyle extends Style {
-        _size;
-        _spaceBetweenTextAndIcon;
-        static get DEFAULT() {
-            return defaultStyle ? defaultStyle : (defaultStyle = new CheckboxStyle());
-        }
-        constructor(style = {}, headerStyle = {}) {
-            super(style, headerStyle);
-            this._size = (style.size ?? headerStyle?.size) || 14;
-            this._spaceBetweenTextAndIcon = (style.spaceBetweenTextAndIcon ?? headerStyle?.spaceBetweenTextAndIcon) || 8;
-        }
-        get size() {
-            return this._size;
-        }
-        set size(size) {
-            this._size = size;
-        }
-        get spaceBetweenTextAndIcon() {
-            return this._spaceBetweenTextAndIcon;
-        }
-        set spaceBetweenTextAndIcon(spaceBetweenTextAndIcon) {
-            this._spaceBetweenTextAndIcon = spaceBetweenTextAndIcon;
-        }
-        clone() {
-            return new CheckboxStyle(this);
-        }
-    }
-
     class HeaderHelper {
         normalIcon;
         upIcon;
@@ -52609,7 +52648,7 @@
             return TABLE_EVENT_TYPE;
         }
         options;
-        version = "0.20.2-alpha.3";
+        version = "0.20.3";
         pagination;
         id = `VTable${Date.now()}`;
         headerStyleCache;
@@ -52699,6 +52738,7 @@
             internalProps.cellTextOverflows = {};
             internalProps.focusedTable = false;
             internalProps.theme = themes.of(options.theme ?? themes.DEFAULT);
+            internalProps.theme.isPivot = this.isPivotTable();
             if (container) {
                 container.innerHTML = '';
                 container.appendChild(internalProps.element);
@@ -52709,6 +52749,7 @@
             }
             this.options = options;
             internalProps.theme = themes.of(options.theme ?? themes.DEFAULT);
+            internalProps.theme.isPivot = this.isPivotTable();
             internalProps.bodyHelper = new BodyHelper(this);
             internalProps.headerHelper = new HeaderHelper(this);
             internalProps.autoWrapText = options.autoWrapText;
@@ -53749,6 +53790,7 @@
             this.colWidthsLimit = {};
             internalProps.stick.changedCells.clear();
             internalProps.theme = themes.of(options.theme ?? themes.DEFAULT);
+            internalProps.theme.isPivot = this.isPivotTable();
             this.scenegraph.updateStageBackground();
             internalProps.autoWrapText = options.autoWrapText;
             internalProps.allowFrozenColCount = options.allowFrozenColCount ?? 0;
@@ -54057,11 +54099,13 @@
         }
         set theme(theme) {
             this.internalProps.theme = themes.of(theme ?? themes.DEFAULT);
+            this.internalProps.theme.isPivot = this.isPivotTable();
             this.options.theme = theme;
         }
         updateTheme(theme) {
             const oldHoverState = { col: this.stateManager.hover.cellPos.col, row: this.stateManager.hover.cellPos.row };
             this.internalProps.theme = themes.of(theme ?? themes.DEFAULT);
+            this.internalProps.theme.isPivot = this.isPivotTable();
             this.options.theme = theme;
             this.scenegraph.updateComponent();
             this.scenegraph.updateStageBackground();
@@ -54177,7 +54221,7 @@
                             value: customMerge.text,
                             dataValue: this.getCellOriginValue(col, row),
                             cellHeaderPaths: this.getCellHeaderPaths(col, row)
-                        }, styleClass, this.options.autoWrapText);
+                        }, styleClass, this.options.autoWrapText, this.theme);
                         customMerge.style = fullStyle;
                     }
                     return customMerge;
@@ -54325,7 +54369,7 @@
                         value: this.getCellValue(col, row),
                         dataValue: this.getCellOriginValue(col, row),
                         cellHeaderPaths: this.getCellHeaderPaths(col, row)
-                    }, styleClass, this.options.autoWrapText);
+                    }, styleClass, this.options.autoWrapText, this.theme);
                 }
                 else if (layoutMap.isRightFrozenColumn(col, row) && this.theme.rightFrozenStyle) {
                     cacheStyle = of$1(paddingForAxis ? { padding: paddingForAxis } : {}, this.theme.rightFrozenStyle, {
@@ -54335,7 +54379,7 @@
                         value: this.getCellValue(col, row),
                         dataValue: this.getCellOriginValue(col, row),
                         cellHeaderPaths: this.getCellHeaderPaths(col, row)
-                    }, styleClass, this.options.autoWrapText);
+                    }, styleClass, this.options.autoWrapText, this.theme);
                 }
                 else {
                     const style = hd?.style || {};
@@ -54353,7 +54397,7 @@
                         value: this.getCellValue(col, row),
                         dataValue: this.getCellOriginValue(col, row),
                         cellHeaderPaths: this.getCellHeaderPaths(col, row)
-                    }, styleClass, this.options.autoWrapText);
+                    }, styleClass, this.options.autoWrapText, this.theme);
                 }
                 this.headerStyleCache.set(cacheKey, cacheStyle);
                 return cacheStyle;
@@ -54391,7 +54435,7 @@
                 value: this.getCellValue(col, row),
                 dataValue: this.getCellOriginValue(col, row),
                 cellHeaderPaths: this.getCellHeaderPaths(col, row)
-            }, styleClass, this.options.autoWrapText);
+            }, styleClass, this.options.autoWrapText, this.theme);
             if (!isFunction$1(style)) {
                 if (layoutMap.isBottomFrozenRow(row)) {
                     this.bodyBottomStyleCache.set(cacheKey, cacheStyle);
@@ -56240,10 +56284,10 @@
         }
         get rightFrozenColCount() {
             if (this._table.internalProps.rightFrozenColCount) {
-                if (this.colCount - this.rowHeaderLevelCount >= this._table.internalProps.rightFrozenColCount) {
+                if (this.colCount - this.frozenColCount >= this._table.internalProps.rightFrozenColCount) {
                     return this._table.internalProps.rightFrozenColCount;
                 }
-                return this.colCount - this.rowHeaderLevelCount;
+                return Math.max(0, this.colCount - this.frozenColCount);
             }
             return 0;
         }
@@ -57765,8 +57809,11 @@
             if (Array.isArray(option) || option?.order) {
                 sort = option;
             }
-            else {
-                sort = option?.sortState;
+            else if (option) {
+                sort = option.sortState;
+            }
+            else if (option === null) {
+                sort = null;
             }
             typeof window !== 'undefined' ? window.performance.now() : 0;
             const oldHoverState = { col: this.stateManager.hover.cellPos.col, row: this.stateManager.hover.cellPos.row };
@@ -64110,7 +64157,7 @@
     }
 
     registerForVrender();
-    const version = "0.20.2-alpha.3";
+    const version = "0.20.3";
     function getIcons() {
         return get$2();
     }