@splunk/visualizations 27.3.0 → 27.4.0

package/Punchcard.js

@@ -762,7 +762,7 @@ var withFixedSizeContainer = (Viz) => {
       FixSizeItem,
       {
         "data-test": "fix-size-item",
-        "data-splunk-visualization-version": "27.3.0 - bd2e687fd",
+        "data-splunk-visualization-version": "27.4.0 - 92ef39d5c",
         width,
         height,
         backgroundColor
@@ -828,7 +828,7 @@ var Cover = styled_components_default.div`
     bottom: 0;
 `;
 var Blocker = styled_components_default.div.attrs({
-  "data-splunk-visualization-version": "27.3.0 - bd2e687fd"
+  "data-splunk-visualization-version": "27.4.0 - 92ef39d5c"
 })`
     position: relative;
     width: 100%;

package/Rectangle.js

@@ -485,7 +485,7 @@ var withFixedSizeContainer = (Viz) => {
       FixSizeItem,
       {
         "data-test": "fix-size-item",
-        "data-splunk-visualization-version": "27.3.0 - bd2e687fd",
+        "data-splunk-visualization-version": "27.4.0 - 92ef39d5c",
         width,
         height,
         backgroundColor
@@ -551,7 +551,7 @@ var Cover = styled_components_default.div`
     bottom: 0;
 `;
 var Blocker = styled_components_default.div.attrs({
-  "data-splunk-visualization-version": "27.3.0 - bd2e687fd"
+  "data-splunk-visualization-version": "27.4.0 - 92ef39d5c"
 })`
     position: relative;
     width: 100%;

package/Sankey.js

@@ -485,7 +485,7 @@ var withFixedSizeContainer = (Viz) => {
       FixSizeItem,
       {
         "data-test": "fix-size-item",
-        "data-splunk-visualization-version": "27.3.0 - bd2e687fd",
+        "data-splunk-visualization-version": "27.4.0 - 92ef39d5c",
         width,
         height,
         backgroundColor
@@ -551,7 +551,7 @@ var Cover = styled_components_default.div`
     bottom: 0;
 `;
 var Blocker = styled_components_default.div.attrs({
-  "data-splunk-visualization-version": "27.3.0 - bd2e687fd"
+  "data-splunk-visualization-version": "27.4.0 - 92ef39d5c"
 })`
     position: relative;
     width: 100%;

package/Scatter.config.js

@@ -145,7 +145,7 @@ var insertLayout = (layout, index, ...layoutItems) => [
   ...layout.slice(index)
 ];
 
-// src/common/editorConfig/AxesChartDataConfig.ts
+// src/common/editorConfig/TrellisEditors.ts
 var isTrellisFeatureFlagOn = ({ featureFlags }) => {
   return Boolean(featureFlags == null ? void 0 : featureFlags.visualizations_enableTrellis);
 };
@@ -153,6 +153,252 @@ var isTrellisEnabled = ({ options, featureFlags }) => {
   const { splitByLayout = visualization_schemas_exports.LAYOUT_TYPE.Off } = options;
   return isTrellisFeatureFlagOn({ featureFlags }) && splitByLayout === visualization_schemas_exports.LAYOUT_TYPE.Trellis;
 };
+var TrellisEditorConfig = [
+  [
+    {
+      label: (0, i18n_exports._)("Trellis layout"),
+      option: "splitByLayout",
+      editor: "editor.toggle",
+      showEditor: isTrellisFeatureFlagOn
+    }
+  ],
+  [
+    {
+      label: (0, i18n_exports._)("Split by"),
+      option: "trellisSplitBy",
+      editor: "editor.trellisSplitBy",
+      editorProps: {
+        dataSourceKey: "primary"
+      },
+      showEditor: isTrellisEnabled
+    }
+  ],
+  [
+    {
+      label: (0, i18n_exports._)("Number of columns"),
+      option: "trellisColumns",
+      editor: "editor.number",
+      editorProps: {
+        min: 1
+      },
+      placeholder: (0, i18n_exports._)("Auto"),
+      showEditor: isTrellisEnabled
+    }
+  ],
+  [
+    {
+      label: (0, i18n_exports._)("Min column width"),
+      option: "trellisMinColumnWidth",
+      editor: "editor.number",
+      editorProps: {
+        min: 1
+      },
+      showEditor: isTrellisEnabled
+    },
+    {
+      label: (0, i18n_exports._)("Row height"),
+      option: "trellisRowHeight",
+      editor: "editor.number",
+      editorProps: {
+        min: 1
+      },
+      showEditor: isTrellisEnabled
+    }
+  ],
+  [
+    {
+      label: (0, i18n_exports._)("Max number of components per page"),
+      option: "trellisPageCount",
+      editor: "editor.number",
+      editorProps: {
+        min: 1
+      },
+      showEditor: isTrellisEnabled
+    }
+  ]
+];
+var TimechartTrellisEditorConfig = [
+  [
+    {
+      label: (0, i18n_exports._)("Trellis layout"),
+      option: "splitByLayout",
+      editor: "editor.toggle",
+      showEditor: isTrellisFeatureFlagOn,
+      // add help text for timecharts
+      editorProps: {
+        help: (0, i18n_exports._)(
+          "Y2-axis and overlay field configurations are not supported when trellis is enabled."
+        ),
+        helpFormat: "under"
+      }
+    }
+  ],
+  ...TrellisEditorConfig.slice(1),
+  [
+    {
+      label: (0, i18n_exports._)("Shared y-axis scale"),
+      option: "trellisSharedScale",
+      editor: "editor.checkbox",
+      showEditor: isTrellisEnabled
+    }
+  ]
+];
+var TrellisBackgroundColorEditor = {
+  label: (0, i18n_exports._)("Trellis background"),
+  option: "trellisBackgroundColor",
+  editor: "editor.color",
+  showEditor: isTrellisEnabled
+};
+
+// src/common/editorConfig/AxesChartDataDisplay.ts
+var isTrellisFeatureFlagOn2 = ({ featureFlags }) => {
+  return Boolean(featureFlags == null ? void 0 : featureFlags.visualizations_enableTrellis);
+};
+var isTrellisEnabled2 = ({ options, featureFlags }) => {
+  const { splitByLayout = visualization_schemas_exports.LAYOUT_TYPE.Off } = options;
+  return isTrellisFeatureFlagOn2({ featureFlags }) && splitByLayout === visualization_schemas_exports.LAYOUT_TYPE.Trellis;
+};
+var AxesChartDataDisplayBase = {
+  label: (0, i18n_exports._)("Data display"),
+  layout: [
+    [
+      {
+        label: (0, i18n_exports._)("Stack mode"),
+        option: "stackMode",
+        editor: "editor.select",
+        editorProps: {
+          values: [
+            { label: (0, i18n_exports._)("Not stacked"), value: "auto" },
+            { label: (0, i18n_exports._)("Stacked"), value: "stacked" },
+            { label: (0, i18n_exports._)("Stacked 100%"), value: "stacked100" }
+          ]
+        }
+      }
+    ],
+    [
+      {
+        label: (0, i18n_exports._)("Null value display"),
+        option: "nullValueDisplay",
+        editor: "editor.radioBar",
+        editorProps: {
+          values: [
+            { label: (0, i18n_exports._)("Gaps"), value: "gaps" },
+            { label: (0, i18n_exports._)("Zero"), value: "zero" },
+            { label: (0, i18n_exports._)("Connect"), value: "connect" }
+          ]
+        }
+      }
+    ],
+    [
+      {
+        label: (0, i18n_exports._)("Data value display"),
+        option: "dataValuesDisplay",
+        editor: "editor.radioBar",
+        editorProps: {
+          values: [
+            { label: (0, i18n_exports._)("Off"), value: "off" },
+            { label: (0, i18n_exports._)("All"), value: "all" },
+            { label: (0, i18n_exports._)("Min/Max"), value: "minmax" }
+          ]
+        }
+      }
+    ],
+    [
+      {
+        label: (0, i18n_exports._)("Overlay fields"),
+        option: "overlayFields",
+        editor: "editor.columnMultiSelectionByFieldNameEditor",
+        editorProps: {
+          filterByTypes: ["number"]
+        },
+        isDisabled: isTrellisEnabled2
+      }
+    ],
+    [
+      {
+        label: (0, i18n_exports._)("Split series"),
+        option: "showSplitSeries",
+        editor: "editor.toggle"
+      }
+    ],
+    [
+      {
+        label: (0, i18n_exports._)("Independent y-axis for split series"),
+        option: "showIndependentYRanges",
+        editor: "editor.checkbox",
+        showEditor: ({ options }) => options.showSplitSeries
+      }
+    ],
+    ...TimechartTrellisEditorConfig
+  ]
+};
+var AxesChartDataDisplayBar = {
+  label: AxesChartDataDisplayBase.label,
+  layout: [
+    AxesChartDataDisplayBase.layout[0],
+    // remove null value display editor at index 1
+    ...AxesChartDataDisplayBase.layout.slice(2)
+  ]
+};
+var AxesChartDataDisplayScatter = {
+  label: AxesChartDataDisplayBase.label,
+  layout: [
+    ...TrellisEditorConfig,
+    [
+      {
+        label: (0, i18n_exports._)("Shared y-axis scale"),
+        option: "trellisSharedScale",
+        editor: "editor.checkbox",
+        showEditor: isTrellisEnabled2
+      }
+    ]
+  ]
+};
+var AxesChartDataDisplayColumn = {
+  label: AxesChartDataDisplayBase.label,
+  layout: [
+    AxesChartDataDisplayBase.layout[0],
+    // remove null value display and add data value display
+    AxesChartDataDisplayBase.layout[2],
+    [
+      {
+        label: (0, i18n_exports._)("Show tooltip on hover"),
+        option: "showTooltip",
+        editor: "editor.checkbox"
+      }
+    ],
+    ...AxesChartDataDisplayBase.layout.slice(3),
+    [
+      {
+        label: (0, i18n_exports._)("Column grouping mode"),
+        option: "columnGrouping",
+        editor: "editor.radioBar",
+        editorProps: {
+          values: [
+            { label: (0, i18n_exports._)("Auto"), value: "auto" },
+            { label: (0, i18n_exports._)("Overlay"), value: "overlay" }
+          ]
+        }
+      }
+    ]
+  ]
+};
+var AxesChartDataDisplayLine = {
+  label: AxesChartDataDisplayBase.label,
+  layout: [
+    // remove stacked mode editor
+    ...AxesChartDataDisplayBase.layout.slice(1)
+  ]
+};
+
+// src/common/editorConfig/AxesChartDataConfig.ts
+var isTrellisFeatureFlagOn3 = ({ featureFlags }) => {
+  return Boolean(featureFlags == null ? void 0 : featureFlags.visualizations_enableTrellis);
+};
+var isTrellisEnabled3 = ({ options, featureFlags }) => {
+  const { splitByLayout = visualization_schemas_exports.LAYOUT_TYPE.Off } = options;
+  return isTrellisFeatureFlagOn3({ featureFlags }) && splitByLayout === visualization_schemas_exports.LAYOUT_TYPE.Trellis;
+};
 var AxesChartDataConfig = {
   label: (0, i18n_exports._)("Data configurations"),
   layout: [
@@ -207,7 +453,7 @@ var AxesChartDataConfigBar = {
         supportsDSL: true,
         expectedDataPrimitive: ["series", "frame"]
       },
-      isDisabled: isTrellisEnabled
+      isDisabled: isTrellisEnabled3
     }
   ])
 };
@@ -601,111 +847,6 @@ var background = ({
 ];
 var BackgroundColor_default = background;
 
-// src/common/editorConfig/TrellisEditors.ts
-var isTrellisFeatureFlagOn2 = ({ featureFlags }) => {
-  return Boolean(featureFlags == null ? void 0 : featureFlags.visualizations_enableTrellis);
-};
-var isTrellisEnabled2 = ({ options, featureFlags }) => {
-  const { splitByLayout = visualization_schemas_exports.LAYOUT_TYPE.Off } = options;
-  return isTrellisFeatureFlagOn2({ featureFlags }) && splitByLayout === visualization_schemas_exports.LAYOUT_TYPE.Trellis;
-};
-var TrellisEditorConfig = [
-  [
-    {
-      label: (0, i18n_exports._)("Trellis layout"),
-      option: "splitByLayout",
-      editor: "editor.toggle",
-      showEditor: isTrellisFeatureFlagOn2
-    }
-  ],
-  [
-    {
-      label: (0, i18n_exports._)("Split by"),
-      option: "trellisSplitBy",
-      editor: "editor.trellisSplitBy",
-      editorProps: {
-        dataSourceKey: "primary"
-      },
-      showEditor: isTrellisEnabled2
-    }
-  ],
-  [
-    {
-      label: (0, i18n_exports._)("Number of columns"),
-      option: "trellisColumns",
-      editor: "editor.number",
-      editorProps: {
-        min: 1
-      },
-      placeholder: (0, i18n_exports._)("Auto"),
-      showEditor: isTrellisEnabled2
-    }
-  ],
-  [
-    {
-      label: (0, i18n_exports._)("Min column width"),
-      option: "trellisMinColumnWidth",
-      editor: "editor.number",
-      editorProps: {
-        min: 1
-      },
-      showEditor: isTrellisEnabled2
-    },
-    {
-      label: (0, i18n_exports._)("Row height"),
-      option: "trellisRowHeight",
-      editor: "editor.number",
-      editorProps: {
-        min: 1
-      },
-      showEditor: isTrellisEnabled2
-    }
-  ],
-  [
-    {
-      label: (0, i18n_exports._)("Max number of components per page"),
-      option: "trellisPageCount",
-      editor: "editor.number",
-      editorProps: {
-        min: 1
-      },
-      showEditor: isTrellisEnabled2
-    }
-  ]
-];
-var TimechartTrellisEditorConfig = [
-  [
-    {
-      label: (0, i18n_exports._)("Trellis layout"),
-      option: "splitByLayout",
-      editor: "editor.toggle",
-      showEditor: isTrellisFeatureFlagOn2,
-      // add help text for timecharts
-      editorProps: {
-        help: (0, i18n_exports._)(
-          "Y2-axis and overlay field configurations are not supported when trellis is enabled."
-        ),
-        helpFormat: "under"
-      }
-    }
-  ],
-  ...TrellisEditorConfig.slice(1),
-  [
-    {
-      label: (0, i18n_exports._)("Shared y-axis scale"),
-      option: "trellisSharedScale",
-      editor: "editor.checkbox",
-      showEditor: isTrellisEnabled2
-    }
-  ]
-];
-var TrellisBackgroundColorEditor = {
-  label: (0, i18n_exports._)("Trellis background"),
-  option: "trellisBackgroundColor",
-  editor: "editor.color",
-  showEditor: isTrellisEnabled2
-};
-
 // src/common/editorConfig/AxesChartColorAndStyle.ts
 var themes = {
   defaultBackgroundColor: (props) => pick_default({
@@ -736,7 +877,7 @@ var AxesChartColorAndStyle = {
     ]
   ]
 };
-var AreaAxesChartColorAndStyleWithTrellis = __spreadProps(__spreadValues({}, AxesChartColorAndStyle), {
+var AxesChartColorAndStyleWithTrellis = __spreadProps(__spreadValues({}, AxesChartColorAndStyle), {
   layout: [
     AxesChartColorAndStyle.layout[0],
     [
@@ -749,7 +890,6 @@ var AreaAxesChartColorAndStyleWithTrellis = __spreadProps(__spreadValues({}, Axe
     ...AxesChartColorAndStyle.layout.slice(1)
   ]
 });
-var AxesChartColorAndStyle_default = AxesChartColorAndStyle;
 
 // src/common/editorConfig/AxesChartLegend.ts
 var AxesChartLegend = {
@@ -789,6 +929,54 @@ var AxesChartLegend = {
     ]
   ]
 };
+var AxesChartLegendWithTrellisAndMode = ({
+  showLegendTooltip = false,
+  hideModeWhenOff = false
+}) => ({
+  label: AxesChartLegend.label,
+  layout: [
+    [
+      {
+        label: (0, i18n_exports._)("Legend display"),
+        option: "legendDisplay",
+        editor: "editor.select",
+        editorProps: {
+          values: [
+            { label: (0, i18n_exports._)("Right"), value: "right" },
+            { label: (0, i18n_exports._)("Left"), value: "left" },
+            { label: (0, i18n_exports._)("Top"), value: "top" },
+            { label: (0, i18n_exports._)("Bottom"), value: "bottom" },
+            { label: (0, i18n_exports._)("Off"), value: "off" }
+          ],
+          tooltip: showLegendTooltip && (0, i18n_exports._)('Legend mode must be "Standard" to configure legend display')
+        },
+        isDisabled: showLegendTooltip ? ({ options }) => options.legendMode === "seriesCompare" : void 0,
+        overrideDefaultValue: ({ options }) => (options == null ? void 0 : options.splitByLayout) === "trellis" ? "off" : "right"
+      }
+    ],
+    [
+      __spreadProps(__spreadValues({}, AxesChartLegend.layout[1][0]), {
+        showEditor: ({ options }) => options.legendDisplay === "left" || options.legendDisplay === "right" || options.legendDisplay === "top" || options.legendDisplay === "bottom" || // when Trellis is on, the default value of legendDisplay is off
+        options.legendDisplay === void 0 && options.splitByLayout !== "trellis"
+      })
+    ],
+    [
+      {
+        label: (0, i18n_exports._)("Legend mode"),
+        option: "legendMode",
+        editor: "editor.radioBar",
+        editorProps: {
+          values: [
+            { label: (0, i18n_exports._)("Standard"), value: "standard" },
+            { label: (0, i18n_exports._)("Compare series"), value: "seriesCompare" }
+          ]
+        },
+        showEditor: ({ options }) => hideModeWhenOff ? options.legendDisplay === "left" || options.legendDisplay === "right" || options.legendDisplay === "top" || options.legendDisplay === "bottom" || // when Trellis is on, the default value of legendDisplay is off
+        options.legendDisplay === void 0 && options.splitByLayout !== "trellis" : true
+      }
+    ]
+  ]
+});
 var AxesChartLegend_default = AxesChartLegend;
 
 // src/common/editorConfig/AxesChartYGridAndLabels.ts
@@ -990,14 +1178,22 @@ var themes2 = {
       light: variables_default.backgroundColor(props)
     },
     prisma: variables_default.backgroundColorSidebar(props)
+  })(props),
+  defaultFontColor: (props) => pick_default({
+    enterprise: {
+      dark: variables_default.textColor(props),
+      light: variables_default.textColor(props)
+    },
+    prisma: variables_default.contentColorDefault(props)
   })(props)
 };
 var editorConfig = [
   AxesChartDataConfigScatter,
+  AxesChartDataDisplayScatter,
   {
-    label: AxesChartColorAndStyle_default.label,
+    label: AxesChartColorAndStyleWithTrellis.label,
     layout: [
-      ...AxesChartColorAndStyle_default.layout.slice(0, 2),
+      ...AxesChartColorAndStyleWithTrellis.layout.slice(0, 3),
       [
         {
           label: (0, i18n_exports._)("Series colors by category name"),
@@ -1022,7 +1218,11 @@ var editorConfig = [
       ]
     ]
   },
-  AxesChartLegend_default,
+  {
+    label: AxesChartLegend_default.label,
+    layout: [...AxesChartLegendWithTrellisAndMode({ showLegendTooltip: false }).layout.slice(0, 2)]
+    // Legendmode not required hence slice
+  },
   AxesChartXGridAndLabelsBubbleScatter,
   AxesChartYGridAndLabels_default
 ];
@@ -1054,7 +1254,7 @@ var config = {
       description: "triggered when user clicks on a point in the scatter chart"
     }
   },
-  supports: ["dynamic-options" /* DYNAMIC_OPTIONS */, "placeholder" /* PLACEHOLDER */],
+  supports: ["dynamic-options" /* DYNAMIC_OPTIONS */, "placeholder" /* PLACEHOLDER */, "trellis" /* TRELLIS */],
   themes: themes2
 };
 var config_default = enhanceConfig(config);