@visactor/vseed 0.3.9 → 0.3.11

package/dist/umd/index.js

@@ -286,6 +286,7 @@
             zAnnotationArea: ()=>zAnnotationArea,
             DetailEncoding: ()=>DetailEncoding,
             isPivot: ()=>chatType_isPivot,
+            zPlayer: ()=>zPlayer,
             zPointStyle: ()=>zPointStyle,
             zDimension: ()=>zDimension,
             lightTheme: ()=>lightTheme,
@@ -765,6 +766,21 @@
             static getTheme = (themeKey)=>Builder._themeMap[themeKey || 'light'];
             static getThemeMap = ()=>Builder._themeMap;
             static from = (vseed)=>new Builder(vseed);
+            static registerAdvancedPipeline = (chartType, pipeline)=>{
+                Builder._advancedPipelineMap[chartType] = pipeline;
+            };
+            static registerSpecPipeline = (chartType, pipeline)=>{
+                Builder._specPipelineMap[chartType] = pipeline;
+            };
+            static updateAdvanced = (chartType, pipe)=>{
+                Builder._customAdvancedPipe[chartType] = pipe;
+            };
+            static updateSpec = (chartType, pipe)=>{
+                Builder._customSpecPipe[chartType] = pipe;
+            };
+            static registerTheme = (key, theme)=>{
+                Builder._themeMap[key] = theme;
+            };
             static _advancedPipelineMap = {};
             static _specPipelineMap = {};
             static _customAdvancedPipe = {};
@@ -1692,8 +1708,8 @@
             tableBodyCell
         ];
         const registerTable = ()=>{
-            Builder._advancedPipelineMap.table = tableAdvancedPipeline;
-            Builder._specPipelineMap.table = tableSpecPipeline;
+            Builder.registerAdvancedPipeline('table', tableAdvancedPipeline);
+            Builder.registerSpecPipeline('table', tableSpecPipeline);
         };
         const ORIGINAL_DATA = '__OriginalData__';
         const FoldMeasureName = '__MeaName__';
@@ -2210,8 +2226,8 @@
             pivotTableBodyCell
         ];
         const registerPivotTable = ()=>{
-            Builder._advancedPipelineMap.pivotTable = pivotTableAdvancedPipeline;
-            Builder._specPipelineMap.pivotTable = pivotTableSpecPipeline;
+            Builder.registerAdvancedPipeline('pivotTable', pivotTableAdvancedPipeline);
+            Builder.registerSpecPipeline('pivotTable', pivotTableSpecPipeline);
         };
         const page_page_page = (advancedVSeed, context)=>{
             const { vseed } = context;
@@ -2687,11 +2703,12 @@
                 'yAxis',
                 'crosshairLine',
                 'brush',
-                'dimensionLinkage'
+                'dimensionLinkage',
+                'player'
             ]);
             const config = replaceNullToUndefined(pickedConfig);
             result.config = {
-                ...result.config || {},
+                ...result.config,
                 [chartType]: {
                     ...config
                 }
@@ -2869,6 +2886,95 @@
                 background: backgroundColor
             };
         };
