feat: add icon_size config in theme

This commit is contained in:
fangsmile 2024-09-25 20:35:10 +08:00 committed by Rui-Sun
parent 9aae939555
commit f9ae348abc
3 changed files with 74 additions and 45 deletions

View File

@ -9,32 +9,52 @@ import { DrillDown, DrillUp } from './tools/global';
let sort_color: string;
let sort_color_opacity: string;
let sort_color_2: string;
let sort_color_2_opacity: string;
let sort_color_opacity_2: string;
let sort_icon_size: number;
let sort_icon_size_2: number;
let frozen_color: string;
let frozen_color_opacity: string;
let freeze_color_opacity: string;
let frozen_color_2: string;
let frozen_color_2_opacity: string;
let frozen_color_opacity_2: string;
let frozen_icon_size: number;
let frozen_icon_size_2: number;
let collapse_color: string;
let collapse_color_opacity: string;
let collapse_icon_size: number;
let collapse_icon_size_2: number;
let expand_color: string;
let expand_color_opacity: string;
let expand_icon_size: number;
let expand_icon_size_2: number;
let dragReorder_color: string;
let dragReorder_color_opacity: string;
let dragReorder_icon_size: number;
export function setIconColor(themeIconsColor: ITableThemeDefine['internalIconsStyle']) {
sort_color = themeIconsColor?.sort_color ?? '#282F38';
sort_color_opacity = themeIconsColor?.sort_color_opacity ?? '0.35';
sort_color_2 = themeIconsColor?.sort_color_2 ?? '#416EFF';
sort_color_2_opacity = themeIconsColor?.sort_color_2_opacity ?? '1';
sort_color_opacity_2 = themeIconsColor?.sort_color_opacity_2 ?? '1';
sort_icon_size = themeIconsColor?.sort_icon_size ?? 16;
sort_icon_size_2 = themeIconsColor?.sort_icon_size_2 ?? 22;
frozen_color = themeIconsColor?.frozen_color ?? '#282F38';
frozen_color_opacity = themeIconsColor?.frozen_color_opacity ?? '0.35';
freeze_color_opacity = themeIconsColor?.frozen_color_opacity ?? '0.2'; //之前是个0.2 为了不让bugServer错误太多
frozen_color_2 = themeIconsColor?.frozen_color_2 ?? '#416EFF';
frozen_color_2_opacity = themeIconsColor?.frozen_color_2_opacity ?? '1';
frozen_color_opacity_2 = themeIconsColor?.frozen_color_opacity_2 ?? '1';
frozen_icon_size = themeIconsColor?.frozen_icon_size ?? 22;
frozen_icon_size_2 = themeIconsColor?.frozen_icon_size_2 ?? 22;
collapse_color = themeIconsColor?.collapse_color ?? '#141414';
collapse_color_opacity = themeIconsColor?.collapse_color_opacity ?? '0.65';
collapse_icon_size = themeIconsColor?.collapse_icon_size ?? 16;
collapse_icon_size_2 = themeIconsColor?.frozen_icon_size_2 ?? 22;
expand_color = themeIconsColor?.expand_color ?? '#141414';
expand_color_opacity = themeIconsColor?.expand_color_opacity ?? '0.65';
expand_icon_size = themeIconsColor?.expand_icon_size ?? 16;
expand_icon_size_2 = themeIconsColor?.expand_icon_size_2 ?? 22;
dragReorder_color = themeIconsColor?.dragReorder_color ?? '#666666';
dragReorder_color_opacity = themeIconsColor?.dragReorder_color_opacity ?? '1';
dragReorder_icon_size = themeIconsColor?.dragReorder_icon_size ?? 20;
}
const builtins = {
get sort_downward(): SvgIcon {
@ -42,19 +62,19 @@ const builtins = {
type: 'svg',
svg:
'<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">' +
` <path d="M4.6665 9H11.3332L7.99984 13.1667L4.6665 9Z" fill="${sort_color_2}" fill-opacity="${sort_color_2_opacity}"/>` +
` <path d="M4.6665 9H11.3332L7.99984 13.1667L4.6665 9Z" fill="${sort_color_2}" fill-opacity="${sort_color_opacity_2}"/>` +
`<path d="M11.3335 7L4.66683 7L8.00016 2.83333L11.3335 7Z" fill="${sort_color}" fill-opacity="${sort_color_opacity}"/>` +
'</svg> ',
width: 16, //其实指定的是svg图片绘制多大实际下面的阴影是boxmargin也是相对阴影范围指定的
height: 16,
width: sort_icon_size, //其实指定的是svg图片绘制多大实际下面的阴影是boxmargin也是相对阴影范围指定的
height: sort_icon_size,
funcType: IconFuncTypeEnum.sort,
name: 'sort_downward',
// positionType: IconPosition.inlineEnd,
positionType: IconPosition.contentRight,
marginLeft: 3, //设计要求的是距离8px这个些5是基于外面的box而言的
hover: {
width: 22,
height: 22,
width: sort_icon_size_2,
height: sort_icon_size_2,
bgColor: 'rgba(101, 117, 168, 0.1)'
},
cursor: 'pointer'
@ -66,18 +86,18 @@ const builtins = {
svg:
'<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">' +
`<path d="M4.6665 9H11.3332L7.99984 13.1667L4.6665 9Z" fill="${sort_color}" fill-opacity="${sort_color_opacity}"/>` +
`<path d="M11.3335 7L4.66683 7L8.00016 2.83333L11.3335 7Z" fill="${sort_color_2}" fill-opacity="${sort_color_2_opacity}"/>` +
`<path d="M11.3335 7L4.66683 7L8.00016 2.83333L11.3335 7Z" fill="${sort_color_2}" fill-opacity="${sort_color_opacity_2}"/>` +
' </svg>',
width: 16,
height: 16,
width: sort_icon_size,
height: sort_icon_size,
funcType: IconFuncTypeEnum.sort,
// positionType: IconPosition.inlineEnd,
positionType: IconPosition.contentRight,
name: 'sort_upward',
marginLeft: 3,
hover: {
width: 22,
height: 22,
width: sort_icon_size_2,
height: sort_icon_size_2,
bgColor: 'rgba(101, 117, 168, 0.1)'
},
cursor: 'pointer'
@ -91,16 +111,16 @@ const builtins = {
`<path d="M4.6665 9H11.3332L7.99984 13.1667L4.6665 9Z" fill="${sort_color}" fill-opacity="${sort_color_opacity}"/>` +
`<path d="M11.3335 7L4.66683 7L8.00016 2.83333L11.3335 7Z" fill="${sort_color}" fill-opacity="${sort_color_opacity}"/>` +
'</svg> ',
width: 16,
height: 16,
width: sort_icon_size,
height: sort_icon_size,
funcType: IconFuncTypeEnum.sort,
// positionType: IconPosition.inlineEnd,
positionType: IconPosition.contentRight,
name: 'sort_normal',
marginLeft: 3,
hover: {
width: 22,
height: 22,
width: sort_icon_size_2,
height: sort_icon_size_2,
bgColor: 'rgba(101, 117, 168, 0.1)'
},
cursor: 'pointer'
@ -113,7 +133,7 @@ const builtins = {
svg:
'<svg width="22" height="22" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">' +
'<g clip-path="url(#clip0)">' +
`<path d="M17.1313 8.42047C17.1932 8.48238 17.2423 8.55587 17.2759 8.63676C17.3094 8.71764 17.3266 8.80434 17.3266 8.89189C17.3266 8.97944 17.3094 9.06613 17.2759 9.14702C17.2423 9.2279 17.1932 9.3014 17.1313 9.3633L13.3843 13.1103C13.7007 14.3048 13.5305 15.4443 12.8388 16.2395C12.8104 16.2781 12.7778 16.3136 12.7417 16.3451L12.712 16.3755C12.6501 16.4374 12.5766 16.4865 12.4957 16.52C12.4148 16.5535 12.3281 16.5707 12.2406 16.5707C12.153 16.5707 12.0663 16.5535 11.9854 16.52C11.9046 16.4865 11.8311 16.4374 11.7692 16.3755L9.17633 13.7826L6.05316 16.9058L5.11983 17.0925C5.09291 17.0979 5.06508 17.0965 5.03881 17.0886C5.01254 17.0806 4.98863 17.0663 4.96923 17.0469C4.94982 17.0275 4.9355 17.0036 4.92755 16.9773C4.9196 16.951 4.91827 16.9232 4.92366 16.8963L5.11033 15.963L8.23333 12.8396L5.64066 10.2471C5.57875 10.1852 5.52964 10.1117 5.49614 10.0309C5.46263 9.94997 5.44539 9.86327 5.44539 9.77572C5.44539 9.68817 5.46263 9.60148 5.49614 9.52059C5.52964 9.43971 5.57875 9.36621 5.64066 9.3043C5.65066 9.2943 5.66066 9.2843 5.67099 9.27464C5.70266 9.2383 5.73833 9.20547 5.77766 9.17664C6.57283 8.48564 7.71199 8.31564 8.90599 8.63197L12.6528 4.88497C12.7147 4.82306 12.7882 4.77395 12.8691 4.74045C12.95 4.70694 13.0367 4.6897 13.1242 4.6897C13.2118 4.6897 13.2985 4.70694 13.3794 4.74045C13.4603 4.77395 13.5338 4.82306 13.5957 4.88497L17.1312 8.42047H17.1313ZM15.7172 8.8918L13.1243 6.29914L9.56483 9.8588C9.47574 9.94788 9.36323 10.0099 9.24034 10.0376C9.11746 10.0654 8.98922 10.0578 8.87049 10.0156C8.22783 9.78764 7.63899 9.7553 7.17749 9.89814L12.1182 14.8388C12.261 14.3771 12.2287 13.7885 12.0007 13.146C11.9585 13.0272 11.9509 12.899 11.9787 12.7761C12.0064 12.6532 12.0684 12.5407 12.1575 12.4516L15.7172 8.89164V8.8918Z" fill="${frozen_color}" fill-opacity="${frozen_color_opacity}"/>` +
`<path d="M17.1313 8.42047C17.1932 8.48238 17.2423 8.55587 17.2759 8.63676C17.3094 8.71764 17.3266 8.80434 17.3266 8.89189C17.3266 8.97944 17.3094 9.06613 17.2759 9.14702C17.2423 9.2279 17.1932 9.3014 17.1313 9.3633L13.3843 13.1103C13.7007 14.3048 13.5305 15.4443 12.8388 16.2395C12.8104 16.2781 12.7778 16.3136 12.7417 16.3451L12.712 16.3755C12.6501 16.4374 12.5766 16.4865 12.4957 16.52C12.4148 16.5535 12.3281 16.5707 12.2406 16.5707C12.153 16.5707 12.0663 16.5535 11.9854 16.52C11.9046 16.4865 11.8311 16.4374 11.7692 16.3755L9.17633 13.7826L6.05316 16.9058L5.11983 17.0925C5.09291 17.0979 5.06508 17.0965 5.03881 17.0886C5.01254 17.0806 4.98863 17.0663 4.96923 17.0469C4.94982 17.0275 4.9355 17.0036 4.92755 16.9773C4.9196 16.951 4.91827 16.9232 4.92366 16.8963L5.11033 15.963L8.23333 12.8396L5.64066 10.2471C5.57875 10.1852 5.52964 10.1117 5.49614 10.0309C5.46263 9.94997 5.44539 9.86327 5.44539 9.77572C5.44539 9.68817 5.46263 9.60148 5.49614 9.52059C5.52964 9.43971 5.57875 9.36621 5.64066 9.3043C5.65066 9.2943 5.66066 9.2843 5.67099 9.27464C5.70266 9.2383 5.73833 9.20547 5.77766 9.17664C6.57283 8.48564 7.71199 8.31564 8.90599 8.63197L12.6528 4.88497C12.7147 4.82306 12.7882 4.77395 12.8691 4.74045C12.95 4.70694 13.0367 4.6897 13.1242 4.6897C13.2118 4.6897 13.2985 4.70694 13.3794 4.74045C13.4603 4.77395 13.5338 4.82306 13.5957 4.88497L17.1312 8.42047H17.1313ZM15.7172 8.8918L13.1243 6.29914L9.56483 9.8588C9.47574 9.94788 9.36323 10.0099 9.24034 10.0376C9.11746 10.0654 8.98922 10.0578 8.87049 10.0156C8.22783 9.78764 7.63899 9.7553 7.17749 9.89814L12.1182 14.8388C12.261 14.3771 12.2287 13.7885 12.0007 13.146C11.9585 13.0272 11.9509 12.899 11.9787 12.7761C12.0064 12.6532 12.0684 12.5407 12.1575 12.4516L15.7172 8.89164V8.8918Z" fill="${frozen_color}" fill-opacity="${freeze_color_opacity}"/>` +
'</g>' +
'<defs>' +
'<clipPath id="clip0">' +
@ -121,15 +141,15 @@ const builtins = {
'</clipPath>' +
'</defs>' +
'</svg>',
width: 22,
height: 22,
width: frozen_icon_size,
height: frozen_icon_size,
name: 'freeze',
funcType: IconFuncTypeEnum.frozen,
positionType: IconPosition.right,
marginRight: 0,
hover: {
width: 22,
height: 22,
width: frozen_icon_size_2,
height: frozen_icon_size_2,
bgColor: 'rgba(101, 117, 168, 0.1)'
},
cursor: 'pointer'
@ -142,15 +162,15 @@ const builtins = {
'<svg width="22" height="22" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">' +
`<path d="M8.49975 3.66663C8.32294 3.66663 8.15337 3.73686 8.02835 3.86189C7.90332 3.98691 7.83309 4.15648 7.83309 4.33329V9.63246C6.76475 10.2533 6.07942 11.1795 6.00625 12.2308C5.99892 12.2786 5.99692 12.3268 6.00009 12.3741L5.99975 12.4166C5.99975 12.5934 6.06999 12.763 6.19501 12.888C6.32004 13.0131 6.48961 13.0833 6.66642 13.0833H10.3333L10.3331 17.5L10.8611 18.292C10.8763 18.3148 10.8969 18.3335 10.9211 18.3464C10.9453 18.3594 10.9723 18.3662 10.9998 18.3662C11.0272 18.3662 11.0542 18.3594 11.0784 18.3464C11.1026 18.3335 11.1232 18.3148 11.1384 18.292L11.6664 17.5L11.6666 13.0833H15.3331C15.5099 13.0833 15.6795 13.0131 15.8045 12.888C15.9295 12.763 15.9998 12.5934 15.9998 12.4166C15.9998 12.4025 15.9998 12.3883 15.9994 12.3741C16.0028 12.3263 16.0008 12.2776 15.9933 12.2295C15.9196 11.1786 15.2343 10.2528 14.1664 9.63229V4.33329C14.1664 4.15648 14.0962 3.98691 13.9712 3.86189C13.8461 3.73686 13.6766 3.66663 13.4998 3.66663H8.49975Z" fill="${frozen_color}" fill-opacity="${frozen_color_opacity}"/>` +
'</svg>',
width: 22,
height: 22,
width: frozen_icon_size,
height: frozen_icon_size,
name: 'frozen',
funcType: IconFuncTypeEnum.frozen,
positionType: IconPosition.right,
marginRight: 0,
hover: {
width: 22,
height: 22,
width: frozen_icon_size_2,
height: frozen_icon_size_2,
bgColor: 'rgba(101, 117, 168, 0.1)'
},
cursor: 'pointer'
@ -161,18 +181,18 @@ const builtins = {
type: 'svg',
svg:
'<svg width="22" height="22" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">' +
`<path d="M8.49975 3.66663C8.32294 3.66663 8.15337 3.73686 8.02835 3.86189C7.90332 3.98691 7.83309 4.15648 7.83309 4.33329V9.63246C6.76475 10.2533 6.07942 11.1795 6.00625 12.2308C5.99892 12.2786 5.99692 12.3268 6.00009 12.3741L5.99975 12.4166C5.99975 12.5934 6.06999 12.763 6.19501 12.888C6.32004 13.0131 6.48961 13.0833 6.66642 13.0833H10.3333L10.3331 17.5L10.8611 18.292C10.8763 18.3148 10.8969 18.3335 10.9211 18.3464C10.9453 18.3594 10.9723 18.3662 10.9998 18.3662C11.0272 18.3662 11.0542 18.3594 11.0784 18.3464C11.1026 18.3335 11.1232 18.3148 11.1384 18.292L11.6664 17.5L11.6666 13.0833H15.3331C15.5099 13.0833 15.6795 13.0131 15.8045 12.888C15.9295 12.763 15.9998 12.5934 15.9998 12.4166C15.9998 12.4025 15.9998 12.3883 15.9994 12.3741C16.0028 12.3263 16.0008 12.2776 15.9933 12.2295C15.9196 11.1786 15.2343 10.2528 14.1664 9.63229V4.33329C14.1664 4.15648 14.0962 3.98691 13.9712 3.86189C13.8461 3.73686 13.6766 3.66663 13.4998 3.66663H8.49975Z" fill="${frozen_color_2}" fill-opacity="${frozen_color_2_opacity}"/>` +
`<path d="M8.49975 3.66663C8.32294 3.66663 8.15337 3.73686 8.02835 3.86189C7.90332 3.98691 7.83309 4.15648 7.83309 4.33329V9.63246C6.76475 10.2533 6.07942 11.1795 6.00625 12.2308C5.99892 12.2786 5.99692 12.3268 6.00009 12.3741L5.99975 12.4166C5.99975 12.5934 6.06999 12.763 6.19501 12.888C6.32004 13.0131 6.48961 13.0833 6.66642 13.0833H10.3333L10.3331 17.5L10.8611 18.292C10.8763 18.3148 10.8969 18.3335 10.9211 18.3464C10.9453 18.3594 10.9723 18.3662 10.9998 18.3662C11.0272 18.3662 11.0542 18.3594 11.0784 18.3464C11.1026 18.3335 11.1232 18.3148 11.1384 18.292L11.6664 17.5L11.6666 13.0833H15.3331C15.5099 13.0833 15.6795 13.0131 15.8045 12.888C15.9295 12.763 15.9998 12.5934 15.9998 12.4166C15.9998 12.4025 15.9998 12.3883 15.9994 12.3741C16.0028 12.3263 16.0008 12.2776 15.9933 12.2295C15.9196 11.1786 15.2343 10.2528 14.1664 9.63229V4.33329C14.1664 4.15648 14.0962 3.98691 13.9712 3.86189C13.8461 3.73686 13.6766 3.66663 13.4998 3.66663H8.49975Z" fill="${frozen_color_2}" fill-opacity="${frozen_color_opacity_2}"/>` +
'</svg>',
width: 22,
height: 22,
width: frozen_icon_size,
height: frozen_icon_size,
funcType: IconFuncTypeEnum.frozen,
positionType: IconPosition.right,
name: 'frozenCurrent',
marginRight: 0,
// marginLeft: 6,
hover: {
width: 22,
height: 22,
width: frozen_icon_size_2,
height: frozen_icon_size_2,
bgColor: 'rgba(101, 117, 168, 0.1)'
},
cursor: 'pointer'
@ -275,16 +295,16 @@ const builtins = {
svg: `<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none">
<path d="M4.64988 6.81235C4.38797 6.48497 4.62106 6 5.04031 6L10.9597 6C11.3789 6 11.612 6.48497 11.3501 6.81235L8.39043 10.512C8.19027 10.7622 7.80973 10.7622 7.60957 10.512L4.64988 6.81235Z" fill="${expand_color}" fill-opacity="${expand_color_opacity}"/>
</svg>`,
width: 16, //其实指定的是svg图片绘制多大实际占位是boxmargin也是相对阴影范围指定的
height: 16,
width: expand_icon_size, //其实指定的是svg图片绘制多大实际占位是boxmargin也是相对阴影范围指定的
height: expand_icon_size,
funcType: IconFuncTypeEnum.expand,
name: 'expand',
positionType: IconPosition.contentLeft,
marginLeft: 0,
marginRight: 4,
hover: {
width: 22,
height: 22,
width: expand_icon_size_2,
height: expand_icon_size_2,
bgColor: 'rgba(101, 117, 168, 0.1)'
},
cursor: 'pointer'
@ -297,16 +317,16 @@ const builtins = {
svg: `<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none">
<path d="M5.81235 11.3501C5.48497 11.612 5 11.3789 5 10.9597L5 5.04031C5 4.62106 5.48497 4.38797 5.81235 4.64988L9.51196 7.60957C9.76216 7.80973 9.76216 8.19027 9.51196 8.39044L5.81235 11.3501Z" fill="${collapse_color}" fill-opacity="${collapse_color_opacity}"/>
</svg>`,
width: 16, //其实指定的是svg图片绘制多大实际占位是boxmargin也是相对阴影范围指定的
height: 16,
width: collapse_icon_size, //其实指定的是svg图片绘制多大实际占位是boxmargin也是相对阴影范围指定的
height: collapse_icon_size,
funcType: IconFuncTypeEnum.collapse,
name: 'collapse',
positionType: IconPosition.contentLeft,
marginLeft: 0,
marginRight: 4,
hover: {
width: 22,
height: 22,
width: collapse_icon_size_2,
height: collapse_icon_size_2,
bgColor: 'rgba(101, 117, 168, 0.1)'
},
cursor: 'pointer'
@ -342,8 +362,8 @@ const builtins = {
return {
type: 'svg',
svg: `<svg t="1710129136961" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5166" width="200" height="200"><path d="M362.666667 192m-64 0a64 64 0 1 0 128 0 64 64 0 1 0-128 0Z" fill="${dragReorder_color}" fill-opacity="${dragReorder_color_opacity}" p-id="5167"></path><path d="M661.333333 192m-64 0a64 64 0 1 0 128 0 64 64 0 1 0-128 0Z" fill="${dragReorder_color}" fill-opacity="${dragReorder_color_opacity}" p-id="5168"></path><path d="M362.666667 512m-64 0a64 64 0 1 0 128 0 64 64 0 1 0-128 0Z" fill="${dragReorder_color}" fill-opacity="${dragReorder_color_opacity}" p-id="5169"></path><path d="M661.333333 512m-64 0a64 64 0 1 0 128 0 64 64 0 1 0-128 0Z" fill="${dragReorder_color}" fill-opacity="${dragReorder_color_opacity}" p-id="5170"></path><path d="M362.666667 832m-64 0a64 64 0 1 0 128 0 64 64 0 1 0-128 0Z" fill="${dragReorder_color}" fill-opacity="${dragReorder_color_opacity}" p-id="5171"></path><path d="M661.333333 832m-64 0a64 64 0 1 0 128 0 64 64 0 1 0-128 0Z" fill="${dragReorder_color}" fill-opacity="${dragReorder_color_opacity}" p-id="5172"></path></svg>`,
width: 20, //其实指定的是svg图片绘制多大实际下面的阴影是boxmargin也是相对阴影范围指定的
height: 20,
width: dragReorder_icon_size, //其实指定的是svg图片绘制多大实际下面的阴影是boxmargin也是相对阴影范围指定的
height: dragReorder_icon_size,
funcType: IconFuncTypeEnum.dragReorder,
positionType: IconPosition.left,
name: 'dragReorder',

View File

@ -125,7 +125,7 @@ export default {
sort_color: '#FFFFFF',
sort_color_opacity: '0.75',
sort_color_2: '#416EFF',
sort_color_2_opacity: '1',
sort_color_opacity_2: '1',
frozen_color: '#FFFFFF',
frozen_color_opacity: '0.75',
collapse_color: '#FFF',

View File

@ -180,17 +180,26 @@ export interface ITableThemeDefine {
sort_color?: string;
sort_color_opacity?: string;
sort_color_2?: string;
sort_color_2_opacity?: string;
sort_color_opacity_2?: string;
sort_icon_size?: number;
sort_icon_size_2?: number;
frozen_color?: string;
frozen_color_opacity?: string;
frozen_color_2?: string;
frozen_color_2_opacity?: string;
frozen_color_opacity_2?: string;
frozen_icon_size?: number;
frozen_icon_size_2?: number;
collapse_color?: string;
collapse_color_opacity?: string;
collapse_icon_size?: number;
collapse_icon_size_2?: number;
expand_color?: string;
expand_color_opacity?: string;
expand_icon_size?: number;
expand_icon_size_2?: number;
dragReorder_color?: string;
dragReorder_color_opacity?: string;
dragReorder_icon_size?: number;
};
}