feat(styles): add style interfaces for radio, button, switch and checkbox

Author: Rui-Sun

packages/vtable/src/body-helper/style/ButtonStyle.ts

@@ -4,7 +4,41 @@ import type { ButtonStyle as ButtonStyleThemeOption } from '../../ts-types/colum
 
 let defaultStyle: ButtonStyle;
 
-export class ButtonStyle extends Style {
+/**
+ * 复选框样式接口，继承自 IStyleOption
+ */
+export interface IButtonStyle extends IStyleOption {
+  /**
+   * 按钮的颜色
+   */
+  buttonColor?: string;
+  /**
+   * 按钮的边框颜色
+   */
+  buttonBorderColor?: string;
+  /**
+   * 按钮的边框宽度
+   */
+  buttonLineWidth?: number;
+  /**
+   * 按钮的圆角半径
+   */
+  buttonBorderRadius?: number;
+  /**
+   * 按钮悬停时的颜色
+   */
+  buttonHoverColor?: string;
+  /**
+   * 按钮悬停时的边框颜色
+   */
+  buttonHoverBorderColor?: string;
+  /**
+   * 按钮悬停时的文本颜色
+   */
+  buttonTextHoverColor?: string;
+}
+
+export class ButtonStyle extends Style implements IButtonStyle {
   private _buttonColor: string;
   private _buttonBorderColor: string;
   private _buttonLineWidth: number;

packages/vtable/src/body-helper/style/CheckboxStyle.ts

@@ -4,7 +4,57 @@ import type { CheckboxStyle as CheckboxStyleThemeOption } from '../../ts-types/c
 
 let defaultStyle: CheckboxStyle;
 
-export class CheckboxStyle extends Style {
+/**
+ * 复选框样式接口，继承自 IStyleOption
+ */
+export interface ICheckboxStyle extends IStyleOption {
+  /**
+   * 复选框的尺寸
+   */
+  size?: number;
+  /**
+   * 文本与图标之间的间距
+   */
+  spaceBetweenTextAndIcon?: number;
+  /**
+   * 默认状态下的填充颜色
+   */
+  defaultFill?: string;
+  /**
+   * 默认状态下的边框颜色
+   */
+  defaultStroke?: string;
+  /**
+   * 禁用状态下的填充颜色
+   */
+  disableFill?: string;
+  /**
+   * 选中状态下的填充颜色
+   */
+  checkedFill?: string;
+  /**
+   * 选中状态下的边框颜色
+   */
+  checkedStroke?: string;
+  /**
+   * 禁用且选中状态下的填充颜色
+   */
+  disableCheckedFill?: string;
+  /**
+   * 禁用且选中状态下的边框颜色
+   */
+  disableCheckedStroke?: string;
+  /**
+   * 选中状态下的图标图片
+   */
+  checkIconImage?: string;
+  /**
+   * 部分选中状态下的图标图片
+   */
+  indeterminateIconImage?: string;
+}
+
+export class CheckboxStyle extends Style implements ICheckboxStyle {
   private _size: number;
   private _spaceBetweenTextAndIcon: number;
 

packages/vtable/src/body-helper/style/RadioStyle.ts

@@ -4,7 +4,33 @@ import type { RadioStyle as RadioStyleThemeOption } from '../../ts-types/column/
 
 let defaultStyle: RadioStyle;
 
-export class RadioStyle extends Style {
+/**
+ * 单选框样式接口，继承自 IStyleOption
+ */
+export interface IRadioStyle extends IStyleOption {
+  /**
+   * 单选框的尺寸
+   */
+  size?: number;
+  /**
+   * 文本与图标之间的间距
+   */
+  spaceBetweenTextAndIcon?: number;
+  /**
+   * 单元格内多个单选框，单选框直接的间距
+   */
+  spaceBetweenRadio?: number;
+  /**
+   * 单选框的外部半径
+   */
+  outerRadius?: number;
+  /**
+   * 单选框的内部半径
+   */
+  innerRadius?: number;
+}
+
+export class RadioStyle extends Style implements IRadioStyle {
   private _size: number;
   private _spaceBetweenTextAndIcon: number;
   private _spaceBetweenRadio: number;

packages/vtable/src/body-helper/style/SwitchStyle.ts

@@ -4,7 +4,53 @@ import type { SwitchStyle as SwitchStyleThemeOption } from '../../ts-types/colum
 
 let defaultStyle: SwitchStyle;
 
-export class SwitchStyle extends Style {
+/**
+ * 开关样式接口，继承自 IStyleOption
+ */
+export interface ISwitchStyle extends IStyleOption {
+  /**
+   * 开关的尺寸
+   */
+  size?: number;
+  /**
+   * 文本与开关之间的间距
+   */
+  spaceBetweenTextAndCircle?: number;
+  /**
+   * 开关的圆半径
+   */
+  circleRadius?: number;
+  /**
+   * 开关的宽度
+   */
+  boxWidth?: number;
+  /**
+   * 开关的高度
+   */
+  boxHeight?: number;
+  /**
+   * 选中状态下的填充颜色
+   */
+  checkedFill?: string;
+  /**
+   * 未选中状态下的填充颜色
+   */
+  uncheckedFill?: string;
+  /**
+   * 禁用且选中状态下的填充颜色
+   */
+  disableCheckedFill?: string;
+  /**
+   * 禁用且未选中状态下的填充颜色
+   */
+  disableUncheckedFill?: string;
+  /**
+   * 开关圆的填充颜色
+   */
+  circleFill?: string;
+}
+
+export class SwitchStyle extends Style implements ISwitchStyle {
   private _spaceBetweenTextAndCircle: number;
   private _circleRadius: number;
   private _boxWidth: number;