+        function chunk_HVPVHFDT_i(...e) {
+            return chunk_WIMGWYZL_u(chunk_HVPVHFDT_p, e);
+        }
+        var chunk_HVPVHFDT_p = (e, d)=>{
+            let r = Object.create(null);
+            for(let n = 0; n < e.length; n++){
+                let t = e[n], y = d(t, n, e);
+                if (void 0 !== y) {
+                    let o = r[y];
+                    void 0 === o ? r[y] = [
+                        t
+                    ] : o.push(t);
+                }
+            }
+            return Object.setPrototypeOf(r, Object.prototype), r;
+        };
+        const playerAdapter = (pipe)=>(spec, context)=>{
+                const { vseed, advancedVSeed } = context;
+                const { datasetReshapeInfo, chartType } = advancedVSeed;
+                const baseConfig = advancedVSeed.config[chartType];
+                const { player } = baseConfig;
+                if (!player || !baseConfig || isVTable(vseed) || chatType_isPivotChart(vseed)) return pipe(spec, context);
+                const id = datasetReshapeInfo[0].id;
+                const nextSpec = pipe(spec, context);
+                const { field, autoPlay = true, interval = 1000, loop = false, position, railColor, trackColor, sliderHandleColor, startButtonColor, pauseButtonColor, backwardButtonColor, forwardButtonColor } = player;
+                const dataGroups = chunk_HVPVHFDT_i(advancedVSeed.dataset, (item)=>item[field]);
+                const specs = Object.values(dataGroups).map((items)=>({
+                        data: {
+                            id: id,
+                            values: items
+                        }
+                    }));
+                return {
+                    ...nextSpec,
+                    player: {
+                        auto: autoPlay,
+                        interval: interval,
+                        loop: loop,
+                        alternate: false,
+                        position: 'middle',
+                        orient: position,
+                        type: 'discrete',
+                        specs,
+                        controller: {
+                            visible: true,
+                            start: {
+                                visible: true,
+                                style: {
+                                    fill: startButtonColor
+                                }
+                            },
+                            pause: {
+                                visible: true,
+                                style: {
+                                    fill: pauseButtonColor
+                                }
+                            },
+                            backward: {
+                                visible: true,
+                                style: {
+                                    fill: backwardButtonColor
+                                }
+                            },
+                            forward: {
+                                visible: true,
+                                style: {
+                                    fill: forwardButtonColor
+                                }
+                            }
+                        },
+                        slider: {
+                            visible: true,
+                            railStyle: {
+                                visible: true,
+                                fill: railColor
+                            },
+                            trackStyle: {
+                                visible: true,
+                                fill: trackColor
+                            },
+                            handlerStyle: {
+                                visible: true,
+                                fill: sliderHandleColor,
+                                lineWidth: 1
+                            }
+                        }
+                    }
+                };
+            };
         const datasetXY = (spec, context)=>{
             const { advancedVSeed, vseed } = context;
             const { analysis, datasetReshapeInfo } = advancedVSeed;
@@ -5699,7 +5805,7 @@
             initLine,
             colorAdapter(color_color, linearColor),
             background_backgroundColor,
-            datasetXY,
+            playerAdapter(datasetXY),
             progressive,
             xBand,
             yLinear,
@@ -5753,8 +5859,8 @@
             pivotAdapter_pivotAdapter(line_line, pivotLine)
         ];
         const registerLine = ()=>{
-            Builder._advancedPipelineMap.line = lineAdvancedPipeline;
-            Builder._specPipelineMap.line = lineSpecPipeline;
+            Builder.registerAdvancedPipeline('line', lineAdvancedPipeline);
+            Builder.registerSpecPipeline('line', lineSpecPipeline);
         };
         const defaultEncodingForColumn = (advancedVSeed)=>{
             const { measures = [], reshapeMeasures = [], dimensions = [] } = advancedVSeed;
@@ -5843,11 +5949,12 @@
                 'barMaxWidth',
                 'barGapInGroup',
                 'brush',
-                'dimensionLinkage'
+                'dimensionLinkage',
+                'player'
             ]);
             const config = replaceNullToUndefined(pickedConfig);
             result.config = {
-                ...result.config || {},
+                ...result.config,
                 [chartType]: {
                     ...config
                 }
@@ -6688,7 +6795,7 @@
             stackInverse,
             colorAdapter(color_color, linearColor),
             background_backgroundColor,
-            datasetXY,
+            playerAdapter(datasetXY),
             progressive,
             xBand,
             yLinear,
@@ -6741,8 +6848,8 @@
             pivotAdapter_pivotAdapter(column, pivotColumn)
         ];
         const registerColumn = ()=>{
-            Builder._advancedPipelineMap.column = columnAdvancedPipeline;
-            Builder._specPipelineMap.column = columnSpecPipeline;
+            Builder.registerAdvancedPipeline('column', columnAdvancedPipeline);
+            Builder.registerSpecPipeline('column', columnSpecPipeline);
         };
         const pieConfig = (advancedVSeed, context)=>{
             const { vseed } = context;
@@ -6756,11 +6863,12 @@
                 'label',
                 'legend',
                 'tooltip',
+                'player',
                 'brush'
             ]);
             const config = replaceNullToUndefined(pickedConfig);
             result.config = {
-                ...result.config || {},
+                ...result.config,
                 [chartType]: {
                     ...config
                 }
@@ -6896,7 +7004,7 @@
             barGapInGroup_barGapInGroup,
             colorAdapter(color_color, linearColor),
             background_backgroundColor,
-            datasetXY,
+            playerAdapter(datasetXY),
             progressive,
             xBand,
             yLinear,
@@ -6946,8 +7054,8 @@
             pivotAdapter_pivotAdapter(columnParallel, pivotColumnParallel)
         ];
         const registerColumnParallel = ()=>{
-            Builder._advancedPipelineMap.columnParallel = columnParallelAdvancedPipeline;
-            Builder._specPipelineMap.columnParallel = columnParallelSpecPipeline;
+            Builder.registerAdvancedPipeline('columnParallel', columnParallelAdvancedPipeline);
+            Builder.registerSpecPipeline('columnParallel', columnParallelSpecPipeline);
         };
         const columnPercentAdvancedPipeline = [
             page_page_page,
@@ -6996,7 +7104,7 @@
             colorAdapter(color_color, linearColor),
             background_backgroundColor,
             percent_percent,
-            datasetXY,
+            playerAdapter(datasetXY),
             progressive,
             xBand,
             yLinear,
@@ -7048,8 +7156,8 @@
             pivotAdapter_pivotAdapter(columnPercent, pivotColumnPercent)
         ];
         const registerColumnPercent = ()=>{
-            Builder._advancedPipelineMap.columnPercent = columnPercentAdvancedPipeline;
-            Builder._specPipelineMap.columnPercent = columnPercentSpecPipeline;
+            Builder.registerAdvancedPipeline('columnPercent', columnPercentAdvancedPipeline);
+            Builder.registerSpecPipeline('columnPercent', columnPercentSpecPipeline);
         };
         const defaultEncodingForBar = (advancedVSeed)=>{
             const { measures = [], reshapeMeasures = [], dimensions = [] } = advancedVSeed;
@@ -7353,7 +7461,7 @@
             barMaxWidth_barMaxWidth,
             colorAdapter(color_color, linearColor),
             background_backgroundColor,
-            datasetYX,
+            playerAdapter(datasetYX),
             progressive,
             xLinear,
             yBand,
@@ -7403,8 +7511,8 @@
             pivotAdapter_pivotAdapter(bar, pivotBar)
         ];
         const registerBar = ()=>{
-            Builder._advancedPipelineMap.bar = barAdvancedPipeline;
-            Builder._specPipelineMap.bar = barSpecPipeline;
+            Builder.registerAdvancedPipeline('bar', barAdvancedPipeline);
+            Builder.registerSpecPipeline('bar', barSpecPipeline);
         };
         const barParallelAdvancedPipeline = [
             page_page_page,
@@ -7473,7 +7581,7 @@
             barGapInGroup_barGapInGroup,
             colorAdapter(color_color, linearColor),
             background_backgroundColor,
-            datasetYX,
+            playerAdapter(datasetYX),
             progressive,
             xLinear,
             yBand,
@@ -7522,8 +7630,8 @@
             pivotAdapter_pivotAdapter(barParallel, pivotBarParallel)
         ];
         const registerBarParallel = ()=>{
-            Builder._advancedPipelineMap.barParallel = barParallelAdvancedPipeline;
-            Builder._specPipelineMap.barParallel = barParallelSpecPipeline;
+            Builder.registerAdvancedPipeline('barParallel', barParallelAdvancedPipeline);
+            Builder.registerSpecPipeline('barParallel', barParallelSpecPipeline);
         };
         const barPercentAdvancedPipeline = [
             page_page_page,
@@ -7564,7 +7672,7 @@
             colorAdapter(color_color, linearColor),
             background_backgroundColor,
             percent_percent,
-            datasetYX,
+            playerAdapter(datasetYX),
             progressive,
             xLinear,
             yBand,
@@ -7614,8 +7722,8 @@
             pivotAdapter_pivotAdapter(barPercent, pivotBarPercent)
         ];
         const registerBarPercent = ()=>{
-            Builder._advancedPipelineMap.barPercent = barPercentAdvancedPipeline;
-            Builder._specPipelineMap.barPercent = barPercentSpecPipeline;
+            Builder.registerAdvancedPipeline('barPercent', barPercentAdvancedPipeline);
+            Builder.registerSpecPipeline('barPercent', barPercentSpecPipeline);
         };
         const areaAdvancedPipeline = [
             page_page_page,
@@ -7683,22 +7791,6 @@
                 }
                 return result;
             };
