@visactor/vseed 0.1.32 → 0.1.34

package/dist/esm/types/zVseed.d.ts

@@ -1617,6 +1617,7 @@ export declare const zVSeed: z.ZodDiscriminatedUnion<[z.ZodObject<{
         areaBorderColor: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodString>>>;
         areaBorderWidth: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
         areaBorderRadius: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
+        areaLineDash: z.ZodOptional<z.ZodNullable<z.ZodArray<z.ZodNumber>>>;
         outerPadding: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
     }, z.core.$strip>>, z.ZodObject<{
         selector: z.ZodOptional<z.ZodNullable<z.ZodUnion<readonly [z.ZodUnion<readonly [z.ZodString, z.ZodNumber, z.ZodObject<{
@@ -1723,6 +1724,7 @@ export declare const zVSeed: z.ZodDiscriminatedUnion<[z.ZodObject<{
         areaBorderColor: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodString>>>;
         areaBorderWidth: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
         areaBorderRadius: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
+        areaLineDash: z.ZodOptional<z.ZodNullable<z.ZodArray<z.ZodNumber>>>;
         outerPadding: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
     }, z.core.$strip>]>>>;
     locale: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodEnum<{
@@ -2928,6 +2930,7 @@ export declare const zVSeed: z.ZodDiscriminatedUnion<[z.ZodObject<{
         areaBorderColor: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodString>>>;
         areaBorderWidth: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
         areaBorderRadius: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
+        areaLineDash: z.ZodOptional<z.ZodNullable<z.ZodArray<z.ZodNumber>>>;
         outerPadding: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
     }, z.core.$strip>>, z.ZodObject<{
         selector: z.ZodOptional<z.ZodNullable<z.ZodUnion<readonly [z.ZodUnion<readonly [z.ZodString, z.ZodNumber, z.ZodObject<{
@@ -3034,6 +3037,7 @@ export declare const zVSeed: z.ZodDiscriminatedUnion<[z.ZodObject<{
         areaBorderColor: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodString>>>;
         areaBorderWidth: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
         areaBorderRadius: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
+        areaLineDash: z.ZodOptional<z.ZodNullable<z.ZodArray<z.ZodNumber>>>;
         outerPadding: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
     }, z.core.$strip>]>>>;
     locale: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodEnum<{
@@ -4239,6 +4243,7 @@ export declare const zVSeed: z.ZodDiscriminatedUnion<[z.ZodObject<{
         areaBorderColor: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodString>>>;
         areaBorderWidth: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
         areaBorderRadius: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
+        areaLineDash: z.ZodOptional<z.ZodNullable<z.ZodArray<z.ZodNumber>>>;
         outerPadding: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
     }, z.core.$strip>>, z.ZodObject<{
         selector: z.ZodOptional<z.ZodNullable<z.ZodUnion<readonly [z.ZodUnion<readonly [z.ZodString, z.ZodNumber, z.ZodObject<{
@@ -4345,6 +4350,7 @@ export declare const zVSeed: z.ZodDiscriminatedUnion<[z.ZodObject<{
         areaBorderColor: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodString>>>;
         areaBorderWidth: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
         areaBorderRadius: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
+        areaLineDash: z.ZodOptional<z.ZodNullable<z.ZodArray<z.ZodNumber>>>;
         outerPadding: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
     }, z.core.$strip>]>>>;
     locale: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodEnum<{
@@ -5550,6 +5556,7 @@ export declare const zVSeed: z.ZodDiscriminatedUnion<[z.ZodObject<{
         areaBorderColor: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodString>>>;
         areaBorderWidth: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
         areaBorderRadius: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
+        areaLineDash: z.ZodOptional<z.ZodNullable<z.ZodArray<z.ZodNumber>>>;
         outerPadding: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
     }, z.core.$strip>>, z.ZodObject<{
         selector: z.ZodOptional<z.ZodNullable<z.ZodUnion<readonly [z.ZodUnion<readonly [z.ZodString, z.ZodNumber, z.ZodObject<{
@@ -5656,6 +5663,7 @@ export declare const zVSeed: z.ZodDiscriminatedUnion<[z.ZodObject<{
         areaBorderColor: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodString>>>;
         areaBorderWidth: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
         areaBorderRadius: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
+        areaLineDash: z.ZodOptional<z.ZodNullable<z.ZodArray<z.ZodNumber>>>;
         outerPadding: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
     }, z.core.$strip>]>>>;
     locale: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodEnum<{
@@ -6861,6 +6869,7 @@ export declare const zVSeed: z.ZodDiscriminatedUnion<[z.ZodObject<{
         areaBorderColor: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodString>>>;
         areaBorderWidth: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
         areaBorderRadius: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
+        areaLineDash: z.ZodOptional<z.ZodNullable<z.ZodArray<z.ZodNumber>>>;
         outerPadding: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
     }, z.core.$strip>>, z.ZodObject<{
         selector: z.ZodOptional<z.ZodNullable<z.ZodUnion<readonly [z.ZodUnion<readonly [z.ZodString, z.ZodNumber, z.ZodObject<{
@@ -6967,6 +6976,7 @@ export declare const zVSeed: z.ZodDiscriminatedUnion<[z.ZodObject<{
         areaBorderColor: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodString>>>;
         areaBorderWidth: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
         areaBorderRadius: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
+        areaLineDash: z.ZodOptional<z.ZodNullable<z.ZodArray<z.ZodNumber>>>;
         outerPadding: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
     }, z.core.$strip>]>>>;
     locale: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodEnum<{
@@ -8172,6 +8182,7 @@ export declare const zVSeed: z.ZodDiscriminatedUnion<[z.ZodObject<{
         areaBorderColor: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodString>>>;
         areaBorderWidth: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
         areaBorderRadius: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
+        areaLineDash: z.ZodOptional<z.ZodNullable<z.ZodArray<z.ZodNumber>>>;
         outerPadding: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
     }, z.core.$strip>>, z.ZodObject<{
         selector: z.ZodOptional<z.ZodNullable<z.ZodUnion<readonly [z.ZodUnion<readonly [z.ZodString, z.ZodNumber, z.ZodObject<{
@@ -8278,6 +8289,7 @@ export declare const zVSeed: z.ZodDiscriminatedUnion<[z.ZodObject<{
         areaBorderColor: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodString>>>;
         areaBorderWidth: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
         areaBorderRadius: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
+        areaLineDash: z.ZodOptional<z.ZodNullable<z.ZodArray<z.ZodNumber>>>;
         outerPadding: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
     }, z.core.$strip>]>>>;
     locale: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodEnum<{
@@ -9483,6 +9495,7 @@ export declare const zVSeed: z.ZodDiscriminatedUnion<[z.ZodObject<{
         areaBorderColor: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodString>>>;
         areaBorderWidth: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
         areaBorderRadius: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
+        areaLineDash: z.ZodOptional<z.ZodNullable<z.ZodArray<z.ZodNumber>>>;
         outerPadding: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
     }, z.core.$strip>>, z.ZodObject<{
         selector: z.ZodOptional<z.ZodNullable<z.ZodUnion<readonly [z.ZodUnion<readonly [z.ZodString, z.ZodNumber, z.ZodObject<{
@@ -9589,6 +9602,7 @@ export declare const zVSeed: z.ZodDiscriminatedUnion<[z.ZodObject<{
         areaBorderColor: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodString>>>;
         areaBorderWidth: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
         areaBorderRadius: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
+        areaLineDash: z.ZodOptional<z.ZodNullable<z.ZodArray<z.ZodNumber>>>;
         outerPadding: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
     }, z.core.$strip>]>>>;
     locale: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodEnum<{
@@ -11110,6 +11124,7 @@ export declare const zVSeed: z.ZodDiscriminatedUnion<[z.ZodObject<{
         areaBorderColor: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodString>>>;
         areaBorderWidth: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
         areaBorderRadius: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
+        areaLineDash: z.ZodOptional<z.ZodNullable<z.ZodArray<z.ZodNumber>>>;
         outerPadding: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
     }, z.core.$strip>>, z.ZodObject<{
         selector: z.ZodOptional<z.ZodNullable<z.ZodUnion<readonly [z.ZodUnion<readonly [z.ZodString, z.ZodNumber, z.ZodObject<{
@@ -11216,6 +11231,7 @@ export declare const zVSeed: z.ZodDiscriminatedUnion<[z.ZodObject<{
         areaBorderColor: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodString>>>;
         areaBorderWidth: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
         areaBorderRadius: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
+        areaLineDash: z.ZodOptional<z.ZodNullable<z.ZodArray<z.ZodNumber>>>;
         outerPadding: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
     }, z.core.$strip>]>>>;
     locale: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodEnum<{
@@ -12737,6 +12753,7 @@ export declare const zVSeed: z.ZodDiscriminatedUnion<[z.ZodObject<{
         areaBorderColor: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodString>>>;
         areaBorderWidth: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
         areaBorderRadius: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
+        areaLineDash: z.ZodOptional<z.ZodNullable<z.ZodArray<z.ZodNumber>>>;
         outerPadding: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
     }, z.core.$strip>>, z.ZodObject<{
         selector: z.ZodOptional<z.ZodNullable<z.ZodUnion<readonly [z.ZodUnion<readonly [z.ZodString, z.ZodNumber, z.ZodObject<{
@@ -12843,6 +12860,7 @@ export declare const zVSeed: z.ZodDiscriminatedUnion<[z.ZodObject<{
         areaBorderColor: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodString>>>;
         areaBorderWidth: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
         areaBorderRadius: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
+        areaLineDash: z.ZodOptional<z.ZodNullable<z.ZodArray<z.ZodNumber>>>;
         outerPadding: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
     }, z.core.$strip>]>>>;
     locale: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodEnum<{
@@ -14380,6 +14398,7 @@ export declare const zVSeed: z.ZodDiscriminatedUnion<[z.ZodObject<{
         areaBorderColor: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodString>>>;
         areaBorderWidth: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
         areaBorderRadius: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
+        areaLineDash: z.ZodOptional<z.ZodNullable<z.ZodArray<z.ZodNumber>>>;
         outerPadding: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
     }, z.core.$strip>>, z.ZodObject<{
         selector: z.ZodOptional<z.ZodNullable<z.ZodUnion<readonly [z.ZodUnion<readonly [z.ZodString, z.ZodNumber, z.ZodObject<{
@@ -14486,6 +14505,7 @@ export declare const zVSeed: z.ZodDiscriminatedUnion<[z.ZodObject<{
         areaBorderColor: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodString>>>;
         areaBorderWidth: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
         areaBorderRadius: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
+        areaLineDash: z.ZodOptional<z.ZodNullable<z.ZodArray<z.ZodNumber>>>;
         outerPadding: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
     }, z.core.$strip>]>>>;
     locale: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodEnum<{
@@ -16697,6 +16717,7 @@ export declare const zVSeed: z.ZodDiscriminatedUnion<[z.ZodObject<{
         areaBorderColor: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodString>>>;
         areaBorderWidth: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
         areaBorderRadius: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
+        areaLineDash: z.ZodOptional<z.ZodNullable<z.ZodArray<z.ZodNumber>>>;
         outerPadding: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
     }, z.core.$strip>>, z.ZodObject<{
         selector: z.ZodOptional<z.ZodNullable<z.ZodUnion<readonly [z.ZodUnion<readonly [z.ZodString, z.ZodNumber, z.ZodObject<{
@@ -16803,6 +16824,7 @@ export declare const zVSeed: z.ZodDiscriminatedUnion<[z.ZodObject<{
         areaBorderColor: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodString>>>;
         areaBorderWidth: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
         areaBorderRadius: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
+        areaLineDash: z.ZodOptional<z.ZodNullable<z.ZodArray<z.ZodNumber>>>;
         outerPadding: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodNumber>>>;
     }, z.core.$strip>]>>>;
     locale: z.ZodOptional<z.ZodNullable<z.ZodDefault<z.ZodEnum<{

package/dist/umd/index.js

@@ -3870,7 +3870,7 @@
                 right: 'insideRight'
             };
             const markArea = annotationAreaList.flatMap((annotationArea)=>{
-                const { selector: selectorPoint, text = '', textPosition = 'top', textColor = theme?.textColor ?? '#ffffff', textFontSize = theme?.textFontSize ?? 12, textFontWeight = theme?.textFontWeight ?? 400, textAlign = 'center', textBaseline = 'top', textBackgroundVisible = theme?.textBackgroundVisible ?? true, textBackgroundColor = theme?.textBackgroundColor ?? '#191d24', textBackgroundBorderColor = theme?.textBackgroundBorderColor ?? '#191d24', textBackgroundBorderWidth = theme?.textBackgroundBorderWidth ?? 1, textBackgroundBorderRadius = theme?.textBackgroundBorderRadius ?? 4, textBackgroundPadding = theme?.textBackgroundPadding ?? 4, areaColor = theme?.areaColor ?? '#888888', areaColorOpacity = theme?.areaColorOpacity ?? 0.15, areaBorderColor = theme?.areaBorderColor ?? '#888888', areaBorderRadius = theme?.areaBorderRadius ?? 4, areaBorderWidth = theme?.areaBorderWidth ?? 1, outerPadding = theme?.outerPadding ?? 4 } = annotationArea;
+                const { selector: selectorPoint, text = '', textPosition = 'top', textColor = theme?.textColor ?? '#ffffff', textFontSize = theme?.textFontSize ?? 12, textFontWeight = theme?.textFontWeight ?? 400, textAlign = 'center', textBaseline = 'top', textBackgroundVisible = theme?.textBackgroundVisible ?? true, textBackgroundColor = theme?.textBackgroundColor ?? '#191d24', textBackgroundBorderColor = theme?.textBackgroundBorderColor ?? '#191d24', textBackgroundBorderWidth = theme?.textBackgroundBorderWidth ?? 1, textBackgroundBorderRadius = theme?.textBackgroundBorderRadius ?? 4, textBackgroundPadding = theme?.textBackgroundPadding ?? 4, areaColor = theme?.areaColor ?? '#888888', areaColorOpacity = theme?.areaColorOpacity ?? 0.15, areaBorderColor = theme?.areaBorderColor ?? '#888888', areaBorderRadius = theme?.areaBorderRadius ?? 4, areaBorderWidth = theme?.areaBorderWidth ?? 1, areaLineDash = theme?.areaLineDash, outerPadding = theme?.outerPadding ?? 4 } = annotationArea;
                 const dataset = advancedVSeed.dataset.flat();
                 const selectedData = selectorPoint ? dataset.filter((datum)=>selector_selector(datum, selectorPoint)) : [];
                 const labelPosition = positionMap[textPosition || 'top'];
@@ -3940,7 +3940,7 @@
                         visible: true,
                         text: text,
                         style: {
-                            dy: isBottom ? 2 * -(textFontSize || 12) : textFontSize,
+                            dy: isBottom ? 2 * -(textFontSize || 12) : 0,
                             textAlign: textAlign,
                             textBaseline: textBaseline,
                             fill: textColor,
@@ -3953,11 +3953,12 @@
                             visible: textBackgroundVisible,
                             padding: textBackgroundPadding,
                             style: {
-                                dy: isBottom ? 2 * -(textFontSize || 12) : textFontSize,
+                                dy: isBottom ? 2 * -(textFontSize || 12) : 0,
                                 cornerRadius: textBackgroundBorderRadius ?? 4,
                                 fill: textBackgroundColor,
                                 stroke: textBackgroundBorderColor,
-                                lineWidth: textBackgroundBorderWidth
+                                lineWidth: textBackgroundBorderWidth,
+                                fillOpacity: 1
                             }
                         }
                     },
@@ -3968,7 +3969,8 @@
                             fillOpacity: areaColorOpacity,
                             stroke: areaBorderColor,
                             lineWidth: areaBorderWidth,
-                            cornerRadius: areaBorderRadius
+                            cornerRadius: areaBorderRadius,
+                            lineDash: areaLineDash
                         }
                     }
                 };
@@ -4828,9 +4830,17 @@
                 left: 'insideLeft',
                 right: 'insideRight'
             };
+            const defaultOptions = isBarLikeChart(advancedVSeed) ? {
+                textPosition: 'right',
+                textAlign: 'right'
+            } : {
+                textPosition: 'top',
+                textAlign: 'center'
+            };
             const markArea = annotationAreaList.flatMap((annotationArea)=>{
-                const { selector: selectorPoint, text = '', textPosition = 'top', textColor = theme?.textColor ?? '#ffffff', textFontSize = theme?.textFontSize ?? 12, textFontWeight = theme?.textFontWeight ?? 400, textAlign = 'center', textBaseline = 'top', textBackgroundVisible = theme?.textBackgroundVisible ?? true, textBackgroundColor = theme?.textBackgroundColor ?? '#191d24', textBackgroundBorderColor = theme?.textBackgroundBorderColor ?? '#191d24', textBackgroundBorderWidth = theme?.textBackgroundBorderWidth ?? 1, textBackgroundBorderRadius = theme?.textBackgroundBorderRadius ?? 4, textBackgroundPadding = theme?.textBackgroundPadding ?? 4, areaColor = theme?.areaColor ?? '#888888', areaColorOpacity = theme?.areaColorOpacity ?? 0.15, areaBorderColor = theme?.areaBorderColor ?? '#888888', areaBorderRadius = theme?.areaBorderRadius ?? 4, areaBorderWidth = theme?.areaBorderWidth ?? 1, outerPadding = theme?.outerPadding ?? 4 } = annotationArea;
-                const dy = textPosition?.includes('bottom') ? -1 * textFontSize : textFontSize;
+                const { selector: selectorPoint, text = '', textColor = theme?.textColor ?? '#ffffff', textFontSize = theme?.textFontSize ?? 12, textFontWeight = theme?.textFontWeight ?? 400, textAlign = defaultOptions.textAlign, textBaseline = 'middle', textBackgroundVisible = theme?.textBackgroundVisible ?? true, textBackgroundColor = theme?.textBackgroundColor ?? '#191d24', textBackgroundBorderColor = theme?.textBackgroundBorderColor ?? '#191d24', textBackgroundBorderWidth = theme?.textBackgroundBorderWidth ?? 1, textBackgroundBorderRadius = theme?.textBackgroundBorderRadius ?? 4, textBackgroundPadding = theme?.textBackgroundPadding ?? 4, areaColor = theme?.areaColor ?? '#888888', areaColorOpacity = theme?.areaColorOpacity ?? 0.15, areaBorderColor = theme?.areaBorderColor ?? '#888888', areaBorderRadius = theme?.areaBorderRadius ?? 4, areaBorderWidth = theme?.areaBorderWidth ?? 1, areaLineDash = theme?.areaLineDash, outerPadding = theme?.outerPadding ?? 4 } = annotationArea;
+                const textPosition = annotationArea.textPosition ?? defaultOptions.textPosition;
+                const dy = textPosition.includes('bottom') ? -1 * textFontSize : 0;
                 const dataset = advancedVSeed.dataset.flat();
                 const selectedData = selectorPoint ? dataset.filter((datum)=>selector_selector(datum, selectorPoint)) : [];
                 return {
@@ -4907,7 +4917,7 @@
                         return [];
                     },
                     label: {
-                        position: positionMap[textPosition || 'top'],
+                        position: positionMap[textPosition],
                         visible: true,
                         text: text,
                         style: {
@@ -4928,7 +4938,8 @@
                                 cornerRadius: textBackgroundBorderRadius ?? 4,
                                 fill: textBackgroundColor,
                                 stroke: textBackgroundBorderColor,
-                                lineWidth: textBackgroundBorderWidth
+                                lineWidth: textBackgroundBorderWidth,
+                                fillOpacity: 1
                             }
                         }
                     },
@@ -4939,7 +4950,8 @@
                             fillOpacity: areaColorOpacity,
                             stroke: areaBorderColor,
                             lineWidth: areaBorderWidth,
-                            cornerRadius: areaBorderRadius
+                            cornerRadius: areaBorderRadius,
+                            lineDash: areaLineDash
                         }
                     }
                 };
@@ -8763,9 +8775,6 @@
                     clip: true
                 }
             ];
-            result.transformLabel = {
-                visible: true
-            };
             result.animation = true;
             return result;
         };
@@ -8793,7 +8802,7 @@
                 ...result,
                 funnel: {
                     style: {
-                        cornerRadius: 4
+                        cornerRadius: 0
                     },
                     state: {
                         hover: {
@@ -8803,6 +8812,25 @@
                 }
             };
         };
+        const funnelTransformStyle = (spec, context)=>{
+            const { advancedVSeed, vseed } = context;
+            const { chartType } = vseed;
+            const config = advancedVSeed.config?.[chartType]?.transform;
+            return {
+                ...spec,
+                transform: {
+                    style: {
+                        fill: config?.backgroundColor
+                    }
+                },
+                transformLabel: {
+                    visible: true,
+                    style: {
+                        fill: config?.textColor
+                    }
+                }
+            };
+        };
         const funnel = [
             initFunnel,
             background_backgroundColor,
@@ -8811,6 +8839,7 @@
             label_label,
             colorAdapter(discreteLegend, colorLegend),
             colorFunnelStyleFill(funnelStyle),
+            funnelTransformStyle,
             tooltip_tooltip,
             annotationPoint_annotationPoint,
             annotationVerticalLine_annotationVerticalLine,
@@ -8831,6 +8860,7 @@
                 label_label,
                 tooltip_tooltip,
                 colorFunnelStyleFill(funnelStyle),
+                funnelTransformStyle,
                 annotationPoint_annotationPoint,
                 annotationVerticalLine_annotationVerticalLine,
                 annotationHorizontalLine_annotationHorizontalLine,
@@ -9167,8 +9197,8 @@
                 visible: true,
                 labelVisible: true,
                 labelColor: '#ffffff',
-                labelBackgroundColor: '##21252C',
-                lineColor: '#000000'
+                labelBackgroundColor: '#21252C',
+                lineColor: '#21252C'
             });
         const getLightCrosshairRect = ()=>({
                 visible: true,
@@ -9300,7 +9330,11 @@
                 grid: {
                     visible: true,
                     gridColor: '#36415926',
-                    gridWidth: 0.5
+                    gridWidth: 0.5,
+                    gridLineDash: [
+                        4,
+                        2
+                    ]
                 },
                 tick: {
                     visible: false,
@@ -9342,7 +9376,11 @@
                 grid: {
                     visible: false,
                     gridColor: '#36415926',
-                    gridWidth: 0.5
+                    gridWidth: 0.5,
+                    gridLineDash: [
+                        4,
+                        2
+                    ]
                 },
                 tick: {
                     visible: false,
@@ -9375,8 +9413,12 @@
                 },
                 grid: {
                     visible: true,
-                    gridColor: '#404349',
-                    gridWidth: 0.5
+                    gridColor: '#303339',
+                    gridWidth: 0.5,
+                    gridLineDash: [
+                        4,
+                        2
+                    ]
                 },
                 tick: {
                     visible: false,
@@ -9417,8 +9459,12 @@
                 },
                 grid: {
                     visible: false,
-                    gridColor: '#404349',
-                    gridWidth: 0.5
+                    gridColor: '#303339',
+                    gridWidth: 0.5,
+                    gridLineDash: [
+                        4,
+                        2
+                    ]
                 },
                 tick: {
                     visible: false,
@@ -9466,16 +9512,20 @@
                 textFontSize: 12,
                 textFontWeight: 400,
                 textBackgroundVisible: true,
-                textBackgroundColor: '#364159',
-                textBackgroundBorderColor: '#3641594d',
+                textBackgroundColor: '#BCC1CB',
+                textBackgroundBorderColor: '#BCC1CB',
                 textBackgroundBorderWidth: 1,
-                textBackgroundBorderRadius: 4,
+                textBackgroundBorderRadius: 0,
                 textBackgroundPadding: 4,
-                areaColor: '#364159',
-                areaColorOpacity: 0.15,
-                areaBorderColor: '#364159',
-                areaBorderWidth: 1,
-                areaBorderRadius: 4,
+                areaColor: '#BCC1CB',
+                areaColorOpacity: 0.12,
+                areaBorderColor: '#BCC1CB',
+                areaBorderWidth: 0,
+                areaBorderRadius: 0,
+                areaLineDash: [
+                    2,
+                    2
+                ],
                 outerPadding: 4
             });
         const getLightAnnotation = ()=>({
@@ -9512,20 +9562,24 @@
             });
         const getDarkAnnotationVerticalLine = ()=>getDarkAnnotationHorizontalLine();
         const getDarkAnnotationArea = ()=>({
-                textColor: '#4B4F54',
+                textColor: '#E2E3E6',
                 textFontSize: 12,
                 textFontWeight: 400,
                 textBackgroundVisible: true,
-                textBackgroundColor: '#ffffff',
-                textBackgroundBorderColor: '#ffffff',
+                textBackgroundColor: '#55595F',
+                textBackgroundBorderColor: '#55595F',
                 textBackgroundBorderWidth: 1,
-                textBackgroundBorderRadius: 4,
+                textBackgroundBorderRadius: 0,
                 textBackgroundPadding: 4,
                 areaColor: '#E2E3E6',
                 areaColorOpacity: 0.15,
                 areaBorderColor: '#E2E3E6',
-                areaBorderWidth: 1,
-                areaBorderRadius: 4,
+                areaBorderWidth: 0,
+                areaBorderRadius: 0,
+                areaLineDash: [
+                    2,
+                    2
+                ],
                 outerPadding: 4
             });
         const getDarkAnnotation = ()=>({
@@ -9534,6 +9588,14 @@
                 annotationVerticalLine: getDarkAnnotationVerticalLine(),
                 annotationArea: getDarkAnnotationArea()
             });
+        const getLightFunnelTransformTheme = ()=>({
+                backgroundColor: '#F6F7F9',
+                textColor: '#737880'
+            });
+        const getDarkFunnelTransformTheme = ()=>({
+                backgroundColor: '#2A2D33',
+                textColor: '#888C93'
+            });
         const lightTheme = ()=>{
             const linearAxis = getLightLinearAxis();
             const bandAxis = getLightBandAxis();
@@ -9769,6 +9831,7 @@
                     },
                     funnel: {
                         ...baseConfig,
+                        transform: getLightFunnelTransformTheme(),
                         pivotGrid: getLightPivotChartGridConfig()
                     },
                     heatmap: {
@@ -10011,6 +10074,7 @@
                     },
                     funnel: {
                         ...baseConfig,
+                        transform: getDarkFunnelTransformTheme(),
                         pivotGrid: getDarkPivotChartGridConfig()
                     },
                     heatmap: {
@@ -14004,6 +14068,7 @@
             areaBorderColor: schemas_string().default('#888888').nullish(),
             areaBorderWidth: schemas_number().default(1).nullish(),
             areaBorderRadius: schemas_number().default(4).nullish(),
+            areaLineDash: schemas_array(schemas_number()).nullish(),
             outerPadding: schemas_number().default(4).nullish()
         });
         const zAnnotationPointConfig = zAnnotationPoint.omit({
@@ -14048,6 +14113,7 @@
             areaBorderColor: true,
             areaBorderWidth: true,
             areaBorderRadius: true,
+            areaLineDash: true,
             outerPadding: true
         }).partial();
         const zAnnotaionConfig = schemas_object({
@@ -14056,6 +14122,10 @@
             annotationVerticalLine: zAnnotationVerticalLineConfig.nullish(),
             annotationArea: zAnnotationAreaConfig.nullish()
         });
+        const zFunnelTransform = schemas_object({
+            backgroundColor: schemas_string().nullish(),
+            textColor: schemas_string().nullish()
+        });
         const zTableConfig = schemas_object({
             backgroundColor: zBackgroundColor.nullish(),
             borderColor: schemas_string().nullish(),
@@ -14185,7 +14255,15 @@
         });
         const zDonutConfig = zPieConfig;
         const zRadarConfig = zPieConfig;
-        const zFunnelConfig = zAreaConfig;
+        const zFunnelConfig = schemas_object({
+            backgroundColor: zBackgroundColor.nullish(),
+            label: zLabel.nullish(),
+            color: zColor.nullish(),
+            tooltip: zTooltip.nullish(),
+            legend: zLegend.nullish(),
+            pivotGrid: zPivotChartGridConfig.nullish(),
+            transform: zFunnelTransform.nullish()
+        });
         const zHeatmapConfig = zAreaConfig;
         const zConfig = schemas_object({
             table: zTableConfig.nullish(),