-        function chunk_HVPVHFDT_i(...e) {
-            return chunk_WIMGWYZL_u(chunk_HVPVHFDT_p, e);
-        }
-        var chunk_HVPVHFDT_p = (e, d)=>{
-            let r = Object.create(null);
-            for(let n = 0; n < e.length; n++){
-                let t = e[n], y = d(t, n, e);
-                if (void 0 !== y) {
-                    let o = r[y];
-                    void 0 === o ? r[y] = [
-                        t
-                    ] : o.push(t);
-                }
-            }
-            return Object.setPrototypeOf(r, Object.prototype), r;
-        };
         const areaStyle_areaStyle = (spec, context)=>{
             const { advancedVSeed } = context;
             const { markStyle, datasetReshapeInfo, dataset } = advancedVSeed;
@@ -7759,7 +7851,7 @@
             stackInverse,
             colorAdapter(color_color, linearColor),
             background_backgroundColor,
-            datasetXY,
+            playerAdapter(datasetXY),
             progressive,
             xBand,
             yLinear,
@@ -7816,8 +7908,8 @@
             pivotAdapter_pivotAdapter(area_area, pivotArea)
         ];
         const registerArea = ()=>{
-            Builder._advancedPipelineMap.area = areaAdvancedPipeline;
-            Builder._specPipelineMap.area = areaSpecPipeline;
+            Builder.registerAdvancedPipeline('area', areaAdvancedPipeline);
+            Builder.registerSpecPipeline('area', areaSpecPipeline);
         };
         const areaPercentAdvancedPipeline = [
             page_page_page,
@@ -7857,7 +7949,7 @@
             colorAdapter(color_color, linearColor),
             background_backgroundColor,
             percent_percent,
-            datasetXY,
+            playerAdapter(datasetXY),
             progressive,
             xBand,
             yLinear,
@@ -7913,8 +8005,8 @@
             pivotAdapter_pivotAdapter(areaPercent, pivotAreaPercent)
         ];
         const registerAreaPercent = ()=>{
-            Builder._advancedPipelineMap.areaPercent = areaPercentAdvancedPipeline;
-            Builder._specPipelineMap.areaPercent = areaPercentSpecPipeline;
+            Builder.registerAdvancedPipeline('areaPercent', areaPercentAdvancedPipeline);
+            Builder.registerSpecPipeline('areaPercent', areaPercentSpecPipeline);
         };
         const buildMeasuresForScatter = (advancedVSeed)=>{
             const { measures = [] } = advancedVSeed;
@@ -8063,12 +8155,13 @@
                 'sizeRange',
                 'size',
                 'crosshairLine',
+                'player',
                 'brush',
                 'dimensionLinkage'
             ]);
             const config = replaceNullToUndefined(pickedConfig);
             result.config = {
-                ...result.config || {},
+                ...result.config,
                 [chartType]: {
                     ...config
                 }
@@ -8880,7 +8973,7 @@
             initScatter,
             colorAdapter(color_color, linearColor),
             background_backgroundColor,
-            datasetScatter,
+            playerAdapter(datasetScatter),
             progressive,
             xLinear,
             yLinear,
@@ -8942,8 +9035,8 @@
             pivotAdapter_pivotAdapter(scatter, pivotScatter)
         ];
         const registerScatter = ()=>{
-            Builder._advancedPipelineMap.scatter = scatterAdvancedPipeline;
-            Builder._specPipelineMap.scatter = scatterSpecPipeline;
+            Builder.registerAdvancedPipeline('scatter', scatterAdvancedPipeline);
+            Builder.registerSpecPipeline('scatter', scatterSpecPipeline);
         };
         const buildMeasuresForDualAxis = (advancedVSeed)=>{
             const { measures = [] } = advancedVSeed;
@@ -9209,7 +9302,7 @@
             ]);
             const config = replaceNullToUndefined(pickedConfig);
             result.config = {
-                ...result.config || {},
+                ...result.config,
                 [chartType]: {
                     ...config
                 }
@@ -9631,21 +9724,21 @@
         };
         const isObjectLike = (value)=>"object" == typeof value && null !== value;
         const common_isObjectLike = isObjectLike;
-        const isPlainObject = function(value) {
+        const isPlainObject_isPlainObject = function(value) {
             if (!common_isObjectLike(value) || !isType(value, "Object")) return !1;
             if (null === Object.getPrototypeOf(value)) return !0;
             let proto = value;
             for(; null !== Object.getPrototypeOf(proto);)proto = Object.getPrototypeOf(proto);
             return Object.getPrototypeOf(value) === proto;
         };
-        const common_isPlainObject = isPlainObject;
+        const isPlainObject = isPlainObject_isPlainObject;
         const isString = (value, fuzzy = !1)=>{
             const type = typeof value;
             return fuzzy ? "string" === type : "string" === type || isType(value, "String");
         };
         const common_isString = isString;
         function pickWithout(obj, keys) {
-            if (!obj || !common_isPlainObject(obj)) return obj;
+            if (!obj || !isPlainObject(obj)) return obj;
             const result = {};
             return Object.keys(obj).forEach((k)=>{
                 const v = obj[k];
@@ -9750,8 +9843,8 @@
             pivotAdapter_pivotAdapter(dualAxis, pivotDualAxis)
         ];
         const registerDualAxis = ()=>{
-            Builder._advancedPipelineMap.dualAxis = dualAxisAdvancedPipeline;
-            Builder._specPipelineMap.dualAxis = dualAxisSpecPipeline;
+            Builder.registerAdvancedPipeline('dualAxis', dualAxisAdvancedPipeline);
+            Builder.registerSpecPipeline('dualAxis', dualAxisSpecPipeline);
         };
         const defaultEncodingForPie = (advancedVSeed)=>{
             const { measures = [], reshapeMeasures = [], dimensions = [] } = advancedVSeed;
@@ -9942,7 +10035,7 @@
             initPie,
             colorAdapter(color_color, linearColor),
             background_backgroundColor,
-            datasetXY,
+            playerAdapter(datasetXY),
             progressive,
             brush_brush,
             colorPieStyleFill(pieStyle),
@@ -9986,8 +10079,8 @@
             pivotAdapter_pivotAdapter(pie, pivotPie)
         ];
         const registerPie = ()=>{
-            Builder._advancedPipelineMap.pie = pieAdvancedPipeline;
-            Builder._specPipelineMap.pie = pieSpecPipeline;
+            Builder.registerAdvancedPipeline('pie', pieAdvancedPipeline);
+            Builder.registerSpecPipeline('pie', pieSpecPipeline);
         };
         const donutAdvancedPipeline = [
             page_page_page,
@@ -10043,7 +10136,7 @@
             initDonut,
             colorAdapter(color_color, linearColor),
             background_backgroundColor,
-            datasetXY,
+            playerAdapter(datasetXY),
             progressive,
             brush_brush,
             labelPie,
@@ -10087,8 +10180,8 @@
             pivotAdapter_pivotAdapter(donut, pivotDonut)
         ];
         const registerDonut = ()=>{
-            Builder._advancedPipelineMap.donut = donutAdvancedPipeline;
-            Builder._specPipelineMap.donut = donutSpecPipeline;
+            Builder.registerAdvancedPipeline('donut', donutAdvancedPipeline);
+            Builder.registerSpecPipeline('donut', donutSpecPipeline);
         };
         const defaultEncodingForRose = (advancedVSeed)=>{
             const { measures = [], reshapeMeasures = [], dimensions = [] } = advancedVSeed;
@@ -10271,7 +10364,7 @@
             stackInverse,
             colorAdapter(color_color, linearColor),
             background_backgroundColor,
-            datasetXY,
+            playerAdapter(datasetXY),
             progressive,
             radiusAxis,
             verticalCrosshairRect,
@@ -10311,8 +10404,8 @@
             pivotAdapter_pivotAdapter(rose, pivotRose)
         ];
         const registerRose = ()=>{
-            Builder._advancedPipelineMap.rose = roseAdvancedPipeline;
-            Builder._specPipelineMap.rose = roseSpecPipeline;
+            Builder.registerAdvancedPipeline('rose', roseAdvancedPipeline);
+            Builder.registerSpecPipeline('rose', roseSpecPipeline);
         };
         const roseParallelAdvancedPipeline = [
             page_page_page,
@@ -10392,7 +10485,7 @@
             stackCornerRadius_stackCornerRadius,
             colorAdapter(color_color, linearColor),
             background_backgroundColor,
-            datasetXY,
+            playerAdapter(datasetXY),
             progressive,
             radiusAxis,
             colorRoseStyleFill(roseStyle),
@@ -10439,8 +10532,8 @@
             pivotAdapter_pivotAdapter(roseParallel, pivotRoseParallel)
         ];
         const registerRoseParallel = ()=>{
-            Builder._advancedPipelineMap.roseParallel = roseParallelAdvancedPipeline;
-            Builder._specPipelineMap.roseParallel = roseParallelSpecPipeline;
+            Builder.registerAdvancedPipeline('roseParallel', roseParallelAdvancedPipeline);
+            Builder.registerSpecPipeline('roseParallel', roseParallelSpecPipeline);
         };
         const defaultEncodingForRadar = (advancedVSeed)=>{
             const { measures = [], reshapeMeasures = [], dimensions = [] } = advancedVSeed;
@@ -10614,7 +10707,7 @@
             initRadar,
             colorAdapter(color_color, linearColor),
             background_backgroundColor,
-            datasetXY,
+            playerAdapter(datasetXY),
             progressive,
             radarAngleAxis,
             radarRadiusAxis,
@@ -10659,8 +10752,8 @@
             pivotAdapter_pivotAdapter(radar, pivotRadar)
         ];
         const registerRadar = ()=>{
-            Builder._advancedPipelineMap.radar = radarAdvancedPipeline;
-            Builder._specPipelineMap.radar = radarSpecPipeline;
+            Builder.registerAdvancedPipeline('radar', radarAdvancedPipeline);
+            Builder.registerSpecPipeline('radar', radarSpecPipeline);
         };
         const defaultEncodingForFunnel = (advancedVSeed)=>{
             const { measures = [], reshapeMeasures = [], dimensions = [] } = advancedVSeed;
@@ -10837,7 +10930,7 @@
         const funnel = [
             initFunnel,
             background_backgroundColor,
-            datasetXY,
+            playerAdapter(datasetXY),
             colorAdapter(color_color, linearColor),
             label_label,
             colorAdapter(discreteLegend, colorLegend),
@@ -10879,8 +10972,8 @@
             pivotAdapter_pivotAdapter(funnel, pivotFunnel)
         ];
         const registerFunnel = ()=>{
-            Builder._advancedPipelineMap.funnel = funnelAdvancedPipeline;
-            Builder._specPipelineMap.funnel = funnelSpecPipeline;
+            Builder.registerAdvancedPipeline('funnel', funnelAdvancedPipeline);
+            Builder.registerSpecPipeline('funnel', funnelSpecPipeline);
         };
         const defaultEncodingForHeatmap = (advancedVSeed)=>{
             const { measures = [], dimensions = [] } = advancedVSeed;
@@ -10968,11 +11061,12 @@
                 'xAxis',
                 'yAxis',
                 'brush',
-                'dimensionLinkage'
+                'dimensionLinkage',
+                'player'
             ]);
             const config = replaceNullToUndefined(pickedConfig);
             result.config = {
-                ...result.config || {},
+                ...result.config,
                 [chartType]: {
                     ...config
                 }
@@ -11205,7 +11299,7 @@
         const heatmap = [
             initHeatmap,
             background_backgroundColor,
-            datasetXY,
+            playerAdapter(datasetXY),
             colorAdapter(color_color, linearColor),
             label_label,
             heatmapBandAxis,
@@ -11248,8 +11342,8 @@
             pivotAdapter_pivotAdapter(heatmap, pivotHeatmap)
         ];
         const registerHeatmap = ()=>{
-            Builder._advancedPipelineMap.heatmap = heatmapAdvancedPipeline;
-            Builder._specPipelineMap.heatmap = heatmapSpecPipeline;
+            Builder.registerAdvancedPipeline('heatmap', heatmapAdvancedPipeline);
+            Builder.registerSpecPipeline('heatmap', heatmapSpecPipeline);
         };
         const boxplotConfig = (advancedVSeed, context)=>{
             const { vseed } = context;
@@ -11273,7 +11367,7 @@
             ]);
             const config = replaceNullToUndefined(pickedConfig);
             result.config = {
-                ...result.config || {},
+                ...result.config,
                 [chartType]: {
                     ...config
                 }
@@ -12039,8 +12133,8 @@
             pivotAdapter_pivotAdapter(pipeline_boxplot_boxplot, pivotBoxplot)
         ];
         const registerBoxPlot = ()=>{
-            Builder._advancedPipelineMap.boxPlot = boxplotAdvancedPipeline;
-            Builder._specPipelineMap.boxPlot = boxplotSpecPipeline;
+            Builder.registerAdvancedPipeline('boxPlot', boxplotAdvancedPipeline);
+            Builder.registerSpecPipeline('boxPlot', boxplotSpecPipeline);
         };
         const isArrayLike_isArrayLike = function(value) {
             return null !== value && "function" != typeof value && Number.isFinite(value.length);
@@ -12072,7 +12166,7 @@
                     const length = objValue.length;
                     for(; ++index < length;)newValue[index] = objValue[index];
                 }
-            } else common_isPlainObject(srcValue) ? (newValue = null != objValue ? objValue : {}, "function" != typeof objValue && "object" == typeof objValue || (newValue = {})) : isCommon = !1;
+            } else isPlainObject(srcValue) ? (newValue = null != objValue ? objValue : {}, "function" != typeof objValue && "object" == typeof objValue || (newValue = {})) : isCommon = !1;
             isCommon && baseMerge(newValue, srcValue, shallowArray, skipTargetArray), assignMergeValue(target, key, newValue);
         }
         function assignMergeValue(target, key, value) {
@@ -12134,7 +12228,7 @@
                 }
             };
             result.config = {
-                ...result.config || {},
+                ...result.config,
                 [chartType]: {
                     ...config
                 }
@@ -13237,8 +13331,8 @@
             pivotAdapter_pivotAdapter(histogram, pivotHistogram)
         ];
         const registerHistogram = ()=>{
-            Builder._advancedPipelineMap.histogram = histogramAdvancedPipeline;
-            Builder._specPipelineMap.histogram = histogramSpecPipeline;
+            Builder.registerAdvancedPipeline('histogram', histogramAdvancedPipeline);
+            Builder.registerSpecPipeline('histogram', histogramSpecPipeline);
         };
         const getDarkCrosshairLine = ()=>({
                 visible: true,
@@ -13444,6 +13538,40 @@
             res.hoverHeaderInlineBackgroundColor = '#4b4f5446';
             return res;
         };
+        const getDarkPlayer = ()=>{
+            const primaryColor = getDarkColorScheme()[0];
+            const railColor = getDarkColorLegend().railBackgroundColor;
+            return {
+                interval: 1000,
+                loop: false,
+                autoPlay: true,
+                position: 'bottom',
+                railColor,
+                trackColor: primaryColor,
+                sliderHandleColor: primaryColor,
+                startButtonColor: primaryColor,
+                pauseButtonColor: primaryColor,
+                backwardButtonColor: primaryColor,
+                forwardButtonColor: primaryColor
+            };
+        };
+        const getLightPlayer = ()=>{
+            const primaryColor = getLightColorScheme()[0];
+            const railColor = getLightColorLegend().railBackgroundColor;
+            return {
+                interval: 1000,
+                loop: false,
+                autoPlay: true,
+                position: 'bottom',
+                railColor,
+                trackColor: primaryColor,
+                sliderHandleColor: primaryColor,
+                startButtonColor: primaryColor,
+                pauseButtonColor: primaryColor,
+                backwardButtonColor: primaryColor,
+                forwardButtonColor: primaryColor
+            };
+        };
         const getDefaultTooltip = ()=>({
                 enable: true,
                 borderRadius: 12,
@@ -13862,6 +13990,7 @@
                 brush: getLightBrushConfig()
             };
             const tableConfig = getLightTableConfig();
+            const player = getLightPlayer();
             return {
                 config: {
                     table: tableConfig,
@@ -13871,6 +14000,7 @@
                         xAxis: bandAxis,
                         yAxis: linearAxis,
                         crosshairLine,
+                        player,
                         pivotGrid: getLightPivotChartGridConfig(),
                         annotation: getLightAnnotation()
                     },
@@ -13879,6 +14009,7 @@
                         xAxis: bandAxis,
                         yAxis: linearAxis,
                         crosshairRect,
+                        player,
                         stackCornerRadius: [
                             4,
                             4,
@@ -13894,6 +14025,7 @@
                         xAxis: bandAxis,
                         yAxis: linearAxis,
                         crosshairRect,
+                        player,
                         stackCornerRadius: [
                             4,
                             4,
@@ -13909,6 +14041,7 @@
                         yAxis: {
                             ...linearAxis
                         },
+                        player,
                         crosshairRect,
                         stackCornerRadius: [
                             4,
@@ -13924,6 +14057,7 @@
                         xAxis: linearAxis,
                         yAxis: barBandAxis,
                         crosshairRect,
+                        player,
                         stackCornerRadius: [
                             0,
                             4,
@@ -13954,6 +14088,7 @@
                         },
                         yAxis: barBandAxis,
                         crosshairRect,
+                        player,
                         stackCornerRadius: [
                             0,
                             4,
@@ -13968,6 +14103,7 @@
                         xAxis: bandAxis,
                         yAxis: linearAxis,
                         crosshairLine,
+                        player,
                         pivotGrid: getLightPivotChartGridConfig(),
                         annotation: getLightAnnotation()
                     },
@@ -13977,6 +14113,7 @@
                         yAxis: {
                             ...linearAxis
                         },
+                        player,
                         crosshairLine,
                         pivotGrid: getLightPivotChartGridConfig(),
                         annotation: getLightAnnotation()
@@ -14007,6 +14144,7 @@
                             showValue: false,
                             showValuePercent: false
                         },
+                        player,
                         pivotGrid: getLightPivotChartGridConfig(),
                         annotation: getLightAnnotation(),
                         regressionLine: getLightRegressionLine()
@@ -14033,6 +14171,7 @@
                             labelLayout: 'arc',
                             showDimension: true
                         },
+                        player,
                         pivotGrid: getLightPivotChartGridConfig()
                     },
                     donut: {
@@ -14043,10 +14182,12 @@
                             labelLayout: 'arc',
                             showDimension: true
                         },
+                        player,
                         pivotGrid: getLightPivotChartGridConfig()
                     },
                     radar: {
                         ...baseConfig,
+                        player,
                         pivotGrid: getLightPivotChartGridConfig()
                     },
                     rose: {
@@ -14056,6 +14197,7 @@
                             showValuePercent: true,
                             showDimension: true
                         },
+                        player,
                         pivotGrid: getLightPivotChartGridConfig()
                     },
                     roseParallel: {
@@ -14065,12 +14207,14 @@
                             showValuePercent: true,
                             showDimension: true
                         },
+                        player,
                         pivotGrid: getLightPivotChartGridConfig()
                     },
                     funnel: {
                         ...baseConfig,
                         label: getFunnelLightLabel(),
                         transform: getLightFunnelTransformTheme(),
+                        player,
                         pivotGrid: getLightPivotChartGridConfig()
                     },
                     heatmap: {
@@ -14082,6 +14226,7 @@
                             ...baseConfig.label,
                             labelColorSmartInvert: true
                         },
+                        player,
                         cell: getLightHeatmapCellTheme(),
                         pivotGrid: getLightPivotChartGridConfig()
                     },
@@ -14133,6 +14278,7 @@
                 tooltip: getDarkTooltip(),
                 brush: getDarkBrushConfig()
             };
+            const player = getDarkPlayer();
             const tableConfig = getDarkTableConfig();
             return {
                 config: {
@@ -14143,6 +14289,7 @@
                         xAxis: bandAxis,
                         yAxis: linearAxis,
                         crosshairLine: crosshairLine,
+                        player,
                         pivotGrid: getDarkPivotChartGridConfig(),
                         annotation: getDarkAnnotation()
                     },
@@ -14159,6 +14306,7 @@
                         ],
                         pivotGrid: getDarkPivotChartGridConfig(),
                         annotation: getDarkAnnotation(),
+                        player,
                         regressionLine: getDarkRegressionLine()
                     },
                     columnParallel: {
@@ -14173,7 +14321,8 @@
                             0
                         ],
                         pivotGrid: getDarkPivotChartGridConfig(),
-                        annotation: getDarkAnnotation()
+                        annotation: getDarkAnnotation(),
+                        player
                     },
                     columnPercent: {
                         ...baseConfig,
@@ -14187,7 +14336,8 @@
                             0
                         ],
                         pivotGrid: getDarkPivotChartGridConfig(),
-                        annotation: getDarkAnnotation()
+                        annotation: getDarkAnnotation(),
+                        player
                     },
                     bar: {
                         ...baseConfig,
@@ -14201,7 +14351,8 @@
                             0
                         ],
                         pivotGrid: getDarkPivotChartGridConfig(),
-                        annotation: getDarkAnnotation()
+                        annotation: getDarkAnnotation(),
+                        player
                     },
                     barParallel: {
                         ...baseConfig,
@@ -14215,7 +14366,8 @@
                             0
                         ],
                         pivotGrid: getDarkPivotChartGridConfig(),
-                        annotation: getDarkAnnotation()
+                        annotation: getDarkAnnotation(),
+                        player
                     },
                     barPercent: {
                         ...baseConfig,
@@ -14229,7 +14381,8 @@
                             0
                         ],
                         pivotGrid: getDarkPivotChartGridConfig(),
-                        annotation: getDarkAnnotation()
+                        annotation: getDarkAnnotation(),
+                        player
                     },
                     area: {
                         ...baseConfig,
@@ -14237,7 +14390,8 @@
                         yAxis: linearAxis,
                         crosshairLine: crosshairLine,
                         pivotGrid: getDarkPivotChartGridConfig(),
-                        annotation: getDarkAnnotation()
+                        annotation: getDarkAnnotation(),
+                        player
                     },
                     areaPercent: {
                         ...baseConfig,
@@ -14245,7 +14399,8 @@
                         yAxis: linearAxis,
                         crosshairLine: crosshairLine,
                         pivotGrid: getDarkPivotChartGridConfig(),
-                        annotation: getDarkAnnotation()
+                        annotation: getDarkAnnotation(),
+                        player
                     },
                     scatter: {
                         ...baseConfig,
@@ -14275,7 +14430,8 @@
                         },
                         pivotGrid: getDarkPivotChartGridConfig(),
                         annotation: getDarkAnnotation(),
-                        regressionLine: getDarkRegressionLine()
+                        regressionLine: getDarkRegressionLine(),
+                        player
                     },
                     dualAxis: {
                         ...baseConfig,
@@ -14299,7 +14455,8 @@
                             labelLayout: 'arc',
                             showDimension: true
                         },
-                        pivotGrid: getDarkPivotChartGridConfig()
+                        pivotGrid: getDarkPivotChartGridConfig(),
+                        player
                     },
                     donut: {
                         ...baseConfig,
@@ -14309,11 +14466,13 @@
                             labelLayout: 'arc',
                             showDimension: true
                         },
-                        pivotGrid: getDarkPivotChartGridConfig()
+                        pivotGrid: getDarkPivotChartGridConfig(),
+                        player
                     },
                     radar: {
                         ...baseConfig,
-                        pivotGrid: getDarkPivotChartGridConfig()
+                        pivotGrid: getDarkPivotChartGridConfig(),
+                        player
                     },
                     rose: {
                         ...baseConfig,
@@ -14322,7 +14481,8 @@
                             showValuePercent: true,
                             showDimension: true
                         },
-                        pivotGrid: getDarkPivotChartGridConfig()
+                        pivotGrid: getDarkPivotChartGridConfig(),
+                        player
                     },
                     roseParallel: {
                         ...baseConfig,
@@ -14331,13 +14491,15 @@
                             showValuePercent: true,
                             showDimension: true
                         },
-                        pivotGrid: getDarkPivotChartGridConfig()
+                        pivotGrid: getDarkPivotChartGridConfig(),
+                        player
                     },
                     funnel: {
                         ...baseConfig,
                         label: getFunnelDarkLabel(),
                         transform: getDarkFunnelTransformTheme(),
-                        pivotGrid: getDarkPivotChartGridConfig()
+                        pivotGrid: getDarkPivotChartGridConfig(),
+                        player
                     },
                     heatmap: {
                         ...baseConfig,
@@ -14348,6 +14510,7 @@
                             ...baseConfig.label,
                             labelColorSmartInvert: true
                         },
+                        player,
                         cell: getDarkHeatmapCellTheme(),
                         pivotGrid: getDarkPivotChartGridConfig()
                     },
@@ -14378,7 +14541,7 @@
                 lightTheme: lightTheme(),
                 darkTheme: darkTheme()
             }) : themeConfig;
-            Builder._themeMap[key] = customTheme;
+            Builder.registerTheme(key, customTheme);
         };
         const registerLightTheme = ()=>{
             registerCustomTheme('light', lightTheme());
@@ -14413,10 +14576,10 @@
             registerDarkTheme();
         };
         const updateAdvanced = (chartType, advancedPipe)=>{
-            Builder._customAdvancedPipe[chartType] = advancedPipe;
+            Builder.updateAdvanced(chartType, advancedPipe);
         };
         const updateSpec = (chartType, specPipe)=>{
-            Builder._customSpecPipe[chartType] = specPipe;
+            Builder.updateSpec(chartType, specPipe);
         };
         const measureDepth = (measures = [])=>{
             if (!measures) return 0;
@@ -18586,6 +18749,25 @@
             inBrushStyle: zBrushStyleConfig.optional(),
             outOfBrushStyle: zBrushStyleConfig.optional()
         });
+        const zPlayer = schemas_object({
+            field: schemas_string(),
+            interval: schemas_number().optional(),
+            autoPlay: schemas_boolean().optional(),
+            loop: schemas_boolean().optional(),
+            position: schemas_enum([
+                'top',
+                'bottom',
+                'left',
+                'right'
+            ]).optional(),
+            railColor: schemas_string().optional(),
+            trackColor: schemas_string().optional(),
+            sliderHandleColor: schemas_string().optional(),
+            startButtonColor: schemas_string().optional(),
+            pauseButtonColor: schemas_string().optional(),
+            backwardButtonColor: schemas_string().optional(),
+            forwardButtonColor: schemas_string().optional()
+        });
         const zLineConfig = schemas_object({
             backgroundColor: zBackgroundColor.nullish(),
             label: zLabel.nullish(),
@@ -18598,7 +18780,8 @@
             pivotGrid: zPivotChartGridConfig.nullish(),
             annotation: zAnnotationConfig.nullish(),
             dimensionLinkage: zDimensionLinkage.nullish(),
-            brush: zBrushConfig.nullish()
+            brush: zBrushConfig.nullish(),
+            player: zPlayer.nullish()
         });
         const zStackCornerRadius = schemas_number().or(schemas_array(schemas_number())).default([
             3,
@@ -18647,6 +18830,7 @@
             color: zColor.nullish(),
             tooltip: zTooltip.nullish(),
             legend: zLegend.nullish(),
+            player: zPlayer.nullish(),
             xAxis: zXBandAxis.nullish(),
             yAxis: zYLinearAxis.nullish(),
             crosshairRect: zCrosshairRect.nullish(),
@@ -18668,6 +18852,7 @@
             color: zColor.nullish(),
             tooltip: zTooltip.nullish(),
             legend: zLegend.nullish(),
+            player: zPlayer.nullish(),
             xAxis: zXLinearAxis.nullish(),
             yAxis: zYBandAxis.nullish(),
             crosshairRect: zCrosshairRect.nullish(),
@@ -18685,6 +18870,7 @@
             color: zColor.nullish(),
             tooltip: zTooltip.nullish(),
             legend: zLegend.nullish(),
+            player: zPlayer.nullish(),
             xAxis: zXBandAxis.nullish(),
             yAxis: zYLinearAxis.nullish(),
             crosshairLine: zCrosshairLine.nullish(),
@@ -18700,6 +18886,7 @@
             color: zColor.nullish(),
             tooltip: zTooltip.nullish(),
             legend: zLegend.nullish(),
+            player: zPlayer.nullish(),
             xAxis: zXLinearAxis.nullish(),
             yAxis: zYLinearAxis.nullish(),
             crosshairLine: zCrosshairLine.nullish(),
@@ -18739,6 +18926,7 @@
             color: zColor.nullish(),
             tooltip: zTooltip.nullish(),
             legend: zLegend.nullish(),
+            player: zPlayer.nullish(),
             pivotGrid: zPivotChartGridConfig.nullish(),
             cornerRadius: schemas_number().nullish(),
             brush: zBrushConfig.nullish()
@@ -18751,6 +18939,7 @@
             color: zColor.nullish(),
             tooltip: zTooltip.nullish(),
             legend: zLegend.nullish(),
+            player: zPlayer.nullish(),
             pivotGrid: zPivotChartGridConfig.nullish()
         });
         const zRoseParallelConfig = zRoseConfig;
@@ -18764,6 +18953,7 @@
             color: zColor.nullish(),
             tooltip: zTooltip.nullish(),
             legend: zLegend.nullish(),
+            player: zPlayer.nullish(),
             pivotGrid: zPivotChartGridConfig.nullish(),
             transform: zFunnelTransform.nullish()
         });
@@ -18779,6 +18969,7 @@
             color: zColor.nullish(),
             tooltip: zTooltip.nullish(),
             legend: zColorLegend.nullish(),
+            player: zPlayer.nullish(),
             pivotGrid: zPivotChartGridConfig.nullish(),
             cell: zHeatmapCell.nullish(),
             xAxis: zXBandAxis.nullish(),
@@ -19135,6 +19326,7 @@
             dimensions: zDimensions.nullish(),
             measures: zMeasures.nullish(),
             page: zPage.nullish(),
+            player: zPlayer.nullish(),
             backgroundColor: zBackgroundColor.nullish(),
             color: zColor.nullish(),
             label: zLabel.nullish(),
@@ -19165,6 +19357,7 @@
             dimensions: zDimensions.nullish(),
             measures: zMeasures.nullish(),
             page: zPage.nullish(),
+            player: zPlayer.nullish(),
             backgroundColor: zBackgroundColor.nullish(),
             color: zColor.nullish(),
             label: zLabel.nullish(),